@charset 'utf-8';
/*
 * name:request.css
 * author:Sovanda
*/

/* request
------------------------------------------------ */
#request { margin-bottom: 80px; }
.request--visual img { display: block; width: 100%; }
.request--desc { text-align: center; }
.request--desc dt { font-size: 24px; font-size: 2.4rem; font-weight: bold; letter-spacing: 0.04em; line-height: 1.2; color: #011e41; margin-bottom: 40px; }
.request--desc dt:after { content: ''; display: block; margin: 28px auto 0; width: 40px; height: 2px; background: #272727; }
.request--desc dd { position: relative; max-width: 830px; margin: 0 auto; font-size: 16px; font-size: 1.6rem; letter-spacing: 0.024em; line-height: 1.875; margin-bottom: 80px; }
.request--desc dd a{ display: table; margin: 0 auto; color: #090707; border-bottom: 1px solid #090707; letter-spacing: 0.1em; line-height: calc(30 / 16); }
.request--desc dd a:hover{ border-bottom-color: transparent; }
.request__form {  position: relative; display: block; max-width: 960px; margin: 110px auto 0; }
.request__form input[type=text],
.request__form input[type=email],
.request__form input[type=number],
.request__form input[type=reset],
.request__form input[type=date],
.request__form input[type=submit],
.request__form input[type=tel],
.request__form textarea,
.request__form select {
	-webkit-appearance: none;
	appearance: none;
	background: none;
	border: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
	-o-border-radius: 0;
	border-radius: 0;
}
.request__form input[type=text],
.request__form input[type=tel],
.request__form input[type=number],
.request__form input[type=date],
.request__form input[type=email],
.request__form textarea,
.request__form select {
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo', 'メイリオ', 'ＭＳ Ｐゴシック', 'MS P Gothic', Osaka, Arial, Helvetica, Verdana, sans-serif;
	padding: 5px 10px;
    height: 40px;
    width: 100%;
    font-size: 1.6rem;
    box-sizing: border-box;
    border: 1px solid #cecece;
}
.request__form textarea { width: 100%; height: 200px; box-sizing: border-box; -webkit-box-sizing: border-box; resize: none; }
.request__form select { width: 195px; background: url(../../img/contact/select_arrow.png) no-repeat right center #fff; background-size: auto 100%; vertical-align: middle; }
.request__form select::-ms-expand { display: none; }
.request__form input.bookingdate{ background: url(../../img/share/2025/calender.png) no-repeat calc(100% - 6px) center / 20px auto; }

.form__table { display: table; width: 100%; border-collapse: collapse; }
.form__table tr th,
.form__table tr td { font-size: 16px; font-size: 1.6rem; line-height: 1.48; text-align: left; vertical-align: top; padding: 30px 25px; border: 1px solid #011e41; }
.form__table tr th { color: #fff; background: #011e41; width: 210px; border: 1px solid #011e41; border-bottom: 1px solid #fff; }
.form__table tr:last-child th { border-bottom: 1px solid #011e41; }
.form__table__code dt,
.form__table__code dd { display: inline-block; vertical-align: middle; }
.form__table__code dt { font-size: 24px; font-size: 2.4rem; line-height: 1; margin-right: 10px; }
.form__table__code dd { max-width: 380px; }
.form__table ul.boxs { display: flex; flex-wrap: wrap; max-width: 340px; }
.form__table ul.boxs li { position: relative; width: calc( 50% - 10px ); display: inline-block; vertical-align: middle; }
.form__table ul.boxs li:not(:last-child) { padding-right: 20px; }
/* .form__table ul.boxs li:not(:last-child):after { content: ''; width: 12px; height: 3px; font-size: 40px; font-size: 4rem; background: #000; display: inline-block; position: absolute; right: 14px; top: 19px; } */
.form__table .boxs--tel{ display: flex; flex-wrap: wrap; max-width: 340px; }
.form__table .boxs--tel li{ position: relative; width: calc(33.33% - 14px); }
.form__table .boxs--tel li:not(:last-child) { padding-right: 20px; }
.form__table .boxs--tel li:not(:last-child):after { content: ''; width: 7px; height: 2px; font-size: 40px; font-size: 4rem; background: #000; display: inline-block; position: absolute; right: 7px; top: 19px; }
.form__table ul.boxs.box-postcode li:not(:last-child):after { content: ''; width: 7px; height: 2px; font-size: 40px; font-size: 4rem; background: #000; display: inline-block; position: absolute; right: 7px; top: 19px; }

.request__form .form__table--submit { text-align: center; margin-top: 45px; }
.request__form .form__table--submit input { cursor: pointer; width: 320px; margin: 0 auto; display: block; height: 60px; font-size: 1.8rem; font-weight: 600; letter-spacing: .038em; line-height: 1; text-align: center; color: #fff; background-color: #011e41; border: none; border-radius: 0; }

.request__form .form__status-waiting{ cursor: pointer; width: 320px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; line-height: 60px; font-size: 1.8rem; font-weight: 600; letter-spacing: .038em; text-align: center; color: #fff; background-color: #011e41; border: none; border-radius: 0; }
.request__form .form__status-waiting.off{ display: none; }
.request__form .form__status-waiting .dot-flashing{ position: relative;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #fff;
	color: #fff;
	margin: 0 0 0 20px;
	animation: dot-flashing 1s infinite linear alternate;
	animation-delay: 0.5s; 
}
.dot-flashing::before, .dot-flashing::after {
	content: "";
	position: absolute;
	top: 0;
  }
  .dot-flashing::before {
	left: -15px;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #fff;
	color: #fff;
	animation: dot-flashing 1s infinite alternate;
	animation-delay: 0s;
  }
  .dot-flashing::after {
	left: 15px;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #fff;
	color: #fff;
	animation: dot-flashing 1s infinite alternate;
	animation-delay: 1s;
  }
  
  @keyframes dot-flashing {
	0% {
	  background-color: #fff;
	}
	50%, 100% {
	  background-color: rgba(255, 255, 255, 0.2);
	}
  }
.form__table--radio > span { display: block; margin: 0; padding: 0; }
.form__table--radio > span:not(:last-child) { margin-bottom: 20px; }
.form__table--radio > span input[type=radio],
.choice-catalog > span input[type=radio]{ position: relative; width: 22px; height: 22px; background: none; -webkit-border-radius: 50%; border-radius: 50%; border: 2px solid #CECECE; -webkit-appearance: none; outline: none; appearance: none; display: inline-block; vertical-align: -5px; margin-right: 4px; }
.form__table--radio > span input[type=radio]:after,
.choice-catalog > span input[type=radio]:after{ display: inline-block; position: absolute; left: 4px; top: calc(50% - 5px); content: ''; width: 10px; height: 10px; background-color:#fff; border-radius: 50%; }
.form__table--radio > span input[type=radio]:checked:after,
.choice-catalog > span input[type=radio]:checked:after{ background-color: #3B4043; }
.choice-catalog .wpcf7-list-item.first{ margin-left: 0; }

div.wpcf7-validation-errors, 
div.wpcf7-acceptance-missing,
div.wpcf7-response-output { text-align: center; }

#instagram { padding: 0; }

.form--recaptcha { display: block; max-width: 304px; margin: 40px auto 0; }

/* responsive style 
------------------------------------------------ */
.request__form .max-height-120{ max-height: 120px; }
@media screen and (min-width: 769px) {
	.request__form .input-size-xs{ max-width: 140px; }
	.request__form .input-size-s{ max-width: 180px; }
	.request__form .input-size-m{ max-width: 312px; }
	.request__form .input-size-l{ max-width: 430px; }
	.request__form .max-height-104{ max-height: 104px; }
	.request__form .max-width-312{ max-width: 312px !important; }
}
@media screen and (max-width: 768px) {
	#request { margin-bottom: 50px; }
	.request--desc dt { font-size: 17px; font-size: 1.7rem; margin-bottom: 20px; }
	.request--desc dt:after { margin: 28px auto 0; width: 30px; height: 1px; }
	.request--desc dd { font-size: 13px; font-size: 1.3rem; line-height: 1.5; margin-bottom: 40px; }
	.request__form { margin-top: 65px; }	
	.request__form input[type=text],
	.request__form input[type=tel],
	.request__form input[type=number],
	.request__form input[type=date],
	.request__form input[type=email],
	.request__form textarea,
	.request__form select {
		height: 40px;
		padding: 5px 10px;
		font-size: 1.4rem;
		-webkit-border-radius: 0;
		border-radius: 0;
	}
	.request__form textarea { height: 150px; }
	.form__table { border: 1px solid #011e41; -webkit-box-sizing: border-box; box-sizing: border-box; }
	.form__table tr th,
	.form__table tr td { display: block; width: 100%; font-size: 14px; font-size: 1.4rem; vertical-align: middle; padding: 20px 20px; border: none; -webkit-box-sizing: border-box; box-sizing: border-box; }
	.form__table tr th { width: 100%; padding: 15px 20px 12px; border: none; }
	.form__table__code dt { font-size: 20px; font-size: 2rem; line-height: 1; margin-right: 10px; }
	.form__table ul.boxs li { width: calc( 50% - 10px ); }
	.form__table ul.boxs li:not(:last-child) { padding-right: 20px; }
	.request__form .form__table--submit { margin-top: 25px; }
	.request__form .form__table--submit input { font-size: 16px; font-size: 1.6rem; height: 50px; width: 280px; }
	.request__form .form__status-waiting{ font-size: 16px; font-size: 1.6rem; width: 280px; line-height: 50px; }
	.form__table--radio > span:not(:last-child) { margin-bottom: 15px; }
	.form__table--radio > span input[type=radio] { width: 18px; height: 18px; border: 1px solid #CECECE; vertical-align: -4px; margin-right: 4px; }
	.form__table--radio > span input[type=radio]:after{ left: 4px; top: calc(50% - 4px); content: ''; width: 8px; height: 8px; }
	.form--recaptcha { max-width: 280px; }
	.form--recaptcha .wpcf7-recaptcha { transform: scale(0.93); -webkit-transform: scale(0.93); transform-origin: 0 0; -webkit-transform-origin: 0 0; margin-top: 25px; }
}

@media screen and (max-width: 568px) {
	.form__table__code dd { max-width: calc( 100% - 40px ); }
}

/* Online Consultation 
----------------------------------*/
.onlineform__block.request__form{ margin-top: 65px; max-width: 820px; }
.onlineform__block td{ color:#011E41; }
.onlineform__block .wpcf7-list-item-label{ font-weight: bold; }
.onlineform__block.request__form .form__table--submit input{ max-width: 100%; width: 380px; border-radius: 6px; }
.onlineform__block .mt-1{ margin-top: 1em; }
.onlineform__block .mt-2{ margin-top: 1.5em; }
.onlineform--desc{ max-width: 537px; margin: 0 auto; }
.onlineform--title{ margin-bottom: 83px; font-size: 3rem; font-weight: bold; text-align: center; letter-spacing: 0.08em; line-height: calc(44/30); color:#011E41; }
.onlineform--txt{ font-size: 1.6rem; font-weight: 400; letter-spacing: 0.05em; line-height: calc(36/18); color:#011E41; }
.onlineform--txt+.onlineform--txt{ margin-top: 40px; }
.booking-lists{ margin-top: 22px; }
.booking-lists > li{ display: flex; flex-wrap: wrap; align-items: flex-start; }
.booking-lists > li+li{ margin-top: 38px; }
.booking-lists__label--date{ margin-top: 0.4em; font-weight: bold; }
.booking-lists__label--day{ margin-left: 15px; margin-top: 0.4em; font-weight: bold; }
.booking-lists__input--date{ margin-left: 21px; width: calc(146/603 * 100%); }
.booking-lists__select--day{ margin-left: 32px; width: calc(146/603 * 100%); }
.booking-lists__select--day select{ width: 100% !important; }
.booking-lists02{ display: flex; flex-wrap: wrap; align-items: center; }
.booking-lists02 li+li{ margin-left: 15px; font-weight: bold; }
.booking__input--block{ display: flex; flex-wrap: wrap; align-items: flex-start; }
.booking__input--block+.booking__input--block{ margin-top: 38px; }
.booking__input--block dt{ padding-top: 8px; width: 118px; font-weight: bold; }
.booking__input--block dd{ width: calc(100% - 118px); max-width: 312px;  }
.red-txt{ color: #CE1017 !important; }
.bookingdate{ visibility: hidden; }
@media screen and (min-width: 769px) {
	.onlineform__block .form__table tr th, 
	.onlineform__block .form__table tr td{ padding: 14px 14px; }
	.onlineform__block .form__table tr th{ width: 158px !important; }
	.onlineform__block .choice-catalog span.wpcf7-list-item:not(.first){ margin-left: 45px; }
	.onlineform__block .form__table--radio > span:not(:last-child){ margin-bottom: 13px; }
	.onlineform__block .form__table__code dt{ font-size: 1.6rem; }
	.onlineform__block .form--recaptcha{ margin-top: 65px; }
	.onlineform__block.request__form .form__table--submit{ margin-top: 56px; }
}
@media screen and (max-width: 768px) {
	.onlineform__block .form__table tr th, 
	.onlineform__block .form__table tr td{ padding: 14px 14px; }
	.onlineform--title{ margin-bottom: 45px; font-size: 1.7rem; line-height: calc(44/30); }
	.onlineform--txt{ font-size: 1.3rem; }
	.onlineform__block.request__form{ margin-top: 25px; }
	.booking-lists{ margin-top: 10px; padding-bottom: 12px; }
	.booking-lists__label--day{ margin-top: 0.7em; }
	.booking-lists > li+li{ margin-top: 10px; }
	.booking-lists__label--date{ margin-bottom: 10px; width: 100%; }
	.booking-lists__input--date{ margin: 0; width: calc(140/640 * 100vw); max-width: 140px; min-width: 110px; }
	.booking-lists__select--day{ width: calc(140/640 * 100vw); max-width: 140px; min-width: 110px; margin-left: 14px; }
	.booking-lists02 li{ max-width: 180px; }
	.booking__input--block dt{ width: 70px; }
	.booking__input--block dd{ width: calc(100% - 70px); }
}

@media screen and (max-width: 320px) {
	.booking-lists__input--date,
	.booking-lists__select--day{ min-width: 75px;  }
}

/* Hide by default */
.visible-hidden-textarea {
  display: none;
}
.visible-hidden-textarea.visible-show {
  display: block;
}
