﻿@media (min-width: 0) {
    :root {
        /* --base-font-size: 20px; */
        --van-base-font: 'Mirages Custom', 'Merriweather', 'Open Sans', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei', 'Segoe UI Emoji', 'Segoe UI Symbol', Helvetica, Arial, sans-serif;
        --van-tab-line-height: 110%;
        --base-background: #111118;
        --default-screen-max-width: 64.0rem;
        --default-screen-min-width: 0;
        --default-content-max-width: 64.0rem;

        /* 基础配置 start */
        --body-color: #ccc;
        --base-background: #121212;
        --header-background: #121212;
        --p-text-color: #fff;
        --a-text-color: #fff;
        --text-color: #efefef;
        --text-color-f: #fff;
        --text-color-white: #fff;
        --body-background: transparent;
        --detail-color: #080808;
        /* 基础配置 end */

        /* 左侧导航 start */
        --menu-left-background: #1e1f2c;
        --menu-left-title-color: #d9d9d9;
        /* 左侧导航 end */

        /* 底部菜单 start */
        --van-tabbar-item-text-color: #909090;
        --van-tabbar-background: #272727;
        --van-tabbar-item-active-color: #909090;
        --van-tabbar-item-active-background: #221f3a;
        /* 底部菜单 end */

        /* 分页控件 start */
        --van-pagination-item-default-color: #1e1f2c;
        --van-pagination-background: #e56e43;
        --van-pagination-item-text-color: #fff;
        --van-pagination-item-text-color-active: #fff;
        /* 分页控件 end */

        /* 浮动气泡 start */
        --van-back-top-background: #1f1f2d;
        /* 浮动气泡 end */

        /* 滚动条 start */
        --desktop-scrollbar-background-color: #1f1f2d;
        --desktop-scrollbar-thumb-background-color: #272839;
        /* 滚动条 end */

        /* 情报公告 start */
        --notice-background: #1e1f2c;
        --notice-text-color: #fff;
        /* 情报公告 end */

        /* 宫格菜单 start */
        --grid-background: linear-gradient(to right, #1e1f2c, #1e1f2c), linear-gradient(90deg, transparent, #fff);
        --grid--text-color: #ffffff99;
        /* 宫格菜单 end */

        /* 数据列表 start */
        --list-background: #1e1f2c;
        --list-tab-title-color: #fff;
        --list-content-state-text-color: var(--list-content-state-text-color);
        --list-detail-state-text-color: #d9d9d9;
        --list-border-color: #373737;
        --list-background-video-text2: #31323e;
        /* 数据列表 end */

        /* 标签列表 start */
        --primary-text-color: #4970F5;
        --primary-text-color-selected: #fff;
        --tag-text-color: #d9d9d9;
        --tag-background-selected: linear-gradient(270deg, #e56e43, #f18228);
        --tag-text-color-selected: #ffffff;
        --title-background: #3d261d;
        /* 标签列表 end */

        /* 提示 start */
        --van-font-size-md: 0.8rem;
        --van-toast-font-size: 1rem;
        /* 提示 end */

        /* 头部导航 start */
        --van-nav-bar-title-text-color: #ffffff;
        --van-nav-bar-title-font-size: 1.8rem;
        /* --van-nav-bar-height: 5.4rem; */
        --van-nav-bar-background: #111118;
        --van-border-width: 0;
        --van-padding-md: 1.2rem;
        --van-nav-bar-z-index: 100;
        --van-line-height-lg: 2.2rem;
        --van-font-bold: 400;
        /* 头部导航 start */

        /* 底部菜单 start */
        /* --van-tabbar-height: 5.0rem; */
        --van-tabbar-item-font-size: 0.9rem;
        --van-tabbar-item-text-color: #4970f5;
        --van-tabbar-background: #272727;
        --van-tabbar-item-active-color: #909090;
        --van-tabbar-item-active-background: #221f3a;
        --van-tabbar-z-index: 10;
        /* 底部菜单 end */

        /* 分页控件 start */
        --van-list-text-font-size: 1.0rem;
        --van-loading-text-font-size: 1.0rem;
        --van-pagination-font-size: 1.1rem;
        --van-pagination-item-default-color: #e56e43;
        --van-pagination-background: #1e1f2c;
        /* 分页控件 end */

        /* 浮动气泡 start */
        --van-back-top-background: #1f1f2d;
        --van-back-top-size: 3.2rem;
        /* 浮动气泡 end */

        /* 滚动条 start */
        --desktop-scrollbar-background-color: #1f1f2d;
        --desktop-scrollbar-thumb-background-color: #272839;
        /* 滚动条 end */

        /* Banner start */
        --bannner-height: 12.8rem;
        --bannner-detail-top-height: 14.0rem;
        --bannner-detail-bottom-height: 14.0rem;
        /* Banner end */

        /* 弹出层 start */
        --van-overlay-z-index: 99;
        --van-popup-background: var(--fl-text);
        /* 弹出层 end */


        /* 选项卡 start */
        --van-padding-sm: 0.5rem;
        --van-tab-font-size: 1.4rem;
        --van-tab-text-color: var(--text-color);
        --van-tabs-line-height: inherit !important;
        --van-tab-active-text-color: var(--primary-text-color);
        --van-tabs-nav-background: transform;
        --van-tabs-bottom-bar-color: transform;
        /* 选项卡 end */

        /* 宫格组 start */
        --van-grid-item-text-color: var(--text-color);
        --van-grid-item-text-font-size: 1.0rem;
        --van-grid-item-content-background: transform;
        --van-grid-item-content-padding: 0;
        /* 宫格组 end */

        /* 气泡组 start */
        --van-floating-bubble-size: 3.0rem;
        --van-floating-bubble-background: transform;
        /* 气泡组 end */

        /* 点击效果 start */
        --van-active-opacity: 1;
        /* 点击效果 end */
    }

    /* 控制 start */
    .is-mobile {
        display: block;
    }

    .is-desktop {
        display: none;
    }

    /* 控制 start */
}

/* 占位符 start */
* [v-if] {
    display: none !important;
}

* [v-else-if] {
    display: none !important;
}

* [v-show] {
    display: none !important;
}

/* 占位符 end */
.overflow-hidden {
    overflow: hidden;
}

/* 图片加载 start */
.defaultimg,
div:has(> img:not([src])),
div:has(> img.loading),
a:has(> img:not([src])),
a:has(> img.loading) {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #1f1e1e;
}

img:not([src]),
img.loading {
    content: url("/usr/themes/Mirages/css/7.10.0/img-placeholder.png");
    margin: 0 auto;
    -o-object-fit: cover;
    object-fit: cover;
    background-size: cover;
    background-position: center;
}

img[src]:not(.loading) {
    content: unset;
}

/* 图片加载 end */

/* ai1021 AI功能 start */
.nav-fixed {
    position: fixed;
    background: #212322;
    z-index: 98;
    width: 100%;
    padding-bottom: .5rem
}

.nav-categories {
    display: flex;
    align-items: center;
    margin: .5rem 0;
    padding-left: 1rem;
}

.nav-fixed .list {
    display: flex;
    list-style: none;
    overflow-x: auto;
    margin-left: 1rem;
}

.nav-fixed .list::-webkit-scrollbar {
    display: none;
}

.nav-fixed .list li {
    padding: .4rem .2rem;
    display: flex;
    flex-direction: column;
    font-size: 1rem;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    margin-right: .6rem;
}

.nav-fixed .list li:last-child {
    margin-right: 0;
}

.nav-fixed .list li a {
    color: #979797;
}

.nav-fixed .list li.active a {
    color: #fff;
}

.nav-fixed .search-box {
    position: relative;
    padding-inline: 0.5rem;
    flex: 1;
}

.nav-fixed .search-box input {
    width: 100%;
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0.5rem 1rem;
    border-radius: 2rem;
    color: #fff;
}

.nav-fixed .search-box .search-btn {
    position: absolute;
    top: 0.475rem;
    right: 1.2125rem;
    color: #aaa;
    background-color: transparent;
    border: 0;
    font-size: 1.2rem;
}

.nav-fixed .search-extra {
    list-style: none;
    display: flex;
    column-gap: 0.625rem;
    position: relative;
}

.nav-fixed .search-extra li>button {
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.625rem;
    height: 1.625rem;
    border-radius: 100%;
    border: solid 1px rgba(255, 255, 255, 0.3);
    background-color: rgba(255, 255, 255, 0.1);
    border: none;
}

.nav-fixed .search-extra li img,
.navbar-nav.side-toolbar-list li>a img {
    width: 0.7rem;
    height: 0.7rem;
}

.nav-fixed .search-extra li img.avatar_btn_user {
    width: 100%;
    height: 100%;
}

.nav-fixed .search-extra li img.avatar_btn[src^="blob"],
.navbar-nav.side-toolbar-list li>a img.avatar_btn[src^="blob"] {
    width: 100%;
    height: 100%;
}

.page-jump button {
    line-height: 1.15;
}

body.use-navbar .sidebar,
body.use-navbar .nav-fixed {
    display: none
}

@media (max-width:767.98px) {

    body.use-navbar .sidebar,
    body.use-navbar .nav-fixed {
        display: flex;
        flex-wrap: wrap;
        height: fit-content;
        background: #181818;
    }

    body.display-nav #site-navigation {
        background: transparent;
    }
}

.page-jump input {
    margin: 0 0.3rem !important;
}

/* ai1021 AI功能 end */

/* 1203xf 回归测试 start */
.van-image-preview {
    position: fixed;
    top: 50%;
    left: 0;
    aspect-ratio: 55 / 75;
    width: fit-content;
    max-height: 90%;
    background-color: transparent;
    transform: translateY(-50%);
    padding: 1rem;
}

@media (max-width:576px) {
    .van-image-preview {
        position: fixed;
        top: 50%;
        left: 0;
        aspect-ratio: 55/ 75;
        max-width: 85%;
        width: 100%;
        height: auto;
        background-color: transparent;
        transform: translateY(-50%);
    }
}

.van-image-preview__close-icon--top-right {
    top: 0;
    right: 0;
}

.page-navigator {
    margin-block: 1rem;
}

/* 1203xf 回归测试 end */

.wrap {
    width: 100%;
    height: 100%;
    position: absolute;
    top: -8px;
    left: 8px;
    overflow: hidden;
    font-size: 17px;
    font-weight: 400;
    color: #fff;
    opacity: 0.6;
    -webkit-transition: .3s ease all;
    -moz-transition: .3s ease all;
    -ms-transition: .3s ease all;
    -o-transition: .3s ease all;
    transition: .3s ease all;
}

.wrap:hover {
    opacity: 0.9;
}

.wraps {
    display: inline-block;
    text-align: center;
    width: 200px;
    height: 30px;
    line-height: 27px;
    position: absolute;
    top: 30px;
    right: -50px;
    z-index: 2;
    overflow: hidden;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    border: 1px dashed;
    box-shadow: 0 0 0 1px #000, 0px 21px 5px -18px rgba(0, 0, 0, 0.6);
    background: rgb(1, 132, 127);
}

/* 2020-04-02 4月优化 start */
.copy-box {
    width: 50%;
    max-width: 292px;
}

.flash {
    padding: 0 50px;
    border-radius: 8px;
    border: solid 1px #ffc268;
    font-weight: 500;
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
}

.flash>img {
    width: 28px;
    height: 28px;
    margin: 15px 4px 15px 0;
}

.flash:hover {
    background: #15803d;
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);
}

