@charset "UTF-8";

.contactKindsList {
	background-color:rgba(255,255,255,0.85); max-width:100%; width:850px; padding:20px 30px; margin:10px 0;
	p {font-size:130%; font-weight: 600;}
	ul {display: flex; flex-wrap: wrap; justify-content: flex-start;}
	li {margin:0 50px 0 0;}
	li::before {content:"●"; color:#816E3C; font-size:90%; margin:0 5px 0 0;}
}
.contactMidashi {font-size:120%; color:var(--white); text-align:center; font-weight:600; margin:0 auto 30px auto; }
.contactMidashi::after {content:""; display:block; width:130px; height:1px; background-color:var(--white); margin:20px auto 0 auto;}


.contactInput{background-color:rgba(255,255,255,0.8); padding:50px 0; margin:30px auto;
	table {max-width:900px; width:90%; margin:0 auto 20px auto;
	th , td {padding:10px 0; text-align: left;}
	th { width:25%;}
	.hissu {}
	.hissu::after {content:'必須'; color:var(--white); background-color:#A00F0F; font-size:14px; padding:2px 5px; line-height:0; margin:0 0 0 10px;}
	td {}
	}
	#required_msg {color:#A00F0F; font-size:130%; font-weight: 600;}
	#contact_submit {display: inline-block; width:200px; height:55px; line-height:55px; text-align: center; margin:30px auto; background-color:var(--key_color); }
	#contact_submit:hover {opacity: 0.5;}
	.btnBox {margin:0 auto; text-align: center;}
	.typeBack {display: inline-block; width:200px; height:55px; line-height:55px; text-align: center; margin:30px auto; background-color:#999; cursor: pointer;}
	.typeSubmit {display: inline-block; width:200px; height:55px; line-height:55px; text-align: center; margin:30px auto; background-color:var(--key_color); cursor: pointer;}
	.typeBack:hover ,
	.typeSubmit:hover {opacity: 0.5;}
	.msgError {text-align: center; margin:30px auto;}
	a.privacyChk {text-decoration: underline;}
	.secHeader {
		.main{color:var(--black) !important;}
	}
}

.is_tab.tate-mode .contactInput{ padding:20px 0; margin:30px auto;
	table {width:90%; margin:0 auto 20px auto;
	th , td {display: block; width:100%;}
	th {padding:10px 10px 0 10px;}
	td {padding:0 10px 10px 10px;}
	}
}

.is_sp .contactKindsList {
	ul {display: block;}
		li {text-indent: -1em; padding-left: 1em; margin:0;}
	}

.is_sp .contactInput{ padding:20px 0; margin:30px auto;
	table {width:90%; margin:0 auto 20px auto;
	th , td {display: block; width:100%;}
	th {padding:10px 10px 0 10px;}
	td {padding:0 10px 10px 10px;}
	}
	#contact_submit {width:80%; height:60px; line-height:60px;}
	.btnBox {width:90%;}
	.typeBack {width:48%; height:60px; line-height:60px;}
	.typeSubmit {width:48%; height:60px; line-height:60px;}
	.msgError {text-align: left; width:90%; margin:30px auto;}
}



input ,
select ,
textarea {font-size:100%;}

input[type="checkbox"] {
  transform: scale(1.3); margin:0 10px 0 0;
}

input[type="text"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="email"]
{border-style:none; padding:10px !important; height:40px; line-height:40px; vertical-align:top; box-sizing: border-box; width:100%; min-width: 0; /* ← iOS対応 */ display: block; /* 安定させる */}
textarea
{border-style:none; padding:10px !important; vertical-align:top; box-sizing: border-box; width:100%; min-width: 0; /* ← iOS対応 */ display: block; /* 安定させる */}

input[type="text"]:focus,
input[type="passowrd"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
textarea:focus
{}

input[type="text"]::placeholder,
input[type="passowrd"]::placeholder,
input[type="number"]::placeholder,
input[type="tel"]::placeholder,
input[type="email"]::placeholder,
textarea::placeholder {}