﻿@font-face {
    font-family: "iconfont";
    /* Project id 4328318 */
    src: url(../font/iconfont.woff2) format('woff2'),
    url(../font/iconfont.woff) format('woff'),
    url(../font/iconfont.ttf) format('truetype');
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-fanhui1:before {
    content: "\e625";
}

.icon-icon-sousu-1:before {
    content: "\e61f";
}

.icon-icon-guanbi-1:before {
    content: "\e620";
}

.icon-icon-gengduo-1:before {
    content: "\e621";
}

.icon-icon-guanbi-24:before {
    content: "\e622";
}

.icon-icon-gengduo-26:before {
    content: "\e623";
}

.icon-icon-sousu-22:before {
    content: "\e624";
}

.icon-chuxing:before {
    content: "\e614";
}

.icon-meishi:before {
    content: "\e615";
}

.icon-youxi-48:before {
    content: "\e616";
}

.icon-huafei:before {
    content: "\e617";
}

.icon-shangchang:before {
    content: "\e619";
}

.icon-yinyue:before {
    content: "\e61a";
}

.icon-shipin:before {
    content: "\e61b";
}

.icon-jiayou:before {
    content: "\e61c";
}

.icon-tianping:before {
    content: "\e61d";
}

.icon-dianshang:before {
    content: "\e61e";
}

.icon-tianpin140:before {
    content: "\e612";
}

.icon-yinle-140:before {
    content: "\e613";
}

.icon-shangka-26:before {
    content: "\e60b";
}

.icon-jiayou-26:before {
    content: "\e60c";
}

.icon-meishi-26:before {
    content: "\e60d";
}

.icon-dianshangka-26:before {
    content: "\e60e";
}

.icon-chuxinka-26:before {
    content: "\e610";
}

.icon-huafeika-26:before {
    content: "\e611";
}

.icon-PC-logo2:before {
    content: "\e60a";
}

.icon-H5-logo:before {
    content: "\e609";
}

.icon-icon-sousu-18:before {
    content: "\e607";
}

.icon-icon-kefu-20:before {
    content: "\e608";
}

.icon-yuancha:before {
    content: "\e783";
}

.icon-closel:before {
    content: "\e6d5";
}

.icon-fanhui:before {
    content: "\e629";
}

.icon-youjiantou:before {
    content: "\e618";
}

.icon-kefu1:before {
    content: "\ec2e";
}

.icon-sousuo1:before {
    content: "\e60f";
}

.icon-sousuo:before {
    content: "\e8b9";
}


img {
    pointer-events: none
}

#header .logo img {
    pointer-events: auto
}

.el-popup-parent--hidden {
    overflow: auto !important
}

[v-cloak] {
    display: none
}

.mask {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    background-color: var(--c-rgba-0-0-0-0p5);
    backdrop-filter: blur(4px);
    z-index: 2999;
    display: none
}

.close-box,
.agreement-close-box {
    width: 42px;
    height: 42px;
    position: absolute;
    top: 22px;
    right: 22px;
    cursor: pointer;
    background-image: url(../images/guanbi.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center;
    z-index: 4
}

.close-box img,
.agreement-close-box img {
    width: 100%;
    height: 100%
}

.login-class .login-pop-box > .close-box {
    top: 18px;
    right: 18px;
    bottom: auto;
    left: auto;
    transform: none
}

.login-class {
    position: fixed;
    border-radius: 40px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3000
}

.login-pop-box {
    background: var(--c-hex-ffffff);
    padding: 0 0 32px;
    border-radius: 48px;
    transition: all .2s linear;
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.login-page {
    max-height: calc(100vh - 24px);
    overflow-y: auto;
    overflow-x: hidden;
}

.hide {
    display: none
}

.login-top {
    display: flex;
    cursor: pointer
}

.login-type {
    font-size: 18px;
    font-weight: 500;
    color: var(--c-hex-ff7100);
    height: 99px;
    line-height: 88px;
    width: 50%;
    text-align: center
}

.login-type-selected {
    color: var(--c-hex-ffffff);
    background-image: url(../images/password_bg.png);
    background-size: 100% 100%;
    background-repeat: no-repeat
}

.phone-login-type-selected {
    color: var(--c-hex-ffffff);
    background-image: url(../images/phone_bg.png);
    background-size: 100% 100%;
    background-repeat: no-repeat
}

.common-pop-title {
    font-size: 18px;
    font-weight: bold;
    color: var(--c-hex-ff7100);
    text-align: center;
    margin-bottom: 40px
}

.login-pop-input-box {
    width: 500px;
    padding: 0 42px
}

.register-page {
    width: 500px;
}

.login-input-item {
    margin-bottom: 16px
}

.login-input-txt {
    font-size: 16px;
    font-weight: 500;
    color: var(--c-hex-333333);
    margin-bottom: 12px
}

.input-label {
    display: block;
    width: 100%;
    position: relative
}

.input-label .input {
    width: calc(100%);
    padding: 0 15px;
    height: 54px;
    border: 2px solid var(--c-hex-eeeeee);
    border-radius: 12px;
    transition: border .3s;
    font-size: 16px;
    font-weight: 400;
    color: var(--c-hex-333333);
    background-color: var(--c-hex-fbfbfb)
}

.login-page.login-mode-phone .login-phone-label .input {
    width: calc(100%);
    /*padding: 0 130px 0 15px;*/
}

.input-pwd {
    border: 2px solid var(--c-hex-eeeeee);
    border-radius: 12px;
    background-color: var(--c-hex-fbfbfb);
    transition: all .2s linear
}

.input-pwd .input {
    width: 70%;
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
}

.input-pwd .input:focus {
    border-color: var(--c-hex-eeeeee) !important;
    outline: none !important;
    box-shadow: none !important;
}

.code-button,
.forget-code-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 8px;
    padding: 12px 8px;
    min-width: calc(114px - 16px);
    background: var(--c-hex-ff7100);
    border-radius: 8px;
    font-size: 14px;
    font-weight: 400;
    color: var(--c-hex-ffffff);
    cursor: pointer;
    text-align: center
}

.code-button:hover,
.forget-code-button:hover {
    background: var(--c-hex-ff9243)
}

.code-button-disabled {
    opacity: .72;
    cursor: not-allowed;
}

.invitation-code-button {
    font-size: 16px;
    font-weight: 400;
    color: var(--c-hex-333333);
    text-align: right;
    margin-bottom: 32px;
    cursor: pointer
}

.login-input-tips {
    font-size: 16px;
    font-weight: 400;
    color: var(--c-hex-999999);
    text-align: center;
    margin-bottom: 16px
}

.login-button {
    background-color: var(--c-hex-ff7100);
    border-radius: 12px;
    height: 53px;
    width: 100%;
    line-height: 53px;
    font-size: 22px;
    font-weight: 400;
    color: var(--c-hex-ffffff);
    text-align: center;
    margin-bottom: 16px
}

.agreement_box {
    display: flex;
    align-items: center;
    margin-bottom: 32px
}

.login-register-entry {
    margin-top: -20px;
    margin-bottom: 24px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px
}

.login-register-entry__link {
    font-size: 14px;
    color: var(--color-primary, var(--c-hex-ff7100));
    text-decoration: none
}

.login-register-entry__link:hover {
    color: var(--color-primary, var(--c-hex-ff7100))
}

.login-register-entry__link--secondary {
    color: var(--c-hex-999999)
}

.login-register-entry__link--secondary:hover {
    color: var(--color-primary, var(--c-hex-ff7100))
}

/* 公共登录弹窗的第三方登录入口 */
.login-third-party {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid #f0f0f0;
    text-align: center;
}

.login-third-party__label {
    display: block;
    margin-bottom: 10px;
    color: #999;
    font-size: 12px;
}

.login-third-party__actions {
    display: flex;
    justify-content: center;
    gap: 12px;
}

.login-third-party__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 112px;
    height: 34px;
    padding: 0 12px;
    border: 1px solid #e8e8e8;
    border-radius: 17px;
    background: #fff;
    color: #666;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    text-decoration: none;
    transition: border-color .2s, color .2s, background .2s;
}

.login-third-party__button i { font-size: 16px; }
.login-third-party__button--wechat:hover { border-color: #07c160; color: #07c160; background: #f2fff8; }
.login-third-party__button--alipay:hover { border-color: #1677ff; color: #1677ff; background: #f3f8ff; }

/* 微信扫码层：公共弹窗页面不加载 login/login.css，需要在公共样式中声明尺寸 */
.auth-layer-qrcode {
    padding: 20px;
    text-align: center;
    box-sizing: border-box;
}

.auth-layer-qrcode__frame {
    display: block;
    width: 360px;
    max-width: 100%;
    height: 360px;
    margin: 0 auto;
    border: 0;
    background: #fff;
    overflow: hidden;
}

.auth-layer-qrcode__text {
    margin: 14px 0 0;
    color: #666;
    font-size: 14px;
}

@media (max-width: 480px) {
    .login-third-party__actions { gap: 8px; }
    .login-third-party__button { min-width: 0; flex: 1; }
    .auth-layer-qrcode { padding: 16px; }
    .auth-layer-qrcode__frame { width: 260px; height: 260px; }
}

.agreement-label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    cursor: pointer
}

.agreement-box-check {
    margin-right: 4px
}

.agreement-box-check-txt {
    font-size: 14px;
    font-weight: 400;
    color: var(--c-hex-999999);
    cursor: pointer;
    line-height: 1.6;
    flex: 1;
    min-width: 0
}

.agreement-box-check-txt button,
.agreement-box-check-txt span {
    color: var(--c-hex-ff7100)
}

.agreement-button-click {
    color: var(--c-hex-ff7100);
    background-color: var(--c-hex-ffffff);
    cursor: pointer
}

.login-type-list {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px
}

.login-type-list-line {
    width: 126px;
    height: 0;
    border-bottom: 1px solid var(--c-hex-e5e5e5)
}

.login-type-list-txt {
    font-size: 14px;
    font-weight: 400;
    color: var(--c-hex-999999);
    margin: 0 14px;
    white-space: nowrap
}

.login-type-list-content {
    display: flex;
    align-items: center;
    justify-content: center
}

.login-type-list-content a,
.login-type-list-content span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    margin-right: 16px;
    cursor: pointer;
    background-size: 100% auto;
    background-repeat: no-repeat;
    color: var(--c-rgba-0-0-0-0)
}