.hot-news-section {
    margin-bottom: 2rem;
}

.hot-news-section .hot-news-box {
    display: flex;
    justify-content: space-between;
    padding: 32px 27px 33px 28px;
    background-color: #343232;
}

.hot-news-content:first-child {
    padding-right: 1rem;
    position: relative;
}

.hot-news-content:last-child {
    padding-left: 1rem;
}

.hot-news-content .link-list {
    text-align: center;
}

.hot-news-content:first-child::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 1px;
    background-color: #979797;
    height: 100%;
    top: 50%;
    transform: translate(0, -50%);
}

.content-tabs-head .content-tab-title.selected.w-full {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 28px 20px;
    font-size: 24px;
}

.content-tabs-head .content-tab-title.selected.w-full .tip {
    padding-left: 1rem;
    text-wrap: auto;
    line-height: 1.5rem;
    color: #bcbcbc;
    font-size: 18px;
}

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

.links-list>p {
    background-color: #343232;
    padding: 12px;
    margin-bottom: 0;
}

body.theme-dark.dark-mode .post-content .content-tabs .content-tabs-body {
    padding: 10px;
}

.post-content .content-tabs .content-tabs-body .content-tab-content {
    padding: 0;
}

.row-link {
    background-color: #343232;
    padding: 12px;
    margin-top: 10px;
}

