@charset "utf-8";
@import url("base.css");
#wrap { background:#FAFAFA; font:14px microsoft yahei; color:#333333;}
.top-box { width:100%; height:60px; margin:0 auto; background:#FFF;}
.top-box .top { width:1200px; height:60px; margin:0 auto; position:relative;}
.top-box .top .logo { width:400px; height:60px; position:absolute; top:0; left:0; font-size:22px; color:#000; text-shadow: 0 0 10px rgba(0,0,0,.2); float:left;}
.top-box .top .logo .icon { width:40px; height:40px; position:absolute; top:10px; left:0;}
.top-box .top .logo .icon img { width:40px; height:40px;}
.top-box .top .logo .text { width:350px; height:30px; line-height:30px; position:absolute; top:15px; left:50px; text-align:left;}


.top-box .top .zlogo { width:400px; height:60px; position:absolute; top:0; left:0; background:url(web/zlogo.png) center left no-repeat;}
.top-box .top .menu { width:500px; height:60px; position:absolute; top:0; left:400px;}
.top-box .top .menu li { float:left; height:60px; line-height:60px; margin-right:60px;}
.top-box .top .contact { width:200px; height:60px; line-height:60px; position:absolute; top:0; right:0; text-align:right;}
.banner-box { width:100%; height:500px; margin:0 auto; clear:both; background:url(web/banner.png) center center no-repeat;}



.service-box { width:1200px; height:600px; margin:0 auto; position:relative;}
.service-box .hd { width:1200px; height:30px; line-height:30px; position:absolute; top:50px; left:0; font-size:24px; text-align:center; color:#000; text-shadow: 0 0 10px rgba(0,0,0,.2);}
.service-box .left { width:378px; height:468px; border:1px #E7E7EB solid; background:#FFF; position:absolute; top:130px; left:0;}
.service-box .center { width:378px; height:468px; border:1px #E7E7EB solid; background:#FFF; position:absolute; top:130px; left:410px;}
.service-box .right { width:378px; height:468px; border:1px #E7E7EB solid; background:#FFF; position:absolute; top:130px; right:0;}

.service-box .bd .icon { width:90px; height:90px; position:absolute; top:80px; left:50%; margin-left:-45px; border-radius: 90px;}
.service-box .bd .title { width:80%; height:30px; line-height:30px; position:absolute; top:220px; left:10%; font-size:18px; text-align:center;}
.service-box .bd .text { width:80%; height:150px; line-height:20px; position:absolute; top:300px; left:10%; text-align:left; font-size:14px; color:#8D8D8D;}
.service-box .left .icon { background:url(web/wechat.png) center center no-repeat; background-size: 90px auto;}
.service-box .center .icon { background:url(web/miniprogram.png) center center no-repeat; background-size: 90px auto;}
.service-box .right .icon { background:url(web/sale.png) center center no-repeat; background-size: 90px auto;}


.case-box { width:1200px; height:600px; margin:0 auto; position:relative;}
.case-box .hd { width:1200px; height:30px; line-height:30px; position:absolute; top:50px; left:0; font-size:24px; text-align:center; color:#000; text-shadow: 0 0 10px rgba(0,0,0,.2);}
.case-box .case-1 { width:285px; height:475px; position:absolute; top:130px; left:0;}
.case-box .case-2 { width:285px; height:475px; position:absolute; top:130px; left:305px;}
.case-box .case-3 { width:285px; height:475px; position:absolute; top:130px; left:610px;}
.case-box .case-4 { width:285px; height:475px; position:absolute; top:130px; right:0;}

.case-box .bd .image { width:283px; height:473px; margin:0 auto; border:1px #E7E7EB solid; background:#FFF;}
.case-box .bd .image img { width:100%;}
.case-box .bd .title { width:100%; height:30px; line-height:30px; margin:20px auto; margin-bottom:0; font-size:14px; text-align:center;}


.footer-box { width:1200px; margin:100px auto; margin-bottom:100px; text-align:center;}
.footer-box span { padding:0 5px;}