#wechat,
#alipay {
    display: block
}

#mobile-wechat,
#mobile-alipay {
    display: none
}

@media (max-width: 1200px) {

    #wechat,
    #alipay,
    #mobile-alipay {
        display: none
    }

    #mobile-wechat {
        display: block
    }
}

.wx-icon {
    background-image: url(../images/weixin.png)
}

.alipay-icon {
    background-image: url(../images/zhifubao.png)
}

.login-type-list-content a:last-child {
    margin-right: 0
}

.login-type-list-content span:last-child {
    margin-right: 0
}

.pwd-hide {
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: url(../images/pwd.png) 0 0 no-repeat;
    cursor: pointer;
    background-size: 100% auto
}

.pwd-hide.show {
    background-position: 0 -20px
}

.agreement_box input[type="checkbox"] {
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    vertical-align: top;
    border: 1px solid var(--c-hex-ededed);
    width: 20px;
    height: 20px;
    min-height: 20px;
    min-width: 20px;
    flex: 0 0 20px;
    border-radius: 50%;
    overflow: hidden;
    margin-top: 1px;
    margin-right: 0;
    background-color: var(--c-hex-ffffff);
    cursor: pointer
}

.agreement_box input[type="checkbox"]:checked {
    border: 1px solid var(--c-hex-ff7100);
    outline: none;
    background-color: var(--c-hex-ff7100)
}

.agreement_box input[type=checkbox]:checked::after {
    content: '';
    position: absolute;
    width: 13px;
    height: 9px;
    top: 50%;
    left: 50%;
    background-image: url(../images/check.png);
    background-size: 100% 100%;
    transform: translate(-50%, -50%)
}

.forgot-password {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 29px
}

.forgot-password .agreement_box {
    margin-bottom: 0
}

.forgot-password-txt {
    font-size: 14px;
    font-weight: 400;
    color: var(--c-hex-47d996);
    cursor: pointer
}

.retrieve-password {
    padding-top: 33px;
    padding-bottom: 56px
}

.password-tips {
    font-size: 12px;
    font-weight: 400;
    color: var(--c-hex-fa7375);
    margin-top: 6px;
    line-height: 1.5
}

.retrieve-password .login-button {
    margin-top: 49px
}

.retrieve-password .login-input-tips {
    margin: 16px auto 32px
}

.agreement {
    background: var(--c-hex-ffffff);
    box-shadow: 0px 3px 6px 1px var(--c-rgba-0-0-0-0p21);
    border-radius: 32px;
    padding: 24px 0 0;
    width: 638px;
    transition: all .2s linear;
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.agreement-title {
    font-size: 18px;
    font-weight: 500;
    color: var(--c-hex-333333);
    padding: 0 24px;
    margin-bottom: 24px
}

.agreement-line {
    width: 100%;
    height: 0;
    border-bottom: 1px solid var(--c-hex-e5e5e5);
    margin-bottom: 32px
}

.agreement-content-box {
    height: 50vh;
    width: 87%;
    overflow-y: scroll;
    margin: 0 auto;
    padding: 0 14px
}

.agreement-content-title {
    font-size: 20px;
    font-weight: 500;
    color: var(--c-hex-333333);
    text-align: center;
    margin-bottom: 20px
}

.agreement-content-txt {
    font-size: 14px;
    font-weight: 400;
    color: var(--c-hex-999999);
    line-height: 24px
}

.agreement-content-box::-webkit-scrollbar {
    width: 10px;
    height: 1px
}

.agreement-content-box::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px var(--c-rgba-0-0-0-0p2);
    background: var(--c-hex-b8b8b8)
}

.agreement-content-box::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px var(--c-rgba-0-0-0-0);
    border-radius: 10px;
    background: var(--c-hex-ffffff)
}

.agreement-button-box {
    padding: 24px 0 40px;
    display: flex;
    align-items: center;
    justify-content: center
}

.agreement-button {
    width: 500px;
    height: 56px;
    border-radius: 27px;
    background-color: var(--c-hex-ff7100);
    line-height: 56px;
    text-align: center;
    font-size: 22px;
    font-weight: 400;
    color: var(--c-hex-ffffff)
}

.tip-pop .layui-layer-content {
    border-radius: 8px;
    padding: 9px 9px 12px 10px
}

.tripartite-login-box {
    background: var(--c-hex-ffffff);
    border-radius: 40px;
    padding: 40px 108px 101px
}

.tripartite-title {
    font-size: 18px;
    font-weight: 400;
    color: var(--c-hex-333333);
    margin-bottom: 39px;
    text-align: center
}

.tripartite-login-box-code {
    width: 264px;
    height: 264px;
    background: var(--c-hex-ffffff);
    border-radius: 16px;
    border: 1px solid var(--c-hex-ffa433);
    padding: 22px;
    box-sizing: border-box;
    margin-bottom: 14px
}

.tripartite-login-box-code div img {
    width: 100%;
    height: 100%
}

.tripartite-login-tips {
    font-size: 14px;
    font-weight: 400;
    color: var(--c-hex-666666);
    text-align: center;
    margin-bottom: 60px
}

.tripartite-login-tips img {
    width: 18px;
    height: 18px
}

.other-login-type {
    font-size: 18px;
    font-weight: 500;
    color: var(--c-hex-ff7100);
    text-align: center;
    text-decoration: underline;
    cursor: pointer
}

.retrieve-password-tips {
    font-size: 16px;
    font-weight: 400;
    color: var(--c-hex-999999);
    cursor: pointer;
    text-align: center
}

.retrieve-password-tips span {
    color: var(--color-primary)
}

@media (max-width: 650px) {
    .agreement {
        width: 360px;
        transition: all .2s linear
    }

    .common-pop-title {
        margin-bottom: 32px
    }

    .agreement-line {
        margin-bottom: 20px
    }

    .agreement-content-box {
        height: 50vh;
        width: auto;
        overflow-y: scroll;
        margin: 0 auto;
        padding: 0 19px
    }

    .agreement-content-txt {
        font-size: 12px
    }

    .agreement-content-box::-webkit-scrollbar {
        display: none
    }

    .agreement-button-box {
        padding: 37px 30px 30px
    }

    .agreement-button {
        font-size: 16px;
        width: 100%;
        height: 49px;
        line-height: 49px
    }
}

@media (max-width: 580px) {
    .login-class {
        transform: translate(-50%, -50%) scale(0.9)
    }

    .login-pop-box {
        padding: 0 0 20px;
        border-radius: 38px;
        transition: all .2s linear
    }

    .login-pop-input-box {
        padding: 0 30px;
        width: 360px;
        box-sizing: border-box
    }

    .login-type {
        height: 77px;
        line-height: 65px
    }

    .login-type-selected {
        background-image: url(../images/password_bg_m.png)
    }

    .phone-login-type-selected {
        background-image: url(../images/phone_bg_m.png)
    }

    .input-label .input {
        height: 44px
    }

    .code-button,
    .forget-code-button {
        font-size: 12px;
        padding: 10px;
        right: 6px
    }

    .invitation-code-button {
        font-size: 14px;
        margin-bottom: 22px
    }

    .login-input-tips {
        font-size: 14px;
        margin-bottom: 8px
    }

    .login-button {
        border-radius: 25px;
        height: 49px;
        line-height: 49px;
        font-size: 18px;
        margin-bottom: 18px
    }

    .agreement-box-check-txt {
        font-size: 12px;
        white-space: normal
    }

    .agreement-label {
        align-items: flex-start
    }

    .close-box,
    .agreement-close-box {
        top: 18px;
        right: 18px;
        width: 36px;
        height: 36px
    }

    .login-type-list-line {
        width: 80px
    }

    .login-type-list {
        margin-bottom: 16px
    }

    .login-type-list-txt {
        font-size: 12px
    }

    .retrieve-password {
        padding-top: 20px;
        padding-bottom: 30px
    }

    .password-tips {
        margin-bottom: 8px
    }

    .retrieve-password .login-button {
        margin-top: 40px
    }

    .tripartite-login-box {
        padding: 20px 40px;
        border-radius: 32px;
        transition: all .2s linear
    }
}

@media (max-width: 350px) {

    .login-pop-box,
    .agreement {
        transform: translate(-50%, -50%) scale(0.8)
    }
}

.msg-tips {
    background-color: var(--c-rgba-0-0-0-0p64);
    border: 0;
    border-radius: 6px
}

.msg-tips .layui-layer-content {
    min-width: 112px;
    font-size: 16px;
    font-weight: 400;
    color: var(--c-hex-ffffff);
    padding: 10px 20px
}

.layui-layer-shade {
    background-color: var(--c-rgba-0-0-0-0p5) !important;
    opacity: 1 !important;
    backdrop-filter: blur(4px) !important
}

