@charset "utf-8";

form#mail_form{

	max-width : 860px;

	margin : 50px auto 0;

	padding : 10px 0 0 0;

	font-weight: 600;

	font-size: 16px;

	background : transparent;

	/* border : 1px solid #d4ccb6; */

	/* border-radius : 20px; */

	/* box-shadow : 0 0 8px 2px rgba( 185, 182, 166, 0.2 ); */

}

form#mail_form dl{

	/* width : 90%; */

	margin : 0 auto;

	overflow : hidden;

}

form#mail_form dl dt{

	clear : both;

	width : 30%;

	float : left;

	border-top : 1px solid #cccccc;

	padding : 15px 0;

	text-align : right;

	overflow : hidden;

}

form#mail_form dl dd{

	width : 70%;

	float : right;

	border-top : 1px solid #cccccc;

	margin: 0;

	padding : 15px 0 15px 5%;

}

form#mail_form dl dt:first-child,

form#mail_form dl dt:first-child+dd{

	border : none;

}

form#mail_form dl dt span {

    display: block;

    font-size: 11px;

    color: #F3CA30;

}

/* -- for JavaScript ここから -------------------------------------------------------------------------------- */

form#mail_form dl dt span.required,

form#mail_form dl dt span.optional{

	display : inline-block;

	float : left;

	color : #ffffff;

	line-height : 1;

	padding : 8px 9px;

	border-radius : 3px;

}

form#mail_form dl dt span.required{

	background : #000000;

	border : 1px solid #FFFFFF;

}

form#mail_form dl dt span.optional{

	background : #FFFFFF;

	border : 1px solid #000000;

	color: #000000;

}

form#mail_form dl dd span.error_blank,

form#mail_form dl dd span.error_format,

form#mail_form dl dd span.error_match{

	display : block;

	color : #ff0000;

	margin-top : 3px;

}

span.loading{

	width : 50px;

	height : 50px;

	border-radius : 50%;

	border-top : 5px solid rgba( 255, 255, 255, 0.2 );

	border-right : 5px solid rgba( 255, 255, 255, 0.2 );

	border-bottom : 5px solid rgba( 255, 255, 255, 0.2 );

	border-left : 5px solid #ffffff;

	-webkit-transform : translateZ( 0 );

	-ms-transform : translateZ( 0 );

	transform : translateZ( 0 );

	-webkit-animation : load-circle 1.0s linear infinite;

	animation : load-circle 1.0s linear infinite;

	position : absolute;

	top : 50%;

	left : 50%;

	margin-top : -25px;

	margin-left : -25px;

}

@-webkit-keyframes load-circle{

	0%{

		-webkit-transform : rotate( 0deg );

		transform : rotate( 0deg );

	}

	100%{

		-webkit-transform : rotate( 360deg );

		transform : rotate( 360deg );

	}

}

@keyframes load-circle{

	0%{

		-webkit-transform : rotate( 0deg );

		transform : rotate( 0deg );

	}

	100%{

		-webkit-transform : rotate( 360deg );

		transform : rotate( 360deg );

	}

}

/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */

form#mail_form input[type="text"],

form#mail_form input[type="email"],

form#mail_form input[type="tel"]{

	max-width : 90%;

	height : 2em;

	padding : 2px 2%;

	border : 1px solid #cccccc;

	border-radius : 3px;

	background : #fafafa;

	-webkit-appearance : none;

	font-size : 100%;

	font-family : inherit;

	margin-top : 5px;

}

form#mail_form input[type="text"]:focus,

form#mail_form input[type="email"]:focus,

form#mail_form input[type="tel"]:focus,

form#mail_form textarea:focus{

	box-shadow : 0px 0px 5px #55ccff;

	border : 1px solid #55ccff;

	background : #ffffff;

}

form#mail_form ul li input[type="radio"],

form#mail_form ul li input[type="checkbox"]{

	margin-right : 10px;

	margin-top : 7px;

}

form#mail_form ul li:first-child input[type="radio"],

form#mail_form ul li:first-child input[type="checkbox"]{

	margin-top : 0px;

}

form#mail_form select{

	font-size : 100%;

	margin-top : 5px;

}

form#mail_form textarea{

	display : block;

	width : 90%;

	max-width : 90%;

	height : 200px;

	padding : 2px 2%;

	resize : vertical;

	border : 1px solid #cccccc;

	border-radius : 3px;

	background : #fafafa;

	-webkit-appearance : none;

	font-size : 100%;

	font-family : inherit;

}

form#mail_form ul{

	list-style-type : none;

	font-size: 13px;

}

form#mail_form ul li label:hover{

	cursor : pointer;

}

form#mail_form input#company{

	width : 60%;

}

form#mail_form input#name_1,

form#mail_form input#name_2,

form#mail_form input#read_1,

form#mail_form input#read_2,

form#mail_form input#postal,

form#mail_form input#phone,

form#mail_form input#schedule{

	width : 80%;

}

form#mail_form input#mail_address,

form#mail_form input#mail_address_confirm{

	width : 80%;

}

form#mail_form input#postal+a{

	display : inline-block;

	padding : 9px 15px;

	vertical-align : middle;

	line-height : 1;

	background : #5bc0de;

	border : 1px solid #46b8da;

	border-radius : 3px;

	color : #ffffff;

	font-family : inherit;

	text-decoration : none;

	position : relative;

	top : -1px;

}

form#mail_form input#postal+a:hover{

	cursor : pointer;

	background : #31b0d5;

	border : 1px solid #269abc;

}

form#mail_form input#address_1,

form#mail_form input#address_2{

	display : block;

	width : 90%;

	margin-top : 0px;

}

form#mail_form input#address_2{

	margin-top : 7px;

}

form#mail_form p#form_submit{

	/* width : 90%; */

	margin : 0 auto;

	padding : 15px 0 0;

	border-top : 1px solid #cccccc;

}

form#mail_form input[type="button"] {

    padding: 8px 16px;

    background: #275BA7;

    border: 1px solid #275BA7;

    border-radius: 3px;

    color: #fff;

    display: block;

    margin: 40px auto 0;

}

form#mail_form input[type="button"]:hover{

	cursor : pointer;

	background : #ECF4FC;

	border : 1px solid #ECF4FC;

	color: #275BA7;

	font-weight: 600;

}

/* --responsive----------------------------------------------------------------------------------------------------------------- */

/* 640pixel start */

@media screen and ( max-width : 640px ){

form#mail_form{

	width : 95%;

}

form#mail_form dl{

	overflow : visible;

}

form#mail_form dl dt{

	width : auto;

	float : none;

	text-align : left;

	padding : 10px 0 5px;

	font-weight : bold;

}

form#mail_form dl dd{

	width : auto;

	float : none;

	border-top : none;

	padding : 0px 0 13px 0px;

}

/* -- for JavaScript ここから -------------------------------------------------------------------------------- */

form#mail_form dl dt span.required,

form#mail_form dl dt span.optional{

	margin-right : 1em;

	margin-bottom : 2em;

}

/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */

form#mail_form input#form_submit_button{

	margin-left : 0;

}

form#mail_form input#phone,

form#mail_form input#schedule{

	width : 50%;

}

}

/* 640pixel end */