@charset "utf-8";
/* -- Contact ------ */
form { margin: 0px; }
#form.white select,#form.white input,#form.white option,#form.white textarea,#form.white input[type="radio"],#form.white input[type="checkbox"]{
color: #000; background:rgba(255,255,255,.4); border: 1px solid  rgba(0,0,0,.2);font-family: 'Noto Sans SC', sans-serif;}
#form select,#form input,#form option,#form textarea,#form input[type="radio"]+label, #form input[type="checkbox"]+label{ transition: background-color 0.5s; -moz-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; -ms-transition: background-color 0.5s; -o-webkit-transition: background-color 0.5s; -webkit-box-sizing:border-box;	-moz-box-sizing:border-box;	box-sizing:border-box;  outline: none;}
#form input:invalid {  background-color: #E00; }
#form input::-webkit-input-placeholder{ color: #000;}
.company_map{padding-bottom:10px; }

/*------ form ------*/
#form {width:100%; margin:0 auto; display: block;}
#form ul { display: block; margin:5% auto 5% auto; padding: 0; width: 100%; list-style: none; overflow: hidden; }
#form ul li { display:block; width: 100%;  margin:2% auto; font-size: 13px; overflow: hidden;}
#form li input { padding: 0 10px; width: 100%; height: 40px; line-height: 40px; }
#form ul li select { padding: 0 0 0 5px; width: 100%; height: 40px; line-height: 40px;  }
#form ul li option { padding: 5px 10px;}
#form ul li textarea { padding: 5px 10px; width: 100%; height: 100px; line-height: 20px; }
#form li.comment { display:block; width: 100%; margin-left:0px !important;  }
#form ul li.code input { width:50%; margin-right: 10px; }
#form ul li.code img{ background-color:#fff;}
#form ul li select:focus { color: #666; }
#form ul li select:focus option { color: #666; padding: 5px 0px; }
#form ul li textarea:focus, #form ul li input:focus { background: #eee; color: #000; }
#form input[type="radio"], #form input[type="checkbox"] { display: none }
#form input[type="radio"]+label, #form input[type="checkbox"]+label { box-sizing: border-box; padding: 5px 10px 5px 2%; display: inline-block; cursor: pointer; vertical-align: middle; border-radius: 4px; margin-bottom: 3vw; background-color: #eee; color: #000; -moz-transition: color 0.2s ease, background-color 0.2s ease; -o-transition: color 0.2s ease, background-color 0.2s ease; -webkit-transition: color 0.2s ease, background-color 0.2s ease; transition: color 0.2s ease, background-color 0.2s ease; }
#form input[type="radio"]+label:before, #form input[type="checkbox"]+label:before { content: ""; display: inline-block; vertical-align: middle; overflow: hidden; height: 22px; width: 22px; background-color: #fff; border-radius: 50%; margin: -1px 7px 0 0; -moz-transition: border-color 0.2s ease, background-color 0.2s ease; -o-transition: border-color 0.2s ease, background-color 0.2s ease; -webkit-transition: border-color 0.2s ease, background-color 0.2s ease; transition: border-color 0.2s ease, background-color 0.2s ease; }
#form input[type="radio"]:nth-of-type(2n+1)+label, #form input[type="checkbox"]:nth-of-type(2n+1)+label { margin-right: 4% }
#form input[type="radio"]:checked+label, #form input[type="checkbox"]:checked+label { border: 1px solid #b70021; color: #fff; background-color: #1399EA }
#form input[type="checkbox"]:checked+label:before { background: #fff url("../images/icon.svg") no-repeat; background-position: -244px -56px }
#form input[type="radio"]:checked+label:before { background: #fff url("../images/icon.svg") no-repeat; background-position: -104px -60px }
#form ul.send { display: block;width: 100%;}
#form ul.send li{ display: inline-block; width:48%; }
#form ul.send li input{ width:80%; background: #b70021; padding:.1em; height:auto !important; color:#fff; vertical-align: middle; text-align: center; font-size: 1.35em; border-radius:10px; border: none;  }

#form ul.send li input[type="reset"]{background:#2f3948!important;}

#form ul.send li input:hover { background:#7e90ae; display: block; }
.contact{ background: url(../images/bg/contact.jpg) no-repeat center top; background-size: cover;}	
.contact h1{ color:#fff !important;padding-top:70px;}
form.formular ul li span, form.formular ul li div {font-size: 16px;}

/* -- 767px ----------------*/
@media screen and (min-width: 767px) {
#form.white.contact_all {max-width: 720px;width: 100%;margin: 2% auto;display: block;}
#form ul li { display: inline-block; list-style: none; padding: 0; width:48%; margin: 0 0px 18px 0; overflow: hidden }
#form ul li:nth-child(even) { margin-left: 20px; }
#form li input { max-width: 350px; }
#form ul li select { max-width: 350px; }
#form ul li.code { margin-left: 0; }
#form ul li.send a { max-width: 350px; }
#form input[type="radio"]+label, #form input[type="checkbox"]+label { padding: 0.5rem 0; border: none; margin-bottom: 0; background-color: transparent }
#form input[type="radio"]+label:before, #form input[type="checkbox"]+label:before { height: 22px; width: 22px; border: 1px solid #ccc }
#form input[type="radio"]:hover+label, #form input[type="checkbox"]:hover+label { color: #000 }
#form input[type="radio"]:checked+label,#form input[type="checkbox"]:checked+label { border: none; color:#000; background-color: transparent; font-weight: bold }
#form input[type="radio"]:checked+label:before,#form input[type="checkbox"]:checked+label:before { border-color: #b70021; }
/*size*/
#form .col-full{width: 100% !important;}
#form .col-2 {width: 48%;}
#form .col-3 {width: 33%;}
#form .col-4 {width: 22%;}


}
