@charset "utf-8";

#chat-field{
    transition: bottom .2s;
    color: #424242;
    max-height: calc(100% - 30px);
    max-height: calc(100vh - 30px);
    z-index: 100001;
    box-sizing: border-box;
    --zoom: 1.0;
    max-height: 100%;
    max-height: 100vh;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 10px 0px 0px 0px / 10px 0px 0px 0px;
    border: 1px solid #ccc;
    background: 0 0;
    background: white;
	opacity: 0.95;
	display:none;
}
#chat-field p.chat-head{
	clear: both;
    padding: 5px 10px;
    border-radius: 10px 0px 0px 0px / 10px 0px 0px 0px;
    background: #fff;
	/* background: #96BF4E; */
	background: #777;
	color:white;
	margin-top: 0rem;
}
#chat-ul{
	padding: 10px;
	padding-bottom: 70px;
}
#input-field{
	padding: 10px;
}
@media screen and (min-width:601px){
	#chat-field{
		width: 370px;
	    max-width: 90%;
	    /* max-height: 70%; */
		position: fixed;
	    /*top: auto;*/
	    right: 3px;
	    bottom: 3px;
		/* overflow: scroll; */
	}
	.line-bc, #field {
		padding: 10px;
		max-width: 450px;
		margin: 15px auto;
		text-align: right;
		font-size: 13px;
		/* background: #7da4cd; */
		/* background: #f0fcdc; */
		/* background:white; */
		  margin: 0px;
		  max-height:70vh;
		  overflow-y: scroll;
	  }	  
	/* #minus{
		position:relative;
		top:7.5px;
		right:7.5px;
	} */
	#minus i{
		font-size:15px;
		padding-right:5px;
		color:white;
	}
}
@media screen and (max-width:600px){
	#chat-field{
		width: 100%;
	    /*max-height: 70%;*/
		/*max-width: 100%;*/
		height:100%;
		position: fixed;
	    /*top: auto;*/
	    right: 0px;
	    bottom: 0px;
	}
	.line-bc, #field {
		padding: 10px;
		max-width: 450px;
		margin: 15px auto;
		text-align: right;
		font-size: 13px;
		/* background: #7da4cd; */
		/* background: #f0fcdc; */
		/* background:white; */
		  margin: 0px;
		  height:100%;
		  overflow-y: scroll;
	  }
	  #minus{
		position:fixed;
		top:7.5px;
		right:7.5px;
	}
	#minus i{
		font-size:25px;
		color:white;
	}
}
/*  ========================================= */
/*以下、①背景色など*/
#field::-webkit-scrollbar {
  display: none;
}
/*以下、②左側のコメント*/
.balloon6, .left {
  width: 100%;
  margin: 10px 0;
  overflow: hidden;
}
.balloon6 .chatting, .left {
  width: 100%;
  text-align: left;
}
.says {
  display: inline-block;
  position: relative;
  margin: 0 0 0 10px;
  padding: 10px;
  max-width: 270px;
  border-radius: 12px;
  /* background: #c3e685; */
  background: #eee;
}
.says p, .chat-left {
  margin: 0;
  padding: 0;
  padding: 10px;
  margin-left: 1em;
  color:#555;
  font-size: 14px;
  font-weight:500;
  line-height:1.4em;
}
/*以下、③右側の緑コメント*/
.mycomment, .right {
  margin: 10px 0;
}
.mycomment p, .chat-right {
  display: inline-block;
  position: relative; 
  margin: 0 10px 0 0;
  padding: 10px;
  max-width: 270px; 
  border-radius: 12px;
  background: #b4a110;
  color: white;
  font-size: 13px;  font-size: 13px;
  line-height:1.4em;
}

.chat-left p {
    text-align: center;
    padding: 10px 10px 10px 10px;
    font-size: 13px;
    cursor: pointer;
    line-height: 1.4em;
    background-color: rgba(255,255,255,1);
    color: #000000;
	border-bottom:1px solid #999;
	width:100%;
}
.chat-left p:last-child {
	border:none;
}
.chat-field a{
	text-decoration:underline;
}
#choice p{
	/* background: #c3e685; */
	background: #eec;
	color:#555;
  font-weight:500;
  line-height:1.4em;
}
.choiced{
	background:#94eba4;
}


#chatBtn2{
	position:fixed;
	bottom:235px;
	right:0px;
	font-size:14px;
	border:none;
	padding:0px;
	z-index: 4;
}
#chatBtn2 img{width:190px;opacity: 0.9;}
#chatBtn{
	position:fixed;
	bottom:20px;
	right:0px;
	font-size:14px;
	border:none;
	padding:0px;
	z-index: 4;
}
#chatBtn img{width:190px;opacity: 0.9;}

@media screen and (max-width:600px){
	#chatBtn2{
		position:fixed;
		bottom:135px;
		right:0px;
		font-size:14px;
		border:none;
		padding:0px;
	}
	#chatBtn2 img{width:100px;opacity: 0.9;}
	#chatBtn img{width:100px;opacity: 0.9;}
}
/* .batsu{
	position: absolute;
	top:7px;
	right:7px;
} */

form#zaikoForm{width:100%;}
form#zaikoForm input {width:100%;}
.submitBtn{width:auto;padding:3px 15px;;margin-top:1em;}

ul, ol, li, dl, dt, dd, form, figure, form {
    margin: 0px;
    padding: 0px;
    font-size: 100%;
    font-weight: normal;
    list-style-type: none;
}
input[type=submit] {
    background-color: #96BF4E;
}