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

.wrap .workframe { overflow: hidden; }

/* contType */
.contType , .contact-form { float: left; width: 50%; }
.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: #e6ae29; border-radius: 50%; display: block; left: 10px; top: 21px; content: ""; }
.contact-form p input[type="text"] , .contact-form p textarea { width: calc(100% - 44px); }
.contact-form p input#Checknum { width: 60px; }
.contact-form p.checknum font { margin-top: 12px; float: right; }
.contact-form p.checknum font i { width: 7px; height: 7px; background: #e6ae29; border-radius: 50%; display: inline-block; }
.contact-form p.send { text-align: right; }
.contact-form p.send a#btnOK { margin-top: 15px; padding: 5px 30px; background: #0d3275; border-radius: 20px; display: inline-block; color: #fff; }
.contact-form p.send a#btnOK i { margin-left: 6px; vertical-align: baseline; }

/* order orderWrap */
#order { overflow: hidden; position: relative; margin: 20px 5px; border-radius: 10px; box-shadow: 0 0 10px 5px rgba(0,0,0,.05); }
#order .orderWrap { overflow: hidden; padding: 20px; }
#order .orderWrap > div { position: relative; margin: 10px; float: left; width: calc((100% / 4) - 20px); }
#order .orderWrap > div a.Del { position: absolute; padding: 2px 5px; top: 0; right: 0; background: #FC0004; color: #fff; z-index: 10; }
#order .orderWrap > div .img a.photo { position: relative; background-size: cover; }
#order .orderWrap > div .img a.photo img { width: 100%; }
#order .orderWrap > div .img a.photo font { position: absolute; padding: 0 10px; width: calc(90% - 20px); height: 36px; background: rgba(26, 37, 62, 0.7); display: block; text-align: center; line-height: 200%; font-size: 18px; color: #fff; left: 5%; bottom: 20px; -webkit-line-clamp: 1; }
#order .orderWrap > div .qut { margin: 10px; text-align: center; font-size: 16px; }
#order .orderWrap > div .qut input { margin-left: 10px; padding: 0 10px; width: calc(100% - 70px); }
#order .orderWrap > div .price { margin: 10px; color: #3f3f3f; font-size: 18px; }
#order .orderWrap > div .price p { display: inline-block; vertical-align: baseline; font-size: 15px; color: #858585; }
#order .orderWrap > div .price p:nth-child(2) { margin-left: 10px; }
#order .orderWrap > div .price b { font-size: 20px; margin: 0 2px 0 10px; color: #e42d2d; }

/* 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: 960px) {
	.contType, .contact-form { width: 100%; }
	.contType > div { margin-right: 10px; float: left; width: calc(50% - 10px); }
	.contType > div a { padding-left: 95px; }
	#order .orderWrap > div { width: calc((100% / 3) - 20px); }
}
@media screen and (max-width: 640px) {
	.contType > div { margin-right: 0; width: 100%; }
	#order .orderWrap > div { width: calc((100% / 2) - 20px); }
}
@media screen and (max-width: 480px) {
	#order .orderWrap > div { width: calc(100% - 20px); }
}