.box1 {
    padding: calc((80 / 19.2) * 1%) 0 calc((127 / 19.2) * 1%)
}

.box1 .box1_main {
    --pd: 80px;
    --l1-w: calc((840 / 14) * 1%);
    display: flex;
    justify-content: space-between
}

.box1 .box1_main .l1 {
    width: var(--l1-w)
}

.box1 .box1_main .l1 .top {
    display: flex
}

.box1 .box1_main .l1 .top .l2 {
    width: 253px;
    font-family: Lato;
    font-weight: 900;
    font-size: 40px;
    flex-shrink: 0
}

.box1 .box1_main .l1 .top .r2 .t1 {
    position: relative
}

.box1 .box1_main .l1 .top .r2 .t1::before {
    content: "";
    display: block;
    width: 1px;
    height: 0;
    padding-bottom: calc((114 / 5.86) * 1%);
    background: #333333;
    position: absolute;
    left: -13px;
    top: 0
}

.box1 .box1_main .l1 .top .r2 .tt2 {
    font-family: Lato;
    line-height: 32px;
    margin-top: 6px
}

.box1 .box1_main .l1 .top .r2 .t3999 {
    margin-top: 20px
}

.box1 .box1_main .l1 .bot {
    margin-top: 45px;
    padding-bottom: calc((306 / 8.39) * 1%)
}

.box1 .box1_main .r1 {
    width: calc(100% - var(--pd) - var(--l1-w));
    padding-bottom: calc((700 / 14) * 1%)
}

.box2 .img2 {
    padding-bottom: calc((403 / 19.2) * 1%)
}

.box2 .box2_main {
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    position: relative;
    z-index: 9;
    width: calc(100% - var(--all-pd) * 2);
    margin: calc((250 / 19.2) * -1%) auto 0;
    --l-w: 277px;
    display: flex;
    box-shadow: 0 1px 30px 0 rgba(0, 0, 0, 0.2)
}

.box2 .box2_main .lll {
    width: var(--l-w);
    background: var(--color-main);
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.box2 .box2_main .lll .t1 {
    color: #ffffff;
    padding: 28px 17px
}

.box2 .box2_main .lll ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 23px 16px;
    color: #fff;
    cursor: pointer
}

.box2 .box2_main .lll ul li.active {
    background: #443030
}

.box2 .box2_main .lll ul li span {
    display: block;
    width: 5.5px;
    height: 10px;
    background: url(../images/ab/ab5.png) no-repeat center / cover
}

.box2 .box2_main .rrr {
    width: calc(100% - var(--l-w))
}

.box2 .box2_main .rrr .swiper_p {
    height: 0;
    overflow: hidden
}

.box2 .box2_main .rrr .swiper_p.active {
    height: auto;
    overflow: unset
}

.box2 .box2_main .rrr .top {
    justify-content: space-between;
    padding-bottom: 36px;
    border-bottom: 1px solid #e5e5e5;
    padding: 66px 25px 25px 70px
}

.box2 .box2_main .rrr .top span {
    font-weight: 600;
    font-size: 18px
}

.box2 .box2_main .rrr .top .prne div {
    width: 38px;
    height: 38px;
    background: #666666;
    border-radius: 50%;
    border: 3px solid #666666;
    cursor: pointer
}

.box2 .box2_main .rrr .top .prne .prev {
    margin-right: 13px;
    background: url(../images/ab/ab6.png) no-repeat center / 30%
}

.box2 .box2_main .rrr .top .prne .next {
    background: url(../images/ab/ab7.png) no-repeat center / 30%
}

.box2 .box2_main .rrr .swiper_main {
    padding: 63px 70px 86px;
    position: relative
}

.box2 .box2_main .rrr .swiper_main .swpa {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%)
}

.box2 .box2_main .rrr .swiper_main .swpa .swiper-pagination-bullet {
    width: 9px;
    height: 9px;
    background: #d9d9d9;
    opacity: 1;
    margin: 0 8px
}

.box2 .box2_main .rrr .swiper_main .swpa .swiper-pagination-bullet-active {
    background: var(--color-main)
}

.box2 .box2_main .rrr .swiper1 .swiper-slide {
    background-position: center;
    background-size: cover;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    opacity: .6;
    transition: opacity .3s
}