.row-link:last-child {
    margin-bottom: 10px;
}

.row-link p {
    margin-bottom: 0;
}

.links-box {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 2rem;
    margin: 2rem 0;
    text-align: center;
}

.links-box .link1,
.links-box .link2 {
    padding: 0 20px;
    border: solid 1px #1abc9d !important;
    border-radius: 8px;
    width: 200px;
    height: 60px;
    text-wrap: auto;
    background-color: #1abc9d;
    text-align: center;
    line-height: 60px;
}

.links-box .link1 {
    color: #fff !important;
}

.links-box .link2 {
    background-color: transparent;
}

.tips-box {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.tips-box>div {
    display: flex;
    align-items: center;
    background-color: #343232;
    padding: 20px;
    column-gap: 0.75rem;
}

.tips-box>div .tip-index {
    background-color: rgba(26, 188, 157, 0.25);
    color: #1abc9d40;
    padding: 0 7px;
    text-align: center;
    vertical-align: middle;
    font-size: 12px;
    color: #fff;
}

.tips-box>div .tip-content {
    line-height: 1.56;
    letter-spacing: normal;
    text-align: start;
    color: #bcbcbc;
}

.a2a_default_style {
    display: flex;
    justify-content: center;
}

.important-tip {
    color: #bcbcbc;
    padding-top: 1rem;
    line-height: 1.5;
    text-align: center !important;
}

@media(max-width:768px) {
    .flash {
        font-size: 13px;
        padding: 0;
    }

    .flash>img {
        width: 16px;
        height: 16px;
    }

    .hot-news-section .hot-news-box {
        padding: 1rem;
        font-size: 14px;
    }

    .content-tabs-head .content-tab-title.selected.w-full {
        font-size: 16px;
        padding: 10px;
    }

    .content-tabs-head .content-tab-title.selected.w-full .tip {
        font-size: 14px;
    }

    .links-list {
        font-size: 14px;
    }

    .links-box {
        column-gap: 1rem;
    }

    .links-box .link1,
    .links-box .link2 {
        height: 48px;
        line-height: 48px;
        font-size: 14px;
        padding: 0 10px;
    }

    .tips-box>div .tip-content {
        line-height: 1;
        font-size: 14px;
        word-break: break-all;
    }

    .tips-box>div {
        padding: 10px;
    }

    .important-tip {
        font-size: 13px;
    }
}

.text-line-ellipsis-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}

/* 2020-04-02 4月优化 end*/
.bling {
    text-align: center;
    padding: 2rem 0;
}

.bling1 {
    margin: 0;
    padding: 0;
    color: white;
    display: inline-block;
    font-size: 2.3rem;
    ;
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
}

/* xifeng 0415 新增 */

/* xifeng 0415 新增 */

/* 面包线样式 start */
.nav-breadcrumb-wrap {
    display: flex;
    align-items: center;
}

.nav-breadcrumb-wrap .point {
    flex-shrink: 0;
    margin-left: 0.625rem;
    margin-right: 0.625rem;
}

.nav-breadcrumb-wrap .action-butn {
    flex-shrink: 0;
    font-size: 16px !important;
    color: #1abc9d !important;
}

.nav-breadcrumb-wrap .name {
    width: 20rem;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.5);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nav-breadcrumb-outside {
    padding: 2rem 0;
}

.search-nav-breadcrumb-wrap {
    margin: 0.1875rem 0 0.375rem;
}

.archive-nav-breadcrumb-wrap {
    margin: 1.875rem 0 2.5rem;
}

.tagcloud-nav-breadcrumb-wrap {
    margin: 1.875rem 0 0.625rem
}

.is-mobile-c {
    display: none;
}

.is-desktop-c {
    display: block;
}

@media (max-width: 768px) {
    .nav-breadcrumb-outside {
        padding-top: 0.9375rem;
        padding-bottom: 0.9375rem;
    }

    .search-nav-breadcrumb-wrap {
        margin: 0.09375rem 0 0.1875rem;
    }

    .archive-nav-breadcrumb-wrap {
        margin: 0.9375rem 0 1.25rem;
    }

    .tagcloud-nav-breadcrumb-wrap {
        margin: 0.9375rem 0 0;
    }

    .is-mobile-c {
        display: block;
    }

    .is-desktop-c {
        display: none;
    }

    .outside {
        padding: 0 1rem;
        margin-top: 0.9375rem;
        margin-bottom: 0.9375rem;
        box-sizing: border-box;
    }

    .outside-connect-head+#masthead {
        padding-top: 0 !important;
    }

    .nav-breadcrumb-wrap .action-butn {
        font-size: 12px !important;
    }

    .nav-breadcrumb-wrap .point {
        width: 0.25rem;
        height: 0.5rem;
    }

    .nav-breadcrumb-wrap .name {
        width: auto;
        font-size: 12px !important;
    }
}

/* 面包线样式 end */

/* 猜你喜欢 start */
.recommend-wrap-outside {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}

.recommend-wrap {}

.recommend-wrap .part1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.6875rem;
}

.recommend-wrap .part1 .title {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.13;
    color: #fff;
}

.recommend-wrap .part1 .more {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 1rem;
    color: #1abc9d;
}

.recommend-wrap .part1 .more-i {}

.recommend-wrap .list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem;
}

.recommend-wrap .list .item {}

.recommend-wrap .list .item .img {
    width: 100%;
    aspect-ratio: 1.56 / 1;
    border-radius: 0.625rem;
    overflow: hidden;
}

.recommend-wrap .list .item .img img {
    width: 100%;
    height: 100%;
}

.recommend-wrap .list .item .detail {
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
    font-size: 1rem;
    font-weight: normal;
    color: rgba(255, 255, 255, 0.8);
    display: -webkit-box;
    /* 弹性盒子模型 */
    -webkit-box-orient: vertical;
    /* 垂直排列 */
    -webkit-line-clamp: 2;
    /* 限制显示两行 */
    overflow: hidden;
    /* 隐藏超出部分 */
    text-overflow: ellipsis;
    /* 使用省略号 */
}

.recommend-wrap .list .item .msg {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.recommend-wrap .list .item .time {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.5);
}

.recommend-wrap .list .item .comment {
    display: flex;
    align-items: center;
    gap: 0.375rem;

}

