@charset "utf-8";

body {
    overflow-x: hidden;
}





/* 中心部分 */
.index {
    position: relative;
    padding-bottom: 1.25rem;
    z-index: 6;
}

.title {
    position: relative;
    margin-bottom: .3rem;
    align-items: flex-end;
}

.tit_c .h3 {
    position: relative;
    display: inline-flex;
    align-items: flex-end;

}

.tit_c .h3 .p {
    position: relative;
    font-size: .4rem;
    color: #033333;
    font-family: "sysong";
    z-index: 6;
}

.tit_c .h3 .p1 {
    display: flex;
    position: relative;
    z-index: 6;
}

.tit_c .h3 .p1 img {
    max-height: .62rem;
}

.tit_c .h3 .p1 span {
    font-size: .56rem;
    color: #a81b00;
    font-family: "hj";
}

.tit_c .h3 .p1 span:nth-child(2) {
    margin-top: .3rem;
}

.tit_c .h3:after {
    content: "";
    position: absolute;
    right: -.3rem;
    bottom: -.2rem;
    width: .9rem;
    height: .9rem;
    border-radius: 50%;
    background: url(../images/tit_bg1.png) no-repeat center center/100% 100%;
}

.tit_c p {
    position: relative;
    padding-left: .45rem;
    padding-bottom: .05rem;
    font-size: .12rem;
    color: #666;
    font-family: "ss_light";
}

.tit_c p:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 1.3rem;
    height: .17rem;
    background: url(../images/tit_bg2.png) no-repeat center center/100% 100%;
}

.title .more {
    margin-bottom: .3rem;
    transition: all .6s;
}

.title .more a {

    width: 1rem;

    text-align: center;

    display: block;

    line-height: .32rem;

    background: url(../images/more11.png) no-repeat center center/100% 100%;

    transition: all .6s;
}

.title .more a span {

    font-size: .16rem;

    color: #666;

    padding-right: .25rem;

    background: url(../images/more1.png) no-repeat right center/.16rem auto;

    transition: all .6s;
}

.section1 {
    padding: .55rem 0;
}

.s1 {

    align-items: flex-start;
}

.s1 .left {
    width: 57.3%;
}

.news a {
    display: block;
}

.news a .pic {
    padding-top: 62.5%;
    border-radius: .1rem;
}

.news a .cont {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: .3rem;
    margin-right: 1.6rem;
    margin-top: -.35rem;
    background: #fff;
    border-radius: .1rem;
    z-index: 2;
    overflow: hidden;
}

.news a .cont .date {
    width: 1.18rem;
    height: 1.18rem;
    background: linear-gradient(90deg, rgba(0, 93, 169, 1) 0%, rgba(11, 119, 207, 1) 100%);
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
}

.news a .cont .date p {
    font-size: .4rem;
}

.news a .cont .date span {
    font-size: .16rem;
}

.news a .cont h2 {
    flex: 1;
    min-width: 0;
    line-height: .4rem;
    padding: 0 .2rem;
    font-size: .22rem;
    color: #333333;
    max-height: .8rem;
}

.news .slick-dots {
    width: auto;
    left: auto;
    right: .15rem;
    bottom: .3rem;
}

.news .slick-dots li {
    width: .11rem;
    height: .11rem;

    margin: 0 .1rem;
    background: #aaaaaa;
    border-radius: 50%;
}

.news .slick-dots li.slick-active {
    background: #0b77cf;

}

/*
.news .slick-dots li.slick-active:before {
    content: "";
    position: absolute;
    width: .14rem;
    height: .14rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1px solid #0b77cf;
    border-radius: 50%;


}
*/
.news .slick-dots li.slick-active:before {
    content: "";
    position: absolute;
    width: .20rem;
    height: .20rem;
    left: 50%;
    top: 48%;
    transform: translate(-48%, -48%);
    border: 1px solid #0b77cf;
    border-radius: 50%;
}


.s1 .right {
    width: 41.4%;
}


.s1-list li a {
    display: block;
}

.s1-list li a .txt1 {
    position: relative;
    padding: .23rem 0;
    line-height: .4rem;
    padding-right: 1rem;
}

