@charset "utf-8";

.kv-company { background: url("../img/contents/kv-company.jpg") no-repeat center center;}
.kv-pack{ background: url("../../../img/contents/kv-pack.jpg") no-repeat center center;}

.line-ttl{ position: relative; margin-bottom: 30px;
 font-size: 30px; font-weight: normal; line-height: 1.2; text-align: center;}
.line-ttl:before,
.line-ttl:after { content: ''; width: 100px; height: 1px; background:#043;
position: absolute; top: 50%;}
.line-ttl:before{ left: -80px;}
.line-ttl:after { right: -80px;}
@media (max-width: 481px) {
	.line-ttl{ font-size: 24px;}
	.line-ttl:before,
	.line-ttl:after { display: none;}
}


#formBloc { padding-top: 120px;}
#formBloc p.caution{ margin-bottom: 20px; color: #d00; text-align: right; }
#formBloc ul.form { margin-bottom: 50px; border-top: dashed 1px #c4bbab;}
#formBloc ul.form li { padding: 12px 15px; border-bottom: dashed 1px #c4bbab;}
#formBloc ul.form li:hover{ background: #eeece3;}
#formBloc ul.form li.address{ border: none;}
#formBloc ul.form li.memo{ padding-top: 0;}
#formBloc ul.form li dl{ display: table; width: 100%;}
#formBloc ul.form li dl dt,
#formBloc ul.form li dl dd{ display: table-cell;}
#formBloc ul.form li dl dt{ width: 28%; vertical-align: top;}
#formBloc ul.form li dl dd{ width: 72%; vertical-align: middle;}

#formBloc ul.form li dl dt.must sup{ color: #d00; font-size: 10px; vertical-align: top;}
#formBloc ul.form li dl dd input{ box-sizing: border-box; width: 100%; padding: 10px;}
#formBloc ul.form li dl dd input.short{ width: 50%;}
#formBloc ul.form li dl dd.zipset input{ width: 80px;}
#formBloc ul.form li dl dd.zipset em{ font-size: 12px;}
#formBloc ul.form li dl dd.zipset a{ display: inline-block; margin-left: 20px;}
#formBloc ul.form li dl dd span.zipSearch { }
#formBloc ul.form li dl dd input[type="checkbox"],
#formBloc ul.form li dl dd input[type="radio"] { width: 20px;}
#formBloc ul.form li dl dd span.col-s { display: inline-block; width: 35%;}
#formBloc ul.form li dl dd span.col-w { display: block; width: 100%;}
#formBloc ul.form li dl dd span.col-input { display: inline-block; width: 62%;}
#formBloc ul.form li dl dd span.col-input input[type="text"]{ width: 100%;}
#formBloc ul.form li dl dd.radio span{ display:inline-block; width: 40%; vertical-align: top;}
#formBloc ul.form li dl dd select{ width: 50%; padding:10px;}
#formBloc ul.form li dl dd textarea { box-sizing: border-box; width: 100%; height: 120px; padding: 10px;}
#formBloc ul.form li dl dd span.memo{ font-size: 12px;}

#formBloc ul.form li dl span.zipsearch a:hover{ text-decoration: underline;}

#formCheck ul { margin-bottom: 30px; border-top: dashed 1px #c4bbab;}
#formCheck ul li { padding: 15px; border-bottom: dashed 1px #c4bbab;}
#formCheck ul li dl { display: table; width: 100%;}
#formCheck ul li dl dt,
#formCheck ul li dl dd { display: table-cell; vertical-align: top;}
#formCheck ul li dl dt { width: 28%;}
#formCheck ul li dl dd { width: 72%;}

#formCheck p.check { margin-bottom: 30px; text-align: center;}




