.top,.bottom{
	display:flex;
	display:-webkit-flex;
}
.top_left_col{
	width:calc(100% - 200px);
}
.top_right_col{
	width:200px;
}
.right_col_item{
	background-color: #f6f6f6;
	padding:5px;
	margin-bottom:5px;
}
.right_col_item>p{
	margin:0;
}

.pic_box{/*キャラ画像*/
	padding:3px;
	text-align:center;
}
.pic_box>img{
	max-width:1000px;
	max-height:1000px;
}

/*吹き出し*/
.arrow_box{
	position:relative;
	border:1px solid var(--border_color);
	border-radius:5px 5px 5px 5px;
	padding:5px;
	margin:5px;
	background-color: var(--balloon_color);
}
.arrow_box:before{
	content:"";
	position:absolute;
	top:-11px;
	left:50%;
	width:0;
	height:0;
	margin-left:-10px;
	border-bottom:10px solid var(--border_color);
	border-left:10px solid transparent;
	border-right:10px solid transparent;
}.arrow_box:after{
	content:"";
	position:absolute;
	top:-10px;
	left:50%;
	width:0;
	height:0;
	margin-left:-10px;
	border-bottom:10px solid var(--balloon_color);
	border-left:10px solid transparent;
	border-right:10px solid transparent;
}
.user_balloon{
	width:40%;
	margin:5px;
	padding:5px;
	/* margin-left:58%; */
	position:relative;
	border:1px solid var(--border_color);
	border-radius:5px 5px 5px 5px;
	background-color: var(--balloon_color);
}
.user_balloon:before{
	content:"";
	position:absolute;
	top:calc(50% - 8px);
	width:0;
	height:0;
		padding:-5px;
	margin-left:calc(100% - 5px);
	border-top:8px solid transparent;
	border-left:8px solid var(--border_color);
	border-bottom:8px solid transparent;
}
.user_balloon:after{
	content:"";
	position:absolute;
	top:calc(50% - 8px);
	left:0;
	width:0;
	height:0;
	margin-left:calc(100% - 1px);
	border-top:8px solid transparent;
	border-left:8px solid var(--balloon_color);
	border-bottom:8px solid transparent;
}

.conversation_box{
	width:100%;
	margin:5px;
	padding:5px;
	display:flex;
	display:-webkit-flex;
	flex-wrap:wrap;
	justify-content: left;
}
.conversation_box>div>input{
	width:100%;
}