.vigorous-shake {
    -webkit-animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both;
    -moz-animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both;
    -o-animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both;
    animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both
}

@-webkit-keyframes vigorousShake {

    0%,
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

@-moz-keyframes vigorousShake {

    0%,
    100% {
        -moz-transform: translateX(0);
        transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -moz-transform: translateX(-10px);
        transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
        -moz-transform: translateX(10px);
        transform: translateX(10px)
    }
}

@-o-keyframes vigorousShake {

    0%,
    100% {
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -o-transform: translateX(-10px);
        transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
        -o-transform: translateX(10px);
        transform: translateX(10px)
    }
}

@keyframes vigorousShake {

    0%,
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-10px);
        -moz-transform: translateX(-10px);
        -o-transform: translateX(-10px);
        transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(10px);
        -moz-transform: translateX(10px);
        -o-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.fz12 {
    font-size: .24rem
}

@media (min-width:750px) {
    .fz12 {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.fz14 {
    font-size: .28rem
}

@media (min-width:750px) {
    .fz14 {
        font-size: clamp(14px, .7292vw, 18px)
    }
}

.fz16 {
    font-size: .32rem
}

@media (min-width:750px) {
    .fz16 {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.fz18 {
    font-size: .36rem
}

@media (min-width:750px) {
    .fz18 {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.fz20 {
    font-size: .4rem
}

@media (min-width:750px) {
    .fz20 {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

.fz22 {
    font-size: .44rem
}

@media (min-width:750px) {
    .fz22 {
        font-size: clamp(22px, 1.1458vw, 26px)
    }
}

.fz24 {
    font-size: .48rem
}

@media (min-width:750px) {
    .fz24 {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

.fz26 {
    font-size: .52rem
}

@media (min-width:750px) {
    .fz26 {
        font-size: clamp(26px, 1.3542vw, 30px)
    }
}

.fz28 {
    font-size: .56rem
}

@media (min-width:750px) {
    .fz28 {
        font-size: clamp(28px, 1.4583vw, 32px)
    }
}

.fz32 {
    font-size: .64rem
}

@media (min-width:750px) {
    .fz32 {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

.fz36 {
    font-size: .72rem
}

@media (min-width:750px) {
    .fz36 {
        font-size: clamp(36px, 1.875vw, 40px)
    }
}

.fz45 {
    font-size: .9rem
}

@media (min-width:750px) {
    .fz45 {
        font-size: clamp(45px, 2.34375vw, 50px)
    }
}

.fz50 {
    font-size: 1rem
}

@media (min-width:750px) {
    .fz50 {
        font-size: clamp(50px, 2.6vw, 56px)
    }
}

.fz60 {
    font-size: 1.2rem
}

@media (min-width:750px) {
    .fz60 {
        font-size: clamp(60px, 3.125vw, 66px)
    }
}

:root {
    --clr-green: #00ffd1;
    --clr-orange: #ff6000;
    --header-height: max(13.33333333vw, 50px)
}

@media (min-width:750px) {
    :root {
        --header-height: 88px
    }
}

@media (min-width:1920px) {
    :root {
        --header-height: 4.58333vw
    }
}

@media (min-width:2465px) {
    :root {
        --header-height: 113px
    }
}

html {
    font-size: 50px;
    font-size: max(13.33333333vw, 50px)
}

@media (min-width:750px) {
    html {
        font-size: 100px
    }
}

body {
    font-family: "PingFang SC", "Lantinghei SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", "Hiragino Sans GB", '微软雅黑', STHeiti, "WenQuanYi Micro Hei", Arial, SimSun, sans-serif;
    font-size: .28rem;
    line-height: 1.42857143em;
    background-color: #181a1e
}

@media (min-width:750px) {
    body {
        font-size: clamp(14px, .7292vw, 18px)
    }
}

body.popup-open {
    overflow: hidden
}

body,
div,
p,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
li,
blockquote {
    margin: 0;
    padding: 0
}

input,
button,
select,
textarea,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: normal
}

input,
button,
select,
textarea {
    outline: none
}

input:focus::-webkit-input-placeholder,
button:focus::-webkit-input-placeholder,
select:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {
    color: transparent
}

input:focus::-moz-placeholder,
button:focus::-moz-placeholder,
select:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {
    color: transparent
}

input:focus::-ms-input-placeholder,
button:focus::-ms-input-placeholder,
select:focus::-ms-input-placeholder,
textarea:focus::-ms-input-placeholder {
    color: transparent
}

input:focus::placeholder,
button:focus::placeholder,
select:focus::placeholder,
textarea:focus::placeholder {
    color: transparent
}

ul,
ol,
li {
    list-style: none
}

em,
i {
    font-style: normal
}

a {
    text-decoration: none
}

video,
img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
    margin: 0;
    display: block;
    width: auto;
    height: auto;
    line-height: 1;
    font-size: inherit
}

.app {
    padding-bottom: 4.28571429em
}

@media (min-width:750px) {
    .app {
        padding-bottom: 0
    }
}

.verification-code-input .code-inputs-container {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: .35714286em;
    margin-bottom: 2.14285714em
}

.verification-code-input .code-input {
    font-size: .32rem;
    display: block;
    border: 1px solid #ffffff1a;
    background: #2c2d3699;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 3em;
    height: 3em;
    line-height: 3em;
    text-align: center;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase
}

@media (min-width:750px) {
    .verification-code-input .code-input {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.verification-code-input .code-input:focus {
    outline: none;
    border-color: #00ffd1;
    color: #00ffd1;
    background: #2c2d3666
}

.v-textarea {
    cursor: text;
    word-break: break-all
}

@media (min-width:750px) {
    .hide-pc {
        display: none
    }
}

@media (max-width:749.5px) {
    .hide-mob {
        display: none
    }
}

canvas {
    display: block
}

@media (max-width:749.5px) {
    canvas {
        max-width: 100%;
        width: 100% !important;
        height: auto !important
    }
}

.btn {
    position: relative;
    display: block;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

@media (min-width:750px) {
    .btn {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.btn.btn-has-border {
    border: 1px solid transparent
}

.item-labels {
    height: 26px;
    margin-bottom: 10px;
}

.btn .btn-content {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    text-decoration: none;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    gap: .05rem
}

@media (min-width:750px) {
    .btn .btn-content {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.btn-label {
    cursor: default;
    pointer-events: none
}

@media (min-width:1000px) {
    .btn-bg-trans {
        position: relative;
        overflow: hidden
    }

    .btn-bg-trans .btn-content {
        position: relative;
        z-index: 1
    }

    .btn-bg-trans::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: -1px;
        left: -1px;
        z-index: 0;
        opacity: 0;
        -webkit-transition: opacity 100ms ease-in-out, background-position 400ms ease-in-out;
        -o-transition: opacity 100ms ease-in-out, background-position 400ms ease-in-out;
        -moz-transition: opacity 100ms ease-in-out, background-position 400ms ease-in-out;
        transition: opacity 100ms ease-in-out, background-position 400ms ease-in-out;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        padding: 1px
    }
}

@media (hover:hover) and (pointer:fine) {
    .btn-bg-trans:hover::before {
        background: -webkit-gradient(linear, left top, right top, from(#C0FF81), color-stop(#00FFD1), color-stop(#C0FF81), to(#00FFD1));
        background: -webkit-linear-gradient(left, #C0FF81, #00FFD1, #C0FF81, #00FFD1);
        background: -moz- oldlinear-gradient(left, #C0FF81, #00FFD1, #C0FF81, #00FFD1);
        background: -o-linear-gradient(left, #C0FF81, #00FFD1, #C0FF81, #00FFD1);
        background: linear-gradient(to right, #C0FF81, #00FFD1, #C0FF81, #00FFD1);
        -webkit-background-size: 300% 100%;
        -moz-background-size: 300% 100%;
        -o-background-size: 300% 100%;
        background-size: 300% 100%;
        opacity: 1;
        background-position: 100% 0
    }
}

.thumb {
    display: block;
    overflow: hidden;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s;
    position: relative;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 100%
}

.thumb-img img {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s
}

.thumb-pos-top {
    background-position: center top
}

.thumb-pos-top img {
    -o-object-position: center top;
    object-position: center top
}

.thumb-pos-bottom {
    background-position: center bottom
}

.thumb-pos-bottom img {
    -o-object-position: center bottom;
    object-position: center bottom
}

.avatar {
    display: block;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    overflow: hidden
}

.avatar .thumb {
    padding-top: 100%
}

.thumb-has-mask {
    position: relative
}

.thumb-has-mask::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.15);
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s
}

@media (hover:hover) and (pointer:fine) {
    .thumb-has-mask:hover::after {
        background: transparent
    }
}

.highlight {
    position: relative;
    display: inline-block;
    line-height: 1
}

.highlight::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 60%;
    background-color: #0CAB91
}

.highlight .txt {
    position: relative;
    color: #DDDEDF
}

.mark-black {
    position: relative
}

.mark-black::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.15)
}

.mark-black:hover::after {
    display: none
}

.error-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.42857143em
}

.error-content .cover {
    max-width: 860px
}

.error-content .error-title {
    color: #00fad1
}

.error-content .error-title .title {
    font-size: .52rem
}

@media (min-width:750px) {
    .error-content .error-title .title {
        font-size: clamp(26px, 1.3542vw, 30px)
    }
}

@media (min-width:750px) {
    .error-content .error-title .title {
        font-size: 214.28571429%
    }
}

.error-content .error-subtitle {
    color: #b1b2b4;
    max-width: 26em;
    text-align: center;
    line-height: 1.85714286em
}

.error-content .error-subtitle .title {
    font-size: .32rem
}

@media (min-width:750px) {
    .error-content .error-subtitle .title {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.error-content .btn {
    background: #00ffd1;
    color: #000;
    line-height: 3.42857143em;
    padding: 0 4.28571429em
}

.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.f-items {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.f-items .f-box {
    width: 100%;
    height: 100%
}

.f-item {
    min-width: 0;
    min-height: 0
}

.flex,
.f-item,
.f-box {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.oh {
    overflow: hidden
}

.container {
    position: relative;
    padding: 0 .2rem;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto
}

@media (min-width:750px) {
    .container {
        padding: 0 .15rem;
        max-width: clamp(1570px, 81.77vw, 100%)
    }
}

.page-content {
    padding-top: var(--header-height);
    padding-bottom: 1.07142857em
}

@media (min-width:750px) {
    .page-content {
        padding-bottom: .8rem
    }
}

@media (min-width:750px) {
    .flex-row {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -moz-box-orient: horizontal;
        -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
    }

    .flex-row .l-container {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        width: clamp(200px, 12.5vw, 100%)
    }

    .flex-row .r-container {
        position: relative;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }
}

.footer-container {
    margin: 0 .3rem
}

@media (min-width:1330px) {
    .footer-container {
        margin: 0 1.2rem
    }
}

.c-2-3 {
    width: 66.66666667%
}

.c-1-3 {
    width: 33.33333333%
}

.c-1-2 {
    width: 50%
}

.c-1-1 {
    width: 100%
}

.f-3>.f-item {
    width: 33.33333333%
}

.f-2>.f-item {
    width: 50%
}

.f-1>.f-item {
    width: 100%
}

@media (min-width:750px) {
    .sm\:c-2-3 {
        width: 66.66666667%
    }

    .sm\:c-1-3 {
        width: 33.33333333%
    }

    .sm\:c-1-2 {
        width: 50%
    }

    .sm\:c-1-1 {
        width: 100%
    }

    .sm\:f-3>.f-item {
        width: 33.33333333%
    }

    .sm\:f-2>.f-item {
        width: 50%
    }

    .sm\:f-1>.f-item {
        width: 100%
    }
}

@media (min-width:1000px) {
    .md\:c-3-4 {
        width: 75%
    }

    .md\:c-2-4 {
        width: 50%
    }

    .md\:c-1-4 {
        width: 25%
    }

    .md\:c-2-3 {
        width: 66.66666667%
    }

    .md\:c-1-3 {
        width: 33.33333333%
    }

    .md\:c-1-2 {
        width: 50%
    }

    .md\:c-1-1 {
        width: 100%
    }

    .md\:f-4>.f-item {
        width: 25%
    }

    .md\:f-3>.f-item {
        width: 33.33333333%
    }

    .md\:f-2>.f-item {
        width: 50%
    }

    .md\:f-1>.f-item {
        width: 100%
    }
}

@media (min-width:1330px) {
    .lg\:c-4-5 {
        width: 80%
    }

    .lg\:c-3-5 {
        width: 60%
    }

    .lg\:c-2-5 {
        width: 40%
    }

    .lg\:c-1-5 {
        width: 20%
    }

    .lg\:c-3-4 {
        width: 75%
    }

    .lg\:c-2-4 {
        width: 50%
    }

    .lg\:c-1-4 {
        width: 25%
    }

    .lg\:c-2-3 {
        width: 66.66666667%
    }

    .lg\:c-1-3 {
        width: 33.33333333%
    }

    .lg\:c-1-2 {
        width: 50%
    }

    .lg\:c-1-1 {
        width: 100%
    }

    .lg\:f-5>.f-item {
        width: 20%
    }

    .lg\:f-4>.f-item {
        width: 25%
    }

    .lg\:f-3>.f-item {
        width: 33.33333333%
    }

    .lg\:f-2>.f-item {
        width: 50%
    }

    .lg\:f-1>.f-item {
        width: 100%
    }
}

@media (min-width:1660px) {
    .xl\:c-4-5 {
        width: 80%
    }

    .xl\:c-3-5 {
        width: 60%
    }

    .xl\:c-2-5 {
        width: 40%
    }

    .xl\:c-1-5 {
        width: 20%
    }

    .xl\:c-3-4 {
        width: 75%
    }

    .xl\:c-2-4 {
        width: 50%
    }

    .xl\:c-1-4 {
        width: 25%
    }

    .xl\:c-2-3 {
        width: 66.66666667%
    }

    .xl\:c-1-3 {
        width: 33.33333333%
    }

    .xl\:c-1-2 {
        width: 50%
    }

    .xl\:c-1-1 {
        width: 100%
    }

    .xl\:f-5>.f-item {
        width: 20%
    }

    .xl\:f-4>.f-item {
        width: 25%
    }

    .xl\:f-3>.f-item {
        width: 33.33333333%
    }

    .xl\:f-2>.f-item {
        width: 50%
    }

    .xl\:f-1>.f-item {
        width: 100%
    }
}

@media (min-width:1900px) {
    .xxl\:c-4-5 {
        width: 80%
    }

    .xxl\:c-3-5 {
        width: 60%
    }

    .xxl\:c-2-5 {
        width: 40%
    }

    .xxl\:c-1-5 {
        width: 20%
    }

    .xxl\:c-3-4 {
        width: 75%
    }

    .xxl\:c-2-4 {
        width: 50%
    }

    .xxl\:c-1-4 {
        width: 25%
    }

    .xxl\:c-2-3 {
        width: 66.66666667%
    }

    .xxl\:c-1-3 {
        width: 33.33333333%
    }

    .xxl\:c-1-2 {
        width: 50%
    }

    .xxl\:c-1-1 {
        width: 100%
    }

    .xxl\:f-5>.f-item {
        width: 20%
    }

    .xxl\:f-4>.f-item {
        width: 25%
    }

    .xxl\:f-3>.f-item {
        width: 33.33333333%
    }

    .xxl\:f-2>.f-item {
        width: 50%
    }

    .xxl\:f-1>.f-item {
        width: 100%
    }
}

.logo-svg {
    display: block;
    background-color: var(--clr-green);
    -webkit-mask: url('../img/quqi.svg');
    mask: url('../img/quqi.svg');
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    width: 100%;
    padding-top: 62.06896552%
}

.g-slide .list-enter-active,
.g-slide .list-leave-active {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease
}

.g-slide .g-slide-main {
    position: relative;
    width: 100%;
    height: 100%
}

.g-slide .slide-ul {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%
}

.g-slide .g-slide-item {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.g-slide .g-slide-extra {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em
}

.g-slide .g-slide-btns,
.g-slide .g-slide-indexes {
    display: block
}

.g-slide .g-slide-indexes {
    background: rgba(55, 55, 55, 0.1);
    padding: 0 1.07142857em;
    -webkit-border-radius: 2.28571429em;
    -moz-border-radius: 2.28571429em;
    border-radius: 2.28571429em;
    text-align: center;
    height: 2.28571429em;
    line-height: 2.28571429em;
    overflow: hidden
}

.g-slide .g-slide-indexes ul {
    margin-top: -0.14285714em
}

.g-slide .g-slide-indexes li {
    display: inline-block;
    vertical-align: middle;
    width: 1.14285714em;
    height: .42857143em;
    background-color: rgba(255, 255, 255, 0.3);
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    margin: 0 .14285714em
}

.g-slide .g-slide-indexes li:hover {
    cursor: pointer
}

.g-slide .g-slide-indexes li.current {
    width: 1.71428571em;
    background-color: #fff
}

.g-slide .g-slide-indexes li span {
    display: none
}

.g-slide .g-slide-btns {
    background: rgba(55, 55, 55, 0.15);
    padding: 0 1.14285714em;
    height: 2.28571429em;
    line-height: 2.28571429em;
    -webkit-border-radius: 2.28571429em;
    -moz-border-radius: 2.28571429em;
    border-radius: 2.28571429em;
    text-align: center
}

.g-slide .g-slide-btns li {
    display: inline-block;
    vertical-align: top;
    margin: 0 .14285714em;
    color: rgba(255, 255, 255, 0.3)
}

.g-slide .g-slide-btns li:hover {
    cursor: pointer;
    color: #fff
}

.g-slide .g-slide-btns .icon::before {
    line-height: inherit
}

.g-slide .g-slide-btns .txt {
    display: none
}

.slide-left .list-enter-from {
    -webkit-transform: translate(100%, 0);
    -moz-transform: translate(100%, 0);
    -ms-transform: translate(100%, 0);
    -o-transform: translate(100%, 0);
    transform: translate(100%, 0)
}

.slide-left .list-enter-to {
    -webkit-transform: translate(0);
    -moz-transform: translate(0);
    -ms-transform: translate(0);
    -o-transform: translate(0);
    transform: translate(0)
}

.slide-left .list-leave-to {
    -webkit-transform: translate(-100%, 0);
    -moz-transform: translate(-100%, 0);
    -ms-transform: translate(-100%, 0);
    -o-transform: translate(-100%, 0);
    transform: translate(-100%, 0)
}

.slide-left.reverse .list-enter-from {
    -webkit-transform: translate(-100%, 0);
    -moz-transform: translate(-100%, 0);
    -ms-transform: translate(-100%, 0);
    -o-transform: translate(-100%, 0);
    transform: translate(-100%, 0)
}

.slide-left.reverse .list-leave-to {
    -webkit-transform: translate(100%, 0);
    -moz-transform: translate(100%, 0);
    -ms-transform: translate(100%, 0);
    -o-transform: translate(100%, 0);
    transform: translate(100%, 0)
}

.slide-up .list-enter-from {
    -webkit-transform: translate(0, 100%);
    -moz-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
    -o-transform: translate(0, 100%);
    transform: translate(0, 100%)
}

.slide-up .list-enter-to {
    -webkit-transform: translate(0);
    -moz-transform: translate(0);
    -ms-transform: translate(0);
    -o-transform: translate(0);
    transform: translate(0)
}

.slide-up .list-leave-to {
    -webkit-transform: translate(0, -100%);
    -moz-transform: translate(0, -100%);
    -ms-transform: translate(0, -100%);
    -o-transform: translate(0, -100%);
    transform: translate(0, -100%)
}

.slide-up.reverse .list-enter-from {
    -webkit-transform: translate(0, -100%);
    -moz-transform: translate(0, -100%);
    -ms-transform: translate(0, -100%);
    -o-transform: translate(0, -100%);
    transform: translate(0, -100%)
}

.slide-up.reverse .list-leave-to {
    -webkit-transform: translate(0, 100%);
    -moz-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
    -o-transform: translate(0, 100%);
    transform: translate(0, 100%)
}

.part-crumbs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    color: #ffffff40;
    line-height: .4rem;
    margin-bottom: .2rem
}

.part-crumbs a {
    color: #ffffff40;
    text-decoration: none
}

.part-crumbs a:hover {
    color: #ffffff
}

.part-crumbs .crumbs-item::after {
    content: ">";
    margin: 0 .05rem
}

.part-crumbs .crumbs-item:last-child::after {
    display: none
}

@media (max-width:749.5px) {
    .part-crumbs {
        padding-top: .2rem
    }
}

.part-pages {
    margin-top: .4rem;
    margin-bottom: .4rem
}

.part-pages .pages-count {
    display: block;
    text-align: center;
    color: #ffffffa6;
    line-height: 1.85714286em
}

@media (min-width:750px) {
    .part-pages .pages-count {
        display: none
    }
}

.part-pages .nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .71428571em
}

.part-pages .nav .nav-item {
    display: none
}

@media (min-width:1000px) {
    .part-pages .nav .nav-item {
        display: block
    }
}

.part-pages .nav .nav-item a {
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    display: block;
    border: 1px solid #23252d;
    background: #202229;
    color: #ffffffa6;
    min-width: 2.71428571em;
    padding: 0 1.78571429em;
    line-height: 3.42857143em;
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

@media (hover:hover) and (pointer:fine) {
    .part-pages .nav .nav-item a:hover {
        border-color: #00ffd1;
        color: #00ffd1
    }
}

.part-pages .nav .fy-prev,
.part-pages .nav .fy-next,
.part-pages .nav .go-page {
    display: block
}

@media (max-width:749.5px) {

    .part-pages .nav .fy-prev,
    .part-pages .nav .fy-next,
    .part-pages .nav .go-page {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        text-align: center
    }
}

.part-pages .nav .active a {
    background: -webkit-gradient(linear, left top, right top, color-stop(2.82%, #00d5d9), color-stop(97.18%, #77f8d3));
    background: -webkit-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: -moz- oldlinear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: -o-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: linear-gradient(90deg, #00d5d9 2.82%, #77f8d3 97.18%);
    color: #000
}

.part-pages .nav .disabled a {
    cursor: default;
    pointer-events: none
}

.part-pages .go-page {
    color: #ffffff73
}

.part-pages .go-page button {
    display: none
}

.part-pages .go-page .txt {
    display: inline-block;
    vertical-align: middle;
    font-size: inherit;
    line-height: 2.57142857em;
    height: 2.57142857em;
    width: 2.71428571em;
    text-align: center;
    border: 1px solid #23252d;
    background: #202229;
    color: #ffffffa6;
    outline: none;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em
}

@media (min-width:750px) {
    .part-pages .go-page .txt {
        line-height: 3.42857143em;
        height: 3.42857143em;
        width: 3.42857143em
    }
}

.part-pages .go-page .txt:focus {
    background-color: #ffffff89;
    color: #333
}

.part-pages .go_em {
    position: relative;
    display: inline-block
}

@media (hover:hover) and (pointer:fine) {
    .part-pages .go_em:hover button {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        cursor: pointer;
        background: -webkit-gradient(linear, left top, right top, color-stop(2.82%, #00d5d9), color-stop(97.18%, #77f8d3));
        background: -webkit-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
        background: -moz- oldlinear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
        background: -o-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
        background: linear-gradient(90deg, #00d5d9 2.82%, #77f8d3 97.18%);
        color: #000;
        -webkit-border-radius: .42857143em;
        -moz-border-radius: .42857143em;
        border-radius: .42857143em;
        font-size: inherit;
        font-family: inherit;
        border: none;
        text-transform: uppercase;
        line-height: 1.57142857em
    }
}

.no-more-pages {
    margin-top: .4rem;
    margin-bottom: .4rem;
    text-align: center
}

.no-more-pages .label {
    display: inline-block;
    text-align: center;
    color: #77F8D3;
    background-color: #202C2C;
    -webkit-border-radius: 2.85714286em;
    -moz-border-radius: 2.85714286em;
    border-radius: 2.85714286em;
    line-height: 2.85714286em;
    padding: 0 1.42857143em
}

.popup-modal .popup {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-modal .popup-mask {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(17, 17, 17, 0.9);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.popup-modal .popup-content {
    max-height: 90vh;
    max-width: 90vw;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative
}

.popup-modal .popup-body {
    overflow-y: auto;
    max-height: 90vh
}

.popup-modal .popup-close {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    width: 2.14285714em;
    height: 2.14285714em;
    right: .71428571em;
    top: .71428571em;
    color: #ffffff85;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s;
    cursor: pointer;
    z-index: 2;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.popup-modal .popup-close .icon {
    display: block;
    font-size: 85.71428571%;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s
}

@media (hover:hover) and (pointer:fine) {
    .popup-modal .popup-close:hover {
        color: #fff;
        background-color: rgba(255, 255, 255, 0.1)
    }

    .popup-modal .popup-close:hover .icon {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg)
    }
}

.popup-login-panel .popup-content {
    max-width: 57.14285714em
}

.popup-login-panel .em {
    color: #00ffd1
}

.popup-login-panel .login_wrap {
    background: #050f18;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    overflow: hidden;
    position: relative;
    margin: 0 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.popup-login-panel .wxlogin-sidebar {
    padding: 5em 2.85714286em 7.14285714em;
    color: #a9a9ad;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: none;
    position: relative
}

@media (min-width:1000px) {
    .popup-login-panel .wxlogin-sidebar {
        display: block
    }
}

.popup-login-panel .wxlogin-sidebar li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 92.85714286%;
    margin-bottom: 1.53846154em;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .76923077em
}

.popup-login-panel .wxlogin-sidebar li .icon {
    color: #00ffd1
}

.popup-login-panel .wxlogin-sidebar li .txt {
    white-space: nowrap
}

.popup-login-panel .wxlogin-sidebar-content {
    position: relative;
    z-index: 2
}

.popup-login-panel .sidebar-bottom {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0
}

.popup-login-panel .sidebar-bottom img {
    width: 100%
}

.popup-login-panel .sidebar-ico {
    margin-bottom: 1.07142857em
}

.popup-login-panel .sidebar-ico img {
    height: 2.85714286em;
    width: 2.85714286em;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.popup-login-panel .sidebar-title {
    font-size: 142.85714286%;
    color: #edf1f1;
    margin-bottom: 1.25em
}

.popup-login-panel .wxlogin-alert {
    border: 1px solid #ffffff0d;
    background: #f9df950d;
    padding: .35714286em 1.07142857em;
    color: #f9df95;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    margin-bottom: 1.42857143em;
    text-align: center
}

.popup-login-panel .wxlogin-alert p {
    font-size: 85.71428571%
}

.popup-login-panel .wxlogin-main {
    -webkit-border-radius: 0 .71428571em .71428571em 0;
    -moz-border-radius: 0 .71428571em .71428571em 0;
    border-radius: 0 .71428571em .71428571em 0;
    padding: 5em 3.57142857em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

@media (min-width:1000px) {
    .popup-login-panel .wxlogin-main {
        background: -webkit-linear-gradient(38.38deg, #1e232f66 56.2%, #1a546666 100.25%);
        background: -moz- oldlinear-gradient(38.38deg, #1e232f66 56.2%, #1a546666 100.25%);
        background: -o-linear-gradient(38.38deg, #1e232f66 56.2%, #1a546666 100.25%);
        background: linear-gradient(51.62deg, #1e232f66 56.2%, #1a546666 100.25%);
        -webkit-backdrop-filter: blur(50px);
        backdrop-filter: blur(50px)
    }
}

.popup-login-panel .wxlogin-main .main-title {
    font-size: 157.14285714%;
    line-height: 1;
    margin-bottom: 1.2em;
    font-weight: normal;
    text-align: center
}

.popup-login-panel .wxlogin-main .main-title span {
    display: none;
    width: 100%;
    text-align: center
}

.popup-login-panel .wxlogin-main .main-title span.current {
    display: block;
    color: #fff
}

.popup-login-panel .wxlogin-main .wmc {
    width: 24em;
    margin: 0 auto
}

.popup-login-panel .wxlogin-main .wmc-ewm {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.popup-login-panel .wxlogin-main .ewm {
    width: 100%;
    max-width: 14.28571429em;
    position: relative;
    background-color: #fff;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    padding: .71428571em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto;
    -webkit-box-shadow: 0 16px 50px 0 rgba(202, 202, 202, 0.2);
    -moz-box-shadow: 0 16px 50px 0 rgba(202, 202, 202, 0.2);
    box-shadow: 0 16px 50px 0 rgba(202, 202, 202, 0.2)
}

.popup-login-panel .wxlogin-main .ewm-img {
    width: 100%
}

.popup-login-panel .wxlogin-main .wmc-other {
    margin-top: 2.14285714em;
    display: none
}

.popup-login-panel .wxlogin-main .wmc-other h3 {
    font-size: inherit;
    font-weight: normal;
    color: #8a8a8a;
    text-align: center;
    position: relative;
    margin-bottom: .71428571em
}

.popup-login-panel .wxlogin-main .wmc-other h3 span {
    display: inline-block;
    background-color: #fbfbfc;
    padding: 0 1em;
    position: relative
}

.popup-login-panel .wxlogin-main .wmc-other h3::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    border-top: 1px solid #f2f2f2
}

.popup-login-panel .wxlogin-main .wc {
    color: #00ffd1
}

.popup-login-panel .wxlogin-main .wmc-other-login {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    line-height: 2.14285714em
}

.popup-login-panel .wxlogin-main .wmc-other-login .ico {
    display: inline-block;
    width: 2.14285714em;
    height: 2.14285714em;
    text-align: center;
    line-height: 2.14285714em;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    color: #fff;
    vertical-align: top;
    margin-right: .5em
}

.popup-login-panel .wxlogin-main .wmc-other-login .icon-wechat-1 {
    background-color: #00dc4b
}

.popup-login-panel .wxlogin-main .wmc-other-login .icon-QQ {
    background-color: #0094ff
}

.popup-login-panel .wxlogin-main .wmc-other-login .wmc-other-qq {
    cursor: pointer
}

.popup-login-panel .wxlogin-main .wmc-other-login .wmc-other-qq:hover {
    color: var(--clr-green)
}

.popup-login-panel .wxlogin-protocol {
    margin-top: 1.42857143em;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    gap: .35714286em
}

.popup-login-panel .wxlogin-protocol a {
    color: #00ffd1
}

.popup-login-panel .wxlogin-protocol .checked {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em
}

.popup-login-panel .wxlogin-protocol .icon {
    color: #00ffd1
}

.popup-login-panel .wxlogin-protocol input {
    display: none
}

.popup-login-panel .wxlogin-comfirm .user-avatar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 1.07142857em
}

.popup-login-panel .wxlogin-comfirm .user-avatar .avatar {
    width: 4.57142857em;
    border: 4px solid #3c3c40
}

.popup-login-panel .wxlogin-comfirm .comfirm-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: .71428571em;
    color: #00ffd1;
    margin-bottom: 1.42857143em
}

.popup-login-panel .wxlogin-comfirm .comfirm-title .icon,
.popup-login-panel .wxlogin-comfirm .comfirm-title .title {
    font-size: 171.42857143%
}

.popup-login-panel .wxlogin-comfirm .comfirm-p {
    text-align: center;
    color: #dddedf;
    line-height: 1.92857143em;
    margin-bottom: 2.14285714em
}

.popup-login-panel .wxlogin-comfirm .comfirm-btns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-login-panel .wxlogin-comfirm .comfirm-btns .btn {
    background: #00ffd1;
    line-height: 3.28571429em;
    color: #000;
    padding: 0 3em
}

@media (hover:hover) and (pointer:fine) {
    .popup-login-panel .wxlogin-comfirm .comfirm-btns .btn:hover {
        background: #00cca7
    }
}

.popup-login-panel .wxlogin-comfirm .comfirm-djs {
    margin-top: 1.07142857em;
    color: #a9a9ad;
    text-align: center
}

.popup-login-panel .wxlogin-comfirm .comfirm-djs .djs {
    color: #00ffd1;
    text-transform: uppercase
}

.popup-login-panel .wxlogin-code .user-avatar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 1.07142857em
}

.popup-login-panel .wxlogin-code .user-avatar .avatar {
    width: 4.57142857em;
    border: 4px solid #3c3c40
}

.popup-login-panel .wxlogin-code .code-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: .71428571em;
    color: #00ffd1;
    margin-bottom: 1.42857143em
}

.popup-login-panel .wxlogin-code .code-title .icon,
.popup-login-panel .wxlogin-code .code-title .title {
    font-size: 171.42857143%
}

.popup-login-panel .wxlogin-code .code-p {
    color: #dddedf;
    line-height: 1.92857143em;
    margin-bottom: 2.14285714em
}

.popup-login-panel .wxlogin-code .code-actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-login-panel .wxlogin-code .code-actions .is-disabled {
    visibility: hidden;
    opacity: 0
}

.popup-login-panel .wxlogin-code .code-actions .btn {
    line-height: 3.28571429em;
    padding: 0 3em;
    border: none
}

.popup-login-panel .wxlogin-code .code-actions .btn-active {
    background: #00ffd1;
    color: #000
}

@media (hover:hover) and (pointer:fine) {
    .popup-login-panel .wxlogin-code .code-actions .btn-active:hover {
        background: #00cca7
    }
}

.popup-login-panel .wxlogin-code .code-actions .btn-disabled {
    background: #2c2d3699;
    color: #666;
    cursor: not-allowed
}

@media (hover:hover) and (pointer:fine) {
    .popup-login-panel .wxlogin-code .code-actions .btn-disabled:hover {
        background: #2c2d3699
    }
}

.popup-login-panel .wxlogin-code .code-actions .is-checking {
    background: #2c2d3699;
    color: #666;
    cursor: not-allowed
}

.popup-login-panel .code-error {
    color: #FF97AF;
    margin-bottom: 1.42857143em
}

.popup-avatar-upload .avatar-upload-wrap {
    background-color: #fff;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    width: 100%;
    position: relative;
    overflow: hidden
}

@media (min-width:750px) {
    .popup-avatar-upload .avatar-upload-wrap {
        width: 42.85714286em;
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.popup-avatar-upload .avatar-upload-wrap.upload-success {
    width: 34.28571429em
}

.popup-avatar-upload .avatar-upload-wrap.upload-success .modal-title {
    display: none
}

.popup-avatar-upload .dragover * {
    pointer-events: none
}

.popup-avatar-upload .dragover::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #ddd;
    opacity: .6
}

.popup-avatar-upload .modal-title {
    padding: 2.14285714em 4em 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.42857143em
}

.popup-avatar-upload .modal-title .title {
    font-size: .36rem;
    color: #3a3a3a
}

@media (min-width:750px) {
    .popup-avatar-upload .modal-title .title {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.popup-avatar-upload .modal-title .subtitle {
    color: #ff5100;
    font-size: .24rem
}

@media (min-width:750px) {
    .popup-avatar-upload .modal-title .subtitle {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.popup-avatar-upload .modal-content {
    padding: 2em 4em 3em;
    color: #8a8a8a;
    line-height: 1.57142857em
}

.popup-avatar-upload .modal-content .form-item {
    margin-bottom: 1em
}

.popup-avatar-upload .modal-content .warning {
    color: #F39C13;
    font-weight: normal;
    text-transform: uppercase
}

.popup-avatar-upload .modal-content .btn {
    width: 10em;
    line-height: 3em
}

.popup-avatar-upload .modal-content .btn-default:hover {
    color: #00ffd1
}

.popup-avatar-upload .avatar-upload-block {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.42857143em;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.popup-avatar-upload .avatar-upload-function {
    margin-bottom: 2.14285714em;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.popup-avatar-upload .avatar-upload-function .warning {
    text-align: center;
    margin-top: 2.14285714em
}

.popup-avatar-upload .avatar-upload-show {
    width: 8.57142857em;
    margin-bottom: 2.14285714em;
    text-align: center;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.popup-avatar-upload .avatar-upload-show .img {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    overflow: hidden;
    margin-bottom: 1em
}

.popup-avatar-upload .avatar-upload-show .img img {
    display: block;
    width: 100%
}

.popup-avatar-upload .avatar-upload-show h5 {
    font-size: 114.28571429%;
    font-weight: normal
}

.popup-avatar-upload .avatar-upload-deal {
    padding-top: 2.14285714em;
    border-top: 1px solid #f7f9fa;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.42857143em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-avatar-upload .alert-error {
    color: #ff5100
}

.popup-avatar-upload .avatar-upload-btns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.42857143em
}

.popup-avatar-upload .avatar-upload-btns .btn {
    width: 8.57142857em;
    line-height: 3em;
    text-align: center
}

.popup-avatar-upload .btn-submit {
    background-color: #00ffd1;
    border: 1px solid #00cca7;
    color: #202228
}

@media (hover:hover) and (pointer:fine) {
    .popup-avatar-upload .btn-submit:hover {
        background-color: #00cca7
    }
}

.popup-avatar-upload .btn-cancel {
    background-color: #f7f9fa;
    border: 1px solid #eee
}

@media (hover:hover) and (pointer:fine) {
    .popup-avatar-upload .btn-cancel:hover {
        background-color: #ff5100;
        border-color: #ff5100;
        color: #fff
    }
}

.popup-avatar-upload .avatar-upload-main {
    position: relative;
    padding-top: 100%
}

.popup-avatar-upload .avatar-upload-main input[type=file] {
    width: 0;
    height: 0;
    visibility: hidden;
    position: absolute;
    left: 0;
    top: 0
}

.popup-avatar-upload .avatar-upload-main .upload-div {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #f6f6f6;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px dashed #ccc;
    cursor: pointer
}

.popup-avatar-upload .avatar-upload-main .upload-div .upload-div-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align: center
}

.popup-avatar-upload .avatar-upload-main .upload-div .plus {
    height: 2.85714286em;
    position: relative;
    margin-bottom: 1.42857143em
}

.popup-avatar-upload .avatar-upload-main .upload-div .plus::after,
.popup-avatar-upload .avatar-upload-main .upload-div .plus::before {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    width: .35714286em;
    height: 2.85714286em;
    background-color: #d8d8d8;
    margin-top: -1.42857143em
}

.popup-avatar-upload .avatar-upload-main .upload-div .plus::after {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

.popup-avatar-upload .avatar-upload-main .upload-div .title {
    color: #b5b5b5;
    font-size: 114.28571429%;
    font-weight: normal
}

.popup-avatar-upload .crop-show-image {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%
}

.popup-avatar-upload .crop-image {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    overflow: hidden
}

.popup-avatar-upload .crop-image::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-image: url(../img/mark.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.popup-avatar-upload .crop-image .grid-row,
.popup-avatar-upload .crop-image .grid-col,
.popup-avatar-upload .crop-image .grid {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.popup-avatar-upload .crop-image .grid {
    border: 1px dashed #fff
}

.popup-avatar-upload .crop-image .grid-row::after,
.popup-avatar-upload .crop-image .grid-col::after,
.popup-avatar-upload .crop-image .grid-row::before,
.popup-avatar-upload .crop-image .grid-col::before {
    content: '';
    display: block;
    position: absolute
}

.popup-avatar-upload .crop-image .grid-col::after,
.popup-avatar-upload .crop-image .grid-col::before {
    top: 0;
    bottom: 0;
    border-left: 1px dashed #fff
}

.popup-avatar-upload .crop-image .grid-col::before {
    left: 33.33333333%
}

.popup-avatar-upload .crop-image .grid-col::after {
    left: 66.66666667%
}

.popup-avatar-upload .crop-image .grid-row::after,
.popup-avatar-upload .crop-image .grid-row::before {
    left: 0;
    right: 0;
    border-top: 1px dashed #fff
}

.popup-avatar-upload .crop-image .grid-row::before {
    top: 33.33333333%
}

.popup-avatar-upload .crop-image .grid-row::after {
    top: 66.66666667%
}

.popup-avatar-upload .crop-image-btns {
    margin-top: .3rem;
    color: #00ffd1;
    position: relative
}

.popup-avatar-upload .crop-image-btns i {
    cursor: pointer
}

.popup-avatar-upload .crop-image-btns i:hover {
    color: #00ffd1
}

.popup-avatar-upload .crop-image-btns .r {
    position: absolute;
    right: 0;
    top: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1em
}

.popup-avatar-upload .crop-image-btns .r-item {
    cursor: pointer;
    color: #d1d1d1
}

.popup-avatar-upload .upload-success .img-upload-success {
    text-align: center
}

.popup-avatar-upload .upload-success .img-upload-success .title {
    font-size: 171.42857143%;
    color: #3a3a3a;
    margin-bottom: .58333333em;
    font-weight: normal
}

.popup-avatar-upload .upload-success .img-upload-success .entry {
    font-size: 114.28571429%;
    color: #8a8a8a;
    margin-bottom: 1.875em
}

.popup-avatar-upload .upload-success .img-upload-success .btns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.42857143em
}

.popup-avatar-upload .upload-success .img-upload-success .btn {
    line-height: 3em;
    padding: 0 .07142857em
}

.popup-avatar-upload .upload-success .img-upload-success .btn-success {
    background-color: #00ffd1;
    color: #202228
}

@media (hover:hover) and (pointer:fine) {
    .popup-avatar-upload .upload-success .img-upload-success .btn-success:hover {
        background-color: #00cca7
    }
}

.popup-avatar-upload .upload-success .us-avatar {
    width: 7.14285714em;
    margin: 1em auto 2.14285714em;
    position: relative
}

.popup-avatar-upload .upload-success .us-avatar .avatar {
    display: block;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    overflow: hidden
}

.popup-avatar-upload .upload-success .us-avatar .avatar .thumb {
    padding-top: 100%
}

.popup-avatar-upload .upload-success .us-avatar .icon {
    color: #00ffd1;
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 171.42857143%
}

@media (max-width:749.5px) {
    .popup-avatar-upload .v-avatar-upload {
        width: 100%
    }

    .popup-avatar-upload .v-avatar-upload.upload-success {
        width: 100%
    }

    .popup-avatar-upload .modal-content {
        padding: 15px
    }

    .popup-avatar-upload .avatar-upload-function {
        float: none;
        width: 100%
    }

    .popup-avatar-upload .avatar-upload-show {
        display: none
    }

    .popup-avatar-upload .avatar-upload-btns {
        white-space: nowrap
    }
}

.popup-submit-success .submit-success {
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    border: 1px solid #ffffff0a;
    background-color: #1f1f23;
    background-image: url(../img/layer-bg.webp);
    background-position: left top;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 4.28571429em 3.57142857em
}

.popup-submit-success .h {
    color: #00ffd1 !important
}

.popup-submit-success .ss-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 1.42857143em;
    gap: 1.42857143em
}

.popup-submit-success .ss-title .ico {
    height: 4.57142857em
}

.popup-submit-success .ss-title .ico img {
    height: 100%;
    width: auto
}

.popup-submit-success .ss-title .title {
    font-size: .64rem;
    color: #00ffd1
}

@media (min-width:750px) {
    .popup-submit-success .ss-title .title {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

.popup-submit-success .ss-p {
    text-align: center;
    color: #ffffffd9;
    font-size: .32rem;
    line-height: 1.875em;
    margin-bottom: 1.875em
}

@media (min-width:750px) {
    .popup-submit-success .ss-p {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.popup-submit-success .ss-p a {
    color: inherit;
    text-decoration: underline
}

.popup-submit-success .contact-card {
    border: 1px solid #ffffff0a;
    background: #2c2d3666;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 2.14285714em 2.85714286em;
    margin-bottom: 2.14285714em
}

.popup-submit-success .contact-card-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4.28571429em
}

.popup-submit-success .card-ewm {
    width: 8.57142857em;
    padding: .71428571em;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    background-color: #fff
}

.popup-submit-success .card-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em;
    color: #dddedf;
    margin-bottom: 1em
}

.popup-submit-success .card-title .title {
    font-size: .32rem
}

@media (min-width:750px) {
    .popup-submit-success .card-title .title {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.popup-submit-success .card-avatar {
    width: 1.71428571em;
    background-color: #fff;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.popup-submit-success .card-desc {
    color: #a9a9ad;
    line-height: 1.78571429em
}

.popup-submit-success .btns {
    text-align: center
}

.popup-submit-success .btns .btn {
    display: inline-block;
    color: #000;
    line-height: 3em;
    padding: 0 2.71428571em;
    background-color: #00ffd1
}

@media (hover:hover) and (pointer:fine) {
    .popup-submit-success .btns .btn:hover {
        background-color: #00cca7
    }
}

.popup-product-standard .product-standard {
    max-width: 1050px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 2.85714286em 1.42857143em 1.42857143em;
    background-color: #fff;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em
}

.popup-product-standard .popup-close {
    top: .42857143em;
    color: #A9A9AD;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s;
    cursor: pointer;
    z-index: 2;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

@media (hover:hover) and (pointer:fine) {
    .popup-product-standard .popup-close:hover {
        color: #a9a9ad;
        background-color: rgba(0, 0, 0, 0.1)
    }
}

.popup-pay-request .pay-request {
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    border: 1px solid #ffffff0a;
    background-color: #1f1f23;
    background-image: url(../img/layer-bg.webp);
    background-position: left top;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 4.28571429em 3.57142857em
}

.popup-pay-request .h {
    color: #00ffd1
}

.popup-pay-request .ss-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 1.42857143em;
    gap: 1.42857143em
}

.popup-pay-request .ss-title .ico {
    height: 4.57142857em
}

.popup-pay-request .ss-title .ico img {
    height: 100%;
    width: auto
}

.popup-pay-request .ss-title .title {
    font-size: .64rem;
    color: #00ffd1
}

@media (min-width:750px) {
    .popup-pay-request .ss-title .title {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

.popup-pay-request .ss-p {
    text-align: center;
    color: #ffffffd9;
    font-size: .32rem;
    line-height: 1.875em;
    margin-bottom: 1.875em
}

@media (min-width:750px) {
    .popup-pay-request .ss-p {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.popup-pay-request .ss-p a {
    color: inherit;
    text-decoration: underline
}

.popup-pay-request .i-step {
    text-transform: uppercase
}

.popup-pay-request .btns {
    text-align: center
}

.popup-pay-request .btns .btn {
    display: inline-block;
    color: #000;
    line-height: 3em;
    padding: 0 2.71428571em;
    background-color: #00ffd1
}

@media (hover:hover) and (pointer:fine) {
    .popup-pay-request .btns .btn:hover {
        background-color: #00cca7
    }
}

.popup-pay-request .pay-ewm {
    border: 1px solid #ffffff0a;
    background: #2c2d3666;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 2.14285714em;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    margin-bottom: 2.14285714em;
    width: 42.85714286em
}

.popup-pay-request .ewm-in {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 2.14285714em
}

.popup-pay-request .ewm-img {
    width: 8.57142857em;
    overflow: hidden;
    position: relative;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em
}

.popup-pay-request .ewm-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px)
}

.popup-pay-request #product_purchase_ewm {
    padding: .71428571em;
    background-color: #fff
}

.popup-pay-request #product_purchase_ewm canvas {
    display: block;
    width: 100% !important;
    height: auto !important
}

.popup-pay-request .ewm-title {
    margin-bottom: 1.71428571em;
    color: #00ffd1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .71428571em
}

.popup-pay-request .ewm-title .price-prefix {
    font-size: 164.28571429%
}

.popup-pay-request .ewm-title .price {
    font-size: 271.42857143%;
    font-weight: bold
}

.popup-pay-request .ewm-title .icon,
.popup-pay-request .ewm-title .title {
    font-size: .56rem;
    font-weight: bold
}

@media (min-width:750px) {

    .popup-pay-request .ewm-title .icon,
    .popup-pay-request .ewm-title .title {
        font-size: clamp(28px, 1.4583vw, 32px)
    }
}

.popup-pay-request .ewm-desc {
    color: #a9a9ad;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.popup-pay-request .ewm-desc a {
    color: #ffb957
}

.popup-pay-request .ewm-desc .txt {
    line-height: 2em
}

.popup-pay-request .ewm-desc .ico {
    background-color: #2ba245;
    -webkit-border-radius: .21428571em;
    -moz-border-radius: .21428571em;
    border-radius: .21428571em;
    color: #fff;
    padding: .21428571em
}

.popup-pay-request .ewm-desc .ico .icon::before {
    font-size: 85.71428571%
}

.popup-pay-request .qrbox {
    display: block;
    position: absolute;
    right: .35714286em;
    left: .35714286em;
    top: .35714286em;
    bottom: .35714286em;
    z-index: 1;
    overflow: hidden
}

.popup-pay-request .qrbox .block {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 96, 0, 0)), color-stop(70%, rgba(255, 96, 0, 0)), color-stop(98%, #0EE9C2), color-stop(98%, #00ffd18a));
    background: -webkit-linear-gradient(top, rgba(255, 96, 0, 0) 0%, rgba(255, 96, 0, 0) 70%, #0EE9C2 98%, #00ffd18a 98%);
    background: -moz- oldlinear-gradient(top, rgba(255, 96, 0, 0) 0%, rgba(255, 96, 0, 0) 70%, #0EE9C2 98%, #00ffd18a 98%);
    background: -o-linear-gradient(top, rgba(255, 96, 0, 0) 0%, rgba(255, 96, 0, 0) 70%, #0EE9C2 98%, #00ffd18a 98%);
    background: linear-gradient(to bottom, rgba(255, 96, 0, 0) 0%, rgba(255, 96, 0, 0) 70%, #0EE9C2 98%, #00ffd18a 98%);
    z-index: 2;
    -webkit-animation: godown 1.5s 2 forwards;
    -moz-animation: godown 1.5s 2 forwards;
    -o-animation: godown 1.5s 2 forwards;
    animation: godown 1.5s 2 forwards
}

@-webkit-keyframes godown {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    100% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

@-moz-keyframes godown {
    0% {
        -moz-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    100% {
        -moz-transform: translateY(100%);
        transform: translateY(100%)
    }
}

@-o-keyframes godown {
    0% {
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    100% {
        -o-transform: translateY(100%);
        transform: translateY(100%)
    }
}

@keyframes godown {
    0% {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    100% {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%)
    }
}

.mob-login-part {
    padding: 1.07142857em;
    padding-top: var(--header-height);
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    min-height: 100vh;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #0f1015
}

.mob-login-part .mob-login-bg {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0
}

.mob-login-part .mob-login-bg img {
    width: 100%
}

.mob-login-part .mob-login-content {
    background: -webkit-linear-gradient(39.05deg, #181c22cc 46.8%, #1b262bcc 100.18%);
    background: -moz- oldlinear-gradient(39.05deg, #181c22cc 46.8%, #1b262bcc 100.18%);
    background: -o-linear-gradient(39.05deg, #181c22cc 46.8%, #1b262bcc 100.18%);
    background: linear-gradient(50.95deg, #181c22cc 46.8%, #1b262bcc 100.18%);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid #ffffff0d;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1.42857143em;
    position: relative
}

.mob-login-part .user-avatar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 1.07142857em
}

.mob-login-part .user-avatar .avatar {
    width: 4.57142857em;
    border: 4px solid #3c3c40
}

.mob-login-part .comfirm-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: .71428571em;
    color: #00ffd1;
    margin-bottom: 1.42857143em
}

.mob-login-part .comfirm-title .icon,
.mob-login-part .comfirm-title .title {
    font-size: 171.42857143%
}

.mob-login-part .comfirm-p {
    text-align: center;
    color: #dddedf;
    line-height: 1.92857143em;
    margin-bottom: 2.14285714em
}

.mob-login-part .comfirm-btns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.mob-login-part .comfirm-btns .btn {
    background: #00ffd1;
    line-height: 3.28571429em;
    color: #000;
    padding: 0 3em
}

@media (hover:hover) and (pointer:fine) {
    .mob-login-part .comfirm-btns .btn:hover {
        background: #00cca7
    }
}

.mob-login-part .comfirm-djs {
    margin-top: 1.07142857em;
    color: #a9a9ad;
    text-align: center
}

.mob-login-part .comfirm-djs .djs {
    color: #00ffd1;
    text-transform: uppercase
}

.zanemoji-modal {
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.zanemoji-modal.show .zan-emoji {
    -webkit-transition: visibility, opacity, -webkit-transform .5s ease;
    transition: visibility, opacity, -webkit-transform .5s ease;
    -o-transition: visibility, opacity, -o-transform .5s ease;
    -moz-transition: visibility, opacity, transform .5s ease, -moz-transform .5s ease;
    transition: visibility, opacity, transform .5s ease;
    transition: visibility, opacity, transform .5s ease, -webkit-transform .5s ease, -moz-transform .5s ease, -o-transform .5s ease;
    -webkit-transform: translate(0, -30px);
    -moz-transform: translate(0, -30px);
    -ms-transform: translate(0, -30px);
    -o-transform: translate(0, -30px);
    transform: translate(0, -30px);
    opacity: 1;
    visibility: visible
}

.zan-emoji {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 1.71428571em;
    -webkit-border-radius: 1.71428571em;
    -moz-border-radius: 1.71428571em;
    border-radius: 1.71428571em;
    background: #fff3b9;
    -webkit-box-shadow: 0 2px 10px #00000014;
    -moz-box-shadow: 0 2px 10px #00000014;
    box-shadow: 0 2px 10px #00000014;
    color: #694400;
    padding-right: .85714286em;
    opacity: .1;
    visibility: hidden;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zan-emoji .emoji {
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    height: 1.71428571em;
    width: 1.71428571em
}

.zan-emoji .emoji img {
    display: block;
    height: 100%;
    width: 100%;
    -webkit-animation: zan-emoji .5s infinite;
    -moz-animation: zan-emoji .5s infinite;
    -o-animation: zan-emoji .5s infinite;
    animation: zan-emoji .5s infinite
}

.zan-emoji .zan-txt {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0 .14285714em 0 .42857143em
}

.zan-emoji .zan-txt .txt {
    font-size: 85.71428571%;
    display: block;
    white-space: nowrap
}

.zan-emoji .zan-plus .ico {
    font-size: 85.71428571%
}

@-webkit-keyframes zan-emoji {
    0% {
        -webkit-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }

    50% {
        -webkit-transform: translate(3px, 0);
        transform: translate(3px, 0)
    }

    100% {
        -webkit-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }
}

@-moz-keyframes zan-emoji {
    0% {
        -moz-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }

    50% {
        -moz-transform: translate(3px, 0);
        transform: translate(3px, 0)
    }

    100% {
        -moz-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }
}

@-o-keyframes zan-emoji {
    0% {
        -o-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }

    50% {
        -o-transform: translate(3px, 0);
        transform: translate(3px, 0)
    }

    100% {
        -o-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }
}

@keyframes zan-emoji {
    0% {
        -webkit-transform: translate(-3px, 0);
        -moz-transform: translate(-3px, 0);
        -o-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }

    50% {
        -webkit-transform: translate(3px, 0);
        -moz-transform: translate(3px, 0);
        -o-transform: translate(3px, 0);
        transform: translate(3px, 0)
    }

    100% {
        -webkit-transform: translate(-3px, 0);
        -moz-transform: translate(-3px, 0);
        -o-transform: translate(-3px, 0);
        transform: translate(-3px, 0)
    }
}

.header-logo {
    width: 7.85714286em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

@media (min-width:750px) {
    .header-logo {
        width: 100%;
        padding: 0 1.42857143em
    }
}

.header-logo .logo img {
    width: 100%
}

.header-logo .logo-text {
    display: none
}

.header-title {
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: none
}

@media (min-width:1000px) {
    .header-title {
        display: block
    }
}

.header-title .btn {
    height: 3.42857143em;
    line-height: 3.42857143em;
    border-color: #252833;
    background: #1d1f26
}

.header-title .btn .btn-content {
    color: #dcdddd;
    padding: 0 1.14285714em;
    gap: .28571429em
}

.header-title .btn .icon {
    color: #00ffd1
}

.header-title .btn .icon::before {
    font-size: .4rem
}

@media (min-width:750px) {
    .header-title .btn .icon::before {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

.header-title .btn .title {
    line-height: 1.85714286em;
    height: 1.85714286em
}

.header-title .btn .title .slide-up {
    width: 5em;
    height: 100%
}

@media (max-width:749.5px) {
    .header-title .btn {
        height: .5rem;
        line-height: .48rem
    }

    .header-title .btn .btn-content {
        padding: 0 .15rem
    }

    .header-title .btn .icon {
        margin-right: .1rem
    }

    .header-title .btn .icon::before {
        font-size: .2rem
    }

    .header-title .btn .title {
        font-size: .2rem
    }
}

.header-search {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 48px;
}

.header-search .search-form {
    position: relative
}

.header-search .search-ip {
    position: absolute;
    left: 1.07142857em;
    bottom: 0;
    width: 2.14285714em
}

.header-search .search-ip img {
    width: 100%
}

.header-search .search-btn {
    outline: none;
    border: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0
}

@media (min-width:750px) {
    .header-search .search-btn {
        right: 0;
        -webkit-border-radius: 0 .71428571em .71428571em 0;
        -moz-border-radius: 0 .71428571em .71428571em 0;
        border-radius: 0 .71428571em .71428571em 0;
        background: #00ffd1;
        color: #181a1e;
        height: 3.42857143em;
        width: 9.28571429em
    }

    .header-search .search-btn .icon {
        margin-right: .42857143em
    }
}

.header-search .s {
    display: block;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #ffffff0d;
    background: #1d1f26;
    color: #ffffff80;
    outline: none;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em
}

@media (min-width:750px) {
    .header-search .s {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.header-search .s:focus {
    border-color: #00ffd1;
    color: #fff
}

@media (min-width:750px) {
    .header-search .s {
        height: 3.42857143em;
        line-height: 1.42857143em;
        padding: 1em 10.71428571em 1em 0.5em
    }
}

@media (max-width:749.5px) {
    .header-search .search-ip {
        display: none
    }

    .header-search .search-btn {
        left: .28571429em;
        background-color: transparent;
        color: #C5C7D5
    }

    .header-search .search-btn .txt {
        display: none
    }

    .header-search .search-btn .icon::before {
        font-size: .24rem
    }

    .header-search .s {
        font-size: .24rem;
        line-height: 1.5em;
        padding: .1rem .1rem .1rem .5rem
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .header-search .search-btn .icon::before {
        font-size: clamp(12px, .625vw, 14px)
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .header-search .s {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.header-btns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .2rem
}

.header-btns .btn {
    height: 3.42857143em;
    width: 9.85714286em;
    border: 1px solid #ffffff05;
    background: #282931;
    color: #bcbdbe
}

.header-btns .btn .icon {
    margin-right: .06rem
}

@media (hover:hover) and (pointer:fine) {
    .header-btns .btn:hover {
        border-color: #00ffd1;
        color: #00ffd1
    }
}

.header-btns .product-submit-btn .btn {
    border-color: #f9e3c6;
    color: #fde2c2
}

@media (hover:hover) and (pointer:fine) {
    .header-btns .product-submit-btn .btn:hover {
        border-color: #00ffd1;
        color: #00ffd1
    }
}

.header-btns .user-has-login {
    display: block;
    width: 3.42857143em;
    padding: .21428571em;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    overflow: hidden
}

.header-btns .login-btn {
    position: relative
}

.header-btns .login-btn.show-sub-menu .sub-menu {
    display: block
}

@media (hover:hover) and (pointer:fine) {
    .header-btns .login-btn:hover .sub-menu {
        display: block
    }
}

.header-btns .login-btn .sub-menu {
    position: absolute;
    right: 0;
    top: 100%;
    padding-top: .71428571em;
    display: none
}

.header-btns .login-btn .sub-menu-wrap {
    border: 1px solid #ffffff0a;
    background: #2e2e34;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1.07142857em 1.42857143em
}

@media (min-width:750px) {
    .header-btns .login-btn .sub-menu-wrap {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.header-btns .login-btn .sub-menu-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    white-space: nowrap;
    cursor: pointer;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: .35714286em;
    color: #ffffffd9;
    padding: .85714286em;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    min-width: 8em
}

@media (min-width:750px) {
    .header-btns .login-btn .sub-menu-link {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.header-btns .login-btn .sub-menu-link:hover {
    background: #ffffff0a;
    color: #00ffd1
}

.header-btns .login-btn .sub-menu-link .ico,
.header-btns .login-btn .sub-menu-link .icon {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.header-btns .login-btn .sub-menu-link .ico {
    height: 1em
}

.header-btns .login-btn .sub-menu-link .ico img {
    height: 100%;
    width: auto
}

@media (max-width:749.5px) {
    .header-btns .product-submit-btn {
        display: none
    }

    .header-btns .user-has-login {
        width: .6rem;
        height: .6rem;
        padding: .04rem
    }

    .header-btns .btn {
        height: .56rem;
        width: auto;
        padding: 0 .2rem;
        font-size: .24rem
    }

    .header-btns .login-btn {
        margin-right: .71428571em
    }
}

.header {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: var(--header-height);
    background-color: #181a1e;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#181a1ef0), to(#181a1ecf));
    background-image: -webkit-linear-gradient(top, #181a1ef0, #181a1ecf);
    background-image: -moz- oldlinear-gradient(top, #181a1ef0, #181a1ecf);
    background-image: -o-linear-gradient(top, #181a1ef0, #181a1ecf);
    background-image: linear-gradient(to bottom, #181a1ef0, #181a1ecf);
    z-index: 12;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (min-width:1000px) {
    .header {
        background-color: transparent;
        -webkit-backdrop-filter: saturate(50%) blur(6px);
        backdrop-filter: saturate(50%) blur(6px)
    }
}

.header .r-container {
    height: 100%
}

.header .r-container .container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%;
    gap: .2rem
}

@media (max-width:749.5px) {
    .header {
        border-bottom: 1px solid #24262C;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -moz-box-orient: horizontal;
        -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        gap: .2rem
    }

    .header .r-container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 0;
        gap: .2rem;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }

    .header .r-container .container {
        padding: 0;
        width: 100%
    }

    .header .l-container {
        padding-left: .2rem
    }

    .header .header-logo {
        -webkit-box-flex: 0;
        -webkit-flex-grow: 0;
        -moz-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0
    }
}

.footer-fixed-right {
    position: fixed;
    bottom: 10vh;
    right: 10px
}

.footer-fixed-right .go-top {
    width: .42rem;
    height: .42rem;
    background: #2c2d3666;
    border: 1px solid #ffffff05;
    -webkit-border-radius: .06rem;
    -moz-border-radius: .06rem;
    border-radius: .06rem;
    color: #ffffffd9
}

@media (hover:hover) and (pointer:fine) {
    .footer-fixed-right .go-top:hover {
        background: #2c2d36cc;
        border-color: #ffffff1a;
        color: #ffffff
    }
}

.footer-fixed-right .go-top .txt {
    display: none
}

.footer-copyright {
    background: #000;
    color: #4b4b4b;
    text-align: center;
    padding: 1.07142857em
}

.footer-copyright a {
    color: #4b4b4b
}

.footer-copyright p {
    font-size: .24rem
}

@media (min-width:750px) {
    .footer-copyright p {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.footer-section {
    position: relative;
    z-index: 11
}

.footer-section .section-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: normal;
    -webkit-align-items: normal;
    -moz-box-align: normal;
    -ms-flex-align: normal;
    align-items: normal;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: .2rem
}

.footer-section .flex-data,
.footer-section .flex-intro {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (max-width:999.5px) {
    .footer-section .flex-data {
        display: none
    }
}

.footer-section-menus {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    text-align: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.footer-section-menus .menu-title {
    font-size: .36rem;
    color: #b5b5b5;
    margin-bottom: 1.11111111em;
    font-weight: bold
}

@media (min-width:750px) {
    .footer-section-menus .menu-title {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.footer-section-menus .menu-item {
    color: #8c8c8c;
    line-height: 2.14285714em;
    
}

.footer-section-menus .menu-item a {
    color: #8c8c8c
}

@media (hover:hover) and (pointer:fine) {
    .footer-section-menus .menu-item a:hover {
        color: #fff
    }
}

.footer-section-intro {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 2.14285714em
}

.footer-section-intro .footer-logo {
    height: 3.42857143em
}

.footer-section-intro .footer-logo img {
    height: 100%
}

.footer-section-intro .intro {
    color: #8c8c8c;
    line-height: 2.14285714em;
    max-width: 50em
}

.footer-section-intro .tags {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.07142857em
}

.footer-section-intro .tag {
    line-height: 3.28571429em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #00fad180;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    overflow: hidden
}

.footer-section-intro .tag-contact {
    border-color: #fde2c280;
    color: #fde2c2e6;
    padding: 0 3.21428571em
}

@media (hover:hover) and (pointer:fine) {
    .footer-section-intro .tag-contact:hover {
        background-color: transparent;
        color: #00FFD1;
        border-color: #00FFD1
    }
}

.footer-section-intro .tag-fav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    color: #00ffd1
}

.footer-section-intro .tag-fav .t-r,
.footer-section-intro .tag-fav .t-l {
    padding: 0 1.21428571em
}

.footer-section-intro .tag-fav .t-r {
    background-color: #00fad1;
    color: #000
}

.footer-section-data {
    margin-top: .58rem
}

.footer-section-data .data-follow {
    text-align: right
}

.footer-section-data .data-follow .data-amount {
    color: #00ffd1;
    font-family: Impact;
    font-size: 357.14285714%;
    line-height: 1.25em
}

.footer-section-data .data-follow p {
    color: #8c8c8c
}

.footer-section-data .data-ewms {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.07142857em;
    margin-bottom: 2em;
    position: relative
}

.footer-section-data .ewm-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    color: #949498;
    width: 4.57142857em
}

@media (hover:hover) and (pointer:fine) {
    .footer-section-data .ewm-btn:hover {
        color: #fff
    }

    .footer-section-data .ewm-btn:hover .ewm-icon {
        color: #333;
        background-color: #00ffd1
    }
}

.footer-section-data .ewm-btn .ewm-icon {
    background: #ffffff1a;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    padding: .71428571em;
    color: #fff;
    width: 100%;
    margin-bottom: .42857143em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.footer-section-data .ewm-btn .ewm-icon .icon::before {
    font-size: .48rem
}

@media (min-width:750px) {
    .footer-section-data .ewm-btn .ewm-icon .icon::before {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

@media (hover:hover) and (pointer:fine) {
    .footer-section-data .ewm-group:hover .ewm-modal {
        display: block
    }

    .footer-section-data .ewm-group:hover:nth-child(1) .ewm-modal-inner::before {
        right: 18.57142857em
    }

    .footer-section-data .ewm-group:hover:nth-child(2) .ewm-modal-inner::before {
        right: 13.21428571em
    }

    .footer-section-data .ewm-group:hover:nth-child(3) .ewm-modal-inner::before {
        right: 7.5em
    }
}

.footer-section-data .ewm-modal {
    display: none;
    position: absolute;
    right: 0;
    bottom: 100%;
    padding-bottom: .71428571em
}

.footer-section-data .ewm-modal-inner {
    background: #202228;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    padding: 1.42857143em;
    position: relative;
    -webkit-box-shadow: 0 0 30px rgba(74, 254, 195, 0.08);
    -moz-box-shadow: 0 0 30px rgba(74, 254, 195, 0.08);
    box-shadow: 0 0 30px rgba(74, 254, 195, 0.08)
}

.footer-section-data .ewm-modal-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: .71428571em
}

.footer-section-data .ewm-modal-flex .ewm-modal-qr {
    width: 7.14285714em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: .71428571em;
    background: #2d2e31;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em
}

.footer-section-data .ewm-modal-flex .ewm-modal-qr img {
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em
}

.footer-section-data .ewm-modal-content {
    color: #8d8e91;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.footer-section-data .ewm-modal-content .p {
    line-height: 1.71428571em
}

.footer-section-data .ewm-modal-content .flex {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em;
    color: #00ffd1
}

.footer-section-data .weibo-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.07142857em
}

.footer-section-data .ewm-modal-wechat-group {
    margin-bottom: 1.42857143em
}

.footer-section-data .ewm-modal-wechat-group .w-title {
    margin-bottom: .71428571em
}

.footer-section-data .ewm-modal-wechat-group .w-title .flex {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em;
    color: #00ffd1;
    font-weight: bold
}

.footer-section-data .ewm-modal-wechat-group .wechat-group {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    color: #8d8e91;
    counter-reset: wechat-group-item-counter;
    gap: .71428571em;
    padding-bottom: 1.42857143em;
    border-bottom: 1px solid #ffffff0a;
    margin-bottom: 1.78571429em
}

.footer-section-data .ewm-modal-wechat-group .wechat-group .item {
    white-space: nowrap;
    font-size: .24rem;
    line-height: 2.14285714em;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em
}

@media (min-width:750px) {
    .footer-section-data .ewm-modal-wechat-group .wechat-group .item {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.footer-section-data .ewm-modal-wechat-group .wechat-group .item::before {
    counter-increment: wechat-group-item-counter;
    content: counter(wechat-group-item-counter);
    color: #8d8e91;
    display: block;
    font-size: 91.66666667%;
    width: 1.42857143em;
    text-align: center;
    height: 1.42857143em;
    line-height: 1.42857143em;
    -webkit-border-radius: .21428571em;
    -moz-border-radius: .21428571em;
    border-radius: .21428571em;
    border: 1px solid #8d8e91
}

.footer-section-data .ewm-modal-saoma .p {
    font-size: .24rem
}

@media (min-width:750px) {
    .footer-section-data .ewm-modal-saoma .p {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.footer-section-data .ewm-modal-saoma .e-title {
    margin-bottom: .71428571em;
    font-weight: bold;
    color: #ffffffcc
}

.footer-bands {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: .71428571em
}

@media (min-width:1000px) {
    .footer-bands {
        gap: 1.71428571em
    }
}

.footer-bands .item {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.footer-bands .item .btn {
    display: block;
    padding: 1.42857143em 0;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    background: #191b1f;
    color: #ffffff80
}

@media (hover:hover) and (pointer:fine) {
    .footer-bands .item .btn:hover {
        background-color: #293739;
        color: #00ffd1
    }
}

.footer-bands .item .btn-content {
    gap: .71428571em
}

.footer-menus {
    margin-bottom: 1.07142857em;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: left
}

.footer-menus .f-menu {
    line-height: 2.14285714em;
    height: 2.14285714em;
    overflow: hidden
}

.footer-menus .menu-item,
.footer-menus .menu-title {
    display: inline-block;
    white-space: nowrap;
    margin-right: 1.42857143em;
    color: #ffffff40
}

.footer-menus .menu-item a,
.footer-menus .menu-title a {
    color: #ffffff40
}

@media (hover:hover) and (pointer:fine) {

    .footer-menus .menu-item a:hover,
    .footer-menus .menu-title a:hover {
        color: #fff
    }
}

.footer-menus .menu-title {
    font-weight: bold
}

.footer-bottom {
    text-align: center;
    padding: 2.14285714em 0;
    background: #101011;
    display: none
}

@media (min-width:750px) {
    .footer-bottom {
        display: block
    }
}

.footer-bottom .footer-copyright {
    display: inline-block;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em
}

.footer-bottom .h {
    color: #499488
}

.footer-honour {
    background: #181a1ee6;
    padding: .4rem 0;
    display: none
}

@media (min-width:1000px) {
    .footer-honour {
        display: block
    }
}

.footer-honour .honour {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.footer-honour .a-item {
    width: auto;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (max-width:1399.5px) {
    .footer-honour .a-item:last-child {
        display: none
    }
}

.footer-honour .item-wrap {
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    text-align: center;
    color: #ffffff80;
    padding: 0 2.85714286em;
    position: relative;
    line-height: 1.57142857em
}

.footer-honour .bdiv {
    position: absolute;
    top: .28571429em;
    font-size: .72rem
}

@media (min-width:750px) {
    .footer-honour .bdiv {
        font-size: clamp(36px, 1.875vw, 40px)
    }
}

.footer-honour .lb {
    left: 0
}

.footer-honour .rb {
    right: 0
}

.footer-honour h3 {
    font-size: .36rem;
    font-weight: bold
}

@media (min-width:750px) {
    .footer-honour h3 {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.footer-honour h4 {
    font-size: .24rem;
    font-weight: normal
}

@media (min-width:750px) {
    .footer-honour h4 {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.footer-top {
    background: -webkit-gradient(linear, left bottom, left top, color-stop(50%, #1e2026), color-stop(75%, #2022280f), to(#00fad10f));
    background: -webkit-linear-gradient(bottom, #1e2026 50%, #2022280f 75%, #00fad10f 100%);
    background: -moz- oldlinear-gradient(bottom, #1e2026 50%, #2022280f 75%, #00fad10f 100%);
    background: -o-linear-gradient(bottom, #1e2026 50%, #2022280f 75%, #00fad10f 100%);
    background: linear-gradient(0deg, #1e2026 50%, #2022280f 75%, #00fad10f 100%);
    padding: 2.85714286em 0;
    display: none
}

@media (min-width:750px) {
    .footer-top {
        display: block
    }
}

.footer-top .footer-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 2.14285714em
}

.menu-bar .menu-item {
    margin-bottom: .71428571em;
    padding: 0 1.42857143em;
    position: relative;
    height: 40px;
}

.menu-bar .menu-item.current::before {
    content: '';
    display: block;
    position: absolute;
    left: 0px;
    top: 0;
    bottom: 0;
    width: 10px;
    background-image: url(../img/nav-Selected.png);
    background-position: left center;
    background-repeat: no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain
}

@media (min-width:750px) {
    .menu-bar .menu-item.current .menu-a {
        background: #252a2f
    }
}

.menu-bar .menu-item.current .menu-a .icon {
    background-image: -webkit-linear-gradient(179.81deg, #00aaffd9 2.82%, #23faeccc 50%, #52ffba 97.18%);
    background-image: -moz- oldlinear-gradient(179.81deg, #00aaffd9 2.82%, #23faeccc 50%, #52ffba 97.18%);
    background-image: -o-linear-gradient(179.81deg, #00aaffd9 2.82%, #23faeccc 50%, #52ffba 97.18%);
    background-image: linear-gradient(270.19deg, #00aaffd9 2.82%, #23faeccc 50%, #52ffba 97.18%)
}

@media (max-width:749.5px) {
    .menu-bar .menu-item.current .menu-a .title {
        color: #00ffd1
    }
}

.menu-bar .menu-item .ico {
    height: 1em
}

.menu-bar .menu-item .ico img {
    height: 100%;
    width: auto
}

.menu-bar .btn {
    -webkit-transition: none;
    -o-transition: none;
    -moz-transition: none;
    transition: none
}

.menu-bar .menu-a {
    padding: 0 1.42857143em;
    line-height: 2.85714286em;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    color: #c5c7d5
}

@media (hover:hover) and (pointer:fine) {
    .menu-bar .menu-a:hover {
        color: #fff;
        background: #252a2f
    }
}

.menu-bar .menu-a .btn-content {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.menu-bar .menu-a .icon {
    margin-right: .1rem;
    background-image: -webkit-gradient(linear, left top, right top, from(#c5c7d5), to(#c5c7d5));
    background-image: -webkit-linear-gradient(left, #c5c7d5, #c5c7d5);
    background-image: -moz- oldlinear-gradient(left, #c5c7d5, #c5c7d5);
    background-image: -o-linear-gradient(left, #c5c7d5, #c5c7d5);
    background-image: linear-gradient(to right, #c5c7d5, #c5c7d5);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent
}

.menu-bar .menu-a .title {
    font-weight: normal
}

.menu-bar .menu-block-title {
    color: #ffffff73;
    padding: 0 .2rem;
    margin-bottom: .71428571em
}

.menu-bar .menu-block-title .title {
    font-weight: normal
}

.menu-bar .menu-block {
    border-top: 1px solid #24282c;
    margin-top: .2rem;
    padding-top: .2rem
}

.menu-bar .menu-has-children {
    position: relative
}

@media (min-width:750px) and (hover:hover) and (pointer:fine) {
    .menu-bar .menu-has-children:hover .menu-children {
        display: block
    }
}

.menu-bar .menu-children {
    display: none;
    position: absolute;
    left: 100%;
    top: -3.57142857em;
    border: 1px solid #ffffff0a;
    background: #202228;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 1.42857143em;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    z-index: 9
}

.menu-bar .children-in {
    display: grid;
    gap: .71428571em;
    grid-template-columns: repeat(3, 7em)
}

.menu-bar .menu-child {
    color: #dddedf;
    background: #252a2f;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    padding: 1em
}

.menu-bar .menu-child.current {
    color: #00ffd1
}

@media (hover:hover) and (pointer:fine) {
    .menu-bar .menu-child:hover {
        color: #181a1e;
        background-color: #00ffd1
    }
}

.menu-bar .menu-child .btn-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-border-radius: 0%;
    -moz-border-radius: 0%;
    border-radius: 0%
}

.menu-bar .menu-child .txt {
    font-size: .24rem
}

@media (min-width:750px) {
    .menu-bar .menu-child .txt {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.menu-bar .hide-in-mobile {
    display: none
}

@media (min-width:750px) {
    .menu-bar .hide-in-mobile {
        display: block
    }
}

@media (max-width:749.5px) {
    .menu-bar {
        right: 0;
        top: auto;
        bottom: 0;
        width: 100%;
        z-index: 99
    }

    .menu-bar .menu-main {
        background-image: -webkit-gradient(linear, left top, left bottom, from(#181a1ef0), to(#181a1ecf));
        background-image: -webkit-linear-gradient(top, #181a1ef0, #181a1ecf);
        background-image: -moz- oldlinear-gradient(top, #181a1ef0, #181a1ecf);
        background-image: -o-linear-gradient(top, #181a1ef0, #181a1ecf);
        background-image: linear-gradient(to bottom, #181a1ef0, #181a1ecf);
        -webkit-backdrop-filter: saturate(50%) blur(6px);
        backdrop-filter: saturate(50%) blur(6px)
    }

    .menu-bar .menu-block {
        display: none
    }

    .menu-bar .menu-items {
        display: grid;
        grid-template-columns: repeat(5, 1fr)
    }

    .menu-bar .menu-item {
        padding: 0;
        margin: 0
    }

    .menu-bar .menu-item.current::before {
        display: none
    }

    .menu-bar .menu-a {
        line-height: 1.2;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        padding: .57142857em 0
    }

    .menu-bar .menu-a .icon {
        margin-right: 0
    }

    .menu-bar .menu-a .icon::before {
        font-size: .36rem;
        line-height: 1.3
    }

    .menu-bar .menu-a .btn-content {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        overflow: visible
    }

    .menu-bar .menu-a .title {
        font-size: 71.42857143%
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .menu-bar .menu-a .icon::before {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.menu-l-container {
    z-index: 9
}

@media (max-width:749.5px) {
    .menu-l-container {
        position: fixed !important;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10
    }
}

.comment-write .form-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: .2rem;
    margin-bottom: .2rem
}

.comment-write .form-item:last-child {
    margin-bottom: 0
}

.comment-write .form-item-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.comment-write .item-title {
    width: 2em;
    text-align: center;
    color: #ffffffd9;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

@media (min-width:750px) {
    .comment-write .item-title {
        width: 3.57142857em
    }
}

.comment-write .item-content {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.comment-write .user-name {
    color: #fff
}

.comment-write .btn-submit {
    background-color: #00ffd1;
    line-height: 3.42857143em;
    color: #000;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    outline: none;
    border: none;
    cursor: pointer;
    padding: 0 3em
}

@media (min-width:750px) {
    .comment-write .btn-submit {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.comment-write .comment-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.comment-write .txt-user-name,
.comment-write .v-input,
.comment-write .v-textarea {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #2a2c32;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1.42857143em 1.14285714em;
    color: #ffffff40;
    line-height: 1.42857143em;
    cursor: text;
    outline: none;
    white-space: pre-wrap;
    border: none
}

@media (min-width:750px) {

    .comment-write .txt-user-name,
    .comment-write .v-input,
    .comment-write .v-textarea {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.comment-write .txt-user-name:focus,
.comment-write .v-input:focus,
.comment-write .v-textarea:focus {
    background-color: #313338;
    color: #e0e0e0;
    cursor: text
}

.comment-write .error-label {
    background-color: #362E35;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1em 1.14285714em;
    color: #ff97af
}

@media (min-width:750px) {
    .comment-write .error-label {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.comment-write .error-label .error-p {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .42857143em
}

.comment-write .v-input {
    white-space: nowrap;
    padding-top: 1.07142857em;
    padding-bottom: 1.07142857em
}

.comment-write .limit-max {
    -webkit-animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both;
    -moz-animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both;
    -o-animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both;
    animation: vigorousShake .5s cubic-bezier(.36, .07, .19, .97) both
}

.comment-write .rest {
    margin-top: .1rem;
    text-align: left;
    font-size: .24rem;
    color: #ffffff20
}

@media (min-width:750px) {
    .comment-write .rest {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.comment-write .rest em {
    color: #ffffff40
}

.comment-item {
    margin-top: .6rem
}

.comment-item.comment-child {
    padding-left: .7rem
}

.comment-item .comment-item-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: .2rem;
    margin-bottom: .2rem
}

.comment-item .comment-item-wrap:last-child {
    margin-bottom: 0
}

.comment-item .item-title {
    width: 2em;
    text-align: center;
    color: #fff;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

@media (min-width:750px) {
    .comment-item .item-title {
        width: 3.57142857em
    }
}

.comment-item .item-content {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.comment-item .content-wrap {
    background: #f2f2f20d;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1.42857143em;
    margin-bottom: .71428571em
}

@media (min-width:750px) {
    .comment-item .content-wrap {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.comment-item .item-header {
    margin-bottom: .71428571em;
    color: #fff
}

.comment-item .item-header a {
    color: #fff
}

.comment-item .user-name {
    font-size: .28rem;
    font-weight: bold
}

@media (min-width:750px) {
    .comment-item .user-name {
        font-size: clamp(14px, .7292vw, 18px)
    }
}

.comment-item .comment-content {
    color: #ffffffd9;
    line-height: 1.71428571em
}

.comment-item .comment-meta {
    font-size: .24rem;
    color: #ffffff40
}

@media (min-width:750px) {
    .comment-item .comment-meta {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.comment-item .comment-meta .meta-reply,
.comment-item .comment-meta a {
    cursor: pointer;
    color: #ffffff40
}

@media (hover:hover) and (pointer:fine) {

    .comment-item .comment-meta .meta-reply:hover,
    .comment-item .comment-meta a:hover {
        color: #fff
    }
}

.comment-item .comment-meta .meta-item {
    margin-right: .2rem
}

.comment-item .meta-zan {
    cursor: pointer
}

@media (hover:hover) and (pointer:fine) {
    .comment-item .meta-zan:hover {
        color: #fff
    }
}

.comment-item .meta-zan.has-zan {
    cursor: default;
    color: #ffffff40
}

@media (hover:hover) and (pointer:fine) {
    .comment-item .meta-zan.has-zan:hover {
        color: #ffffff40
    }
}

.comment-item .comment-reply-box {
    padding: 1.42857143em 0;
    position: relative
}

.comment-item .btn-reply-close {
    position: absolute;
    right: 0;
    top: 0;
    padding: .71428571em;
    color: #fff;
    cursor: pointer;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s
}

.comment-item .btn-reply-close:hover {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
}

.comment-item.comment-not-approved .content-wrap {
    background: #2A3436
}

.comment-item.comment-not-approved .approve-txt {
    color: #00FFD1;
    margin-left: .71428571em;
    font-size: .24rem
}

@media (min-width:750px) {
    .comment-item.comment-not-approved .approve-txt {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.post-primary {
    background-image: url(../img/1031-c-bg.webp);
    background-position: left top;
    background-repeat: no-repeat;
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%
}

@media (min-width:750px) {
    .post-primary {
        -webkit-background-size: 70% 70%;
        -moz-background-size: 70%;
        -o-background-size: 70%;
        background-size: 70%
    }
}

.post-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: .3rem;
    margin-bottom: .3rem
}

.post-row:first-child {
    -webkit-box-align: end;
    -webkit-align-items: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: end
}

.post-row:last-child {
    margin-bottom: 0
}

.post-row .post-main {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0
}

.post-row .post-sidebar {
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative
}

.post-row .post-sidebar .widget {
    margin-bottom: .3rem
}

.post-row .post-sidebar .widget:last-child {
    margin-bottom: 0
}

.post-row .post-bg-side {
    display: none
}

@media (min-width:1280px) {
    .post-row {
        grid-template-columns: 1fr clamp(340px, 22vw, 540px)
    }

    .post-row .post-bg-side {
        display: block
    }
}

.post-bg-side video {
    width: 100%;
    -o-object-fit: fill;
    object-fit: fill;
    -o-object-position: center;
    object-position: center
}

.post-cover {
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    overflow: hidden;
    display: block
}

@media (min-width:750px) {
    .post-cover {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.post-cover .thumb {
    padding-top: 66.66666667%
}

.post-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-bottom: 1.07142857em
}

@media (min-width:750px) {
    .post-title {
        margin-bottom: .3rem
    }
}

.post-title .post-logo {
    width: 5em;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: .3rem;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    overflow: hidden
}

@media (min-width:750px) {
    .post-title .post-logo {
        width: 6.42857143em
    }
}

.post-title .title-main {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.post-title .p-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: .18rem;
    color: #fff
}

.post-title .p-title .title-text {
    font-size: .44rem
}

@media (min-width:750px) {
    .post-title .p-title .title-text {
        font-size: clamp(22px, 1.1458vw, 26px)
    }
}

@media (min-width:750px) {
    .post-title .p-title .title-text {
        font-size: .64rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-title .p-title .title-text {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

.post-title .subtitle {
    color: #ffffff73
}

.post-excerpt {
    color: #ffffffa6;
    line-height: 1.85714286em;
    min-height: 3.71428571em;
    margin-bottom: 1.42857143em;
    padding: 0 .71428571em
}

@media (min-width:750px) {
    .post-excerpt {
        padding: 0
    }
}

.post-tags {
    margin-bottom: .4rem;
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: auto
}

.post-tags::-webkit-scrollbar {
    display: none
}

.post-tags .btn {
    display: inline-block;
    margin-right: 1.07142857em;
    border: 1px solid #ffffff1a;
    color: #bebec2;
    padding: 0 .71428571em;
    line-height: 2.28571429em;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em
}

.post-tags .btn:hover {
    color: #fff;
    border-color: #fff
}

.post-btns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .2rem
}

.btns {
    height: 53px;
}

/* 自定义滚动条样式 */
::-webkit-scrollbar {
    width: 0;
    height: 0;
    transition: width 0.3s ease, height 0.3s ease;
}

::-webkit-scrollbar-track {
    background-color: rgba(24, 26, 30, 0.8);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #00ffd1, #00cca7);
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 255, 209, 0.3);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #00cca7, #00a88f);
    box-shadow: 0 2px 12px rgba(0, 255, 209, 0.5);
}

/* JavaScript控制滚动条显示 */
body.scrollbar-visible::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

/* 鼠标悬停在页面上时也显示滚动条（增强用户体验） */
body:hover::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

/* 隐藏IE/Edge浏览器滚动条 */
body {
    -ms-overflow-style: none;
}

/* Firefox滚动条样式 */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 255, 209, 0.5) rgba(24, 26, 30, 0.8);
}

/* 特殊滚动区域的处理 */
.post-tags::-webkit-scrollbar,
.post-awards::-webkit-scrollbar,
.tax-allcats .allcats-items::-webkit-scrollbar,
.tax-subcats .subcats-items::-webkit-scrollbar {
    width: 0;
    height: 0;
    transition: width 0.3s ease, height 0.3s ease;
}

.post-tags:hover::-webkit-scrollbar,
.post-awards:hover::-webkit-scrollbar,
.tax-allcats .allcats-items:hover::-webkit-scrollbar,
.tax-subcats .subcats-items:hover::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
body {
    -ms-overflow-style: none;
}

/* 隐藏Firefox浏览器滚动条 */
html {
    scrollbar-width: thin;
    scrollbar-color: #00ffd1 rgba(24, 26, 30, 0.8);
}

@media (max-width:749.5px) {
    .post-btns {
        grid-template-columns: repeat(2, 1fr);
        gap: .24rem
    }

    .post-btns .btn-item:first-child {
        grid-column: 1 / -1
    }
}

.post-btns .btn {
    line-height: 3.85714286em;
    background: #2D2F32;
    color: #fff;
    -webkit-transition: background-color .3s;
    -o-transition: background-color .3s;
    -moz-transition: background-color .3s;
    transition: background-color .3s
}

@media (hover:hover) and (pointer:fine) {
    .post-btns .btn:hover {
        background-color: #293739;
        color: #0affd1
    }

    .post-btns .btn:hover .icon {
        color: #0affd1
    }
}

.post-btns .btn .icon {
    margin-right: .05rem;
    color: #ffffff73
}

.post-btns .btn .txt {
    font-weight: normal;
    margin-right: .05rem
}

.post-btns .has-fav {
    background-color: #243436;
    color: #59f5d9
}

.post-btns .has-fav .icon {
    color: #59f5d9
}

.post-btns .a-link {
    background: #00ffd1;
    color: #000
}

.post-btns .a-link .icon {
    color: #000
}

.post-btns .a-link .txt {
    font-weight: bold
}

@media (hover:hover) and (pointer:fine) {
    .post-btns .a-link:hover {
        color: #000
    }

    .post-btns .a-link:hover .icon {
        color: #000
    }
}

.post-content {
    margin-bottom: .6rem;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #ffffff05;
    background: #2c2d3666;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: .6rem .4rem .4rem .4rem
}

@media (min-width:750px) {
    .post-content {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: .6rem .9rem .4rem .8rem
    }
}

.post-content-btns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: .3rem
}

.post-content-btns .btn-item {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.post-content-btns .btn-item:last-child {
    display: none
}

@media (min-width:750px) {
    .post-content-btns .btn-item {
        padding: 0 .15rem;
        max-width: 3rem
    }

    .post-content-btns .btn-item:last-child {
        display: block
    }
}

.post-content-btns .btn {
    padding: 0 .71428571em;
    line-height: 3.42857143em;
    background: #34363b;
    color: #ffffffa6
}

.post-content-btns .btn .txt {
    font-weight: normal
}

.post-content-btns .btn .icon {
    margin-right: .05rem
}

.post-content-btns .a-link {
    background: #00ffd1;
    color: #000
}

.post-content-btns .a-link .icon {
    color: #000
}

.post-content-btns .btn-feedback {
    position: relative
}

@media (hover:hover) and (pointer:fine) {
    .post-content-btns .btn-feedback:hover .btn {
        background-color: #1E2F32;
        color: #0AFFD1
    }
}

.post-content-btns .btn-feedback.show-modal .feedback-modal {
    display: block
}

.post-content-btns .feedback-modal {
    display: none;
    position: absolute;
    left: 50%;
    bottom: 100%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    margin-bottom: 1.71428571em
}

.post-content-btns .feedback-modal .modal-wrap {
    background: #353840;
    padding: 2.14285714em;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    width: 31.42857143em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 0 30px rgba(74, 254, 195, 0.08);
    -moz-box-shadow: 0 0 30px rgba(74, 254, 195, 0.08);
    box-shadow: 0 0 30px rgba(74, 254, 195, 0.08);
    position: relative
}

.post-content-btns .feedback-modal .close {
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: .71428571em;
    right: .71428571em;
    width: 1.42857143em;
    height: 1.42857143em;
    cursor: pointer;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
    color: #a9a9ad
}

.post-content-btns .feedback-modal .close:hover {
    color: #fff;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
}

.post-content-btns .feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.42857143em;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.post-content-btns .feedback-ewm {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.post-content-btns .feedback-ewm .ewm-in {
    width: 5.71428571em;
    background-color: #fff;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    padding: .71428571em
}

.post-content-btns .feedback-ewm .ewm-in img {
    width: 100%
}

.post-content-btns .feedback-main {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.post-content-btns .feedback-main .h {
    color: #00ffd1
}

.post-content-btns .feedback-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em;
    color: #dddedf;
    margin-bottom: 1em
}

.post-content-btns .feedback-title .title {
    font-size: .32rem
}

@media (min-width:750px) {
    .post-content-btns .feedback-title .title {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.post-content-btns .feedback-avatar {
    width: 1.71428571em;
    background-color: #fff;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.post-content-btns .feedback-desc {
    color: #a9a9ad;
    line-height: 1.78571429em
}

.post-meta {
    margin-bottom: .4rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .2rem
}

@media (min-width:750px) {
    .post-meta {
        grid-template-columns: repeat(4, 1fr)
    }
}

.post-meta .meta-item {
    min-width: 0
}

.post-meta .meta-title {
    display: block;
    color: #ffffff73;
    line-height: 1.42857143em;
    margin-bottom: .06rem
}

.post-meta .meta-text {
    display: block;
    color: #ffffffd9;
    line-height: 2.14285714em
}

.post-entry {
    color: #ffffffa6;
    counter-reset: entry-h2-counter;
    padding-bottom: .4rem;
    border-bottom: 1px solid #ffffff05;
    margin-bottom: .4rem
}

.post-entry p {
    line-height: 2.14285714em
}

@media (min-width:750px) {
    .post-entry p {
        line-height: 2.5em
    }
}

.post-entry h2 {
    font-size: .52rem;
    color: #ffffffd9;
    line-height: 1.14285714em;
    font-weight: bold;
    margin-bottom: .4rem;
    margin-top: .4rem;
    padding-top: .4rem;
    border-top: 1px solid #ffffff05
}

@media (min-width:750px) {
    .post-entry h2 {
        font-size: clamp(26px, 1.3542vw, 30px)
    }
}

@media (min-width:750px) {
    .post-entry h2 {
        font-size: .56rem;
        margin-bottom: .16rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-entry h2 {
        font-size: clamp(28px, 1.4583vw, 32px)
    }
}

.post-entry h2:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none
}

.post-entry .h2-index {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-right: .1rem
}

.post-entry .h2-index .icon {
    font-size: .64rem;
    color: #00ffd1
}

@media (min-width:750px) {
    .post-entry .h2-index .icon {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

@media (min-width:750px) {
    .post-entry .h2-index .icon {
        font-size: .72rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-entry .h2-index .icon {
        font-size: clamp(36px, 1.875vw, 40px)
    }
}

.post-entry .h2-index::after {
    counter-increment: entry-h2-counter;
    content: counter(entry-h2-counter);
    color: #333;
    font-size: .36rem;
    font-weight: normal;
    position: absolute;
    left: 50%;
    top: 46%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

@media (min-width:750px) {
    .post-entry .h2-index::after {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.post-copyright {
    color: #45464A;
    line-height: 1.78571429em
}

.post-go-comment {
    margin-bottom: .6rem
}

.post-go-comment .g-wrap {
    display: block;
    background: #2c2d3666;
    border: 1px solid #ffffff05;
    padding: .35rem .4rem;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em
}

@media (min-width:750px) {
    .post-go-comment .g-wrap {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.post-go-comment .avatars {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20px, 1fr));
    gap: .1rem;
    margin-bottom: .2rem
}

.post-go-comment .avatars .avatar {
    max-width: 36px
}

.post-go-comment .avatar-item {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    max-width: 36px;
    overflow: hidden
}

.post-go-comment .go-text {
    color: #ffffffa6;
    line-height: 2.14285714em
}

.post-analytics {
    border: 1px solid #ffffff05;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    background: #2c2d3666;
    padding: 1.42857143em
}

@media (min-width:750px) {
    .post-analytics {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: 2.14285714em
    }
}

.post-analytics .widget-title {
    margin-bottom: .2rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    color: #ffffffd9;
    line-height: .3rem
}

.post-analytics .widget-title .title {
    font-size: .48rem
}

@media (min-width:750px) {
    .post-analytics .widget-title .title {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

@media (min-width:750px) {
    .post-analytics .widget-title .title {
        font-size: .44rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-analytics .widget-title .title {
        font-size: clamp(22px, 1.1458vw, 26px)
    }
}

.post-analytics .widget-title .ico {
    font-size: .24rem;
    background: #da2e2e;
    -webkit-border-radius: .04rem;
    -moz-border-radius: .04rem;
    border-radius: .04rem;
    color: #fff;
    text-transform: uppercase;
    line-height: 1.66666667;
    padding: 0 .04rem;
    -webkit-transform: scale(.8);
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    -o-transform: scale(.8);
    transform: scale(.8);
    margin-left: .05rem
}

@media (min-width:750px) {
    .post-analytics .widget-title .ico {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.post-analytics .analytics-line {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: .4rem;
    gap: .2rem
}

@media (min-width:750px) {
    .post-analytics .analytics-line {
        margin-bottom: .3rem
    }
}

.post-analytics .analytics-line .analytic-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: .71428571em
}

.post-analytics .analytics-line .analytic-icon {
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

.post-analytics .analytics-line .icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: .2rem;
    height: .2rem;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    color: #00ffd1
}

.post-analytics .analytics-line .analytic-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .57142857em;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

@media (min-width:750px) {
    .post-analytics .analytics-line .analytic-text {
        gap: .06rem
    }
}

.post-analytics .analytics-line .txt {
    line-height: .2rem;
    color: #ffffff73
}

.post-analytics .analytics-line .num {
    color: #ffffffd9;
    font-size: .36rem
}

@media (min-width:750px) {
    .post-analytics .analytics-line .num {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.post-analytics .analytics-section {
    padding-top: .4rem;
    margin-top: .4rem;
    border-top: 1px solid #ffffff0a
}

.post-analytics .section-title {
    color: #ffffffd9;
    font-size: .32rem;
    line-height: 1.875;
    margin-bottom: .2rem
}

@media (min-width:750px) {
    .post-analytics .section-title {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.post-analytics .analytic-geo {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: .2rem;
    color: #ffffffa6
}

.post-analytics .analytic-geo:last-child {
    margin-bottom: 0
}

.post-related {
    border: 1px solid #ffffff05;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    background: #2c2d3666;
    padding: 1.42857143em
}

@media (min-width:750px) {
    .post-related {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: 2.14285714em
    }
}

.post-related .widget-title {
    margin-bottom: 1.42857143em;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    color: #ffffffd9;
    line-height: 1.42857143em
}

@media (min-width:750px) {
    .post-related .widget-title {
        line-height: .3rem
    }
}

.post-related .widget-title .title {
    font-size: .44rem
}

@media (min-width:750px) {
    .post-related .widget-title .title {
        font-size: clamp(22px, 1.1458vw, 26px)
    }
}

@media (min-width:750px) {
    .post-related .widget-title .title {
        font-size: .48rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-related .widget-title .title {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

.post-related .post-item {
    margin-bottom: 1.42857143em
}

@media (min-width:750px) {
    .post-related .post-item {
        margin-bottom: .3rem
    }
}

.post-related .post-item:last-child {
    margin-bottom: 0
}

.post-related .post-item-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: .2rem
}

.post-related .post-item-cover {
    width: 3.57142857em
}

@media (min-width:750px) {
    .post-related .post-item-cover {
        width: 4.57142857em
    }
}

.post-related .post-item-cover a {
    display: block
}

@media (hover:hover) and (pointer:fine) {
    .post-related .post-item-cover a:hover .thumb::after {
        display: none
    }
}

.post-related .post-item-cover .thumb {
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    overflow: hidden
}

@media (min-width:750px) {
    .post-related .post-item-cover .thumb {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.post-related .post-item-cover .thumb::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.15)
}

.post-related .post-item-main {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.post-related .post-item-analytics {
    width: 3.57142857em;
    height: 3.57142857em;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #ffffff0d;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em
}

@media (min-width:750px) {
    .post-related .post-item-analytics {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        width: 4.57142857em;
        height: 4.57142857em
    }
}

.post-related .analytic-icon {
    color: #00ffd1;
    margin-bottom: .08rem;
    font-size: .28rem
}

@media (min-width:750px) {
    .post-related .analytic-icon {
        font-size: clamp(14px, .7292vw, 18px)
    }
}

.post-related .analytic-value {
    font-size: .24rem;
    color: #8a8a8a
}

@media (min-width:750px) {
    .post-related .analytic-value {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.post-related .widget-btns {
    margin-top: .3rem
}

.post-related .widget-btns .btn {
    display: block;
    background: #34363b;
    color: #f9f9f9a6;
    line-height: 3.42857143em;
    text-align: center
}

@media (hover:hover) and (pointer:fine) {
    .post-related .widget-btns .btn:hover {
        background-color: #00ffd1;
        color: #181a1e
    }
}

.post-related .post-item-title {
    line-height: 1.85714286em;
    height: 1.85714286em;
    overflow: hidden
}

@media (min-width:750px) {
    .post-related .post-item-title {
        line-height: .34rem;
        height: .34rem
    }
}

.post-related .post-item-title .title {
    font-size: .36rem;
    color: #dddedf;
    font-weight: bold
}

@media (min-width:750px) {
    .post-related .post-item-title .title {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.post-related .post-item-extra {
    font-size: .24rem
}

@media (min-width:750px) {
    .post-related .post-item-extra {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.post-related .post-item-extra .meta-item::after {
    content: '·';
    margin: 0 5px;
    color: #ffffffa6
}

.post-related .post-item-extra .meta-item:last-child::after {
    display: none
}

.post-related .post-item-extra .meta-step {
    color: #00ffd1;
    text-transform: uppercase
}

.post-related .post-item-extra a {
    display: inline-block;
    vertical-align: top;
    color: #ffffffa6
}

.post-awards {
    margin-bottom: .3rem;
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: auto;
    width: 100%;
    padding-bottom: 1px
}

.post-awards::-webkit-scrollbar {
    display: none
}

@media (min-width:750px) {
    .post-awards {
        padding-bottom: 0;
        gap: 1.28571429em;
        overflow: visible;
        white-space: normal;
        display: grid;
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (min-width:1400px) {
    .post-awards {
        grid-template-columns: repeat(3, 17.42857143em)
    }
}

.post-awards .awards-item {
    display: inline-block;
    margin-right: .2rem;
    height: 4.85714286em;
    vertical-align: top
}

.post-awards .awards-item:last-child {
    margin-right: 0
}

@media (min-width:750px) {
    .post-awards .awards-item {
        display: block;
        height: 100%;
        margin-right: 0
    }
}

.post-awards .awards-score,
.post-awards .awards-rank {
    height: 100%;
    border: 1px solid #ffffff26;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    background: #0000000d;
    padding: 1em;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (min-width:750px) {

    .post-awards .awards-score,
    .post-awards .awards-rank {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.post-awards .awards-rank-no .awards-text,
.post-awards .awards-rank-no .awards-icon {
    color: #808989
}

.post-awards .awards-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.post-awards .awards-icon {
    padding-right: .71428571em;
    color: #ffda75
}

.post-awards .awards-icon .icon::before {
    font-size: 300%
}

@media (min-width:750px) {
    .post-awards .awards-icon .icon::before {
        font-size: 1rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-awards .awards-icon .icon::before {
        font-size: clamp(50px, 2.6vw, 56px)
    }
}

.post-awards .awards-text {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    color: #ffda75
}

.post-awards .awards-text .title {
    font-size: .36rem;
    margin-bottom: .1rem;
    font-weight: bold;
    text-transform: uppercase
}

@media (min-width:750px) {
    .post-awards .awards-text .title {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

@media (min-width:750px) {
    .post-awards .awards-text .title {
        font-size: .52rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-awards .awards-text .title {
        font-size: clamp(26px, 1.3542vw, 30px)
    }
}

.post-awards .awards-text .extra {
    opacity: .85;
    font-size: .24rem;
    white-space: nowrap;
    line-height: 1
}

@media (min-width:750px) {
    .post-awards .awards-text .extra {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.post-awards .component-score {
    -webkit-border-radius: .06rem;
    -moz-border-radius: .06rem;
    border-radius: .06rem;
    background-color: #fff;
    padding: .05rem
}

.post-awards .component-score .score-num {
    background: #ffb540;
    color: #fff;
    -webkit-border-radius: .06rem .06rem 0 0;
    -moz-border-radius: .06rem .06rem 0 0;
    border-radius: .06rem .06rem 0 0;
    text-align: center;
    padding: .06rem .04rem .04rem
}

.post-awards .component-score .score-num .num {
    font-weight: bold;
    font-family: OPPOSans;
    font-size: .36rem;
    display: block;
    line-height: 1
}

@media (min-width:750px) {
    .post-awards .component-score .score-num .num {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.post-awards .component-score .score-txt {
    font-size: .24rem;
    line-height: 1;
    color: #000;
    margin-top: .04rem;
    text-align: center;
    font-weight: bold
}

@media (min-width:750px) {
    .post-awards .component-score .score-txt {
        font-size: clamp(12px, .625vw, 14px)
    }
}

@media (min-width:750px) {
    .post-awards .awards-score {
        padding-left: 1.42857143em
    }
}

.post-awards .awards-score .awards-icon {
    padding-right: .71428571em
}

@media (min-width:750px) {
    .post-awards .awards-score .awards-icon {
        padding-right: 1.42857143em
    }
}

.post-awards .awards-score .awards-text .title {
    color: #ffffffd9;
    margin-bottom: .14rem
}

.post-awards .awards-score .awards-text .extra {
    opacity: 1
}

.post-awards .awards-score .awards-text .extra .txt {
    color: #ffffffa6;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em
}

.post-awards .awards-score .awards-text .extra .txt .icon {
    display: inline-block;
    vertical-align: baseline
}

.post-awards .awards-score .awards-text .extra .popup-open {
    cursor: pointer
}

.post-comment .post-comment-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: .3rem;
    gap: .1rem
}

.post-comment .post-comment-title .title {
    font-size: .52rem;
    color: #ffffffd9
}

@media (min-width:750px) {
    .post-comment .post-comment-title .title {
        font-size: clamp(26px, 1.3542vw, 30px)
    }
}

@media (min-width:750px) {
    .post-comment .post-comment-title .title {
        font-size: .72rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-comment .post-comment-title .title {
        font-size: clamp(36px, 1.875vw, 40px)
    }
}

.post-comment .post-comment-title .txt {
    color: #00ffd1
}

.post-comment .post-comment-title .count {
    color: #181a1e;
    background-color: #00FFD1;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 2em;
    line-height: 2em;
    text-align: center
}

.post-comment .comment-main {
    background: #202228;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: .6rem .4rem
}

@media (min-width:750px) {
    .post-comment .comment-main {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.post-status {
    margin-left: .12rem;
    -webkit-border-radius: .06rem;
    -moz-border-radius: .06rem;
    border-radius: .06rem;
    border: 1px solid transparent;
    padding: 0 .1rem;
    font-size: 71.42857143%;
    line-height: 1.8em;
    white-space: nowrap;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (min-width:750px) {
    .post-status {
        font-size: .24rem;
        line-height: 1.83333333em
    }
}

@media (min-width:750px) and (min-width:750px) {
    .post-status {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.post-status.status-living {
    border-color: #00ffd1;
    color: #00ffd1
}

.post-status.status-error {
    border-color: #f37370;
    color: #f37370
}

.post-status.status-die {
    border-color: #898989;
    color: #898989
}

.sidebar-fixed {
    position: relative
}

.sidebar-fixed .sidebar-fixed-content.fixed {
    position: fixed
}

.sidebar-fixed .sidebar-fixed-content.absolute {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

.tax-header {
    position: relative;
    padding-bottom: .4rem
}

.tax-header .post-bg-side {
    width: 100%;
    display: none
}

@media (min-width:1000px) {
    .tax-header .post-bg-side {
        display: block;
        position: absolute;
        right: 0;
        bottom: 0;
        width: clamp(420px, 25vw, 620px)
    }
}

.tax-header .page-title {
    margin-bottom: .2rem;
    color: #00ffd1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: .1rem;
    line-height: 3.57142857em
}

.tax-header .page-title .icon::before {
    font-size: 257.14285714%
}

.tax-header .page-title .title {
    font-size: 257.14285714%
}

.tax-header .page-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ffffff73;
    line-height: 1.78571429em;
    margin-bottom: .28571429em
}

.tax-header .page-meta .meta-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .57142857em
}

.tax-header .page-meta .count {
    color: #00ffd1
}

.tax-header .intro {
    line-height: 1.78571429em;
    color: #ffffff73
}

.tax-header .zz {
    color: #00ffd1
}

@media (max-width:749.5px) {

    .tax-header .page-meta,
    .tax-header .page-title {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .tax-header .page-title .icon::before {
        font-size: 214.28571429%
    }

    .tax-header .page-title .title {
        font-size: 214.28571429%
    }
}

.tax-popular {
    padding: 1.42857143em;
    border: 1px solid #ffffff0d;
    background: #2c2d3633;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    margin-bottom: .4rem
}

@media (min-width:750px) {
    .tax-popular {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: .3rem .4rem
    }
}

.tax-popular .popular-wrap {
    position: relative;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2em;
    width: 100%
}

@media (min-width:750px) {
    .tax-popular .popular-wrap {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width:1000px) {
    .tax-popular .popular-wrap {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (min-width:1440px) {
    .tax-popular .popular-wrap {
        grid-template-columns: repeat(6, 1fr)
    }
}

.tax-popular .popular-title {
    text-align: center
}

.tax-popular .popular-title .p-img {
    width: 7em;
    margin: 0 auto 1em
}

.tax-popular .popular-title .p-title {
    color: #e0c08b;
    font-size: .4rem;
    line-height: 1.5em;
    margin-bottom: 1em
}

@media (min-width:750px) {
    .tax-popular .popular-title .p-title {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

.tax-popular .popular-title .txt1,
.tax-popular .popular-title .txt2 {
    display: block
}

.tax-popular .popular-title .txt2 {
    font-weight: bold
}

.tax-popular .popular-title .p-btns {
    text-align: center
}

.tax-popular .popular-title .btn {
    color: #3b270a;
    line-height: 2.71428571em;
    padding: 0 1.07142857em;
    display: inline-block;
    background: #e0c08b
}

@media (hover:hover) and (pointer:fine) {
    .tax-popular .popular-title .btn:hover {
        background-color: #efbf5f;
        color: #5c390b
    }
}

/* .tax-popular .popular-item{
    width: 219px;
    height: 218px;
} */

.popular-item .item-btns{
    /* width: 160px; */
    height: 22px;
}


.tax-popular .popular-item-a {   
    display: block;
    position: relative;
    padding: 2.14285714em;
    background: #35384133;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em
}

@media (hover:hover) and (pointer:fine) {
    .tax-popular .popular-item-a:hover .item-logo::after {
        display: none
    }
}

.tax-popular .popular-item-a .item-logo {
    width: 4.28571429em;
    height: 4.28571429em;
    margin: 0 auto .71428571em;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    overflow: hidden;
    position: relative
}

.tax-popular .popular-item-a .item-logo::after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.15);
    position: absolute;
    left: 0;
    top: 0
}

.tax-popular .popular-item-a .item-title {
    color: #dddedf;
    font-size: 114.28571429%;
    line-height: 1.5em;
    text-align: center;
    margin-bottom: .375em;
    font-weight: bold
}

.tax-popular .popular-item-a .item-meta {
    color: #959595;
    font-size: inherit;
    text-align: center
}

.tax-popular .popular-item-a .item-meta .icon,
.tax-popular .popular-item-a .item-meta .txt {
    display: inline-block;
    vertical-align: middle
}

.tax-popular .popular-item-a .item-meta .txt {
    padding-left: .35714286em
}

.tax-popular .popular-item-a .meta-item {
    display: inline-block;
    padding: 0 .71428571em;
    position: relative
}

.tax-popular .popular-item-a .meta-item:last-child::after {
    display: none
}

.tax-popular .popular-item-a .meta-item::after {
    content: '';
    display: inline-block;
    width: .07142857em;
    height: .42857143em;
    border-left: 1px solid #ffffff33;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%)
}

.tax-popular .popular-item-a .item-btns {
    margin-top: 1.07142857em;
    text-align: center
}

.tax-popular .popular-item-a .item-btns .btn {
    display: inline-block;
    background: #77f8d31a;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    line-height: 1.57142857em;
    padding: 0 .57142857em;
    width: 120px;
}

.tax-popular .popular-item-a .item-btns .btn .btn-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #77f8d3;
    font-size: .24rem
}

@media (min-width:750px) {
    .tax-popular .popular-item-a .item-btns .btn .btn-content {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.tax-popular .popular-item-a .item-index {
    position: absolute;
    left: 0;
    top: 0
}

.tax-popular .popular-item-a .item-index .icon {
    display: block;
    background-image: -webkit-linear-gradient(230.22deg, #ffdd9a -1.26%, #ffc552 100.56%);
    background-image: -moz- oldlinear-gradient(230.22deg, #ffdd9a -1.26%, #ffc552 100.56%);
    background-image: -o-linear-gradient(230.22deg, #ffdd9a -1.26%, #ffc552 100.56%);
    background-image: linear-gradient(219.78deg, #ffdd9a -1.26%, #ffc552 100.56%);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent
}

.tax-popular .popular-item-a .item-index .icon::before {
    font-size: .72rem;
    line-height: 1
}

@media (min-width:750px) {
    .tax-popular .popular-item-a .item-index .icon::before {
        font-size: clamp(36px, 1.875vw, 40px)
    }
}

.tax-popular .popular-item-a .item-index .txt {
    position: absolute;
    left: 50%;
    top: 46%;
    font-weight: bold;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: .36rem;
    color: #4e2d03
}

@media (min-width:750px) {
    .tax-popular .popular-item-a .item-index .txt {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

@media (max-width:749.5px) {
    .tax-popular .popular-item {
        display: none
    }

    .tax-popular .popular-title {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: .85714286em
    }

    .tax-popular .popular-title .p-img {
        width: 1.2rem;
        margin: 0
    }

    .tax-popular .popular-title .p-title {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        text-align: left;
        margin: 0;
        line-height: 1.3
    }

    .tax-popular .popular-title .p-title .txt1 {
        font-size: .32rem
    }

    .tax-popular .popular-title .p-title .txt2 {
        font-size: .28rem
    }

    .tax-popular .popular-title .btn {
        font-size: .24rem
    }
}

.tax-allcats {
    margin-bottom: .3rem;
    overflow: hidden;
    height: 2.42857143em
}

@media (min-width:750px) {
    .tax-allcats {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        gap: .71428571em
    }
}

.tax-allcats.show-all {
    height: auto
}

.tax-allcats.show-all .see-all .btn-more .ico .icon {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.tax-allcats .see-all {
    display: none
}

@media (min-width:750px) {
    .tax-allcats .see-all.active {
        display: block
    }
}

.tax-allcats .see-all .btn-more {
    display: block;
    border: 1px solid rgba(255, 255, 255, 0.03);
    background: #202229;
    color: #ffffffb3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    height: 2.14285714em;
    line-height: 2.14285714em;
    padding: 0 .57142857em
}

@media (min-width:750px) {
    .tax-allcats .see-all .btn-more {
        height: 2.42857143em;
        line-height: 2.42857143em;
        padding: 0 1.07142857em
    }
}

@media (hover:hover) and (pointer:fine) {
    .tax-allcats .see-all .btn-more:hover {
        color: #77f8d3;
        border-color: #77f8d3
    }
}

.tax-allcats .see-all .btn-more .txt {
    font-weight: normal
}

.tax-allcats .see-all .btn-more .ico .icon {
    display: block;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

.tax-allcats .see-all .btn-more .ico .icon::before {
    font-size: .24rem
}

@media (min-width:750px) {
    .tax-allcats .see-all .btn-more .ico .icon::before {
        font-size: clamp(12px, .625vw, 14px)
    }
}

@media (max-width:749.5px) {
    .tax-allcats .allcats-items {
        white-space: nowrap;
        overflow-y: hidden;
        overflow-x: auto;
        height: 100%
    }

    .tax-allcats .allcats-items::-webkit-scrollbar {
        display: none
    }
}

@media (min-width:750px) {
    .tax-allcats .allcats-items {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -moz-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        gap: .15rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

.tax-allcats .allcats-items .item {
    display: inline-block;
    vertical-align: top;
    margin-right: .2rem
}

.tax-allcats .allcats-items .item:last-child {
    margin-right: 0
}

@media (min-width:750px) {
    .tax-allcats .allcats-items .item {
        display: block;
        margin-right: 0
    }
}

.tax-allcats .allcats-items .item.current .item-link {
    color: #181a1e;
    background: -webkit-gradient(linear, left top, right top, color-stop(2.82%, #00d5d9), color-stop(97.18%, #77f8d3));
    background: -webkit-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: -moz- oldlinear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: -o-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: linear-gradient(90deg, #00d5d9 2.82%, #77f8d3 97.18%)
}

.tax-allcats .allcats-items .item-link {
    display: block;
    border: 1px solid rgba(255, 255, 255, 0.03);
    background: #202229;
    color: #ffffffb3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    height: 2.14285714em;
    line-height: 2.14285714em;
    padding: 0 .57142857em
}

@media (min-width:750px) {
    .tax-allcats .allcats-items .item-link {
        height: 2.42857143em;
        line-height: 2.42857143em;
        padding: 0 1.07142857em
    }
}

.tax-allcats .allcats-items .item-link:hover {
    color: #77f8d3;
    border-color: #77f8d3
}

.tax-allcats .allcats-items .item-link .title {
    font-weight: normal;
    white-space: nowrap
}

.tax-subcats {
    margin-bottom: .4rem
}

.tax-subcats .subcats-items .item {
    display: inline-block;
    margin-right: .2rem;
    margin-bottom: .05rem
}

.tax-subcats .subcats-items .item.current .item-link {
    color: #77f8d3
}

.tax-subcats .subcats-items .item.current .item-link::before {
    background: -webkit-gradient(linear, left top, right top, color-stop(2.82%, #00d5d9), color-stop(97.18%, #77f8d3));
    background: -webkit-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: -moz- oldlinear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: -o-linear-gradient(left, #00d5d9 2.82%, #77f8d3 97.18%);
    background: linear-gradient(90deg, #00d5d9 2.82%, #77f8d3 97.18%)
}

.tax-subcats .subcats-items .item-link {
    display: block;
    background: #181a1e;
    color: #ffffff73;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 1.85714286em;
    line-height: 1.85714286em;
    -webkit-border-radius: .06rem;
    -moz-border-radius: .06rem;
    border-radius: .06rem;
    padding: 0 .1rem;
    position: relative
}

.tax-subcats .subcats-items .item-link::before {
    z-index: -1;
    content: '';
    position: absolute;
    left: -1px;
    top: -1px;
    right: -1px;
    bottom: -1px;
    -webkit-border-radius: .06rem;
    -moz-border-radius: .06rem;
    border-radius: .06rem
}

.tax-subcats .subcats-items .item-link:hover {
    color: #77f8d3
}

.tax-subcats .subcats-items .item-link .title {
    position: relative;
    font-weight: normal
}

@media (max-width:749.5px) {
    .tax-subcats .subcats-items {
        padding: 1px;
        white-space: nowrap;
        overflow-y: hidden;
        overflow-x: auto
    }

    .tax-subcats .subcats-items::-webkit-scrollbar {
        display: none
    }

    .tax-subcats .subcats-items .item {
        font-size: .28rem
    }
}

.tax-post-item {
    padding: 1px;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    position: relative;
    min-width: 0
}

@media (min-width:750px) {
    .tax-post-item {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

@media (hover:hover) and (pointer:fine) {
    .tax-post-item:hover .fav-action {
        display: block
    }
}

.tax-post-item .item-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: #25262e;
    position: relative;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
    padding: .15rem .15rem .85714286em .15rem
}

@media (min-width:750px) {
    .tax-post-item .item-wrap {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: 1.71428571em
    }
}

@media (hover:hover) and (pointer:fine) {
    .tax-post-item .item-wrap::before {
        z-index: -1;
        content: '';
        position: absolute;
        left: -1px;
        top: -1px;
        right: -1px;
        bottom: -1px;
        -webkit-border-radius: .57142857em;
        -moz-border-radius: .57142857em;
        border-radius: .57142857em;
        background-color: rgba(255, 255, 255, 0.03)
    }

    .tax-post-item .item-wrap:hover::before {
        background: -webkit-gradient(linear, left top, right top, from(#77f8d3), to(#65a9f3));
        background: -webkit-linear-gradient(left, #77f8d3 0%, #65a9f3 100%);
        background: -moz- oldlinear-gradient(left, #77f8d3 0%, #65a9f3 100%);
        background: -o-linear-gradient(left, #77f8d3 0%, #65a9f3 100%);
        background: linear-gradient(90deg, #77f8d3 0%, #65a9f3 100%)
    }

    .tax-post-item .item-wrap:hover .p-title {
        color: #fff
    }

    .tax-post-item .item-wrap:hover .item-cover .thumb {
        -webkit-transform: scale(1.05);
        -moz-transform: scale(1.05);
        -ms-transform: scale(1.05);
        -o-transform: scale(1.05);
        transform: scale(1.05)
    }
}

@media (hover:hover) and (pointer:fine) and (min-width:750px) {
    .tax-post-item .item-wrap::before {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.tax-post-item .item-cover {
    overflow: hidden;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    display: block;
    margin-bottom: .2rem
}

@media (min-width:750px) {
    .tax-post-item .item-cover {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.tax-post-item .item-cover .thumb {
    padding-top: 66.4%
}

.tax-post-item .item-content {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0
}

.tax-post-item .item-title {
    margin-bottom: .2rem;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.tax-post-item .item-title-a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .12rem
}

.tax-post-item .post-logo {
    width: .74rem;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    overflow: hidden;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (min-width:750px) {
    .tax-post-item .post-logo {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        width: 3em
    }
}

.tax-post-item .p-title {
    color: #ffffffd9;
    margin-bottom: .28571429em
}

.tax-post-item .p-title .title-text {
    font-size: 107.14285714%
}

@media (min-width:750px) {
    .tax-post-item .p-title {
        margin-bottom: 0
    }

    .tax-post-item .p-title .title-text {
        font-size: .36rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .tax-post-item .p-title .title-text {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.tax-post-item .subtitle {
    color: #ffffff73
}

.tax-post-item .subtitle .subtitle-text {
    font-size: 71.42857143%;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

@media (min-width:750px) {
    .tax-post-item .subtitle .subtitle-text {
        font-size: .24rem;
        max-width: 14em
    }
}

@media (min-width:750px) and (min-width:750px) {
    .tax-post-item .subtitle .subtitle-text {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.tax-post-item .item-labels {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: .71428571em;
    margin-bottom: .12rem
}

.tax-post-item .item-label {
    background: #353841;
    color: #ffffffa6;
    line-height: 1.42857143em;
    padding: 0 .57142857em;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    max-width: 15em
}

@media (min-width:750px) {
    .tax-post-item .item-label {
        line-height: 1.57142857em
    }
}

.tax-post-item .item-label .btn-content {
    gap: .28571429em
}

.tax-post-item .item-label .txt,
.tax-post-item .item-label .icon {
    font-size: 71.42857143%
}

@media (min-width:750px) {

    .tax-post-item .item-label .txt,
    .tax-post-item .item-label .icon {
        font-size: .24rem
    }
}

@media (min-width:750px) and (min-width:750px) {

    .tax-post-item .item-label .txt,
    .tax-post-item .item-label .icon {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.tax-post-item .item-label .txt {
    max-width: 15em;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.tax-post-item .label-style-1 {
    background-color: #343732;
    color: #afbe70
}

.tax-post-item .label-style-2 {
    background-color: #362f33;
    color: #be7d7b
}

.tax-post-item .label-style-3 {
    background-color: #293739;
    color: #60bea5
}

.tax-post-item .label-style-4 {
    background-color: #362f38;
    color: #af7c95
}

.tax-post-item .label-a:hover {
    background: #77f8d3;
    color: #25262e
}

.tax-post-item .item-excerpt {
    color: #e7edf080;
    line-height: .32rem;
    margin-bottom: .25rem
}

.tax-post-item .item-excerpt p {
    font-size: 71.42857143%
}

@media (min-width:750px) {
    .tax-post-item .item-excerpt {
        line-height: 1.42857143em;
        height: 2.85714286em;
        overflow: hidden
    }

    .tax-post-item .item-excerpt p {
        font-size: .24rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .tax-post-item .item-excerpt p {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.tax-post-item .excerpt-text {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.tax-post-item .item-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: .71428571em;
    color: #ffffff73
}

.tax-post-item .item-meta .meta-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em
}

.tax-post-item .fav-action {
    position: absolute;
    top: 100%;
    right: 0;
    display: none
}

@media (min-width:750px) {
    .tax-post-item .fav-action {
        padding-top: .71428571em
    }
}

.tax-post-item .fav-action .btn {
    border: 1px solid #00ffd1;
    color: #00ffd1;
    font-size: .28rem;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
    padding: 0 .83333333em;
    line-height: 1.66666667em
}

@media (min-width:750px) {
    .tax-post-item .fav-action .btn {
        font-size: clamp(14px, .7292vw, 18px)
    }
}

@media (min-width:750px) {
    .tax-post-item .fav-action .btn {
        font-size: .24rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .tax-post-item .fav-action .btn {
        font-size: clamp(12px, .625vw, 14px)
    }
}

@media (hover:hover) and (pointer:fine) {
    .tax-post-item .fav-action .btn:hover {
        background: #00ffd1;
        color: #202228
    }
}

@media (max-width:749.5px) {

    .tax-post-item .p-title,
    .tax-post-item .subtitle {
        line-height: .37rem;
        height: .37rem;
        overflow: hidden;
        margin-bottom: 0
    }

    .tax-post-item .item-excerpt {
        margin-bottom: 0
    }

    .tax-post-item .item-meta {
        display: none
    }
}

.tax-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .2rem
}

@media (min-width:750px) {
    .tax-list {
        grid-template-columns: repeat(auto-fill, minmax(17.85714286em, 1fr));
        gap: .3rem
    }
}

.home-btns {
    text-align: center;
    padding: .3rem 0 0
}

.home-btns .info {
    margin-bottom: .2rem;
    color: #ffffffb3
}

.home-btns .num {
    color: #77f8d3
}

.home-btns .btn {
    display: block;
    line-height: 3.42857143em;
    background: #00ffd1;
    color: #000
}

@media (min-width:750px) {
    .home-btns .btn {
        display: inline-block;
        padding: 0 2.71428571em
    }
}

.home-btns .btn .icon {
    color: #000
}

.home-btns .btn .txt {
    font-weight: bold
}

@media (min-width:750px) {
    .home-btns .btn:hover {
        background-color: #66ffe3
    }
}

.home-slide {
    margin-bottom: .3rem
}

.home-slide .slide-in {
    position: relative;
    padding-top: 24.46982055%;
    overflow: hidden;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em
}

@media (min-width:750px) {
    .home-slide .slide-in {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.home-slide .g-slide {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.home-slide .g-slide .s1-item {
    display: block
}

@media (hover:hover) and (pointer:fine) {
    .home-slide .g-slide:hover .g-slide-btns {
        display: block
    }

    .home-slide .g-slide:hover .g-slide-indexes,
    .home-slide .g-slide:hover .g-slide-btns {
        background: rgba(55, 55, 55, 0.2)
    }
}

.home-slide a {
    display: block
}

.home-slide .g-slide-extra {
    position: absolute;
    right: .71428571em;
    bottom: .71428571em;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.home-slide .g-slide-btns {
    display: none
}

.home-slide .s1-item .thumb {
    padding-top: 24.46982055%
}

@media (max-width:749.5px) {
    .home-slide {
        margin-left: -0.2rem;
        margin-right: -0.2rem
    }

    .home-slide .slide-in {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0
    }

    .home-slide .g-slide-extra {
        display: none
    }
}

.home-news {
    margin-bottom: .3rem;
    min-height: .46rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: .2rem
}

.home-news .n-title {
    color: #00ffd1;
    white-space: nowrap;
    font-size: .64rem;
    display: none
}

@media (min-width:750px) {
    .home-news .n-title {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

@media (min-width:1000px) {
    .home-news .n-title {
        display: block
    }
}

.home-news .uisdc-news {
    display: block;
    padding: .06rem .15rem .06rem .3rem;
    border: 1px solid #ffffff05;
    background: #202228;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    color: #ffffffb3
}

@media (max-width:999.5px) {
    .home-news .uisdc-news {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        -webkit-border-radius: .57142857em;
        -moz-border-radius: .57142857em;
        border-radius: .57142857em
    }
}

.home-news .uisdc-news:hover {
    background: #2c2d36
}

.home-news .uisdc-news:hover .uisdc-news__content::after {
    background: -webkit-gradient(linear, left top, right top, from(transparent), to(#2c2d36));
    background: -webkit-linear-gradient(left, transparent, #2c2d36);
    background: -moz- oldlinear-gradient(left, transparent, #2c2d36);
    background: -o-linear-gradient(left, transparent, #2c2d36);
    background: linear-gradient(to right, transparent, #2c2d36)
}

.home-news .un-wrap {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    line-height: 1.85714286em;
    gap: .71428571em
}

.home-news .uisdc-news__title,
.home-news .uisdc-news__more {
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.home-news .uisdc-news__title .title,
.home-news .uisdc-news__more .title {
    white-space: nowrap
}

.home-news .uisdc-news__title {
    background: #00ffd1;
    -webkit-border-radius: .06rem;
    -moz-border-radius: .06rem;
    border-radius: .06rem;
    padding: 0 .42857143em 0 1.14285714em;
    color: #181a1e
}

@media (min-width:750px) {
    .home-news .uisdc-news__title {
        padding-left: 1.42857143em
    }
}

.home-news .ico-img {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    width: 1.85714286em
}

@media (min-width:750px) {
    .home-news .ico-img {
        width: 2em
    }
}

.home-news .uisdc-news__more {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ffffffb3
}

.home-news .uisdc-news__more .icon::before {
    font-size: .24rem
}

@media (min-width:750px) {
    .home-news .uisdc-news__more .icon::before {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.home-news .uisdc-news__content {
    position: relative;
    overflow: hidden
}

@media (max-width:999.5px) {
    .home-news .uisdc-news__content {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }
}

.home-news .uisdc-news__content::after {
    content: '';
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 3.28571429em;
    background: -webkit-gradient(linear, left top, right top, from(transparent), to(#202228));
    background: -webkit-linear-gradient(left, transparent, #202228);
    background: -moz- oldlinear-gradient(left, transparent, #202228);
    background: -o-linear-gradient(left, transparent, #202228);
    background: linear-gradient(to right, transparent, #202228)
}

.home-news .uisdc-news__content .li-item {
    white-space: nowrap
}

.home-news .uisdc-news-slide {
    height: 1.85714286em;
    width: 100%;
    position: relative
}

@media (min-width:1000px) {
    .home-news .uisdc-news-slide {
        width: 28em
    }
}

.home-news .list-enter-active,
.home-news .list-leave-active {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease
}

@media (max-width:749.5px) {
    .home-news .uisdc-news {
        padding-left: .4rem;
        padding-right: .15rem
    }

    .home-news .uisdc-news__title .title,
    .home-news .li-item {
        font-size: .24rem
    }
}

@media (max-width:749.5px) and (min-width:750px) {

    .home-news .uisdc-news__title .title,
    .home-news .li-item {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.home-posts {
    margin-top: .8rem
}

.home-posts .posts-title {
    margin-bottom: .3rem;
    color: #00ffd1
}

.home-posts .posts-title .title {
    font-size: .52rem
}

@media (min-width:750px) {
    .home-posts .posts-title .title {
        font-size: clamp(26px, 1.3542vw, 30px)
    }
}

@media (min-width:750px) {
    .home-posts .posts-title .title {
        font-size: .64rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .home-posts .posts-title .title {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

.home-posts .posts-item .item-wrap .p-title {
    color: #a9a9ad
}

@media (hover:hover) and (pointer:fine) {
    .home-posts .posts-item .item-wrap:hover .p-title {
        color: #fff
    }
}

.home-posts .posts-item .p-title {
    line-height: 1.71428571em;
    height: 3.42857143em;
    overflow: hidden
}

.home-posts .posts-item .p-title .title-text {
    font-size: .32rem;
    font-weight: normal
}

@media (min-width:750px) {
    .home-posts .posts-item .p-title .title-text {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.home-posts .posts-item .meta-author {
    min-width: 0
}

.home-posts .posts-item .meta-author .avatar {
    width: 1.57142857em;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: none
}

@media (min-width:750px) {
    .home-posts .posts-item .meta-author .avatar {
        display: block
    }
}

.home-posts .posts-item .meta-author .txt {
    white-space: nowrap;
    overflow: hidden;
    max-width: 6em;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-size: .24rem
}

@media (min-width:750px) {
    .home-posts .posts-item .meta-author .txt {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.home-posts .posts-item .item-cover {
    -webkit-border-radius: none;
    -moz-border-radius: none;
    border-radius: none
}

.home-posts .posts-item .item-cover-a {
    display: block;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    overflow: hidden
}

@media (min-width:750px) {
    .home-posts .posts-item .item-cover-a {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.home-posts .posts-item .meta-tag .btn,
.home-posts .posts-item .meta-label .btn {
    padding: 0 .42857143em;
    color: #ffffff73;
    background: #353841;
    line-height: 1.57142857em;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em
}

.home-posts .posts-item .meta-tag .btn .icon,
.home-posts .posts-item .meta-label .btn .icon {
    font-size: .24rem
}

@media (min-width:750px) {

    .home-posts .posts-item .meta-tag .btn .icon,
    .home-posts .posts-item .meta-label .btn .icon {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.home-posts .posts-item .meta-tag .btn .txt,
.home-posts .posts-item .meta-label .btn .txt {
    font-size: .24rem
}

@media (min-width:750px) {

    .home-posts .posts-item .meta-tag .btn .txt,
    .home-posts .posts-item .meta-label .btn .txt {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.home-posts .posts-item .meta-label .btn {
    background: #77f8d31a;
    color: #77f8d3
}

.home-posts .hide-item {
    display: none
}

@media (max-width:749.5px) {
    .home-posts .posts-item .p-title {
        line-height: 1.42857143em;
        height: 2.85714286em
    }

    .home-posts .posts-item .p-title .title-text {
        font-size: 100%
    }

    .home-posts .posts-item .meta-label .txt,
    .home-posts .posts-item .meta-author .txt {
        font-size: 71.42857143%
    }

    .home-posts .posts-item .meta-tag .btn .icon,
    .home-posts .posts-item .meta-label .btn .icon,
    .home-posts .posts-item .meta-tag .btn .tag-hash,
    .home-posts .posts-item .meta-label .btn .tag-hash,
    .home-posts .posts-item .meta-tag .btn .txt,
    .home-posts .posts-item .meta-label .btn .txt {
        font-size: 71.42857143%
    }

    .home-posts .item-meta {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }
}

.home-list .hide-item {
    display: none
}

.rank-post-item {
    padding: 1.42857143em 1.07142857em;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    border: 1px solid #ffffff14;
    background: #2c2d3666
}

@media (min-width:750px) {
    .rank-post-item {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: 2.85714286em 2.14285714em
    }
}

@media (hover:hover) and (pointer:fine) {
    .rank-post-item:hover {
        background: -webkit-gradient(linear, left top, left bottom, from(#2b444765), color-stop(50%, #171c2433), to(#18212957));
        background: -webkit-linear-gradient(top, #2b444765 0%, #171c2433 50%, #18212957 100%);
        background: -moz- oldlinear-gradient(top, #2b444765 0%, #171c2433 50%, #18212957 100%);
        background: -o-linear-gradient(top, #2b444765 0%, #171c2433 50%, #18212957 100%);
        background: linear-gradient(180deg, #2b444765 0%, #171c2433 50%, #18212957 100%)
    }

    .rank-post-item:hover .item-meta {
        grid-template-columns: 1fr
    }

    .rank-post-item:hover .item-meta .meta-item {
        display: none
    }

    .rank-post-item:hover .item-meta .btn-open {
        display: block
    }
}

.rank-post-item .item-wrap {
    display: grid;
    grid-template-columns: 1.92857143em 1fr;
    gap: 1.07142857em
}

@media (min-width:750px) {
    .rank-post-item .item-wrap {
        grid-template-columns: 2.85714286em 1fr;
        grid-template-columns: 2.85714286em 1fr 5.71428571em;
        gap: 1.78571429em
    }
}

@media (min-width:1000px) {
    .rank-post-item .item-wrap {
        grid-template-columns: 2.85714286em 1fr 12.85714286em
    }
}

.rank-post-item .item-index {
    height: 100%
}

.rank-post-item .item-content {
    display: grid;
    grid-template-columns: 3.57142857em 1fr;
    gap: 1.07142857em;
    -webkit-box-pack: start;
    -webkit-justify-content: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start
}

@media (min-width:750px) {
    .rank-post-item .item-content {
        gap: 2.14285714em;
        grid-template-columns: 5.71428571em 1fr
    }
}

.rank-post-item .index,
.rank-post-item .item-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    height: 3.57142857em
}

@media (min-width:750px) {

    .rank-post-item .index,
    .rank-post-item .item-meta {
        height: 5.71428571em
    }
}

.rank-post-item .index {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.rank-post-item .index .icon {
    display: block;
    background-color: #8f9aaf;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent
}

.rank-post-item .index .icon::before {
    font-size: 192.85714286%;
    line-height: 1
}

@media (min-width:750px) {
    .rank-post-item .index .icon::before {
        font-size: 257.14285714%
    }
}

.rank-post-item .index .txt {
    position: absolute;
    left: 50%;
    top: 48%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 92.85714286%;
    color: #fff;
    font-weight: bold
}

@media (min-width:750px) {
    .rank-post-item .index .txt {
        font-size: 128.57142857%
    }
}

.rank-post-item .index-01 .icon,
.rank-post-item .index-02 .icon,
.rank-post-item .index-03 .icon {
    background-image: -webkit-linear-gradient(230.22deg, #ffdd9a -1.26%, #ffc552 100.56%);
    background-image: -moz- oldlinear-gradient(230.22deg, #ffdd9a -1.26%, #ffc552 100.56%);
    background-image: -o-linear-gradient(230.22deg, #ffdd9a -1.26%, #ffc552 100.56%);
    background-image: linear-gradient(219.78deg, #ffdd9a -1.26%, #ffc552 100.56%)
}

.rank-post-item .index-01 .txt,
.rank-post-item .index-02 .txt,
.rank-post-item .index-03 .txt {
    color: #4e2d03
}

.rank-post-item .post-logo {
    height: 100%
}

.rank-post-item .post-logo .item-thumb-a {
    display: block;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    overflow: hidden;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (min-width:750px) {
    .rank-post-item .post-logo .item-thumb-a {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.rank-post-item .p-title {
    margin-bottom: .57142857em
}

@media (min-width:750px) {
    .rank-post-item .p-title {
        margin-bottom: 1.14285714em
    }
}

.rank-post-item .p-title .item-title-a {
    display: block
}

.rank-post-item .p-title .title-text {
    color: #ffffffd9;
    font-size: .36rem;
    line-height: 1.25em
}

@media (min-width:750px) {
    .rank-post-item .p-title .title-text {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

@media (min-width:750px) {
    .rank-post-item .p-title .title-text {
        font-size: .48rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .rank-post-item .p-title .title-text {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

.rank-post-item .item-excerpt .excerpt-text {
    color: #b1b2b4;
    line-height: 1.78571429em;
    max-height: 3.57142857em;
    overflow: hidden
}

@media (max-width:749.5px) {
    .rank-post-item .item-excerpt .excerpt-text {
        font-size: 92.85714286%
    }
}

.rank-post-item .item-labels .item-label {
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: .71428571em;
    margin-bottom: .71428571em;
    line-height: 1em
}

@media (min-width:750px) {
    .rank-post-item .item-labels .item-label {
        line-height: 1.71428571em;
        -webkit-border-radius: .42857143em;
        -moz-border-radius: .42857143em;
        border-radius: .42857143em;
        padding: 0 .57142857em;
        border: 1px solid #ffffff0d;
        background: #3538414d;
        margin-right: 1.07142857em;
        margin-bottom: 1.07142857em
    }
}

.rank-post-item .item-labels .item-label .btn-content {
    gap: .35714286em
}

.rank-post-item .item-labels .item-label .icon,
.rank-post-item .item-labels .item-label .txt {
    color: #ffffffa6;
    white-space: nowrap;
    font-size: 92.85714286%
}

@media (min-width:750px) {

    .rank-post-item .item-labels .item-label .icon,
    .rank-post-item .item-labels .item-label .txt {
        font-size: 92.85714286%
    }
}

@media (max-width:749.5px) {
    .rank-post-item .item-labels .item-label {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0
    }

    .rank-post-item .item-labels .item-label .btn-content {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0
    }
}

.rank-post-item .item-labels .label-a:hover {
    border-color: #fff;
    background: #35384166
}

.rank-post-item .item-labels .label-a:hover .txt {
    color: #fff
}

.rank-post-item .item-labels .label-step {
    text-transform: uppercase
}

@media (min-width:750px) {
    .rank-post-item .item-labels .label-step {
        background: #293739;
        border-color: #149B85
    }
}

.rank-post-item .item-labels .label-step .txt {
    color: #0AFFD1
}

.rank-post-item .item-labels .label-rank {
    display: inline-block
}

@media (min-width:750px) {
    .rank-post-item .item-labels .label-rank {
        display: none
    }
}

.rank-post-item .item-labels .label-cat {
    display: none
}

@media (min-width:750px) {
    .rank-post-item .item-labels .label-cat {
        display: inline-block
    }
}

.rank-post-item .meta-item {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: 1px solid #ffffff1a;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.rank-post-item .meta-item .icon {
    color: #00FFD1;
    margin-bottom: .42857143em;
    padding-top: .42857143em
}

.rank-post-item .meta-item .icon::before {
    font-size: 142.85714286%
}

.rank-post-item .meta-item .txt {
    color: #8a8a8a
}

.rank-post-item .item-meta {
    display: none;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.42857143em
}

@media (min-width:750px) {
    .rank-post-item .item-meta {
        display: grid;
        grid-template-columns: 1fr
    }
}

.rank-post-item .item-meta .meta-analytics {
    display: none
}

@media (min-width:1000px) {
    .rank-post-item .item-meta {
        grid-template-columns: repeat(2, 1fr)
    }

    .rank-post-item .item-meta .meta-analytics {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }
}

.rank-post-item .item-meta .btn-open {
    display: none;
    width: 100%;
    text-align: center;
    line-height: 3.85714286em;
    color: #000;
    background: #00ffd1;
    -webkit-border-radius: .71428571em;
    -moz-border-radius: .71428571em;
    border-radius: .71428571em
}

@media (max-width:749.5px) {
    .rank-post-item .item-labels {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: .71428571em;
        margin-bottom: .71428571em
    }

    .rank-post-item .item-labels .item-label {
        margin: 0;
        line-height: 1.1
    }

    .rank-post-item .item-labels .label-step {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0
    }

    .rank-post-item .item-labels .label-rank {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }

    .rank-post-item .item-labels .label-rank .btn-content {
        -webkit-box-pack: start;
        -webkit-justify-content: start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: start
    }
}

.rank-list .rank-post-item {
    margin-bottom: 1.07142857em
}

@media (min-width:750px) {
    .rank-list .rank-post-item {
        margin-bottom: 2.14285714em
    }
}

.rank-tabs {
    margin-bottom: 1.07142857em
}

@media (min-width:750px) {
    .rank-tabs {
        margin-bottom: 2.14285714em
    }
}

.rank-tabs .tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .71428571em
}

@media (min-width:750px) {
    .rank-tabs .tabs {
        gap: 1.42857143em
    }
}

.rank-tabs .tab {
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #2c2d3666;
    border: 1px solid #ffffff0a;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1.07142857em;
    position: relative;
    color: rgba(255, 255, 255, 0.8)
}

@media (min-width:750px) {
    .rank-tabs .tab {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: 2.14285714em
    }
}

.rank-tabs .tab.current {
    border-color: #11564c;
    background: #162b2b;
    color: #00ffd1
}

.rank-tabs .tab.current .tab-description {
    color: #7abab2
}

.rank-tabs .tab.current::after,
.rank-tabs .tab.current::before {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.rank-tabs .tab.current::before {
    border: .57142857em solid transparent;
    border-top-color: #11564c
}

.rank-tabs .tab.current::after {
    border: .5em solid transparent;
    border-top-color: #162b2b
}

@media (hover:hover) and (pointer:fine) {
    .rank-tabs .tab:not(.current):hover {
        color: #fff;
        border-color: #4A4C51
    }
}

.rank-tabs .tab-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .35714286em;
    margin-bottom: .71428571em
}

.rank-tabs .tab-title .icon::before {
    font-size: 142.85714286%
}

.rank-tabs .tab-title .title {
    font-size: 171.42857143%
}

.rank-tabs .tab-description {
    color: rgba(255, 255, 255, 0.45)
}

@media (max-width:1000px) {
    .rank-tabs .tab-title {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-bottom: 0;
        gap: .71428571em
    }

    .rank-tabs .tab-title .icon::before {
        font-size: 214.28571429%
    }

    .rank-tabs .tab-title .title {
        font-size: 142.85714286%
    }

    .rank-tabs .tab-description {
        display: none
    }
}

@media (max-width:749.5px) {
    .rank-tabs .tab-title {
        gap: .42857143em
    }

    .rank-tabs .tab-title .icon::before {
        font-size: 171.42857143%
    }

    .rank-tabs .tab-title .title {
        font-size: 114.28571429%
    }
}

.search-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: .3rem;
    margin-bottom: .3rem
}

.search-row:first-child {
    -webkit-box-align: end;
    -webkit-align-items: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: end
}

.search-row:last-child {
    margin-bottom: 0
}

@media (min-width:1280px) {
    .search-row {
        grid-template-columns: 1fr clamp(280px, 20vw, 480px)
    }
}

.search-row .post-main {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.search-row .post-sidebar {
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative
}

.search-row .post-sidebar .widget {
    margin-bottom: .3rem
}

.search-row .post-sidebar .widget:last-child {
    margin-bottom: 0
}

.search-header .title-s {
    display: inline-block;
    max-width: 8em;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    vertical-align: middle
}

.search-post-item {
    padding: .4rem;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    border: 1px solid #ffffff14;
    background: #2c2d3666;
    display: block
}

@media (min-width:750px) {
    .search-post-item {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: .4rem .45rem
    }
}

.search-post-item:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#2b444765), color-stop(50%, #171c2433), to(#18212957));
    background: -webkit-linear-gradient(top, #2b444765 0%, #171c2433 50%, #18212957 100%);
    background: -moz- oldlinear-gradient(top, #2b444765 0%, #171c2433 50%, #18212957 100%);
    background: -o-linear-gradient(top, #2b444765 0%, #171c2433 50%, #18212957 100%);
    background: linear-gradient(180deg, #2b444765 0%, #171c2433 50%, #18212957 100%)
}

.search-post-item .highlight::before {
    top: 80%
}

.search-post-item .item-wrap {
    display: grid;
    grid-template-columns: 5.71428571em 1fr;
    gap: .4rem;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

@media (min-width:1000px) {
    .search-post-item .item-wrap {
        grid-template-columns: 5.71428571em 1fr 15em
    }
}

.search-post-item .post-logo {
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    overflow: hidden
}

@media (min-width:750px) {
    .search-post-item .post-logo {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.search-post-item .p-title {
    margin-bottom: .2rem
}

.search-post-item .p-title .title-text {
    color: #fff;
    font-size: .36rem;
    display: block;
    line-height: 1
}

@media (min-width:750px) {
    .search-post-item .p-title .title-text {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

@media (min-width:750px) {
    .search-post-item .p-title .title-text {
        font-size: .48rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .search-post-item .p-title .title-text {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

.search-post-item .item-excerpt .excerpt-text {
    color: #b1b2b4;
    line-height: 1.78571429em;
    max-height: 3.57142857em;
    overflow: hidden
}

.search-post-item .item-labels .item-label {
    display: inline-block;
    line-height: 1.42857143em;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    padding: 0 .57142857em;
    border: 1px solid #ffffff0d;
    background: #3538414d;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: .15rem;
    margin-bottom: .15rem
}

@media (min-width:750px) {
    .search-post-item .item-labels .item-label {
        line-height: 1.71428571em
    }
}

.search-post-item .item-labels .item-label .btn-content {
    gap: .05rem
}

.search-post-item .item-labels .item-label .icon,
.search-post-item .item-labels .item-label .txt {
    color: #ffffffa6;
    white-space: nowrap;
    font-size: 85.71428571%
}

.search-post-item .item-labels .label-step {
    text-transform: uppercase;
    background: #293739;
    border-color: #149B85
}

.search-post-item .item-labels .label-step .txt {
    color: #0AFFD1
}

.search-post-item .item-labels .label-a:hover {
    border-color: #fff;
    background: #35384166
}

.search-post-item .item-labels .label-a:hover .txt {
    color: #fff
}

.search-post-item .post-cover {
    display: none
}

@media (min-width:1000px) {
    .search-post-item .post-cover {
        display: block
    }
}

@media (max-width:749.5px) {
    .search-post-item .item-wrap {
        grid-template-columns: 1rem 1fr
    }

    .search-post-item .item-excerpt .excerpt-text {
        font-size: .24rem;
        white-space: nowrap;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 20em
    }
}

.search-list .search-post-item {
    margin-bottom: .3rem
}

.search-list .no-result {
    padding-top: 2.85714286em;
    padding-bottom: 2.85714286em
}

@media (min-width:750px) {
    .search-list .no-result {
        padding-top: 8.57142857em;
        padding-bottom: 8.57142857em
    }
}

@media (hover:hover) and (pointer:fine) {
    .search-list .no-result:hover {
        background: #2c2d3666
    }
}

.search-list .no-result img {
    margin: 0 auto;
    max-width: 880px;
    width: 100%
}

.search-list .no-result .pc-img {
    display: none
}

@media (min-width:750px) {
    .search-list .no-result .pc-img {
        display: block
    }
}

.search-list .no-result .mob-img {
    display: block
}

@media (min-width:750px) {
    .search-list .no-result .mob-img {
        display: none
    }
}

.search-widget {
    background: #2c2d3666;
    border: 1px solid #ffffff0a;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: .4rem
}

@media (min-width:750px) {
    .search-widget {
        padding: .3rem;
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.search-widget .widget-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1.78571429em
}

.search-widget .widget-title .title {
    color: #dddedf;
    font-size: 171.42857143%;
    font-weight: bold
}

.search-widget .widget-title .btn {
    color: #8a8a8a
}

.search-widget .widget-title .btn .btn-content {
    gap: .35714286em
}

.search-widget .widget-title .btn .txt {
    font-size: 107.14285714%
}

@media (hover:hover) and (pointer:fine) {
    .search-widget .widget-title .btn:hover {
        color: #00FFD1
    }
}

.search-widget .no-history {
    text-align: center;
    color: #b5b5b5
}

.search-widget .history-list li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: .71428571em
}

.search-widget .history-list li .s {
    color: #dddedf;
    font-size: 107.14285714%;
    text-decoration: none;
    max-width: 8em;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.search-widget .history-list li .s:hover {
    text-decoration: underline
}

.search-widget .history-list li .time {
    color: #8a8a8a;
    font-size: 92.85714286%
}

.search-widget .history-list li .time .time-date {
    margin-right: .35714286em
}

.search-sidebar .search-widget {
    margin-bottom: .3rem
}

.search-sidebar .search-widget:last-child {
    margin-bottom: 0
}

.search-sidebar .search-fuli {
    padding: 0;
    overflow: hidden
}

.search-sidebar .search-fuli .fuli-item {
    display: none
}

.search-sidebar .search-fuli .fuli-item.show {
    display: block
}

.search-sidebar .search-fuli .fuli-item img {
    width: 100%
}

.search-tags {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .3rem;
    margin-bottom: .3rem
}

@media (min-width:750px) {
    .search-tags {
        gap: 1.42857143em;
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (min-width:1330px) {
    .search-tags {
        grid-template-columns: repeat(6, 1fr)
    }
}

.search-tags .tag {
    display: block;
    border: 1px solid #ffffff0d;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    background: #2c2d3666;
    padding: .3rem .2rem;
    color: #ffffffd9;
    min-width: 0
}

@media (min-width:750px) {
    .search-tags .tag {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.search-tags .tag:hover {
    background: #ffffff0d;
    color: #ffffff
}

.search-tags .tag-meta {
    color: #ffffff73
}

.search-tags .tag-wrap {
    overflow: hidden
}

.search-tags .tag-title {
    font-size: .36rem;
    margin-bottom: .12rem;
    white-space: nowrap
}

@media (min-width:750px) {
    .search-tags .tag-title {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

@media (min-width:750px) {
    .search-tags .tag-title {
        font-size: .4rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .search-tags .tag-title {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

.search-tags .tag-title .hash,
.search-tags .tag-title .title {
    display: inline-block;
    vertical-align: top
}

.search-tags .tag-title .title {
    max-width: 8em;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-weight: bold
}

.search-tags .hash {
    color: #00FFD1;
    margin-right: .42857143em
}

@media (max-width:749.5px) {
    .search-tags .highlight::before {
        top: 75%
    }
}

.search-end {
    text-align: center
}

.search-end .end-txt {
    display: inline-block;
    text-align: center;
    color: #77F8D3;
    background-color: #202C2C;
    -webkit-border-radius: 2.85714286em;
    -moz-border-radius: 2.85714286em;
    border-radius: 2.85714286em;
    line-height: 2.85714286em;
    padding: 0 1.42857143em
}

.search-index .highlight::before {
    background-color: #00fad178
}

.u-part-header {
    background-image: url(../img/center-bg.webp);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    margin-bottom: .3rem;
    position: relative
}

@media (min-width:750px) {
    .u-part-header {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.u-part-header:after,
.u-part-header::before {
    position: absolute;
    content: '';
    top: 0;
    bottom: 0;
    width: 7.14285714em;
    background: -webkit-gradient(linear, left top, right top, from(#181a1e), to(transparent));
    background: -webkit-linear-gradient(left, #181a1e, transparent);
    background: -moz- oldlinear-gradient(left, #181a1e, transparent);
    background: -o-linear-gradient(left, #181a1e, transparent);
    background: linear-gradient(to right, #181a1e, transparent)
}

.u-part-header:after {
    right: 0;
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1)
}

.u-part-header::before {
    left: 0
}

.usercenter-header {
    padding: 2.14285714em 0;
    color: #9a9a9a;
    position: relative;
    z-index: 1
}

@media (min-width:1000px) {
    .usercenter-header {
        padding: 2.85714286em 0 5em;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        gap: 1.78571429em;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

.usercenter-header .usercenter-header-main {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.78571429em;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-bottom: 2.14285714em
}

@media (min-width:1000px) {
    .usercenter-header .usercenter-header-main {
        margin-bottom: 0
    }
}

.usercenter-header .usercenter-header__avatar {
    width: 6.42857143em;
    height: 6.42857143em;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.usercenter-header .usercenter-header__info {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.usercenter-header .avatar {
    border: .35714286em solid #2A2B2C
}

.usercenter-header .usercenter-header__name {
    color: #f9fbfc;
    line-height: 2.14285714em
}

@media (min-width:750px) {
    .usercenter-header .usercenter-header__name {
        line-height: 2.57142857em
    }
}

.usercenter-header .usercenter-header__name .nick {
    font-size: .4rem;
    font-weight: bold
}

@media (min-width:750px) {
    .usercenter-header .usercenter-header__name .nick {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

@media (min-width:750px) {
    .usercenter-header .usercenter-header__name .nick {
        font-size: .48rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .usercenter-header .usercenter-header__name .nick {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

.usercenter-header .usercenter-header__bio {
    margin-bottom: .57142857em
}

@media (min-width:750px) {
    .usercenter-header .usercenter-header__bio {
        margin-bottom: .85714286em
    }
}

.usercenter-header .usercenter-header__settle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.usercenter-header .label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .28571429em .57142857em;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em;
    background: #f9df95;
    color: #202228;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: .28571429em
}

@media (max-width:749.5px) {
    .usercenter-header .label {
        font-size: .24rem;
        padding: .16666667em .5em
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .usercenter-header .label {
        font-size: clamp(12px, .625vw, 14px)
    }
}

.usercenter-header .data-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: .85714286em;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (min-width:1000px) {
    .usercenter-header .data-flex {
        -webkit-box-align: end;
        -webkit-align-items: end;
        -moz-box-align: end;
        -ms-flex-align: end;
        align-items: end;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

.usercenter-header .data-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 7.85714286em;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.usercenter-header .data-value {
    color: #00ffd1;
    font-size: .48rem;
    line-height: 1.25em;
    margin-bottom: .41666667em;
    font-family: OPPOSans, sans-serif;
    font-weight: bold;
    text-transform: uppercase
}

@media (min-width:750px) {
    .usercenter-header .data-value {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

@media (max-width:749.5px) {
    .usercenter-header .data-value {
        font-size: .4rem;
        margin-bottom: .3em
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .usercenter-header .data-value {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

@media (max-width:749.5px) {
    .usercenter-header .data-label {
        font-size: 92.85714286%
    }
}

.usercenter-menu {
    border: 1px solid #ffffff0a;
    background: #2c2d3666;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: .85714286em 1.42857143em;
    position: relative;
    z-index: 1
}

@media (min-width:750px) {
    .usercenter-menu {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.usercenter-menu .menu-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2.85714286em
}

.usercenter-menu .menu-item {
    line-height: 2.85714286em;
    padding: 0 1.07142857em;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    color: #a9a9ad
}

@media (min-width:750px) {
    .usercenter-menu .menu-item {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

@media (hover:hover) and (pointer:fine) {
    .usercenter-menu .menu-item:hover {
        color: #00ffd1
    }
}

.usercenter-menu .menu-item.active {
    color: #202228;
    background: #00ffd1
}

.usercenter-menu .menu-item .btn-content {
    gap: .28571429em
}

.usercenter-menu .menu-item .ico {
    display: none
}

@media (min-width:750px) {
    .usercenter-menu .menu-item .ico {
        display: block;
        height: 1em
    }

    .usercenter-menu .menu-item .ico img {
        height: 100%;
        width: auto
    }
}

@media (max-width:749.5px) {
    .usercenter-menu {
        padding: .85714286em
    }

    .usercenter-menu .menu-flex {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: .71428571em
    }

    .usercenter-menu .menu-item {
        line-height: 1.42857143em;
        min-width: 0;
        padding: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0
    }

    .usercenter-menu .menu-item.active {
        background-color: transparent;
        color: #00ffd1
    }

    .usercenter-menu .menu-item .btn-content {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: .42857143em
    }

    .usercenter-menu .menu-item .txt {
        font-size: 92.85714286%
    }

    .usercenter-menu .menu-item .icon::before {
        font-size: .4rem;
        line-height: 1.1
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .usercenter-menu .menu-item .icon::before {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

.usercenter-no-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 50vh
}

.usercenter-no-content .title {
    text-align: center;
    color: #b1b2b4;
    margin-bottom: 2.14285714em;
    line-height: 1.78571429em
}

.usercenter-no-content .btn {
    padding: 0 4.28571429em;
    line-height: 3.42857143em;
    color: #000;
    background: #00ffd1;
    border: 1px solid #ffffff0d
}

@media (hover:hover) and (pointer:fine) {
    .usercenter-no-content .btn:hover {
        background: #00e6bc
    }
}

.usercenter-setting {
    border: 1px solid #ffffff0a;
    background: #2c2d3666;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 2.14285714em 1.42857143em
}

@media (min-width:750px) {
    .usercenter-setting {
        padding: 4.28571429em
    }
}

.usercenter-setting .alert-info {
    margin-bottom: 3.57142857em;
    color: #f9df95;
    background-color: #f9df950d;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1.14285714em 1.42857143em;
    border: 1px solid #f9df951a
}

@media (min-width:750px) {
    .usercenter-setting .alert-info {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.usercenter-setting .setting-blocks {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2.14285714em
}

@media (min-width:1100px) {
    .usercenter-setting .setting-blocks {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -moz-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        gap: 8.57142857em
    }
}

.usercenter-setting .setting-main {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%
}

.usercenter-setting .setting-avatar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.usercenter-setting .user-avatar {
    width: 8.57142857em;
    margin-bottom: 1.42857143em
}

.usercenter-setting .avatar-btns {
    width: 100%
}

.usercenter-setting .avatar-btns .btn {
    border: 1px solid #00ffd1;
    line-height: 2.57142857em;
    color: #00ffd1;
    display: block;
    text-align: center
}

@media (hover:hover) and (pointer:fine) {
    .usercenter-setting .avatar-btns .btn:hover {
        background-color: #00ffd1;
        color: #000
    }
}

.usercenter-setting .setting-item {
    margin-bottom: 2.14285714em
}

.usercenter-setting .setting-item label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .71428571em
}

.usercenter-setting .item-title {
    width: 6em;
    color: #8f8f8f
}

.usercenter-setting .item-option {
    width: 28.57142857em
}

.usercenter-setting .long-option {
    width: clamp(28.57142857em, 33.3333vw, 57.14285714em)
}

.usercenter-setting .p-option {
    color: #00ffd1
}

.usercenter-setting .item-btn {
    background: #00ffd1;
    color: #202228;
    width: 9.85714286em;
    text-align: center;
    line-height: 3.14285714em
}

@media (hover:hover) and (pointer:fine) {
    .usercenter-setting .item-btn:hover {
        background: #00cca7
    }
}

.usercenter-setting .item-btn.btn-loading {
    background: #ffffff1a;
    color: #ffffff73;
    pointer-events: none
}

.usercenter-setting .setting-val {
    display: block;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    font-size: inherit;
    border: 1px solid #ffffff0d;
    background: #f2f2f20d;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 1em 1.42857143em;
    line-height: 1.71428571em;
    width: 100%;
    outline: none;
    color: #ffffff73
}

@media (min-width:750px) {
    .usercenter-setting .setting-val {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.usercenter-setting .setting-val::-webkit-input-placeholder {
    color: #ffffff23
}

.usercenter-setting .setting-val::-moz-placeholder {
    color: #ffffff23
}

.usercenter-setting .setting-val::-ms-input-placeholder {
    color: #ffffff23
}

.usercenter-setting .setting-val::placeholder {
    color: #ffffff23
}

.usercenter-setting .setting-val:focus {
    color: #fff;
    border-color: #00ffd1;
    background-color: #f2f2f21d
}

.usercenter-setting .setting-val.not-empty:placeholder-shown {
    border-color: #FF97AF;
    background-color: #f2f2f22d
}

.usercenter-setting .setting-val.not-empty:placeholder-shown::-webkit-input-placeholder {
    color: #FF97AF
}

.usercenter-setting .setting-val.not-empty:placeholder-shown::-moz-placeholder {
    color: #FF97AF
}

.usercenter-setting .setting-val.not-empty:placeholder-shown::-ms-input-placeholder {
    color: #FF97AF
}

.usercenter-setting .setting-val.not-empty:placeholder-shown::placeholder {
    color: #FF97AF
}

.usercenter-provide-item {
    background: #2c2d3666;
    border: 1px solid #ffffff0a;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: .4rem
}

@media (min-width:750px) {
    .usercenter-provide-item {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

@media (hover:hover) and (pointer:fine) {
    .usercenter-provide-item:hover {
        border-color: #00FFD1;
        background-image: url(../img/list-hover-bg.webp);
        background-position: right top;
        background-repeat: no-repeat;
        -webkit-background-size: contain;
        -moz-background-size: contain;
        -o-background-size: contain;
        background-size: contain
    }

    .usercenter-provide-item:hover .item-cover .thumb::after {
        display: none
    }
}

.usercenter-provide-item .item-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative
}

.usercenter-provide-item .item-post {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: .3rem;
    padding-bottom: .3rem
}

@media (min-width:750px) {
    .usercenter-provide-item .item-post {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

.usercenter-provide-item .item-data {
    padding-top: .3rem;
    border-top: 1px solid #24282C
}

.usercenter-provide-item .item-content {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

@media (min-width:750px) {
    .usercenter-provide-item .item-content {
        padding-right: 9.28571429em
    }
}

.usercenter-provide-item .item-cover {
    width: 3.57142857em;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (min-width:750px) {
    .usercenter-provide-item .item-cover {
        width: 6.42857143em
    }
}

.usercenter-provide-item .item-cover .thumb {
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em
}

@media (min-width:750px) {
    .usercenter-provide-item .item-cover .thumb {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.usercenter-provide-item .item-cover .thumb::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.15)
}

.usercenter-provide-item .item-actions {
    z-index: 1
}

@media (min-width:750px) {
    .usercenter-provide-item .item-actions {
        position: absolute;
        right: 0;
        top: 3.21428571em;
        -webkit-transform: translate(0, -50%);
        -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        -o-transform: translate(0, -50%);
        transform: translate(0, -50%);
        width: 8.21428571em
    }
}

.usercenter-provide-item .item-actions .btn {
    display: block;
    line-height: 3.28571429em;
    width: 100%;
    text-align: center;
    color: #181a1e
}

@media (hover:hover) and (pointer:fine) {
    .usercenter-provide-item .item-actions:hover .look-list {
        display: block
    }
}

.usercenter-provide-item .item-title {
    line-height: 1.42857143em;
    margin-bottom: .42857143em
}

@media (min-width:750px) {
    .usercenter-provide-item .item-title {
        line-height: 2.14285714em;
        margin-bottom: .71428571em
    }
}

.usercenter-provide-item .item-title .title {
    color: #dddedf;
    font-size: .36rem
}

@media (min-width:750px) {
    .usercenter-provide-item .item-title .title {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

@media (min-width:750px) {
    .usercenter-provide-item .item-title .title {
        font-size: .48rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .usercenter-provide-item .item-title .title {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

.usercenter-provide-item .item-excerpt {
    color: #b1b2b499;
    line-height: 1.78571429em;
    max-height: 3.57142857em;
    max-width: 60.71428571em;
    overflow: hidden
}

.usercenter-provide-item .data-items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2.14285714em
}

@media (min-width:750px) {
    .usercenter-provide-item .data-items {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (min-width:1000px) {
    .usercenter-provide-item .data-items {
        grid-template-columns: repeat(5, 1fr);
        gap: .71428571em
    }
}

.usercenter-provide-item .data-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    line-height: 2.14285714em
}

.usercenter-provide-item .d-name {
    color: #ffffffcc
}

.usercenter-provide-item .d-value {
    color: #dddedf;
    font-weight: bold;
    text-transform: uppercase;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: .35714286em
}

.usercenter-provide-item .d-value .txt {
    font-size: .4rem
}

@media (min-width:750px) {
    .usercenter-provide-item .d-value .txt {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

.usercenter-provide-item .d-value .help {
    display: block;
    position: relative;
    font-weight: normal
}

.usercenter-provide-item .d-value .help:hover .help-txt {
    display: block
}

.usercenter-provide-item .d-value .help .icon {
    cursor: pointer
}

.usercenter-provide-item .d-value .help-txt {
    font-size: .24rem;
    display: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    -webkit-transform: translate(-50%, -20%);
    -moz-transform: translate(-50%, -20%);
    -ms-transform: translate(-50%, -20%);
    -o-transform: translate(-50%, -20%);
    transform: translate(-50%, -20%);
    background-color: #ffffff99;
    padding: .83333333em 1.25em;
    -webkit-border-radius: .66666667em;
    -moz-border-radius: .66666667em;
    border-radius: .66666667em;
    width: 15.66666667em;
    line-height: 1.66666667em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 10;
    color: #101010
}

@media (min-width:750px) {
    .usercenter-provide-item .d-value .help-txt {
        font-size: clamp(12px, .625vw, 14px)
    }
}

@media (min-width:750px) {
    .usercenter-provide-item .d-value .help-txt {
        -webkit-border-radius: .83333333em;
        -moz-border-radius: .83333333em;
        border-radius: .83333333em
    }
}

.usercenter-provide-item .d-value .help-txt:after {
    content: '';
    position: absolute;
    display: block;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    border-width: .41666667em;
    border-style: solid;
    border-color: #ffffff99 transparent transparent transparent
}

.usercenter-provide-item.item-status-paid .status-color,
.usercenter-provide-item.item-status-approved .status-color {
    color: #00f073
}

.usercenter-provide-item.item-status-paid .status-bg,
.usercenter-provide-item.item-status-approved .status-bg {
    background-color: #00f073
}

.usercenter-provide-item.item-status-paid .help-txt,
.usercenter-provide-item.item-status-approved .help-txt {
    background-color: #BBFFDC
}

.usercenter-provide-item.item-status-paid .help-txt::after,
.usercenter-provide-item.item-status-approved .help-txt::after {
    border-top-color: #BBFFDC
}

.usercenter-provide-item.item-status-pending .status-color {
    color: #f9df95
}

.usercenter-provide-item.item-status-pending .help-txt {
    background-color: #FFE4C1
}

.usercenter-provide-item.item-status-pending .help-txt::after {
    border-top-color: #FFE4C1
}

.usercenter-provide-item.item-status-published .status-color {
    color: #00ffd1
}

.usercenter-provide-item.item-status-published .status-bg {
    background-color: #00ffd1
}

.usercenter-provide-item.item-status-rejected .status-color {
    color: #ff97af
}

.usercenter-provide-item.item-status-rejected .help-txt {
    background-color: #FFE2E8
}

.usercenter-provide-item.item-status-rejected .help-txt::after {
    border-top-color: #FFE2E8
}

.usercenter-provide-item .look-list {
    position: absolute;
    right: 0;
    bottom: 100%;
    padding-bottom: 1.14285714em;
    display: none
}

.usercenter-provide-item .look-list-in {
    background: #2c2f34;
    border: 1px solid #ffffff05;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 1.42857143em
}

@media (min-width:750px) {
    .usercenter-provide-item .look-list-in {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.usercenter-provide-item .look-list-title {
    color: #d2d3d4;
    margin-bottom: 1em
}

.usercenter-provide-item .look-list-items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.42857143em
}

.usercenter-provide-item .look-list-item img {
    max-width: 12.85714286em
}

.usercenter-provide-item .l-item-txt {
    margin-top: .85714286em;
    display: block;
    text-align: center
}

.usercenter-provide-item .l-item-txt .l-btn {
    display: inline-block;
    color: #00ffd1;
    background: #00ffd11a;
    padding: 0 .71428571em;
    line-height: 1.71428571em;
    -webkit-border-radius: .42857143em;
    -moz-border-radius: .42857143em;
    border-radius: .42857143em
}

.usercenter-provide-list .usercenter-provide-item {
    margin-bottom: .3rem
}

.u-part-astro img {
    margin: 0 auto
}

.tuiguang-menu {
    margin-bottom: 2.85714286em
}

.tuiguang-menu .menus {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.42857143em
}

.tuiguang-menu .menu-item {
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #ffffff05;
    background: #2c2d3666;
    padding: 2.14285714em;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    position: relative
}

@media (min-width:750px) {
    .tuiguang-menu .menu-item {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.tuiguang-menu .menu-item.current {
    border-color: #11564c;
    background: #162b2b
}

.tuiguang-menu .menu-item.current::after,
.tuiguang-menu .menu-item.current::before {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.tuiguang-menu .menu-item.current::before {
    border: .57142857em solid transparent;
    border-top-color: #11564c
}

.tuiguang-menu .menu-item.current::after {
    border: .5em solid transparent;
    border-top-color: #162b2b
}

.tuiguang-menu .menu-item.current .menu-title {
    color: #00ffd1
}

.tuiguang-menu .menu-item.current .menu-desc {
    color: #7abab2
}

.tuiguang-menu .menu-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ffffffd9;
    line-height: 1.85714286em;
    gap: .35714286em;
    margin-bottom: .85714286em
}

.tuiguang-menu .menu-title .icon {
    font-size: .4rem
}

@media (min-width:750px) {
    .tuiguang-menu .menu-title .icon {
        font-size: clamp(20px, 1.0417vw, 24px)
    }
}

.tuiguang-menu .menu-title .title {
    font-size: .48rem
}

@media (min-width:750px) {
    .tuiguang-menu .menu-title .title {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

.tuiguang-menu .menu-desc {
    color: #ffffff73
}

@media (max-width:999.5px) {
    .tuiguang-menu .pending {
        display: none
    }
}

@media (max-width:749.5px) {
    .tuiguang-menu {
        margin-bottom: 1.07142857em
    }

    .tuiguang-menu .menus {
        gap: .71428571em
    }

    .tuiguang-menu .menu-item {
        padding: 1.42857143em 1.07142857em
    }

    .tuiguang-menu .menu-desc {
        display: none
    }

    .tuiguang-menu .menu-title {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-bottom: 0
    }

    .tuiguang-menu .menu-title .icon {
        font-size: .48rem
    }

    .tuiguang-menu .menu-title .title {
        font-size: .32rem
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .tuiguang-menu .menu-title .icon {
        font-size: clamp(24px, 1.25vw, 28px)
    }
}

@media (max-width:749.5px) and (min-width:750px) {
    .tuiguang-menu .menu-title .title {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.product-submit {
    background: #2c2d3666;
    border: 1px solid #ffffff0a;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: .6rem .4rem;
    margin-bottom: 1.07142857em;
    counter-reset: submit-title-counter
}

@media (min-width:750px) {
    .product-submit {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        margin-bottom: 0
    }
}

@media (min-width:1330px) {
    .product-submit {
        padding: 4.28571429em 5.71428571em
    }
}

.product-submit .submit-part {
    margin-bottom: .8rem
}

@media (min-width:1330px) {
    .product-submit .submit-part {
        margin-bottom: 7.14285714em
    }
}

.product-submit .submit-part:last-child {
    margin-bottom: 0
}

.product-submit .submit-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 2.14285714em
}

.product-submit .submit-title .title {
    color: #ffffffd9;
    font-size: .52rem
}

@media (min-width:750px) {
    .product-submit .submit-title .title {
        font-size: clamp(26px, 1.3542vw, 30px)
    }
}

@media (min-width:750px) {
    .product-submit .submit-title .title {
        font-size: .56rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .product-submit .submit-title .title {
        font-size: clamp(28px, 1.4583vw, 32px)
    }
}

.product-submit .submit-title .index {
    position: relative;
    display: inline-block;
    margin-right: .1rem
}

.product-submit .submit-title .index .icon {
    color: #00ffd1;
    font-size: .64rem
}

@media (min-width:750px) {
    .product-submit .submit-title .index .icon {
        font-size: clamp(32px, 1.6667vw, 36px)
    }
}

@media (min-width:750px) {
    .product-submit .submit-title .index .icon {
        font-size: .72rem
    }
}

@media (min-width:750px) and (min-width:750px) {
    .product-submit .submit-title .index .icon {
        font-size: clamp(36px, 1.875vw, 40px)
    }
}

.product-submit .submit-title .index::after {
    counter-increment: submit-title-counter;
    content: counter(submit-title-counter);
    color: #333;
    font-size: .36rem;
    font-weight: normal;
    position: absolute;
    left: 50%;
    top: 46%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

@media (min-width:750px) {
    .product-submit .submit-title .index::after {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.product-submit .submit-steps {
    color: #a9a9ad;
    margin-bottom: 2.14285714em
}

.product-submit .submit-steps .h {
    color: #00ffd1
}

.product-submit .submit-steps ul {
    margin-left: 1em
}

.product-submit .submit-steps li {
    list-style: disc;
    margin-bottom: 1.42857143em
}

.product-submit .submit-steps li::marker {
    color: #00ffd1
}

.product-submit .submit-features {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1.07142857em
}

@media (min-width:750px) {
    .product-submit .submit-features {
        grid-template-columns: repeat(2, 1fr);
        gap: 2em
    }
}

@media (min-width:1440px) {
    .product-submit .submit-features {
        grid-template-columns: repeat(4, 1fr)
    }
}

.product-submit .feature-item {
    border: 1px solid #ffffff05;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #2c2d364d;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 2.14285714em;
    color: #a9a9ad
}

@media (min-width:750px) {
    .product-submit .feature-item {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.product-submit .feature-item:nth-child(2) .feature-title,
.product-submit .feature-item:nth-child(2) .feature-icon {
    color: #d8c2f7
}

.product-submit .feature-item:nth-child(3) .feature-title,
.product-submit .feature-item:nth-child(3) .feature-icon {
    color: #82aaed
}

.product-submit .feature-item:nth-child(4) .feature-title,
.product-submit .feature-item:nth-child(4) .feature-icon {
    color: #f9df95
}

.product-submit .feature-item-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 1.42857143em
}

.product-submit .feature-icon {
    font-size: 285.71428571%;
    color: #00ffd1
}

.product-submit .feature-content {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.product-submit .feature-title {
    font-size: .36rem;
    line-height: 1.66666667em;
    color: #00ffd1
}

@media (min-width:750px) {
    .product-submit .feature-title {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.product-submit .feature-subtitle {
    line-height: 1.71428571em
}

.product-submit .submit-form-wrap {
    border: 1px solid #ffffff05;
    background: #2c2d364d;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 1.42857143em;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em
}

@media (min-width:750px) {
    .product-submit .submit-form-wrap {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        padding: 2.85714286em
    }
}

@media (min-width:1330px) {
    .product-submit .submit-form-wrap {
        padding: 2.85714286em 4.28571429em;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }

    .product-submit .submit-form-wrap .submit-form-intro {
        padding-right: 4.28571429em;
        border-right: 1px solid #ffffff08;
        margin-bottom: 0
    }

    .product-submit .submit-form-wrap .submit-form-in {
        padding-left: 4.28571429em;
        width: 48em
    }
}

.product-submit .submit-form-intro {
    position: relative;
    margin-bottom: 2.85714286em
}

.product-submit .submit-form-intro p {
    color: #a9a9ad;
    line-height: 2.14285714em;
    margin-bottom: 2.14285714em
}

.product-submit .submit-form-intro p:last-child {
    margin-bottom: 0
}

.product-submit .submit-form-intro .h {
    color: #f9df95
}

.product-submit .submit-form-intro ul {
    margin-left: 1em;
    color: #a9a9ad;
    margin-bottom: 2.14285714em
}

.product-submit .submit-form-intro li {
    list-style: disc;
    margin-bottom: .71428571em
}

.product-submit .submit-form-intro li::marker {
    color: #f9df95
}

.product-submit .intro-title {
    margin-bottom: 2.14285714em
}

.product-submit .intro-title .title-in {
    display: inline-block;
    line-height: 1.42857143em;
    padding: .71428571em 2.85714286em;
    border: 1px solid #f9df951a;
    background: #f9df950d;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    white-space: nowrap;
    cursor: pointer
}

@media (min-width:750px) {
    .product-submit .intro-title .title-in {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.product-submit .intro-title .title {
    display: inline-block;
    vertical-align: top;
    font-size: .32rem;
    color: #f9df95
}

@media (min-width:750px) {
    .product-submit .intro-title .title {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.product-submit .intro-title .ico {
    display: inline-block;
    vertical-align: top;
    margin-left: .57142857em;
    margin-top: .21428571em
}

.product-submit .intro-title .ico img {
    height: 1.14285714em
}

.product-submit .form-item {
    margin-bottom: 1.78571429em;
    color: #a9a9ad
}

.product-submit .form-item:last-child {
    margin-bottom: 0
}

.product-submit .form-item label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.product-submit .form-item .label-text {
    color: #ffffffd9;
    font-size: .32rem;
    margin-bottom: 1.25em
}

@media (min-width:750px) {
    .product-submit .form-item .label-text {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.product-submit .form-item .v-textarea,
.product-submit .form-item .txt {
    font-size: .28rem;
    font-family: inherit;
    display: block;
    border: 1px solid #ffffff0d;
    background: #f2f2f20d;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    padding: 1em 1.07142857em;
    line-height: 1.71428571em;
    width: 100%;
    color: #ffffffd9
}

@media (min-width:750px) {

    .product-submit .form-item .v-textarea,
    .product-submit .form-item .txt {
        font-size: clamp(14px, .7292vw, 18px)
    }
}

@media (min-width:750px) {

    .product-submit .form-item .v-textarea,
    .product-submit .form-item .txt {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em;
        width: 50%;
        min-width: 24.28571429em
    }
}

.product-submit .form-item .v-textarea:not([readonly]):focus,
.product-submit .form-item .txt:not([readonly]):focus {
    color: #fff;
    border-color: #00ffd1;
    background-color: #f2f2f21d
}

.product-submit .form-item .v-textarea.placeholder-showing,
.product-submit .form-item .txt.placeholder-showing,
.product-submit .form-item .v-textarea::-webkit-input-placeholder,
.product-submit .form-item .txt::-webkit-input-placeholder {
    color: #ffffff23
}

.product-submit .form-item .v-textarea.placeholder-showing,
.product-submit .form-item .txt.placeholder-showing,
.product-submit .form-item .v-textarea::-moz-placeholder,
.product-submit .form-item .txt::-moz-placeholder {
    color: #ffffff23
}

.product-submit .form-item .v-textarea.placeholder-showing,
.product-submit .form-item .txt.placeholder-showing,
.product-submit .form-item .v-textarea::-ms-input-placeholder,
.product-submit .form-item .txt::-ms-input-placeholder {
    color: #ffffff23
}

.product-submit .form-item .v-textarea.placeholder-showing,
.product-submit .form-item .txt.placeholder-showing,
.product-submit .form-item .v-textarea::placeholder,
.product-submit .form-item .txt::placeholder {
    color: #ffffff23
}

.product-submit .form-item .v-textarea.not-empty:placeholder-shown,
.product-submit .form-item .txt.not-empty:placeholder-shown {
    border-color: #ff97afa6;
    background-color: #f2f2f212
}

.product-submit .form-item .v-textarea.not-empty:placeholder-shown::-webkit-input-placeholder,
.product-submit .form-item .txt.not-empty:placeholder-shown::-webkit-input-placeholder {
    color: #FF97AF
}

.product-submit .form-item .v-textarea.not-empty:placeholder-shown::-moz-placeholder,
.product-submit .form-item .txt.not-empty:placeholder-shown::-moz-placeholder {
    color: #FF97AF
}

.product-submit .form-item .v-textarea.not-empty:placeholder-shown::-ms-input-placeholder,
.product-submit .form-item .txt.not-empty:placeholder-shown::-ms-input-placeholder {
    color: #FF97AF
}

.product-submit .form-item .v-textarea.not-empty:placeholder-shown::placeholder,
.product-submit .form-item .txt.not-empty:placeholder-shown::placeholder {
    color: #FF97AF
}

.product-submit .form-item .v-textarea {
    width: 100%;
    outline: none
}

.product-submit .form-item .v-textarea.not-empty {
    border-color: #ff97afa6;
    background-color: #f2f2f212;
    color: #FF97AF
}

.product-submit .form-warning .icon {
    display: inline-block
}

.product-submit .form-warning a,
.product-submit .form-warning .icon-tick {
    color: #00ffd1
}

.product-submit .form-submit .btn {
    display: block;
    line-height: 3.42857143em
}

@media (min-width:750px) {
    .product-submit .form-submit .btn {
        padding: 0 4.42857143em;
        display: inline-block
    }
}

.product-submit .form-submit .btn-submit {
    color: #202228;
    background: #00ffd1
}

.product-submit .form-submit .btn-submiting {
    background: #2c2d34;
    color: #ffffff
}

.product-submit .form-submit .btn-wait {
    background: #243436;
    color: #59f5d9
}

.product-submit .form-login {
    color: #00ffd1
}

.product-submit .form-login .label {
    display: inline-block;
    line-height: 1.42857143em;
    padding: .71428571em 2.85714286em;
    border: 1px solid #12564D;
    background: #223034;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    white-space: nowrap
}

@media (min-width:750px) {
    .product-submit .form-login .label {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.product-submit .form-login .icon,
.product-submit .form-login p {
    display: inline-block;
    vertical-align: top
}

.product-submit .form-login .icon {
    padding-top: .21428571em;
    margin-right: .28571429em
}

.tuiguang-content {
    min-height: 10rem
}

.agreement-content {
    border: 1px solid #ffffff05;
    background: #2c2d3666;
    -webkit-border-radius: .57142857em;
    -moz-border-radius: .57142857em;
    border-radius: .57142857em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 4.28571429em;
    counter-reset: p-title-counter
}

@media (min-width:750px) {
    .agreement-content {
        -webkit-border-radius: .71428571em;
        -moz-border-radius: .71428571em;
        border-radius: .71428571em
    }
}

.agreement-content .agreement-article {
    max-width: 78.57142857em;
    margin: 0 auto;
    color: #a9a9ad
}

.agreement-content .agreement-article p {
    font-size: .32rem;
    line-height: 2.1875em;
    margin-bottom: 1.875em
}

@media (min-width:750px) {
    .agreement-content .agreement-article p {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.agreement-content .agreement-article ul,
.agreement-content .agreement-article ol {
    margin-bottom: 2.14285714em
}

.agreement-content .agreement-article ul li,
.agreement-content .agreement-article ol li {
    font-size: .32rem;
    line-height: 2.1875em
}

@media (min-width:750px) {

    .agreement-content .agreement-article ul li,
    .agreement-content .agreement-article ol li {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.agreement-content .agreement-article ul li {
    list-style: disc;
    margin-left: 1.5em
}

.agreement-content .agreement-article ul li::marker {
    color: #a9a9ad
}

.agreement-content .agreement-article a {
    color: #00ffd1
}

.agreement-content .list .list-title {
    font-size: .32rem;
    line-height: 2.1875em
}

@media (min-width:750px) {
    .agreement-content .list .list-title {
        font-size: clamp(16px, .8333vw, 20px)
    }
}

.agreement-content .p-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 2.14285714em
}

.agreement-content .p-title .title {
    color: #ffffffd9;
    font-size: .56rem
}

@media (min-width:750px) {
    .agreement-content .p-title .title {
        font-size: clamp(28px, 1.4583vw, 32px)
    }
}

.agreement-content .p-title .index {
    position: relative;
    display: inline-block;
    margin-right: .1rem
}

.agreement-content .p-title .index .icon {
    color: #00ffd1;
    font-size: .72rem
}

@media (min-width:750px) {
    .agreement-content .p-title .index .icon {
        font-size: clamp(36px, 1.875vw, 40px)
    }
}

.agreement-content .p-title .index::after {
    counter-increment: p-title-counter;
    content: counter(p-title-counter);
    color: #333;
    font-size: .36rem;
    font-weight: normal;
    position: absolute;
    left: 50%;
    top: 46%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

@media (min-width:750px) {
    .agreement-content .p-title .index::after {
        font-size: clamp(18px, .9375vw, 22px)
    }
}

.agreement-content .line {
    margin: 1.42857143em 0;
    border-bottom: 1px solid #ffffff0d
}

.mob-topc .mob-login-content {
    background: transparent;
    border: none
}

.mob-topc .comfirm-p {
    text-align: left
}

.mob-topc .h {
    color: #00ffd1
}

.mob-topc .comfirm-btns .btn {
    background: #202228;
    color: #dddedf
}


