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

/* contact
------------------------------------------------ */
#page--title{ margin-bottom: 70px; padding-bottom: 0; border:0; }

ul.tabs{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
ul.tabs li{	box-sizing: border-box;	width: calc(50% - 18px); text-align: center; font-size: 1.8rem;	font-weight: 600; background-color: #CECECE; color: #090707; padding: 10px 0; cursor: pointer; }
ul.tabs li.current{	background: #011e41; color: #fff; }

.tab-content{ display: none; padding: 30px 68px 34px; border:2px solid #011e41; }
.tab-content.current{ display: inherit; }

/* contact form */
.contact__form{ max-width: 740px; margin: 0 auto; }
.contact__form input[type=text],
.contact__form input[type=tel],
.contact__form input[type=email],
.contact__form input[type=reset],
.contact__form input[type=submit],
.contact__form input[type=password],
.contact__form input[type=button],
.contact__form select,
.contact__form textarea,
.contact__form button { -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; }

.contact__form input[type=text],
.contact__form input[type=email],
.contact__form textarea,
.contact__form select {	padding: 5px 10px; height: 40px; width: 100%; font-size: 1.6rem; box-sizing: border-box; border:1px solid #CECECE; }
.contact__form textarea{ height: 300px; resize: none; }

.contact__form input[type=submit]{ cursor: pointer; width: 100%; height: 60px; font-size: 1.8rem; font-weight: 600; letter-spacing: 0.038em; line-height: 1; text-align: center; color:#fff; background-color: #011e41; border:0; border-radius: 0; }

.contact__form--label,
.contact__form--note{ font-size: 1.6rem; letter-spacing: 0.024em; line-height: 1.75; }
.contact__form--label{ display: block; margin-bottom: 8px; }
.contact__form--label > span{ color:#CE1017; }
.contact__form--note{ color:#CE1017; }

.contact__form--group+.contact__form--group{ margin-top: 30px; }
.contact__form--group span.wpcf7-list-item { margin: 0 1em 0 0; }

.contact__form--block-check{ margin-top: 30px; }
.contact__form--block-check--label span.wpcf7-list-item { margin: 0; }
.contact__form--block-check--label,
.contact__form--block-check--txt { display: block; vertical-align: middle; }
.contact__form--block-check--label input[type='checkbox']{ position:absolute; opacity: 0; cursor:pointer; }
.contact__form--block-check--label .wpcf7-list-item-label { background: #fff; position: absolute; top: 1px; left: 0; text-indent: -5em; overflow: hidden; height: 30px; width: 30px; border: 1px solid #B1BBC3; }
.contact__form--block-check--label .wpcf7-list-item-label:after { content: ""; position: absolute; display: none; }
.contact__form--block-check--label input:checked ~ .wpcf7-list-item-label:after { display: block; }
.contact__form--block-check--label .wpcf7-list-item-label:after { top: 4px; left: 4px; width: 22px; height: 22px; background: #000; }
.contact__form--block-check--txt { font-family: 'Yu Gothic'; font-size: 16px; font-size: 1.6rem; letter-spacing: 0.09em; line-height: 30px; width: calc( 100% - 40px ); margin-left: 40px; margin-top: -21px; }
.contact__form--block-check--txt a { text-decoration: none; border-bottom: 1px solid #000; }
.contact__form--block-check--label .wpcf7-not-valid-tip { position: absolute; bottom: -40px; left: 0; display: block; width: 100vh; }

.contact__form .wpcf7{ margin-top: 40px; }
.contact__form--submit{ position: relative; margin-top: 30px; }
.contact__form--block-upload{ margin-top: 30px; }
.contact__form--block-upload #fileupload{ display: none; }
.contact__form--block-upload #fileuploadbtn{ display: inline-block; vertical-align: middle; width: 90px; height: 24px; font-size: 1rem; letter-spacing: 0.1em; line-height: 1; text-align: center; border:0; background-color: #CECECE; }
.contact__form--block-upload #fileuploadtxt{ margin-left: 12px; display: inline-block; vertical-align: middle; font-size: 1.2rem; }
.contact__form--block-upload--txt{ font-size: 1.6rem; letter-spacing: 0.024em; line-height: 1.75; margin-bottom: 25px; }
div.wpcf7 .ajax-loader{ margin: 0; position: absolute; left: 50%; top: 50%; transform: translate(-50% , -50%); }
.contact-recaptcha{ display: table; margin: 30px auto 0; }


/* responsive style 
------------------------------------------------ */
@media screen and (max-width: 768px) {
	.contact__form input[type=text],
	.contact__form input[type=email],
	.contact__form textarea,
	.contact__form select { font-size: 14px; font-size: 1.4rem; }
	.contact__form textarea{ height: 265px; }

	.contact__form input[type=submit]{ height: 50px; font-size: 1.6rem; }

	ul.tabs li{ padding:5px 0; font-size: 1.6rem; width: calc(50% - 5px); }
	.contact__form--label, .contact__form--note{ font-size: 1.4rem; }
	.contact__form--label{ margin-bottom: 3px; }

	.tab-content{ display: none; padding: 35px 13px 38px; }
	.contact__form .wpcf7{ margin-top: 10px; }
	.contact__form--group+.contact__form--group{ margin-top: 16px; }

	.contact__form--block-check{ margin-top: 20px; }
	.contact__form--block-check--txt{ font-size: 1.4rem; }
	.contact__form--block-check--txt a{ padding-bottom: 5px; }
	.contact__form--block-check--label .wpcf7-list-item-label{ width: 25px; height: 25px; }
	.contact__form--block-check--label .wpcf7-list-item-label:after{ width: 18px; height: 18px; top: 3.5px; left: 3.5px; }
	.contact__form--block-check--txt{ margin-top: -25px; margin-left: 35px; letter-spacing: 0.024em; }

	.contact__form--block-upload{ margin-top: 15px; }
	.contact__form--block-upload--txt{ margin-bottom: 20px; font-size: 1.2rem; }
	.contact__form--block-upload #fileuploadbtn{ font-size: 1.3rem; width: 114px; height: 25px; }
	.contact-recaptcha-wrap .wpcf7-form-control-wrap{ width: 234.08px; margin: 0 auto; }
	.contact-recaptcha{transform:scale(0.77);-webkit-transform:scale(0.77);transform-origin:0 0;-webkit-transform-origin:0 0;}

}
@media screen and (max-width: 375px) {
	.contact__form--block-check--txt{ font-size: 1.2rem; }
}