.btn{ padding-top: 40px; text-align: center;}
.btn li { display: inline-block; width: 45%; margin: 0 10px;}
.btn li a{ display: block; padding: 10px; background: #6d460b; color: #fff;
border-radius: 4px; border: solid 1px #6d460b;}
.btn li.back a{ background: #ccc; color: #222; border: solid 1px #eee;}
.btn li a:hover{ opacity: 0.85;}

#formBloc ul.btn { margin-bottom: 50px; padding-top: 0; border: none;}
#formBloc ul.btn li{ border: none;}


#formCheck ul.btn { margin-bottom: 50px; padding-top: 0; border: none;}
#formCheck ul.btn li{ width: 40%; margin: 0 2%; border: none;}


.thanks { width: 90%; margin: auto;}
.thanks p { margin-bottom: 30px; text-align: center;}
.thanks p span{ display: block;}
.thanks dl{ width: 90%; margin: 0 auto 40px; padding: 20px; border:solid 1px #ccc; text-align: center;}
.thanks dl dt{ margin-bottom: 10px; font-weight: 700;}


@media (max-width: 641px) {
	.btn li a { font-size: 14px;}
	.thanks p span{ display: block;}
}
@media (max-width: 481px) {
	#formBloc h2.line-ttl{ font-size: 20px;}
	#formBloc p.caution{ font-size: 12px;}
	#formBloc ul.form li.address{ padding: 5px 10px;}
	#formBloc ul.form li dl{ display: block;}
	#formBloc ul.form li dl dt,
	#formBloc ul.form li dl dd{ display: block;}
	#formBloc ul.form li dl dt{ width: 100%;}
	#formBloc ul.form li dl dd{ width: 100%;}

	#formBloc ul.form li dl dd.zipset { position: relative;}
	#formBloc ul.form li dl dd.zipset a{ display: block; margin-left: 0px; width: 100px;
	 position: absolute; top: -25px; right: 0; text-align: right;
	}
	#formBloc ul.form li dl dd.radio span{ width: 48%;}

	#formCheck ul li dl { display: block;}
	#formCheck ul li dl dt,
	#formCheck ul li dl dd { display: block;}
	#formCheck ul li dl dt { width: 100%;}
	#formCheck ul li dl dd { width: 100%;}

	.thanks p { text-align: left;}
	.thanks p span{ display: inline;}
}

/*
.formBloc { margin-bottom: 15px;}
.formBloc li { padding: 10px; border-bottom: dashed 1px #c4bbab;}
.formBloc li dl{ position: relative; padding-left: 240px;}
.formBloc li dl dt{ position: absolute; width: 230px; left: 0; top: 5%; font-size: 16px; line-height: 1.4;}
.formBloc li dl dt.row2 { top: 0;}
.formBloc li dl dt.must { color: #d00;}
.formBloc li dl dt.must sup{ font-size: 12px;}
.formBloc li dl dd span.column2{ display: inline-block; width: 48%; vertical-align: top;}
.formBloc li dl dd span.ex{ display: block; margin-bottom: 5px;}
.formBloc li dl dd span.ex label{ display: inline-block; width: 100px;}
.formBloc li dl dd input[type="text"] { box-sizing: border-box; width: 100%; padding: 5px; font-size: 16px;}
.formBloc li dl dd input[type="checkbox"]{ margin-right: 5px;}
.formBloc li dl dd input.zip1 { width: 80px;}
.formBloc li dl dd input.zip2 { width: 120px;}
.formBloc li dl dd input.short{ width: 60%;}
.formBloc li dl dd textarea { box-sizing: border-box; width: 100%; height: 80px; padding: 5px; font-size: 16px; vertical-align: middle;}
.formBloc li span.zipSearch { display: block;}
.formBloc li span.note { display: block; padding: 0px 20px;}
.formBloc li dl dd span span.intro { display: block;}
.formBloc li dl dd span span.intro em{ display: inline-block; margin-right: 10px; font-style: normal;}
.formBloc li dl dd span span.intro input[type="text"] { padding: 2px 5px;}
.formBloc a,
p.note a{ text-decoration: underline;}
.memo{ font-size: 13px;}


.formCheck { margin-bottom: 15px;}
.formCheck li { padding: 10px; border-bottom: dashed 1px #4b3716;}
.formCheck li dl { position: relative; padding-left: 240px;}
.formCheck li dl dt { position: absolute; width: 230px; left: 0; font-size: 16px; line-height: 1.4;}
.formCheck li dl dd { font-size: 15px;}
.formCheck li dl.long{ padding-left: 0;}
.formCheck li dl.long dt { width: 100%; position:relative; left: auto; top: auto; margin-bottom: 10px;}


@media (max-width: 641px) {
	.pc{ display: none;}
	.formBloc li dl,
	.formCheck li dl{ position: relative; padding-left: 0px;}
	.formBloc li dl dt,
	.formCheck li dl dt{ position: relative; width: 100%; left: auto; top: auto; margin-bottom: 5px; font-size: 18px;}
	.formBloc li dl dt.row2 { top: auto;}
	.formBloc li dl dd span.column2{ display: inline-block; width: 100%;}

	.btn li a{ font-size: 14px;}
}

*/