@charset "utf-8";





h1 {

	color:#f19500;;

	font-size:28px;

	line-height:1.2;

	text-align: center;

}



form#mail_form{

	width : 960px;

	margin : 50px auto;

	padding : 10px 0;

	background : #ffffff;

	border : 1px solid #cccccc;

	border-radius : 7px;

	box-shadow : 0 0 7px rgba( 0, 0, 0, 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 : 65%;

	float : right;

	border-top : 1px solid #cccccc;

	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 : 85%;

	color : #3377ff;

}





/* -- 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 : #d9534f;

	border : 1px solid #d43f3a;

}



form#mail_form dl dt span.optional{

	background : #337ab7;

	border : 1px solid #2e6da4;

}



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;

}



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 : 30%;

}



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{

	width : 90%;

}





form#mail_form p#form_submit{

	width : 90%;

	margin : 0 auto;

	padding : 15px 0;

	border-top : 1px solid #cccccc;

}



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

	padding : 9px 15px;

	vertical-align : middle;

	line-height : 1;

	background : #5cb85c;

	border : 1px solid #4cae4c;

	border-radius : 3px;

	color : #ffffff;

	font-family : inherit;

	-webkit-appearance : none;

	font-size : 100%;

}



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

	cursor : pointer;

	background : #449d44;

	border : 1px solid #398439;

}



form#mail_form input#form_submit_button{

	margin-left : 35%;

}

















/* --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;

}



form#mail_form dl dt span{

	font-weight : normal;

}





/* -- 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 */