.s1-list li a .txt1 p {
    font-size: .18rem;
    color: #333;
}

.s1-list li a .txt1 span {
    position: absolute;
    right: 0;
    top: .2rem;
    font-size: .18rem;
    color: #666;
}

.s1-list li a .txt1:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 5px;
    background: url(../images/s1r_xx.png) no-repeat right center/100% 100%;
}


.s1-list li a .txt2 {

    flex-wrap: wrap;

    padding: .2rem;

    background: url(../images/s1r-bg.png) no-repeat right center;

    box-shadow: 0px 8px 14.72px 1.28px rgba(11, 119, 207, 0.2);

    display: none;

    border-radius: .1rem;
}

.s1-list li a .txt2 .scale {
    width: 2.6rem;
}

.s1-list li a .txt2 .scale .pic {
    padding-top: 62.5%;
}

.s1-list li a .txt2 .cont {
    flex: 1;
    min-width: 0;
    padding-left: .2rem;
}

.s1-list li a .txt2 .cont h2 {
    /* padding-left: .25rem;
    background: url(../images/s1r-ic1.png) no-repeat left center/.18rem auto; */
    font-size: .18rem;
    color: #333;
    margin-bottom: .05rem;
}

.s1-list li a .txt2 .cont p {
    font-size: .18rem;
    color: #333;
    line-height: .32rem;
    max-height: .64rem;
    /* margin-left: .25rem; */
}

.s1-list li a .txt2 .cont span {
    display: block;
    margin-top: .15rem;
    /* margin-left: .25rem; */
    font-size: .14rem;
    color: #066666;
    padding-right: .5rem;
    background: url(../images/s1r-more.png) no-repeat right center/.48rem auto;
}

@media screen and (min-width: 1025px) {
    /* .s1-list li:hover a {
        background: url(../images/s1r_bg1.png) no-repeat right center/cover;
    } */



    .title .more:hover a {
        background: url(../images/more.png) no-repeat center center/100% 100%;
    }

    .title .more:hover a span {
        color: #a81b00;
        font-weight: bold;
    }

    .news a:hover .cont h2 {
        color: #0b77cf;
    }

    .s1-list li.on a .txt2 {
        display: flex;
    }

    .s1-list li.on a .txt1 {
        display: none;
    }
}

@media screen and (max-width: 1024px) {

    .left {
        width: 100% !important;
    }

    .right {
        width: 100% !important;
        margin-top: .2rem;
    }


}

@media screen and (max-width: 768px) {
    .title {
        justify-content: space-between !important;
    }

    .tit_c .h3 .p {
        font-size: .3rem;
    }

    .tit_c .h3 .p1 img {
        max-height: .4rem;
    }

    .section1 {
        padding: .2rem 0;
    }

    .tit_c .h3:after {
        right: -.2rem;
        bottom: -.1rem;
        width: .6rem;
        height: .6rem;
    }

    .title .more {
        margin-bottom: .15rem;
    }

    .title {
        margin-bottom: .15rem;
    }

    .news a .cont {
        margin-left: .15rem;
        margin-right: .15rem;
    }

    .news .slick-dots {
        width: 100%;
        left: 0;
        bottom: 1.1rem;
    }

    .news a .cont h2 {
        font-size: .18rem;
        line-height: .24rem;
        max-height: .48rem;
    }

    .news a .cont .date {
        height: 1rem;
    }

    .news a .cont .date p {
        font-size: .24rem;
    }

    .s1-list li a .txt1 {
        padding-top: .1rem;
        padding-bottom: .1rem;
    }

    .s1-list li a .txt1 span {
        top: .1rem
    }
}

.section2 {
    position: relative;
    z-index: 3;
}

.section2 .wp {
    position: relative;
    z-index: 6;
}

.section2:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: .12rem;
    height: 1px;
    background: #e2e2e2;
}

.section2 .title {
    position: relative;
    justify-content: center;
}

.section2 .title .more {
    position: absolute;
    right: 0;
    bottom: 0;
}

.s2 {
    position: relative;
    margin: 0 -.2rem;
}

