/* 吹き出し本体 */
div.balloon-top{
	position: relative;
	padding: 20px;
	background-color: #f5f5f5;
	color: #000;
	border-radius: 10px;
}

/* 色付きの半円 */
div.balloon-top::before{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	transform: rotate(45deg);
	left: 20px;
	top: -15px;
	border-left: 20px solid #f5f5f5;
	border-top: 20px solid #f5f5f5;
	border-right: 20px solid transparent;
	border-bottom: 20px solid transparent;
}

/* 白い半円 */
div.balloon-top::after{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	transform: rotate(45deg);
	left: 35px;
	top: -20px;
	border-left: 20px solid #ffffff;
	border-top: 20px solid #ffffff;
	border-right: 20px solid transparent;
	border-bottom: 20px solid transparent;
}


/* 吹き出し本体 - 枠線付きの吹き出し */
div.balloon{
	position: relative;
	padding: 20px;
	background-color: #fff;
	border: 1px solid #888;
	border-radius: 12px;         /* 角丸を指定 */
}

/* アイコンを左に表示 */
div.balloon::before{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: -10px;
	top: 30px;
	border-right: 10px solid #000;
	border-top: 14px solid transparent;
	border-bottom: 14px solid transparent;
}

div.balloon::after{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: -9px;
	top: 30px;
	border-right: 10px solid #fff;
	border-top: 14px solid transparent;
	border-bottom: 14px solid transparent;
}



/* 吹き出し本体 - 枠線付きの吹き出し */
div.balloon-gray{
	position: relative;
	padding: 20px;
	background-color: #f5f5f5;
	border-radius: 12px;         /* 角丸を指定 */
}


/* アイコンを左に表示 */
div.balloon-gray::before{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: -10px;
	top: 20px;
	border-right: 10px solid #f5f5f5;
	border-top: 14px solid transparent;
	border-bottom: 14px solid transparent;
}


/* 雲アイコン */

.cloud_title {
	display: inline-block;
	text-align: center;
	line-height: 36px; /* 高さと同じにすると上下中央に見える */
	vertical-align: middle;
	width:80px;
	height:54px;
}

.cloud {
display: inline-block;
	text-align: center;
	line-height: 36px; /* 高さと同じにすると上下中央に見える */
	vertical-align: middle;
	width:80px;
	height:54px;
	background-image:url(../img/e0781_1.png);
	background-size:100%;
}