@charset "utf-8";


/**************************************************50
 * contact
 **************************************************/
#contact{
}
#contact #form{
	background-color: #CDEAC1;
	margin-left: auto;
	margin-right: auto;
}
#contact dl{
}
#contact dl dt{
	margin-bottom: 0.5em;
}
#contact dl dt.required{
}
#contact dl dt span{
	display: inline-block;
	text-align: center;
	vertical-align: middle;
}
#contact dl dt.required span{
}
#contact dl dt.required span:after{
	background-color: #FF0F35;
	border-radius: 3px;
	color: #FFFFFF;
	content: "必須";
	font-size: 62.5%;
	display: block;
	padding: 0 0.6em;
	position: absolute;
	top: 50%;
}
#contact dl dd{
}
#contact dl dd [name="zipcode"]{
	max-width: 8em;
}
#contact dl dd [name="tel"]{
	max-width: 11em;
}
#contact dl dd .img_edit + .img_edit{
	margin-top: 0.5em;
}
#contact .btn_reset,
#contact .btn_back{
	background: -webkit-linear-gradient(top, #757575, #626262);
	background: linear-gradient(to bottom, #757575, #626262);
}
#contact .btn_submit{
	background: -webkit-linear-gradient(top, #FE8000, #FE0000);
	background: linear-gradient(to bottom, #FE8000, #FE0000);
}
#contact a.contact_img img{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: opacity 0.2s ease-out 0s;
}
#contact a.contact_img:hover img{
	opacity: 0.7;
}
@media screen and (max-width:767px){
	#contact{
		margin-bottom: 6.25%;
	}
	#contact #form{
		padding: 3.125% 3.125% -webkit-calc(3.125% + 0.5em);
		padding: 3.125% 3.125% calc(3.125% + 0.5em);
		width: 93.75%;
	}
	#contact dl{
	}
	#contact dl dt{
	}
	#contact dl * + dt,
	#contact dl div dt{
		margin-top: 1.5em;
	}
	#contact dl dt.required{
		padding-right: 2.5em;
		position: relative;
	}
	#contact dl dt.required span{
	}
	#contact dl dt.required span:after{
		right: 0;
		-ms-transform: translate(0, -50%);
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
	}
	#contact dl dd{
	}
	#contact .btn_reset,
	#contact .btn_back,
	#contact .btn_submit{
		border-radius: 5px;
	}
}
@media screen and (min-width:768px){
	#contact{
		margin-bottom: 100px;
	}
	#contact #form{
		padding: 50px 60px;
		max-width: 890px;
	}
	#contact dl{
	}
	#contact dl dt{
	}
	#contact dl * + dt,
	#contact dl div dt{
		margin-top: 2em;
	}
	#contact dl dt.required{
	}
	#contact dl dt.required span{
		position: relative;
	}
	#contact dl dt.required span:after{
		right: -1.5em;
		-ms-transform: translate(100%, -50%);
		-webkit-transform: translate(100%, -50%);
		transform: translate(100%, -50%);
	}
	#contact dl dd{
	}
	#contact .btn_reset,
	#contact .btn_back,
	#contact .btn_submit{
		border-radius: 10px;
	}
}