.s2 .arrow-l {
    width: .55rem;
    height: .55rem;
    position: absolute;
    top: .7rem;
    left: -.7rem;
    background: url(../images/s2-l.png) no-repeat center center/.11rem auto;
    box-shadow: 0px 4px 7.68px 0.32px rgba(11, 119, 207, 0.2);
    cursor: pointer;
    border-radius: 50%;
    transition: all .6s;
}

.s2 .arrow-l:hover {
    background: #066abc url(../images/s2-ll.png) no-repeat center center/.11rem auto;
}

.s2 .arrow-r {
    width: .55rem;
    height: .55rem;
    position: absolute;
    top: .7rem;
    right: -.7rem;
    background: url(../images/s2-r.png) no-repeat center center/.11rem auto;
    box-shadow: 0px 4px 7.68px 0.32px rgba(11, 119, 207, 0.2);
    cursor: pointer;
    border-radius: 50%;
    transition: all .6s;
}

.s2 .arrow-r:hover {
    background: #066abc url(../images/s2-rr.png) no-repeat center center/.11rem auto;
}

.s2 ul li a {
    position: relative;
    display: block;
    padding-top: .2rem;
    padding-bottom: .9rem;
    margin: 0 .2rem;
}

.s2 ul li a:after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: .07rem;
    width: .12rem;
    height: .12rem;
    background: url(../images/s2-dd.png) no-repeat center center/.12rem auto;
    transition: all .6s;
}

.s2 ul li a .cont {
    position: relative;
    padding: .7rem .25rem .4rem .25rem;
    background: url(../images/s2-bg.png) no-repeat center center/100% 100%;
    top: 0;
    transition: all .6s;
}

.s2 ul li a .cont .date {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.4rem;
    line-height: .4rem;
    text-align: center;
    background: linear-gradient(to top, rgba(0, 93, 169, 1) 0%, rgba(11, 119, 207, 1) 100%);
    border-radius: .1rem 0 .2rem 0;
    color: #fff;
    transition: all .6s;
}

.s2 ul li a .cont .date p {
    font-size: .18rem;
}

.s2 ul li a .cont .date span {
    font-size: .14rem;
}

.s2 ul li a .cont h2 {
    font-size: .18rem;
    color: #333;
    line-height: .32rem;
    height: .64rem;
    margin-bottom: .15rem;
}

.s2 ul li a .cont .s2-more {
    padding-right: .6rem;
    display: inline-block;
    background: url(../images/s2-more.png) no-repeat right center/.46rem auto;
    transition: all .6s;
}

.s2 ul li a .cont .s2-more span {
    font-size: .16rem;
    color: #333;
}

@media screen and (min-width: 1025px) {
    .s2 ul li:hover a .cont .date {
        background: #a81b00;
    }

    .s2 ul li:hover a .cont h2 {
        font-weight: bold;
        color: #a81b00;
    }

    .s2 ul li:hover a .cont .s2-more {
        background: url(../images/s2-more1.png) no-repeat right center/.46rem auto;
    }

    .s2 ul li:hover a .cont h2 {
        font-weight: bold;
        color: #a81b00;
    }

    .s2 ul li:hover a .cont .s2-more span {
        color: #0b77cf
    }

    .s2 ul li:hover a:after {
        width: .22rem;
        height: .22rem;
        background: url(../images/s2-dd1.png) no-repeat center center/.22rem auto;
        bottom: 0;
    }

    .s2 ul li:hover a .cont {
        filter: drop-shadow(0px 8px 14.72px rgba(88, 150, 217, 0.2));
    }

    .s2 ul li:hover a .cont {
        top: -.2rem;
    }
}

@media screen and (max-width: 1024px) {
    .s2 {
        width: 90%;
        margin: 0 auto;
    }

    .s2 .arrow-l {
        left: -.5rem;
    }

    .s2 .arrow-r {
        right: -.5rem;
    }
}

@media screen and (max-width: 768px) {
    .s2 ul li a {
        padding-bottom: .3rem;
    }

    .s2 .arrow-l {
        left: -.3rem;
        width: .45rem;
        height: .45rem;
    }

    .s2 .arrow-r {
        right: -.3rem;
        width: .45rem;
        height: .45rem;
    }
}



