@charset "utf-8";
/* CSS Document */
body{
	margin:0px;
	min-height:100%;
}
#main{
	width:1000px;
	margin:auto;
	padding:10px 10px;
	border-left:solid 2px #0022ee;
	border-right:solid 2px #0022ee;
	min-height:100%;
}
#block_header{
	border-bottom: solid 2px #0022ee;
	padding-bottom:5px;
	margin-bottom:10px;
}
#block_header #block_logo{
	width:200px;
	float:left;
}
#block_header  #header_bread{
	float:left;
	color:#0022ee;
	margin-top:10px;
}
#header_bread a{
	text-decoration:none;
}
#block_footer{
	margin-top:10px;
}
#block_footer .link{
	float:left;
	margin-left:10px;
	font-size:12px;
}
#block_footer .message{
	float:left;
	color:#0022ee;
	font-size:10px;
	margin-top:5px;
	margin-left:10px;
}
#block_chat{
	margin:0;
	padding:0 10px;
}
#block_chat li{
	list-style:none;
	margin:10px;
}
#block_chat_wrapper{
	padding-bottom:50px;
}

/* 吹き出し本体 - 枠線付きの吹き出し */
.phrase{
  max-width:90%;
  position: relative;
  padding: 10px;
  border-radius: 10px;         /* 角丸を指定 */
}
.phrase_chat{
	float:left;
	  background-color:#EEE;
	  border: 2px solid #D2D2D2;
}
.phrase_user{
	float:right;
	  background-color: #C8E3FF;
	  border: 2px solid #399CFF;
}
/* 三角アイコン - 枠線付きの吹き出し */
.phrase_chat::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -15px;
  top: 8px;
  border-right: 15px solid #D2D2D2;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.phrase_chat::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -12px;
  top: 8px;
  border-right: 15px solid #EEE;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

.phrase_user::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  right: -15px;
  top: 8px;
  border-left: 15px solid #399CFF;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.phrase_user::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  right: -12px;
  top: 8px;
  border-left: 15px solid #C8E3FF;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.item_question{
	border:solid 1px #CCC;
	padding:10px;
	cursor:pointer;
}
.block_yes_no{
	background-color:#CCC;
	padding-left:10px;
	margin-top:10px;
	display:inline-block !important;
}
.block_yes_no .message{
	float:left;
	margin-bottom:0px;
	margin-top:10px;
}
.block_yes_no_inner{
	float:left;
	margin-left:20px;
	margin-top:0px;
	margin-bottom:5px;
}
.yes_no_message{
	margin-bottom:5px;
	margin-right:5px;
}
.btn_yes{
	border:solid 1px #ff704e;
	/*padding:5px;*/
	background-color:#ff704e;
	width:5em;
	float:left;
	cursor:pointer;
	margin: 5px 10px 0px 0px;
	text-align:center;
	color:white;
}
.btn_no{
	border:solid 1px #4e70ff;
	/*padding:5px;*/
	background-color:#4e70ff;
	width:5em;
	float:left;
	cursor:pointer;
	margin:5px 10px 0px 0px;
	text-align:center;
	color:white;
}
.return_item{
	border:solid thin #999;
	padding:5px;
	cursor:pointer;
	margin-top:5px;
	color:blue;
}

#block_question{
	height:30px;
	border:1px solid #0022ee;
	background:#0022ee;
}
#question{
	width:85%;
	float:left;
	outline:0;
	margin:0px;
	height:30px;
	box-sizing:border-box;
	background-color:white;
	border:none;
	border-right: 1px #0022ee solid;
	padding-left:10px;
}
#btn_send{
	width:15%;
	height:30px;
	float:left;
	background:#0022ee;
	border:none;
	color:white;
	font-weight:bold;
	font-size:16px;
	outline:0;
}

.question_strong{
	font-size:20px;
	font-weight:bold;
}
#block_question_wrapper{
	position:fixed;
	bottom:0;
	width:1000px;
	background-color:white;
	padding-bottom:10px;
	/*border-left:solid 2px #0022ee;
	border-right:solid 2px #0022ee;*/
	
}
#block_question{
	position:relative;
}
#list_question{
	position:absolute;
	bottom:10px;
	background-color:white;
	border:solid 1px #CCC;
	padding:0px;
	
}
#list_question li{
	list-style:none;
	cursor:pointer;
	margin:0;
	padding-left:10px;
}
#list_question li:hover{
	background-color:#CCC;
}

@media screen and (max-width: 1000px) {
	#main{
		width:95%;
		margin:5px auto 5px auto;
		border:none;
	}
	#block_question_wrapper{
		width:95%;
		padding:0;
		padding-top:5px;
		
	}
	#btn_send{
		width:20%;
	}
	#question{
		width:80%;
	}
	#block_chat_wrapper{
		padding-bottom:70px;
	}
}
	
/*-------------------------------
	clearFix
-----------------------------------*/
.clearFix:after {  
  content: ".";   
  display: block;   
  height: 0;   
  clear: both;   
  visibility: hidden;  
}  
  
.clearFix { display: inline-table; }  
  
/* Hides from IE-mac \*/  
* html .clearFix { height: 1%; }  
.clearFix { display: block; }  
/* End hide from IE-mac */