.swiper1 .pagination {
    padding: 0 1.375rem;
}
.swiper1 .section {
    padding-top: 0;
    padding-bottom: 0;
}
.swiper1 .t1 {
    font-size: .75rem;
    line-height: unset;
}
.swiper1 .t2 {
    font-size: 1rem;
    line-height: unset;
}
.swiper1 .t3 {
    font-size: .6rem;
    line-height: unset;
}
.pagination {
    bottom: 1rem;
}
.pagination .swiper-pagination {
    position: relative;
}
.swiper-pagination-current {
    font-size: .8rem;
    color: #FEFFFF;
    /* line-height: .625rem; */
}
.swiper-pagination-total {
    font-size: .3rem;
    color: #FEFFFF;
    /* line-height: .625rem; */
    opacity: 0.4;
    position: absolute;
    top: .275rem;
    margin-left: .15rem;
    width: .75rem;
}
.pagination .swiper-pagination.black * {
    color: #333;
}
.swiper-pagination-fraction {
    width: max-content;
    bottom: 0;
}
.pagination .buttons {
    gap: .5625rem;
}
.pagination .buttons > * {
    border: .0125rem solid #fff;
    width: .625rem;
    height: .625rem;
}
.swiper1 .pagination .buttons > *:hover {
    background: var(--main-color);
    border-color: var(--main-color);
}
.pagination .buttons i {
    font-size: .175rem;
}
.pagination-border {
    width: 4.6rem;
    border-bottom: .0125rem solid #fefefe;
    margin-top: .4375rem;
}
.pagination-border::after {
    content: '';
    width: 1.25rem;
    height: .05rem;
    background: #fff;
    position: absolute;
    left: 0;
    top: -0.05rem;
}

.section.about {
    background-image: url('../images/index-about-bg.png');
}
.section.about .flex {
    gap: 1.6875rem;
}
.section.about .section-intro {
    margin-bottom: 1.8125rem;
}
.section.about .list {
    /* background-position: 1.375rem; */
    gap: .4125rem;
}
.section.about .list > div {
    box-shadow: 0rem 0rem .1rem 0rem rgba(0,0,0,0.17);
    height: 3.0625rem;
}
.section.about .list > div .cover {
    padding: .5875rem .5375rem;
}
.section.about .list > div .cover .title {
    color: #323334;
}
.section.about .list > div .cover .intro {
    color: #666666;
}
.section.about .list > div.active .cover {
    /* background: var(--main-color); */
}
.section.about .list > div.active .cover * {
    color: #fff;
}
.section.about .list > div .title {
    font-size: .3rem;
    /* line-height: .4125rem; */
}
.section.about .list > div .intro {
    font-size: .2rem;
    margin-top: .15rem;
    width: 4.375rem;
}

.section.service {
    padding: 0;
}
.section.service .left {
    padding: 1.9375rem 1.375rem;
}
.section.service .left .tabs {
    margin-top: .8rem;
    font-size: .3rem;
}
.section.service .left .tabs .tab {
    border-bottom: .025rem solid transparent;
    padding-bottom: .175rem;
}
.section.service .left .tabs .tab.active {
    border-color: #fff;
}
.section.service .left .tabs .items {
    margin-top: .5625rem;
}
.section.service .left .tabs .items .item {
    height: 3.5625rem;
    display: none;
}
.section.service .left .tabs .items .item.active {
    display: block;
}
.section.service .right {
    width: 8.375rem;
}

.section.advantages .list {
    gap: .25rem;
}
.section.advantages .list .item {
    border-radius: .125rem;
    width: 1.9375rem;
    padding: .625rem;
    padding-bottom: .25rem;
    height: 9.7875rem;
}
.section.advantages .list .item .title {
    writing-mode: tb-rl;
    font-size: .5rem;
}
.section.advantages .list .item .intro {
    display: none;
    margin-bottom: .8125rem;
    font-size: .2rem;
}
.section.advantages .list .item .pic {
    display: none;
}
.section.advantages .list .item .num {
    text-align: center;
    font-size: .4rem;
}
.section.advantages .list .item.active {
    width: 7.05rem;
}
.section.advantages .list .item.active .intro, .section.advantages .list .item.active .pic {
    display: block;
}
.section.advantages .list .item.active .ico {
    display: none;
}
.section.advantages .list .item.active .num {
    text-align: left;
}

