@charset "utf-8";
/**
深圳市玖叁网络
*/

/*全局样式*/
div,form,img,ul,ol,li,dl,dt,dd,p,tr,td,body,strong,span,pre,input{margin:0; padding:0; border:0; background-repeat:no-repeat; border-radius:0;}
h1,h2,h3,h4,h5,h6,p{ margin:0; padding:0; font-weight:normal;}
body{ background: #fff; font-family:"Microsoft YaHei";font-size:14px;margin:0px;padding:0px;color:#1a1a1a;line-height:24px;height:auto;clear:both;}
img,input,button,a,select,textarea{margin:0;padding:0;resize:none;border:none;outline:none;} 
ul,li{ list-style:none;}
em,i{ font-style:normal;}
a{ text-decoration:none; color:#666; cursor:pointer;}
a:hover{ background-repeat:no-repeat; color: #f08519;}
input,textarea { outline:none; font-family:"Microsoft YaHei"; }
.m{width: 100%;}
.cont{width: 1200px;margin: 0 auto;}
.cont1{width: 1400px;margin: 0 auto;}
.fl{float: left;}
.fr{float: right;}
.clear{clear: both;}
img { vertical-align:middle;}


  
.bxybanner {position: relative;overflow: hidden; height: 550px;}
.bxybanner .bxypic li {width: 100%; height: 100%; overflow: hidden; position: absolute;background-repeat:no-repeat;background-position:top center; min-width: 1080px;}
.bxybanner .bxypic li a { display:block; width:100%; height:100%;}
.bxybanner .hd { width: 100%; position: absolute;bottom: 20px;text-align: center;}
.bxybanner .hd li {display: inline-block; width: 60px;height: 10px; border-radius: 4px;margin: 0 2px;background: #e6e6e6;}
.bxybanner .hd li.on { background: #4ab33c!important;}
.bxybanner .prev {width:44px;height:44px;position:absolute;top:50%;margin:-40px 0 0;cursor:pointer;text-indent:-999em;display:none;background: url(../images/slider-arrow.png) -110px 5px no-repeat; left: 5%;}
.bxybanner .next {width:44px;height:44px;position:absolute;top:50%;margin:-40px 0 0;cursor:pointer;text-indent:-999em;display:none;background: url(../images/slider-arrow.png) 0px 5px no-repeat; right: 5%;}



/*竖线*/
.line{width: 2px;height: 81px;background: #4ab33c;margin: 0px auto 50px;z-index: 999999999999999; position:relative;}
/*关于我们*/
@keyframes icon-bounce {
  0%, 100% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  25% {
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  50% {
    -moz-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  75% {
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  85% {
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
}
@-webkit-keyframes icon-bounce {
  0%, 100% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  25% {
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  50% {
    -moz-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  75% {
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  85% {
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
}
@-moz-keyframes icon-bounce {
  0%, 100% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  25% {
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  50% {
    -moz-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  75% {
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  85% {
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
}
@-o-keyframes icon-bounce {
  0%, 100% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  25% {
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  50% {
    -moz-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  75% {
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  85% {
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
}
.main1_title{margin-bottom: 50px;}
.main1_title i{background: #4ab33c;width: 49px;height: 4px;margin: 0 auto;display: block;margin-bottom: 20px;}
.main1_title h2{font-size: 35px;color: #333;font-weight: bold;line-height: 50px;text-align: center;}
.main1_title p{font-size: 18px;color: #666;text-align: center;}
.about_cont{height: 543px;background: url(../images/about_bg.jpg) center center;}
.about_cont p{text-align: center;font-size: 16px;color: #666666;line-height: 35px;padding-top: 20px;}
.about_cont ul{width: 900px;margin: 50px auto 30px;}

.about_cont ul li{float: left;margin:0 3% 0 1%;width: 20%;}
.about_cont ul li i { background:url(../images/about_icon1.png) no-repeat center bottom; width:144px; height:144px; display:block;margin: 0 auto;}
.about_cont ul li a:hover i { background:url(../images/about_icon01.png) no-repeat center bottom;}
.service-item{display: block;float: left;width: 100%;}
.service-item:hover .service-icon {
  -webkit-animation: icon-bounce 0.5s alternate;
  -moz-animation: icon-bounce 0.5s alternate;
  -o-animation: icon-bounce 0.5s alternate;
  animation: icon-bounce 0.5s alternate;
}
.about_cont ul .ys2 a i { background:url(../images/about_icon2.png) no-repeat center bottom;}
.about_cont ul .ys2 a:hover i { background:url(../images/about_icon02.png) no-repeat center bottom;}
.about_cont ul .ys3 a i { background:url(../images/about_icon3.png) no-repeat center bottom;}
.about_cont ul .ys3 a:hover i { background:url(../images/about_icon03.png) no-repeat center bottom;}
.about_cont ul .ys4 a i { background:url(../images/about_icon4.png) no-repeat center bottom;}
.about_cont ul .ys4 a:hover i { background:url(../images/about_icon04.png) no-repeat center bottom;}
.service-icon-wrap {text-align: center;display: block;height: 150px;}
.service-item p{text-align: center;line-height: 35px;font-size: 16px;color: #666;}
/*服务项目*/
.main_fw{height: 850px;background: rgba(76,175,80,0.6); margin-bottom: 50px;}
.mainfw_ti{text-align: center;line-height: 50px;color: #fff;padding-top: 84px;}
.mainfw_ti h2{font-weight: bold;font-size: 48px;text-transform:uppercase;font-family: Cambria;}
.mainfw_ti p{font-size: 24px;}
.main_fw ul li{float: left;margin: 50px 140px 20px 0;}
.main_fw ul li:nth-child(5n){margin-right: 0;}
.main_fw ul li p{text-align: center;text-align: center;color: #fff;line-height: 30px;}
/*车型展示*/
.line_1{width: 2px;height: 81px;background: #4ab33c;top:-40px;z-index: 999999999999999;position: absolute;left: 50%;}
.cx_top{background: #fff;height: 335px;box-shadow: 0 0 10px #b9b6b6;margin-top: -136px;margin-bottom: 57px;position: relative;}
.cx_title{text-align: center;padding-top: 60px;}
.cx_top h2{font-size: 38px;font-weight: bold;color: #333;line-height: 60px;}
.cx_top p{color: #555;font-size: 18px;line-height:32px;}
.cxdh{width: 1110px;margin: 40px auto 0;}
.cxdh_left{width: 100%;border-right: 1px #e0e0e0 dashed;padding-right: 50px;float: left; text-align:center;}
.cxdh_right{width: 500px;float: left;padding-left: 50px;}
.cxdh_left h3{font-size: 16px;color: #4ab33c;background: url(../images/cx_icon.jpg) left center no-repeat;padding-left: 18px;}
.cxdh_list{margin-top: 15px;}
.cxdh_list a{display: inline-block;color: #666;padding: 5px 10px;margin:0 4px; background: #4ab33c;color: #fff;}
.cxdh_list a:hover{background: #25a914;color: #fff;}
.cxdh_right h3{font-size: 16px;color: #4ab33c;background: url(../images/cx_icon.jpg) left center no-repeat;padding-left: 18px;}
.cx_bot { overflow:hidden; width:105%; margin:30px auto 50px; height:auto;}
.cx_bot li{ float:left; width:378px; height:315px; margin-right:33px; margin-bottom:30px; border:1px solid #dfdfdf; position:relative; border-radius:5px;}
.cx_bot li:nth-child(3n){margin-right:0px;}
.cx_bot img{ display:block;}
.cx_bot .img1{ display:block; width:100%; height:100%;}
.cx_bot .more{ position:absolute; right:0; bottom:0}
.cx_bot a{ display:none; border-radius:5px; position:absolute; left:0; top:0; width:100%; height:100%; background:url(../images/cx_w.png) repeat center; z-index:1; text-decoration:none}
.cx_bot span{ display:block; text-align:center; font-size:16px; color:#fff; margin-top:125px;}
.cx_bot em{ display:block; width:120px; height:40px; border:1px solid #008fdc; text-align:center; line-height:40px; font-size:14px; color:#fff; margin:10px auto;border-radius: 5px;background: #008fdc;}
.cx_bot li:hover .more{ display:none}
.cx_bot li:hover a{ display:block}


/*服务项目*/
.main_cnall{background: url(../images/main_cnbg.jpg) center center no-repeat;height: 739px;margin-bottom: 70px;}
.line2{width: 2px;height: 81px;background: #4ab33c;top:-40px;z-index: 999999999999999;position: absolute;left: 50%;}
.maintiall{position: relative;padding-top: 50px;}
.main_cnti{height: 139px;background: url(../images/mian_cnti1.png) center center no-repeat;color: #fff;text-align: center;padding-top: 47px;position: relative;}
.main_cnti h2{font-size: 46px;font-weight: bold;line-height: 70px;}
.main_cnti p{font-size: 20px;line-height: 78px;}
.main_cnti a{display: block;width: 180px;height: 47px;background: #4ab33c;font-size: 16px;text-align: center;line-height: 47px;color: #fff;margin: 0 auto;border-radius: 5px;border-bottom: 3px #1a770e solid;}


.cn_list{background: #fff;height: 770px;margin-top: -434px;}
.cn_list h2{font-weight: bold;font-size: 48px;text-transform:uppercase;font-family: Cambria;color: #000;text-align: center;line-height: 50px;padding-top: 50px;}
.cn_list p{font-size: 24px;color: #555;text-align: center;line-height: 50px;}
.main_cnti2{position: relative;padding-top: 20px;}
.line3{width: 2px;height: 81px;background: #4ab33c;top:-40px;z-index: 999999999999999;position: absolute;left: 50%;}
.cn_list ul{margin-top: 50px;}
.cn_list li{width: 300px;height: 240px;float: left;}
.cn_list li:nth-child(1),.cn_list li:nth-child(3),.cn_list li:nth-child(6),.cn_list li:nth-child(8){background: #fafafa;}
.cn_list li:nth-child(2),.cn_list li:nth-child(4),.cn_list li:nth-child(5),.cn_list li:nth-child(7){background: #f2f2f2;}
.cn_list ul li a:hover .service-icon {
  -webkit-animation: icon-bounce 0.5s alternate;
  -moz-animation: icon-bounce 0.5s alternate;
  -o-animation: icon-bounce 0.5s alternate;
  animation: icon-bounce 0.5s alternate;
}

.cn_list ul li i { background:url(../images/cn_icon1.png) no-repeat center bottom; width:79px; height:79px; display:block;margin: 15px auto 15px;}
.cn_list ul li.fwcn2_list2 i{background:url(../images/cn_icon2.png) no-repeat center bottom;}
.cn_list ul li.fwcn2_list3 i{background:url(../images/cn_icon3.png) no-repeat center bottom;}
.cn_list ul li.fwcn2_list4 i{background:url(../images/cn_icon3.png) no-repeat center bottom;}
.cn_list ul li.fwcn2_list5 i{background:url(../images/cn_icon5.png) no-repeat center bottom;}
.cn_list ul li.fwcn2_list6 i{background:url(../images/cn_icon6.png) no-repeat center bottom;}
.cn_list ul li.fwcn2_list7 i{background:url(../images/cn_icon7.png) no-repeat center bottom;}
.cn_list ul li.fwcn2_list8 i{background:url(../images/cn_icon8.png) no-repeat center bottom;}
.cn_list ul li a{display: block;float: left;width: 100%;}
.cn_list ul .fwcn2_list1{background: #fafafa;}

.cn_list ul li h3{
  font-weight: 700;
  text-transform: uppercase;
  font-size: 18px;
  text-align: center;
  margin: 0;line-height: 35px;color: #333;
}
.cn_list ul li p{text-align: center;line-height: 30px;font-size: 14px;color: #666;padding: 0px 15px;}


/*案例展示*/

.pageTopic{font-weight: normal;text-align: center;padding-bottom: 40px;}
.pageTopic p{font-size: 18px;color: #555555;line-height: 36px;}
.pageTopic span{display: block;font-size: 38px;color: #333;text-transform: uppercase;font-weight: 600;margin-bottom:10px;line-height: 60px;}

.anliList{margin-bottom: 40px !important;}
.anliList .hot{margin-bottom: 40px;}
.anliList{width: 1200px;margin: 0 auto;}
.anliList .hot .bd{height: 233px;margin-bottom: 40px;}
.anliList .hot .bd ul{width: 1200px;}
.anliList .hot .bd li{width: 342px;float: left;margin-right: 40px;border-bottom: 3px solid #cdcdcd;height: 300px;}
.anliList .hot .bd li .pic{display: block;width: 342px;height: 233px;overflow:hidden;float: left;position: relative;}
.anliList .hot .bd li .pic img{display: block;width: 100%;height: 100%;transition: all .4s;}
.anliList .hot .bd li .pic  em{ cursor: pointer;height: 235px;width: 350px; left: -405px;position: absolute;top: 0;transform: skewX(-25deg);transition: all 0s;
     background-image:-moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));

     background-image:-webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));

     background-image:-o-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));

     background-image:-ms-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));z-index:2

}

.anliList .hot .bd li p{margin-top: 24px;margin-left:22px;color:#000;float: left;height: 25px;line-height: 25px;}
.anliList .hot .bd li b{float: right;width: 86px;display:block;height: 25px;line-height: 25px;color:#4ab33c;text-align:center;margin-top: 25px;margin-right: 22px;border: 1px solid #cdcdcd;border-radius: 5px;}
.anliList .hot .bd li:hover a{color:#ffffff;text-decoration: none; }
.anliList .hot .bd li:hover p,.anliList  .hot .bd li:hover b{color:#FFF; }
.anliList .hot .bd li:hover{background-color:#4ab33c; border-bottom:none;}
.anliList .hot .bd li:hover .pic img{transform: scale(1.1);}
.anliList .hot .bd li:hover .pic  em{left:405px;transition: all 0.7s;}
.anliList .hot .hd ul{text-align: center;margin-top: 100px;}

.anliList .hot .hd li{display: inline-block;width: 25px;height: 25px;background-image: url(../images/ban-ico3.png);background-repeat: no-repeat;background-position: center;margin: 0 5px;overflow:hidden;text-indent: 1000px;}

.anliList .hot .hd li:hover,.anliList  .hot .hd .on{background-image: url(../images/ban-ico4.png);}

a.artic_amore{width: 120px;height: 35px;line-height: 35px;text-align: center;font-size: 15px;color: #333;border:2px solid #e9e9e9;display: block;margin: 0 auto;text-decoration: none;}
a:hover.artic_amore{background: #4ab33c;color: #fff;border:3px solid #4ab33c;border:2px solid #4ab33c;}


.bxyy{ width:100%; height:711px; background:url(../images/bxyy.png) no-repeat top center; margin-top:80px;}
.bxyyn{ width:1100px; height:100%; position:relative; margin:0 auto;}
.bxyy1{ width:100%; text-align:center; font-size:38px; font-weight:bold; color:#fff; padding-top:110px;}
.bxyy li{ width:158px; height:175px; position:absolute;}
.bxyy li p{ width:138px; padding:10px; height:120px;background:url(../images/bxyyp.png) no-repeat top center; text-align:justify; font-size:13px; color:#000; line-height:22px; display:none;}
.bxyy li i{ width:138px; height:120px; padding:10px; display:block;}
.bxyy li span{ display:block; width:100%; text-align:center; font-size:16px; color:#fff;}
.bxyy li:hover p{ display:block;}
.bxyy li:hover i{ display:none;}
.bxyy .li1{left:22px; top:180px;}
.bxyy .li2{left:309px; top:180px;}
.bxyy .li3{left:591px; top:180px;}
.bxyy .li4{left:872px; top:180px;}
.bxyy .li5{left:22px; top:385px;}
.bxyy .li6{left:309px; top:385px;}
.bxyy .li7{left:591px; top:385px;}
.bxyy .li8{left:872px; top:385px;}


.bxyz{ width:635px; height:60px;background:url(../images/bxyz.png) no-repeat bottom center; text-align:center; font-size:37px; color:#333; margin:0 auto; font-weight:bold; margin-top:60px; margin-bottom:20px;}
.bxyz1{ width:100%; text-align:center; font-size:17px; color:#555; margin-bottom:60px;}


.bxyzz{ width:1200px; margin:0 auto; overflow:hidden;}
.bxyzzz{ float:right; width:600px; height:365px;}
.bxyzzz li{ border-left:5px solid #fff; width:575px; padding-left:20px; height:78px; margin-bottom:16px; border-bottom:1px solid #e3e3e3; position:relative;}
.bxyzzz li:hover{ border-left:5px solid #4ab33c;height:79px; background:#f3f4f5; border-bottom:0; }
.bxyzzz li i{ display:block; font-style:normal; position:absolute; right:12px; top:30px;color:#666;}
.bxyzzz li span{ width:500px; font-size:16px; color:#333; position:absolute; top:12px; left:20px;}
.bxyzzz li p{ width:500px; font-size:14px; color:#999; position:absolute; top:40px; left:20px;}
.bxyzzz li:hover span{ color:#4ab33c;}
.bxyzzz li:hover i{ color:#666;}

.bxyzzy{ float:left; width:565px; height:365px;}
.bxyzzyn{ width:565px; height:365px; position:relative;}
.bxyzzyn img{ width:100%; height:100%;}
.bxyzzyn .bxyzzyn1{ width:100%; height:65px; background:rgba(0,0,0,0.6); position:absolute; left:0; bottom:0; z-index:1;}
.bxyzzyn .bxyzzyn1 span{ display:block; width:525px; margin:0 auto; font-size:14px; color:#fff; margin-top:8px;}
.bxyzzyn .bxyzzyn1 p{ width:525px; margin:0 auto; font-size:12px; color:#fff;}


.bxyxin{ width:1200px; overflow:hidden; margin:0 auto; margin-bottom:130px; margin-top:20px;}
.bxyxin a{ float:right; font-size:14px; color:#666;}
.bxyxin a:hover{ color:#4ab33c;}

