@charset "utf-8";
/*
css name: dialogue
for template: post_type
Author: wp.theme.builder.01
*/
/* ---------- 吹き出し会話 ---------- */
.single .entry-header-wrap.content-body-false + .entry-content-wrap .dialogue-container	{
	margin-top: 1em;
}
.dialogue-container	{
	padding: 1em;
	margin-bottom: 1em;
	background-color: #95b0df;/* LINE風 */
	background-color: #EEE;/* グレー */
	background-color: #0693e3;/* 青 */
	background-color: #bef;/* 水色 */
}
.dialogue	{
	display: flex;
	align-items: flex-start;
}
.dialogue + .dialogue	{
	margin-top: 1em;
}
.dialogue.position-right	{
	flex-direction: row-reverse;
}
.dialogue.position-left .dialogue-icon	{
	margin-right: 1em;
}
.dialogue.position-right .dialogue-icon	{
	margin-left: 1em;
}
.dialogue-icon	{
	flex-shrink: 0;
	width: 4em;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	background-color: #FFF;
	border-radius: 100%;
}
.dialogue-icon:after	{
	content: '';
	display: block;
	padding-top: 100%;
}
/* ---------- スタンプ ---------- */
.dialogue-child.dialogue-stamp	{
	padding-top: 1em;
}
.dialogue-child.dialogue-stamp img	{
	max-width: 8em;
}
/* ---------- 吹き出し ---------- */
.dialogue-baloon-right, .dialogue-baloon-left	{
	padding: 0.5em 1em;
	margin-top: 1em;
	position: relative;
	background-color: #f2f2f2;/* 背景色 */
	border: 2px solid #FFF;/* 枠線太さ、色 */
	border-radius: 0.5em;/* 枠線アール */
}
.dialogue-baloon-right:before, .dialogue-baloon-right:after, .dialogue-baloon-left:before, .dialogue-baloon-left:after	{
	content: '';
	position: absolute;
	top: 1em;
}
/* ---------- 吹き出し：右 ---------- */
.dialogue-baloon-right	{
	margin-right: 1.5em;
}
.dialogue-baloon-right:before, .dialogue-baloon-right:after	{
	top: 1em;
	right: -1.5em;
	border-bottom: 1em solid transparent;
	border-left: 1.5em solid #FFF;/* 枠線色 */
}
.dialogue-baloon-right:after	{
	top: calc( 1em + 2px );/* 枠線太さ */
	right: calc( 7px - 1.5em );/* 枠線太さ */
	border-left: solid 1.5em #f2f2f2;/* 背景色 */
}
/* ---------- 吹き出し：左 ---------- */
.dialogue-baloon-left	{
	margin-left: 1.5em;
}
.dialogue-baloon-left:before, .dialogue-baloon-left:after	{
	top: 1em;
	left: -1.5em;
	border-right: 1.5em solid #FFF;/* 枠線色 */
	border-bottom: 1em solid transparent;
}
.dialogue-baloon-left:after	{
	top: calc( 1em + 2px );/* 枠線太さ */
	left: calc( 7px - 1.5em );/* 枠線太さ */
	border-right: solid 1.5em #f2f2f2;/* 背景色 */
}
/* ---------- セリフ着色 ---------- */
/* 緑 */
.dialogue-text.color-green	{
	background-color: #85E249;/* 背景色 */
}
.dialogue-baloon-right.color-green:after	{
	border-left: solid 1.5em #85E249;/* 背景色 */
}
.dialogue-baloon-left.color-green:after	{
	border-right: 1.5em solid #85E249;/* 背景色 */
}
/* CSS 薄いピンク */
.dialogue-text.color-css	{
	background-color: #FFC0C0;/* 背景色 */
}
.dialogue-baloon-right.color-css:after	{
	border-left: 1.5em solid #FFC0C0;/* 矢印背景色 */
}
.dialogue-baloon-left.color-css:after	{
	border-right: 1.5em solid #FFC0C0;/* 矢印背景色 */
}
/* ---------- 顔画像 ---------- */
.icon-default	{
	background-image: url( ../images/dialogue/icon-default.png );
}
.icon-1	{
	background-image: url( ../images/dialogue/icon-1.png );
}
.icon-2	{
	background-image: url( ../images/dialogue/icon-2.png );
}
.icon-3	{
	background-image: url( ../images/dialogue/icon-3.png );
}
.icon-4	{
	background-image: url( ../images/dialogue/icon-4.png );
}
.icon-5	{
	background-image: url( ../images/dialogue/icon-5.png );
}
/* ---------- カスタムクラス ---------- */
.dialogue.red .dialogue-text	{
	color: #FFF;
	background-color: #F00;
}
.dialogue.red .dialogue-baloon-right:after	{
	border-left: 1.5em solid #F00;/* 背景色 */
}
.dialogue.red .dialogue-baloon-left:after	{
	border-right: 1.5em solid #F00;/* 背景色 */
}
.dialogue.black .dialogue-text	{
	color: #FFF;
	background-color: #000;
}
.dialogue.black .dialogue-baloon-right:after	{
	border-left: 1.5em solid #000;/* 背景色 */
}
.dialogue.black .dialogue-baloon-left:after	{
	border-right: 1.5em solid #000;/* 背景色 */
}
/* ---------- //吹き出し会話 ---------- */