.section.partner {
    background-image: url(../images/partner2.png);
    height: 13.4rem;
    padding: 0;
}
.section.partner .box {
    padding-top: 8.5rem;
}
.section.partner .box * {
    color: #fff;
}
.section.partner .box .content {
    margin-top: .325rem;
    margin-bottom: .625rem;
}
.section.partner .icon {
    width: 1.35rem;
    height: 1.35rem;
}

.section.partner .icon:hover::before, .section.partner .icon:hover::after{
    content: '';
    width: .125rem;
    height: .125rem;
    display: block;
    border: .125rem solid #fff;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    z-index: 1;
}
.section.partner .icon:hover::before {
    animation: spread 2s linear infinite;
}
.section.partner .icon:hover::after {
    animation: spread 2s 1s linear infinite;
}

@keyframes spread {
    0%{
        width: .125rem;
        height: .125rem;
        opacity: 1;
    }
    100%{
        width: 3rem;
        height: 3rem;
        opacity: 0;
    }
}
.section.partner .icon1 {
    top: 2.2rem;
    left: 4.3rem;
}
.section.partner .icon2 {
    top: 3.375rem;
    left: 7.5875rem;
}
.section.partner .icon3 {
    top: 5.45rem;
    left: 3.425rem;
}
.section.partner .icon4 {
    top: 7.0625rem;
    left: 7.1rem;
}
.section.partner .icon5 {
    top: 9.0125rem;
    left: 3.575rem;
}
.section.partner .icon6 {
    top: 2.7375rem;
    left: 19.3rem;
}
.section.partner .icon7 {
    top: 3.9rem;
    left: 14.8375rem;
}
.section.partner .icon8 {
    top: 5.625rem;
    left: 17.75rem;
}
.section.partner .icon9 {
    top: 8.125rem;
    left: 16.0625rem;
}
.section.partner .icon10 {
    top: 9rem;
    left: 19.2rem;
}

.section.join {
    background-image: url(../images/join.png);
    height: 5.45rem;
}
.section.join .box {
    width: 8.125rem;
}
.section.join .box .content {
    margin-top: .325rem;
    margin-bottom: .625rem;
}

@media screen and (max-width: 768px) {
    .section.about .list > div {
        padding: 0.6rem !important;
        height: auto;
    }
    .section.about .list > div .intro {
        width: auto;
    }
    .section.service .left .tabs .flex {
        width: max-content;
        gap: 0.6rem;
    }
    .section.service .left .tabs .items .item {
        height: auto;
    }
    .section.service .right {
        width: auto;
    }
    .section.advantages .list {
        margin-top: 0.6rem;
    }
    .section.advantages .list .item {
        width: 100% !important;
        height: auto;
    }
    .section.advantages .list .item .title {
        writing-mode: unset;
    }
    .section.advantages .list .item .intro {
        display: block;
    }
    .section.advantages .list .item .num {
        text-align: left;
    }
    .section.partner {
        height: auto !important;
        background-image: unset;
    }
    .section.partner .box {
        padding-top: 0;
        /* padding-bottom: .1875rem; */
    }
    .section.join {
        height: auto !important;
    }
    .section.join .box {
        width: auto !important;
    }
    .section.advantages .right .swiper3 .swiper-slide {
        height: auto;
    }
    .pagination .buttons > * {
        width: 32px;
        height: 32px;
        padding: 0.25rem;
    }
    .pagination .buttons i {
        font-size: 16px;
    }
    .swiper-pagination-current {
        font-size: 18px;
    }
    .swiper-pagination-total {
        font-size: 12px;
        top: 0.5rem;
        margin-left: 0.3rem;
        width: max-content;
    }
    .section.advantages .pagination .buttons img {
        width: 40px;
        height: 40px;
    }
    .section.about .list > div {
        padding: 4rem 0.6rem;
    }
}