@charset "utf-8";
/* ------------------------------------------------------------ common */


/* ------------------------------------------------------------ form */

#contact { padding: 97px 0 100px; background: url(../images/bg_pattern.png) repeat left top; background-size: 101px;}


.form { width: 710px; margin: 0 auto;}

.form h3 { font-size: 40px; margin-bottom: 40px; text-align: center; font-weight: 700;}
.form table { margin-bottom: 50px;}
.form table tr,
.form table th,
.form table td{ display: block; width: 100%; font-size: 16px;}

.form table tr { display: flex; align-items: center; margin: 0 0 50px; }
.form table tr:last-child { margin-bottom: 0;}
.form table th{ width: 210px; text-align: left; font-feature-settings: "palt";}
.form table td{ width: 480px; white-space: normal;}
/* .form table td.radio-wrap{ justify-content: flex-start; } */
.form table th span{ display: inline-block; font-size: 10px; color: #fff; width: 28px; line-height: 16px; background: #707070; text-align: center; margin-left: 6px; vertical-align: 1px;}
.form table th .required { background: #a70909;}

.form table td .long { box-sizing: border-box; width: 480px; padding: 12px 25px 11px; border: 1px solid #c9c9c9; appearance: none; -webkit-appearance: none; border-radius: 0; background: #fff; }


.form table td.choose{ position: relative; }
.form table td.choose:after{ position: absolute; top: 25px; left: calc(50% - 50px); content: ""; border-top: 6px solid #000; border-right: 5px solid transparent; border-left: 5px solid transparent; }

.form table td.dobble { display: flex; justify-content: space-between; width: 522px; margin-left: -42px;}
.form table td.dobble div { display: flex; justify-content: space-between; align-items: center; width: 246px;}
.form table td.dobble .half { width: 205px; padding: 12px 25px 11px;}


.form table tr.text_box{ align-items: flex-start; }
.form table tr.text_box td textarea{ width: 480px; height: 180px; padding: 12px 25px 11px; box-sizing: border-box; border: 1px solid #c9c9c9; }


.form table .agree{ width: 100%; text-align: center; }
.form table .agree span{ font-weight: 400; font-size: 16px; }


.form .submit { display: block; width: 380px; margin: 0 auto; padding: 30px 0 25px; box-sizing: border-box; font-size: 16px; color: #fff; text-align: center; background: #a70909; text-align: center;}


/* ------------------------------------------------------------ error */

#error { background: url(../images/bg_pattern.png) repeat left top; background-size: 101px;}

#error h2 { font-size: 32px; text-align: center; margin: 0 0 40px; padding: 0 0 30px;}	
#error .caution { font-size: 16px;	text-align: center; margin: 0 0 40px;}
#error .alert { margin: 0 0 50px;}
#error .alert span { display: block; text-align: center; margin: 0 0 20px;}
#error .btns { margin-bottom: 100px;}
#error .btns .back_btn a {margin: 0 auto; display: block; text-align: center; width: 300px; font-size: 16px;line-height: 60px; color: #000; font-family: 'NotoSansJP-Medium'; background-color: #eee;}


/* ------------------------------------------------------------ confirm */

#confirm { width: 1100px; margin: 0 auto; padding: 0 0 100px; background: url(../images/bg_pattern.png) repeat left top; background-size: 101px;}
	
#confirm h2 { font-size: 32px; text-align: center; margin: 0 0 40px; padding: 0 0 30px;}
#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: 20px 0; font-family: 'NotoSansJP-Regular';}
#confirm .btns { display: flex; justify-content: center;}
#confirm .btns .back_btn a { display: block; text-align: center; width: 300px; font-size: 16px;line-height: 60px; color: #000; font-family: 'NotoSansJP-Medium'; background-color: #eee; margin-right: 20px;}
#confirm .btns input { width: 300px; font-size: 14px; padding: 15px 0; color: #fff; font-family: 'NotoSansJP-Medium'; background-color: #a60c0c; margin-left: 20px;}

/* ------------------------------------------------------------ thanks */

#thanks { padding: 50px 0 100px; background: url(../images/bg_pattern.png) repeat left top; background-size: 101px;}
#thanks h2 { font-size: 32px; text-align: center; margin: 0 0 40px; padding: 0 0 30px;}
#thanks .caution { font-size: 16px; text-align: center; line-height: 1.7; margin: 0 0 30px;}
#thanks small { display: block; font-size: 14px; text-align: center; line-height: 2; margin: 0 0 40px;}
#thanks .top_btn a { background: #000; display: block; width: 300px; font-size: 16px; color: #fff; line-height: 60px; text-align: center; margin: 0 auto;}

/* ------------------------------------------------------------
	mobile 
------------------------------------------------------------ */
@media only screen and (max-width: 640px) {



	/* ------------------------------------------------------------ common */
	


	/* ------------------------------------------------------------ form */
	
#contact { padding: 50px 0 50px; background-size: 50px;}


.form { width: 100%; margin: 0 auto;}

.form h3 { font-size: 24px; margin-bottom: 20px; text-align: center;}
.form table { margin-bottom: 50px;}
.form table tr,
.form table th,
.form table td{ display: block; width: 100%; font-size: 16px;}

.form table tr { display: block; margin: 0 0 35px; }
.form table tr:last-child { margin-bottom: 0;}
.form table th{ width: 100%; text-align: left; font-feature-settings: "palt"; margin-bottom: 15px;}
.form table td{ width: 100%; white-space: normal;}
/* .form table td.radio-wrap{ justify-content: flex-start; } */
.form table th span{ display: inline-block; font-size: 10px; color: #fff; width: 28px; line-height: 16px; background: #707070; text-align: center; margin-left: 6px; vertical-align: 1px;}
.form table th .required { background: #a70909;}

.form table td .long { box-sizing: border-box; width: 100%; padding: 12px 25px 11px; border: 1px solid #c9c9c9; appearance: none; -webkit-appearance: none; border-radius: 0; background: #fff; }


.form table td.choose{ position: relative; }
.form table td.choose:after{ position: absolute; top: 25px; left: calc(50% - 50px); content: ""; border-top: 6px solid #000; border-right: 5px solid transparent; border-left: 5px solid transparent; }

.form table td.dobble { display: flex; justify-content: space-between; width: 100%; margin-left: 0;}
.form table td.dobble div { display: block; width: 48%;}
.form table td.dobble div p { margin-bottom: 10px;}
.form table td.dobble .half { width: 100%; padding: 12px 25px 11px;}


.form table tr.text_box{ }
.form table tr.text_box td textarea{ width: 100%; height: 180px; padding: 12px 25px 11px; box-sizing: border-box; border: 1px solid #c9c9c9; }

.form table tr:last-child td { text-align: center;}
.form table .agree{ width: 100%; text-align: center; }
.form table .agree span{ font-weight: 400; font-size: 16px; }


.form .submit { display: block; width: 100%; margin: 0 auto; padding: 20px 0 22px; box-sizing: border-box; font-size: 16px; color: #fff; text-align: center; background: #a70909; text-align: center;}
	
	
/* ------------------------------------------------------------ error */

#error { background-size: 50px;}

#error h2 {
		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 { width: 90%; margin: 0 auto; background-size: 50px;}
	
	#confirm h2 { 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,
	#confirm table tbody,
	#confirm table tr,
	#confirm table tr th,
	#confirm table tr td { display: block;}
	
	#confirm table { width: 100%; margin: 0 0 50px;}
	
	
	#confirm table tr th { width: 100%; font-size: 14px; padding: 15px 0 5px; border: 0px;}
	
	#confirm table tr td { font-size: 14px; line-height: 1.5; padding: 0 0 15px; border: 0px;}
	
	#confirm .btns { display: block;}
	#confirm .btns .back_btn a { width: 100%; padding: 24px 0; margin: 0 0 20px;}
	#confirm .btns input { width: 100%; padding: 20px 0; margin-left: 0;}

/* ------------------------------------------------------------ thanks */

	#thanks {
		padding: 30px 0 70px;
		background-size: 50px;
		
	}
	
	#thanks .flow ul:before { border-top: 8px solid #003597;}
	#thanks .flow ul:after { display: none;}
		
	#thanks h2 {
		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;
		
		margin: 0 0 30px;
	}


}