/* banner */
.banner{width: 100%;height: 320px;position: relative;}
.img-swiper img{transition: all 10s;animation: fade 15s linear infinite;}

.txt-swiper .swiper-button-next{bottom: 5%;top: auto;right: calc(5% + 150px)!important;transform: rotate(-90deg);}
.txt-swiper .swiper-button-prev{bottom: 5%;top: auto;right: calc(5% + 210px)!important;transform: rotate(-90deg);}
.txt-swiper .swiper-slide{position: relative;}
.txt-swiper .swiper-slide .ib-bg{position: relative;width: 100%;max-width: 1300px;margin: 0 auto;height: 100%;padding: 0 15px;}
.txt-swiper .swiper-slide .ib-bg .info{position: absolute;color: #fff;left: 0;top: 50%;transform: translateY(-50%);padding-left: 15px;}
.txt-swiper .swiper-slide .ib-bg .info img{width: 95%;max-width: 650px;}
.txt-swiper .swiper-slide .ib-bg .info h4{font-size: 16px;display: inline-block;max-width: 750px;width: 90%;color: #fff;font-weight: normal;padding: 10px 30px;background-color: rgba(36,144,156, 1);border-radius: 50px;margin-top: 20px;line-height: 20px;}
.img-swiper .swiper-slide img.m-img{display: none;}
/* .img-swiper .swiper-slide img{object-position: right;} */

.txt-swiper .swiper-slide:nth-child(2) .ib-bg .info{left: auto;right: 0;}
.txt-swiper .swiper-slide:nth-child(2) .ib-bg .info img{}
.txt-swiper .swiper-slide:nth-child(3) .ib-bg .info{left: auto;right: 0;}
.txt-swiper .swiper-slide:nth-child(3) .ib-bg .info img{}
.txt-swiper .swiper-slide:nth-child(4) .ib-bg .info{left: auto;right: 0;}
.txt-swiper .swiper-slide:nth-child(4) .ib-bg .info img{}
.txt-swiper .swiper-slide:nth-child(5) .ib-bg .info{left: auto;right: 10%;}
.txt-swiper .swiper-slide:nth-child(5) .ib-bg .info img{}


/*  */
.adv-about.area{padding: 30px 15px;}
.adv-about .tit{text-align: center;color: rgba(36,144,156, 1);}
.adv-about .tit h2{font-size: 44px;font-weight: bold;}
.adv-about .tit span{font-size: 15px;display: inline-block;width: 100%;line-height: 25px;margin-bottom: 30px;font-weight: bold;}
.adv-about #abSwiper{}
.adv-about #abSwiper li h3{font-size: 22px;font-weight: bold;line-height: 45px;padding-left: 55px;position: relative;overflow: hidden;margin: 20px 0;border-bottom: 1px solid #c7c7c7;}
.adv-about #abSwiper li h3::before{content: '';display: inline-block;width: 45px;height: 45px;left: 0;top: 0;background-color: rgba(36,144,156, 1);position: absolute;}
.adv-about #abSwiper li:nth-child(3n-2) h3::before{background-color: rgba(206,180,150, 1);}
.adv-about #abSwiper li:nth-child(3n-1) h3::before{background-color: rgba(99,162,201, 1);}
.adv-about #abSwiper li h3 a{position: absolute;display: inline-block;right: 0;top: 50%;transform: translateY(-50%);font-size: 15px;color: #333;font-weight: normal;}
.adv-about #abSwiper li .info{border: 1px solid #e6e6e6;color: #333;}
.adv-about #abSwiper li .info img{width: 100%;height: 185px;object-fit: cover;}
.adv-about #abSwiper li .info p{padding: 6% 8%;display: inline-block;width: 100%;line-height: 35px;min-height: 120px;font-size: 14px;}


/* news */
.news.area{padding: 40px 15px;background-color: #f5f5f5;}
.news.area .li h3{line-height: 65px;background-color: rgba(36,144,156, 1);font-size: 24px;font-weight: bold;color: #fff;position: relative;background-image: url(../images/mudan.png);background-size: 85px auto;background-repeat: no-repeat;background-position: right center;}
.news.area .row .col-lg-4:nth-child(3n-2) h3{background-color: rgba(198, 11, 11, 1);}
.news.area .row .col-lg-4:nth-child(3n-1) h3{background-color: rgba(99,162,201, 1);}
.news.area .li h3::before{content: '';display: inline-block;width: 55px;height: 100%;left: 0;top: 0;background-image: url(../images/tit-ico1.png);background-size: 33px auto;background-position: right center;position: absolute;background-repeat: no-repeat;}
.news.area .li h3 span{margin-left: 55px;padding-left: 10px;}
.news.area .li h3 a{position: absolute;display: inline-block;right: 85px;top: 50%;transform: translateY(-50%);font-size: 15px;color: #fff;font-weight: normal;}
.news.area .li .info{padding: 15px;background-color: #fff;}
.news.area .li .info .img{width: 100%;height: 170px;margin-bottom: 10px;position: relative;}
.news.area .li .info .img img{width: 100%;height: 100%;object-fit: cover;}
.news.area .li .info .img p{line-height: 35px;display: block;background-color: rgba(0, 0, 0, 0.8);position: absolute;bottom: 0;left: 0;color: #fff;padding: 0 20px;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;font-size: 14px;}
.news.area .li .info .tit{line-height: 45px;font-size: 14px;color: #333;display: flex;}
.news.area .li .info .tit p{overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;width: calc(100% - 80px);}
.news.area .li .info .tit span{width: 80px;color: #999;}

.news.area .li .info .tit:hover p{color: rgba(36,144,156, 1);}


/* device */
.device.area{background-color: #f5f5f5;}
.device.area h3{line-height: 65px;background-color: rgba(36,144,156, 1);font-size: 24px;font-weight: bold;color: #fff;position: relative;background-image: url(../images/mudan.png);background-size: 85px auto;background-repeat: no-repeat;background-position: right center;}
.device.area h3::before{content: '';display: inline-block;width: 55px;height: 100%;left: 0;top: 0;background-image: url(../images/dev-ico.png);background-size: 33px auto;background-position: right center;position: absolute;background-repeat: no-repeat;}
.device.area h3 span{margin-left: 55px;padding-left: 10px;}
.device.area h3 a{position: absolute;display: inline-block;right: 85px;top: 50%;transform: translateY(-50%);font-size: 15px;color: #fff;font-weight: normal;}

.device.area .block-1{padding: 30px 30px 10px;background-color: #fff;}
.device.area .swiper a .img{position: relative;padding-top: 75%;position: relative;overflow: hidden;border: 1px solid rgba(36,144,156, 1);}
.device.area .swiper a .img img{position: absolute;width: 100%;height: 100%;object-fit: cover;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.device.area .swiper a p{display: block;line-height: 40px;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;margin: 0 15px;width: calc(100% - 15px);color: rgba(0, 0, 0, 0.8);}

/* environment */
.environment.area{background-color: #f5f5f5;padding: 0px 15px;}
.environment.area h3{line-height: 65px;background-color: rgba(206,180,150, 1);font-size: 24px;font-weight: bold;color: #fff;position: relative;background-image: url(../images/mudan.png);background-size: 85px auto;background-repeat: no-repeat;background-position: right center;}
.environment.area h3::before{content: '';display: inline-block;width: 55px;height: 100%;left: 0;top: 0;background-image: url(../images/env-ico.png);background-size: 33px auto;background-position: right center;position: absolute;background-repeat: no-repeat;}
.environment.area h3 span{margin-left: 55px;padding-left: 10px;}
.environment.area h3 a{position: absolute;display: inline-block;right: 85px;top: 50%;transform: translateY(-50%);font-size: 15px;color: #fff;font-weight: normal;}

.environment.area .block-1{padding: 30px 30px 10px;background-color: #fff;}
.environment.area .swiper a .img{position: relative;padding-top: 75%;position: relative;overflow: hidden;}
.environment.area .swiper a .img img{position: absolute;width: 100%;height: 100%;object-fit: cover;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.environment.area .swiper a p{display: block;line-height: 40px;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;margin: 0 15px;width: calc(100% - 15px);color: rgba(0, 0, 0, 0.8);}


/* service */
.service.area{padding: 30px 15px;text-align: center;}
.service h2{font-size: 30px;font-weight: bold;color: rgba(36,144,156, 1);display: inline-block;margin-bottom: 30px;position: relative;}
.service h2::before,.service h2::after{content: '';display: inline-block;position: absolute;background-image: url(../images/tit-ico2.png);background-repeat: no-repeat;background-size: 100% auto;bottom: 0;width: 200px;height: 75%;}
.service h2::before{right: calc(100% + 15px);}
.service h2::after{left: calc(100% + 15px);transform: scaleX(-1);}
.service .n-area{display: flex;flex-wrap: wrap;}
.service .li{flex: 1 0 12.5%;}
.service .li .img{margin-bottom: 10px;transition: all 0.6s;}
.service .li .img img{width: 90%;max-width: 90px;}
.service .li .tit{margin: 5px 0;font-size: 20px;color: rgba(36,144,156, 1);font-weight: bold;}
.service .li:hover .img{transform: rotateY(360deg);}



h2.title-2{font-size: 30px;color: rgba(36,144,156, 1);font-weight: bold;margin-bottom: 30px;display: block;width: calc(100% - 45px);padding-left: 15px;position: relative;margin-left: 45px;line-height: 45px;}
h2.title-2::before{content: '';display: inline-block;position: absolute;background-size: contain;left: -45px;top: 50%;transform: translateY(-50%);width: 45px;height: 45px;background-repeat: no-repeat;}

/* product */
.product.area{padding: 50px 15px;background-color: #f5f5f5;}
.product.area .n-area{padding-bottom: 20px;}
.product .li{}
.product .li h3{display: block;padding: 45px 30px;color: #fff;background-color: rgba(36,144,156, 1);padding-left: 120px;background-image: url(../images/logo-bg.png);background-size: auto;background-repeat: no-repeat;background-position: 160% bottom;position: relative;}
.product .li h3::before{display: inline-block;content: '';position: absolute;width: 75px;height: 75px;left: 30px;top: 50%;transform: translateY(-50%);background-image: url(../images/tit-ico4.png);background-size: contain;background-repeat: no-repeat;}
.product .row>div:nth-child(3n-2) .li h3{background-color: rgba(206,180,150, 1);}
.product .row>div:nth-child(3n-1) .li h3{background-color: rgba(99,162,201, 1);}
.product .li h3 span{font-size: 24px;font-weight: bold;margin-bottom: 10px;display: block;}
.product .li h3 p{font-size: 14px;line-height: 20px;height: 40px;}
.product .li .info{padding: 40px 30px;background-color: #fff;min-height: 425px;position: relative;}
.product .li .info a{line-height: 38px;display: inline-block;min-width: calc(33.333333%);width: auto;margin: 0 0 20px;font-size: 17px;padding-right: 12px;
    /* background-color: rgba(36,144,156, .3); */
    color: #333;text-align: center;float: left;display: flex;font-weight: bold;}

.product .li .info a i{font-size: 24px;margin-right: 10px;background-color: rgba(206,180,150, 0.2);color: rgba(206,180,150, 1);width: 40px;height: 40px;border-radius: 50%;}
.product .row>div:nth-child(3n-1) .li .info a i{background-color: rgba(99,162,201, .2);color: rgba(99,162,201, 1);}
.product .row>div:nth-child(3n) .li .info a i{background-color: rgba(36,144,156, .2);color: rgba(36,144,156, 1);}

/* .product .row>div:nth-child(3n-2) .li .info a{background-color: rgba(206,180,150, .3);} */
/* .product .row>div:nth-child(3n-1) .li .info a{background-color: rgba(99,162,201, .3);} */
.product .li .info a.more{position: absolute;left: 50%;bottom: 0;transform: translate(-50%,50%);background-color: rgba(36,144,156, 1);margin: 0;color: #fff;justify-content: center;max-width: 160px;width: 50%;}
.product .row>div:nth-child(3n-2) .li .info a.more{background-color: rgba(206,180,150, 1);}
.product .row>div:nth-child(3n-1) .li .info a.more{background-color: rgba(99,162,201, 1);}




/* team */
.team.area{padding: 50px 15px;}
.team h2.title-2 a{font-size: 18px;color: rgba(36,144,156, .9);}
.team #teamSwiper{}
.team #teamSwiper .info{padding: 15px;background-color: #eee;}
.team #teamSwiper .info .img{padding-top: 125%;position: relative;}
.team #teamSwiper .info .img img{width: 100%;height: 100%;object-fit: cover;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.team #teamSwiper .info .img h3{display: inline-block;position: absolute;bottom: 0;left: 0;line-height: 35px;color: #fff;font-weight: bold;font-size: 18px;background-color: rgba(36,144,156, 1);padding: 0 15px;transform: translate(-15px,50%);}
.team #teamSwiper .info p{font-size: 15px;line-height: 30px;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;margin-top: 20px;color: #333;}


/* honor */
.honor.area{padding: 30px 15px 0;background-color: #f5f5f5;margin-bottom: 60px;position: relative;}
.honor.area::after{content: '';display: inline-block;width: 1500px;position: absolute;height: 90px;top: calc(100% - 25px);left: 50%;transform: translateX(-50%);background-image: url(../images/honor-bg.png);background-size: contain;background-repeat: no-repeat;}
.honor #honorSwiper{position: relative;z-index: 2;}
.honor #honorSwiper .info{}
.honor #honorSwiper .info .img{padding-top: 75%;position: relative;background-image: url(../images/hon-border.png);background-size: 100% 100%;}
.honor #honorSwiper .info .img img{width: 80%;height: 70%;object-fit: cover;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}


/* b-plate */
.b-plate.area{padding: 45px 15px;}
.b-plate.area .info{padding: 30px 35px;background-size: cover;background-position: right center;color: #fff;position: relative;}
.b-plate.area .info::before{content: '';display: inline-block;height: 100%;width: 85%;left: 0;top: 0;background-image: linear-gradient(to right, rgba(36,144,156, 1),rgba(36,144,156, 0));position: absolute;z-index: 1;}
.b-plate.area .col-lg-4:nth-child(3n-2) .info::before{background-image: linear-gradient(to right, rgba(206,180,150, 1),rgba(206,180,150, 0));}
.b-plate.area .col-lg-4:nth-child(3n-1) .info::before{background-image: linear-gradient(to right, rgba(99,162,201, 1),rgba(99,162,201, 0));}
.b-plate.area .info h3{font-size: 26px;font-weight: bold;padding-bottom: 10px;position: relative;z-index: 2;}
.b-plate.area .info p{font-size: 15px;position: relative;z-index: 2;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;line-height: 30px;height: 60px;}
.b-plate.area .info a{font-size: 15px;color: #fff;position: relative;z-index: 2;}


/* wx-plate */
.wx-plate.area{padding: 20px 15px 30px;}
.wx-plate .ul{display: flex;text-align: center;flex-wrap: wrap;}
.wx-plate .li{width: 20%;text-align: center;}
.wx-plate .li .info{width: 95%;max-width: 180px;}
.wx-plate .li .info .img{padding-top: 100%;position: relative;background-color: rgba(36,144,156, .9);}
.wx-plate .li .info .img img{width: calc(100% - 30px);height: calc(100% - 30px);position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.wx-plate .li .info p{line-height: 40px;font-size: 15px;}



@media screen and (min-width: 0px) and (max-width:1400px){
    .hot-pro .li p{font-size: 17px;}
    .adv-about .tit h2{font-size: 38px;}
}
@media screen and (min-width: 0px) and (max-width:1200px){
    .hot-pro .li p{font-size: 16px;}
    .adv-about .tit h2{font-size: 34px;}
    .b-plate.area .info h3{font-size: 24px;}
}
@media screen and (min-width: 0px) and (max-width:1100px){

}
@media screen and (min-width: 0px) and (max-width:992px){
    h2.title-2{font-size: 28px;}
    .hot-pro .li p{font-size: 14px;}
    .adv-about #abSwiper li .info p{font-size: 13px;}
    .adv-about .tit h2, .adv .tit h2{font-size: 30px;}

    .service .li .tit{font-size: 16px;}

    .product .li{margin-bottom: 30px;}

    .team #teamSwiper .info .img h3{font-size: 17px;}
    .b-plate.area .info{margin-bottom: 15px;}
}
@media screen and (min-width: 0px) and (max-width:768px){
    .img-swiper .swiper-slide img{object-position: right 0 top 0;}

    h2.title-2{font-size: 26px;margin-bottom: 20px;}
    .hot-pro{transform: translateY(0);}
    .hot-pro .li p{font-size: 16px;}
    .adv-about.area{margin: 0;padding: 15px 15px;}
    .news.area{padding: 30px 15px;}
    .adv-about #abSwiper li h3{font-size: 19px;}
    .txt-swiper .swiper-slide .ib-bg .info h4{font-size: 14px;}
    .adv-about #abSwiper li .info p{padding: 15px;}
    .news.area .li h3,.device.area h3 span,.environment.area h3 span{font-size: 22px;}

    .environment.area{padding: 30px 15px 20px;}

    .service h2{font-size: 25px;}
    .service h2::before, .service h2::after{height: 65%;}
    .service .li .tit{font-size: 15px;}

    .product.area{padding: 30px 15px 0;}
    .product .li h3 span{font-size: 22px;}
    .product .li .info{min-height: auto;}
    .product .li .info a{font-size: 14px;}

    .team.area{padding: 30px 15px;}
    .team #teamSwiper .info p{font-size: 14px;}
    .team #teamSwiper .info .img h3{width: calc(100% + 30px);}

    .honor.area{padding-top: 10px;}
    .b-plate.area{padding: 25px 15px 5px;}
    .b-plate.area .info h3{font-size: 22px;}
    .b-plate.area .info p{font-size: 15px;}

    .wx-plate .li{width: 33.333333%;}
    .wx-plate .li .info{margin: 0 auto;}
    .wx-plate .li .info p{font-size: 14px;}
}
@media screen and (min-width: 0px) and (max-width:640px){
    .service .li{flex: 1 0 25%;}
}

@media screen and (min-width: 0px) and (max-width:550px){
    .banner{height: 275px;}
}
@media screen and (min-width: 0px) and (max-width:440px){
    h2.title-2{font-size: 23px;}
    .banner{height: 230px;}
    .txt-swiper .swiper-slide .ib-bg .info h4{font-size: 13px;margin-left: 0;margin-top: 25px;}
    .txt-swiper .swiper-slide .ib-bg .info h3{font-size: 22px;}
    .hot-pro .li p{margin: 10px;font-size: 13px;}
    .hot-pro .li h3{font-size: 19px;}
    .adv-about .tit h2, .adv .tit h2{font-size: 26px;}
    .news.area .li h3,.device.area h3 span,.environment.area h3 span{font-size: 19px;}
    .news.area .li .info .tit{font-size: 13px;}

    .service .li .tit{font-size: 13px;}
    .service .li .img img{max-width: 60px;}

    .product .li .info a{font-size: 13px;}
    .product .li h3 p{font-size: 12px;}
    
    .team #teamSwiper .info .img h3{font-size: 13px;font-weight: normal;}

    .b-plate.area .info h3{font-size: 19px;}
    .b-plate.area .info p{font-size: 14px;padding-bottom: 15px;}
    .b-plate.area .info a{font-size: 14px;}

    .wx-plate.area{padding-bottom: 10px;}
    .wx-plate .li{width: 50%;}
    .wx-plate .li .info p{line-height: 35px;}
}
@media screen and (min-width: 0px) and (max-width:320px){

}

@keyframes fade {
    0%{
        transform: scale(1);
    }
    50%{
        transform: scale(1.05);
    }
    100%{
        transform: scale(1);
    }
}