.section3 {
    margin-top: -.12rem;
    padding: .6rem 0;
    background: url(../images/sect3-bg.png) no-repeat center top/100% auto;
}

.s3 {
    align-items: flex-start;
}

.section3 .title {
    position: relative;
    display: flex;
    justify-content: center;
    z-index: 2;
}

.section3 .title .more {
    position: absolute;
    right: 0;
    bottom: 0;
}

.s3 .tit1 {
    padding-left: .25rem;
    background: url(../images/s3_tit1.png) no-repeat left center/.18rem auto;
}

.s3 .tit1 h2 {
    font-size: .24rem;
    color: #333;
}

.s3 .left {
    width: 32%;

}

.s3 .mid {
    width: 30.5%;
    margin: 0 2.75%;
    margin-top: -.3rem;
}

.s3 .mid a {
    display: block;
}

.s3 .mid a .pic {
    padding-top: 100.83%;
}

.s3 a:hover .pic div.a {
    width: 100%;
    height: 100%;
}

.s3 .mid p {
    font-size: .18rem;
    color: #333;
    text-align: center;
}

.s3 .mid .s3m-more {
    margin: 0 auto;
    text-align: center;
    margin-top: .15rem;
    width: 2.4rem;
    height: .48rem;
    line-height: .48rem;
    background: #cb0223;
    border-radius: .1rem;
    transition: all .6s;
}

.s3 .mid .s3m-more span {
    display: inline-block;
    height: 100%;
    padding-left: .5rem;
    font-size: .18rem;
    color: #fff;
    background: url(../images/s3m-more.png) no-repeat left center/.4rem auto;
}

.s3 .right {
    width: 32%;
}

.s3_list li {
    position: relative;
}

.s3_list li::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: .8rem;
    height: 1px;
    background: #a81b00;
    transition: all .6s;
}

.s3_list li a {
    display: flex;
    align-items: center;
    height: 1.2rem;

    border-bottom: 1px solid #e5e5e9;
}


.s3_list li a p {
    font-size: .18rem;
    color: #333;
    line-height: .32rem;
    max-height: .64rem;
    padding-left: .15rem;
    background: url(../images/list.png) no-repeat left .1rem;
}


@media screen and (min-width: 1025px) {
    .s3_list li:hover a p {
        color: #0b77cf;
    }

    .s3_list li:hover::after {
        width: 100%;
    }

    .s3 .mid .s3m-more:hover {
        width: 100%;
    }
}

@media screen and (max-width: 1024px) {
    .s3 .mid {
        width: 100%;
        order: -1;
        margin: 0;
        margin-bottom: .2rem;
    }
}

@media screen and (max-width: 768px) {
    .s3_list li a {
        height: 1rem;
    }

    .section3 {
        padding: .2rem 0;
    }
}


.section4 {
    padding-bottom: .5rem;
}

.s4 {
    position: relative;
}

.s4 .s4-pic {
    position: absolute;
    width: 10rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9;
}

.s4-pic li {
    position: relative;
}

/* .s4-pic .swiper-slide {
    width: 16.25%;
} */

.s4-pic a {
    display: block;
    margin-top: .4rem;

}

/* 
.s4-pic .swiper-slide.swiper-slide-active {
    width: 62.5% !important;

} */

.s4-pic a {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    position: relative;
    padding: .4rem .45rem;
    padding-top: 0;
    margin-top: 0;

}

.s4-pic a:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: .4rem;
    bottom: 0;
    background: url(../images/s4m-bg.jpg) no-repeat center center/100% 100%;
    border-radius: .2rem;
}

.s4-pic a .scale {
    position: relative;
    width: 6.4rem;
    z-index: 6;
}

.s4-pic a .scale .bf {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: .99rem;
    height: .99rem;
    background: url(../images/bf.png) no-repeat center center/100% 100%;
}

.s4-pic a .cont {
    position: relative;
    z-index: 6;
    flex: 1;
    min-width: 0;
    padding-left: .3rem;
    padding-bottom: .2rem;
}





.s4-pic a .cont .s4-more {
    display: none;
}

