@charset "utf-8";
/* CSS Document */


/*名称*/
.tits{text-align:center;margin-bottom:4%;}
.tits h1{color:#e0e6eb;font-size:60px;font-family:"1";letter-spacing:1px;}
.tits h2{font-size:35px;transform:translateY(-40px);-webkit-transform:translateY(-40px);-moz-transform:translateY(-40px);-o-transform:translateY(-40px);}
.tits p{margin-top: -2%;font-size:14px;color:#8d8d8d;}

@media screen and (max-width:1024px) {
.tits h1{font-size:50px;}
.tits h2{font-size:25px;}

}


@media screen and (max-width:500px) {
.tits h1{font-size:35px;transform:translateY(-10px);-webkit-transform:translateY(-10px);-moz-transform:translateY(-10px);-o-transform:translateY(-10px);}
.tits h2{font-size:20px;}
.tits p{margin-top: -8%;}
}

/*焦点图*/
.indexbanner{position:relative;}
.indexbanner .swiper-pagination-bullet{ text-align:left;opacity:1; font-family:Arial, Helvetica, sans-serif;width:2em; height:2em; background:none;border-radius:0; color:#fff; position:relative; margin:0 5px;}
.indexbanner .swiper-pagination-bullet:after{content:''; position:absolute; left:0; width:100%; bottom:0; height:2px; background-color:#fff;}
.indexbanner .swiper-pagination-bullet:before{ z-index:888;content:''; position:absolute; left:0; width:0%; bottom:0; height:2px; background-color:#0183dc;opacity:1;}
.indexbanner .swiper-pagination-bullet-active:before{width:100%; transition: width 7s ease-out 0s;}
.indexbanner .swiper-pagination-bullet i{font-style:normal; opacity:0;}
.indexbanner .swiper-pagination-bullet-active i{opacity:0}
.indexbanner .swiper-pagination-index-banner{ position:static; margin:0 auto; width:auto; max-width:75em; padding:0 1em;text-align:center;}
.banner_footer{position:absolute;right:0; bottom:5%;left:0;text-align:center; width:100%; z-index:10;}

.mask { height: 100%; position: absolute;width:100%; z-index: 4;top: 0%; left: 0; background: url(../images/mask.png) center;}
.indexbanner .ban{  position: absolute;width:100%; z-index: 6;top:34%;left: 0;text-align:center;}
.pcbannerimg2{display:none;}
@media screen and (max-width: 1140px) {
.indexbanner{padding-top:5em}
.indexbanner .ban{width:85%;left: 5%;right: 5%;}
}
@media screen and (max-width: 750px) {
.indexbanner .swiper-pagination-bullet:after , .indexbanner .swiper-pagination-bullet:before{    height: 1px;}
.indexbanner .ban{width:75%;left: 12.5%;right: 12.5%;}
.pcbannerimg2{display:block;}
.video{display:none !important;}

}

/*产品分类*/

.index01{background:url(../images/bg1.jpg) no-repeat top center;background-size:cover;padding:4% 0;overflow:hidden;}
.index01 .list_c{overflow:hidden;margin-bottom:3%;}
.list_c li{width:25%;float:left;}
.list_c li a{display:block;border:1px solid #97d6ea;margin:3%;color:#fff;padding:4% 3%}
.list_c li:hover{background:#0183dc url(../images/index01.png) no-repeat right bottom}

.index01 .tel{float:right;text-align:right;}
.index01 .tel span{background:url(../images/index02.png) no-repeat left center;padding-left: 2em;color:#e0e0e0}
.index01 .tel b{color:#fff;font-family:"1";font-size:40px;font-weight:normal;letter-spacing:2px;}
.index01 .tel a{display:block;}
@media screen and (max-width:1024px) {
.list_c li{width:33.33%;}
.index01 .tel b{font-size:30px;}

}


@media screen and (max-width:500px) {
.list_c li{width:50%;}
.index01 .tel b{font-size:22px;letter-spacing:0;}
.list_c li:hover{background-size:25%;}
}


/*产品中心*/
.index02{background:#f0f6fc url(../images/bg2.png) no-repeat bottom center;padding: 5% 0 7% 0;overflow:hidden;}
.index02 .tits{/* margin-bottom:2%; */}

.index02 .prolist{position:relative;padding-bottom:5%;}
.prolist a{display:block;overflow:hidden;background:#fff;text-align:center;width:100%;height:100%;}
.prolist a:before{position:absolute;content:"";height:0;width:100%;background:url(../images/index09.png);left:0;right:0;top:0;bottom:0;transition: all 0.6s ease 0s; -webkit-transition: all 0.6s ease 0s;-moz-transition: all 0.6s ease 0s;-o-transition: all 0.6s ease 0s;}
.prolist a:hover:before{height:100%;}
.prolist a .m{position:absolute;width:100%;text-align:center;top:-100%;transition: all 0.6s ease 0s; -webkit-transition: all 0.6s ease 0s;-moz-transition: all 0.6s ease 0s;-o-transition: all 0.6s ease 0s;z-index:-1}
.prolist a:hover .m{top:40%;bottom:50%;z-index:1}

.prolist .pro_tt{padding:0 0 3% 0}


.index02 .swiper-button-next, .index02 .swiper-button-prev {width: 50px;height: 50px;cursor: pointer;background-size: 100%;background-position: center; background-repeat: no-repeat;bottom:-8%}
.index02 .swiper-button-next{background-image: url(../images/right.png);right:45%;}
.index02 .swiper-button-prev {background-image: url(../images/left.png);left: 45%;}

@media screen and (max-width:1024px) {
.index02 .swiper-button-next{right:40%;}
.index02 .swiper-button-prev {left: 40%;}
}

@media screen and (max-width:500px) {
.index02 .prolist{padding-bottom:8%}
.index02 .swiper-button-next, .index02 .swiper-button-prev{background-size:70%;}
.index02 .swiper-button-next{right:35%;}
.index02 .swiper-button-prev {left: 35%;}
}


/*关于我们*/
.index03{background:url(../images/bg3.jpg) no-repeat bottom center;background-size:cover;overflow:hidden;}

.index03 .left{width:25%;margin-top:12%;}
.index03 .tits {text-align:left;}
.index03 .tits h1{color:#7e848e;}
.index03 .tits h2{color:#fff;}

.index03 .left .con{margin-top:5%;}

.index03 .left .con p{line-height:2em;color:#e0e0e0;    overflow: hidden;display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.index03 .left .con a.more{display:inline-block;margin-top:4em;}

.index03 .left .con a:hover{ transform: translateY(-15px);}



.index03 .right{width:60%}
.index03 .right li{width:50%;float:left;min-height:275px;border:1px solid #fff;}
.index03 .right li a{display:block;width:100%;min-height:275px;position:relative}
.index03 .right li:first-child , .index03 .right li:last-child{border:none;}
.index03 .right li:nth-child(2), .index03 .right li:nth-child(5){border-top:none;border-bottom:none;}
.index03 .right li:nth-child(3){border-right:none;}

.index03 .right li a .aa{position:absolute;height:100%;top:0;left:13%;right:13%;}
.index03 .right li a:hover{background:url(../images/index09.png);}
.right li .aa .tit h3{color:#fff;font-size:24px;float:left;margin-top:3%;}
.right li .aa .tit .pic{position:relative;float:right;width:50px;height:50px;overflow:hidden;}
.right li .aa .tit .pic img{display:block;position:absolute;}
.right li .aa .tit .pic .p1{ top:0;transition: all 0.6s ease 0s; -webkit-transition: all 0.6s ease 0s;-moz-transition: all 0.6s ease 0s;-o-transition: all 0.6s ease 0s;}
.right li .aa .tit .pic .p2{ top:100%;transition: all 0.6s ease 0s; -webkit-transition: all 0.6s ease 0s;-moz-transition: all 0.6s ease 0s;-o-transition: all 0.6s ease 0s;}
.right li a:hover .aa .tit .pic .p2{ top:0;}
.right li a:hover .aa .tit .pic .p1{ top:-100%;}

.right li .aa  p{line-height:1.8em;margin-top:1.5em;color:#e0e0e0;font-size:14px;}

@media screen and (max-width:1024px) {
.index03 .left{width:35%;}
.index03 .right li a .aa{left:6%;right:6%;}
.index03 .right li:first-child , .index03 .right li:last-child{display:none;}
.index03 .right li:nth-child(3) {border-right:1px solid #fff;border-left:none;border-top:none;border-bottom:none;}
.index03 .right li:nth-child(5){border-left:none;border-top: 1px solid #fff;}
.right li .aa .tit h3{font-size:20px;}
.right li .aa .tit .pic{width:40px;height:40px;}
}

@media screen and (max-width:780px) {

.index03 .left , .index03 .right{width:100%;}
.index03 .right{margin-top:5%;}
.index03 .tits{margin-bottom:0;}
.index03 .left .con{margin-top:0;}
.index03 .left .con a.more{margin-top:1em}
.index03 .right li:nth-child(2) , .index03 .right li:nth-child(3){border-top:1px solid #fff;}
.index03 .right li:nth-child(5){border-bottom:1px solid #fff;}
.index03 .right li , .index03 .right li a{min-height:230px;}
.right li .aa .tit h3{font-size:18px;}
.right li .aa .tit .pic{width:35px;height:35px;}
}



/*案例*/
.index04{padding:5% 0;overflow:hidden;}


.case_c ul li{ position:relative; min-height:32em;float:left; width:13.4%; margin-right:1.4%;overflow:hidden;cursor:pointer;-webkit-transition-duration: 0.5s; -ms-transition-duration: 0.5s; -o-transition-duration: 0.5s; -moz-transition-duration: 0.5s; transition-duration: 0.5s;}
.case_c ul li:before{position:absolute;content:"";background:url(../images/index10.png);width:100%;height:100%;top:0;bottom:0;left:0;right:0;z-index:333;transition: all 0.6s ease 0s; -webkit-transition: all 0.6s ease 0s;-moz-transition: all 0.6s ease 0s;-o-transition: all 0.6s ease 0s;}
.case_c ul li:last-child{ margin-right:0;margin-top:3em;}
.case_c ul li:nth-child(2){margin-top:3em;}
.case_c ul li:nth-child(2):before{background:url(../images/index12.png);}
.case_c ul li.on{width:55.45454545454545%;}
.case_c ul li a{display:inline-block;}

.case_c_bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-position:center; background-repeat:no-repeat;background-size: cover;}
.case_c_t{position:absolute; top:8em;left:1.5em;z-index:334; width:100%; color:#fff;}

.case_c_t .tt span{color:#fff;font-weight:800;font-size:20px;display:inline-block;}
.case_c ul li a:hover .case_c_t .tt span{color:#0183dc;}
.case_c_t .tt img{display:none;margin-left:3%;}
.case_c li.on .case_c_t .tt img{display:inline-block;}
.case_c ul li.on:before{width: 100%;height:100%;background: url(../images/index22.png);transition: all 0.6s ease 0s; -webkit-transition: all 0.6s ease 0s;-moz-transition: all 0.6s ease 0s;-o-transition: all 0.6s ease 0s;}


@media screen and (max-width:1320px) {
.case_c_t{left:1.5em;}
}


@media screen and (max-width:1024px) {

.case_c_t .tt span{font-size:16px;}
.case_c_t{left:1em;}
}

@media screen and (max-width:750px) {
.case_c ul li{width:48%;min-height:25em;margin-right: 2%;margin-bottom:2%}
 .case_c ul li.on{width:48%;}
.case_c ul li:nth-child(2) , .case_c ul li:last-child{margin-top:0}
.case_c_t .tt span{font-size:14px;}
}

@media screen and (max-width:500px) {

.case_c ul li{min-height:16em;}

}




/*新闻*/
.index05{background:#f0f6fc url(../images/bg4.png) no-repeat bottom center;overflow:hidden;padding:5% 0;}
.index05 .new , .index05 .new_t {overflow:hidden;}
.index05 .tits{text-align:left;width:50%;margin-bottom: 2%;}
.index05 .new_t .right{width:50%;text-align:right;margin-top:2%;}
.new_t .right a{display:inline-block;padding:2% 5%;background:#e4e6e8;margin-left: 1%;}
.new_t .right a:hover{background-color: #0183dc;background-image: linear-gradient(to top, #0183dc , #01c0dc); background-image: -webkit-linear-gradient(bottom,#0183dc , #01c0dc);color:#fff;}

.new_c ul{overflow:hidden;}
.new_c ul li{width:32%;float:left;margin:0 0 2% 0;background:#fff;}
.new_c ul li:nth-child(2), .new_c ul li:nth-child(5){margin:0 2% 2%}

.new_c ul li a{display:block;overflow:hidden;padding:7% 5%}
.new_c ul li .date{width:25%;text-align:center;}
.new_c ul li .date h1{color:#a3a3a3;font-size:50px;}
.new_c ul li .date h4{color:#a3a3a3;font-size:14px;}
.new_c ul li .des{width:72%;}
.new_c ul li .des h2{    overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:1;}
.new_c ul li .des p{color:#a3a3a3;font-size:14px;line-height:1.8em;margin:3% 0;    overflow: hidden;display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.new_c ul li .des img{display:inline-block;float:right}

.new_c ul li a:hover .des h2{color:#0183dc;text-decoration:none;}


@media screen and (max-width:1024px) {
.new_c ul li{width:48%;margin:0 1% 2% 1%;}
.new_c ul li:nth-child(2), .new_c ul li:nth-child(5){margin:0 1% 2% 1%;}
.new_c ul li .date h1{font-size:40px;}

}

@media screen and (max-width:710px) {
.index05 .tits{width:100%;text-align:center;margin-bottom: -2%;}
.index05 .new_t .right{width:100%;text-align:center;margin-top:0;margin-bottom:4%;}
.new_c ul li{width:100%;margin:0 0 2% 0;}
.new_c ul li:nth-child(2), .new_c ul li:nth-child(5){margin:0 0 2% 0;}
.new_c ul li a{padding:4%}
.new_c ul li .des h2{ font-size:16px}
}

@media screen and (max-width:500px) {
.new_c ul li .des p{-webkit-line-clamp: 1;}
.index05 .tits{margin-bottom: -6%;}
.new_c ul li .date h1 { font-size: 30px;}

}