.box2 .box2_main .rrr .swiper1 .swiper-slide-active {
    opacity: 1
}

.box2 .box2_main .rrr .swiper1 .swiper-slide .img {
    padding-bottom: calc((415/ 3) * 1%)
}

.box2 .adv {
    padding: calc((80 / 14) * 1%) 0 calc((100 / 14) * 1%)
}

.box2 .adv .adv_main {
    margin-top: 20px;
    --l-w: calc((575 / 14) * 1%);
    --pd: calc((115 / 14) * 1%)
}

.box2 .adv .adv_main .lll,
.box2 .adv .adv_main .lll p {
    color: #999999;
    line-height: 32px
}

.box2 .adv .adv_main .lll p {
    margin-top: 5px
}

.box2 .adv .adv_main .rrr .img {
    padding-bottom: calc((477 / 7.09) * 1%)
}

.box2 .adv .adv_main .rrr .img img {
    object-fit: contain
}

.box2 .adv .adv_main .rrr .lists {
    margin-top: 20px
}

.box2 .adv .adv_main .rrr .lists .item {
    width: calc(100% / 3);
    padding: 16px 16px 10px 20px
}

.box2 .adv .adv_main .rrr .lists .item:nth-child(3n + 2) {
    border-left: 1px solid #d9d9d9;
    border-right: 1px solid #d9d9d9
}

.box2 .adv .adv_main .rrr .lists .item .num {
    font-size: 50px
}

.box2 .adv .adv_main .rrr .lists .item .t3666 {
    margin-top: 5px
}

.box3 {
    background: url(../images/ab/ab10.png) no-repeat center / cover;
    padding: calc((108 / 19.2) * 1%) 0 calc((73 / 19.2) * 1%)
}

.box3 .box3_main {
    --l-w: calc((416 / 14) * 1%);
    --pd: 190px;
    margin: 0
}

.box3 .box3_main ul li {
    cursor: pointer;
    margin-top: 10px
}

.box3 .box3_main ul li.active span {
    border-radius: 30px;
    border-color: var(--color-main)
}

.box3 .box3_main ul li span {
    color: var(--color-main);
    border: 1px solid transparent;
    line-height: 32px;
    display: inline-flex;
    padding: 0 13px
}

.box3 .box3_main .img {
    padding-bottom: calc((528 / 7.94) * 1%);
    margin-bottom: 16px
}

.box3 .rrr .ritem {
    height: 0;
    overflow: hidden
}

.box3 .rrr .ritem.active {
    height: auto;
    overflow: unset
}

@media screen and (max-width:1366px) {
    .box1 .box1_main {
        --pd: 40px
    }
    .box1 .box1_main{ flex-wrap: wrap;}
    .box1 .box1_main .l1{  width: 100%; }
    .box1 .box1_main .r1{  width: 100%;  margin-top: 20px;}
.flex_main{ align-items: center;}
    .box1 .box1_main .l1 .top {
        flex-direction: column
    }

    .box1 .box1_main .l1 .top .l2 {
        text-align: left;
        width: auto;
        margin-bottom: 20px
    }

    .box3 .box3_main {
        --l-w: 40%;
        --pd: 90px
    }
}

@media screen and (max-width:950px) {
    .box1 .box1_main {
        flex-direction: column
    }
.row_center{      align-items: baseline !important;}
    .box1 .box1_main .l1,
    .box1 .box1_main .r1 {
        width: 100%
    }

    .box1 .box1_main .l1 .bot {
        padding-bottom: 70%
    }

    .box1 .box1_main .r1 {
        padding-bottom: 70%;
        margin-top: 30px
    }

    .box2 .img2 {
        padding-bottom: 70%
    }

    .box2 .box2_main {
        flex-direction: column;
        margin: -50% auto 0
    }

    .box2 .box2_main .lll,
    .box2 .box2_main .rrr {
        width: 100%
    }

    .box2 .box2_main .rrr .swiper_main {
        padding: 30px 10px
    }

    .box2 .box2_main .rrr .swiper_main .swpa {
        bottom: 5px
    }

    .box2 .adv .adv_main .rrr .lists .item .num {
        font-size: 20px;
    }

    .box2 .adv .adv_main .rrr .lists .item .t3666 {
        line-height: 1.3;
        text-align: center;
    }
}

.swpa{ display: block !important;}