@charset "shift_jis";
/* CSS Document */

/*******************************
* 左からの吹き出し
********************************/
.left_balloon {
    position: relative;
    background: #fff;
    border: 1px solid #777;
    margin: 10px;
    padding: 10px;
    border-radius: 15px;
    margin-right: 20%;
    clear: both;
    max-width: 500px;
    float: left;
}
.left_balloon:after,
.left_balloon:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.left_balloon:after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #fff;
    border-width: 7px;
    margin-top: -7px;
}
.left_balloon:before {
    border-color: rgba(0, 0, 0, 0);
    border-right-color: #000;
    border-width: 8px;
    margin-top: -8px;
}

/*******************************
* 右からの吹き出し
********************************/
.right_balloon {
    position: relative;
    background: #85e249;
    border: 1px solid #777;
    margin: 10px;
    padding: 10px;
    border-radius: 15px;
    margin-left: 20%;
    clear: both;
    max-width: 500px;
    float: right;
}
.right_balloon:after,
.right_balloon:before {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.right_balloon:after {
    border-color: rgba(133, 226, 73, 0);
    border-left-color: #85e249;
    border-width: 7px;
    margin-top: -7px;
}
.right_balloon:before {
    border-color: rgba(119, 119, 119, 0);
    border-left-color: #777;
    border-width: 8px;
    margin-top: -8px;
}

/*******************************
* 割り込みを解除
********************************/
.clear_balloon{
  clear: both;
}




















.question_box,
.answer_box{
	width:80%;
}

.question_box{
	float: right;
	text-align: left;
}
.answer_box{float: left;}


img.left-image,
img.right_image{
	width:15%;
	margin-right: 10px;
	overflow: hidden;
}

img.left-image{float: left;}
img.right_image{float: right;}


p.name02,
p.name{
	font-size: 14px;

	margin:0;
}

p.name02{text-align: right;}



#arrow_answer,
#arrow_question {
	position: relative;
	display: inline-block;
	padding: 3%;
	width: 88%;
	font-size: 13px;
	margin-left:3%;
	margin-top: 3px;
	margin-bottom: 25px;
	color: #000;
	border-radius: 10px;
}

#arrow_question {
	background: #fff;
}

#arrow_answer {
	background: #85e249;
	text-align: left;
}

#arrow_answer:before,
#arrow_question:before {
	content: "";
	position: absolute;
	top: 0px;
	margin-left: 0;
	display: block;
	width: 30px;
	height: 30px;
	z-index: -1;
}

#arrow_question:before {
	left: -10px;
	background: #fff;
	border-radius: 0px 30px;
}

#arrow_answer:before{
	right: -10px;
	background: #85e249;
	border-radius: 30px 0;
}


#arrow_answer:after,
#arrow_question:after {
	content: "";
	position: absolute;
	top: -10px;
	margin-left: 0px;
	display: block;
	width: 25px;
	height: 25px;
	z-index: -1;
	background-attachment: scroll;
	background-color: #E1FFE1;
	background-image: none;
	background-repeat: repeat;
	background-position: 0% 0%;
}

#arrow_question:after {
	left: -12px;
	transform: rotate(10deg);
	border-radius: 0px 30px;
}

#arrow_answer:after {
	right: -12px;
	border-radius: 30px 0px;
	transform: rotate(10deg);
}