@media (min-width: 1200px) {

    .van-overlay,
    .van-popup {
        display: none
    }

    .van-calendar__popup {
        display: none
    }

    ::-webkit-scrollbar {
        width: 7px;
        height: 7px;
        background-color: var(--c-hex-ffffff)
    }

    ::-webkit-scrollbar-thumb {
        background: linear-gradient(to bottom, var(--c-hex-ffb351) 0%, var(--c-hex-ff441a) 100%);
        box-sizing: border-box;
        border-radius: 4px
    }

    ::-webkit-scrollbar-track {
        background: var(--c-hex-ffffff)
    }

    ::-webkit-scrollbar-button {
        display: none
    }
}

.common-body {
    padding-top: 84px
}

.common-listbody .b-head {
    border-bottom: 1px solid var(--c-hex-cccccc);
    display: flex;
    justify-content: space-between
}

.common-listbody .b-head h2 {
    padding: 11px 106px 11px 10px;
    background: url(../images/com-head.png) no-repeat center center;
    background-size: 100%;
    font-size: 20px;
    color: var(--c-hex-ff7100);
    margin: 0 0 10px 0;
    font-weight: 700
}

.common-listbody .b-head .back-previous {
    padding: 0 22px;
    line-height: 32px;
    color: var(--c-hex-ffffff);
    display: flex;
    align-items: center;
    border-radius: 21px;
    margin-bottom: 10px;
    font-size: 16px
}

.common-listbody .b-head .back-previous i {
    font-size: 18px;
    margin-right: 10px
}

@media (max-width: 1200px) {
    .common-body {
        max-width: 750px;
        margin: 0 auto;
        padding-top: 44px
    }

    ::-webkit-scrollbar {
        width: 0;
        background-color: var(--c-hex-ffffff)
    }

    .common-listbody .b-head {
        display: none
    }

    ::-webkit-scrollbar {
        width: 0;
        height: 0;
        background-color: var(--c-hex-ffffff)
    }
}

.cursor {
    cursor: pointer
}

.color-main {
    color: var(--c-hex-ff7100) !important
}

.bg-main {
    background: var(--c-hex-ff7100) !important
}

.color-success {
    color: var(--c-hex-00ce6f) !important
}

.color-fail {
    color: var(--c-hex-fa7375) !important
}

.color-red {
    color: red !important
}

.color-being {
    color: var(--c-hex-3492fd) !important
}

.color-completed {
    color: var(--c-hex-2dd488) !important
}

.el-dialog__wrapper {
    display: flex;
    align-items: center;
    justify-content: center
}

.common-dialog {
    transition: all .2s;
    position: relative
}

.common-dialog .el-dialog__header {
    border-bottom: 1px solid var(--c-hex-eeeeee)
}

.common-dialog .el-dialog__header .el-dialog__title {
    font-size: 18px;
    color: var(--c-hex-333333)
}

.common-dialog .close-btn {
    position: absolute;
    left: 50%;
    bottom: -57px;
    z-index: 66;
    width: 42px;
    height: 42px;
    transform: translate(-50%, 0);
    background: url(../images/guanbi.png) no-repeat center center;
    background-size: 100%;
    cursor: pointer
}

.common-dialog .context .el-input__inner {
    height: 40px;
    line-height: 40px
}

.common-dialog .context .common-form .el-form-item {
    margin-bottom: 16px
}

.common-dialog .context .common-form .el-form-item .el-form-item__label {
    text-align: left;
    width: 20%;
    color: var(--c-hex-333333);
    font-size: 16px
}

.common-dialog .context .common-form .el-form-item .account-name {
    color: var(--c-hex-3492fd);
    margin-left: 16px
}

.common-dialog .context .common-form .el-form-item .right,
.common-dialog .context .common-form .el-form-item .el-autocomplete {
    width: 80%
}

.common-dialog .context .common-form .el-form-item .el-autocomplete {
    float: right
}

.common-dialog .context .common-form .el-form-item .el-input__inner {
    background: var(--c-hex-fbfbfb)
}

.common-dialog .context button {
    padding: 16px 0;
    border-radius: 26px;
    font-size: 16px;
    cursor: pointer
}

.common-dialog .context .sure {
    display: block;
    width: 80%;
    margin: 32px auto 0;
    background: var(--c-hex-ff7100);
    color: var(--c-hex-ffffff);
    border: none
}

@media (max-width: 1200px) {
    .common-dialog .el-dialog__header {
        padding: 12px 19px !important
    }

    .el-select-dropdown,
    .el-picker-panel {
        display: none
    }

    .alipay {
        display: none
    }

    .login-type-list-content img {
        margin-right: 0
    }

    .listnoneCenter {
        display: flex !important;
        align-items: center;
        justify-content: center;
        padding: 0 !important
    }

    .el-dialog__wrapper {
        max-width: 750px;
        margin: 0 auto
    }
}

.breadcrumb-nav {
    margin-bottom: 30px;
    padding-left: 19px;
    font-size: 16px;
    color: var(--c-hex-333333);
    padding-top: 30px
}

.breadcrumb-nav .el-breadcrumb__inner a {
    color: var(--c-hex-333333);
    font-weight: 400
}

.breadcrumb-nav .el-breadcrumb__inner a:hover {
    color: var(--c-hex-ff7100)
}

.breadcrumb-nav .el-breadcrumb__item:last-child .el-breadcrumb__inner,
.breadcrumb-nav .el-breadcrumb__item:last-child .el-breadcrumb__inner a,
.breadcrumb-nav .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover,
.breadcrumb-nav .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover {
    color: var(--c-hex-333333)
}

@media (max-width: 1200px) {
    .breadcrumb-nav {
        display: none
    }
}

@-webkit-keyframes shake {
    0% {
        -webkit-transform: rotate(1deg) translateY(-1px);
        transform: rotate(1deg) translateY(-1px)
    }

    25% {
        -webkit-transform: rotate(-1deg) translateY(0px);
        transform: rotate(-1deg) translateY(0px)
    }

    50% {
        -webkit-transform: rotate(1deg) translateY(-1px);
        transform: rotate(1deg) translateY(-1px)
    }

    75% {
        -webkit-transform: rotate(0) translateY(1px);
        transform: rotate(0) translateY(1px)
    }
}

@keyframes shake {
    0% {
        -webkit-transform: rotate(1deg) translateY(-1px);
        transform: rotate(1deg) translateY(-1px)
    }

    25% {
        -webkit-transform: rotate(-1deg) translateY(0px);
        transform: rotate(-1deg) translateY(0px)
    }

    50% {
        -webkit-transform: rotate(1deg) translateY(-1px);
        transform: rotate(1deg) translateY(-1px)
    }

    75% {
        -webkit-transform: rotate(0) translateY(1px);
        transform: rotate(0) translateY(1px)
    }
}

.anmiation-show {
    animation: shake 1s linear 1
}

.border-color-highlight {
    border-color: var(--c-hex-ff7100) !important
}

.el-input__inner {
    border-radius: 12px
}

.el-message-box__wrapper {
    backdrop-filter: blur(4px)
}

.el-dialog__wrapper {
    backdrop-filter: blur(4px);
    background-color: var(--c-rgba-0-0-0-0p5) !important
}

body .dialog-class.layui-layer-border {
    top: 65px !important
}

body .dialog-class {
    background: var(--c-hex-ffffff);
    min-width: 300px;
    box-shadow: 0 3px 6px 1px var(--c-rgba-0-0-0-0p21);
    border-radius: 10px;
    border: 0
}

body .dialog-class .layui-layer-ico {
    background-image: url(../images/lemiicon.png);
    background-repeat: no-repeat;
    background-size: 120px 30px
}

body .dialog-class .layui-layer-btn .layui-layer-btn0 {
    background-color: var(--c-hex-ff7100);
    border-color: var(--c-hex-ff7100);
    border-radius: 4px
}

.el-table .ascending .sort-caret.ascending {
    border-bottom-color: var(--c-hex-333333)
}

.el-table .descending .sort-caret.descending {
    border-top-color: var(--c-hex-333333)
}

.text-two-line {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden
}

.text-one-line {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden
}

.text-three-line {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden
}

.start-text {
    text-align: start
}

