/* contText */
.contText { margin: 15px 0; }

#sideNav{background: #2f2f2f;padding-bottom: 0px;}
.wrap .workframe { overflow: hidden; }



/* contType */
.contType , .contact-form { float: left; width: calc(100% - 350px); }
.contType > div { overflow: hidden; margin: 0 0 20px; width: 60%; border-radius: 20px; background: url(/images/13/material-op60.png) center #254899; color: #fff; }
.contType > div:nth-child(1) { background-color: #17bf43; }
.contType > div:nth-child(2) { background-color: #479ac3; }
.contType > div:nth-child(3) { background-color: #e5a91c; }
.contType > div a { padding: 10px 10px 10px 105px; background: url(/images/13/icon-mail.png) no-repeat 15px center; background-size: contain; display: block; color: #fff; }
.contType > div:nth-child(1) a { background-image: url(/images/13/icon-line.png); }
.contType > div:nth-child(2) a { background-image: url(/images/13/icon-map.png); }
.contType > div:nth-child(3) a { background-image: url(/images/13/icon-phone.png); }

/* contact-form */
.contact-form { margin-bottom: 15px; }
.contact-form p { position: relative; margin-bottom: 10px; }
.contact-form p.required:before { position: absolute; width: 7px; height: 7px; background: #ef1234; border-radius: 50%; display: block; left: 10px; top: 21px; content: ""; }
.contact-form p input[type="text"] , .contact-form p textarea { width: 100%; }
.contact-form p input#Checknum { width: 120px; }
.contact-form p.checknum font { margin-top: 12px; float: right; }
.contact-form p.checknum font i { width: 7px; height: 7px; background: #ef1234; border-radius: 50%; display: inline-block; }
.contact-form p.send { text-align: right; }
.contact-form p.send a#btnOK { margin-top: 15px; padding: 5px 45px; background: #ef1234; display: inline-block; color: #fff; }
.contact-form p.send a#btnOK i { margin-left: 6px; vertical-align: baseline; }

/* order orderWrap */
#order{margin:0 auto}
#order .orderWrap{margin-bottom:15px}
#order .orderWrap .orderList{overflow:hidden;position:relative;padding:10px 0;border-bottom:1px #8e8e8e dashed}
#order .orderWrap .orderList p{width:15%;float:left}
#order .orderWrap .orderList p:first-child{width:40%}
#order .orderWrap .orderList p label{padding-bottom:5px;border-bottom:2px #005f5e solid;text-align:center;display:none}
#order .orderWrap .orderList:first-child p label{display:block}
#order .orderWrap .orderList p b{margin:5px 20px;display:block;line-height:100px;text-align:center}
#order .orderWrap .orderList p:first-child b{text-align:left}
#order .orderWrap .orderList p b a{color:#000}
#order .orderWrap .orderList p b img{margin-right:15px;height:100px}
#order .orderWrap .orderList p input[type="text"]{padding:0 10px;width:30px;border:1px #ddd solid;font-size:16px}
#order .orderWrap .orderList p input[type="button"]{margin-left:0;padding:5px 10px;background:#ec3939;border-color:#901c1c;font-size:14px;font-weight:400;color:#fff}
#order .orderWrap .orderList p input[type="button"]:hover{background:#901c1c}
#order #orderTotal p{margin:10px 0;text-align:right}
#order .button{margin:15px 0 30px;text-align:center}
#order .button p.link{text-align:right}
#order .button p{width:49%;display:inline-block}
#order .button p a{padding:10px 20px;background:#8c7d68;display:inline-block;font-weight:400;color:#fff}
#order .button p.link a{background:#e17b60}
#order .button p a i{vertical-align:initial}
#order .button p a:hover{opacity:.7}
#order .orderWrap .orderList p b img{margin-right:15px;height:100px;max-width: 160px;}
#order .orderWrap .orderList p b span{display: inline-block;max-width:calc(100% - 180px);line-height: 1;}
.wrap input[type="number"], .wrap input[type="text"], .wrap textarea{box-sizing: border-box;}
.order-contact-form .contact-form{width: 100%;}

/* order checkoutBox */
#order .checkoutBox { padding: 20px; background: #1f4da1; }
#order .checkoutBox p { margin: 10px 0; text-align: right; font-size: 18px; color: #fff; }
#order .checkoutBox .button { text-align: right; }
#order .checkoutBox .button a { margin-top: 15px; padding: 5px 30px; background: #404040; border-radius: 20px; display: inline-block; color: #fff; }
#order .checkoutBox .button a.backP { margin-left: 10px; background: #0098e4; }
#order .checkoutBox .button a i { margin-left: 6px; vertical-align: baseline; }

@media screen and (max-width:1280px) {
.contact-form,#order{width:100%}
}

@media screen and (max-width: 1024px) {
	.contType, .contact-form{float: none;width: 100%;}
}
@media screen and (max-width: 960px) {
	.contType, .contact-form { width: 100%; }
	.contType > div { margin-right: 10px; float: left; width: calc(50% - 10px); }
	.contType > div a { padding-left: 95px; }
}
@media screen and (max-width: 768px) {
#order .orderWrap .orderList{border-bottom:0}
#order .orderWrap .orderList p,#order .orderWrap .orderList p:first-child{float:none;width:100%;border-bottom:1px #8e8e8e dashed}
#order .orderWrap .orderList p label,#order .orderWrap .orderList:first-child p label,#order .orderWrap .orderList p b{margin:0;padding:10px 0;width:49%;display:inline-block;line-height:33px;border-bottom:0}
#order .orderWrap .orderList p:first-child label,#order .orderWrap .orderList p:first-child b{width:100%;text-align:center}
#order .orderList p b a{height:auto}
#order .orderWrap .orderList p:first-child label{border-bottom:2px #0c6b69 solid}
#order .orderWrap .orderList p b img{margin:0 auto 10px;max-width:100%;height:auto!important;display:block}
}
@media screen and (max-width: 640px) {
	.contType > div { margin-right: 0; width: 100%; }
}