@charset "utf-8";

/* ------------------------------------------------------------ contact */
aside{ display: none; }
table,tbody,tr,th,td{ display: block; text-align: left; width: 100%; }

.form-inner { width: 90%; margin: 0 auto; padding: 50px 0;}
.form-ttl{ font-size: 20px; text-align: center; margin: 0 0 25px; }
.caution { font-size: 11px; text-align: center; margin: 0 0 40px; line-height: 150%; }

.btn-type{ appearance: none; -webkit-appearance: none; background: none; color: #00b4db; }
.form-btns{ display: flex; align-items: center; justify-content: center; }
.submit_btn{ width: 47%; margin: 0 2%; display: flex; align-items: center; justify-content: center; height: 50px; border: 2px solid #00b4db; color: #00b4db !important; background: #f2feff; font-size: 15px; }
.submit_btn a{ display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #00b4db !important; }

.back_btn{ background: #e5e5e5; border: 2px solid #e5e5e5; }
.back_btn a{ color: #000!important; font-size: 14px; }

.top_btn{ width: 100%; }
.top_btn a{ width: 100%; margin: 0; }

#contact .intro { font-size: 11px; line-height: 2; margin: 0 auto 30px; }
#contact .caution {	font-size: 14px; text-align: center; margin: 40px 0 25px; line-height: 150%; }

#contact tr{ margin: 0 0 25px; }
#contact th{ padding: 0 0 10px; font-size: 14px; }
#contact td{ font-size: 14px; }
#contact .box{ width: 100%; padding: 5px 10px; }
#contact td p{ width: 100%; padding: 0 0 10px  }
#contact td p span{ display: inline-block; width: 20px; }
#contact td p .box{ width: 50%; }

.message li{ padding: 0 0 40px; }
.message h2{ padding: 0 0 20px; font-size: 20px; line-height: 1.5; color: #00b4db !important; text-align: center; }
.message p{ font-size: 14px; line-height: 1.5; }
.message div{ padding: 15px 0 0; font-size: 14px; line-height: 1.5; }


/* ------------------------------------------------------------ error */
#error h3 { font-size: 32px; text-align: center; margin: 0 0 40px; padding: 0 0 30px; border-bottom: solid 1px #d4b77a;}
#error .alert { margin: 0 0 50px;}
#error .alert span { display: block; text-align: center; margin: 0 0 20px;}


/* ------------------------------------------------------------ confirm */
#confirm { }
#confirm h3 { font-size: 32px; text-align: center; margin: 0 0 40px; padding: 0 0 30px; border-bottom: solid 1px #d4b77a;}
#confirm .caution { font-size: 16px; text-align: center; margin: 0 0 40px;}
#confirm table { width: 100%; margin: 0 0 50px;}
#confirm table tr {	border-bottom: solid 1px #e5e5e5;}
#confirm table tr:first-of-type { border-top: solid 1px #e5e5e5;}
#confirm table tr th { width: 180px; line-height: 1.5; font-weight: bold; text-align: left; padding: 20px 0;}
#confirm table tr td { line-height: 1.5; padding: 10px 0;}
#confirm .btns { display: flex; justify-content: center;}
#confirm .btns .submit_btn { margin: 0 0 0 20px;}


/* ------------------------------------------------------------ thanks */
#thanks { margin: 50px 0 100px; }
#thanks h3 { font-size: 32px; text-align: center; margin: 0 0 40px; padding: 0 0 30px; border-bottom: solid 1px #d4b77a; }
#thanks .caution { font-size: 14px; text-align: center; line-height: 1.7; margin: 0 0 30px; }
#thanks small { display: block; font-size: 11px; line-height: 2; margin: 0 0 40px; }
#thanks .submit_btn{ margin: 0; }



/* ------------------------------------------------------------ mobile */

@media only screen and (max-width:768px) {
	
/* ------------------------------------------------------------ fv */
	#contact { padding: 50px 0 70px; }
	#contact .inner { width: 90%; }
	#contact .intro { font-size: 14px; text-align: left; margin: 0 auto 20px; }
	#contact .caution { font-size: 13px; margin: 50px 0 0; }
	#contact .input { width: 100%; margin: 0 auto 20px; }
	#contact .input table, #contact .input table tbody, #contact .input table tr { display: block; }
	#contact .input tr th { display: block; width: 100%; font-size: 14px; padding: 0 0 10px; }
	#contact .input tr.top th { padding: 0 0 10px; }
	#contact .input tr td { display: block; padding: 0 0 25px; }
	#contact .input tr td textarea { width: 100%; padding: 10px 15px; box-sizing: border-box; }
	#contact .input tr td p { margin: 0 0 15px; }


/* ------------------------------------------------------------ error */
	#error h3 { font-size: 22px; margin: 0 0 25px; padding: 0 0 20px; }
	#error .caution { font-size: 14px; line-height: 1.7; margin: 0 0 40px; }
	#error .alert { margin: 0 0 50px; }
	#error .alert span { font-size: 14px; margin: 0 0 20px; }

/* ------------------------------------------------------------ confirm */
	#confirm h3 { font-size: 22px; margin: 0 0 25px; padding: 0 0 20px; }
	#confirm .caution { font-size: 14px; line-height: 1.7; margin: 0 0 40px; }
	#confirm table { display: block; width: 100%; margin: 0 0 50px; }
	#confirm table tbody { display: block; }
	#confirm table tr { display: block; }
	#confirm table tr th { display: block; width: 100%; font-size: 14px; padding: 15px 0 5px; }
	#confirm table tr td { display: block; font-size: 14px; line-height: 1.5; padding: 0 0 15px; }
	#confirm .btns { display: block; }
	#confirm .btns .submit_btn { margin: 15px 0 0; }
	
/* ------------------------------------------------------------ thanks */
	#thanks { margin: 30px 0 70px; }
	#thanks h3 { font-size: 22px; margin: 0 0 25px; padding: 0 0 20px; }
	#thanks .caution { font-size: 14px; line-height: 1.7; margin: 0 0 20px; }
	#thanks small { font-size: 12px; line-height: 2; text-align: left; margin: 0 0 30px; }
	
	
}