/* #LRfloater2 {
      right: 0px !important;
    } */

/*.FENBOT-CHATBTN-BTN{
			display: none!important;
		}*/
div.banner .bannerBox>h3>span {
    background-color: #4784f8;
    font-size: 20px;
    padding: 3px;
    border-radius: 5px;
    letter-spacing: 2px;
    line-height: 24px;
    margin-left: 10px;
}

#cnzz_stat_icon_1275127591 img {
    display: none;
}

.meau {
    top: 55%;
}

.qqList {
    top: -150px;
}

.login-action-btn {
    margin-right: 20px;
}

/* 页面底部样式 */
.footer {
    background-color: #1a1a1a;
    color: #fff;
    padding: 60px 0 0;
}

.footer-content {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
}

.footer-section {
    flex: 1;
    margin-right: 40px;
}

.footer-section:last-child {
    margin-right: 0;
}

.footer-title {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 20px;
    color: #fff;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-links a {
    color: #999;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
}

.footer-links a:hover {
    color: #0066ff;
}

.contact-info {
    color: #999;
    font-size: 14px;
    line-height: 1.8;
}

.contact-info p {
    margin-bottom: 1rem;
}

.contact-info i {
    color: #0066ff;
    margin-right: 8px;
}

.qrcode-section {
    text-align: left;
    padding: 0;
}

.qrcode-section .footer-title {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 15px;
    color: #fff;
}

.qrcode-text {
    color: rgba(255, 255, 255, 0.7);
    font-size: 16px;
    margin-bottom: 20px;
    font-weight: normal;
}

.qrcode-container {
    display: inline-block;
    background: #1a1a1a;
    padding: 10px;
    border-radius: 8px;
}

.qrcode-container img {
    width: 200px;
    height: 200px;
    display: block;
    border-radius: 4px;
}

@media (max-width: 768px) {
    .footer {
        padding: 30px 0 0;
        margin-top: 30px;
    }

    .footer-content {
        flex-direction: column;
        padding: 0 15px;
    }

    .footer-section {
        margin-right: 0;
        margin-bottom: 30px;
        text-align: center;
    }

    .footer-title {
        font-size: 16px;
        margin-bottom: 15px;
    }

    .contact-info {
        font-size: 13px;
    }

    .contact-info p {
        margin-bottom: 0.8rem;
    }

    .footer-links li {
        margin-bottom: 10px;
    }

    .footer-links a {
        font-size: 13px;
    }

    .qrcode-section {
        order: -1;
        margin-bottom: 30px;
        text-align: center;
    }

    .qrcode-section .footer-title {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .qrcode-text {
        font-size: 13px;
        margin-bottom: 15px;
        padding: 0 20px;
    }

    .qrcode-container {
        padding: 8px;
    }

    .qrcode-container img {
        width: 140px;
        height: 140px;
        border-width: 6px;
    }

    .footer-bottom {
        padding: 12px 15px;
        margin-top: 20px;
    }

    .footer-bottom p {
        font-size: 12px;
        margin: 3px 0;
    }
}

@media (max-width: 375px) {
    .footer {
        padding: 25px 0 0;
    }

    .footer-content {
        padding: 0 12px;
    }

    .footer-section {
        margin-bottom: 25px;
    }

    .qrcode-container img {
        width: 120px;
        height: 120px;
        border-width: 5px;
    }

    .footer-bottom {
        padding: 10px;
    }

    .footer-bottom p {
        font-size: 11px;
    }
}

.footer-bottom {
    text-align: center;
    padding: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin-top: 40px;
    background-color: rgba(0, 0, 0, 0.2);
}

.footer-bottom p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    margin: 5px 0;
    line-height: 1.5;
}

.footer-bottom a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-bottom a:hover {
    color: #fff;
}