.text-center {
    text-align: center
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
form,
fieldset,
legend,
input,
button,
textarea,
p,
blockquote,
th,
td,
button,
input {
    margin: 0;
    padding: 0;
    outline: 0;
    vertical-align: baseline;
    border: none;
    word-break: break-all
}

body {
    margin: 0;
    padding: 0;
    touch-action: manipulation;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}

html {
    height: 100%;
    font-size: 16px
}

a {
    text-decoration: none;
    color: var(--c-hex-000000);
    -webkit-tap-highlight-color: transparent
}

img {
    border: none;
    vertical-align: top;
    font-size: 12px
}

ol,
ul,
li {
    list-style: none;
    padding: 0;
    margin: 0
}

table {
    border-collapse: collapse
}

input {
    color: var(--c-hex-000000);
    line-height: normal;
    font-size: 14px
}

input,
button {
    border: none
}

input::-webkit-input-placeholder {
    color: var(--c-hex-ffffff);
    font-size: 14px;
    line-height: 34px
}

.clearfix::after {
    display: block;
    content: "";
    clear: both
}

.text_hide {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

b,
strong,
i,
em {
    font-weight: normal;
    font-style: normal
}

:focus {
    outline: none
}

.hide {
    display: none
}

.hidden {
    width: 0;
    height: 0;
    overflow: hidden;
    display: none
}

.block {
    display: block
}

.lblock {
    display: inline-block
}

.vmiddle {
    vertical-align: middle
}

.tcenter {
    text-align: center
}

.tright {
    text-align: right
}

.relative {
    position: relative
}

.absolute {
    position: absolute
}

.fixed {
    position: fixed
}

.left {
    float: left
}

.right {
    float: right
}

.clear:after {
    display: block;
    content: ".";
    height: 0;
    font-size: 0;
    overflow: hidden;
    clear: both;
    visibility: hidden
}

.bold {
    font-weight: bold
}

.flex {
    display: flex
}

.underline {
    text-decoration: underline
}

body {
    color: var(--c-hex-333333);
    font: normal 14px/1 "Microsoft YaHei", "微软雅黑", "宋体", Arial, sans-serif
}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: var(--c-hex-d8d8d8)
}

input::input-placeholder,
textarea::input-placeholder {
    color: var(--c-hex-d8d8d8)
}

a {
    color: var(--c-hex-666666);
    text-decoration: none;
    -webkit-tap-highlight-color: var(--c-rgba-0-0-0-0)
}

a:hover {
    cursor: pointer
}

.pd2 {
    padding: 2px
}

.pd4 {
    padding: 4px
}

.pd6 {
    padding: 6px
}

.pd8 {
    padding: 8px
}

.pd10 {
    padding: 10px
}

.pd12 {
    padding: 12px
}

.pd14 {
    padding: 14px
}

.pd20 {
    padding: 20px
}

.pdl2 {
    padding-left: 20px
}

.pdl4 {
    padding-left: 40px
}

.pdl6 {
    padding-left: 60px
}

.pdl8 {
    padding-left: 80px
}

.pdl10 {
    padding-left: 10px
}

.pdl12 {
    padding-left: 12px
}

.pdl14 {
    padding-left: 14px
}

.pdl16 {
    padding-left: 16px
}

.pdr2 {
    padding-right: 2px
}

.pdr4 {
    padding-right: 4px
}

.pdr6 {
    padding-right: 6px
}

.pdr8 {
    padding-right: 8px
}

.pdr10 {
    padding-right: 10px
}

.pdr12 {
    padding-right: 12px
}

.pdr14 {
    padding-right: 14px
}

.pdb2 {
    padding-bottom: 2px
}

.pdb4 {
    padding-bottom: 4px
}

.pdb6 {
    padding-bottom: 6px
}

.pdb8 {
    padding-bottom: 8px
}

.pdb10 {
    padding-bottom: 10px
}

.pdb12 {
    padding-bottom: 12px
}

.pdb14 {
    padding-bottom: 14px
}

.pdt2 {
    padding-top: 2px
}

.pdt4 {
    padding-top: 4px
}

.pdt6 {
    padding-top: 6px
}

.pdt8 {
    padding-top: 8px
}

.pdt10 {
    padding-top: 10px
}

.pdt12 {
    padding-top: 12px
}

.pdt14 {
    padding-top: 14px
}

.mg2 {
    margin: 2px
}

.mg4 {
    margin: 4px
}

.mg6 {
    margin: 6px
}

.mg8 {
    margin: 8px
}

.mg10 {
    margin: 10px
}

.mg12 {
    margin: 12px
}

.mg14 {
    margin: 14px
}

.mgt2 {
    margin-top: 2px
}

.mgt4 {
    margin-top: 4px
}

.mgt6 {
    margin-top: 6px
}

.mgt8 {
    margin-top: 8px
}

.mgt10 {
    margin-top: 10px
}

.mgt12 {
    margin-top: 12px
}

.mgt14 {
    margin-top: 14px
}

.mgt16 {
    margin-top: 16px
}

.mgt20 {
    margin-top: 20px
}

.mgt22 {
    margin-top: 22px
}

.mgt24 {
    margin-top: 24px
}

.mgt30 {
    margin-top: 30px
}

.mgl2 {
    margin-left: 2px
}

.mgl4 {
    margin-left: 4px
}

.mgl6 {
    margin-left: 6px
}

.mgl8 {
    margin-left: 8px
}

.mgl10 {
    margin-left: 10px
}

.mgl12 {
    margin-left: 12px
}

.mgl14 {
    margin-left: 14px
}

.mgl20 {
    margin-left: 20px
}

.mgb2 {
    margin-bottom: 2px
}

.mgb4 {
    margin-bottom: 4px
}

.mgb6 {
    margin-bottom: 6px
}

.mgb8 {
    margin-bottom: 8px
}

.mgb10 {
    margin-bottom: 10px
}

.mgb12 {
    margin-bottom: 12px
}

.mgb14 {
    margin-bottom: 14px
}

.mgb20 {
    margin-bottom: 20px
}

.mgb24 {
    margin-bottom: 24px
}

.mgr2 {
    margin-right: 2px
}

.mgr4 {
    margin-right: 4px
}

.mgr6 {
    margin-right: 6px
}

.mgr8 {
    margin-right: 8px
}

.mgr10 {
    margin-right: 10px
}

.mgr12 {
    margin-right: 12px
}

.mgr14 {
    margin-right: 14px
}

.mgr20 {
    margin-right: 20px
}

.colorff0000 {
    color: var(--c-hex-ff0000)
}

.colorf97373 {
    color: var(--c-hex-f97373)
}

.color399eff {
    color: var(--c-hex-2186f6)
}

.color333333 {
    color: var(--c-hex-333333)
}

.color000000 {
    color: var(--c-hex-000000)
}

.color2be3dc {
    color: var(--c-hex-2be3dc)
}

.color2dd488 {
    color: var(--c-hex-2dd488)
}

.color666666 {
    color: var(--c-hex-666666)
}

.color999999 {
    color: var(--c-hex-999999)
}

.colorff7100 {
    color: var(--c-hex-ff7100)
}

.colofa7375 {
    color: var(--c-hex-fa7375)
}

.color959595 {
    color: var(--c-hex-959595)
}

.color747474 {
    color: var(--c-hex-747474)
}

.color8496ff {
    color: var(--c-hex-8496ff)
}

.colofed400 {
    color: var(--c-hex-fed400)
}

.colorFFA433 {
    color: var(--c-hex-ffa433)
}

.colorEB7213 {
    color: var(--c-hex-eb7213)
}

.colorff8f18 {
    color: var(--c-hex-ff8f18)
}

.colorFA7375 {
    color: var(--c-hex-fa7375)
}

.colorffffff {
    color: var(--c-hex-ffffff)
}

.bgColorFB7A32 {
    background: var(--c-hex-fb7a32)
}

.bgColorFFF9F9 {
    background: var(--c-hex-fff9f9)
}

.bgColorF1FCFE {
    background: var(--c-hex-f1fcfe)
}

.bgColorF9F9F9 {
    background: var(--c-hex-f9f9f9)
}

.bgColorFFF9FD {
    background: var(--c-hex-fff9fd)
}

.bgColorF6fafe {
    background: var(--c-hex-f6fafe)
}

.bgColorffffff {
    background: var(--c-hex-ffffff)
}

.bgColorFF7100 {
    background: var(--c-hex-ff7100)
}

.bgColorFF9B00 {
    background: var(--c-hex-ff9b00)
}

.bColorFE7035 {
    border-color: var(--c-hex-fe7035)
}

.font12 {
    font-size: 12px
}

.font14 {
    font-size: 14px
}

.font15 {
    font-size: 15px
}

.font16 {
    font-size: 16px
}

.font18 {
    font-size: 18px
}

.font20 {
    font-size: 20px
}

.font24 {
    font-size: 24px
}

.font28 {
    font-size: 28px
}

.font30 {
    font-size: 30px
}

.font36 {
    font-size: 36px
}

.font40 {
    font-size: 40px
}

.font48 {
    font-size: 48px
}

.font-weight55 {
    font-weight: 550
}

.wp50 {
    width: 50%
}

.wp60 {
    width: 60%
}

.wp70 {
    width: 70%
}

.wp80 {
    width: 80%
}

.wp90 {
    width: 90%
}

.wp100 {
    width: 100%
}

.w148 {
    width: 200px
}

.w200 {
    width: 200px
}

.flex {
    display: flex
}

.flexCenter {
    display: flex;
    align-items: center;
    justify-content: center
}

.cursorp {
    cursor: pointer
}

.br4 {
    border-radius: 4px
}

.br6 {
    border-radius: 6px
}

.br10 {
    border-radius: 10px
}

.br16 {
    border-radius: 16px
}

.br18 {
    border-radius: 18px
}

.br20 {
    border-radius: 20px
}

.br25 {
    border-radius: 25px
}

.home-head {
    width: 100%;
    box-sizing: border-box;
    padding: 0 102px;
    color: var(--c-hex-ffffff);
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 11;
    background: url(../images/nav_bg.png) no-repeat center center;
    background-size: 100% 100%
}

.home-head .navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 0;
    box-sizing: border-box
}

.home-head .navigation .back-icon {
    width: 9px;
    height: 16px;
    background: url(../images/back-icon.png) no-repeat center center;
    background-size: 100%;
    margin-right: 16px;
    display: none
}

.home-head .navigation .logo {
    font-size: 0
}

.home-head .navigation .logo img {
    width: auto;
    height: 45px;
    max-width: none
}

.home-head .navigation .logo i {
    width: 9px;
    height: 16px;
    background: url(../images/back-icon.png) no-repeat center center;
    background-size: 100%;
    margin-right: 16px;
    display: none;
    padding: 2px
}

.home-head .navigation .logo .back-ree {
    width: 9px;
    height: 16px;
    background: url(../images/back-icon.png) no-repeat center center;
    background-size: 100%;
    margin-right: 16px;
    display: block;
    color: var(--c-rgba-0-0-0-0)
}

.home-head .navigation .head-title {
    display: none
}

.home-head .navigation nav {
    flex-grow: 1
}

.home-head .navigation .headTitle {
    font-size: 16px;
    color: var(--c-hex-333333);
    display: none;
}