.recommend-wrap .list .item .comment-i {
    width: 0.9375rem;
    height: 0.875rem;
}

.recommend-wrap .list .item .num {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.5);
}

/* 热门标签 */
.hot-tags-wrap .list {
    display: flex;
    flex-wrap: wrap;
    /* grid-template-columns: auto; */
    gap: 0.875rem 0.75rem;


}

.hot-tags-wrap .list .item-tag {
    padding: 0.75rem 1.6875rem;
    font-size: 1rem;
    font-weight: normal;
    color: #fff;
    border-radius: 0.3125rem;
    border: solid 1px rgba(255, 255, 255, 0.5);
}

.hot-tags-wrap .list .item-tag h3 {
    font-size: 1rem;
    font-weight: normal;
}

@media (max-width: 768px) {
    .recommend-wrap-outside {
        margin-top: 1.875rem;
        margin-bottom: 1.875rem;
    }

    .recommend-wrap {}

    .recommend-wrap .part1 {
        margin-bottom: 0.9375rem;
    }

    .recommend-wrap .part1 .title {
        font-size: 1.125rem;
        font-weight: 500;
        line-height: 1;
    }

    .recommend-wrap .part1 .more {
        gap: 0.28125rem;
        font-size: 0.75rem;
    }

    .recommend-wrap .part1 .more-i {
        width: 0.1875rem;
        height: 0.375rem;
    }

    .recommend-wrap .list {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.9375rem 0.625rem;
    }

    .recommend-wrap .list .item {}

    .recommend-wrap .list .item .img {
        width: 100%;
        aspect-ratio: 343 / 192;
        border-radius: 0.3125rem;
        overflow: hidden;
    }

    .recommend-wrap .list .item .img img {
        width: 100%;
        height: 100%;
    }

    .recommend-wrap .list .item .detail {
        margin-top: 0.625rem;
        margin-bottom: 0.5625rem;
        font-size: 0.75rem;
        color: rgba(255, 255, 255, 0.8);
        display: -webkit-box;
        /* 弹性盒子模型 */
        -webkit-box-orient: vertical;
        /* 垂直排列 */
        -webkit-line-clamp: 2;
        /* 限制显示两行 */
        overflow: hidden;
        /* 隐藏超出部分 */
        text-overflow: ellipsis;
        /* 使用省略号 */
    }

    .recommend-wrap .list .item .time {
        font-size: 0.65625rem;
    }

    .recommend-wrap .list .item .comment {
        gap: 0.28125rem;

    }

    .recommend-wrap .list .item .comment-i {
        width: 0.6875rem;
        height: 0.65625rem;
    }

    .recommend-wrap .list .item .num {
        font-size: 0.65625rem;
    }

    /* 热门标签 */
    .hot-tags-wrap .list {
        display: flex;
        flex-wrap: wrap;
        gap: 0.75rem;


    }

    .hot-tags-wrap .list .item-tag {
        padding: 0.625rem 0.8125rem;
        font-size: 0.8125rem;
        line-height: 1.31;
        letter-spacing: 0.76px;
        color: #bbb;
        border-radius: 0.25rem;
        border: solid 1px #979797;
    }

    .hot-tags-wrap .list .item-tag h3 {
        font-size: 0.8125rem;
    }

}

/* 猜你喜欢 end */


/* 下载弹窗 start */
.login_dialog.download_dialog {
    position: fixed;
    inset: 0;
    z-index: 9000;
    background-color: rgba(0, 0, 0, 0.5);
}

.download_dialog .login_modal {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: min(25rem, 90vw);
    min-width: auto;
    max-width: 25rem;
}

.download_dialog .login_close_btn {
    margin: 0 auto 1rem;
    width: 2.625rem;
    height: 2.625rem;
    cursor: pointer;
}

.download_dialog .login_close_btn img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.down-content {
    padding: 1.5rem;
    border-radius: 0.625rem;
    background-color: rgba(0, 0, 0, 0.85);
    max-height: 85vh;
    overflow-y: auto;
    box-sizing: border-box;
}

.down-content .part1 {
    display: flex;
    justify-content: center;
}

.down-content .part1 .logo {
    width: 7.5rem;
    aspect-ratio: 8.434 / 2.499;
}

.down-content .part1 .logo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.down-content .part2 {
    display: flex;
    justify-content: center;
    margin: 1rem 0;
}

.down-content .part2 .title {
    display: block;
    width: 100%;
    max-width: 18rem;
    height: auto;
    object-fit: contain;
}

.down-content .part3 {
    display: flex;
    justify-content: center;
    margin: 0 auto;
}

.down-content .part3 .qrcode {
    position: relative;
    width: 13rem;
    height: 13rem;
    background-image: url('/usr/themes/Mirages/images/download/qr-wrap.png');
    background-size: 100% 100%;
}

.down-content .part3 .qrcode #qrcode-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 77%;
    height: 77%;
}

.down-content .part3 .qrcode #qrcode-img canvas,
.down-content .part3 .qrcode #qrcode-img img {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.down-content .part4 {
    margin-top: 1.25rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.down-content .part4 .download {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    height: 2.5rem;
    text-align: center;
    border-radius: 0.5rem;
    border: solid 1px #fff;
    font-size: 0.875rem;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    line-height: 1;
}

.down-content .part4 .download .text {
    white-space: nowrap;
}

.down-content .part4 .download img {
    flex: none;
    width: 1.125rem;
    height: 1.125rem;
}

@media (max-width: 480px) {
    .download_dialog .login_modal {
        width: 92vw;
        max-width: 92vw;
    }

    .download_dialog .login_close_btn {
        width: 2rem;
        height: 2rem;
        margin-bottom: 0.625rem;
    }

    .down-content {
        padding: 1.25rem 1rem;
        border-radius: 0.5rem;
    }

    .down-content .part1 .logo {
        width: 6rem;
    }

    .down-content .part2 {
        margin: 0.75rem 0;
    }

    .down-content .part2 .title {
        max-width: 14rem;
    }

    .down-content .part3 .qrcode {
        width: 11rem;
        height: 11rem;
    }

    .down-content .part4 {
        margin-top: 1rem;
        gap: 0.625rem;
    }

    .down-content .part4 .download {
        height: 2.25rem;
        font-size: 0.8125rem;
        gap: 0.375rem;
    }

    .down-content .part4 .download img {
        width: 1rem;
        height: 1rem;
    }
}

/* 下载弹窗 end */
footer#foot-menu {
    background-color: #2c2a2a;
}