@media (max-width: 768px) {
    .container {
        padding: 0;
        position: relative;
        overflow-x: hidden;
    }

    .headerTit {
        padding: 10px;
    }

    .headerTit img {
        max-width: 120px;
    }

    .goLogin {
        margin-right: 10px;
    }

    .login-action-btn,
    .register-action-btn {
        padding: 6px 12px;
        font-size: 14px;
    }

    .wh_1200 {
        width: 100%;
        padding: 0 15px;
    }

    .common-wrap {
        padding: 30px 0;
    }

    .common-wrap-title {
        font-size: 20px;
        margin-bottom: 20px;
        text-align: center;
    }

    .common-wrap-title.new-form {
        font-size: 18px;
    }

    .common-wrap-con ul {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        padding: 0 10px;
    }

    .common-wrap-con-item {
        margin-bottom: 10px;
        padding: 15px;
    }

    .common-wrap-con-item .flex-box {
        flex-direction: column;
        text-align: center;
    }

    .common-wrap-con-item .left-info {
        margin-bottom: 10px;
    }

    .common-wrap-con-item .right-info .title {
        font-size: 16px;
        margin-bottom: 5px;
    }

    .common-wrap-con-item .right-info .text {
        font-size: 12px;
        line-height: 1.4;
    }

    .common-wrap-con-item-new-scene {
        padding: 10px;
    }

    .common-wrap-con-item-new-scene .flex-box {
        flex-direction: column;
        gap: 10px;
    }

    .common-wrap-con-item-new-scene a {
        font-size: 14px;
        padding: 8px;
    }

    .banner-container {
        padding: 30px 0;
    }

    .banner-content {
        flex-direction: column;
        text-align: center;
    }

    .banner-slide-2 {
        display: none;
    }

    .banner-pagination {
        display: none;
    }

    .banner-content .left-text {
        width: 100%;
        margin-bottom: 20px;
    }

    .banner-content .title {
        font-size: 24px;
        line-height: 1.4;
    }

    .sec-box .sec {
        padding: 30px 0;
    }

    .common-title {
        font-size: 20px;
        margin-bottom: 20px;
        text-align: center;
    }

    .sec-content-wrapper {
        padding: 0 15px;
    }

    .sec-content .top {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }

    .sec-content .top-li {
        font-size: 14px;
        padding: 8px 15px;
    }

    .sec-content .bottom-li {
        flex-direction: column;
        text-align: center;
    }

    .sec-content .bottom-li .title {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .sec-content .bottom-li .text {
        font-size: 14px;
        margin-bottom: 20px;
    }
}

/* 卡品列表样式 */
.card-list {
    display: flex;
    justify-content: space-between;
    margin: 40px 0;
    padding: 0 20px;
}

.card-item {
    flex: 0 0 30%;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: all 0.3s ease;
}

.card-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.card-image {
    width: 100%;
    height: 200px;
    overflow: hidden;
}

.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.card-info {
    padding: 20px;
}

.card-title {
    font-size: 20px;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
}

.card-desc {
    margin-bottom: 20px;
}

.card-desc p {
    color: #666;
    line-height: 1.8;
    margin: 5px 0;
}

.card-btn {
    display: inline-block;
    padding: 8px 24px;
    background: #0080f1;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.card-btn:hover {
    background: #0070d8;
}

.view-more {
    text-align: center;
    margin-top: 30px;
}

.more-btn {
    display: inline-block;
    padding: 10px 30px;
    color: #0080f1;
    font-size: 16px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.more-btn:hover {
    color: #0070d8;
    transform: translateX(5px);
}

/* 响应式调整 */
@media screen and (max-width: 768px) {
    .card-list {
        flex-direction: column;
        padding: 0 15px;
    }

    .card-item {
        margin-bottom: 20px;
    }

    .card-image {
        height: 160px;
    }
}

/* 优化产品卡片样式 */
.product-card {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;
    min-width: 0;
    /* 防止卡片内容溢出 */
}

/* 调整卡片内容间距 */
.card-body {
    padding: 12px;
}

/* 优化标题样式 */
.product-title {
    font-size: 14px;
    color: #333;
    margin-bottom: 10px;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* 调整标签容器样式 */
.tags {
    margin-bottom: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.tag {
    font-size: 12px;
    padding: 2px 6px;
}

/* 优势说明模块样式 */
.advantage-list {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin: 40px 0;
    padding: 0 20px;
}

.advantage-item {
    flex: 1;
    background: #fff;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.advantage-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.advantage-item .number {
    font-size: 24px;
    color: #e6eef8;
    font-weight: bold;
    margin-bottom: 15px;
}

.advantage-item .title {
    font-size: 20px;
    color: #333;
    font-weight: bold;
    margin-bottom: 10px;
}

.advantage-item .desc {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

/* 响应式调整 */
@media screen and (max-width: 768px) {
    .advantage-list {
        flex-direction: column;
        gap: 20px;
    }

    .advantage-item {
        padding: 20px;
    }

    .advantage-item .number {
        font-size: 20px;
    }

    .advantage-item .title {
        font-size: 18px;
    }
}

.app-screenshots {
    flex: 0 0 45%;
    /* Adjust this value if needed to center the image */
    display: flex;
    justify-content: center;
    /* Center the image */
    align-items: center;
    /* Center vertically if needed */
}

/* 右侧悬浮模块样式 */
.float-sidebar {
    position: fixed;
    right: 10px;
    bottom: 100px;
    z-index: -1;
    opacity: 0;
    transition: all 0.3s ease;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}

.float-sidebar.show {
    z-index: 1010;
    opacity: 1;
}

.float-list {
    list-style: none;
    margin: 0;
    padding: 8px 0;
}

.float-item {
    position: relative;
    padding: 8px 12px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.float-item:hover {
    background: #f5f7fa;
}

.icon-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #666;
}

.icon-box i {
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-bottom: 4px;
}

.icon-box span {
    font-size: 12px;
    white-space: nowrap;
}

.icon-service {
    background-image: url("data:image/svg+xml,%3Csvg t='1709022361588' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='4250'%3E%3Cpath d='M512 958.016c-246.272 0-448-201.728-448-448s201.728-448 448-448 448 201.728 448 448-201.728 448-448 448z m0-832c-211.744 0-384 172.256-384 384s172.256 384 384 384 384-172.256 384-384-172.256-384-384-384z' fill='%230080F1' p-id='4251'%3E%3C/path%3E%3Cpath d='M720 659.968H304c-17.664 0-32-14.336-32-32v-288c0-17.664 14.336-32 32-32h416c17.664 0 32 14.336 32 32v288c0 17.664-14.336 32-32 32z' fill='%230080F1' p-id='4252'%3E%3C/path%3E%3Cpath d='M720 659.968H304c-17.664 0-32-14.336-32-32v-288c0-17.664 14.336-32 32-32h416c17.664 0 32 14.336 32 32v288c0 17.664-14.336 32-32 32z m-384-320v256h352v-256H336z' fill='%230080F1' p-id='4253'%3E%3C/path%3E%3Cpath d='M512 563.968m-32 0a32 32 0 1 0 64 0 32 32 0 1 0-64 0Z' fill='%230080F1' p-id='4254'%3E%3C/path%3E%3Cpath d='M432 563.968m-32 0a32 32 0 1 0 64 0 32 32 0 1 0-64 0Z' fill='%230080F1' p-id='4255'%3E%3C/path%3E%3Cpath d='M592 563.968m-32 0a32 32 0 1 0 64 0 32 32 0 1 0-64 0Z' fill='%230080F1' p-id='4256'%3E%3C/path%3E%3C/svg%3E");
}

.icon-company {
    background-image: url("data:image/svg+xml,%3Csvg t='1709022420478' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='5397'%3E%3Cpath d='M888.8 757.3V349.1c0-39.3-31.9-71.2-71.2-71.2H669.3V166.7c0-39.3-31.9-71.2-71.2-71.2H206.4c-39.3 0-71.2 31.9-71.2 71.2v590.6H64.5c-17.7 0-32 14.3-32 32s14.3 32 32 32h895c17.7 0 32-14.3 32-32s-14.3-32-32-32h-70.7z m-689.6 0V166.7c0-3.9 3.2-7.2 7.2-7.2h391.7c3.9 0 7.2 3.2 7.2 7.2v590.6H199.2z m625.6 0H605.3V341.9h212.3c3.9 0 7.2 3.2 7.2 7.2v408.2z' fill='%230080F1' p-id='5398'%3E%3C/path%3E%3Cpath d='M317.9 261.9h166.9c17.7 0 32-14.3 32-32s-14.3-32-32-32H317.9c-17.7 0-32 14.3-32 32s14.3 32 32 32zM317.9 420.3h166.9c17.7 0 32-14.3 32-32s-14.3-32-32-32H317.9c-17.7 0-32 14.3-32 32s14.3 32 32 32zM317.9 578.7h166.9c17.7 0 32-14.3 32-32s-14.3-32-32-32H317.9c-17.7 0-32 14.3-32 32s14.3 32 32 32zM687.2 420.3h48.5c17.7 0 32-14.3 32-32s-14.3-32-32-32h-48.5c-17.7 0-32 14.3-32 32s14.3 32 32 32zM687.2 578.7h48.5c17.7 0 32-14.3 32-32s-14.3-32-32-32h-48.5c-17.7 0-32 14.3-32 32s14.3 32 32 32z' fill='%230080F1' p-id='5399'%3E%3C/path%3E%3C/svg%3E");
}

.icon-wechat {
    background-image: url("data:image/svg+xml,%3Csvg t='1709022447135' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='6544'%3E%3Cpath d='M692.313043 347.269565c11.130435 0 22.26087 0 33.391305 2.226087C696.765217 204.8 540.93913 95.721739 362.852174 95.721739c-198.121739 0-360.626087 133.565217-360.626087 302.191305 0 97.547826 53.426087 177.86087 142.469565 240.313043l-35.617391 106.852174 124.434783-62.46087c44.521739 8.904348 80.139130 17.808696 124.434782 17.808696 11.130435 0 22.26087 0 33.391305-2.226087-6.678261-24.486957-11.130435-48.973913-11.130435-75.686957C380.66087 476.382609 521.904348 347.269565 692.313043 347.269565zM498.643478 249.321739c26.713043 0 44.521739 17.808696 44.521739 44.521739 0 26.713043-17.808696 44.521739-44.521739 44.521739-26.713043 0-53.426087-17.808696-53.426087-44.521739C445.217391 267.130435 471.930435 249.321739 498.643478 249.321739zM244.869565 338.365217c-26.713043 0-53.426087-17.808696-53.426087-44.521739 0-26.713043 26.713043-44.521739 53.426087-44.521739 26.713043 0 44.521739 17.808696 44.521739 44.521739C289.391304 320.556522 271.582609 338.365217 244.869565 338.365217z' fill='%230080F1' p-id='6545'%3E%3C/path%3E%3Cpath d='M1021.217391 629.982609c0-142.469565-142.469565-258.121739-302.191304-258.121739-169.182609 0-302.191304 115.652174-302.191305 258.121739 0 142.469565 133.008696 258.121739 302.191305 258.121739 35.617391 0 71.234783-8.904348 106.852174-17.808696l97.547826 53.426087-26.713044-88.817391C967.791304 783.513043 1021.217391 710.121739 1021.217391 629.982609zM619.147826 583.234783c-17.808696 0-35.617391-17.808696-35.617391-35.617392 0-17.808696 17.808696-35.617391 35.617391-35.617391s35.617391 17.808696 35.617391 35.617391C654.765217 565.426087 636.956522 583.234783 619.147826 583.234783zM815.495652 583.234783c-17.808696 0-35.617391-17.808696-35.617391-35.617392 0-17.808696 17.808696-35.617391 35.617391-35.617391 17.808696 0 35.617391 17.808696 35.617391 35.617391C851.113043 565.426087 833.304348 583.234783 815.495652 583.234783z' fill='%230080F1' p-id='6546'%3E%3C/path%3E%3C/svg%3E");
}

.icon-top {
    background-image: url("data:image/svg+xml,%3Csvg t='1709022469966' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='7693'%3E%3Cpath d='M526.848 202.24c-4.096-4.096-9.216-6.144-14.848-6.144s-10.752 2.048-14.848 6.144L342.528 356.864c-8.192 8.192-8.192 21.504 0 29.696s21.504 8.192 29.696 0L496.64 262.144V792.064c0 11.776 9.728 21.504 21.504 21.504s21.504-9.728 21.504-21.504V268.288l118.272 118.272c4.096 4.096 9.728 6.144 14.848 6.144s10.752-2.048 14.848-6.144c8.192-8.192 8.192-21.504 0-29.696L526.848 202.24z' fill='%230080F1' p-id='7694'%3E%3C/path%3E%3C/svg%3E");
}

.hover-content {
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
    display: none;
    margin-right: 10px;
}

.float-item:hover .hover-content {
    display: block;
}

.qrcode-box {
    text-align: center;
    min-width: 140px;
    min-height: 140px;
    padding: 10px;
    background: #fff;
    border-radius: 4px;
}

.qrcode-box img {
    width: 120px;
    height: 120px;
    margin-bottom: 8px;
    object-fit: contain;
}

.qrcode-box p {
    font-size: 12px;
    color: #666;
    margin: 0;
    line-height: 1.4;
}

.haokavip-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    float: none;
}

.haokavip-header .haokavip-header-left {
    display: flex;
    align-items: center;
}

.haokavip-header-left a {
    display: block;
    height: 70px;
    line-height: 70px;
}

.haokavip-header-logo {
    margin-right: 117px;
}

.haokavip-header-logo img {
    height: 33px;
}

.haokavip-header-left .haokavip-header-link {
    font-weight: 400;
    font-size: 16px;
    color: #000000;
    line-height: 22px;
    height: 22px;
    margin-right: 76px;
}

.haokavip-header-link:hover {
    color: #0080f1;
}

.haokavip-header-link.haokavip-header-link-actived {
    position: relative;
    color: #0080f1;
    font-weight: 500;
}

.haokavip-header-link.haokavip-header-link-actived::after {
    content: '';
    position: absolute;
    bottom: -14px;
    left: 0;
    width: 100%;
    height: 4px;
    background: #0080f1;
    border-radius: 2px;
}

.haokavip-header .goLogin {
    display: flex;
    align-items: center;
}

.haokavip-header .goLogin .login-action-btn {
    margin-right: 10px;
    display: block;
    border-radius: 4px;
    border: 1px solid #0080f1;
    height: 36px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #0080f1;
    padding: 0 14px;
    background: transparent !important;
}

.haokavip-header .goLogin .register-action-btn {
    border-radius: 4px;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 16px;
    height: 36px;
    box-sizing: border-box;
    padding-left: 14px;
    padding-right: 9px;
    background: #0080f1 !important;
}

.haokavip-header .goLogin .register-action-btn::after {
    content: '';
    width: 40px;
    height: 20px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAUCAYAAAD/Rn+7AAAAAXNSR0IArs4c6QAABvtJREFUSEvFlntwVdUVxr+193nce3Nzk2AekIQQ89BAGV4tjygBjZGqVaS2JEoFxYY4sVJAbWxxbKMMKhUlymNIGTMtbUcaOjxmmBIEbcTSCGnlJQIlPIwmgSQkl5vLfZ+92ntbmGmJCbbO9Pyzz5m99j6/+dba+1uE/8PjWXlTskxMmhlXvr9usN/TYAFfNM+1FXowzigxc6Y10i2l/oH2YYBQe589GDw0jLxdZcR4lI2EB8wfXfj4yjquzraFcobcSBwoJBEcQkwXQq70xi8NyNur4gNNW2bLsO9O2GyvGcvP/CUKEHoCBdKQ44itFKFpesTmjBO6mWTpGCrAw5XlzxTsT2epB1RC+jxz4eltUTjPCvNmu7QqIekukMqDUEIIOgiB3wpXasOAgFxdrSG0o8Dqaxtrha0xgtQkqOBooSJ1wmZf7vf7XboWrBCS5zAhhwSIBQAZ0wzQCKwLIDEVbGignNuhRkwFndx0EWean6WIdxZJupvBkiR7CeJtS6q3jMXYf0XZawDrZ0POloljwhR8WLB6EAinQijJRICuf6QlppSjpu2ItcD8JolwnYIaSjEoAILAiUNAaXlAxmiorImgzGnghCzQrh8Cty4FHMmIrMplzeoFSSZIEWSinZoeWUJLcO4/S+XfAL3Vtw21Hd2/Bhy8F4JNIRgcjZAAE/1ZhvgeFN0dsI69/yqrYAVShpg0shAquuvRd8FBP2jBr0F5JSBpi0oI7joDtDSCmtaCF+4DOk7AVzMdjjQFaMZR6Noi7SlvIxG4vzq+Chh+ff50atr2G4TcmRAMIQCOqkIAawCShpxVGrbSJe9dFBc3kr/9PeIxxSDdASITqrsDvH4hcFs5yNMLMaMS0JzwLx4Lb48f9qwRcL5+HHhvHdxvV11KyDeWa+GktVTd7hvogMUAA79clit2r99PnrYbonVDLgOsE+hSIAaoFnwHKBgF680N0Pq8UI9XglJHgI4cB3t9QNEMkBkHa8Nr6N2zz6NlZIeSVtYlc1srvC/OBWUBtmFTIRb+HuFXH+eeP304Zfiu8wd4VXZ22HIXseG8UaWM3mh/qKH/FAcXFW6Vf2uaFUvllEzg/tFAQwusphZI2z/kq54HkAFfVR0cc2cAXx+PSO02dO89BgVGelU5UFiIyLo6RD7763lj1NSQnL8ki3ftgnfTajhvZsCXDeXMxeX3m1t44feLnd3v1Ii+k3eQ1BosI/GFUxlTT48u3Ry6pgaDT88ooBONR6UKaUoANDMbPC0D1qpPYHW4oafFQzx7B/isF+ENzdBWfBc41YsLVdvhyLdg2gnGvPmgUfnwPrEWjrQ2iIJi8LxHgDUb4TnyLlwjNPCdzwCTi6GeW/qpzP38MoLdESG0n2hLfX8YMMWhsoxK6W5bF6s1ReDKYVC5TmBHLyjJBhQkQwxLAO/ogOqJQJs/FpGdn6Jv20G4sgHYU8DPlEF8fBGdT29CarECispAxZPhe7IW8oYzXt2e3oynfnY7t5zH5cXL3PGzAi+fc6s38lcjOJhRUKQ041fkbpsXvSqsgABecYJtOggGVNgAaSagG8DP2xBMj4f9kWzwuSC49giQ4QLPnQgyHAhU7MZlhxvJwwX4yccARzw8D2/scs2yf+vCVhnntLzvBbo8fN6nPT/e53tpMLCr92D40YJD1H5ibBRQ2SXwUwN8GrDWReBvZcQtckDcGgd/+UVwugnHyyMAqQOWDtZMUDsj9ONj+OxzN7LuBWQPwXs8Ef4OL3zk2HpTj/uBU3l5pruzs1QDek55PA2lgHXdgP7Hxh7QWw9PjB2QHA20wICqt3CmLgS7RkivNYF4Qu+cADiV4MiwwSxxgiwB63AE7u29uGhXyCwBOxK0k3632NKyM15wWuJZMTTjnfGNjdeczOuFi8ZRqHzCGnHuox9wVMJbdOB+idDzIVheBVuIgAoD6qCCZ3sY8ZMZrQcI1KlbCEZ6fbreKTL0k8OL+HDisLQ9uHj6AP0C4S8DMFgs8bI5JZEP6ndRWAnraxJkEfxbLBjjLAQvCHQfIQQlI2kckJLDsHTHitOevN/1fdjR3jp9enfp5s3Xna7BYPp1kvr6ejlz5wtbqfWT+9r3EqLnhJIZeRMYoQjgDRBsLsCuM0iIs52Tyia5uDfdaDsxQfo7J1uQ34Ah05TQGvzZU19KWrLtf0ppv17srSlP0z/Y8ce+rq6Rpk3BrjEoZv7/tLrY+K9vBoEFRecZmmgnYTREyKwx3+q92tv9N0p90ZqrXswrH0qONDeup0udMyEs/UqHEm0WYu9Rb46OmhZWcYmHhG57RUrfHlrd4/kqgQbsZqJdXOTB9ELR130PU3gKCcqHhJM108OmcRwO5z4tK2c3ntvbTET9dh9fNezfAdmZ1BmCinMrAAAAAElFTkSuQmCC') no-repeat center center;
    margin-left: 4px;
}

.haokavip-header-right-mobile {
    display: none;
}

.mobile-nav {
    width: 0;
}

.mobile-content-hidden {
    display: none;
}

@media (max-width: 768px) {
    .container {
        position: relative;
        padding-top: 63px;
    }

    .headerTit {
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        height: 63px;
        padding: 0;
        z-index: 999;
    }

    .headerTit .haokavip-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        padding: 16px 15px !important;
        box-sizing: border-box;
        height: auto;
    }

    .headerTit .haokavip-header-logo {
        display: flex;
        align-items: center;
        margin-right: 10px;
        height: 31px;
    }

    .headerTit .haokavip-header-logo img {
        height: 31px;
        width: auto;
    }

    .headerTit .haokavip-header .haokavip-header-link {
        display: none;
    }

    .headerTit .haokavip-header .goLogin {
        display: none;
    }

    .headerTit .haokavip-header .haokavip-header-right-mobile {
        display: flex;
        align-items: center;
    }

    .headerTit .haokavip-header .haokavip-header-right-mobile .haokavip-header-right-mobile-login {
        flex: none;
        background-image: url('https://static.yapingtech.com/seo/images/mobile/person.png');
        background-size: 100% auto;
        background-repeat: no-repeat;
        width: 17px;
        height: 18px;
        margin-right: 20px;
    }

    .headerTit .haokavip-header .haokavip-header-right-mobile .haokavip-header-right-mobile-register {
        position: relative;
        flex: none;
        background-image: url('https://static.yapingtech.com/seo/images/mobile/register.png');
        background-size: 100% auto;
        background-repeat: no-repeat;
        width: 17px;
        height: 18px;
        margin-right: 20px;
    }

    .headerTit .haokavip-header .haokavip-header-right-mobile .haokavip-header-right-mobile-register::after {
        content: '';
        position: absolute;
        top: -6px;
        right: -12px;
        content: '';
        flex: none;
        background-image: url('https://static.yapingtech.com/seo/images/mobile/fire.png');
        background-size: 100% auto;
        background-repeat: no-repeat;
        width: 20px;
        height: 10px;
    }


    .headerTit .haokavip-header .haokavip-header-right-mobile .haokavip-header-right-mobile-usercenter {
        flex: none;
        background-image: url('https://static.yapingtech.com/seo/images/mobile/user-center.png');
        background-size: 100% auto;
        background-repeat: no-repeat;
        width: 17px;
        height: 18px;
        margin-right: 20px;
        display: none;
    }

    .headerTit .haokavip-header .haokavip-header-right-mobile .haokavip-header-right-mobile-usercenter.show {
        display: flex;
    }

    .headerTit .haokavip-header .haokavip-header-right-mobile .haokavip-header-right-mobile-menu {
        flex: none;
        background-image: url('https://static.yapingtech.com/seo/images/mobile/menu.png');
        background-size: 100% auto;
        background-repeat: no-repeat;
        width: 21px;
        height: 18px;
    }

    .mobile-nav {
        display: block;
        position: fixed;
        top: 63px;
        right: 0;
        bottom: 0;
        background: #fff;
        z-index: 1000;
        width: 0;
        transition: all 0.3s ease;
    }

    .mobile-nav.open {
        width: 150px;
    }

    .mobile-nav-content .mobile-nav-item {
        display: flex;
        align-items: center;
        background-color: #fff;
        height: 55px;
        border-bottom: 1px solid #ccc;
        color: #000;
        font-size: 15px;
        padding-left: 20px;
        box-sizing: border-box;
    }

    .mobile-nav-content .mobile-nav-item-active {
        background-color: #0080f1;
        color: #fff;
    }

    .mobile-nav-content .mobile-nav-item a {
        color: inherit;
    }

    .banner-container {
        position: relative;
        padding: 0 !important;
        box-sizing: border-box;
        width: 100%;
        height: auto;
        box-sizing: border-box;
        padding-bottom: 157% !important;
        background-image: url(https://static.yapingtech.com/seo/images/mobile/banner-bg.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .banner-container .mobile-view-commission {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 120px;
        height: 40px;
        position: absolute;
        left: 10%;
        bottom: 13%;
        background: #FFFFFF;
        box-shadow: 0px 1.5px 6px 0.5px rgba(0, 0, 0, 0.16);
        border-radius: 4px;
        font-size: 16px;
        color: #1C96D5;
        font-weight: bold;
    }

    .banner-container .mobile-register-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 120px;
        height: 40px;
        position: absolute;
        right: 10%;
        bottom: 13%;
        background: #FFFFFF;
        box-shadow: 0px 1.5px 6px 0.5px rgba(0, 0, 0, 0.16);
        border-radius: 4px;
        font-size: 16px;
        color: #1C96D5;
        font-weight: bold;
    }

    .banner-container .left-text {
        display: none;
    }

    .banner-container .right-img {
        display: none;
    }

    .menu-container {
        display: none;
    }

    .sec-box {
        box-sizing: border-box;
        width: 100%;
    }

    .sec1 {
        margin-top: 20px;
        padding: 0 10px !important;
        box-sizing: border-box;
        width: 100%;
        margin-bottom: 20px;
    }

    .sec-content1 {
        position: relative;
        background: rgba(219, 235, 255, 0.6);
        box-shadow: inset 0px 3px 6px 1px rgba(0, 0, 0, 0.1);
        border-radius: 5px;
        padding: 20px;
    }

    .sec-content1::after {
        content: '';
        height: 100%;
        background: url('https://static.yapingtech.com/seo/images/mobile/wave.png') no-repeat;
        background-size: 100% auto;
        background-position: left center;
        position: absolute;
        z-index: 1;
        left: -10px;
        right: -10px;
        top: 0;
        transform: translateY(55%);
        opacity: 0.9;
    }

    .sec1 .sec-content-wrapper {
        margin-top: 20px;
    }

    .sec1 .common-title {
        margin-top: 0;
        margin-bottom: 15px;
        font-size: 18px;
        line-height: 1;
    }

    .sec1 .common-subtitle {
        margin-top: 0;
    }

    .sec1 .sec-content-wrapper {
        position: relative;
        z-index: 2;
        padding: 0;
    }

    .sec1 .sec-content-wrapper .advantage-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .sec1 .advantage-list .advantage-item {
        padding: 15px 10px;
        background: #fff;
        border-radius: 5px;
        box-shadow: 0px 3px 8px 1px rgba(0, 0, 0, 0.16);
    }

    .sec1 .advantage-list .advantage-item .number {
        font-weight: bold;
        font-size: 15px;
        color: #0080f1;
        line-height: 20px;
        margin-bottom: 10px;
    }

    .sec1 .advantage-list .advantage-item .title {
        font-weight: bold;
        font-size: 14px;
        color: #000;
        line-height: 20px;
        margin-bottom: 10px;
    }

    .sec1 .advantage-list .advantage-item .desc {
        font-size: 12px;
        color: #666;
        line-height: 18px;
    }

    .sec1 .platform-overview-image {
        margin: 20px 0;
    }

    .sec1 .commission-title {
        margin: 20px 0 !important;
    }

    .sec-content {
        padding: 0;
    }

    .sec1 .advantage-list {
        padding: 0;
        margin: 0;
    }

    .sec1 .platform-images {
        display: block;
    }

    .sec1 .platform-images .platform-main,
    .sec1 .platform-images .platform-side {
        margin: 20px 0;
        width: 100%;
        height: auto;
        border-radius: 5px;
        box-shadow: 1.5px 1.5px 6px 0.5px #cde6ff;
        border: 1px solid #b2d9ff;
    }

    .sec1 .platform-images .platform-main img,
    .sec1 .platform-images .platform-side img {
        width: 100%;
        height: auto;
        border-radius: 5px;
    }

    .sec1 .btn.goOnline {
        margin-top: -5px;
    }

    .sec2 {
        padding: 20px 10px !important;
    }

    .sec2 .common-title {
        font-size: 18px !important;
        line-height: 20px !important;
        margin-bottom: 20px !important;
    }

    .sec2 .common-subtitle {
        margin-top: 20px;
    }

    .sec2 .sec-content-wrapper {
        margin-top: 0;
        padding: 0;
    }

    .sec2 .sec-content-wrapper .item-list {
        height: auto;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 175px 15px;
        background: url('https://static.yapingtech.com/seo/images/sec2_bg.png') no-repeat center;
        background-size: 100% auto;
        background-position-y: 45%;
    }

    .sec2 .sec-content-wrapper .item-list .item-li {
        position: static;
        animation: none;
        width: 100%;
        height: auto;
        padding: 10px 10px 0;
        border-bottom-width: 5px;
        border-radius: 5px;
    }

    .sec2 .sec-content-wrapper .item-list .item-li .title {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 10px;
    }

    .sec2 .sec-content-wrapper .item-list .item-li .desc {
        font-size: 12px;
        line-height: 18px;
        color: #666;
        margin-bottom: 10px;
        margin-top: 0;
    }

    .sec2 .sec-content-wrapper .item-list .item-li .tags {
        height: 54px;
        overflow: hidden;
    }

    .sec2 .sec-content-wrapper .item-list .item-li .tags .tag {
        font-size: 12px;
        line-height: 18px;
        color: #666;
        height: 18px;
        margin-top: 0;
    }

    .sec3 {
        padding: 20px 10px !important;
    }

    .sec3 .common-title {
        font-size: 18px !important;
        line-height: 20px !important;
        margin-bottom: 15px !important;
    }

    .sec3 .common-subtitle {
        margin-top: 0;
        margin-bottom: 10px;
    }

    .sec3 .product-stats {
        padding: 0;
        margin: 0 0 20px !important;
    }

    .sec3 .product-stats .stats-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 30px;
    }

    .sec3 .product-stats .stats-wrapper .stat-item {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .sec3 .product-stats .stats-wrapper .stat-item .stat-number {
        font-size: 24px;
        line-height: 24px;
    }

    .sec3 .product-stats .stats-wrapper .stat-item .stat-label {
        font-size: 14px;
        line-height: 14px;
        color: #666;
        margin-left: 10px;
    }

    .sec3 .sec-content-wrapper {
        margin-top: 0;
        padding: 0;
    }

    .sec3 .sec-content-wrapper .product-list {
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .sec3 .sec-content-wrapper .product-list .product-card {
        border-radius: 5px !important;
    }

    .sec3 .sec-content-wrapper .product-list .product-card .card-body {
        padding: 15px 10px !important;
    }

    .sec3 .sec-content-wrapper .product-list .product-card .product-title {
        height: auto !important;
        margin-bottom: 10px !important;
    }

    .sec3 .sec-content-wrapper .product-list .product-card .commission {
        font-size: 15px !important;
        line-height: 20px !important;
        margin-top: -5px !important;
    }

    .sec3 .sec3-more-btn {
        margin-top: 15px !important;
    }

    .sec3 .sec3-more-btn .common-btn {
        padding: 8px 20px !important;
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .sec4 {
        padding: 20px 10px !important;
    }

    .sec4 .common-title {
        font-size: 18px !important;
        line-height: 20px !important;
        margin-bottom: 15px !important;
    }

    .sec4 .common-subtitle {
        margin-top: 0;
        margin-bottom: 20px;
    }

    .sec4 .sec-content-wrapper {
        padding: 0;
        margin: 0;
    }

    .sec4 .item-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .sec4 .item-list .item-li {
        width: 100%;
        height: auto;
        padding: 10px 10px 15px;
        margin: 0;
        border-radius: 5px;
        border: none;
        box-shadow: 0px 1.5px 4px 0.5px rgba(0, 0, 0, 0.16);
    }

    .sec4 .item-list .item-li .img {
        width: 60px;
        margin-bottom: 10px;
    }

    .sec4 .item-list .item-li .title {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 10px;
        margin-top: 0;
    }

    .sec4 .item-list .item-li .desc {
        font-size: 12px;
        line-height: 18px;
        color: #666;
        margin-bottom: 10px;
        margin-top: 0;
        text-align: center;
    }

    .sec5 {
        padding: 20px 10px !important;
    }

    .sec5 .common-title {
        font-size: 18px !important;
        line-height: 20px !important;
        margin-bottom: 15px !important;
    }

    .sec5 .common-subtitle {
        margin-top: 0;
        margin-bottom: 20px;
    }

    .sec5 .platform-compare {
        padding: 0;
        margin: 0;
    }

    .sec5 .platform-compare .wh_1200 {
        padding: 0;
        margin: 0;
    }

    .sec5 .platform-compare .compare-table {
        border-radius: 5px;
        font-size: 12px;
        line-height: 18px;
    }

    .compare-cell {
        padding: 10px;
        font-size: 12px;
        line-height: 18px;
    }

    .fa-check {
        display: none;
    }

    .sec8 {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .sec8 .common-title {
        margin-bottom: 15px;
        font-size: 18px !important;
        line-height: 20px !important;
    }

    .sec8 .common-subtitle {
        margin-top: 0;
        margin-bottom: 20px;
    }

    .sec8 .sec-content-wrapper {
        padding: 0 10px;
        margin: 0;
        margin-top: 0px !important;
    }

    .sec8 .sec-content-wrapper .item-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .sec8 .sec-content-wrapper .item-list .item-li {
        width: 100%;
        height: auto;
        padding: 20px;
        margin: 0;
        border-radius: 5px;
        border: none;
        box-shadow: 0px 1.5px 4px 0.5px rgba(0, 0, 0, 0.16);
    }

    .sec8 .register-section {
        margin: 10px 10px 20px;
        border-radius: 5px;
        padding: 20px;
    }

    .sec8 .register-section .left-text {
        margin-bottom: 15px;
    }

    .sec8 .register-section .register-btn {
        margin: 0;
    }

    .sec6 {
        padding: 0 10px 20px !important;
    }

    .sec6 .common-title {
        margin-bottom: 15px;
        font-size: 18px !important;
        line-height: 20px !important;
    }

    .sec6 .common-subtitle {
        margin-top: 0;
        margin-bottom: 20px;
    }

    .sec6 .sec-content-wrapper {
        padding: 0;
        margin-top: 0;
    }

    .sec6 .item-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .sec6 .item-list .item-li {
        width: 100%;
        height: auto;
        padding: 10px 10px 15px;
        margin: 0;
        border-radius: 5px;
        border: none;
        box-shadow: 0px 1.5px 4px 0.5px rgba(0, 0, 0, 0.16);
    }

    .sec6 .item-list .item-li .img {
        width: 60px;
        margin-bottom: 10px;
    }

    .sec6 .item-list .item-li .title {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 10px;
        margin-top: 0;
    }

    .sec6 .item-list .item-li .desc {
        font-size: 12px;
        line-height: 18px;
        color: #666;
        margin-bottom: 10px;
        margin-top: 0;
        text-align: center;
    }

    .sec9 {
        padding: 20px 10px !important;
    }

    .sec9 .common-title {
        margin-bottom: 15px;
        font-size: 18px !important;
        line-height: 20px !important;
    }

    .sec9 .common-subtitle {
        margin-top: 0;
        margin-bottom: 20px;
    }

    .sec9 .testimonials-container {
        padding: 0;
        margin: 0;
    }

    .sec9 .sec-content-wrapper {
        padding: 0;
        margin: 0;
    }

    .sec9 .testimonials-container .swiper-container {
        padding: 0;
        padding-bottom: 30px;
    }

    .sec9 .testimonial-card {
        margin: 0;
    }

    .sec7 {
        padding: 20px 10px !important;
    }

    .sec7 .common-title {
        margin-bottom: 15px;
        font-size: 18px !important;
        line-height: 20px !important;
    }

    .sec7 .common-subtitle {
        margin-top: 0;
        margin-bottom: 20px;
    }

    .sec7 .sec-content-wrapper {
        padding: 0;
        margin: 0;
    }

    .sec7 .case-list {
        padding: 0 !important;
        margin: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }

    .sec7 .case-list .case-li {
        margin: 0;
    }

    .call-to-action-section {
        padding: 0 10px 20px !important;
        margin: 0;
    }

    .call-to-action-section .wh_1200 {
        padding: 0 !important;
        margin: 0 !important;
    }

    .call-to-action-section .call-to-action-container {
        padding: 20px;
    }

    .call-to-action-section .call-to-action-container h2 {
        font-size: 18px !important;
        line-height: 20px !important;
        margin-bottom: 15px !important;
    }

    .call-to-action-section .call-to-action-container p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 15px;
    }

    .call-to-action-section .call-to-action-container .call-to-action-button {
        padding: 8px 20px !important;
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .friendship-links-section {
        padding: 0 10px !important;
        margin: 0;
        margin-top: 0 !important;
    }

    .friendship-links-section .wh_1200 {
        padding: 0 !important;
        margin: 0 !important;
    }

    .friendship-links-section .links-container {
        box-shadow: 0px 1.5px 4px 0.5px rgba(0, 0, 0, 0.16);
        border-radius: 5px;
    }

    .friendship-links-section .links-container .links-content {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0;
    }

    .friendship-links-section .links-container .links-content li a {
        color: #000;
        font-size: 14px;
        line-height: 24px;
    }
}
/* 友情链接模块样式 */
.friendship-links-section {
    background-color: #fff;
    padding: 30px 0;
    margin-top: 20px;
}

.links-container {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.links-title {
    font-size: 20px;
    color: #333;
    margin-bottom: 20px;
    font-weight: 500;
    position: relative;
    padding-left: 15px;
}

.links-title:before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 18px;
    background: #0080F1;
    border-radius: 2px;
}

.links-content {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.links-content li a {
    color: #666;
    text-decoration: none;
    font-size: 14px;
    padding: 0;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.links-content li a:hover {
    color: #0080F1;
    background: #e6f3ff;
    text-decoration: none;
}

@media screen and (max-width: 768px) {
    .friendship-links-section {
        display: none;
    }
}