.text_title{ font-size: 0.24rem; color: #868686;   line-height: 1; font-weight: 700; margin-bottom: 0.3rem;}
.text_bref{ font-size: 0.16rem; color: #868686; line-height: 1.7}
.pos{position: absolute; width: 100%; z-index: 2}
div{box-sizing: border-box;}
.sec1 .img1{height: 7.4rem;}
.sec2 .img1{height: 9rem; overflow: hidden;}
.sec2 .text{margin: 2rem 0 .8rem}
.sec2 .img1 .li{width: 100%; bottom: 0; left:0; height: 2rem; display: flex; justify-content: space-between; align-items: center; opacity: 0;}
.sec2 .img1 .li.on{opacity: 1;}
.sec2 .img1 .li1{background: #EBEDEF; z-index: 1;}
.sec2 .img1 .li2{background: #7E8183; z-index: 2;}
.sec2 .img1 .li3{background: #D9DADC; z-index: 3;}
.sec2 .img1 .li4{background: #494A4A; z-index: 4;}
.sec2 .img1 .li .smallimg{width: 4.69rem; height: 100%}
.sec2 .img1 .li1 .smallimg{width: 5.02rem;}
.sec2 .img1 .li2 .smallimg{width: 6.6rem;}
.sec2 .img1 .li p{color: #fff; font-size: 0.34rem; padding: 0 0.3rem;}
.sec2 .img1 .li1 p,.sec2 .img1 .li3 p{color: #868686;}
.sec2 .yqimg{transition: transform 1s ease;}
.sec2 .yqimg.one {transform: translate3d(0px, 19%, 0px) scale(1.5);}
.sec2 .yqimg.two {transform: translate3d(0px, -20%, 0px) scale(1.5);}

.sec3 {padding-left: 0.76rem; margin-top: 2.66rem;}
.sec3 .two{display: grid;grid-template-columns: auto auto;}
.sec3 .leftimg{width: 8.4rem; height: 9.2rem; }
.sec3 .text{ height: 100%;   justify-content: space-between;display: flex;flex-direction: column;padding: 0.44rem 0 0.8rem; padding-left:0.9rem;}
.sec3 .text .text_bref{position: relative; opacity: 0; transition: opacity 1s ease}
.sec3 .text .text_bref.on{opacity: 1;}
.sec3 .jt1{width: 3.8rem;left: -3.37rem; bottom: -0.8rem; }
.sec3 .jt2{width: 4.26rem; left: -3.2rem; bottom: -0.7rem; }
.sec3 .jt3{width: 4.26rem; left: -4.4rem; top: -0.5rem; }
.sec4 { padding-left: 0.76rem; display: flex; margin-top: 1.8rem;}
.sec4 .img1{width: 7.7rem; height: 5.05rem; }
.sec4 .text{width:3rem;  margin-right: 1rem; display: flex; flex-direction: column; justify-content: flex-end; }
.sec4 .text .p2{margin-top: 1.8rem;  }
.sec4 .jt3{ width: 5.46rem; left:-2.2rem; top:0.9rem; transform: rotateY(180deg); }
.sec4 .svg{top: 0.98rem;width: 0.87rem;left: calc(50% - 0.69rem);}
.sec4 .svg .path{fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 3px; stroke-dasharray: 410; stroke-dashoffset: 410;}
.sec5{background: #D1E3DE; padding-bottom: 1.6rem; margin-top: 1.8rem;}
.sec5 .img1{height: 7.6rem;}
.sec5 .img2{height: 9.3rem;}
.sec6 .text{margin: 1.7rem 0 0.8rem;}
.sec6 .img{height: 12.23rem;}
.sec6 .img img{opacity: 0; transition: opacity 0.3s ease;}
.sec6 .img img.on{opacity: 1; }
.sec6 .img .pos{left:0; top:0; }
.sec6 .img .img1{z-index: 4; }
.sec6 .img .img2{z-index: 3;}
.sec6 .img .img3{z-index: 2;}
.sec6 .img .img4{z-index: 1;}
.sec7 .img1{width: 9.13rem; height: 5.54rem; margin: 0.8rem auto 0;}

.dePage .sec3 .jt1{top: 1.47rem;}
.dePage .sec4 .text .p2 {margin-top: 1.6rem;}


@media screen and (max-width: 767px) {
    .text_bref{font-size: 0.26rem; line-height: 1.66}
    .text_title{font-size: 0.34rem;  line-height: 1.4; margin-bottom: 0.2rem;}
    .comPage .text_bref {line-height: 1.4;}
    .sec1 .img1 {height: 3.9rem; }
    .sec2,.sec4,.sec6 {padding: 0 0.3rem; }
    .sec2 .text{padding: .8rem 0; margin: 0;}
    .sec2 .img1{height: 6.4rem;}
    .sec2 .img1 .li{height: 1.28rem;}
    .sec2 .img1 .li p{font-size: 0.24rem; width: 3rem;}
    .sec2 .img1 .li .smallimg{width: 2.29rem; }
    .sec2 .img1 .li2 .smallimg{order:1; width: 3rem; height: auto;}
    .sec2 .img1 .li2 p{order:2; }
    .sec2 .img1 .li4 p{width: 2.9rem;}

    .sec3{ margin-top: 0;padding: 0.9rem 0.3rem 0;  }
    .sec3 .text_title{padding-left: 0; font-weight: normal;}
    .sec3 .leftimg {width: 5rem;height: 5.52rem;}
    .sec3 .two{display: block;}
    .sec3 .text{padding:0; position: relative; padding-bottom: 3rem; width: 100%; }
    .sec3 .text .text_bref{ position: absolute; background: #fff; top:0.58rem; left:0; transition: opacity 0.3s ease}
    .sec3 .text .p1{width: 4.5rem}
    .sec3 .text .p2{left:auto; right: 0; width: 4.4rem}
    .sec3 .text .p3{width: 4.6rem}
    .dePage .sec3 .jt1,.sec3 .jt1 {width: 2.3rem; left:auto; right: -1.4rem;  bottom: auto; top: -4.5rem;}
    .cnPage .sec3 .jt2,.sec3 .jt2 {width: 2.2rem;left: -1.6rem;top: -3rem; bottom: auto;}
    .sec3 .jt3 {width: 2.12rem;left: auto;top: -1.6rem; right: -1.6rem;}

    .sec4 {margin-top: 0;}
    .sec4 .img1{width: 3.4rem; height: 3.65rem; overflow: hidden}
    .sec4 .img1 img{width: 163%; margin-left: -41%;}
    .sec4 .text{padding-right: 0.4rem;width: calc(100% - 3.4rem); margin-right:0; position: relative; display: block;}
    .sec4 .jt3{width: 2.7rem; left: auto; right:-1rem; }
    .sec4 .p1{margin-top: 1.6rem;}
    .sec4 .p2{bottom: -1.4rem; width: 6rem; position: absolute;}
    .dePage .sec4 .text .p2{bottom: -1.8rem;}
    .sec4 .svg{display: none;}
    .sec5{ margin: 2.32rem 0.3rem 0; padding-bottom: 0;}
    .sec5 .img1{height: 3.53rem;}
    .sec5 .img2{height: 5.97rem;}
    .sec6 .text {padding: 0.75rem 0 0.56rem; margin: 0;}
    .sec6 .img{height: 5.59rem;}
    .sec7 .img1{width: 5rem; height: 3rem;}
}