/* xf0704 调整悬浮处理 start */
.xqbj-component-adfloat {
    position: fixed;
    left: auto;
    right: 1.875rem;
    bottom: 3.9375rem;
    z-index: 9999;
    display: none;
}

.xqbj-component-adfloat img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.xqbj-component-adfloat .banner-swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
}

.xqbj-component-adfloat .banner-swiper .swiper-wrapper {
    width: 5.0rem;
    height: 5.0rem;
}

.xqbj-component-adfloat .banner-swiper a {
    width: 100%;
    height: 100%;
    display: block;
    cursor: pointer;
}

.xqbj-component-adfloat .banner-swiper .swiper-pagination {
    position: initial;
    height: 0.8rem;
    display: flex;
    justify-content: center;
}

.xqbj-component-adfloat .banner-swiper .swiper-wrapper .swiper-slide {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.xqbj-component-adfloat .swiper-pagination {
    position: absolute;
    text-align: center;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    margin: 0.3rem 0 0 0;
}

.xqbj-component-adfloat .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    background: #000;
    opacity: 1;
}

.xqbj-component-adfloat .xqbj-icon-close {
    /*
		width: 1.25rem;
		height: 1.25rem;
		position: absolute;
		top: -0.75rem;
		right: -0.75rem;
		cursor: pointer;
		z-index: 2;
		display: block;
	*/
    width: 1.8rem;
    height: 1.8rem;
    position: absolute;
    top: -1.8rem;
    right: 1.5rem;
    cursor: pointer;
    z-index: 2;
    display: block;
}

.xqbj-component-adfloat .cus-pagination {
    position: absolute;
    bottom: -0.7rem !important;
    z-index: 9999 !important;
    white-space: nowrap;
}

.xqbj-component-adfloat .swiper-pagination-bullet {
    width: 0.3125rem !important;
    height: 0.3125rem !important;
}

.xqbj-component-adfloat .swiper-pagination-bullet-active {
    background: #ffffff !important;
}


@media (min-width: 960px) {
    .xqbj-component-adfloat {
        position: fixed;
        right: auto;
        left: 50%;
        bottom: 4.4375rem;
        z-index: 9999;
    }

    .xqbj-component-adfloat .xqbj-icon-close {
        width: 1.5625rem;
        height: 1.5625rem;
        position: absolute;
        top: -0.9375rem;
        right: -0.9375rem;
        cursor: pointer;
        z-index: 2;
    }

    .xqbj-component-adfloat .banner-swiper .swiper-wrapper {
        width: 6.25rem;
        height: 6.25rem;
    }


}

/* 特殊处理 */
@media screen and (min-width: 768px) and (max-width: 1301px) {
    .xqbj-component-adfloat {
        transform: translateX(-50%) translateX(1.875rem) translateX(24.25rem);
    }
}

@media screen and (min-width: 1302px) and (max-width: 1599px) {
    .xqbj-component-adfloat {
        transform: translateX(-50%) translateX(1.875rem) translateX(30.0rem);
    }
}

@media screen and (min-width: 1600px) and (max-width: 1799px) {
    .xqbj-component-adfloat {
        transform: translateX(-50%) translateX(1.875rem) translateX(32.0rem);
    }
}

@media screen and (min-width: 1800px) and (max-width: 1999px) {
    .xqbj-component-adfloat {
        transform: translateX(-50%) translateX(1.875rem) translateX(32.0rem);
    }
}

@media screen and (min-width: 2000px) and (max-width: 2399px) {
    .xqbj-component-adfloat {
        transform: translateX(-50%) translateX(1.875rem) translateX(32.5rem);
    }
}

@media screen and (min-width: 2400px) {
    .xqbj-component-adfloat {
        transform: translateX(-50%) translateX(1.875rem) translateX(32.5rem);
    }
}

/* xf0704 调整悬浮处理 end */

/* 51CG H5 Zeplin homepage restore */
@media screen and (max-width: 767.98px) {
    .wrap {
        top: 0;
        left: 0;
        opacity: 0.6;
        pointer-events: none;
    }

    .wraps {
        width: 10rem;
        height: 1.75rem;
        line-height: 1.625rem;
        top: 1.125rem;
        right: -3.25rem;
        font-size: 0.875rem;
        font-weight: 400;
        background: rgba(1, 132, 127, 0.6);
        border-color: rgba(255, 255, 255, 0.72);
        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35), 0 1.3125rem 0.3125rem -1.125rem rgba(0, 0, 0, 0.6);
    }

    .xqbj-component-adfloat {
        right: 1.5rem;
        bottom: 3.25rem;
    }

    .xqbj-component-adfloat .banner-swiper .swiper-wrapper {
        width: 4.875rem;
        height: 4.875rem;
    }

    .xqbj-component-adfloat .xqbj-icon-close {
        width: 1.75rem;
        height: 1.75rem;
        top: -1.75rem;
        right: 1.5rem;
    }
}

/* xf0705 虚拟搜索引擎 start */
nav.xqbj-header .nav-bar-title.nav-gcse-search-container {
    width: 100%;
    max-width: 100%;
}

nav.xqbj-header .nav-bar-title.nav-gcse-search-container .gsc-control-cse {
    margin: 0;
    padding: 0;
    border-color: transparent;
    background-color: transparent;
}

nav.xqbj-header .nav-bar-title.nav-gcse-search-container .gsc-results-wrapper-overlay {
    position: fixed !important;
    width: 90%;
    height: 80%;
    top: 5%;
    left: 5%;
    padding: 0.6rem;
}

/* xf0705 虚拟搜索引擎 end */

/* xf0705 分页选择器(问题修复) start */
.page-jump form {
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-appearance: none;
    appearance: none;
}

/* xf0705 分页选择器 end */

/* else0714 uc浏览器上滚动问题 start */
html .display-nav,
body.display-nav {
    position: fixed;
    overflow: hidden;
    height: 100%;
    width: 100%;
}

#nav-toolbar .side-toolbar {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* else0714 uc浏览器上滚动问题 end */

/* else0805 广告改为iframe加载 start */
.advertise-fixed {
    display: none;
}

.advertise-fixed.show {
    display: block;
}

.horizontal-block .ad-iframe-container {
    width: 100%;
    height: 0;
    padding-bottom: 11.5746%;
    position: relative;
    margin: 1.0rem 0 0 0;
}