.s4-pic a .cont h2 {
    display: block;
    font-size: .18rem;
    color: #fff;

}

.s4-pic a .cont .txt1 {
    max-height: 2.1rem;
    overflow-y: auto;
    color:#d1d1d1;
}

.s4-pic a .cont .txt1 p {

    font-size: .14rem;
    color: #fff;
    line-height: .24rem;
    margin-top: .2rem;
}

.s4-pic a .cont .s4-more {
    display: block;
    margin-top: .2rem;
}

.s4-pic a .cont .s4-more span {
    font-size: .14rem;
    color: #fff;
    padding-right: .6rem;
    background: url(../images/s4-more.png) no-repeat right center/.47rem auto;
}

.s4-pic a .pic {
    padding-top: 4rem;
    border-radius: .15rem;
}




.s4-pic .s4_cir {
    display: flex;
    justify-content: center;
    margin-top: .25rem;
    margin-bottom: .1rem;
}

.s4-pic .s4_cir span {
    position: relative;
    width: .12rem;
    height: .12rem;
    border-radius: 50%;
    background: #b1b1b2;
    margin: 0 9px !important;
    opacity: 1;
}

.s4-pic .s4_cir span::after {
    content: "";
    position: absolute;
    width: .2rem;
    height: .2rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px solid transparent;
}

.s4-pic .s4_cir span.swiper-pagination-bullet-active {
    background: #0b77cf;
}

.s4-pic .s4_cir span.swiper-pagination-bullet-active:after {
    border: 1px solid #0b77cf;
}

.s4-pic1 {}

.s4-pic1 a {
    display: block;
    margin-top: .4rem;
}

.s4-pic1 a .pic {
    padding-top: 4rem;
    border-radius: .15rem;
}

.s4-pic1 a h2 {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: .15rem;
    font-size: .16rem;
    color: #fff;
    line-height: .32rem;
    max-height: .64rem;

}

.s4-pic1 a .pic:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 35%;
    bottom: 0;
    border-radius: .15rem;
    background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, .6));
}

@media screen and (min-width: 1025px) {}

@media screen and (max-width: 1024px) {
    .s4-pic1 {
        display: none;
    }

    .s4 .s4-pic {
        position: static;
        width: 100%;
        left: auto;
        transform: none;

    }

    .s4-pic a .scale {
        width: 4rem;
    }

    .s4-pic a .pic {
        padding-top: 62.5%;
    }

    .s4-pic a .cont .txt1 {
        height: 1rem;
    }
}

@media screen and (max-width: 768px) {
    .s4-pic a {
        padding-left: .15rem;
        padding-right: .15rem;
    }

    .s4-pic a .scale {
        width: 100%;
    }

    .s4-pic a .cont {
        flex: none;
        width: 100%;
        padding-left: 0;
        padding-bottom: 0;
        padding-top: .15rem;
    }

    .s4-pic a .cont .txt1 {
        height: initial;

    }

    .s4-pic a .cont .txt1 p {
        margin-top: .1rem;
    }

    .s4-pic a .scale .bf {
        width: .6rem;
        height: .6rem;
    }
}

.section5 {
    position: relative;
    padding-top: .4rem;
    background: url(../images/s5-bg.png) no-repeat center top/100% auto;
    /* overflow: hidden; */
}

.section5 .title {
    justify-content: center;
}

.s5 {
    position: relative;
    padding-top: .1rem;
    margin: 0 -8% !important;
    height: 4rem;
}

.section5::after {
    content: "";
    position: absolute;
    top: 30%;
    width: 110vw;
    height: 2.67rem;
    left: 50%;
    transform: translateX(-50%);
    background: url(../images/s5_xx.png) no-repeat center center/100% 100%;
}

/* .s5 ul {
    display: flex;
    flex-wrap: nowrap;
}

.s5 ul li {
    width: 14.28%;
    transition: all .6s;
} */

.s5 ul li a {
    display: block;
    transition: all .6s;

}

.s5 ul li a .s5-icon {
    position: relative;
    margin: 0 auto;
    width: 1.79rem;
    height: 1.79rem;
    padding: .15rem;

    transition: all .6s;
}

.s5 ul li:hover a .s5-icon img {
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
}



