@charset "utf-8";

/* Common style */
html{ overflow-y:scroll; overflow-x:auto; box-sizing:border-box;}
*,*:before,*:after{ box-sizing:inherit;}
body,h1,h2,h3,h4,h5,h6,p,form{ margin:0;}
body,input{font: menu; font-size:14px;}
h1,h2,h3,h4,h5,h6{ font-size:100%;}
ul{ margin:0; padding:0; list-style:none;}
a img,input,button,textarea{ border:none;}
table{ border-collapse:collapse; border-spacing:0; width:100%;}

/* Link Style */
a{ color:#333; text-decoration:none;}
a:hover{ color:#f94540;}
a:visited{ outline:none;}

/* Body Style */
.section{ position:relative;}
body{color: #000;}
.con,.con2{ margin:0 auto;}
.hiden{overflow: hidden;}
.n{font-weight: normal;}
.b{font-weight:bolder;}
.red{color:#f94540 !important;}
.tl{text-align: left;}
.tc{text-align: center;}
.s13{font-size: 13px;}
.s15{font-size: 15px;}
.s16{font-size: 16px;}
.s18{font-size: 18px;}
.s20{font-size: 20px;}
.s24{font-size: 24px;}
.s26{font-size: 26px;}
.s30{font-size: 30px;}
.s35{font-size: 35px;}
.line36{line-height: 36px;}
.c7{color: #777;}
.pt50{padding-top: 50px;}
.mt10{margin-top: 10px;}
.big{text-transform: uppercase;}

/* header */
header{width:100%;height: 62px;position: fixed;top: 10px;z-index: 2;transition: 0.5s;}
header *{transition: 0.5s;}
.logo{width: 85px;float: left;margin: 0 20px 0 0;}
nav{float: left;}
nav a{display: inline-block;color: #fff;font-weight: bolder;margin: 20px 15px 0;font-size: 13px;}
.top-btn{float: right;position: relative;margin-top: 18px;}
.top-btn a,.top-btn span{display: inline-block;vertical-align: middle;}
.top-mail{width: 27px;height: 17px;background: url(../images/top-mail.png) no-repeat;background-size:100% 100%;text-indent: -9999px;margin-right: 20px;}
.top-mail:hover{background-image: url(../images/top-mail-2.png);}
.top-weixin{width: 29px;height: 23px;background: url(../images/top-weixin.png) no-repeat;background-size:100% 100%;text-indent: -9999px;margin-right: 20px;cursor: pointer;}
.top-weixin:hover{background-image: url(../images/top-weixin-2.png);}
.top-search{width: 23px;height: 24px;position: relative;margin-right: 20px;}
.search-icon{width: 23px;height: 24px;background: url(../images/top-search.png) no-repeat;background-size:100% 100%;cursor: pointer;position: absolute;z-index: 1;}
.search-icon:hover{background-image: url(../images/top-search-2.png);}
header .search-input{display:none;position: absolute;z-index: 2;width: 300px;height:48px;background: #000;top:-12px;right: -19px;}
.search-input *{vertical-align: middle;}
.search-text{width: 230px;height:48px;line-height:48px;color: #fff;background: none;padding: 0 10px;}
.search-close{width: 14px;height: 14px;margin-right:5px;background: url(../images/close.png) no-repeat;cursor: pointer;}
.search-close:hover{background-image: url(../images/close-2.png);}
.search-btn{width: 23px;height: 24px;background: url(../images/top-search-2.png) no-repeat;background-size:100% 100%;cursor: pointer;}
.search-btn:hover{background-image: url(../images/top-search.png);}
.language{color: #fff;font-size: 12px;}
.language a{color: #fff;}
.code-img{display:none;width: 70px;height: 70px;padding: 3px;background: #fff;position: absolute;top: 33px;left: 42px;}
.black{background: #000;top: 0;}
.black .logo{width: 56px;margin: 12px 49px 0 0;}
.black .top-mail{background-image: url(../images/top-mail-2.png);}
.black .top-mail:hover{background-image: url(../images/top-mail.png);}
.black .top-weixin{background-image: url(../images/top-weixin-2.png);}
.black .top-weixin:hover{background-image: url(../images/top-weixin.png);}
.black .search-icon{background-image: url(../images/top-search-2.png);}
.black .search-icon:hover{background-image: url(../images/top-search.png);}

/* banner */
.banner{width: 100%;position: relative;z-index: 1;}
.slide{position: relative;overflow: hidden; width: 100%;}
.slide li{position: absolute;display: none;width: 100%;left: 0;top: 0;overflow: hidden;}
.slide img{display: block;width: 100%;height: auto;position:relative;z-index: 1;}
.banner-con{z-index: 2;left: 0;width: 100%;position: absolute;transition:1s;top:30%;bottom: auto;}
.banner-1 h1{width: 301.5px;height: 100px; margin: 0 auto;font-size: 56px;color: #FFF;}
.banner-1 h2{width: 262px;height: 50px;margin: 0 auto 30px;color: #FFF;font-size: 30px;}
.banner-1 p{width: 387px;height: 33px;margin: 0 auto;color: #FFF;font-size: 26px;text-align: center;}
.slide1_on h1{opacity: 0;animation: banner 0.5s forwards;}
.slide1_on h2{opacity: 0;animation: banner 0.5s 0.5s forwards;}
.slide1_on p{opacity: 0;animation: banner 0.5s 1s forwards;}
.banner-2 h3{font-size: 56px;color: #fff;margin-top: 30px;line-height: 1;}
.banner-2 h4{font-size: 26px;color: #fff;margin: 22px auto 50px;line-height: 1;}
.banner-2 a{display: inline-block;width: 130px;line-height: 40px;color: #fff;background:#333;background: rgba(0,0,0,0.7);text-align: center;font-size: 15px;}
.banner-2 a:hover{background:#222;background: rgba(0,0,0,0.8);}
.slide1_on h3{opacity: 0;animation: banner 0.5s forwards;}
.slide1_on h4{opacity: 0;animation: banner 0.5s 0.5s forwards;}
.slide1_on a{opacity: 0;animation: banner 0.5s 1s forwards;}
@keyframes banner{
	from{opacity: 0;transform: translateY(20px);}
	to{opacity: 1;transform: translateY(0);}
}
.slide_nav{position: absolute;width: 30px;height: 60px;top: 40%;z-index:3;text-indent:-9999px;opacity:0.2;}
.banner .prev{background: url(../images/prev.png) no-repeat;left:1%;background-size: 100% 100%;}
.banner .next{background: url(../images/next.png) no-repeat;right:1%;background-size: 100% 100%;}
.slide_nav:hover{opacity:0.7;}

/*服务内容*/
.service{padding-top: 110px;}
.service h3{margin: 20px 0;}
.service p{line-height: 30px;text-align: left;color: #161616;}
.service h4{margin-top: 100px;}
.title-line{text-transform: uppercase;margin-top: 5px;font-family: Arial;text-align: center;font-size: 15px;}
.title-line:after{content:"";display: block;width: 22px;height: 2px;background: #303030;margin: 20px auto 0;}
.service ul{overflow: hidden;padding-top: 20px;}
.service li{float:left;width:25%;}
.service li:before{content: "+";float: left;margin-top: 60px;font-size: 25px;}
.service li:first-child:before{display: none;}
.service li h6{margin: 40px 0 10px;}
.service li p{text-transform: uppercase;text-align: center;line-height: 20px;font-family: Arial;}
.service-icon{margin: 30px auto 0;width: 118px;height: 118px;position: relative;}
.service-icon span{position: absolute;}
.icon-bg{width: 118px;height: 118px;border: 2px solid #fff;border-radius: 50%;left: 0;top: 0;transition: 0.1s;}
.icon-img{width: 118px;height: 118px;border: 2px solid #ededed;border-radius: 50%;left: 0;top: 0;transition: 0.2s;}
.service li:hover .icon-bg{transform: scale(1.1);border-color: #f94540;}
.service li:hover .icon-img{border-color: #f94540;}
.service-1 .icon-img{background: #f5f5f5 url(../images/icon-1.png) center no-repeat;}
.service-2 .icon-img{background: #f5f5f5 url(../images/icon-2.png) center no-repeat;}
.service-3 .icon-img{background: #f5f5f5 url(../images/icon-3.png) center no-repeat;}
.service-4 .icon-img{background: #f5f5f5 url(../images/icon-4.png) center no-repeat;}
.service-1:hover .icon-img{background: #f94540 url(../images/icon-5.png) center no-repeat;}
.service-2:hover .icon-img{background: #f94540 url(../images/icon-6.png) center no-repeat;}
.service-3:hover .icon-img{background: #f94540 url(../images/icon-7.png) center no-repeat;}
.service-4:hover .icon-img{background: #f94540 url(../images/icon-8.png) center no-repeat;}
.banner-cen{width: 100%;margin: 120px 0 0;position: relative;}
.banner-cen img{width: 100%;position: relative;z-index: 1;}
.banner-cen-word{width: 100%;position: absolute;z-index: 2;left: 0;top: 30%;text-indent: -9999px;}
.banner-cen-word h2{width: 259px;height: 47px;background: url(../images/word-1.png) no-repeat;margin: 0 auto;}
.banner-cen-word h3{width: 426px;height: 37px;background: url(../images/word-2.png) no-repeat;margin: 20px auto 0;}

/*案例*/
.case{padding-top: 120px; position: relative;}
.case-box{position: relative;}
.case-wrap{width: 100%;position: absolute;top: 0;}
.slideTxtBox{width: 100%;position: relative;}
.slideTxtBox .bd ul{ overflow:hidden; zoom:1;float:left;width: 100%;}
.slideTxtBox .bd ul li{ float:left;overflow:hidden;margin: 0;width: 33.3%;position: relative; cursor: ;}
.slideTxtBox .bd ul li img{width:100%;z-index: 1;display: block;}
.slick-slide{ position:relative; height:100%;}
.slick-slide img{ position:relative; z-index:1; display:block;}
.case-con{opacity:0;filter:alpha(opacity=0);width: 100%;height: 100%;background:#f94540;background: rgba(249,69,64,0.9);position: absolute;top: 0;left: 0;color: #fff;padding: 10%;transition: 0.3s; z-index:2;}
.slick-slide:hover .case-con{opacity:1;filter:alpha(opacity=100);}
.case-con p{margin-top: 20px;}
.case-con span{position: absolute;bottom: 10%;background: url(../images/case-icon.png) no-repeat;line-height: 34px;padding-left: 45px;}
.slideTxtBox .hd{ width:100%;position: relative;}
.case-icon{ width: 100%;text-align: center;padding: 60px 0 35px;}
.case-icon li{display: inline-block;overflow:hidden; cursor:pointer;margin: 0 35px;font-size: 14px;padding:0 0 8px 25px;}
.case-1{background: url(../images/case-1.png) 0 3px no-repeat;}
.case-2{background: url(../images/case-2.png) 8px 4px no-repeat;}
.case-3{background: url(../images/case-3.png) 5px 4px no-repeat;}
.case-4{background: url(../images/case-4.png) 5px 4px no-repeat;}
.case-icon li:hover{color: #f94540;}
.case-icon li.on{border-bottom: 2px solid #f94540;padding:0 0 6px 25px;}
.slideTxtBox .prev,.slideTxtBox .next{width:30px; height: 60px; position: absolute;cursor:pointer;top: 45%;z-index: 10;opacity: 0.2;}
.slideTxtBox .prev:hover,.slideTxtBox .next:hover{opacity: 0.7;}
.slideTxtBox .prev{background: url(../images/prev.png) no-repeat;background-size: 100% 100%;left: 20px;}
.slideTxtBox .next{background: url(../images/next.png) no-repeat;background-size: 100% 100%;right:20px;}
.case-info{padding-top: 40px;}
.case-info p{line-height: 36px;}
.slick { width: 100%;position: relative;}
.slick img {width:100%; height:auto;}
.slick-list{ position: relative; overflow: hidden;}
.slick-track { position: relative; left: 0; top: 0;}
.slick-slide{ float: left; height: 100%;}
.slick-prev,.slick-next{ width:30px; height: 60px; position: absolute;cursor:pointer;top: 45%;z-index: 10;opacity: 0.2;border:none; text-indent:-9999px;}
.slick-prev:hover,.slick-next:hover{opacity: 0.7;}
.slick-prev{background: url(../images/prev.png) no-repeat;background-size: 100% 100%;left: 20px;}
.slick-next{background: url(../images/next.png) no-repeat;background-size: 100% 100%;right:20px;}
.case-wrap-new{ position:relative;width: 100%;}
.case-seat{ position:relative; z-index:1; left:0; top:0; overflow:hidden;width: 100%; visibility:hidden;}
.case-seat li{ float:left; width:33%;}
.case-seat li img{ width:100%;}
.case-wrap-new .slick{ left:0; top:0; position:absolute; z-index:2;background: #FFF;}
.case-wrap-new .slick-this{ z-index:3;}

/*优势*/
.good{padding: 100px 0 0;}
.good h3{margin: 10px 0;}
.good-info{overflow: hidden;margin-top: 50px;position: relative;height: 666px;}
.good-info img{position: relative;z-index: 2;width: 100%;height: auto;left: 0;top: 0;display: none;}
.good-con{width: 100%;position: absolute;z-index: 3;left: 0;top: 0;height: 666px;padding-top: 120px;background: url(../images/good-bg.jpg) center no-repeat;}
.good-info li{float: left;width: 25%;border-left: 1px solid #837e7c;padding: 0 35px;color: #fff;height: 450px;}
.good-info li:first-child{border-left: none;}
.good-info li span{display: inline-block;width: 83px;height: 95px;}
.good-info li h2{text-transform: uppercase;margin-top: 20px;}
.good-info li p{text-align: left;margin: 40px 0 0 15px;line-height: 30px;}
/*.good-info li:last-child p{margin-top: 18px;}*/
.good-1 span{background: url(../images/good-1.png) center no-repeat;}
.good-2 span{background: url(../images/good-2.png) center no-repeat;}
.good-3 span{background: url(../images/good-3.png) center no-repeat;}
.good-4 span{background: url(../images/good-4.png) center no-repeat;}

/*关于我们*/
.about{padding: 150px 0 100px;}
.about .title-line{text-align: left;}
.about .title-line:after{margin-left: 0;}
.about-banner{width: 100%;height: 268px;background: url(../images/banner-center.jpg) center no-repeat;position: absolute;top: 62px;}
.about-info{float: left;width: 280px;}
.about-info h3{margin-top: 10px;}
.about-info p{margin-top: 40px;line-height: 32px;}
.about-img{float: right;width: 532px;}
.about-img img{float: left;width: 100%;height: auto;}
.foot-con{background: #e4e4e4;padding-top: 100px;}
.foot-con .title-line{text-align: left;}
.foot-con .title-line:after{margin-left: 0;}
.foot-con .fp-tableCell{display: block;padding-top: 70px;}
.brand-img{padding: 50px 0;margin: 0 auto;width: 960px;}
.brand-img img{width: 100%;height: auto}
.contact{width: 100%;position: relative;height: 680px;z-index: 1;background: url(../images/map-img.jpg) right center no-repeat;}
.contact-bg{width: 50%;height: 100%;background: rgba(38,38,38,0.8);position: absolute;top: 0;left: 0;z-index: 2;}
.contact-con{color: #fff;position: relative;z-index: 3;top: 120px;}
.contact-con ul{padding-top: 20px;}
.contact-con a{color: #fff;}
.contact-con a:hover{color:#f94540;}
.contact-con .title-line:after{background: #fff;}
.contact-con li{padding-left: 40px;margin-top: 30px;font-size: 16px; padding: 35px 0 0;line-height: 26px;}
.address{background: url(../images/address.png) 3px top no-repeat;}
.phone{background: url(../images/phone.png) no-repeat;}
.mail{background: url(../images/top-mail.png) 0 12px no-repeat;background-size: 30px 19px;}
.contact-big{height: 400px;}
.contact-big .contact-con{top: 50px;}

/* footer */
footer{width:100%;text-align: center;font-size: 14px;line-height: 50px;background: #1c1c1c;color: #888;}
.goTop{position: fixed;width: 55px;height: 55px;background:#555 url(../images/goTop.png) center no-repeat;
background: rgba(0,0,0,0.2) url(../images/goTop.png) center no-repeat;right: 20px;bottom: 20px;z-index: 2000;cursor: pointer;background-size: 25px 16px;}
.goTop:hover{background:#333 url(../images/goTop.png) center no-repeat;background: rgba(0,0,0,0.5) url(../images/goTop.png) center no-repeat;background-size: 25px 16px;}

/*手机端样式*/
.m-wrap{width: 7.5rem;margin: 0 auto;}
.m-img{width: 100%;display: block;}
.head-phone{height: 1.18rem;background: #000;width: 100%;position: relative;}
.m-logo{float: left;width: 1.08rem;margin: 0.25rem 0 0 0.5rem;}
.m-menu{float: right;margin:0.4rem 0.5rem 0 0;width: 0.56rem;height: 0.36rem;background: url(../images/m-menu.png) no-repeat;background-size: 100% 100%;}
.m-down{width: 100%;background: #1f1f1f;padding: 0.2rem 0.75rem 1.5rem;display: none;z-index: 1000;height: 6.34rem;
overflow: hidden;}
.m-down a{display: block;color: #fff;border-bottom: 1px dotted #4c4c4c;line-height: 1.16rem;font-size: 0.26rem;}
.m-banner-1{width: 7.5rem;}
.m-banner-1 img{width: 100%;display: block;}
.m-banner-1 h2{font-size: 0.24rem;}
.m-banner-1 h3{font-size: 0.38rem;margin-top: 0.2rem;}
.m-case{ padding: 0 0.3rem 0.7rem;background: #fff;}
.m-case li{margin-bottom: 0.5rem;}
.m-case li a{display: block;}
.m-case li img{width: 100%;}
.m-case li h2{margin: 0.1rem 0;font-size: 0.3rem;}
.m-case li p{color: #666;font-size: 0.26rem;}
.m-case-more{width: 100%;height:4.65rem;background: url(../images/m-case.png) no-repeat;background-size: 7.5rem 4.65rem;text-align: center;padding-top: 2.75rem;}
.m-case-more a{display: inline-block;width: 3.65rem;line-height: 0.86rem;color: #fff;border: 3px solid #f6d1ce;font-size: 0.26rem;text-transform: uppercase;
border-radius: 3px;font-family: Arial;}
.m-case-more a:after{content: "";display: inline-block;width: 0.17rem;height: 0.28rem;background: url(../images/case-bg.png) no-repeat;
background-size: 100% 100%;vertical-align: middle;margin-left: 0.25rem;position: relative;top: -0.02rem;}
.m-case-more a:active{background: #f6d1ce;color: #e65243;}
.m-code{overflow: hidden;width: 5.2rem;margin: 0 auto;}
.m-code li{float: left;width:50%;text-align: center;padding: 5px;color: #fff;font-size: 0.23rem;}
.m-code img{width: 90%;background:#fff;padding: 5px;margin-bottom: 0.1rem;}
.m-title{font-weight: normal;font-size: 20px;text-transform: uppercase;margin-top: 5px;text-align: center;}
.m-title:after{content: "";display: block;width: 19px;height: 14px;background: url(../images/m-ttile.png) no-repeat;margin: 15px auto 0;}
.ss38{font-size: 0.38rem;}
.m-banner-2{width: 7.5rem;}
.m-banner-2 img{width: 100%;}
.m-case-title{background: #212121;height: 1.1rem;text-align: center;}
.m-case-title li{display: inline-block;margin: 0 0.1rem;
    width: 20%;line-height: 1.1rem;}
.m-case-title a{font-size: 0.22rem;color: #919191;padding-left: 0.2rem;}
.m-case-1{background: url(../images/m-case-1.png) left center no-repeat;background-size: 0.16rem 0.16rem;}
.m-case-2{background: url(../images/m-case-2.png) left center no-repeat;background-size: 0.16rem 0.16rem;}
.m-case-3{background: url(../images/m-case-3.png) left center no-repeat;background-size: 0.16rem 0.16rem;}
.m-case-4{background: url(../images/m-case-4.png) left center no-repeat;background-size: 0.16rem 0.16rem;}
.m-case-this .m-case-1{background-image: url(../images/m-case-5.png);}
.m-case-this .m-case-2{background-image: url(../images/m-case-6.png);}
.m-case-this .m-case-3{background-image: url(../images/m-case-7.png);}
.m-case-this .m-case-4{background-image: url(../images/m-case-8.png);}
.m-case-title .m-case-this a{color: #fff;}
.m-about-img{background: #fff;padding:0.06rem 0 0;overflow: hidden;margin-bottom: 2rem;}
.m-about-img img{max-width: 100%;height: auto;}
.m-bg{background: #252525;}
.m-map{width: 100%;display: block;}
.m-case a:hover{color: #333;}

/*响应式*/
@media screen and (min-width: 1920px){
.good-info{height: auto;}
.good-info img{display: block;}
.good-con{background: none;height: auto;padding-top: 6%;}
}

@media screen and (min-width: 1200px){
.con{width:960px;}
.con2{width:1060px;}
}

@media screen and (min-width: 801px) and (max-width: 1200px){
.con,.con2{width: 96%;}
}

@media screen and (max-width: 800px){
.con,.con2{width: 100%;}
}

/*动画*/
.case-icon li{position: relative;opacity: 0;animation-play-state: paused;}
.case-1{animation: icon 1s forwards;top: 5px;}
.case-2{animation: icon 1s 0.3s forwards;top: 8px;}
.case-3{animation: icon 1s 0.6s forwards;top: 11px;}
.case-4{animation: icon 1s 0.9s forwards;top: 14px;}
.move .case-icon li{animation-play-state: running;}
@keyframes icon{
	from{opacity: 0;}
	to{opacity: 1;top: 0;}
}
@keyframes trans{
	from{opacity: 0;}
	to{opacity: 1;}
}

.banner-cen-word h2{position: relative;opacity: 0;top: 20px;animation: icon 0.5s 0.5s forwards;animation-play-state: paused;}
.banner-cen-word h3{position: relative;opacity: 0;top: 30px;animation: icon 0.5s forwards;animation-play-state: paused;}
.move .banner-cen-word h2{animation-play-state: running;}
.move .banner-cen-word h3{animation-play-state: running;}
.good-info li{opacity: 0;animation-play-state: paused;}
.good-info .move li{animation-play-state: running;}
.good-1{animation: trans 2s forwards;}
.good-2{animation: trans 2s 0.3s forwards;}
.good-3{animation: trans 2s 0.6s forwards;}
.good-4{animation: trans 2s 1s forwards;}

/*弹出*/
.detail-body{padding: 1% 0 2%;background: rgba(0,0,0,0.8);}
.detail-bg{width:100%;height:100%;cursor: zoom-out;position: fixed;z-index: 1;}
.detail-bg span{position: absolute;background: #fff;right: 10px;top: 0;cursor: pointer;width: 32px;height: 32px;
background: url(../images/close-3.png) no-repeat;text-indent: -9999px;}
.case-detail{width:90%;border-radius: 5px;cursor: default;position: relative;z-index: 2;left: 5%;}
.detail-banner{width: 100%;}
.detail-banner img{width: 100%;border-top-left-radius: 5px;border-top-right-radius: 5px;display: block;}
.detail-con{background: #fff;width:100%;padding: 0 10%;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;}
.detail-info{border-bottom: 1px dotted #c8c8c8;padding: 70px 0;}
.detail-info h2{font-size: 30px;font-weight: normal;margin-bottom: 10px;}
.detail-info p{line-height: 36px;font-size: 16px;}
.detail-wrap{overflow: hidden; padding: 50px 0;}
.detail-wrap img{max-width: 100%;height: auto !important;}
.layui-layer-shade{cursor: zoom-out;}