.horizontal-block .ad-iframe-container .ad-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0px;
    overflow: hidden;
    background-color: rgb(54 54 54);
    display: block;
}

.ad-card-iframe-container {
    width: 100%;
    height: 100%;
    padding-bottom: 40.5714%;
    position: relative;
}

.ad-card-iframe-container .ad-card-frame {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0px;
    overflow: hidden;
    background-color: rgb(54 54 54);
    display: block;
}

/* 首页广告弹窗样式优化 start jiayi */
.recommend-layer .recommend-wrapper .media-box {
    width: 30.5rem;
    max-width: 80vw;
    height: 32.5rem;
    max-height: calc(80vw * 32.5 / 30.5);
}

.recommend-layer .recommend-wrapper .media-box img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: none;
    object-fit: contain;
}

@media screen and (max-width: 768px) {
    .recommend-layer .recommend-wrapper .media-box {
        width: 30.5rem;
    }
}

@media screen and (min-width: 750px) and (max-width: 960px) {
    .recommend-layer .recommend-wrapper .media-box {
        width: 30.5rem;
    }
}

@media screen and (min-width: 960px) {
    .recommend-layer .recommend-wrapper .media-box {
        width: 30.5rem;
    }
}
/* 首页广告弹窗样式优化 end jiayi */

.ad-popup-iframe-container {
    width: 100%;
    padding-bottom: 111.4757%;
    position: relative;
}

.ad-popup-iframe-container .ad-popup-frame {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0px;
    overflow: hidden;
    background-color: transparent;
    display: block;
}

/* else0805 广告改为iframe加载 end */

/* xf1125 播放器优化 start */
.dplayer .dplayer-loading {
    background-color: #1d1d1d;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 2 / 1;
}

.dplayer .dplayer-loading .dplayer-loading-text {
    animation: dplayer-loading-text 1.2s infinite;
}

@keyframes dplayer-loading-text {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-5px);
    }
}

/* xf1125 播放器优化 end */

/* IM 公共样式 start */
:root {
    --msg-center-bg: #2c2a2a;
    --msg-center-card: #383737;
    --msg-center-primary: #0ab18c;
    --msg-center-text: #ffffff;
    --msg-center-muted: #838383;
    --msg-center-radius-sm: 0.375rem;
    --msg-center-radius-md: 0.75rem;
    --msg-center-card-h5: 3.75rem;
    --msg-center-card-pc: 7.5rem;
    --msg-center-ad-pc: 6.4rem;
    --msg-center-adtag-text: #e9e9e9;
}

.hidden {
    display: none !important;
}

.msg-arch-banner-container {
    display: flex;
    flex-direction: column;
    padding: .5rem 0;
}

.msg-arch-banner-container > a {
    width: 100%;
    display: block;
    margin-bottom: 0.5rem;
    flex: 1;
    position: relative;
}
.msg-arch-banner-container > a  > img {
    width: 100%;
    height: auto;
    object-fit: cover;
    background-color: #484848;
    border-radius: 0.6rem;
}

.msg-arch-banner-container > a > img.loading {
    width: 100%;
    object-fit: contain;
    content: url(/usr/themes/Mirages/css/7.10.0/img-placeholder.png);
    object-fit: contain;
    background-size: contain;
    background-position: center;
    background-color: #979797;
    max-height: 5rem;
}

