<style>
    *{
        box-sizing: border-box;
            margin: 0;
            padding: 0;
    }
    a{
        all: unset;
        cursor: pointer;
    }
    .container-new{
        width: calc(1920/1920*100vw);
        .title{
                font-size: calc(42/1920*100vw);
                font-weight: 600;
                margin-bottom: calc(25/1920*100vw);
                @media (max-width: 768px) {
                    font-size: calc(24/390*100vw);
                    margin-bottom: calc(25/390*100vw);
                }
        }
        .line{
                width: calc(64/1920*100vw);
                height: calc(5/1920*100vw);
                background-color: #207DFF;
                margin-bottom: calc(48/1920*100vw);
                @media (max-width: 768px) {
                    width: calc(32/390*100vw);
                    height: calc(2/390*100vw);
                    margin-bottom: calc(24/390*100vw);
                }
        }
        .button{
            display: flex;
            align-items: center;
            gap: calc(16/1920*100vw);
        }
        .arrow{
            width: calc(20/1920*100vw) !important;
            height: calc(20/1920*100vw) !important;
            z-index: 10;
            @media (max-width: 768px) {
                width: calc(10/390*100vw) !important;
                height: calc(10/390*100vw) !important;
            }
        }
        .banner-container {
            position: relative;
            overflow: hidden;
            width: 100%;
            height: calc(663/1920*100vw);
            /* 添加以下样式 */
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            touch-action: pan-y;
            /* 结束添加 */
            @media (max-width: 768px) {
                height: calc(230/390*100vw);
            }
        }
        .banner-wrapper {
            display: flex;
            transition: transform 0.5s ease;
            height: 100%;
        }
        .banner {
            position: relative;
            display: flex;
            justify-content: space-between;
            align-items: start;
            min-width: 100%;
            height: 100%;
            flex-shrink: 0;
            @media (max-width: 768px) {
                width: 50%;
            }
        }
        .banner img{
            position: absolute;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: -1;
            @media (max-width: 768px) {
                height: 100%;
                object-position: center;
            }
        }
        .banner-single img.banner-single-img{
            position: absolute;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 1; /* 确保这个图片的z-index比其他元素高，可以被点击 */
            cursor: pointer; /* 添加鼠标指针样式 */
            @media (max-width: 768px) {
                object-fit: fill;
            }
        }
        .banner-dots {
            position: absolute;
            bottom: calc(20/1920*100vw);
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: calc(10/1920*100vw);
            z-index: 10;
            @media (max-width: 768px) {
                bottom: calc(10/390*100vw);
                gap: calc(5/390*100vw);
            }
        }
        .dot {
            width: calc(12/1920*100vw);
            height: calc(12/1920*100vw);
            border-radius: 50%;
            background-color: rgba(255, 255, 255, 0.5);
            cursor: pointer;
            transition: background-color 0.3s;
            @media (max-width: 768px) {
                width: calc(8/390*100vw);
                height: calc(8/390*100vw);
            }
        }
        .dot.active {
            background-color: white;
        }
        .banner-single .left-content{
            margin-left: calc(85/1920*100vw);
            position: relative;
            z-index: 2; /* 确保内容在图片上方 */
        }
        .left-content{
            width: calc(600/1920*100vw);
            display: flex;
            flex-direction: column;
            margin-left: calc(332/1920*100vw);
            @media (max-width: 768px) {
                width: calc(200/390*100vw);
                margin-left: calc(20/390*100vw);
            }
            .logo{
                margin-top: calc(12/1920*100vw);
                margin-bottom:calc(155/1920*100vw);
                @media (max-width: 768px) {
                    margin-top: calc(15/390*100vw);
                    margin-bottom:calc(50/390*100vw);
                }
                img{
                    width: calc(172/1920*100vw);
                    height: calc(43/1920*100vw);
                    object-fit: contain;
                    @media (max-width: 768px) {
                        width: calc(86/390*100vw);
                        height: calc(21.5/390*100vw);
                    }
                }
                .logo-text{
                    font-size: calc(28/1920*100vw);
                    font-weight: 600;
                }
        }
        .info {
            .top-tip {
                    box-sizing: border-box;
                    width:calc(210/1920*100vw);
                    padding: calc(5/1920*100vw) calc(22/1920*100vw);
                    font-size: calc(24/1920*100vw);
                    color:#207DFF;
                    text-align: center;
                    background-color: white;
                    border-radius: calc(23/1920*100vw);
                    border-bottom-left-radius: 0;
                    @media (max-width: 768px) {
                        width:calc(100/390*100vw);
                        padding: calc(2/390*100vw) calc(10/390*100vw);
                        font-size: calc(12/390*100vw);
                        border-radius: calc(15/390*100vw);
                        border-bottom-left-radius: 0;
                    }
                }
                .title{
                    font-size: calc(48/1920*100vw);
                    font-weight: 600;
                    color: white;
                    margin: calc(13/1920*100vw) 0;
                    line-height: 120%;
                    @media (max-width: 768px) {
                        font-size: calc(15/390*100vw);
                        margin: calc(6/390*100vw) 0;
                    }
                }
                .sub-title{
                    font-size: calc(24/1920*100vw);
                    color: white;
                    line-height: 120%;
                    margin-bottom: calc(64/1920*100vw);
                    @media (max-width: 768px) {
                        display: relative;
                        width: calc(300/390*100vw);
                        font-size: calc(12/390*100vw);
                        margin-bottom: calc(32/390*100vw);
                    }
                }
            }
            .button-open{
                display: flex;
                justify-content: center;
                align-items: center;
                width: calc(156/1920*100vw);
                height: calc(48/1920*100vw);
                background-color: #2A68FF;
                color: white;
                border-radius: calc(24/1920*100vw);
                cursor: pointer;
                font-size: calc(18/1920*100vw);
                @media (max-width: 768px) {
                    width: calc(100/390*100vw);
                    height: calc(30/390*100vw);
                    border-radius: calc(15/390*100vw);
                    font-size: calc(14/390*100vw);
                }
            }
        }
        .right-content{
            display: flex;
            justify-content: end;
            align-items: center;
            margin-right: calc(388/1920*100vw);
            margin-top: calc(12/1920*100vw);
            gap: calc(23/1920*100vw);
            @media (max-width: 768px) {
                margin-right: calc(10/390*100vw);
                margin-top: calc(10/390*100vw);
                gap: calc(12/390*100vw);
            }
            .button-login{
                cursor: pointer;
                font-size: calc(16/1920*100vw);
                color: #fff;
                @media (max-width: 768px) {
                    font-size: calc(14/390*100vw);
                }
            }
            .button-register{
                display: flex;
                justify-content: center;
                align-items: center;
                width: calc(106/1920*100vw);
                height: calc(42/1920*100vw);
                background-color: #2A68FF;
                color: white;
                border-radius: calc(24/1920*100vw);
                cursor: pointer;
                font-size: calc(16/1920*100vw);
                @media (max-width: 768px) {
                    font-size: calc(14/390*100vw);
                    width: calc(80/390*100vw);
                    height: calc(30/390*100vw);
                    border-radius: calc(15/390*100vw);
                }
            }
        }

        /* 为banner-single的right-content添加z-index */
        .banner-single .right-content {
            position: relative;
            z-index: 2; /* 设置z-index大于图片 */
        }

        .applicable-people{
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            padding: calc(100/1920*100vw) 0;
            background-color: #f9fbff;;
            @media (max-width: 768px) {
                padding: calc(50/390*100vw) 0;
            }
            .peoples{
                display: flex;
                gap: calc(24/1920*100vw);
                @media (max-width: 768px) {
                    flex-wrap: wrap;
                    justify-content: center;
                    gap: calc(12/390*100vw);
                }
                .people{
                    display: flex;
                    box-sizing: border-box;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    width: calc(220/1920*100vw);
                    height: calc(250/1920*100vw);
                    padding: calc(42/1920*100vw) calc(50/1920*100vw);
                    background-color: white;
                    border-radius: calc(12/1920*100vw);
                    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
                    @media (max-width: 768px) {
                        width: calc(160/390*100vw);
                        height: calc(180/390*100vw);
                        padding: calc(32/390*100vw) calc(40/390*100vw);
                        border-radius: calc(12/390*100vw);
                    }
                    img{
                        width: calc(120/1920*100vw);
                        margin-bottom: calc(13/1920*100vw);
                        @media (max-width: 768px) {
                            width: calc(80/390*100vw);
                            margin-bottom: calc(8/390*100vw);
                        }
                    }
                    .name{
                        font-size: calc(24/1920*100vw);
                        @media (max-width: 768px) {
                            font-size: calc(16/390*100vw);
                        }
                    }
                }
            }
        }
        .advantage{
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            box-sizing: border-box;
            padding: calc(100/1920*100vw) calc(360/1920*100vw);
            @media (max-width: 768px) {
                padding: calc(50/390*100vw) calc(20/390*100vw);
            }
            .advantage-list{
                display: flex;
                gap: calc(24/1920*100vw);
                flex-wrap: wrap;
                @media (max-width: 768px) {
                    justify-content: center;
                    gap: calc(12/390*100vw);
                }
                .advantage-item{
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    box-sizing: border-box;
                    width: calc(384/1920*100vw);
                    height: calc(279/1920*100vw);
                    padding: 0 calc(32/1920*100vw);
                    border-radius: calc(12/1920*100vw);
                    background-color: #F4F7FC;
                    @media (max-width: 768px) {
                        width: calc(160/390*100vw);
                        height: calc(180/390*100vw);
                        padding: calc(32/390*100vw) calc(20/390*100vw);
                        border-radius: calc(12/390*100vw);
                    }
                    img{
                        width: calc(80/1920*100vw);
                        @media screen and (max-width: 768px) {
                            width: calc(40/390*100vw);
                        }
                    }
                    .name{
                        margin:calc(13/1920*100vw) 0;
                        font-size: calc(28/1920*100vw);
                        @media screen and (max-width: 768px) {
                            font-size: calc(16/390*100vw);
                            margin:calc(8/390*100vw) 0;
                        }
                    }
                    .sub-name{
                        font-size: calc(18/1920*100vw);
                        color: #4D4D4D;
                        @media screen and (max-width: 768px) {
                            font-size: calc(10/390*100vw);
                        }
                    }
                }
            }
        }
        .why-us{
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            background-color: #F9FBFF;
            padding-top: calc(100/1920*100vw);
                @media (max-width: 768px) {
                    padding-top: calc(50/390*100vw);
                }
            .reason-list {
                display: flex;
                justify-content: space-between;
                width: 100%;
                height: calc(448/1920*100vw);
                z-index: 1;
                @media (max-width: 768px) {
                    flex-wrap: wrap;
                    justify-content: center;
                    gap: calc(12/390*100vw);
                    height: calc(630/390*100vw);
                }
                .reason-item{
                    position: relative;
                    width: calc(382/1920*100vw);
                    padding: 0 calc(45/1920*100vw);
                    transition: background-color 0.3s, color 0.3s;
                    @media (max-width: 768px) {
                        width: calc(160/390*100vw);
                        height: calc(180/390*100vw);
                        padding: 0 calc(20/390*100vw);
                    }
                    &:hover{
                        color: white;
                        background-color: rgba(34, 83, 182, 0.8);
                    }
                    &:hover .index {
                        color: white;
                    }
                    &:hover .title{
                        color: white;
                    }
                    &:hover .description{
                        display: block;
                    }
                    &:hover .title{
                        display: none;
                    }
                    .description {
                        display: none;
                        color: white;
                        font-size: calc(24/1920*100vw);
                        @media (max-width: 768px) {
                            font-size: calc(12/390*100vw);
                        }
                    }
                    img{
                        position: absolute;
                        width: calc(382/1920*100vw);
                        height: calc(448/1920*100vw);
                        top: 0;
                        left: 0;
                        z-index: -1;
                        @media (max-width: 768px) {
                            width: calc(160/390*100vw);
                            height: calc(180/390*100vw);
                        }
                    }
                    .index{
                        margin-top: calc(55/1920*100vw);
                        margin-bottom: calc(24/1920*100vw);
                        font-size: calc(48/1920*100vw);
                        opacity: 0.5;
                        color: #ffffff;
                        font-weight: 600;
                        @media (max-width: 768px) {
                            font-size: calc(24/390*100vw);
                            margin-top: calc(20/390*100vw);
                            margin-bottom: calc(12/390*100vw);
                        }
                    }
                    .title{
                        font-size: calc(32/1920*100vw);
                        font-weight: normal;
                        color: #ffffff;
                        @media (max-width: 768px) {
                            font-size: calc(16/390*100vw);
                        }
                    }
                }
            }
        }
        .docking{
            position: relative;
            display: flex;
            align-items: center;
            flex-direction: column;
            width: calc(1920/1920*100vw);
            height: calc(594/1920*100vw);
            margin-top: calc(24/1920*100vw);
            top: 0;
            left: 0;
            @media (max-width: 768px) {
                width: 100%;
                height: calc(360/390*100vw);
                margin-top: calc(12/390*100vw);
            }
            img{
                position: absolute;
                width: 100%;
                height: auto;
                z-index: -1;
                @media (max-width: 768px) {
                    height: calc(360/390*100vw);
                }
            }
            .docking-title{
                margin-top: calc(84/1920*100vw);
                color: #fff;
                @media (max-width: 768px) {
                    margin-top: calc(40/390*100vw);
                }
            }
            .platforms{
                display: flex;
                width: calc(1200/1920*100vw);
                height: calc(225/1920*100vw);
                padding:0 calc(16/1920*100vw);
                @media (max-width: 768px) {
                    width: calc(350/390*100vw);
                    height: calc(150/390*100vw);
                    padding:0 calc(12/390*100vw);
                }
                .left{
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    color: #fff;
                    font-size: calc(18/1920*100vw);
                    width: calc(240/1920*100vw);
                    height: 100%;
                    background-color: rgba(255, 255, 255, 0.2);
                    border-top-left-radius: calc(12/1920*100vw);
                    border-bottom-left-radius: calc(12/1920*100vw);
                    backdrop-filter: blur(27.2px);
                    @media (max-width: 768px) {
                        width: calc(100/390*100vw);
                        height: calc(150/390*100vw);
                        border-top-left-radius: calc(12/390*100vw);
                        border-bottom-left-radius: calc(12/390*100vw);
                        font-size: calc(12/390*100vw);
                        padding: 0 calc(12/390*100vw);
                    }
                    .platform-item{
                        width: 100%;
                        height: calc(48/1920*100vw);
                        padding: calc(12/1920*100vw) calc(36/1920*100vw);
                        @media (max-width: 768px) {
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            height: calc(30/390*100vw);
                            padding: calc(0/390*100vw) calc(5/390*100vw);
                            width: calc(100/390*100vw);
                        }
                    }
                    .platform-item.active{
                        position: relative;
                        background-color: rgba(255, 255, 255, 0.1);
                    }
                    .platform-item.active::before {
                        content: "";
                        position: absolute;
                        left: 0;
                        top: 0;
                        height: calc(48/1920*100vw);
                        width: calc(3/1920*100vw);
                        background-color: white;
                        @media (max-width: 768px) {
                            height: 0;
                            width: 0;
                        }
                    }
                }
                .right{
                    display: flex;
                    align-items: center;
                    flex: 1;
                    height: calc(225/1920*100vw);
                    background-color: rgba(255, 255, 255, 0.2);
                    border-top-right-radius: calc(12/1920*100vw);
                    border-bottom-right-radius: calc(12/1920*100vw);
                    backdrop-filter: blur(43.52px);
                    @media (max-width: 768px) {
                        height: calc(150/390*100vw);
                        border-top-right-radius: calc(12/390*100vw);
                        border-bottom-right-radius: calc(12/390*100vw);
                    }
                    .content{
                        display: none;
                        justify-content: center;
                        align-items: center;
                        margin-left: calc(42/1920*100vw);
                        height: calc(80/1920*100vw);
                        img{
                            position: relative;
                            width: calc(80/1920*100vw);
                            margin-right: calc(16/1920*100vw);
                            @media (max-width: 768px) {
                                width: calc(50/390*100vw);
                                margin: 0;
                                height: calc(50/390*100vw);
                            }
                        }
                        .info{
                            @media (max-width: 768px) {
                                display: flex;
                                flex-direction: column;
                                justify-content: center;
                                align-items: center;
                            }
                            .info-title{
                                font-size: calc(28/1920*100vw);
                                font-weight: 600;
                                color: #fff;
                                margin-bottom: calc(8/1920*100vw);
                                @media (max-width: 768px) {
                                    font-size: calc(16/390*100vw);
                                    margin-bottom: calc(4/390*100vw);
                                    margin-top: calc(10/390*100vw);
                                }
                            }
                            .info-description{
                                font-size: calc(20/1920*100vw);
                                color: #fff;
                                @media (max-width: 768px) {
                                    font-size: calc(12/390*100vw);
                                    padding: 0 calc(20/390*100vw);
                                    text-align: center;
                                }
                            }
                        }
                    }
                    .content.active{
                        display: flex;
                        @media (max-width: 768px) {
                            flex-direction: column;
                            margin-left: 0;
                        }
                    }
                }
            }
            .button-get{
                display: flex;
                justify-content: center;
                align-items: center;
                padding: 0 calc(36/1920*100vw);
                height: calc(41/1920*100vw);
                margin-top: calc(39/1920*100vw);
                font-size: calc(16/1920*100vw);
                color: #3073FF;
                background-color: #fff;
                border-radius: calc(22/1920*100vw);
                padding: calc(10/1920*100vw) calc(36/1920*100vw);
                cursor: pointer;
                @media (max-width: 768px) {
                    height: calc(30/390*100vw);
                    font-size: calc(12/390*100vw);
                    border-radius: calc(16/390*100vw);
                    padding: calc(10/390*100vw) calc(20/390*100vw);
                    margin-top: calc(20/390*100vw);
                }
            }
        }
        .function-overview-new{
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            padding-top: calc(100/1920*100vw);
            @media (max-width: 768px) {
                padding-top: calc(50/390*100vw);
            }
            .line{
                margin-bottom: calc(20/1920*100vw);
                @media (max-width: 768px) {
                    margin-bottom: calc(20/390*100vw);
                }
            }
            .sub-title{
                font-size: calc(20/1920*100vw);
                color: #404146;
                @media (max-width: 768px) {
                    font-size: calc(12/390*100vw);
                }
            }
            .content{
                display: flex;
                width: 100%;
                justify-content: space-between;
                padding: calc(49/1920*100vw) calc(361/1920*100vw);
                @media (max-width: 768px) {
                    padding: calc(10/390*100vw) calc(5/390*100vw);
                }
                .tmenu,.free,.professional{
                    width: calc(283/1920*100vw);
                    border-radius: calc(11/1920*100vw);
                    @media (max-width: 768px) {
                        width: calc(125/390*100vw);
                        border-radius: calc(11/390*100vw);
                    }
                    .top{
                        display: flex;
                        align-items: center;
                        padding-left: calc(36/1920*100vw);
                        font-size: calc(20/1920*100vw);
                        width: 100%;
                        height: calc(163/1920*100vw);
                        background-color: #fff;
                        border-radius: calc(11/1920*100vw) calc(11/1920*100vw) 0 0;
                        font-weight: 600;
                        @media (max-width: 768px) {
                            height: calc(100/390*100vw);
                            font-size: calc(12/390*100vw);
                            padding-left: calc(20/390*100vw);
                            border-radius: calc(11/390*100vw) calc(11/390*100vw) 0 0;
                        }
                    }
                    .bottom{
                        display: flex;
                        flex-direction: column;
                        .item{
                            display: flex;
                            align-items: center;
                            padding-left: calc(36/1920*100vw);
                            font-size: calc(16/1920*100vw);
                            width: 100%;
                            height: calc(60/1920*100vw);
                            background-color: #fff;
                            @media (max-width: 768px) {
                                height: calc(40/390*100vw);
                                font-size: calc(10/390*100vw);
                                padding-left: calc(20/390*100vw);
                            }
                            &:nth-child(odd){
                                background-color: #F6F8FC;
                            }
                            &:nth-child(even){
                                background-color: #fff;
                            }
                        }
                    }
                }
                .tmenu{
                    border: calc(1/1920*100vw) solid #bbc1d5;
                    .item{
                        &:last-child{
                            border-radius: 0 0 calc(11/1920*100vw) calc(11/1920*100vw);
                            @media (max-width: 768px) {
                                border-radius: 0 0 calc(11/390*100vw) calc(11/390*100vw);
                            }
                        }
                    }
                }
                .free,.professional{
                    width: calc(431/1920*100vw);
                    background-color: #fff;
                    @media (max-width: 768px) {
                        width: calc(120/390*100vw);
                    }
                    .top{
                        display: flex;
                        justify-content: center;
                        flex-direction: column;
                        align-items: center;
                        font-size: calc(20/1920*100vw);
                        font-weight: 600;
                        padding-left: 0;
                        color: #fff;
                        @media (max-width: 768px) {
                            font-size: calc(12/390*100vw);
                        }
                        img{
                            margin-bottom: calc(8/1920*100vw);
                            width: calc(42/1920*100vw);
                            @media (max-width: 768px) {
                                width: calc(20/390*100vw);
                                margin-bottom: calc(4/390*100vw);
                            }
                        }
                    }
                    .bottom{
                        border: calc(1/1920*100vw) solid #bbc1d5;
                        border-top: none;
                        border-radius: 0 0 calc(11/1920*100vw) calc(11/1920*100vw);
                        @media (max-width: 768px) {
                            border-radius: 0 0 calc(11/390*100vw) calc(11/390*100vw);
                        }
                        .item{
                            padding-left: 0;
                            justify-content: center;
                            &:last-child{
                                border-radius: 0 0 calc(11/1920*100vw) calc(11/1920*100vw);
                                @media (max-width: 768px) {
                                    border-radius: 0 0 calc(11/390*100vw) calc(11/390*100vw);
                                }
                            }
                        }
                    }
                }
                .free{
                    .top{
                        background: linear-gradient(180deg, #2988f7 0%, #4fbcff 100%);
                    }
                }
                .professional{
                    .top{
                        background: linear-gradient(180deg, #2953ff 0%, #3987ff 100%);
                    }
                }
            }
            .see-all{
                display: flex;
                justify-content: center;
                align-items: center;
                padding: calc(10/1920*100vw) calc(36/1920*100vw);
                height: calc(41/1920*100vw);
                font-size: calc(16/1920*100vw);
                color: #3073FF;
                border: calc(1/1920*100vw) solid #3073ff;
                border-radius: calc(22/1920*100vw);
                cursor: pointer;
                @media (max-width: 768px) {
                    height: calc(30/390*100vw);
                    font-size: calc(12/390*100vw);
                    border-radius: calc(16/390*100vw);
                    padding: calc(10/390*100vw) calc(20/390*100vw);
                    border: calc(1/390*100vw) solid #3073ff;
                }
            }
        }
        .see-all-content{
            display: flex;
            flex-direction: column;
            row-gap: calc(33/1920*100vw);
            width: calc(1200/1920*100vw);
            border-radius: calc(12/1920*100vw);
            margin:0 auto;
            margin-top: calc(48/1920*100vw);
            transition: height .5s ease;
            height: 0;
            overflow: hidden;
            @media (max-width: 768px) {
                width: calc(350/390*100vw);
                row-gap: calc(20/390*100vw);
                margin-top: calc(20/390*100vw);
                border-radius: calc(12/390*100vw);
            }
            &.active{
                height: calc(2032/1920*100vw);
                padding: calc(24/1920*100vw);
                border: calc(1/1920*100vw) solid #bbc1d5;
                @media (max-width: 768px) {
                    height: calc(1825/390*100vw);
                    padding: calc(20/390*100vw);
                    border-radius: calc(12/390*100vw);
                }
            }
            .content-item{
                .title{
                    display: flex;
                    justify-content: space-between;
                    width: 100%;
                    height: calc(24/1920*100vw);
                    margin-bottom: calc(16/1920*100vw);
                    @media (max-width: 768px) {
                        height: calc(20/390*100vw);
                        margin-bottom: calc(12/390*100vw);
                    }
                    .name{
                        font-size: calc(16/1920*100vw);
                        font-weight: 500;
                        color: #2A68FF;
                        @media (max-width: 768px) {
                            font-size: calc(12/390*100vw);
                        }
                    }
                    .line{
                        flex: 1;
                        height: 50%;
                        border-bottom: calc(1/1920*100vw) solid #E8E9ED;
                        margin-left: calc(16/1920*100vw);
                        background-color:transparent;
                        margin-bottom: 0;
                        @media (max-width: 768px) {
                            margin-left: calc(12/390*100vw);
                            border-bottom: calc(1/390*100vw) solid #E8E9ED;
                        }
                    }
                }
                .sub-title{
                    margin-bottom: calc(12/1920*100vw);
                    font-size: calc(14/1920*100vw);
                    color: #1D1D1D;
                    @media (max-width: 768px) {
                        font-size: calc(12/390*100vw);
                        margin-bottom: calc(10/390*100vw);
                    }
                }
                .tags{
                    display: flex;
                    flex-wrap: wrap;
                    row-gap: calc(16/1920*100vw);
                    column-gap: calc(12/1920*100vw);
                    @media (max-width: 768px) {
                        row-gap: calc(12/390*100vw);
                        column-gap: calc(10/390*100vw);
                    }
                    .tag{
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        height: calc(32/1920*100vw);
                        background-color: #EBECF0;
                        border-radius: calc(16/1920*100vw);
                        font-size: calc(14/1920*100vw);
                        padding: 0 calc(45/1920*100vw);
                        @media (max-width: 768px) {
                            height: calc(20/390*100vw);
                            border-radius: calc(16/390*100vw);
                            font-size: calc(12/390*100vw);
                            padding: 0 calc(30/390*100vw);
                        }
                    }
                }
                .fixed-width-tags{
                    .tag{
                        padding: 0;
                        width: calc(146/1920*100vw);
                        @media (max-width: 768px) {
                            width: calc(100/390*100vw);
                        }
                    }
                }
            }
        }
        .benefits{
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
            width:100%;
            height: calc(425/1920*100vw);
            margin-top: calc(50/1920*100vw);
            @media (max-width: 768px) {
                height: calc(380/390*100vw);
                margin-top: calc(20/390*100vw);
            }
            img{
                position: absolute;
                width: 100%;
                height: 100%;
                z-index: -1;
            }
            .info{
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                .title{
                    font-size: calc(42/1920*100vw);
                    font-weight: 600;
                    color: #292A2F;
                    margin-bottom: calc(28/1920*100vw);
                    @media (max-width: 768px) {
                        font-size: calc(24/390*100vw);
                        margin-bottom: calc(20/390*100vw);
                    }
                }
                .description{
                    margin:0 auto;
                    width: calc(1084/1920*100vw);
                    font-size: calc(20/1920*100vw);
                    color: #505668;
                    margin-bottom: calc(28/1920*100vw);
                    text-align: center;
                    @media (max-width: 768px) {
                        width: calc(350/390*100vw);
                        font-size: calc(16/390*100vw);
                        margin-bottom: calc(20/390*100vw);
                    }
                }
                .button-get{
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    width: calc(208/1920*100vw);
                    height: calc(52/1920*100vw);
                    font-size: calc(16/1920*100vw);
                    color: #fff;
                    background-color: #3073FF;
                    border-radius: calc(28/1920*100vw);
                    cursor: pointer;
                    @media (max-width: 768px) {
                        width: calc(150/390*100vw);
                        height: calc(40/390*100vw);
                        font-size: calc(12/390*100vw);
                        border-radius: calc(20/390*100vw);
                    }
                }
            }
        }
        .footer{
            display: flex;
            flex-direction: column;
            width: 100%;
            padding: 0 calc(360/1920*100vw);
            background-color: #14181E;
            @media (max-width: 768px) {
                padding: 0 calc(20/390*100vw);
            }
            .top-logo{
                box-sizing: content-box;
                display: flex;
                justify-content: space-between;
                align-items: center;
                height: calc(46/1920*100vw);
                margin-top: calc(12/1920*100vw);
                padding: calc(25/1920*100vw) 0;
                border-bottom: calc(1/1920*100vw) solid rgba(255, 255, 255, 0.28);
                @media (max-width: 768px) {
                    height: calc(20/390*100vw);
                    margin-top: calc(20/390*100vw);
                    margin-bottom: calc(10/390*100vw);
                    padding: 0;
                    border-bottom: none;
                }
                .logo{
                    width: calc(153/1920*100vw);
                    height: calc(46/1920*100vw);
                    @media (max-width: 768px) {
                        width: calc(100/390*100vw);
                        height: calc(30/390*100vw);
                    }
                }
                .contact-us{
                    display: flex;
                    color: #fff;
                    font-size: calc(14/1920*100vw);
                    .fixed,.mobile{
                        display: flex;
                        align-items: center;
                    }
                    .fixed-logo,.fixed-phone{
                        width: calc(20/1920*100vw);
                        height: calc(20/1920*100vw);
                    }
                    @media (max-width: 768px) {
                        display: none;
                    }
                }
            }
            .content{
                display: flex;
                margin-top: calc(28/1920*100vw);
                @media (max-width: 768px) {
                    display: flex;
                    flex-direction: column;
                }
                .left{
                    width: calc(274/1920*100vw);
                    height: calc(203/1920*100vw);
                    padding-right: calc(32/1920*100vw);
                    color: #fff;
                    font-size: calc(14/1920*100vw);
                    line-height: 180%;
                    @media (max-width: 768px) {
                        width: 100%;
                        height: auto;
                        padding-right:0;
                        font-size: calc(12/390*100vw);
                        border-bottom: calc(1/390*100vw) solid rgba(255, 255, 255, 0.28);
                        padding-bottom: calc(20/390*100vw);
                    }
                }
                .right{
                    display: flex;
                    margin-left: calc(46/1920*100vw);
                    column-gap: calc(80/1920*100vw);
                    @media (max-width: 768px) {
                        display: flex;
                        flex-direction: column;
                        margin-left: 0;
                        column-gap: 0;
                        margin-top: calc(20/390*100vw);
                    }
                    .items{
                        display: flex;
                        flex-direction: column;
                        .item-title{
                            font-size: calc(14/1920*100vw);
                            color: #fff;
                            margin-bottom: calc(22/1920*100vw);
                            .more{
                                display: none;
                            }
                            @media (max-width: 768px) {
                                display: flex;
                                justify-content: space-between;
                                align-items: center;
                                margin-bottom: calc(10/390*100vw);
                                font-size: calc(12/390*100vw);
                                padding-bottom: calc(10/390*100vw);
                                border-bottom: calc(1/390*100vw) solid rgba(255, 255, 255, 0.28);
                                .more{
                                    display: block;
                                    font-size: calc(14/390*100vw);
                                    margin-right: calc(10/390*100vw);
                                }
                            }
                        }
                        .item{
                            font-size: calc(14/1920*100vw);
                            color: #B0B0B0;
                            margin-bottom: calc(10/1920*100vw);
                            @media (max-width: 768px) {
                                font-size: calc(12/390*100vw);
                                margin-bottom: calc(10/390*100vw);
                                margin-left: calc(20/390*100vw);
                            }
                        }
                        .item-img{
                            display: flex;
                            justify-content: space-between;
                            @media (max-width: 768px) {
                                display: flex;
                                justify-content: start;
                                column-gap: calc(20/390*100vw);
                            }
                            img{
                                width: calc(90/1920*100vw);
                                height: calc(90/1920*100vw);
                                @media (max-width: 768px) {
                                    width: calc(60/390*100vw);
                                    height: calc(60/390*100vw);
                                }
                            }
                        }
                        .remen-items,.ziyuan-items,.fuwu-items,.ec-items,.guanzhu-items{
                            display: block;
                        }
                        @media (max-width: 768px) {
                            .remen-items,.ziyuan-items,.fuwu-items,.ec-items,.guanzhu-items{
                                display: none;
                            }
                        }
                    }
                }
            }
            .bottom{
                display: flex;
                flex-direction: column;
                margin-top: calc(50/1920*100vw);
                border-top: calc(1/1920*100vw) solid rgba(255, 255, 255, 0.28);
                @media (max-width: 768px) {
                    border-top: none;
                }
                .top{
                    display: flex;
                    align-items: center;
                    justify-content: start;
                    font-size: calc(14/1920*100vw);
                    color: rgba(255, 255, 255, 0.7);
                    padding-top: calc(20/1920*100vw);
                    margin-bottom: calc(10/1920*100vw);
                    @media (max-width: 768px) {
                        font-size: calc(12/390*100vw);
                        padding-top: 0;
                        margin-bottom: calc(10/390*100vw);
                    }
                    .cooperation,.link-tip{
                        height: calc(25/1920*100vw);
                        margin-right: calc(10/1920*100vw);
                        white-space: nowrap;
                        cursor: pointer;
                        @media (max-width: 768px) {
                            height: calc(20/390*100vw);
                            margin-right: calc(10/390*100vw);
                        }
                        &.active{
                            border-bottom: calc(2/1920*100vw) solid #2A68FF;
                            @media (max-width: 768px) {
                                border-bottom: calc(2/390*100vw) solid #2A68FF;
                            }
                        }
                    }

                    div{
                        height: calc(25/1920*100vw);
                        border-bottom: calc(2/1920*100vw) solid transparent;
                        @media (max-width: 768px) {
                            height: calc(20/390*100vw);
                        }
                    }
                }
                .cooperation-link,.link-tip-link{
                    display: none;
                    flex-wrap: wrap;
                    column-gap: calc(10/1920*100vw);
                    cursor: pointer;
                    @media (max-width: 768px) {
                        column-gap: calc(10/390*100vw);
                    }
                    .item{
                        font-size: calc(14/1920*100vw);
                        color: #B0B0B0;
                        @media (max-width: 768px) {
                            font-size: calc(12/390*100vw);
                        }
                    }
                    &.active{
                        display: flex;
                    }
                }
            }
            .copyright{
                display: flex;
                justify-content: center;
                padding-top: calc(16/1920*100vw);
                margin-top: calc(20/1920*100vw);
                margin-bottom: calc(23/1920*100vw);
                border-top: calc(1/1920*100vw) solid rgba(255, 255, 255, 0.28);
                font-size: calc(14/1920*100vw);
                color: #B0B0B0;
                .jing{
                    width: calc(20/1920*100vw);
                    @media screen and (max-width: 768px) {
                        width: calc(10/390*100vw);
                    }
                }
                .copyright-text{
                    @media (max-width: 768px) {
                        text-align: center;
                    }
                }
                @media (max-width: 768px) {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    padding-top: calc(16/390*100vw);
                    margin-top: calc(20/390*100vw);
                    margin-bottom: calc(23/390*100vw);
                    font-size: calc(12/390*100vw);
                }
            }
        }
        .stick-bar{
            position: fixed;
            top: 50%;
            transform: translateY(-50%);
            right: calc(10/1920*100vw);
            width: calc(68/1920*100vw);
            background-color: #fff;
            border-radius: calc(8/1920*100vw);
            z-index: 100;
            @media (max-width: 768px) {
                display: none;
            }
            .stick-item{
                position: relative;
                width: 100%;
                height: calc(65/1920*100vw);
                cursor: pointer;
                color: #808080;
                text-align: center;
                font-size: calc(12/1920*100vw);
                padding: calc(8/1920*100vw) 0;
                &.back-to-top{
                    overflow: hidden;
                    height: 0;
                    padding: 0;
                    pointer-events: none;
                    transform: translateY(calc(6/1920*100vw));
                    transition: height .5s ease, transform .5s ease;
                }
                &.back-to-top.show{
                    height: calc(65/1920*100vw);
                    pointer-events: auto;
                    transform: translateY(0);
                    padding: calc(8/1920*100vw) 0;
                }
                img{
                    width: calc(26/1920*100vw);
                    height: calc(26/1920*100vw);
                }
                .online-tip{
                    position: absolute;
                    display: flex;
                    justify-content: space-between;
                    width: calc(165/1920*100vw);
                    background-color: #fff;
                    border-radius: calc(4/1920*100vw);
                    padding: calc(12/1920*100vw);
                    top:calc(10 /1920*100vw);
                    left: calc(-176/1920*100vw);
                    font-size: calc(14/1920*100vw);
                    &::after{
                        content: "";
                        position: absolute;
                        top: calc(8/1920*100vw);
                        right: calc(-8/1920*100vw);
                        width: 0;
                        height: 0;
                        border-left: calc(8/1920*100vw) solid #fff;
                        border-top: calc(8/1920*100vw) solid transparent;
                        border-bottom: calc(8/1920*100vw) solid transparent;
                    }
                }
                .phone-tip,.wechat-tip{
                    position: absolute;
                    display: none;
                    top: 0;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    background-color: rgba(255, 255, 255, 0.9);
                    border-radius: calc(4/1920*100vw);
                    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
                    line-height: calc(25/1920*100vw);
                    color:#333;
                }
                .phone-tip{
                    left: calc(-279/1920*100vw);
                    padding: calc(12/1920*100vw);
                    padding-right: calc(40/1920*100vw);
                    width: calc(268/1920*100vw);
                    height: calc(74/1920*100vw);
                    font-size: calc(10/1920*100vw);
                }
                .phone-tip img{
                    width: calc(15/1920*100vw);
                    height: calc(18/1920*100vw);
                    margin-left: calc(10/1920*100vw);
                }
                .wechat-tip{
                    left: calc(-182/1920*100vw);
                    width: calc(171/1920*100vw);
                    height: calc(232/1920*100vw);
                    font-size: calc(14/1920*100vw);
                    color:#333;
                    line-height: calc(25/1920*100vw);
                }
                .wechat-tip img{
                    width: calc(147/1920*100vw);
                    height: calc(147/1920*100vw);
                }
                &:hover .phone-tip, &:hover .wechat-tip{
                    display: flex;
                }
            }
        }
        .phone-stick-bar{
            position: fixed;
            bottom: 0;
            width: 100%;
            justify-content: space-between;
            margin:0 auto;
            padding: calc(10/390*100vw) calc(20/390*100vw);
            z-index: 1000;
            display: none;
            @media (max-width: 768px) {
                display: flex;
            }
            .phone-bar-item{
                width: 31.5%;
                height: calc(42/390*100vw);
                line-height: calc(42/390*100vw);
                text-align: center;
                font-size: calc(10/390*100vw);
                color: #fff;
                background-color: #008bff;
                cursor: pointer;
            }
        }
    }
</style>