@charset "utf-8";
/*
* css for usChat Form (UCH27) 
*
* @version			0.2.8.0h
* @lastmodified 2025-04-14
* @link					https://www.landcomp.co.jp/
* @copyright		Copyright 2005, LAND COMPUTER Co.,Ltd.All rights reserved.
*------------------------------------------------------------------------- */

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* user mode */
#ucHeader #uBttn {
	display: inline-block;
	float: right;
}
#ucHeader #uBttn button {
	float: none;
}
#ucHeader #bMin {
	display: inline-block;
	float: right;
  height: 28px;
  width: 28px;
	padding: 0;
  margin: 0 0 0 auto;
  border-style: none;
  background-color: transparent;
	background-repeat: no-repeat;
	background-position: 0 0;
  background-size: cover;
	vertical-align: middle;
}
#ucHeader #bMin {
  background-image: url("../../../../uch280/images/min_btn.png");
}
#ucHeader #bMin:hover {
  background-image: url("../../../../uch280/images/min_btn_ov.png");
}
#ucHeader #bMin:disabled:hover {
  background-image: url("../../../../uch280/images/min_btn.png");
}
#ucHeader:not(.inchat) #bEnd  {
	display: none;
}
#ucHeader.inchat #bEnd {
	display: inline;
}

#ucWrapper.on #ucAltBox {
	/* min-height: 60px; */
}

#ucCtrlBox {
	padding: 0.25rem 0 0;
	text-align: center;
}
#ucCtrlBox button {
	margin: 0 0.5rem;
	border-radius: 6px;
	padding: 2px 0.75rem;
}
#ucCtrlBox button:disabled {
	cursor: not-allowed;	
}

/* inner box use mode */
#ucRequestBox #bRequest {
  height: 2.5rem;
	border-radius: 4px;
	-webkit-appearance: none;
}
#ucInnerBox #ucAltBox #ucRequestBox ,
#ucInnerBox[class=""] #ucAltBox #ucRequestBox ,
#ucInnerBox:not([class]) #ucAltBox #ucRequestBox ,
#ucInnerBox:not(.chatend) #ucAltBox #ucRequestBox ,
#ucInnerBox:not(.chatend) #ucAltBox #ucEndBox {
	display: none;
}
#ucInnerBox.request #ucAltBox #ucTextBox ,
#ucInnerBox.waiting #ucAltBox #ucTextBox ,
#ucInnerBox.waiting #ucAltBox #ucEndBox {
	display: none;
}
#ucInnerBox.request #ucAltBox #ucRequestBox ,
#ucInnerBox.waiting #ucAltBox #ucRequestBox ,
#ucInnerBox.chatend #ucAltBox #ucEndBox {
	display: block;
}

#ucInnerBox.request #ucAltBox #bRequest ,
#ucInnerBox.chatend #ucAltBox #bRequest {
  color: #fff;
  font-weight: bold;
  width: 100%;
  border: none;
  border: 1px solid #333;
  background-color: #70AD47;
	background-color: #3cb371;
	background-color: #68be8d;
}
#ucInnerBox.waiting #ucAltBox #bRequest {
  cursor: wait;
  color: #333;
  width: 100%;
  pointer-events: none;
  border: 1px solid #333;
  background-color: #ddd;
  background-color: #EDEDED;
	background-color: #89c997;
	background-color: #a4d5bd;
	background-color: #ededed;
}
#ucInnerBox.chatend #ucAltBox #ucEndBox p {
  height: 3.25rem;
	text-align: center;
	padding-top: 1rem;
}
#ucInnerBox.request #ucAltBox #bRequest::before {
	content: 'チャットで問い合わせる';
}
#ucInnerBox.waiting #ucAltBox #bRequest::before {
	content: 'チャットをリクエスト中';
}
#ucInnerBox.chatend #ucAltBox #bRequest::before {
	content: '再び、問い合わせる';
}
#ucInnerBox.chatend #ucAltBox #ucEndBox p::before {
	content: 'お問い合わせいただきありがとうございました。';
}
#ucInnerBox.waiting #ucAltBox #ucRequestBox {
	cursor: wait;
}
#ucInnerBox #ucAltBox #ucRequestBox:hover {
	opacity: 0.8;
}

/* info box */
#ucInnerBox.on + #ucInfoBox ,
#ucInnerBox.request + #ucInfoBox {
	color: #333;
}
#ucInnerBox.waiting + #ucInfoBox {
  color: #0075c2;
}
#ucInnerBox.chatend + #ucInfoBox {
	color: crimson;
}
#ucInnerBox + #ucInfoBox.caution {
	color: crimson;
}
#ucInnerBox.overtime #ucMsgBox {
	height: 12rem;
	background-color: #f0f0f0;
}

/* laed */
#uLead {
	height: 1.5rem;
}
#uLead #uLogo {
  display: inline-block;
	float: left;
  width: 24px;
  height: 24px;
	margin: 0 0.5rem 0 0;;
	background-position: 0 0;
	background-repeat: no-repeat;
}
#uLead #uLogo {
  background-image: url("../../../images/message_disable.png");
}
#uLead.on #uLogo {
  background-image: url("../../../images/message.png");
}
#uLead #uTitle {
	display: inline-block;
	padding: 2px 0 0;
}
#uLead #uTitle::before ,
#uLead[class=""] #uTitle::before ,
#uLead:not([class]) #uTitle::before {
	content: "ただ今問い合わせチャットの時間外です。";
}
#uLead.on #uTitle::before {
	content: "ご質問に担当がチャットでお答えします。";
}
input[type=button]:disabled {
	cursor: not-allowed;	
}

/* open close icon */
#ucIcon {
	color: #fff;
	display: inline-block;
	font-size: 0.825rem;
	padding: 0.5rem 0.75rem;
  position: fixed;
  bottom: 0.75rem;
	right: 0.5rem;
  z-index: 1010;
	border-radius: 0.9375rem;
	border: 1px solid #fff;
	background-color: #f4b3c2;
}
#ucIcon::before {
	content: 'チャットで質問';
}
#ucIcon:hover {
	opacity: 0.75;
}
#ucIcon[class=""] ,
#ucIcon:not([class]) {
	background-color: #f4b3c2;
}
#ucIcon.on {
	background-color: #e95295;
}
@media all and (min-width :480px) {
	#ucIcon {
		bottom: 1rem;
		right: 1rem;
	}
}
#cautionBox {
  color: deeppink;
	__display: none;
	height: auto;
  min-height: 0;
}
