@charset "utf-8";
form#mail_form{
 width : 600px;
 margin : 0px auto 50px;
 padding : 10px 0;
 background : rgba(255, 255, 255, 0.45);
 border : 1px solid #cccccc;
 border-radius : 7px;
}
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 : 20px 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;
 font-weight : bold;
 color : #ffffff;
 padding : 3px 5px;
 border-radius : 3px;
 text-shadow : 0px -1px 0px #222222;
}
form#mail_form dl dt span.required{
 background : rgba(255, 0, 0, 0.8);
}
form#mail_form dl dt span.optional{
 background : rgba(0, 0, 255, 0.8);
}
form#mail_form dl dd span{
 display : block;
 color : #ff0000;
}
/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */


form#mail_form input{
 height : 2em;
 padding : 2px 2%;
 border : 1px solid #cccccc;
 border-radius : 3px;
 background : #fafafa;
}
form#mail_form textarea{
 width : 90%;
 height : 200px;
 padding : 2px 2%;
 resize : vertical;
 border : 1px solid #cccccc;
 border-radius : 3px;
 background : #fafafa;
}
form#mail_form input:focus,
form#mail_form textarea:focus{
 box-shadow : 0px 0px 5px #55ccff;
 border : 1px solid #55ccff;
 background : #ffffff;
}
form#mail_form input#name_1,
form#mail_form input#name_2{
 width : 30%;
}
form#mail_form input#read_1,
form#mail_form input#read_2{
 width : 30%;
}
form#mail_form input#mail_address,
form#mail_form input#mail_address_confirm{
 width : 80%;
}
form#mail_form ul li{
 list-style-type : none;
 margin-bottom : 0.5em;
}
form#mail_form ul li label:hover{
 cursor : pointer;
}
form#mail_form ul li input{
 height : auto;
 margin-right : 0.5em;
}
form#mail_form input#postal{
 width : 30%;
}
form#mail_form input#address_1,
form#mail_form input#address_2{
 display : block;
 width : 90%;
 margin-bottom : 7px;
}
form#mail_form input#phone{
 width : 30%;
}
form#mail_form input#schedule{
 width : 30%;
}
form#mail_form dl +p{
 width : 90%;
 margin : 0 auto;
 padding : 15px 0;
 border-top : 1px solid #cccccc;
}
form#mail_form input#mail_submit_button{
 width : auto;
 height : auto;
 padding : 4px 10px;
 margin-left : 35%;
 vertical-align : middle;
 color : #444444;
 background : #eeeeee;
 border : 1px solid #cccccc;
 border-radius : 3px;
 font-family : inherit;
 font-weight : bold;
}
form#mail_form input#mail_submit_button:hover{
 cursor : pointer;
 color : #106dff;
 background : #e0e0e0;
}
/* --responsive------------------------------------------- */

/* 640pixel start */
@media screen and (max-width : 640px){
 form#mail_form{
 width : 95%;
}
form#mail_form dl{
 }
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;
}
/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */

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#mail_address,
form#mail_form input#mail_address_confirm,
form#mail_form input#postal,
form#mail_form input#address_1,
form#mail_form input#address_2,
form#mail_form input#phone,
form#mail_form input#schedule,
form#mail_form textarea{
 max-width : 90%;
 -webkit-appearance : none;
}
form#mail_form input#mail_submit_button{
 padding : 7px 15px;
 margin-left : 0;
 -webkit-appearance : none;
}
}
/* 640pixel end */

