.banner{width:100%;height:900px}
.banner .swiper-container{width:100%;height:900px}
.banner .swiper-container a{height:100%;position:relative}
.banner .swiper-container a div{position:relative;height:100%}
.banner .swiper-container a div img{width:100%;height:100%;display:block;-o-object-fit:cover;object-fit:cover}

.goods{max-width:1200px;margin:80px auto}
.goods .top{display:flex;justify-content:space-between;}
.goods .top .left span{display:block}
.goods .top .left span:nth-child(1){font-size:40px;color:#0f3575;font-weight:700}
.goods .top .left span:nth-child(2){font-size:34px;font-weight:700}
.goods .top .left span:nth-child(3){font-size:16px;color:#999;margin-top:10px}
.goods .top .right{text-align:right}
.goods .top .right>a{float:right;font-size:14px;color:#999;margin-top:15px}
.goods .top .right div{display:flex;justify-content:right;margin-top:107px}
.goods .top .right div a{font-size:16px;margin-left:50px;position:relative;cursor: pointer;}
.goods .top .right div a.atv,.goods .top .right div a:hover{-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(to right,#14bfcd,#2b57b8);color:#14bfcd}
.goods .top .right div a.atv::before{content:'';width:100%;height:1px;background:#14bfcd;position:absolute;bottom:-6px;left: 0;}
.goods .top .right div a::before{content:'';width:0%;height:1px;background:#14bfcd;position:absolute;bottom:-6px;transition:all .6s}
.goods .top .right div a:hover::before{content:'';width:100%;height:1px;background:#14bfcd;position:absolute;bottom:-6px}
.goods .box>div{display:flex;justify-content:space-between;flex-flow: wrap;margin-top:80px;display: none;}
.goods .box>div a{width:24%;height:260px;border:1px solid #eee;position:relative;text-align:center;display: inline-block;}
.goods .box>div a:hover img{-webkit-transform:scale(1.2);-o-transform:scale(1.2);transform-origin:center center}
.goods .box>div a div{width:100%;height:200px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.goods .box>div a div img{transition:all .6s;width: 100%;}
.goods .box>div a span{font-size:16px;color:#999;position:absolute;bottom:30px;left:0;width:100%}

.service{height:750px;background:url(../image/bg_ywhz.png) center}
.service .top{max-width:1200px;margin:auto;padding-top:80px}
.service .top span{display:block;color:#fff;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.service .top span:nth-child(1){font-size:40px;font-weight:700}
.service .top span:nth-child(2){font-size:34px;font-weight:700}
.service .top span:nth-child(3){font-size:16px;margin-top:10px}
.service .box{max-width:1200px;margin:auto}
.service .box{display:flex;justify-content:space-between;margin-top:90px}
.service .box a{width:25%;height:322px;position:relative;text-align:center;transition:all .3s;display: inline-block;}
.service .box a *{transition:all .3s}

.service .box a:nth-child(1){background:url(../image/yw3.png)}
.service .box a:nth-child(2){background:url(../image/yw4.png)}
.service .box a:nth-child(3){background:url(../image/yw3.png)}
.service .box a:nth-child(4){background:url(../image/yw4.png)}
.service .box a:nth-child(1) div{background:#498ac2}
.service .box a:nth-child(2) div{background:#689ecd}
.service .box a:nth-child(3) div{background:#498ac2}
.service .box a:nth-child(4) div{background:#689ecd}
.service .box a:hover{background:url(../image/yw-atv.png);margin-top:-20px}
.service .box a:hover div{background:#84bae5}
.service .box a:hover span{color:#000}
.service .box a:hover p{color:#3e3a39}
.service .box a div{width:90px;height:90px;background:#498ac2;border-radius:50%;display:flex;justify-content:center;align-items:center;margin: auto;margin-top: 50px;}
.service .box a span{font-size:24px;color:#fff;width:100%;margin-top:25px;display:block;padding: 0 10px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.service .box a p{height:45px;line-height:25px;font-size:14px;color:#fff;margin:0 50px;text-align:left;margin-top:20px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}

.news{max-width:1200px;margin:80px auto}
.news .top{display:flex;justify-content:space-between}
.news .top .left span{display:block}
.news .top .left span:nth-child(1){font-size:40px;color:#0f3575;font-weight:700}
.news .top .left span:nth-child(2){font-size:34px;font-weight:700}
.news .top .left span:nth-child(3){font-size:16px;color:#999;margin-top:10px}
.news .top .right{text-align:right}
.news .top .right>a{float:right;font-size:14px;color:#999;margin-top:15px}
.news .box{display:flex;justify-content:space-between;margin-top:60px}
.news .box a{float:right;width:336px}
.news .box a div{width:100%;height:200px;display:flex;align-items:start;justify-content:center;overflow:hidden}
.news .box a div img{width:100%;height:100%;transition:all .6s;object-fit: cover;}
.news .box a span{font-size:20px;margin-top:33px;display:block}
.news .box img:hover{-webkit-transform:scale(1.2);-o-transform:scale(1.2);transform-origin:center center}
.news .swiper-container{width:100%;height:400px}
.news .swiper-slide-active a{float:left}
.news .swiper-slide-next a{float:inherit;width:450px;display:inline-block;margin-left:-25px;transition:all 1s}
.news .swiper-slide-next a div{height:250px;transition:all 1s}
.news .swiper-slide-next a span{color:#000}

/* ========== 自适应样式 ========== */
@media screen and (min-width: 751px) {
    .goods .box a:last-child:nth-child(4n - 1) {margin-right: calc(24% + 4% / 3);}
    .goods .box a:last-child:nth-child(4n - 2) {margin-right: calc(48% + 8% / 3);}
}
@media screen and (max-width: 1200px) {
    .goods{padding: 0 30px;}
    .goods .top .left span:nth-child(1){font-size: 20px;}
    .goods .top .left span:nth-child(2){font-size: 20px;}
    .goods .top{flex-direction: column;text-align: center;}
    .goods .top .right div{justify-content: left;margin-top: 60px;flex-flow: wrap;}
    .goods .top .right div a{margin-right: 20px;margin-bottom: 20px;margin-left: 0;}
    
    .goods .box{margin-top: 30px;}
    .goods .box a{height: 220px;margin-bottom: 15px;}
    .goods .box a div{height: 170px;}
    .goods .box a div img{max-height: 150px;}
    .goods .box a span{bottom: 15px;}

    .service .top{padding: 80px 30px 0 30px;text-align: center;}
    .service .top span:nth-child(1){font-size: 20px;}
    .service .top span:nth-child(2){font-size: 20px;}
    .service .box{padding: 0 30px 0 30px;}
    .service .box a p{margin: 20px 15px 0 15px;}

    .news{padding:0 30px;}
    .news .top{flex-direction: column;text-align: center;}
    .news .top .left span:nth-child(1){font-size: 20px;}
    .news .top .left span:nth-child(2){font-size: 20px;}
    .news .box{margin-top:30px;}
    .news .box a{width: 90%}
    .news .swiper-slide-next a{width: 100%;margin-left:0}
}
@media screen and (max-width: 750px) {
    .banner .swiper-container a div img.pc{display: none;}
    .banner .swiper-container a div img.wap{display: block;}

    .goods{padding: 0 30px;}
    .goods .top .left span:nth-child(1){font-size: 20px;}
    .goods .top .left span:nth-child(2){font-size: 20px;}
    .goods .top .left span:nth-child(3){color: #000;}
    .goods .top{flex-direction: column;text-align: center;}
    .goods .top .right div{justify-content: left;margin-top: 40px;flex-flow: wrap;display: none;}
    .goods .top .right div a{margin-right: 20px;margin-bottom: 20px;margin-left: 0;}
    .goods .box>div a span{color: #000;}

    .goods{padding: 0 10px;margin: 40px auto 30px auto;}
    .goods .box{flex-flow: wrap;margin-top: 20px;}
    .goods .box a{height: 160px!important;width: 48%!important;margin-bottom: 15px;}
    .goods .box>div{margin-top: 0;}
    .goods .box a div{height: 120px!important;}
    .goods .box a div img{max-height: 85px;}
    .goods .box a span{bottom: 15px!important;}

    .service .top{padding-top: 40px;}
    .service .box{margin-top: 40px;padding: 0 10px;flex-flow: wrap;}
    .service .box a{width: 50%;height: 288px;}
    .service .box a div{margin-top: 40px;width: 70px;height: 70px;}
    .service .box a div img{height: 30px}
    .service .box a span{font-size: 20px;margin-top: 15px;}
    .service .box a p{margin-top: 10px;height: 75px;-webkit-line-clamp: 3;}

    .news{padding:0 10px;margin: 40px auto;}
    .news .top{flex-direction: column;text-align: center;}
    .news .top .right>a{display: none;}
    .news .top .left span:nth-child(3){color: #000;}
    .news .box{margin-top:40px;}
    .news .box a{width: 100%;margin-left:0}
    .news .box a div{height: 250px;}
    .news .box a span{margin-top: 20px;font-size: 16px;}
    .news .swiper-container{height: 360px;}
}

/* 针对IE10及以下浏览器 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .goods .top .right div a.atv, 
    .goods .top .right div a:hover{background-image:none;}
}