.s5 ul li a .s5-icon::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../images/s5-qq.png) no-repeat center center/100% 100%;
    transition: all .6s;

}

.s5 ul li:hover a .s5-icon::after {
    animation: play 10s linear infinite;
}

.s5 ul li a .s5-icon span {
    position: relative;
    z-index: 6;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: #fff;
    box-shadow: 0px 6px 15px 0px rgba(9, 70, 133, 0.35);
    border-radius: 50%;
    transition: all .6s;

}

.s5 ul li a .s5-icon span img {
    max-height: .5rem;
}

.s5 ul li:hover a .s5-icon span img {
    animation: jello 1s linear 2s forwards;
}

.s5 ul li a .txt {

    width: 90%;

    margin: 0 auto;

    margin-top: .18rem;
}

.s5 ul li a .txt p {
    text-align: center;
    font-size: .18rem;
    color: #333;
}

.s5 ul li a .txt p span {

    font-size: .48rem;

    color: #333333;

    font-weight: bold;
}

.s5 ul li a .txt p span.num {}

.s5-logo {
    margin-top: -.45rem;

}

.s5-logo .w1050 {
    width: 10.5rem;
    max-width: 94%;
    margin: 0 auto;
    /* overflow: hidden; */
}

.s5-logo ul {

    white-space: nowrap;
    margin: 0 auto;
    margin-top: .15rem;
    display: flex;
    align-items: center;
    justify-content: center;

}

.s5-logo ul li {
    display: inline-block;
    height: .52rem;
    margin: 0 1rem;
    animation: cloudMove 6s linear infinite;
    transition: all .6s;
}

.s5-logo ul li:hover {

    animation-play-state: paused;
}

.s5-logo ul li img {
    transition: all .6s;
}

.s5-logo ul li:hover img {
    transform: scale(1.3) !important;
}

.s5-logo ul li a {
    display: block;
    height: 100%;
}

.s5-logo ul li a img {
    display: block;
    max-height: 100%;
}

/* .s5-logo ul:nth-child(2) {
    width: 60%;
} */

@keyframes cloudMove {
    0% {
        transform: translateX(0) scale(1);
    }

    20% {
        transform: translateX(-2px) scale(1.2);
    }

    40% {
        transform: translateX(2px) scale(1.1);
    }

    60% {
        transform: translateX(-2px) scale(1.2);
    }

    80% {
        transform: translateX(2px) scale(1);
    }

    100% {
        transform: translateX(0) scale(1);
    }
}

@keyframes cloudMove1 {
    0% {
        transform: scale(1);
    }

    20% {
        transform: scale(1.5);
    }
}

.s5-logo ul:nth-child(2) li {}


.s5-logo ul li.yun1 {}

.s5-logo ul li.yun2 {
    animation-duration: 8s;
}

.s5-logo ul li.yun3 {
    animation-duration: 10s;
}

.s5-logo ul li.yun4 {
    animation-duration: 12s;
}

.s5-logo ul li.yun5 {
    animation-duration: 15s;
}

.s5-logo ul li.yun6 {
    animation-duration: 8s;
}

.s5-logo ul li.yun7 {
    animation-duration: 10s;
}

.s5-logo ul li.yun8 {
    animation-duration: 8s;
}

.s5-logo ul li.yun9 {
    animation-duration: 9s;
}

.s5-logo ul li.yun10 {
    animation-duration: 10s;
}

@media screen and (min-width: 1025px) {



    .s5 ul li:hover a .s5-icon span {
        background: linear-gradient(90deg, rgba(0, 93, 169, 1) 0%, rgba(11, 119, 207, 1) 100%);
    }

    .s5 ul li:hover a .txt p i {
        color: #0048bf;
    }
}

@media screen and (max-width: 1024px) {
    .section5::after {
        display: none;
    }

    .section5 {
        background-size: cover;
    }

    .s5-logo {
        margin-top: .2rem;
    }

    .s5 {
        height: initial;
        margin: 0 !important;
        width: 100%;
    }

    .s5 .swiper-slide {
        transform: none !important;
        left: auto !important;
    }

    .s5-logo ul li {
        margin: 0 .6rem;
    }
}

