@charset "utf-8";
/* CSS Document */
.contact{ width:1570px; margin:0 auto;}
.contact ul{ width:100%; float:left; margin-top:100px;}
.contact ul li{ width:25%; float:left; padding:0 16px;}
.contact ul li .box{ width:100%; float:left; background:#fafafa; text-align:center; padding:0 50px 10px 50px; height:234px;
-moz-border-radius:6px; 
-webkit-border-radius:6px; 
-khtml-border-radius:6px;
border-radius:6px;}
.contact ul li .box .iconfont{ display:inline-block; vertical-align:top; width:104px; height:104px; background:#db0001; margin-top:-53px;
-moz-border-radius:50%; 
-webkit-border-radius:50%; 
-khtml-border-radius:50%;
border-radius:50%; color:#fff;box-shadow: 2px 2px 10px 0 rgba(58,83,107,0.12); font-size:46px; line-height:104px;}
.contact ul li .box h5{ width:100%; margin-top:27px; line-height:23px; font-size:18px; color:#333; letter-spacing:2px;}
.contact ul li .box h6{ width:100%; line-height:18px; font-size:12px; color:#888787; letter-spacing:1px; font-family:Arial; text-transform:uppercase;}
.contact ul li .box .jj{ width:100%; margin-top:19px; line-height:16px; font-size:14px; color:#666; letter-spacing:1px;}
.contact ul li .box .btn{ width:100%; height:88px; line-height:88px; position:relative; margin-top:10px;}
.contact ul li .box .btn .ewm{ width:88px; height:88px; position:absolute; left:50%; top:0; margin-left:-44px; padding:5px; background:white; overflow:hidden; opacity:0;
-moz-border-radius:6px; 
-webkit-border-radius:6px; 
-khtml-border-radius:6px;
border-radius:6px;
-webkit-transition: all 0.5s ease-out 0s; 
-moz-transition: all 0.5s ease-out 0s; 
-o-transition: all 0.5s ease-out 0s; 
transition: all 0.5s ease-out 0s;}
.contact ul li .box .btn .ewm img{ width:100%; float:left;}
.contact ul li .box .btn:hover .ewm{ opacity:1;}
@media screen and  (max-width:1570px){
.contact{ width:1300px; margin:0 auto;}
}
@media screen and  (max-width:1280px){
.contact{ width:1180px; margin:0 auto;}
}
@media screen and  (max-width:768px){
.contact{ width:92%; margin:0 auto;}
.contact ul{ width:100%; float:left; margin-top:20px;}
.contact ul li{ width:100%; float:left; padding:0 40px; margin-bottom:20px;}
.contact ul li .box{ width:100%; float:left; background:#fafafa; text-align:center; padding:0; height:auto;-moz-border-radius:6px; -webkit-border-radius:6px; -khtml-border-radius:6px;border-radius:6px; position:relative; padding-bottom:20px;}
.contact ul li .box .iconfont{ display:block; vertical-align:center; width:60px; height:60px; background:#db0001; margin-top:0;margin-left:-20px;
-moz-border-radius:50%; -webkit-border-radius:50%; -khtml-border-radius:50%;border-radius:50%; color:#fff;box-shadow: 2px 2px 10px 0 rgba(58,83,107,0.12); font-size:32px; line-height:60px; position:absolute; top:25%;}
.contact ul li .box .jj{ width:100%; margin-top:10px; line-height:16px; font-size:14px; color:#666; letter-spacing:1px;}
.contact ul li .box h5{ width:100%; margin-top:27px; line-height:23px; font-size:16px; color:#333; letter-spacing:0;}
.contact ul li .box .btn .ewm{opacity:1;}
}

.contact2{ width:100%; float:left; margin:30px 0 0 0; position:relative;}
.contact2 .ditu{ width:100%; height:698px;}
.Ued-map{position:relative; height:698px; min-width:100%;}
#allmap{width:100%;height: 100%;overflow: hidden;margin:0;}
.contact2 .message{ position:absolute; right:60px; top:60px; background:rgba(255,255,255,0.9); box-shadow:0 0 10px rgba(0,0,0,0.06); padding:32px 40px 40px 40px; width:550px;}
.contact2 .message h3{ width:100%; font-size:30px; color:#db0001; line-height:47px; font-weight:bold; padding-left:22px; position:relative;}
.contact2 .message h3:before{ content:''; width:6px; height:30px; background:#db0001; position:absolute; left:0; top:50%; margin-top:-15px;}
.contact2 .message h5{ width:100%; margin-top:5px; font-size:16px; color:#333; line-height:23px; position:relative; letter-spacing:1px;}
.contact2 .message ul{ width:100%; float:left; margin-top:12px;}
.contact2 .message ul li{ width:100%; float:left; margin-top:14px; border:solid 1px #e7e7e7; padding:0 30px 0 105px; position:relative;}
.contact2 .message ul li .name{ position:absolute; left:0; top:0; line-height:52px; font-size:16px; color:#333; text-align:center; width:105px;}
.contact2 .message ul li .name:before{ content:''; width:1px; height:22px; position:absolute; right:0; top:50%; margin-top:-11px; border-right:dashed 1px #b2b2b2;}
.contact2 .message ul li span{ position:absolute; right:19px; top:0; line-height:52px; font-size:16px; color:#dd6e0f;}
.contact2 .message ul li input{ display:block; width:100%; height:52px; line-height:22px; padding:10px; font-size:14px; color:#333; background:none;appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
outline: 0;
border:0}

.contact2 .message ul li.l1{ border:0; padding:0; margin-top:20px;}
.contact2 .message ul li.l1 input{ width:100%; cursor:pointer; height:58px; line-height:58px; background:#db0001; text-align:center; color:white; font-size:16px; overflow:hidden; padding:0;
-moz-border-radius:29px; 
-webkit-border-radius:29px; 
-khtml-border-radius:29px;
border-radius:29px;}
.contact2 .message ul li.l1 input:hover{ opacity:0.8;}
@media screen and  (max-width:1570px){
.contact2 .ditu{ width:100%; height:600px;}
.Ued-map{position:relative; height:600px; min-width:100%;}
.contact2 .message{ position:absolute; right:60px; top:50px; background:rgba(255,255,255,0.9); box-shadow:0 0 10px rgba(0,0,0,0.06); padding:32px 40px 40px 40px; width:500px;}
.contact2 .message h3{ width:100%; font-size:26px; color:#db0001; line-height:47px; font-weight:bold; padding-left:22px; position:relative;}
}
@media screen and  (max-width:1280px){
.contact2 .ditu{ width:100%; height:500px;}
.Ued-map{position:relative; height:500px; min-width:100%;}
.contact2 .message{ position:absolute; right:60px; top:30px; background:rgba(255,255,255,0.9); box-shadow:0 0 10px rgba(0,0,0,0.06); padding:32px 20px 40px 20px; width:400px;}
.contact2 .message h3{ width:100%; font-size:22px; color:#db0001; line-height:47px; font-weight:bold; padding-left:22px; position:relative;}
.contact2 .message h5{ width:100%; margin-top:5px; font-size:14px; color:#333; line-height:23px; position:relative; letter-spacing:1px;}
.contact2 .message ul li .name{ position:absolute; left:0; top:0; line-height:40px; font-size:14px; color:#333; text-align:center; width:105px;}
.contact2 .message ul li .name:before{ content:''; width:1px; height:22px; position:absolute; right:0; top:50%; margin-top:-11px; border-right:dashed 1px #b2b2b2;}
.contact2 .message ul li span{ position:absolute; right:19px; top:0; line-height:40px; font-size:14px; color:#dd6e0f;}
.contact2 .message ul li input{ display:block; width:100%; height:40px; line-height:22px; padding:10px; font-size:14px; color:#333; background:none;appearance: none;-moz-appearance: none;-webkit-appearance: none;outline: 0;border:0}
.contact2 .message ul li.l1 input{ width:100%; cursor:pointer; height:45px; line-height:45px; background:#db0001; text-align:center; color:white; font-size:14px; overflow:hidden; padding:0;-moz-border-radius:29px; -webkit-border-radius:29px; -khtml-border-radius:29px;border-radius:29px;}
}
@media screen and  (max-width:768px){
.contact2 .message{ position:absolute; right:4%; top:30px; background:rgba(255,255,255,0.9); box-shadow:0 0 10px rgba(0,0,0,0.06); padding:20px; width:92%;}
}
