body {
    margin: 0;
}

img {
    user-select: none;
    -webkit-user-select: none;
    /* Safari */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
}

button {
    outline: none;
    border: none;
}

ul {
    list-style: none;
    /* 去掉默认的列表标记 */
    padding: 0;
    /* 去掉默认的内边距 */
    margin: 0;
    /* 去掉默认的外边距 */
}

li {
    list-style-type: none;
    /* 确保没有列表标记 */
    padding: 0;
    /* 去掉内边距 */
    margin: 0;
    /* 去掉外边距 */
}

p,
h1 {
    margin: 0;
}

input {
    all: unset;
    width: 100%;
}

.text_center {
    display: flex;
    border: 1px solid transparent;
    width: 1200px;
    margin: 0 auto;
    justify-content: space-between;
    box-sizing: border-box;
}

.pdtb80 {
    padding: 80px 0 20px;
}

.banner_gen_box {
    display: inline-block;
    text-align: left;
    width: 480px;
}

.banner_gen_title_new {
    font-weight: 600;
    font-size: 26px;
    color: #333333;
    margin-top: 83px;
}

.banner_gen_p {
    color: #666666;
    line-height: 28px;
    font-size: 16px;
}

.banner_gen_title {
    font-size: 36px;
    font-weight: 600;
    margin-top: 75px;
    margin-bottom: 24px;
    color: #333333;
    line-height: 50px;
    text-align: left;
}

.banner_gen_text {
    font-size: 16px;
    font-weight: 400;
    color: #666666;
    text-align: left;
    line-height: 40px;
    text-indent: -1.1em;
    margin-left: 1.1em;
}

.banner_gen_text::before {
    content: '';
    margin: 2.5px;
    margin-right: 10px;
    border-radius: 4px;
    border: 1px solid transparent;
    height: 4px;
    width: 4px;
    background: #666666;
    display: inline-block;
    line-height: 40px;
}

.banner_gen_green_button {
    display: inline-block;
    width: 180px;
    height: 42px;
    background: #00D0D0;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    color: #FFFFFF;
    line-height: 42px;
    margin: 32px 20px 0 0;
    cursor: pointer;
    text-align: center;
}

.banner_gen_white_button {
    display: inline-block;
    width: 180px;
    height: 42px;
    border-radius: 4px;
    border: 1px solid #00D0D0;
    font-size: 14px;
    font-weight: 600;
    color: #00D0D0;
    line-height: 42px;
    margin: 32px 20px 0 0;
    cursor: pointer;
    text-align: center;

}

@font-face {
    font-family: 'Retroica';
    src: url('../fonts/Retroica.ttf') format('truetype');
}

.banxin {
    width: 1200px;
    margin: 0 auto;
}

@keyframes shake {
    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-5px);
    }

    50% {
        transform: translateX(5px);
    }

    75% {
        transform: translateX(-5px);
    }

    100% {
        transform: translateX(0);
    }
}

.quivering_effect {
    animation: shake 0.5s ease-in-out;
}

