﻿@charset "utf-8";


/* style */
/* -------------------------------------------------------- */
.request-cont {padding:60px 0 120px 0;}
.request-cont .txt1 {text-align:center;}
.request-cont .txt1 span {color:#c00;}
.request-cont .txt2 {text-align:left; margin:30px 0 0 0;}
.request-cont .txt2 dl {margin:3px 0 0 0; display:flex;}
.request-cont .txt2 dt {width:12em; padding:0 1.0em; box-sizing:border-box; background-color:#ddd; display:flex; align-items:center;}
.request-cont .txt2 dt span {color:#c00; margin:0 0 0 0.2em; display:inline-block;}
.request-cont .txt2 dd {padding:0.5em 1.0em; flex:1;}
.request-cont .txt3 {text-align:left; margin:30px 0 0 0;}
.request-cont .txt4 {text-align:left; margin:30px 0 0 0;}
.request-cont .txt4 dt {font-size:120%; font-weight:700;}
.request-cont .txt4 dd {margin:10px 0 0 0;}
.request-cont .clm1 {display:flex; flex-wrap:wrap; align-items:center;}
.request-cont .clm1 > div {padding:2px 1.0em 2px 0; box-sizing:border-box; display:flex; align-items:center;}
.request-cont .clm1 > div > div:first-of-type {white-space:nowrap; padding:0 0.3em 0 0;}
.request-cont .clm1 input[type=text] {width:10em;}
.request-cont .clm2 > div {padding:2px 0; box-sizing:border-box; display:flex; align-items:center;}
.request-cont .clm2 > div > div:first-of-type {width:8em;}
.request-cont .clm2 > div > div:last-of-type {flex:1;}
.request-cont .clm2 > div:first-of-type input[type=text] {width:6em;}
.request-cont .clm3 > div {margin:10px 0 0 0;}
.request-cont .clm3 > div:first-of-type {margin-top:0;}
.request-cont .clm4 {display:flex; align-items:center;}
.request-cont .clm4 > div:first-of-type {width:4em;}
.request-cont .clm4 > div:last-of-type {white-space:nowrap; padding:0 0 0 0.3em;}
.request-cont .clm5 {display:flex; flex-wrap:wrap;}
.request-cont .clm5 > div {padding:2px 1.0em 2px 0; box-sizing:border-box;}
.request-cont .clm5 input {vertical-align:middle; margin:0 0.2em 0 0; display:inline-block;}
.request-cont .clm6 {display:flex; align-items:center;}
.request-cont .clm6 > div {padding:0 0.2em;}
.request-cont .clm6 input[type=text] {width:5em;}
.request-cont .clm7 {display:flex; flex-wrap:wrap;}
.request-cont .clm7 > div {width:11em; padding:2px 0; box-sizing:border-box;}
.request-cont .clm7 input {vertical-align:middle; margin:0 0.2em 0 0; display:inline-block;}
.request-cont .clm8 textarea {width:100%; height:7em;}

.request-cont form {display:block;}
.request-cont form::before {content:''; width:100%; height:100%; background-color:rgba(255,255,255,0.7); display:block; position:fixed; top:0; left:0; opacity:0; pointer-events:none; z-index:998;}
.request-cont form::after {content:''; width:50px; height:50px; margin:-25px 0 0 -25px; background:url(../img/common/loading.svg) no-repeat center center; background-size:cover; display:block; position:fixed; top:50%; left:50%; opacity:0; pointer-events:none; z-index:999;}
.request-cont form.loading::before {opacity:1; pointer-events:auto; transition:opacity 0.3s ease;}
.request-cont form.loading::after {opacity:1; pointer-events:auto; transition:opacity 0.3s ease; animation:spinner 1.5s linear infinite;}
.request-cont input[type=text],
.request-cont select,
.request-cont textarea {width:100%; padding:0.2em 0.5em; background:#fff; border-radius:2px; border:solid 1px #666; box-sizing:border-box;}
.request-cont select {width:auto;}
.request-cont input.error,
.request-cont select.error,
.request-cont textarea.error {background-color:#fee;}
.request-cont .btns {text-align:center; margin:30px 0 0 0; display:flex; flex-wrap:wrap; justify-content:center;}
.request-cont .btns > li {padding:5px 10px;}
.request-cont .btns button {height:2.5em; font-size:1.4rem; white-space:nowrap; letter-spacing:0.1em; text-align:center; text-decoration:none; padding:0 30px; background-color:#fff; border:solid 1px #666; border-radius:2px; display:flex; justify-content:center; align-items:center; transition:background-color 0.3s ease;}
.request-cont .btns button:hover {background-color:#ddd;}
.request-cont .erro-txt {color:#c00; margin:5px 0 0 0;}
.request-cont input.inputCheck {display:none;}
@keyframes spinner {
	0% {transform:rotate(0deg);}
	100% {transform:rotate(360deg);}
}

@media screen and (max-width:1000px){
	.request-cont {padding:30px 0 50px 0;}
	.request-cont .txt1 {font-size:1.4rem;}
	.request-cont .txt2 dl {margin:0; display:block;}
	.request-cont .txt2 dt {width:auto; padding:0 0.5em; display:block;}
	.request-cont .txt2 dd {font-size:1.4rem; padding:0.5em 0 2.0em 0;}
	.request-cont .txt3 {font-size:1.4rem;}
	.request-cont .txt4 {font-size:1.4rem;}
	.request-cont .clm2 > div {display:block;}
	.request-cont .clm6 input[type=text] {width:4.4em;}
	.request-cont .clm8 textarea {height:5em;}
	.request-cont .btns {margin:20px 0 0 0;}
}