@media screen and (max-width: 768px) {
    .section5 {
        padding-top: 0;
    }

    .section4 {
        padding-bottom: .2rem;
    }

    .s5 ul li a .s5-icon {
        width: 1.6rem;
        height: 1.6rem;
    }

    .s5 ul li a .txt p span {
        font-size: .4rem;
    }

    .s5-logo ul li {
        width: 25%;
        padding: 0 .2rem;
        margin: 0;
        max-width: 100%;
        animation: none !important;
    }

    .s5-logo ul {
        flex-wrap: wrap;
    }

    .s5-logo ul li a {
        width: 100%;
        display: flex;
        align-items: center;
    }

    .s5-logo ul li a img {
        max-width: 100%;
    }
}

.section6 {
    padding-top: .6rem;
    padding-bottom: .7rem;
    background: linear-gradient(to bottom, #edf7ff 30%, transparent);
}

.section6 .title {
    justify-content: center;
    margin-bottom: .1rem;
}

.section6 .title .more {
    position: absolute;
    right: 0;
    bottom: 0;
}

.s6 {
    position: relative;
    margin: 0 auto
}

.s6 .slide-c1 {
    padding-top: .2rem;
    padding-bottom: .4rem;
    perspective: 1000px;
    touch-action: pan-y;
    padding: .28rem 0;
}

.slide-c1 .swiper-slide {}

.slide-c1 .swiper-slide .pic {
    padding-top: 4.5rem;
    border-radius: .15rem;
}

.slide-c1 .swiper-slide,
.carousel .slide-c1,
.slide-c1 .swiper-wrapper {
    transform-style: preserve-3d;
}

.slide-c1 .swiper-slide-active {
    transform: translate3d(0, 0, -2.8rem) rotateY(0deg);
    transition: .5s
}

.slide-c1 .swiper-slide-prev {
    transform: translate3d(-.3rem, 0, -2.5rem) rotateY(20deg);
    transition: .5s
}

.slide-c1 .swiper-slide-next {
    transform: translate3d(.3rem, 0, -2.5rem) rotateY(-20deg);
    transition: .5s
}

.slide-c1 .swiper-slide.pr2 {
    transform: translate3d(-.3rem, 0, -1.6rem) rotateY(35deg);
    transition: .5s
}

.slide-c1 .swiper-slide.ne2 {
    transform: translate3d(.3rem, 0, -1.6rem) rotateY(-35deg);
    transition: .5s
}

.slide-c1 .swiper-slide.pr3 {
    transform: translate3d(.15rem, 0, -.2rem) rotateY(50deg);
    transition: .5s
}

.slide-c1 .swiper-slide.ne3 {
    transform: translate3d(-.15rem, 0, -.2rem) rotateY(-50deg);
    transition: .5s
}

.slide-c1 .swiper-slide.pr4 {
    transform: translate3d(.15rem, 0, -.2rem) rotateY(50deg);
    transition: .5s;
    opacity: 0
}

.slide-c1 .swiper-slide.ne4 {
    transform: translate3d(-.15rem, 0, -.2rem) rotateY(-50deg);
    transition: .5s;
    opacity: 0
}

.s6 .slide-c2 {
    width: 7rem;
    position: absolute;
    left: 50%;
    top: .5rem;
    transform: translateX(-50%);
    z-index: 5;
    border-radius: .1rem;
    box-shadow: 0 .1rem .4rem rgba(76, 98, 189, .5);
}

.slide-c2 .pic {
    padding-top: 4rem;
    border-radius: .1rem
}

.slide-c2 .swiBtn a {
    display: block;
    width: .54rem;
    height: .54rem;
    border-radius: 50%;
    text-align: center;
    line-height: .54rem;
    color: #6e50d0;
    background: rgba(255, 255, 255, .8);
    font-size: .18rem;
    font-weight: bold;
    position: absolute;
    top: 50%;
    margin-top: -.27rem;
    z-index: 5
}

.slide-c2 .swiBtn a.prev {
    left: .2rem;
}

.slide-c2 .swiBtn a.next {
    right: .2rem;
}

.slide-c2 .swiBtn a:hover {
    color: #fff;
    background: rgba(35, 48, 143, .78);
}

.zt_cir {
    display: flex;
    justify-content: center;

}

.zt_cir span {
    position: relative;
    width: .12rem;
    height: .12rem;
    border-radius: 50%;
    background: #b1b1b2;
    margin: 0 9px !important;
    opacity: 1;
}

.zt_cir span::after {
    content: "";
    position: absolute;
    width: .2rem;
    height: .2rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px solid transparent;
}

.zt_cir span.swiper-pagination-bullet-active {
    background: #0b77cf;
}

.zt_cir span.swiper-pagination-bullet-active:after {
    border: 1px solid #0b77cf;
}

@media (min-width: 2000px) {
    .slide-c1 .swiper-slide.pr2 {
        transform: translate3d(-.2rem, 0, -1.6rem) rotateY(35deg);
        transition: .5s
    }

    .slide-c1 .swiper-slide.ne2 {
        transform: translate3d(.2rem, 0, -1.6rem) rotateY(-35deg);
        transition: .5s
    }

    .slide-c1 .swiper-slide.pr3 {
        transform: translate3d(.3rem, 0, -.2rem) rotateY(50deg);
        transition: .5s
    }

    .slide-c1 .swiper-slide.ne3 {
        transform: translate3d(-.3rem, 0, -.2rem) rotateY(-50deg);
        transition: .5s
    }

    .slide-c1 .swiper-slide.pr4 {
        transform: translate3d(.3rem, 0, -.2rem) rotateY(50deg);
        transition: .5s;
        opacity: 0
    }

    .slide-c1 .swiper-slide.ne4 {
        transform: translate3d(-.3rem, 0, -.2rem) rotateY(-50deg);
        transition: .5s;
        opacity: 0
    }
}

@media screen and (max-width: 1024px) {
    .s6 .slide-c1 {
        display: none;
    }

    .zt_cir {
        margin-top: .2rem;
    }

    .s6 .slide-c2 {
        position: static;
        width: 100%;
        transform: none;
        box-shadow: none;
        margin-top: .2rem;
    }

    .slide-c2 .pic {
        padding-top: 62.65%;
    }
}

@media screen and (max-width: 768px) {
    .section6 {
        padding: .2rem 0;
    }
}

.section7 {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1.17rem;
}

.s7 {
    height: 2.4rem;
    border-radius: .15rem;
    background: url(../images/s7-bg.jpg) no-repeat center center/cover;
}

.s7 ul {
    display: flex;
    flex-wrap: wrap;
    padding: .3rem;
}

.s7 ul li {
    width: 16.66%;

}

.s7 ul li a {
    position: relative;
    display: block;
    top: 0;
    transition: all .6s;
}

.s7 ul li:hover a {
    top: -5px;
}

.s7 ul li a .s7_icon {
    position: relative;
    width: 1.1rem;
    height: 1.1rem;

    padding: .15rem;

    margin: 0 auto;
}

.s7 ul li a .s7_icon::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: 1px dashed #0b77cf;
    border-radius: 50%;
}

.s7 ul li:hover a .s7_icon::after {
    animation: play 6s linear infinite;
}

.s7 ul li a .s7_icon span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, #0b76cf, #005eaa);
    border-radius: 50%;

}

.s7 ul li a .s7_icon span img {
    max-height: .4rem;
}

.s7 ul li:hover a .s7_icon span {
    border: .07rem solid #97c0e4;
}

.s7 ul li a p {
    text-align: center;
    margin-top: .15rem;
    font-size: .18rem;
    color: #0b77cf;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.s7 ul li:hover a p {
    font-weight: bold;
}

@media screen and (max-width: 768px) {
    .section7 {
        position: static;
        width: 100%;
    }

    .s7 ul li {
        width: 33.33%;
        margin: .15rem 0;
    }

    .s7 {
        height: initial;
    }

    .index {
        padding-bottom: .15rem;
    }
}

@media screen and (max-width: 480px) {
    .s7 ul li {
        width: 50%;
    }

    .s7 ul li a .s7_icon {
        padding: .1rem;
    }
}