/* branner */
.container_cn5>.branner {
    width: 100%;
    background: linear-gradient(180deg, #E5FFFF 0%, #FFFFFF 100%);
    padding-top: 174px;
}

.container_cn5>.branner .left {
    padding-top: 20px;
}

.container_cn5>.branner .left .p1 {
    font-weight: 600;
    font-size: 26px;
    color: #333333;
}

.container_cn5>.branner .left .p2 {
    font-weight: bold;
    font-size: 45px;
    color: #00D0D0;
    margin-top: 18px;
}

.container_cn5>.branner .left .p3 {
    font-size: 20px;
    color: #666;
    margin-top: 46px;
}

.container_cn5>.branner .left .p3 span {
    color: #333333;
    font-size: 24px;
    font-weight: 600;
}

.container_cn5>.branner .left .btn {
    width: 240px;
    height: 60px;
    background: #00D0D0;
    border-radius: 6px;
    font-weight: 600;
    font-size: 20px;
    color: #FFFFFF;
    text-align: center;
    line-height: 60px;
    cursor: pointer;
    margin-top: 41px;
    position: relative;
}

.container_cn5>.branner .left .btn img {
    position: absolute;
    right: -18px;
    width: 112px;
    top: -23px;
}

/* 数字banner */
.container_cn5>.num_banner {
    width: 100%;
    background-image: url(../images/vipon5/background1.webp);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    min-height: 420px;
    padding-top: 90px;
}

.container_cn5>.num_banner h1 {
    text-align: center;
    font-weight: 600;
    font-size: 36px;
    color: #333333;
}

.container_cn5>.num_banner ul {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}

.container_cn5>.num_banner ul li {
    width: 270px;
    height: 150px;
    background: #FFFFFF;
    box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    transition: all .3s;
    color: #00BFBF;
    cursor: pointer;
}

.container_cn5>.num_banner ul li:hover {
    background: #00BFBF;
}

.container_cn5>.num_banner ul li div .img1 {
    display: block;
}

.container_cn5>.num_banner ul li div .img2 {
    display: none;
}

.container_cn5>.num_banner ul li:hover .img1 {
    display: none;
}

.container_cn5>.num_banner ul li:hover .img2 {
    display: block;
}

.container_cn5>.num_banner ul li p {
    font-size: 16px;
    color: #666666;
    text-align: center;
    margin-top: 32px;
}

.container_cn5>.num_banner ul li:hover p,
.container_cn5>.num_banner ul li:hover span,
.container_cn5>.num_banner ul li:hover .number_scroll_number:before,
.container_cn5>.num_banner ul li:hover .number_scroll_number2:before {
    color: #fff;
}

.container_cn5>.num_banner ul li .div1 {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.container_cn5>.num_banner ul li .div1 .span2 {
    margin-top: 1.0625rem;
}

.container_cn5>.num_banner ul li img {
    height: 21px;
}

/* 用户数据 */
.container_cn5>.statistics {
    height: 395px;
    width: 100%;
    background: url(../images/vipon5/background2.webp);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    margin-top: 80px;
    overflow: hidden;
}

.container_cn5>.statistics>.banxin>h1 {
    text-align: center;
    font-weight: 600;
    font-size: 36px;
    color: #FFFFFF;
    margin-top: 70px;
}

.container_cn5>.statistics>.banxin>.statistics_text {
    margin: 12px auto 0;
    width: 406px;
    height: 36px;
    border-radius: 18px;
    border: 1px solid #FFFFFF;
    line-height: 36px;
    text-align: center;
    font-size: 16px;
    color: #FFFFFF;
}

.container_cn5>.statistics>.banxin>ul {
    margin-top: 56px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.container_cn5>.statistics>.banxin>ul>li>p:nth-child(1) {
    font-size: 40px;
    color: #FFFFFF;
    font-family: Retroica, Arial, sans-serif;
}

.container_cn5>.statistics>.banxin>ul>li>p:nth-child(2) {
    margin-top: 6px;
    font-size: 18px;
    color: #FFFFFF;
    text-align: center;
}

/* 轮播部分 */
.container_cn5>.carousel>.banxin>h1 {
    font-weight: 600;
    font-size: 36px;
    color: #333333;
    text-align: center;
    margin-top: 90px;
}

.container_cn5>.carousel>.banxin>h1>span {
    color: #00D0D0;
}

.container_cn5>.carousel>.banxin>.ul1 {
    display: flex;
    justify-content: space-between;
    margin: 30px auto;
    width: 980px;
}

.container_cn5>.carousel>.banxin>.ul1>li {
    width: 160px;
    height: 36px;
    background: #f4f4f4;
    transform: skew(20deg);
    position: relative;
    transition: all .3s;
}

.container_cn5>.carousel>.banxin>.ul1>.selected,
.container_cn5>.carousel>.banxin>.ul1>.selected>.half-circle,
.container_cn5>.carousel>.banxin>.ul1>.selected>.half-circle-rigth,
.container_cn5>.carousel>.banxin>.ul1>.selected>.parallelogram {
    background: #DBF8F8;
    color: #00BFBF;
}

.container_cn5>.carousel>.banxin>.ul1>li>.parallelogram {
    width: 160px;
    height: 36px;
    text-align: center;
    transform: skew(-20deg);
    line-height: 36px;
    font-size: 14px;
    color: #333333;
    cursor: pointer;
    background: initial !important;
    transition: all .3s;
}

.container_cn5>.carousel>.banxin>.ul1>li>.half-circle {
    width: 35px;
    height: 36px;
    background-color: #f4f4f4;
    transform: skew(-20deg);
    border-radius: 50% 0 0 50%;
    position: absolute;
    left: -16px;
    top: 0;
    transition: all .3s;
}

.container_cn5>.carousel>.banxin>.ul1>li>.half-circle-rigth {
    width: 35px;
    height: 36px;
    background-color: #f4f4f4;
    transform: skew(-20deg);
    border-radius: 0 50% 50% 0;
    position: absolute;
    right: -16px;
    top: 0;
    transition: all .3s;
}

.container_cn5>.carousel>.banxin>.ul2 {
    margin-top: 60px;
    position: relative;
    height: 590px;
}

.container_cn5>.carousel>.banxin>.ul2>li {
    position: absolute;
    top: 0;
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.5s ease-in-out;
}

.container_cn5>.carousel>.banxin>.ul2>.selected_new {
    opacity: 1;
    transform: scale(1);
    z-index: 99;
}

/* 套餐 */
.container_cn5>.package>.banxin>h1 {
    font-size: 36px;
    color: #333333;
    margin-top: 90px;
    text-align: center;
}

.container_cn5>.package>.banxin>.btn {
    margin: 30px 0;
    display: flex;
    justify-content: center;
}

.container_cn5>.package>.banxin>.btn>button {
    width: 120px;
    height: 36px;
    background: #F4F4F4;
    cursor: pointer;
    font-size: 14px;
    color: #333333;
    position: relative;
    transition: all .3s;
}

.container_cn5>.package>.banxin>.btn>.switch_active {
    background: #DBF6F6;
    color: #00BFBF;
}

.container_cn5>.package>.banxin>.btn>button:nth-child(1) {
    border-radius: 18px 0 0 18px;
}

.container_cn5>.package>.banxin>.btn>button:nth-child(2) {
    border-radius: 0 18px 18px 0;
}

.container_cn5>.package>.banxin>.btn>button>.discount {
    position: absolute;
    left: -65px;
    top: -12px;
    width: 71px;
    height: 23px;
    border-radius: 14px 10px 0px 14px;
    border: 1px solid #FE4848;
    line-height: 23px;
    font-size: 12px;
    color: #FE4848;
    background: #ffffff;
}

.container_cn5>.package>.banxin>.package_list {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.container_cn5>.package>.banxin>.package_list>.list {
    width: 1093px;
    padding: 10px 0;
    overflow: hidden;
}

.container_cn5>.package>.banxin>.text {
    font-weight: 600;
    color: #333333;
    margin-top: 20px;
    font-size: 14px;
}

.container_cn5>.package>.banxin>.text>p {
    font-weight: 400;
    color: #666666;
}

.container_cn5>.package>.banxin>.package_list>.list>ul {
    width: 2211px;
    display: flex;
    justify-content: space-between;
    position: relative;
    left: 0;
    transition: all .3s;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>.Select_identification {
    box-shadow: 0px 6px 40px 0px rgba(0, 0, 0, 0.1);
    border: 2px solid #00D0D0;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>.Select_identification>.start_btn {
    background: #00D0D0;
    color: #FFFFFF;
    border: none;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>img {
    position: absolute;
    top: -1px;
    left: -1px;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li {
    width: 344px;
    background: #FFFFFF;
    border-radius: 16px;
    border: 1px solid #EEEEEE;
    cursor: pointer;
    box-sizing: border-box;
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    padding-bottom: 20px;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.title {
    font-weight: 600;
    font-size: 20px;
    color: #333333;
    text-align: center;
    margin: 44px 0 0;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.price_box {
    font-weight: 600;
    font-size: 12px;
    color: #333333;
    text-align: center;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.price_box>span:nth-child(1) {
    font-size: 24px;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.price_box>span:nth-child(2) {
    margin-left: 10px;
    color: #999999;
    font-weight: 400;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.start_btn {
    width: 200px;
    height: 42px;
    background: #FFFFFF;
    border-radius: 4px;
    border: 1px solid #CCCCCC;
    text-align: center;
    line-height: 42px;
    font-weight: 600;
    font-size: 14px;
    color: #333333;
    margin: 40px auto 0;
    transition: all .3s;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.start_btn:hover {
    background: #00D0D0;
    color: #fff;
    border: none
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.style_one {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
    text-align: center;
    margin-top: 20px;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.style_one>span {
    color: #333333;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.style_two {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
    text-align: center;
    margin-top: 10px;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.style_two>span {
    background-color: #F0FBFB;
    padding: 5px 10px;
    color: #999999;
    border-radius: 3px;
    line-height: 20px;
}

.container_cn5>.package>.banxin>.package_list>.list>ul>li>.transverse_line {
    width: 40px;
    height: 1px;
    background: #EEEEEE;
    margin: 16px auto;
}

.container_cn5>.package>.banxin>.package_list>.pull_left,
.container_cn5>.package>.banxin>.package_list>.pull_right {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all .3s;
}

.container_cn5>.feedback {
    padding: 90px 0;
}

.container_cn5>.feedback>.banxin>h1 {
    font-weight: 600;
    font-size: 36px;
    color: #333333;
    text-align: center;
}

.container_cn5>.feedback>.banxin>.feedback_list {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.container_cn5>.feedback>.banxin>.feedback_list>.pull_left,
.container_cn5>.feedback>.banxin>.feedback_list>.pull_right {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all .3s;
}

.container_cn5>.feedback>.banxin>.feedback_list>.feedback_list_box {
    width: 1070px;
    overflow: hidden;
    margin-top: 40px;
}

.container_cn5>.feedback>.banxin>.feedback_list>.feedback_list_box>ul {
    width: 2170px;
    display: flex;
    justify-content: space-between;
    position: relative;
    left: 0;
    transition: all .3s;
}

.container_cn5>.feedback>.banxin>.btn {
    width: 200px;
    height: 38px;
    background: #00D0D0;
    border-radius: 4px;
    margin: 40px auto 0;
    cursor: pointer;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 38px;
    text-align: center;
}

.container_cn5>.back_top {
    width: 48px;
    height: 48px;
    background: #00D0D0;
    border-radius: 6px;
    position: fixed;
    right: 60px;
    bottom: 130px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all .3s;
}

.container_cn5>.back_top>p {
    font-size: 12px;
    color: #FFFFFF;
}

.container_cn5>.bottom_registration {
    width: 970px;
    height: 96px;
    background: #fff;
    border-radius: 8px;
    position: fixed;
    bottom: 0;
    left: calc(50% - 500px);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start;
    z-index: 9999;
    box-shadow: 0 -2px 8px 0 rgba(0, 0, 0, 0.08);
    padding: 14px 30px;
}

.container_cn5>.bottom_registration>.input_ipone {
    display: flex;
    align-items: center;
    width: 200px;
    height: 38px;
    background: #FFFFFF;
    border-radius: 4px;
    border: 1px solid #EEEEEE;
    padding: 0 20px 0 16px;
    box-sizing: border-box;
    font-size: 16px;
}

.container_cn5>.bottom_registration>.input_ipone>input::placeholder,
.container_cn5>.bottom_registration>.input_code>input::placeholder {
    font-size: 14px;
    color: #999999;
}

.container_cn5>.bottom_registration>.input_code>p {
    font-size: 14px;
    color: #00D0D0;
    cursor: pointer;
    text-align: center;
    width: 70px;
}

.container_cn5>.bottom_registration>.input_code {
    width: 210px;
    height: 38px;
    background: #FFFFFF;
    border-radius: 4px;
    border: 1px solid #EEEEEE;
    display: flex;
    align-items: center;
    padding: 0 16px;
    box-sizing: border-box;
    justify-content: space-between;
}

.container_cn5>.bottom_registration>.input_code>img {
    width: 66px;
    height: 30px;
    cursor: pointer;
}

.container_cn5>.bottom_registration>.btn {
    width: 188px;
    height: 38px;
    background: #00D0D0;
    border-radius: 4px;
    font-weight: 600;
    font-size: 16px;
    color: #FFFFFF;
    text-align: center;
    line-height: 38px;
    cursor: pointer;
    margin-left: 20px;
    position: relative;
}

.container_cn5>.bottom_registration>.btn>span {
    display: flex;
    align-items: center;
    justify-content: center;
}

.container_cn5>.bottom_registration>.btn>img {
    position: absolute;
    right: -25px;
    top: -20px;
    width: 90px;
}

/* 数字滚动 */
.number_box1,
.number_box2,
.number_box3,
.number_box4 {
    position: relative;
    display: flex;
}

.number_scroll_number {
    position: relative;
    display: inline-block;
    vertical-align: sub;
    text-align: center;
    overflow: hidden;
    text-transform: uppercase;
}

.number_scroll_number,
.number_scroll_number_2 {
    width: 1.5vw;
    text-align: center;
    height: 2.2917vw;
    line-height: 2.2917vw;
    text-shadow: 0px .1042vw .2083vw rgba(0, 208, 208, 0.2);
    font-family: Retroica, Arial, sans-serif;
}

.number_scroll_number:before {
    position: absolute;
    z-index: 9999;
    top: 1px;
    left: 0;
    width: 100%;
    word-break: break-all;
    text-align: center;
    color: #0CBEBE;
    font-size: 2.2917vw;
    font-family: Retroica, Arial, sans-serif;
    line-height: 2.2917vw;
    text-shadow: 0px .1042vw .2083vw rgba(0, 208, 208, 0.2);
}

.number_box1 span:nth-child(1):before,
.number_box2 span:nth-child(1):before,
.number_box3 span:nth-child(1):before,
.number_box4 span:nth-child(1):before {
    -webkit-animation-name: number_box;
    animation-name: number_box;
    -webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

.number_box1 span:nth-child(1):before {
    content: "03456785";
}

.number_box2 span:nth-child(1):before {
    content: "03456787";

}

.number_box3 span:nth-child(1):before {
    content: "03456786";

}

.number_box4 span:nth-child(1):before {
    content: "03456783";

}

.number_box1 span:nth-child(2):before,
.number_box2 span:nth-child(2):before,
.number_box3 span:nth-child(2):before,
.number_box4 span:nth-child(2):before {
    -webkit-animation-name: number_box;
    animation-name: number_box;
    -webkit-animation-duration: 1.9s;
    animation-duration: 1.9s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

.number_box1 span:nth-child(2):before {
    content: "03456785";
}

.number_box2 span:nth-child(2):before {
    content: "03456788";

}

.number_box3 span:nth-child(2):before {
    content: "03456782";

}

.number_box4 span:nth-child(2):before {
    content: "03456781";

}


@-webkit-keyframes number_box {
    from {
        margin-top: 0;
    }

    to {
        margin-top: -16.1458vw;
    }
}



.number_scroll_number_2 {
    display: inline-block;
    transform: translateY(-0.1042vw);
}





/* ----------- */

.site_arrow_title {
    width: 100%;
    text-align: center;
    height: 2.6042vw;
    font-size: 1.875vw;
    font-weight: 600;
    color: #333333;
    line-height: 2.6042vw;
    margin-top: 4.1667vw;
}

.site_arrow {
    widows: 100%;
    margin: 0 auto;
    height: 23.5417vw;
    border: 1px solid transparent;
    background-size: cover !important;
    -webkit-background-size: cover !important;
    -o-background-size: cover !important;
    background-position: center top !important;
    background: url("../images/site_arrow_bg.png") no-repeat;
}

.site_arrow_box {
    width: 62.5vw;
    height: 9.4792vw;
    border: 1px solid transparent;
    background: #FFFFFF;
    border-radius: 1.5625vw;
    margin: 2.0833vw auto;
    margin-bottom: 4.6875vw;
    padding-top: 1.6792vw;
}

.site_arrow_img_box {

    margin-top: .9375vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

.site_arrow_img {
    margin: 0 2.592vw 0 0.9375vw;
    height: 3.5417vw;
    width: 3.5417vw;
}


.site_arrow_text {
    text-align: center;
    margin: 0 2.592vw 0 0.9375vw;
    height: 3.5417vw;
    width: 3.5417vw;
    font-size: .7292vw;
    color: #666666;
    line-height: 1.0417vw;
}

.site_arrow_text_box {
    width: 62.5vw;
}

/* why_choose_vipon_bg */

.why_choose_vipon_bg {
    overflow: hidden;
    background-color: #00BFBF;
    position: relative;
    height: 970px;
    margin-top: 90px;
}

.why_choose_vipon_title {
    font-size: 36px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 40px;
    text-align: center;
    margin-top: 80px;
}

.why_choose_vipon {
    width: 1200px;
    height: 698px;
    background: url('../images/vipon5/why_choose_vipon2_new.png') no-repeat;
    text-align: start;
    margin-bottom: 80px;
    float: left;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.why_choose_vipon_first {
    margin-top: 30px;
    padding-left: 218px;
    line-height: 84px;
}

.why_choose_vipon_first_box1,
.why_choose_vipon_first_box2,
.why_choose_vipon_first_box3 {
    display: inline-block;
    width: 300px;
    height: 84px;
    font-weight: 600;
    font-size: 18px;
    color: #666666;
    text-align: center;
}

.why_choose_vipon_first_box1 {
    font-size: 24px;
    color: #7B584E;
}

.why_choose_vipon_first_box2 {
    margin-left: 20px;
}

.inline_block {
    display: inline-block;
    float: left;
}

.why_choose_vipon_box1 {
    height: 110px;
    width: 190px;
    text-align: center;
    line-height: 112px;
    font-weight: 600;
    color: #333333;
    font-size: 16px;
}

.why_choose_vipon_box2 {
    width: 300px;
    height: 110px;
    text-align: center;
    margin-left: 30px;
    padding-top: 30px;
    box-sizing: border-box;
}

.why_choose_vipon_box2_img {
    height: 20px;
    width: 20px;
    vertical-align: sub;
}

.why_choose_vipon_box2_text1 {
    font-weight: 600;
    color: #333333;
    line-height: 24px;
    font-size: 16px;
}

.why_choose_vipon_box2_text2 {
    font-size: 14px;
    color: #999999;
    line-height: 24px;
    margin-top: 6px;
}

.why_choose_vipon_box3,
.why_choose_vipon_box4 {
    width: 300px;
    height: 110px;
    text-align: center;
    margin-left: 10px;
    padding-top: 30px;
    box-sizing: border-box;
}

.why_choose_vipon_box2_img {
    height: 20px;
    width: 20px;
    vertical-align: sub;
}

.why_choose_vipon_box3_text1 {
    font-weight: 600;
    color: #999999;
    line-height: 24px;
    font-size: 16px;
}

.why_choose_vipon_box3_text2 {
    font-size: 14px;
    color: #999999;
    line-height: 24px;
}

.why_choose_vipon_left {
    width: 546px;
    height: 522px;
    position: absolute;
    top: 0;
    background: url(../images/why_choose_vipon_left.png);
}

.why_choose_vipon_right {
    width: 469px;
    height: 968px;
    position: absolute;
    background: url(../images/why_choose_vipon_right.png);
    right: 0;
    bottom: 0;
}


/* .ascroll_forever_banner */
.ascroll_forever_banner {
    padding-bottom: 90px;
    background-position: center top;
    background: url(../images/ascroll_forever_banner_bg.png);
    width: 100%;
    overflow: hidden;
}

.ascroll_forever_banner_title {
    margin-top: 90px;
    font-size: 36px;
    font-weight: 600;
    color: #333333;
    text-align: center;
}

.ascroll_forever_banner_title2 {
    color: #999999;
    text-align: center;
    margin-top: 18px;
    line-height: 26px;
    margin-bottom: 32px;
}

.ascroll_forever {
    height: 122px;
    width: 200%;
    overflow: hidden;
    margin: 20px auto;
}

.ascroll_forever li {
    height: 120px;
    width: 240px;
    border: 1px solid #EEEEEE;
    float: left;
    margin: 1px 10px;
    background: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}

.ascroll_forever li img {
    margin: auto;
}

#ascroll_forever1 {
    position: relative;
    left: -140px;
}


/* 组件弹窗样式 */
.ivu-message {
    top: 730px !important;
}

.ivu-message-notice-content {
    background-color: rgba(0, 0, 0, 0.5) !important;
    color: #fff !important;
}

.loader {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: spin 1s ease-in-out infinite;
    margin-right: 5px;
    display: none;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.mid_year_top_bg {
    position: fixed;
    top: 60px;
    border: 1px solid transparent;
    background: url("../images/midyearpromotion/vipon_banner1920_60.webp");
    margin-top: 0px;
    width: 100vw;
    height: 60px;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-position: center top;
    cursor: pointer;
    z-index: 999999;
    display: none;
}

.mid_year_top_bg_close {
    background: url(../images/vipon4_close.png);
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    height: 12px;
    width: 12px;
    float: right;
    margin: 23px 40px;
}

.md_tip_1 {
    height: 52px;
    width: 1022px;
    border: 2px solid #AA94FF;
    border-radius: 8px;
    background: linear-gradient(180deg, #EFEBFF 0%, #FFFFFF 100%);
    margin: 15px auto;
    text-align: center;
    line-height: 52px;
    font-size: 17px;
    font-family: PingFangSC-Semibold, sans-serif;
    font-weight: 600;
    cursor: pointer;
    display: none;
}

.color_8104FE {
    color: #7F5FFF;
}

.attention {
    color: #999999;
}

.attention a {
    color: #00BFBF;
}

.attention a:hover {
    color: #00BFBF;
}

.el-checkbox__input {
    margin-left: 10px !important;
}

.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
    background-color: #00BFBF !important;
}

.el-checkbox__input.is-focus .el-checkbox__inner {
    border-color: #00BFBF !important;
}

.el-tooltip__popper {
    background-color: rgba(0, 0, 0, .5) !important;
    z-index: 9999 !important;
    border-radius: 8px !important;
}

.el-tooltip__popper[x-placement^=bottom] .popper__arrow::before {
    border-bottom-color: rgba(0, 0, 0, .5) !important;
}

.el-tooltip__popper[x-placement^=bottom] .popper__arrow {
    border-bottom-color: initial !important;
}