@charset "UTF-8";

/*==========*/
/*!contact*/
/*==========*/
/*detail*/
.contact .detail {
	padding:50px 0 100px;
}

.contact .detail > div {
	margin:0 auto;
	max-width:980px;
	width:90%;
}

.contact .detail > div > p {
	margin-bottom:25px;
	line-height:2.4;
}

.contact .detail form {
	padding-top:25px;
}

.contact .detail table {
	margin-bottom:50px;
	width:100%;
}

.contact .detail table th {
	padding:30px 0;
	width:200px;
	vertical-align:top;
	text-align:left;
	font-weight:700;
}

.contact .detail table td {
	padding:10px 0;
}

.contact .detail table td.re {
	padding-top:5px;
}

.contact .detail table td.re p {
	padding-bottom:5px;
	font-size:80%;
	line-height:1.2;
}

.contact .detail table td.re p:before {
	content:"▼ ";
	vertical-align:middle;
	font-size:70%;
	line-height:20px;
}

.contact .detail input {
	padding:20px 15px;
	width:100%;
	border:1px solid #CECECE;
	font-size:16px;
	font-family:"ヒラギノ角ゴ Pro W3",Hiragino Kaku Gothic Pro,"メイリオ",Meiryo,"ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height:1.6;
}

.contact .detail textarea {
	display:block;
	padding:20px 15px;
	width:100%;
	height:10em;
	border:1px solid #CECECE;
	font-size:16px;
	font-family:"ヒラギノ角ゴ Pro W3",Hiragino Kaku Gothic Pro,"メイリオ",Meiryo,"ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height:1.6;
}

.contact .detail input::placeholder,.contact .detail textarea::placeholder {
	color:#CECECE;
}

.contact .detail form > .err {
	position:relative;
	z-index:20;
	display:block;
	margin-bottom:30px;
	padding:15px 0;
	border:1px solid #F55;
	background-color:#FFF;
	color:#F55;
	text-align:center;
	font-size:90%;
	line-height:1.2;
}

.contact .detail td .err {
	display:block;
	margin-top:5px;
	color:#F55;
	font-size:75%;
	line-height:1.2;
}

/*thankyou*/
.contact .thankyou {
	padding:50px 0 200px;
}

.contact .thankyou > div {
	margin:0 auto;
	max-width:980px;
	width:90%;
}

.contact .thankyou > div > p {
	margin-bottom:40px;
	padding:4em 0;
	padding-left:.05em;
	border:1px solid #EAEAEA;
	color:#333;
	text-align:center;
	letter-spacing:.05em;
	font-weight:200;
	font-size:120%;
	line-height:2.2;
}

.contact .detail .submit,.contact .thankyou .back {
	display:block;
	margin:0 auto;
	width:320px;
	background-color:#1D4786;
	color:#FFF;
	text-align:center;
	line-height:65px;
}

.contact .detail .submit span:after {
	content:"　→";
}

.contact .thankyou .back span:before {
	content:"←　";
}

@media screen and (min-width:769px) {
	.contact .detail .submit,.contact .thankyou .back {
		transition:background-color .2s;
	}
	
	.contact .detail .submit:hover,.contact .thankyou .back:hover {
		background-color:#FFA200;
	}
}

@media screen and (max-width:768px) {
	/*detail*/
	.contact .detail {
		padding:2em 0 4em;
	}
	
	.contact .detail > div > p {
		margin-bottom:1em;
	}
	
	.contact .detail form {
		padding-top:1em;
	}
	
	.contact .detail table {
		margin-bottom:3em;
	}
	
	.contact .detail table th {
		float:left;
		padding:2em 0 0;
		width:100%;
	}
	
	.contact .detail table td {
		float:left;
		padding:.5em 0 0;
		width:100%;
	}
	
	.contact .detail table td.re {
		padding-top:0;
	}
	
	.contact .detail table td.re p {
		padding-bottom:.5em;
		font-size:90%;
	}
	
	.contact .detail table td.re p:before {
		line-height:1em;
	}
	
	.contact .detail input {
		padding:.5em 1em;
		font-size:130%;
	}
	
	.contact .detail textarea {
		padding:.5em 1em;
		font-size:130%;
	}
	
	.contact .detail .submit,.contact .thankyou .back {
		width:75%;
		line-height:4em;
	}
	
	.contact .detail form > .err {
		margin-bottom:0;
		padding:1em 0;
	}
	
	.contact .detail td .err {
		margin-top:1em;
	}
	
	/*thankyou*/
	.contact .thankyou {
		padding:2em 0 4em;
	}
	
	.contact .thankyou > div > p {
		margin-bottom:2em;
		line-height:2;
	}
}