.home-announce-bar {
    display: flex;
    align-items: center;
    width: 100%;
    height: 2rem;
    margin: 0 auto .45rem;
    padding: 0 .625rem 0 .45rem;
    box-sizing: border-box;
    border-radius: 8px;
    color: #fff;
    font-size: .75rem;
    line-height: 2rem;
    overflow: hidden;
    -webkit-backdrop-filter: blur(19.8px);
    backdrop-filter: blur(19.8px);
    border: solid 1px rgba(74, 36, 48, 0.3);
    background-color: rgba(87, 23, 64, 0.4);
    position: fixed;
    top: 6rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    margin: 0 auto;
}
.home-announce-bar img {
    flex: 0 0 auto;
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    margin-right: .375rem;
    align-self: center;
}
.home-announce-bar .home-announce-text {
    flex: 1 1 auto;
    min-width: 0;
    align-self: center;
    line-height: 2.5rem;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.home-announce-bar .home-announce-action {
    flex: 0 0 auto;
    align-self: center;
    line-height: 2rem;
    margin-left: .625rem;
    color: #b58ea3;
    white-space: nowrap;
}
.home-announce-action::after {
    content: "";
    display: inline-block;
    width: 0.45rem;
    height: 0.45rem;
    margin-left: 0.125rem;
    vertical-align: -0.0625rem;
    border-top: 0.0875rem solid currentColor;
    border-right: 0.0875rem solid currentColor;
    transform: rotate(45deg);
}
.detail-im-notice {
    position: fixed;
    top: 6.1875rem;
    left: 0.6875rem;
    right: 0.6875rem;
    z-index: 10;
    display: flex;
    align-items: center;
    height: 2rem;
    padding: 0 0.5rem;
    color: #fff;
    text-decoration: none;
    border: 1px solid rgba(74, 36, 48, 0.3);
    border-radius: 0.5rem;
    background: rgba(87, 23, 64, 0.4);
    backdrop-filter: blur(9.9px);
    -webkit-backdrop-filter: blur(9.9px);
    box-sizing: border-box;
    margin: 0 auto;
}

.detail-im-notice__icon {
    flex: 0 0 1.4375rem;
    width: 1.4375rem;
    height: 1.4375rem;
    border-radius: 50%;
    object-fit: cover;
}

.detail-im-notice__text {
    flex: 1;
    min-width: 0;
    margin: 0 0.5rem;
    overflow: hidden;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.detail-im-notice__action {
    flex: 0 0 auto;
    color: #b58ea3;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1rem;
    white-space: nowrap;
}

.detail-im-notice__action::after {
    content: "";
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    margin-left: 0.125rem;
    vertical-align: -0.0625rem;
    border-top: 0.0875rem solid currentColor;
    border-right: 0.0875rem solid currentColor;
    transform: rotate(45deg);
}
@media screen and (max-width: 767.98px) {
    .home-announce-bar {
        display: flex;
        max-width: calc(100% - 1.5rem);
    }
}

@media(max-width:768px) {
    .msg-arch-banner-container > a  > img {
        max-height: 3rem;
    }
}

.notice_dot {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background-color: #ff3b30;
    border: 0.09375rem solid #fff;
    box-sizing: border-box;
    z-index: 2;
    pointer-events: none;
    transform: translate(35%, -35%);
}

@media screen and (min-width: 768px) and (max-width: 1301px) {
    .home-announce-bar {
        max-width: 696px;
    }
    .home-announce-bar.detail-im-notice {
        max-width: 800px;
    } 
}

@media screen and (min-width: 1302px) and (max-width: 1599px) {
    .home-announce-bar {
        max-width: 840px;
    }
}

@media screen and (min-width: 1600px) and (max-width: 1799px) {
    .home-announce-bar {
        max-width: 872px;
    }
}

@media screen and (min-width: 1800px) and (max-width: 1999px) {
    .home-announce-bar {
        max-width: 936px;
    }
}

@media screen and (min-width: 2000px) and (max-width: 2399px) {
    .home-announce-bar {
        max-width: 968px;
    }
}

@media screen and (min-width: 2400px) {
    .home-announce-bar {
        max-width: 1000px;
    }
}

.msg-center-banner__badge {
    position: absolute;
    top: 0.25rem;
    right: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0.78125rem;
    height: 0.78125rem;
    border-radius: 50%;
    background-color: #ff3b30;
    color: var(--msg-center-text);
    font-size: 0.5rem;
    font-weight: 600;
    line-height: 0.5rem;
}

.msg-archives-page {
    width: 100%;
    padding: 0 0 4rem;
    color: var(--msg-center-text);
    box-sizing: border-box;
}

.msg-archives-page .sp_breadcrumb_nav {
    margin: 0 0 1.25rem;
    font-size: 0.625rem;
    line-height: 0.875rem;
    color: var(--msg-arch-text);
    opacity: 0.91;
}

.msg-archives-page .sp_breadcrumb_nav a {
    color: var(--msg-center-primary);
}

.msg-archives-page .sp_breadcrumb_nav--pc {
    display: none;
}

.msg-arch-banner {
    position: relative;
    display: block;
    width: 100%;
    height: var(--msg-arch-banner-h5-h);
    margin: 0 0 var(--msg-arch-card-gap-h5);
    overflow: hidden;
    border-radius: var(--msg-arch-radius-card);
    color: var(--msg-center-text);
    box-sizing: border-box;
}

.msg-arch-banner:hover {
    color: var(--msg-center-text);
}

.msg-arch-banner picture,
.msg-arch-banner img {
    display: block;
    width: 100%;
    height: 100%;
}

.msg-arch-banner img {
    object-fit: fill;
}

.msg-arch-banner__badge {
    position: absolute;
    top: 0.25rem;
    right: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0.78125rem;
    height: 0.78125rem;
    border-radius: 50%;
    background-color: #ff3b30;
    color: var(--msg-center-text);
    font-size: 0.5rem;
    font-weight: 600;
    line-height: 0.5rem;
}

.msg-arch-banner__adtag {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 1.5rem;
    background-image: url(/usr/plugins/AiSuite/assets/images/msg-center-adtag-bg.svg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: var(--msg-arch-adtag-text);
    font-size: 0.8rem;
    font-weight: 500;
    line-height: 1.5rem;
}

.msg-arch-list {
    display: flex;
    flex-direction: column;
    gap: var(--msg-arch-card-gap-h5);
    margin: 2rem 0 0 0;
    padding: 0;
    list-style: none;
    max-height: 40rem;
    overflow-y: auto;
}

.msg-arch-item {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.msg-arch-item__time {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6.65625rem;
    height: 1.25rem;
    margin: 0 auto;
    border-radius: var(--msg-arch-radius-pill);
    background-color: var(--msg-arch-pill-bg);
    color: var(--msg-center-text);
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1.0625rem;
    white-space: nowrap;
}

.msg-arch-card {
    height: fit-content;
    padding: 0.9375rem 0.625rem;
    overflow: hidden;
    border-radius: var(--msg-arch-radius-card);
    background-color: var(--msg-center-card);
    box-sizing: border-box;
    position: relative;
}

.msg-arch-card__title {
    margin: 0 0 0.625rem;
    color: var(--msg-center-text);
    font-size: 0.9375rem;
    font-weight: 500;
    line-height: 1.0625rem;
}

.msg-arch-card__content {
    margin: 0;
    color: var(--msg-arch-text);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.1875rem;
    text-align: justify;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
}

.msg-center-hero {
    display: none;
}

.msg-center-page {
    width: 100%;
    padding: 0 0 6rem;
    color: var(--msg-center-text);
    box-sizing: border-box;
}

.msg-center-list {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.msg-center-card {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: var(--msg-center-card-pc);
    overflow: hidden;
    border-radius: var(--msg-center-radius-md);
    color: var(--msg-center-text);
    box-sizing: border-box;
    position: relative;
}

.msg-center-card:hover {
    color: var(--msg-center-text);
}

.msg-center-card--notice {
    gap: 1.375rem;
    padding: 1.375rem 2rem;
    background-color: var(--msg-center-card);
    order: 2;
}

.msg-center-notice-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.75rem;
    height: 4.75rem;
    flex: 0 0 4.75rem;
    border-radius: 50%;
    background: rgba(10, 177, 140, 0.18);
}

.msg-center-notice-icon img {
    width: 2.25rem;
    height: 2.25rem;
    display: block;
}

.msg-center-card__title {
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.7;
    color: var(--msg-center-text);
}

.msg-center-card--ad {
    position: relative;
    /* min-height: var(--msg-center-ad-pc);
    background-color: #060b1a; */
    order: 1;
}

.msg-center-card--ad picture,
.msg-center-card--ad img {
    display: block;
    width: 100%;
    height: 100%;
}

.msg-center-card--ad img {
    object-fit: cover;
}

.msg-center-banner__badge {
    position: absolute;
    top: 0.25rem;
    right: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0.78125rem;
    height: 0.78125rem;
    border-radius: 50%;
    background-color: #ff3b30;
    color: var(--msg-center-text);
    font-size: 0.5rem;
    font-weight: 600;
    line-height: 0.5rem;
}

.msg-center-banner__adtag {
    position: absolute;
    right: 0;
    bottom: -3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 1.5rem;
    background-image: url(/usr/plugins/AiSuite/assets/images/msg-center-adtag-bg.svg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: var(--msg-center-adtag-text);
    font-size: 0.8rem;
    font-weight: 500;
    line-height: 1.5rem;
}

@media (max-width: 767px) {
    .msg-center-page {
        padding-bottom: 4rem;
    }

    .msg-center-list {
        gap: 1.25rem;
    }

    .msg-center-card {
        min-height: var(--msg-center-card-h5);
        border-radius: 0.625rem;
    }

    .msg-center-card--notice {
        order: 1;
        gap: 1rem;
        padding: 0.625rem 1.125rem;
    }

    .msg-center-card--ad {
        order: 2;
        min-height: var(--msg-center-card-h5);
        height: var(--msg-center-card-h5);
    }

    .msg-center-notice-icon {
        width: 2.375rem;
        height: 2.375rem;
        flex-basis: 2.375rem;
    }

    .msg-center-notice-icon img {
        width: 1.125rem;
        height: 1.125rem;
    }

    .msg-center-card__title {
        font-size: 0.75rem;
        line-height: 1.7;
    }

    .msg-center-card--ad img {
        object-fit: fill;
    }
}

@media (min-width: 768px) {
    .msg-center-hero {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 9.6875rem;
        margin-top: 5rem;
        background-color: #313030;
    }

    .msg-center-hero__title {
        margin: 0;
        color: var(--msg-center-text);
        font-size: 2.25rem;
        font-weight: 600;
        line-height: 1.35;
        letter-spacing: 3px;
    }

    .msg-center-card--ad {
        min-height: var(--msg-center-ad-pc);
        height: var(--msg-center-ad-pc);
    }
}

.msg-archives-page {
    width: 100%;
    padding: 0 0 4rem;
    color: var(--msg-center-text);
    box-sizing: border-box;
}

.msg-archives-page .sp_breadcrumb_nav {
    margin: 0 0 1.25rem;
    font-size: 0.625rem;
    line-height: 0.875rem;
    color: var(--msg-arch-text);
    opacity: 0.91;
}

.msg-archives-page .sp_breadcrumb_nav a {
    color: var(--msg-center-primary);
}

.msg-archives-page .sp_breadcrumb_nav--pc {
    display: none;
}

.msg-arch-banner {
    position: relative;
    display: block;
    width: 100%;
    height: var(--msg-arch-banner-h5-h);
    margin: 0 0 var(--msg-arch-card-gap-h5);
    overflow: hidden;
    border-radius: var(--msg-arch-radius-card);
    color: var(--msg-center-text);
    box-sizing: border-box;
}

.msg-arch-banner:hover {
    color: var(--msg-center-text);
}

.msg-arch-banner picture,
.msg-arch-banner img {
    display: block;
    width: 100%;
    height: 100%;
}

.msg-arch-banner img {
    object-fit: fill;
}

.msg-arch-banner__badge {
    position: absolute;
    top: 0.25rem;
    right: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0.78125rem;
    height: 0.78125rem;
    border-radius: 50%;
    background-color: #ff3b30;
    color: var(--msg-center-text);
    font-size: 0.5rem;
    font-weight: 600;
    line-height: 0.5rem;
}

.msg-arch-banner__adtag {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 1.5rem;
    background-image: url(/usr/plugins/AiSuite/assets/images/msg-center-adtag-bg.svg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: var(--msg-arch-adtag-text);
    font-size: 0.8rem;
    font-weight: 500;
    line-height: 1.5rem;
}

.msg-arch-list {
    display: flex;
    flex-direction: column;
    gap: var(--msg-arch-card-gap-h5);
    margin: 2rem 0 0 0;
    padding: 0;
    list-style: none;
    max-height: 40rem;
    overflow-y: auto;
}

.msg-arch-item {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.msg-arch-item__time {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6.65625rem;
    height: 1.25rem;
    margin: 0 auto;
    border-radius: var(--msg-arch-radius-pill);
    background-color: var(--msg-arch-pill-bg);
    color: var(--msg-center-text);
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1.0625rem;
    white-space: nowrap;
}

.msg-arch-card {
    height: fit-content;
    padding: 0.9375rem 0.625rem;
    overflow: hidden;
    border-radius: var(--msg-arch-radius-card);
    background-color: var(--msg-center-card);
    box-sizing: border-box;
    position: relative;
}

.msg-arch-card__title {
    margin: 0 0 0.625rem;
    color: var(--msg-center-text);
    font-size: 0.9375rem;
    font-weight: 500;
    line-height: 1.0625rem;
}

.msg-arch-card__content {
    margin: 0;
    color: var(--msg-arch-text);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.1875rem;
    text-align: justify;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
}

.msg-archives-page .page-nav {
    margin-top: var(--msg-arch-card-gap-h5);
}

@media (max-width: 767px) {
    body.card #body {
        padding-top: 0;
    }
}

@media (min-width: 768px) {
    .msg-archives-page {
        padding-bottom: 6rem;
    }

    .msg-archives-page .sp_breadcrumb_nav {
        font-size: 0.75rem;
        line-height: 1.3125rem;
    }

    .msg-archives-page .sp_breadcrumb_nav--h5 {
        display: none;
    }

    .msg-archives-page .sp_breadcrumb_nav--pc {
        display: block;
    }

    .msg-arch-banner {
        height: var(--msg-arch-banner-pc-h);
        margin-bottom: var(--msg-arch-card-gap);
        border-radius: var(--msg-arch-radius-banner-pc);
    }

    .msg-arch-banner__badge {
        /* display: none; */
    }

    .msg-arch-item {
        position: relative;
        gap: 0;
    }

    .msg-arch-banner img {
        object-fit: cover;
    }

    .msg-arch-item__time {
        position: absolute;
        top: 1.5rem;
        right: 1.5rem;
        z-index: 1;
        width: auto;
        height: auto;
        margin: 0;
        border-radius: 0;
        background-color: transparent;
        color: var(--msg-arch-time);
        font-size: 1.25rem;
        font-weight: 400;
        line-height: 2.125rem;
    }

    .msg-arch-card {
        height: auto;
        min-height: fit-content;
        padding: 1.5rem;
        overflow: visible;
    }

    .msg-arch-card__title {
        margin: 0 0 0.625rem;
        padding-right: 10rem;
        font-size: 1.25rem;
        line-height: 2.125rem;
    }

    .msg-arch-card__content {
        font-size: 0.875rem;
        line-height: 1.5rem;
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .msg-archives-page .page-nav {
        margin-top: var(--msg-arch-card-gap);
    }
}

/* IM 公共样式 end */