.home-head .navigation .nav-menu {
    display: flex;
    font-size: 18px;
    flex-wrap: nowrap;
    padding: 0 6%;
    box-sizing: border-box
}

.home-head .navigation .nav-menu .nav-item {
    position: relative;
    padding: 0 3%;
    cursor: pointer
}

.home-head .navigation .nav-menu .nav-item .nav-link {
    position: relative;
    display: block;
    color: var(--c-hex-ffd9cb);
    padding: 30px 6px;
    transition: all .3s
}

.home-head .navigation .nav-menu .nav-item .nav-link .right-arrow {
    display: none;
    width: 8px;
    height: 8px;
    background: url(../images/right-arrow.png) no-repeat center center;
    background-size: 100%
}

.home-head .navigation .nav-menu .nav-item .nav-link .arrow {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--c-hex-ffffff);
    border-bottom: 2px solid var(--c-hex-ffffff);
    transform: translate3d(6px, -2px, 0) rotateZ(45deg);
    transition: border-color .3s
}

.home-head .navigation .nav-menu .nav-item .nav-link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 4px;
    background-color: var(--c-hex-ffffff);
    border-radius: 3px;
    transition: transform .5s;
    transform-origin: 100% 0;
    transform: scaleX(0)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu {
    display: none;
    opacity: 0;
    background: var(--c-hex-ffffff);
    position: absolute;
    top: 74px;
    z-index: 2;
    border: 1px solid var(--c-hex-eeeeee);
    border-top: 0;
    border-radius: 20px;
    box-shadow: 0 5px 35px -3px var(--c-rgba-50-50-50-0p2);
    transition: .4s
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list {
    width: 850px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    box-sizing: border-box;
    padding: 6px
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item {
    display: block;
    width: 20%;
    padding: 6px 1%;
    box-sizing: border-box
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item span {
    color: var(--c-hex-ffffff);
    position: absolute;
    left: 6px;
    bottom: 12px;
    padding: 4px 10px;
    font-size: 12px;
    border-radius: 20px;
    background: linear-gradient(87deg, var(--c-hex-fe9c39) 0%, var(--c-hex-ff6411) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img-box {
    height: 86px;
    position: relative;
    border-radius: 12px;
    transition: all .3s;
    border: 2px solid transparent;
    border-radius: 12px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center;
    box-sizing: border-box
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img-box h3 {
    position: absolute;
    left: 7px;
    top: 20px;
    font-size: 14px;
    color: var(--c-hex-f87400);
    font-weight: bold;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img1 {
    background-image: url(../images/card-phone.png);
    background-size: 100% 100%
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img1 h3 {
    color: var(--c-hex-cb5715)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img1 span {
    background: linear-gradient(87deg, var(--c-hex-fe9c39) 0%, var(--c-hex-ff6411) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img1:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-fe9031)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img2 {
    background-image: url(../images/card-game.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img2 h3 {
    color: var(--c-hex-3077ce)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img2 span {
    background: linear-gradient(87deg, var(--c-hex-67afff) 0%, var(--c-hex-2a8efe) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img2:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-3b9eff)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img3 {
    background-image: url(../images/card-cheer.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img3 h3 {
    color: var(--c-hex-0ea560)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img3 span {
    background: linear-gradient(97deg, var(--c-hex-27d67c) 0%, var(--c-hex-07ae62) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img3:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-2dd17f)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img4 {
    background-image: url(../images/card-shop.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img4 h3 {
    color: var(--c-hex-7671ff)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img4 span {
    background: linear-gradient(87deg, var(--c-hex-8aa7fd) 0%, var(--c-hex-5957fd) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img4:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-8093fd)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img5 {
    background-image: url(../images/card-food.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img5 h3 {
    color: var(--c-hex-f87400)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img5 span {
    background: linear-gradient(87deg, var(--c-hex-ffbb00) 0%, var(--c-hex-ff7700) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img5:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-feb31a)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img6 {
    background-image: url(../images/card-media.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img6 h3 {
    color: var(--c-hex-c0413d)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img6 span {
    background: linear-gradient(87deg, var(--c-hex-fd8a64) 0%, var(--c-hex-fe5558) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img6:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-fe8364)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img7 {
    background-image: url(../images/card-hero.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img7 h3 {
    color: var(--c-hex-ae68ff)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img7 span {
    background: linear-gradient(87deg, var(--c-hex-fe89f2) 0%, var(--c-hex-e632d8) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img7:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-ec43e0)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img8 {
    background-image: url(../images/card-walk.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img8 h3 {
    color: var(--c-hex-07a58a)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img8 span {
    background: linear-gradient(87deg, var(--c-hex-57e377) 0%, var(--c-hex-05dc9a) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img8:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-00d4b6)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img9 {
    background-image: url(../images/card-music.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img9 h3 {
    color: var(--c-hex-00c469)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img9 span {
    background: linear-gradient(87deg, var(--c-hex-60d554) 0%, var(--c-hex-18d104) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img9:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-1cd108)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img10 {
    background-image: url(../images/card-dessert.png)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img10 h3 {
    color: var(--c-hex-f94f14)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img10 span {
    background: linear-gradient(87deg, var(--c-hex-ffa55d) 0%, var(--c-hex-f94f14) 100%)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .img-list .img-item .img10:hover {
    transform: translateY(-4px);
    border-color: var(--c-hex-f94f14)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .hot-search {
    padding: 12px 0 12px 24px;
    border-top: 1px solid var(--c-hex-dddddd);
    color: var(--c-hex-666666)
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .hot-search strong {
    font-weight: 700
}

.home-head .navigation .nav-menu .nav-item .card-drop-menu .hot-search a {
    padding: 0;
    display: inline-block;
    margin-right: 10px
}

.home-head .navigation .oper {
    display: flex;
    align-items: center
}

.home-head .navigation .oper .hsearch-btn {
    margin-right: 72px;
    position: relative;
    color: var(--c-hex-ffd9cb)
}

.home-head .navigation .oper .hsearch-btn .btn {
    display: flex;
    align-items: center;
    font-size: 16px;
    color: var(--c-hex-ffd9cb);
    transition: all .3s
}

.home-head .navigation .oper .hsearch-btn .search {
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(../images/sousu.png) no-repeat center center;
    background-size: 100%
}

.home-head .navigation .oper .hlogin-btn {
    padding: 12px 18px;
    border-radius: 20px;
    color: var(--c-hex-ff7100);
    background: var(--c-hex-ffffff);
    opacity: 0.8;
    transition: all .3S
}

.home-head .navigation .oper .aready {
    position: relative;
    /* display: none */
}

.home-head .navigation .oper .aready .info {
    display: flex;
    align-items: center;
    color: var(--c-hex-ffd9cb)
}

.home-head .navigation .oper .aready img {
    height: 40px;
    width: 40px;
    border-radius: 50%;
    border: 1px solid var(--c-hex-ffffff)
}

.home-head .navigation .oper .aready .user-drop-menu {
    opacity: 0;
    display: none;
    position: absolute;
    right: -80px;
    top: 40px;
    z-index: 66;
    padding-top: 20px
}

.home-head .navigation .oper .aready .user-drop-menu .user-top {
    display: flex;
    align-items: center;
    padding: 8px 10px 10px;
    background: url(../images/aready-bg.png) no-repeat center center;
    background-size: 100%;
    box-sizing: border-box
}

.home-head .navigation .oper .aready .user-drop-menu .user-top .img {
    height: 62px;
    width: 62px;
    border-radius: 50%
}

.home-head .navigation .oper .aready .user-drop-menu .user-top .l_info {
    font-size: 12px;
    color: var(--c-hex-666666);
    margin: 0 10px
}

.home-head .navigation .oper .aready .user-drop-menu .user-top .l_info div {
    margin-top: 4px
}

.home-head .navigation .oper .aready .user-drop-menu .user-top .l_info div:nth-of-type(1) {
    width: 80px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.home-head .navigation .oper .aready .user-drop-menu .user-top .btn {
    font-size: 14px;
    padding: 9px 10px;
    border-radius: 16px;
    color: var(--c-hex-ffffff);
    white-space: nowrap
}

.home-head .navigation .oper .aready .user-drop-menu .user-top .logout {
    background: var(--c-hex-2a8efe);
    margin-right: 10px
}

.home-head .navigation .oper .aready .user-drop-menu .user-top .member {
    background: var(--c-hex-ff7100)
}

.home-head .navigation .oper .aready .user-drop-menu .user-btm {
    display: flex;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    padding: 8px 0 8px;
    background: var(--c-hex-ffffff)
}

.home-head .navigation .oper .aready .user-drop-menu .user-btm i {
    display: block;
    width: 41px;
    height: 39px;
    margin: 0 auto 10px
}

.home-head .navigation .oper .aready .user-drop-menu .user-btm .ico1 {
    background: url(../images/aready-sell.png) no-repeat center center;
    background-size: 100%
}

.home-head .navigation .oper .aready .user-drop-menu .user-btm .ico2 {
    background: url(../images/aready-order.png) no-repeat center center;
    background-size: 100%
}

.home-head .navigation .oper .aready .user-drop-menu .user-btm .ico3 {
    background: url(../images/aready-withdraw.png) no-repeat center center;
    background-size: 100%
}

.home-head .navigation .oper .aready .user-drop-menu .user-btm .ico4 {
    background: url(../images/aready-worder.png) no-repeat center center;
    background-size: 100%
}

.home-head .navigation .oper .aready .user-drop-menu .user-btm span {
    font-size: 14px;
    color: var(--c-hex-333333);
    transition: all .3s
}

.home-head .navigation .oper .aready .user-drop-menu .inner {
    width: 348px;
    box-sizing: border-box;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 5px 35px -3px var(--c-rgba-50-50-50-0p2)
}

.home-head .navigation .oper .aready:hover .user-drop-menu {
    opacity: 1;
    display: block
}

.home-head .navigation .oper .more-btn {
    width: 28px;
    height: 28px;
    margin-left: 21px;
    display: none;
    cursor: pointer;
    color: var(--c-hex-333333)
}

.home-head .navigation .oper .index-more-btn {
    color: var(--c-hex-ffffff)
}

.home-head .navigation .oper .more-close {
    background: url(../images/guanbi-white.png) no-repeat center center;
    background-size: 100%
}

.header-shadow {
    box-shadow: 0px 13px 35px -12px var(--c-rgba-0-0-0-0p15);
    animation: stickyMenu 7s ease-in-out
}

.other-head {
    background: var(--c-hex-ffffff);
    box-shadow: 0px 4px 9px 1px var(--c-rgba-0-0-0-0p13)
}

.other-head .navigation nav .nav-menu .nav-item .nav-link {
    color: var(--c-hex-333333);
    font-weight:600;
}

.other-head .navigation nav .nav-menu .nav-item .nav-link .arrow {
    border-right: 2px solid var(--c-hex-333333);
    border-bottom: 2px solid var(--c-hex-333333)
}

.other-head .navigation .oper .hsearch-btn {
    color: var(--c-hex-333333)
}

.other-head .navigation .oper .hsearch-btn .btn {
    color: var(--c-hex-333333)
}

.other-head .navigation .oper .hsearch-btn .search {
    background: url(../images/sousu-block.png) no-repeat center center;
    background-size: 100%
}

.other-head .navigation .oper .aready .user-name {
    color: var(--c-hex-333333)
}

.other-head .navigation .oper .hlogin-btn {
    padding: 12px 18px;
    border-radius: 20px;
    color: var(--c-hex-ffffff);
    background: var(--color-primary);
    opacity: 0.8;
    transition: all .3S
}

.other-head .navigation .oper .hlogin-btn a,
.other-head .navigation .oper .hlogin-btn a:hover,
.other-head .navigation .oper .hlogin-btn a:active,
.other-head .navigation .oper .hlogin-btn a:visited,
.other-head .navigation .oper .hlogin-btn a:focus {
    color: var(--c-hex-ffffff)
}

.other-head .navigation .oper .more-close {
    background: url(../images/guanbi-block.png) no-repeat center center;
    background-size: 100%
}

.mobile-user-center-nav {
    display: none;
}

.footer-simple {
    background: none;
}

@keyframes stickyMenu {
    0% {
        margin-top: -120px;
        opacity: 0
    }

    50% {
        margin-top: -64px;
        opacity: 0
    }

    100% {
        margin-top: 0;
        opacity: 1
    }
}

@media (min-width: 1200px) {

    .home-head .navigation .nav-menu .nav-item:hover .active::after,
    .home-head .navigation .nav-menu .nav-item:hover .nav-link::after {
        color: var(--c-hex-ffffff);
        transform-origin: 0 0;
        transform: scaleX(1)
    }

    .home-head .navigation .nav-menu .nav-item:hover .active,
    .home-head .navigation .nav-menu .nav-item:hover .nav-link {
        color: var(--c-hex-ffffff)
    }

    .home-head .navigation .nav-menu .nav-item:hover .active .arrow,
    .home-head .navigation .nav-menu .nav-item:hover .nav-link .arrow {
        border-right: 2px solid var(--c-hex-ffffff);
        border-bottom: 2px solid var(--c-hex-ffffff)
    }

    .home-head .navigation .nav-menu .nav-item .active::after {
        color: var(--c-hex-ffffff);
        transform-origin: 0 0;
        transform: scaleX(1)
    }

    .home-head .navigation .nav-menu .nav-item .active {
        color: var(--c-hex-ffffff)
    }

    .other-head .navigation nav .nav-menu .nav-item:hover .active::after,
    .other-head .navigation nav .nav-menu .nav-item:hover .nav-link::after {
        color: var(--c-hex-ff7100);
        transform-origin: 0 0;
        transform: scaleX(1)
    }

    .other-head .navigation nav .nav-menu .nav-item:hover .active,
    .other-head .navigation nav .nav-menu .nav-item:hover .nav-link {
        color: var(--c-hex-ff7100)
    }

    .other-head .navigation nav .nav-menu .nav-item:hover .active .arrow,
    .other-head .navigation nav .nav-menu .nav-item:hover .nav-link .arrow {
        border-right: 2px solid var(--c-hex-ff7100);
        border-bottom: 2px solid var(--c-hex-ff7100)
    }

    .other-head .navigation nav .nav-menu .nav-item .active {
        color: var(--c-hex-ff7100) !important
    }

    .other-head .navigation nav .nav-menu .nav-item .active .arrow {
        border-right: 2px solid var(--c-hex-ff7100);
        border-bottom: 2px solid var(--c-hex-ff7100)
    }

    .other-head .navigation nav .nav-menu .nav-link::after {
        background: linear-gradient(to right, var(--c-hex-ffb351) 0%, var(--c-hex-ff441a) 100%)
    }

    .other-head .navigation nav .nav-menu .nav-link .arrow {
        border-right: 2px solid var(--c-hex-333333);
        border-bottom: 2px solid var(--c-hex-333333)
    }

    .home-head .navigation .card:hover .card-drop-menu {
        opacity: 1;
        display: block
    }

    .index-head .navigation .oper .hsearch-btn .btn:hover {
        color: var(--c-hex-ffffff)
    }

    .other-head .navigation .oper .hsearch-btn .btn:hover {
        color: var(--c-hex-ff7100)
    }

    .home-head .navigation .oper .hlogin-btn:hover {
        opacity: 1
    }

    .other-head .navigation .oper .aready .info:hover .user-name {
        color: var(--c-hex-ff7100)
    }

    .index-head .navigation .oper .aready .info:hover .user-name {
        color: var(--c-hex-ffffff)
    }

    .home-head .navigation .nav-menu .nav-item .card-drop-menu .hot-search a:hover {
        color: var(--c-hex-ff7100)
    }

    .home-head .navigation .oper .aready .user-drop-menu .user-btm a:hover span {
        color: var(--c-hex-ff7100);
        font-weight: bold
    }
}

@media (max-width: 1320px) {
    .home-head {
        padding: 0 30px
    }

    .home-head .navigation .oper .aready .user-drop-menu {
        right: -20px
    }
}

@media (max-width: 1200px) {
    .page-warprer .index-head .navigation nav {
        left: 160%
    }

    .home-head .navigation {
        padding: 10px 0 10px
    }

    .home-head .navigation nav {
        position: fixed;
        left: 100vw;
        width: 100%;
        height: 100vh;
        bottom: 0;
        top: 66px;
        z-index: 10;
        background: var(--c-hex-f8f8f8);
        box-shadow: 0px 4px 9px 1px var(--c-rgba-0-0-0-0p1) inset;
        transition: all .5s
    }

    .home-head .navigation nav .nav-menu {
        flex-wrap: wrap;
        padding: 0 15px
    }

    .home-head .navigation nav .nav-menu .nav-item {
        width: 100%;
        margin: 16px auto 0;
        padding: 0;
        border-bottom: 1px solid var(--c-hex-d4d4d4)
    }

    .home-head .navigation nav .nav-menu .nav-item .nav-link {
        color: var(--c-hex-333333);
        font-size: 18px;
        line-height: 32px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0
    }

    .home-head .navigation nav .nav-menu .nav-item .nav-link .right-arrow {
        display: block
    }

    .home-head .navigation nav .nav-menu .nav-item .nav-link .arrow {
        display: none
    }

    .home-head .navigation .oper .hsearch-btn {
        margin-right: 0
    }

    .home-head .navigation .oper .hsearch-btn .btn {
        font-size: 0
    }

    .home-head .navigation .oper .more-btn {
        display: block
    }

    .home-head .navigation .oper .hlogin-btn {
        display: block !important;
        flex: 0 0 auto;
        margin-left: 10px;
        white-space: nowrap
    }

    .login-page { max-height: calc(100vh - 16px); }

    .home-head .navigation .oper .aready {
        display: none !important
    }

    .other-head .navigation .oper .hsearch-btn {
        display: none
    }

    .mobile-user-center-nav {
        display: block
    }
}

@media (max-width: 1200px) {
    .home-head {
        max-width: 750px
    }

    .home-head .navigation .logo img {
        width: auto;
        height: 45px;
        max-width: none
    }

    .home-head .navigation {
        padding: 7px 0
    }

    .home-head .navigation .logo {
        display: flex;
        align-items: center
    }

    .home-head .navigation .logo i {
        display: block
    }

    .home-head .navigation .head-title {
        display: block;
        color: var(--c-hex-333333);
        position: absolute;
        left: 50%;
        font-size: 16px;
        font-weight: bold;
        transform: translate(-50%, 0)
    }

    .home-head {
        padding: 0 14px
    }

    .home-head .navigation nav ul {
        display: none
    }

    .home-head .navigation .oper .hsearch-btn .search {
        width: 14px;
        height: 14px
    }

    .home-head .navigation .oper .more-btn {
        width: 28px;
        height: 28px;
        margin-left: 20px
    }

    .home-head .navigation nav {
        top: 59px;
        height: calc(100vh - 59px);
        height: calc(100dvh - 59px)
    }
}

.home-footer .ftop {
    border-bottom: 1px solid var(--c-hex-dfe5f0)
}

.home-footer .top-container {
    max-width: 1440px;
    display: flex;
    margin: 0 auto;
    padding: 66px 100px;
    text-align: center;
    color: var(--c-hex-aaaaaa)
}

.home-footer .top-container a {
    color: var(--c-hex-aaaaaa)
}

.home-footer .top-container .footer-widget h4 {
    font-size: 18px;
    font-weight: bold;
    color: var(--c-hex-666666)
}

.home-footer .top-container .footer-widget h4 i {
    display: none
}

.home-footer .top-container .footer-widget .footer-menu {
    transition: transform 300ms ease
}

.home-footer .top-container .footer-widget .footer-menu li {
    margin-top: 30px;
    font-size: 16px
}

.home-footer .top-container .footer-widget .footer-menu .customer {
    display: inline-block
}

.home-footer .top-container .footer-widget .footer-menu .customer a {
    display: flex;
    align-items: center;
    padding: 7px 18px;
    background: var(--c-hex-ff7100);
    border-radius: 10px;
    color: var(--c-hex-ffffff)
}

.home-footer .top-container .footer-widget .footer-menu .customer i {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(../images/icon-kefu.png) no-repeat center center;
    background-size: 100%;
    margin-right: 7px
}

.home-footer .top-container .footer-widget .footer-menu2 {
    max-width: 70%;
    margin: 0 auto
}

.home-footer .top-container .footer-widget .footer-menu2 li {
    display: flex;
    justify-content: space-between
}

.home-footer .top-container .footer-widget .footer-ewm {
    width: 120px;
    margin: 20px auto 15px
}

.home-footer .top-container .item {
    position: relative
}

.home-footer .top-container .item::after {
    display: block;
    content: "";
    width: 1px;
    height: 140px;
    background: var(--c-hex-e5e5e5);
    position: absolute;
    right: 0;
    top: 39px
}

.home-footer .top-container .item:nth-of-type(1) {
    width: 29.1%;
    text-align: left
}

.home-footer .top-container .item:nth-of-type(1) .footer-logo {
    width: 109px
}

.home-footer .top-container .item:nth-of-type(1) .widget-title {
    margin-top: 37px
}

.home-footer .top-container .item:nth-of-type(1) .footer-menu li {
    margin-top: 24px
}

.home-footer .top-container .item:nth-of-type(2) {
    width: 34%
}

.home-footer .top-container .item:nth-of-type(3) {
    display: flex;
    justify-content: flex-end;
    width: 36.8%
}

.home-footer .top-container .item:nth-of-type(3) .footer-widget {
    width: 74%;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.home-footer .top-container .item:nth-of-type(3) p {
    margin-top: 32px;
    font-size: 14px;
    line-height: 1.7;
    text-align: left
}

.home-footer .top-container .item:nth-of-type(3)::after {
    display: none
}

.home-footer .btm-container {
    color: var(--c-hex-c4c4c4);
    text-align: center;
    padding: 24px 0
}

.home-footer .btm-container a {
    color: var(--c-hex-c4c4c4);
    margin: 0 5px
}

.home-footer .btm-container p {
    font-size: 14px
}

.home-footer .btm-container .authentication,
.home-footer .btm-container .mb-0 {
    display: none
}

.home-footer .btm-container .youlian {
    display: flex;
    align-items: center;
    justify-content: center
}

.home-footer .btm-container .card-news {
    margin-right: 20px
}

@media (min-width: 1200px) {
    .home-footer {
        padding-bottom: 20px;
        display: block
    }

    .home-footer a:hover {
        color: var(--c-hex-ff7100)
    }
}

@media (max-width: 1200px) {
    .home-footer {
        padding-bottom: 20px;
        display: none
    }

    .home-footer .top-container,
    .home-footer .btm-container {
        width: calc(100% - 28px);
        margin: 0 auto;
        user-select: none
    }

    .home-footer .ftop {
        border: none
    }

    .home-footer .ftop .top-container {
        display: block;
        padding: 14px 14px 0
    }

    .home-footer .ftop .top-container .item {
        padding: 0;
        width: 100%;
        position: relative;
        border-bottom: 1 px solid var(--c-hex-f2f2f2)
    }

    .home-footer .ftop .top-container .item::after {
        display: none
    }

    .home-footer .ftop .top-container .item .footer-widget {
        width: 100%;
        max-width: 100%
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-logo {
        width: 127px
    }

    .home-footer .ftop .top-container .item .footer-widget .customer {
        display: none
    }

    .home-footer .ftop .top-container .item .footer-widget p {
        padding-bottom: 18px;
        margin-top: 12px;
        width: 100%;
        text-align: left
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-logo {
        display: none
    }

    .home-footer .ftop .top-container .item .footer-widget h4 {
        font-size: 14px;
        line-height: 40px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-weight: 700;
        width: 100%;
        color: var(--c-hex-333337)
    }

    .home-footer .ftop .top-container .item .footer-widget h4 i {
        display: block;
        width: 10px;
        height: 10px;
        background: url(../images/footer-add.png) no-repeat center center;
        background-size: 100%;
        margin-right: 12px;
        transition: all 300ms ease
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-menu {
        position: absolute;
        transform: scaleY(0);
        opacity: 0;
        color: var(--c-hex-595757);
        font-size: 12px;
        transform-origin: 0 0
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-menu a {
        color: var(--c-hex-595757)
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-menu li {
        margin-left: 7px;
        text-align: left;
        font-size: 12px
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-menu li:nth-of-type(1) {
        margin-top: 14px
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-menu li:nth-last-of-type(1) {
        margin-bottom: 24px
    }

    .home-footer .ftop .top-container .item .footer-widget .footer-open {
        transform: scaleY(1);
        position: static;
        opacity: 1
    }

    .home-footer .ftop .top-container .item:nth-of-type(1) .widget-title {
        margin-top: 0
    }

    .home-footer .ftop .top-container .item:nth-of-type(1) .footer-menu li:nth-last-of-type(2) {
        margin-bottom: 24px
    }

    .home-footer .ftop .top-container .item:nth-of-type(5) {
        justify-content: flex-start;
        border: none
    }

    .home-footer .ftop .top-container .item:nth-of-type(5) .footer-ewm {
        margin: 24px auto 0
    }

    .home-footer .ftop .top-container .item:nth-of-type(5) h4 {
        display: none
    }

    .home-footer .fbtm .btm-container {
        padding: 12px 0 0
    }

    .home-footer .fbtm .btm-container p {
        font-size: 12px;
        line-height: 1.4;
        text-align: left
    }

    .home-footer .fbtm .btm-container p a:nth-of-type(1) {
        margin-left: 0
    }

    .home-footer .fbtm .btm-container .youlian {
        display: block
    }

    .home-footer .fbtm .btm-container .youlian img {
        display: none
    }

    .home-footer .fbtm .btm-container .authentication,
    .home-footer .fbtm .btm-container .mb-0 {
        display: none
    }
}

.right-bar {
    width: 92px;
    position: fixed;
    right: 14px;
    bottom: 31.7%;
    z-index: 67;
    background: var(--c-hex-ffffff);
    box-shadow: 0 5px 35px -3px var(--c-rgba-50-50-50-0p2);
    border-radius: 16px
}

.right-bar li {
    height: 74px;
    overflow: hidden
}

.right-bar li .online {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 88px;
    height: 74px;
    background: var(--c-hex-ff7100);
    border-radius: 16px;
    border: 2px solid var(--c-hex-ffffff);
    box-shadow: 0px 0px 3px 1px var(--c-rgba-0-0-0-0p1)
}

.right-bar li .msg {
    width: 56px;
    height: 62px;
    margin: 8px auto;
    background: url(../images/fixedbar.png) -19px -120px no-repeat;
    animation: kfmsg 2s linear infinite alternate;
    background-size: 170%
}

.right-bar li i,
.right-bar li span {
    display: block;
    height: 74px;
    line-height: 1.3
}

.right-bar li .move-top {
    position: relative;
    z-index: 8;
    transition: .3s;
    color: var(--c-hex-666666)
}

.right-bar li .move-top span {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.right-bar li .tel {
    background: url(../images/rightbar.png) 0px -184px no-repeat;
    background-size: 100%
}

.right-bar li .hide-menu {
    position: absolute;
    right: -386px;
    top: 74px;
    z-index: 7;
    width: 300px;
    transition: .3s;
    text-align: center;
    background: var(--c-hex-ffffff);
    box-shadow: 0px 3px 16px 1px var(--c-rgba-0-0-0-0p16);
    border-radius: 20px;
    padding: 0 20px;
    color: var(--c-hex-666666)
}

.right-bar li .hide-menu .item {
    height: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1px;
    box-sizing: border-box
}

.right-bar li .hide-menu .item .tel {
    width: 34px;
    height: 34px;
    background: url(../images/rightTel.png) no-repeat center center;
    background-size: 100%
}

.right-bar li .hide-menu .item .qq {
    width: 34px;
    height: 34px;
    background: url(../images/rightQq.png) no-repeat center center;
    background-size: 100%
}

.right-bar li .hide-menu .item .time {
    width: 34px;
    height: 34px;
    background: url(../images/rightTime.png) no-repeat center center;
    background-size: 100%
}

.right-bar li .hide-menu .item p {
    font-size: 16px;
    text-align: left;
    display: flex;
    align-items: center
}

.right-bar li .hide-menu .item p:nth-of-type(2) {
    margin-top: 4px
}

.right-bar li .hide-menu2 {
    position: absolute;
    right: -486px;
    top: 74px;
    z-index: 7;
    display: flex;
    background: var(--c-hex-ffffff);
    padding: 8px;
    box-sizing: border-box;
    border-radius: 20px;
    box-shadow: 0 0 6px 1px var(--c-rgba-0-0-0-0p15);
    transition: .3s;
    color: var(--c-hex-666666)
}

.right-bar li .hide-menu2 img {
    border-radius: 12px;
    border: 1px solid var(--c-hex-ffa433)
}

.right-bar li .hide-menu3 {
    top: 0
}

.right-bar li a {
    text-align: center;
    display: block;
    color: var(--c-hex-ff7100);
    font-size: 16px
}

.right-bar li .wx {
    background: url(../images/rightbar.png) 2px -252px no-repeat;
    background-size: 100%
}

.right-bar li .top {
    background: url(../images/rightbar.png) 2px -324px no-repeat;
    background-size: 100%
}

.right-bar .bt {
    border-top: 1px dashed var(--c-hex-e5e5e5)
}

@media (max-width: 1200px) {
    .right-bar {
        display: none
    }
}

@media (min-width: 1200px) {
    .right-bar li .online:hover {
        background: var(--c-hex-ffa433)
    }

    .right-bar li .online:hover .msg {
        background-position: -19px -30px
    }

    .right-bar li .move-top:hover {
        transform: translate3d(0, -74px, 0)
    }

    .right-bar .move-left:hover .hide-menu {
        transform: translate3d(-486px, 0, 0)
    }

    .right-bar .move-left:hover .hide-menu2 {
        transform: translate3d(-586px, 0, 0)
    }
}


/* 新增导航下拉样式2024年12月2日 */

/* 清除默认的列表样式 */
.normal-list ul {
    width: 150px;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

/* 设置列表项的样式 */
.normal-list li {
    /* background-color: var(--c-hex-f4f4f4); */
    margin: 10px 0;
    border-radius: 5px;
    overflow: hidden;
    text-align: center;
}

/* 设置链接的样式 */
.normal-list li a {
    display: block;
    padding: 15px 20px;
    text-decoration: none;
    color: var(--c-hex-333333);
    font-family: Arial, sans-serif;
    font-size: 16px;
    transition: background-color 0.3s, color 0.3s;
}

/* 设置悬停效果 */
.normal-list li a:hover {
    background-color: var(--c-hex-007bff);
    color: white;
}

/* 可选：为列表项添加阴影 */
.normal-list li:hover {
    box-shadow: 0 4px 8px var(--c-rgba-0-0-0-0p1);
}

*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* 全局重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Microsoft Yahei", sans-serif;
}

a {
    text-decoration: none;
    color: #333;
}

ul {
    list-style: none;
}

/* 顶部头部样式（统一为notice头部） */
.top-header {
    height: 80px;
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}

.header-container {
    width: 1200px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo a {
    font-size: 24px;
    font-weight: bold;
    color: var(--color-primary);
}

.top-nav ul {
    display: flex;
}

.top-nav li {
    margin-left: 30px;
}

.top-nav li a {
    font-size: 16px;
    transition: color 0.3s;
}

.top-nav li a:hover {
    color: var(--color-primary-hover);
}

/* 中间导航样式 */
.middle-nav {
    margin-top: 80px;
    height: 60px;
    background-color: var(--color-primary);
}

.nav-container {
    width: 1200px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav-list {
    display: flex;
}

.nav-item {
    margin-right: 25px;
}

.nav-item a {
    color: #fff;
    font-size: 16px;
}

.search-box {
    display: flex;
    align-items: center;
}

.search-box input {
    height: 36px;
    width: 200px;
    padding: 0 10px;
    border: none;
    border-radius: 4px 0 0 4px;
    outline: none;
}

.search-box button {
    height: 36px;
    width: 80px;
    background-color: #fff;
    color: var(--color-primary);
    border: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
}

/* 底部样式 */
.footer {
    background-color: #f5f5f5;
    padding: 40px 0;
    margin-top: 50px;
}

.footer-container {
    width: 1200px;
    margin: 0 auto;
    text-align: center;
}

.footer-links {
    margin-bottom: 20px;
}

.footer-links a {
    margin: 0 15px;
    font-size: 14px;
    color: #666;
}

.copyright {
    font-size: 12px;
    color: #999;
}

/* 页面主体容器（通用） */
.main-container {
    width: 1200px;
    margin: 20px auto;
    padding-top: 20px;
}

.flex{
    display: flex;
}
.flex-jc{
    justify-content: center;
}
.flex-ac{
    align-items: center;
}
.flex-sb{
    justify-content: space-between;
}

mt-10{
    margin-top: 10px;
}
mb-10{
    margin-bottom: 10px;
}

/* 顶部卡券回收导航下拉 */
.top-recycle-nav{position:relative!important}
.top-recycle-nav--inline{display:inline-flex;align-items:center;height:100%}
.top-recycle-nav>.top-recycle-dropdown{position:absolute;top:calc(100% + 10px);left:50%;z-index:10000;width:532px;padding:10px 10px 9px;background:#fff;border:1px solid #eef1f5;border-radius:0 0 12px 12px;box-shadow:0 16px 36px rgba(15,23,42,.14);opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) translateY(10px);transition:opacity .18s ease,visibility .18s ease,transform .18s ease;box-sizing:border-box}
.top-recycle-nav>.top-recycle-dropdown:before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.top-recycle-nav:hover>.top-recycle-dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.top-recycle-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 11px}
.top-recycle-nav .top-recycle-dropdown a.top-recycle-card{display:flex!important;align-items:center!important;justify-content:space-between!important;width:auto!important;height:62px!important;min-width:0!important;margin:0!important;padding:10px 12px!important;border:0!important;border-radius:8px!important;text-decoration:none!important;overflow:hidden;box-shadow:none!important;transform:none!important;box-sizing:border-box}
.top-recycle-card:nth-child(8n+1){background:linear-gradient(135deg,#d9e8ff 0%,#cbc5ff 100%)}
.top-recycle-card:nth-child(8n+2){background:linear-gradient(135deg,#ffd8f1 0%,#fb8de1 100%)}
.top-recycle-card:nth-child(8n+3){background:linear-gradient(135deg,#c9ecff 0%,#6fc8ff 100%)}
.top-recycle-card:nth-child(8n+4){background:linear-gradient(135deg,#b7f6d4 0%,#79e4ba 100%)}
.top-recycle-card:nth-child(8n+5){background:linear-gradient(135deg,#ffc8c8 0%,#ff8d8a 100%)}
.top-recycle-card:nth-child(8n+6){background:linear-gradient(135deg,#9ff4e4 0%,#42ddbd 100%)}
.top-recycle-card:nth-child(8n+7){background:linear-gradient(135deg,#ffc3b4 0%,#ff8f73 100%)}
.top-recycle-card:nth-child(8n+8){background:linear-gradient(135deg,#ffe69a 0%,#ffc85d 100%)}
.top-recycle-card__copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}
.top-recycle-card__copy strong{display:block;max-width:70px;color:#2269ff!important;font-size:16px!important;line-height:1.1!important;font-weight:800!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-recycle-card:nth-child(8n+2) .top-recycle-card__copy strong,.top-recycle-card:nth-child(8n+5) .top-recycle-card__copy strong,.top-recycle-card:nth-child(8n+7) .top-recycle-card__copy strong{color:#ff4a37!important}
.top-recycle-card:nth-child(8n+4) .top-recycle-card__copy strong,.top-recycle-card:nth-child(8n+6) .top-recycle-card__copy strong{color:#10b981!important}
.top-recycle-card:nth-child(8n+8) .top-recycle-card__copy strong{color:#ff8a00!important}
.top-recycle-card__copy em{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;background:rgba(34,105,255,.56);color:#fff!important;font-size:12px!important;line-height:20px!important;font-style:normal!important;font-weight:700!important;white-space:nowrap}
.top-recycle-card:nth-child(8n+2) .top-recycle-card__copy em{background:rgba(255,74,185,.58)}
.top-recycle-card:nth-child(8n+3) .top-recycle-card__copy em{background:rgba(28,154,238,.58)}
.top-recycle-card:nth-child(8n+4) .top-recycle-card__copy em{background:rgba(16,185,129,.58)}
.top-recycle-card:nth-child(8n+5) .top-recycle-card__copy em{background:rgba(255,83,65,.58)}
.top-recycle-card:nth-child(8n+6) .top-recycle-card__copy em{background:rgba(14,184,154,.58)}
.top-recycle-card:nth-child(8n+7) .top-recycle-card__copy em{background:rgba(255,104,78,.58)}
.top-recycle-card:nth-child(8n+8) .top-recycle-card__copy em{background:rgba(255,160,24,.58)}
.top-recycle-card__icon{position:relative;z-index:1;width:42px!important;height:42px!important;margin:0!important;object-fit:contain!important;flex:0 0 auto;filter:drop-shadow(0 8px 10px rgba(0,0,0,.12))}
.top-recycle-hot{display:flex;align-items:center;gap:0;margin-top:10px;padding:7px 2px 0;border-top:1px solid #e5e7eb;color:#525b66;font-size:12px;line-height:22px;white-space:nowrap;overflow:hidden}
.top-recycle-hot strong{display:inline-flex;align-items:center;flex:0 0 auto;height:22px;margin:0 10px 0 0;padding:0;color:#3f4650;font-weight:700;font-size:12px;line-height:22px}
.top-recycle-hot__list{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0;height:22px;line-height:22px;overflow:hidden}
.top-recycle-nav .top-recycle-hot a{display:inline-flex!important;align-items:center!important;flex:0 0 auto!important;width:auto!important;height:22px!important;min-width:0!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;color:#525b66!important;font-size:12px!important;line-height:22px!important;font-weight:400!important;text-decoration:none!important;transform:none!important;box-shadow:none!important}
.top-recycle-nav .top-recycle-hot a:hover{color:#ff6a2a!important}
@media (max-width:768px){.top-recycle-nav>.top-recycle-dropdown{display:none!important}}
