* {
    margin: 0;
    padding: 0;
}

body {
    background: #000000;
}

a {
    text-decoration: none;
}

div {
    box-sizing: border-box;
}

.xiang {
    position: relative;
}

.jue {
    position: absolute;
}

.shuijz {
    left: 50%;
    transform: translateX(-50%);
}

.chuijz {
    top: 50%;
    transform: translateY(-50%);
}

.scjz {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

[v-cloak] {
    display: none;
}

.container {
    width: 100%;
    /* height: 100%; */
    max-width: 1920px;
    height: 5830px;
    margin: auto;
    position: relative;
    padding-top: 95px;
    overflow: hidden;
    z-index: 1;
}

.background-layers {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1920px;
    height: 5830px;
    z-index: 0;
}

.bg-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1013px;
    object-fit: cover;
    z-index: 1;
}

.bg-middle {
    position: absolute;
    top: 725px;
    left: 0;
    width: 100%;
    height: 546px;
    background: url(https://img.youxi290.com/khm/xchd2026/bg2.png) center center;
    background-size: cover;
    z-index: 3;
}

.bg-bottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5830px;
    background: url(https://img.youxi290.com/khm/xchd2026/bg3.png) center center;
    background-size: cover;
    z-index: 2;
}

.change_server {
    width: 200px;
    height: 70px;
    background: url(https://img.youxi290.com/khm/xchd2026/server_bg.png) center top;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: -60px;
    right: 318px;
    z-index: 11;
    font-family: SourceHanSansCN-Medium;
    text-align: center;
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 61px;
    letter-spacing: 0px;
    color: #722800;
    cursor: pointer;
}

.change_server:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/server_bg2.png) center top no-repeat;
    background-size: 100% 100%;
}

.top_title {
    width: 1376px;
    height: 402px;
    background: url(https://img.youxi290.com/khm/xchd2026/top_title.png) center top no-repeat;
    background-size: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 3;
}

.pagediv {
    width: 900px;
    display: flex;
    margin: 92px auto 0;
    justify-content: space-around;
}

.top_div {
    width: 175px;
    height: 175px;
    position: relative;
    cursor: pointer;
    transition: 0.3s;
}

.with_center_img::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: 50%;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none;
}

.center_img_hsxb::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/top_bg1_3.png);
}

.center_img_hlhg::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/top_bg2_3.png);
}

.center_img_xcqy::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/top_bg3_3.png);
}

.center_img_xchs::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/top_bg4_3.png);
}

.top_hsxb {
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg1_1.png) center no-repeat;
    background-size: 100%;
}

.top_hsxb:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg1_2.png) center no-repeat;
    background-size: 100%;
}

.top_hlhg {
    margin-top: 100px;
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg2_1.png) center no-repeat;
    background-size: 100%;
}

.top_hlhg:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg2_2.png) center no-repeat;
    background-size: 100%;
}

.top_xcqy {
    margin-top: 100px;
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg3_1.png) center no-repeat;
    background-size: 100%;
}

.top_xcqy:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg3_2.png) center no-repeat;
    background-size: 100%;
}

.top_xchs {
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg4_1.png) center no-repeat;
    background-size: 100%;
}

.top_xchs:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/top_bg4_2.png) center no-repeat;
    background-size: 100%;
}

.content {
    margin: 274px auto 0;
}

.hsxb {
    width: 1367px;
    margin: 0 auto;
}

.content_title {
    width: 978px;
    height: 247px;
    background-size: 100%;
    margin: 0 auto;
    position: relative;
}

.hsxb_title {
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_title.png) center no-repeat;
}

.hlhg_title {
    background: url(https://img.youxi290.com/khm/xchd2026/hlhk_title.png) center no-repeat;
}

.xcqy_title {
    background: url(https://img.youxi290.com/khm/xchd2026/xcqy_title.png) center no-repeat;
}

.xchs_title {
    background: url(https://img.youxi290.com/khm/xchd2026/xchs_title.png) center no-repeat;
}

.hsxb_tab {
    margin-top: 56px;
    transform: translateX(131px);
    position: relative;
}

.hsxb_tab_bg {
    display: inline-block;
    width: 269px;
    height: 76px;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_tab.png) center no-repeat;
    background-size: 100%;
    font-family: SourceHanSerifCN-Heavy;
    font-size: 22px;
    color: #876229;
    text-align: center;
    line-height: 77px;
    cursor: pointer;
}

.hsxb_tab_active {
    color: #ffedaf;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_tab_active.png) center no-repeat;
}

.hsxb_tab_bg:hover {
    color: #ffedaf;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_tab_active.png) center no-repeat;
}

.hsxb_tab_bg:nth-child(2) {
    margin-left: 26px;
}

.hsxb_jf {
    display: inline-block;
    width: 20px;
    height: 42px;
    font-family: SourceHanSerifCN-Bold;
    font-size: 20px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 22px;
    letter-spacing: 2px;
    color: #f8cb86;
    margin-left: 236px;
    vertical-align: middle;
}

.jf_num {
    display: inline-block;
    width: 290px;
    height: 45px;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_jf.png) center no-repeat;
    background-size: 100%;
    vertical-align: middle;
    margin-left: 12px;
    padding-left: 60px;
    font-family: SourceHanSerifCN-Bold;
    font-size: 24px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 35px;
    letter-spacing: 2px;
    color: #f8cb86;
}

.hsxb_content_bg {
    margin-top: 24px;
    width: 1367px;
    height: 561px;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_bg.png) center no-repeat;
    background-size: 100%;
    position: relative;
}

.hsxb_server {
    /* position: absolute;
    top: -20px;
    left: 118px; */
    margin-top: 100px;
    font-family: SourceHanSerifCN-Bold;
    font-size: 20px;
    line-height: 35px;
    letter-spacing: 2px;
    color: #9a4933;
}

.hsxb_left,
.hsxb_right {
    position: absolute;
}

.hsxb_left {
    left: 114px;
    top: 95px;
}

.hsxb_left .title {
    width: 238px;
    height: 39px;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_left_title.png) center no-repeat;
    background-size: 100%;
}

.hsxb_left_content {
    margin-top: 35px;
    font-family: SourceHanSerifCN-Heavy;
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0px;
    color: #9a4933;
}

.hsxb_left_content .rule {
    font-weight: bold;
    margin-bottom: 25px;
}

.hsxb_left_content>p:nth-child(4) {
    margin-top: 25px;
}

.hsxb_right {
    right: 119px;
    top: 93px;
}

.hsxb_right_btn {
    width: 264px;
    height: 77px;
    background-size: 100%;
    font-family: SourceHanSerifCN-Bold;
    font-size: 26px;
    line-height: 68px;
    letter-spacing: 3px;
    color: #ffedaf;
    text-align: center;
    cursor: pointer;
    margin-bottom: 15px;
    transition: 0.3s;
}

.hsxb_right_btn.right {
    margin-left: 27px;
}

.hsxb_right_btn.red {
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_right_btn.png) center no-repeat;
}

.hsxb_right_btn.red:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_right_btn_red.png) center no-repeat;
}

.hsxb_right_btn.yellow {
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_right_btn.png) center no-repeat;
}

.hsxb_right_btn.yellow:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_right_btn_yellow.png) center no-repeat;
}

.hsxb_one_top {
    position: absolute;
    top: 483px;
    left: 361px;
    width: 118px;
    height: 24px;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_one_top.png) center no-repeat;
    background-size: 100%;
}

.hsxb_one,
.hsxb_ten {
    position: absolute;
    width: 376px;
    height: 118px;
    background-size: 100%;
    cursor: pointer;
}

.hsxb_one {
    top: 501px;
    left: 298px;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_one.png) center no-repeat;
    transition: 0.3s;
}

.hsxb_one:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_one_active.png) center no-repeat;
}

.hsxb_ten {
    top: 501px;
    left: 679px;
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_ten.png) center no-repeat;
    transition: 0.3s;
}

.hsxb_ten:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/hsxb_ten_active.png) center no-repeat;
}



.hlhg {
    width: 1343px;
    margin: 175px auto 0;
}

.hlhg_content_bg {
    margin-top: 21px;
    width: 1343px;
    height: 647px;
    background: url(https://img.youxi290.com/khm/xchd2026/hlhg_bg.png) center no-repeat;
    background-size: 100%;
    position: relative;
}

.hlhg_rule {
    position: absolute;
    top: 61px;
    left: 145px;
    width: 80px;
    height: 240px;
    background-image: url(https://img.youxi290.com/khm/xchd2026/hlhg_rule.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    font-family: SourceHanSerifCN-Bold;
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 2px;
    color: #ffedaf;
    writing-mode: vertical-rl;
    text-orientation: upright;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.3s;
}

.hlhg_rule:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hlhg_rule_active.png);
}

.hlhg_hb {
    position: absolute;
    right: 10px;
    bottom: 49px;
    width: 170px;
    height: 186px;
    background-image: url(https://img.youxi290.com/khm/xchd2026/hlhg_hb.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    font-family: SourceHanSerifCN-Bold;
    font-size: 18px;
    line-height: 22px;
    color: #fff3d8;
    text-align: center;
    padding-top: 85px;
    text-shadow: 1px 1px 1px #000;
    transition: 0.3s;
}

.hlhg_hb:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hlhg_hb_active.png);
}

.hlhg .title {
    padding-top: 80px;
    /* font-family: ZHFTSS_T; */
    font-size: 36px;
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #410000 0%,
            /* 起始颜色和位置 */
            #d51111 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-weight: bold;
}

.hlhg .text {
    font-family: SourceHanSerifCN-Heavy;
    font-size: 20px;
    font-style: italic;
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #ff1111 0%,
            /* 起始颜色和位置 */
            #950300 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;

    /* 使文字颜色透明，显示背景渐变 */
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-align: center;
}

.start_btn {
    position: absolute;
    left: 483px;
    bottom: -32px;
    width: 376px;
    height: 118px;
    background: url(https://img.youxi290.com/khm/xchd2026/hlhg_start_btn.png) center no-repeat;
    background-size: 100%;
    font-family: SourceHanSansCN-Medium;
    font-size: 40px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 110px;
    letter-spacing: 2px;
    color: #ffedaf;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
}

.start_btn:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/hlhg_start_btn_active.png) center no-repeat;
}

.start_btn.active {
    filter: grayscale(100%);
}

.cards {
    margin: 25px auto 0;
    margin-bottom: 30px;
    width: 733px;
    height: 350px;
    display: flex;
    justify-content: center;
    gap: 32px;
}

.card {
    width: 201px;
    height: 350px;
    cursor: pointer;
    position: relative;
    perspective: 800px;
}

.card .front,
.card .back {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    backface-visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5em;
    transition: transform 0.6s, background 0.2s;
}

.card .front {
    background: url(https://img.youxi290.com/khm/xchd2026/hlhg_card.png) center no-repeat;
    background-size: 100%;
    z-index: 2;
    transform: rotateY(0deg);
}

.card.flipped .front {
    transform: rotateY(180deg);
}

.card .front_icon {
    height: 57px;
    background-size: cover;
    transform: translateY(-16px);
}

.card .front_2 {
    width: 48px;
    background: url(https://img.youxi290.com/khm/xchd2026/2yuan.png) center no-repeat;
}

.card .front_40 {
    width: 66px;
    background: url(https://img.youxi290.com/khm/xchd2026/40yuan.png) center no-repeat;
    background-size: cover;
}

.card .front_100 {
    width: 83px;
    background: url(https://img.youxi290.com/khm/xchd2026/100yuan.png) center no-repeat;
}

.card .front_text {
    position: absolute;
    bottom: 80px;
    font-size: 15px;
    color: #eda57d;
}

.card .back {
    width: 201px;
    height: 350px;
    background: url(https://img.youxi290.com/khm/xchd2026/hlhg_back.png) center no-repeat;
    background-size: 100%;
    transform: rotateY(180deg);
    z-index: 1;
    transition: transform 0.6s, background 0.2s;
}

.card.flipped .back {
    transform: rotateY(0deg);
}

.card .back:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/hlhg_back_active.png) center no-repeat;
}

.start_btn.disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

.xcqy {
    width: 1386px;
    margin: 85px auto 0;
}

.xcqy_content_bg {
    margin-top: 61px;
    width: 1386px;
    height: 701px;
    background: url(https://img.youxi290.com/khm/xchd2026/xcqy_bg.png) center no-repeat;
    background-size: 100%;
    position: relative;
}

.xcqy_content_bg .title {
    margin-right: 30px;
    padding-top: 17px;
    /* font-family: ZHFTSS_T; */
    font-size: 36px;
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #410000 0%,
            /* 起始颜色和位置 */
            #d51111 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-weight: bold;
}

.fu_title {
    margin-top: 15px;
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 2px;
    color: #af0d0d;
    text-align: center;
}

.main_title {
    margin-top: 30px;
    font-weight: bold;
    text-align: center;
    font-size: 24px;
    color: #a32803;
}

.xcqy_fire {
    width: 850px;
    height: 370px;
    margin: 30px auto 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.xcqy_bp {
    display: flex;
    justify-content: space-around;
}

.xcqy_fire_zi {
    width: 250px;
    height: 346px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
}

.xcqy_fire_zi div {
    width: 300px;
    height: 300px;
    background: url(https://img.youxi290.com/khm/xchd2026/bp/bp1.png);
    margin: 0 36px 39px 0;
    background-position: -250px -297px;
}

.xcqy_fire_zi img {
    /* width: 120px; */
    margin: 0 36px 39px 0;
}

.xcqy_fire_zi span {
    width: 210px;
    height: 55px;
    background-image: url(https://img.youxi290.com/khm/xchd2026/bp/ljdh.png);
    background-size: 100% 100%;
    font-size: 24px;
    color: #ffffff;
    font-weight: bold;
    line-height: 55px;
    text-align: center;
    text-shadow: 0px 0px 5px #971e06;
    cursor: pointer;
}

.xcqy_fire_zi span:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/bp/ljdhact.png);
}

.xcqy_dh {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.xcqy_dan {
    width: 100%;
    height: 100%;
    position: relative;
    transform: scale(0.2);
}

.xcqy_xfxs {
    width: 1162px;
    height: 686px;
    display: flex;
    align-items: center;
    justify-content: center;
}



.xcqy_dh,
.xcqy_dan,
.xcqy_ql,
.xcqy_xfxs {
    transition: all 1.5s ease;
    opacity: 0;
}


.xcqy_dh.show,
.xcqy_ql.show,
.xcqy_xfxs.show {
    opacity: 1;
}

.xcqy_dan.show {
    opacity: 1;
    transform: scale(0.6);
}


.xcqy_dh .dp7,
.xcqy_dh .dp8,
.xcqy_dh .dp9 {
    width: 380px;
    height: 380px;
}


.scqy_danzi {
    width: 310px;
    height: 420px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 1.5s ease;
    opacity: 0;
    pointer-events: none;
    /* 非活动状态不响应点击 */
}

.scqy_danzi.show {
    opacity: 1;
    pointer-events: auto;
    /* 活动状态响应点击 */
}


.scqy_danzi div {
    width: 260px;
    height: 320px;
    position: absolute;
    top: 36px;
    left: 24px;
    cursor: pointer;
    z-index: 4;
}

.xcqy_dan img {
    position: absolute;
    transform: translate(-50%, -50%);
}

.xcqy_dan .dan1 {
    width: 350px;
    top: 40%;
    left: 50%;
    z-index: 2;
}

.xcqy_dan .dan2 {
    width: 150px;
    top: 17%;
    left: 70%;
    z-index: 1;
}

.xcqy_dan .dan3 {
    width: 300px;
    top: 77%;
    left: 36%;
    z-index: 3;
}

.xcqy_dan .dan4 {
    width: 340px;
    top: 31%;
    left: 50%;
    z-index: 2;
}

.xcqy_dan .dan5 {
    width: 340px;
    top: 66%;
    left: 50%;
    z-index: 2;
}

.xcqy_ql {
    width: 100vw;
    height: 100vh;
    position: fixed;
    right: 0;
    bottom: 0;
    background-color: #00000060;
    transition: opacity 3s ease, transform 3s ease, width 3s ease, height 3s ease;
}

.xcqy_ql.active {
    width: 260px;
    height: 320px;
    position: absolute;
    background: none;
}

.xcqy_ql.active .qltypr {
    width: 350px;
    height: auto;
    top: 0;
    right: 0;
    transform: none;
}

.qltypr {
    position: absolute;
    width: 932px;
    height: 869px;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    transition: all 3s ease;
}

.actt {
    width: 260px;
    height: 320px;
    bottom: 50px;
    right: 20px;
    position: relative;
}

.gbi {
    width: 40px;
    height: 40px;
    background-image: url(https://img.youxi290.com/khm/xchd2026/bp/guabi.png);
    background-size: 100% 100%;
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    z-index: 10;
}

.xcqy_xfxs .xfdi {
    width: 1162px;
    height: 686px;
    background-image: url(https://img.youxi290.com/khm/xchd2026/bp/xfdiact.png);
    background-size: 106% 100%;
    padding: 160px 148px 137px 433px;
    box-sizing: border-box;
    font-family: '楷体';
    color: #d74d28;
}

.xcqy_xfxs .xfdi p {
    font-size: 39px;
    font-family: '楷体';
    font-weight: bold;
}

.xcqy_xfxs .xfdi span {
    display: inline-block;
    font-size: 33px;
    /* text-align: center; */
    font-weight: bold;
    margin: 20px 0 0 39px;
}


.xchs {
    width: 1323px;
    margin: 0 auto;
}

.xchs_content_bg {
    margin-top: 21px;
    width: 1323px;
    height: 673px;
    background: url(https://img.youxi290.com/khm/xchd2026/xchs_bg.png) center no-repeat;
    background-size: 100%;
    position: relative;
}

.xchs_news {
    /* padding-top: 128px; */
    transform: translateY(120px);
    width: 995px;
    margin: 0 auto;
    max-height: 400px;
    overflow-y: auto;
}

.xchs_news::-webkit-scrollbar {
    width: 7px;
    height: 8px;
}

.xchs_news::-webkit-scrollbar-track {
    border-radius: 10px;
}

/* 滚动条滑块 */
.xchs_news::-webkit-scrollbar-thumb {
    background: #ff9000;
    border-radius: 10px;
}

.xchs_news p {
    display: inline;
    font-size: 0;
}

.xchs_news a {
    display: block;
    width: 450px;
    height: 65px;
    border-radius: 32px;
    border: solid 2px #ff9000;
    background-color: #f5bf9d;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    line-height: 60px;
    box-sizing: border-box;
    margin: 0 17px 16px;
    cursor: pointer;
    text-decoration: none;
    float: left;
}


.xchs_new {
    width: 571px;
    height: 61px;
    border: solid 1px #c19e7b;
    font-family: SourceHanSansCN-Regular;
    font-size: 16px;
    line-height: 26px;
    color: #c46824;
    margin-bottom: 9px;
    padding: 16px;
    cursor: pointer;
    transition: 0.3s;
}

.xchs_new:hover {
    font-size: 18px;
    color: #763211;
    background-color: #d1b191;
}

.xchs_new:hover .new_img {
    background: url(https://img.youxi290.com/khm/xchd2026/xchs_xw_active.png) center no-repeat;
}

.xchs_new a {
    color: inherit;
    text-decoration: none;
}

.new_img {
    display: inline-block;
    width: 56px;
    height: 29px;
    background: url(https://img.youxi290.com/khm/xchd2026/xchs_xw.png) center no-repeat;
    background-size: 100%;
    float: left;
}

.new_time {
    float: right;
}

.new_content {
    margin-left: 10px;
}

.left_fix {
    position: fixed;
    top: 50%;
    left: 40px;
    width: 230px;
    height: 432px;
    z-index: 10;

    /* 默认隐藏：用过渡做平滑出现/消失 */
    opacity: 0;
    transform: translateY(-50%);
    pointer-events: none;
    transition: opacity 260ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

.left_fix.is-visible {
    opacity: 1;
    /* transform: translateY(0); */
    pointer-events: auto;
}

.left_fix .line {
    width: 12px;
    height: 393px;
    background: url(https://img.youxi290.com/khm/xchd2026/left_fix_line.png) center no-repeat;
    background-size: 100% 100%;
    margin: 0;
    position: absolute;
}

.left_fix>div:not(.line):not(.gotoTop) {
    width: 230px;
    height: 70px;
    cursor: pointer;
    font-size: 24px;
    color: #fffdbd;
    transition: 0.3s;
    margin-bottom: 27px;
    margin-left: -15px;
    text-align: center;
    line-height: 60px;
    padding-left: 10px;
}

.left_fix>div:not(.line):not(.gotoTop):hover {
    /* font-weight: bold; */
    background: url(https://img.youxi290.com/khm/xchd2026/left_fix_active.png) center no-repeat;
    background-size: 100% 100%;
}

.gotoTop {
    width: 230px;
    height: 70px;
    cursor: pointer;
    font-size: 24px;
    color: #fffdbd;
    transition: 0.3s;
    margin-bottom: 27px;
    margin-left: -15px;
    text-align: center;
    line-height: 60px;
    padding-left: 10px;
}

.gotoTop:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/gotop.png) center no-repeat;
    background-size: 100% 100%;
}

.alert_outbox {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 101;
    background: rgba(0, 0, 0, 0.5);
    /* display: none; */
}

.small_alert {
    width: 568px;
    height: 285px;
    background: url(https://img.youxi290.com/khm/xchd2026/small_alert.png) center no-repeat;
    background-size: 100% 100%;
}

.small_alert.act1 {
    width: 889px;
    height: 512px;
    padding-top: 20px;
}

/* 切换服务器弹窗（按截图的“2个下拉 + 底部2按钮”布局） */
.qiehuan_modal {
    padding: 0 70px;
}

.qiehuan_title {
    margin-top: 34px;
}

.qiehuan_form {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.qiehuan_row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.qiehuan_label {
    width: 64px;
    text-align: right;
    font-family: SourceHanSansCN-Medium;
    font-size: 16px;
    color: #9f462a;
    letter-spacing: 1px;
}

.qiehuan_select {
    padding: 0 10px;
    width: 158px;
    height: 30px;
    background-color: #fffdf3;
    border-radius: 3px;
    border: solid 1px #e87944;
    outline: none;
}

.qiehuan_actions {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 50px;
    display: flex;
    justify-content: center;
    gap: 70px;
}

.qiehuan_actions .alert_btn {
    margin-left: 0;
    /* 覆盖通用样式里的 margin-left */
}

.alert_close {
    width: 33px;
    height: 32px;
    background: url(https://img.youxi290.com/khm/xchd2026/alert_close.png) center no-repeat;
    background-size: 100% 100%;
    transition: 0.3s;
    cursor: pointer;
    position: absolute;
    top: 32px;
    right: 54px;
}

.alert_close:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/alert_close_active.png);
}

.alert_outbox .title,
.alert_outbox .jian {
    font-family: SourceHanSansCN-Bold;
    font-size: 25px;
    line-height: 54px;
    font-weight: bold;
    margin-top: 30px;
}

.jian {
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #b93e13 0%,
            /* 起始颜色和位置 */
            #d51111 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;

    /* 使文字颜色透明，显示背景渐变 */
    color: transparent;
    -webkit-text-fill-color: transparent;

    /* 可选：添加文字阴影增强可读性 */
    /* text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */

    /* 居中显示 */
    /* margin: 50px auto; */
    text-align: center;
    /* width: fit-content; */
}

.qrcode {
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
    /* background-color: white; */
    text-align: center;
}

.qrcode img {
    width: 150px;
    margin: 0 10px;
}

.alert_outbox p {
    text-align: center;
    color: #9f462a;
}

.alert_msg {
    font-size: 20px;
    height: 115px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.alert_msg p {
    margin: 0;
    line-height: 28px;
}

.alert_btn {
    display: inline-block;
    width: 116px;
    height: 34px;
    background: url(https://img.youxi290.com/khm/xchd2026/alert_btn.png) center no-repeat;
    background-size: 100% 100%;
    transition: 0.3s;
    cursor: pointer;
    font-size: 18px;
    color: #fff4df;
    text-align: center;
    margin-left: 113px;
    line-height: 35px;
}

.alert_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/alert_btn_active.png);
}

.rule_alert {
    width: 998px;
    height: 690px;
    background: url(https://img.youxi290.com/khm/xchd2026/rule_alert.png) center no-repeat;
    background-size: 100% 100%;
}

.rule_close {
    top: 50px;
    right: 80px;
}

.alert_outbox .rule_title {
    margin-top: 50px;
    font-size: 30px;
}

.rule_content {
    margin: 20px auto 0;
    width: 780px;
}

.rule_content p {
    font-size: 17px;
    line-height: 30px;
    color: #9f462a;
    text-align: left;
    margin-top: 10px;
}

.prize_alert {
    width: 941px;
    height: 471px;
    background: url(https://img.youxi290.com/khm/xchd2026/prize_alert.png) center no-repeat;
    background-size: 100% 100%;
}

.prize_close {
    top: 50px;
    right: 80px;
}

.alert_outbox .prize_title {
    margin-top: 40px;
}

.treasure {
    width: 971px;
    height: 486px;
}

/* 奖池弹窗 */
.prizepool_tab_hint {
    width: 758px;
    margin: 0 auto;
    padding-bottom: 6px;
    font-size: 14px;
    color: #6b2a10;
    opacity: 0.8;
}

.prizepool_tabs {
    width: 758px;
    margin: 0 auto;
    display: flex;
    overflow: hidden;
}

.prizepool_tab {
    position: relative;
    flex: 1;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: SourceHanSerifCN-Bold;
    font-size: 18px;
    letter-spacing: 2px;
    border: solid 1px rgba(191, 59, 25, 0.22);
    cursor: pointer;
}

.prizepool_tab.is-green {
    color: #294e37;
}

.prizepool_tab.is-blue {
    color: #1d4567;
}

.prizepool_tab.is-purple {
    color: #4a2679;
}

.prizepool_tab.is-orange {
    color: #bf3b19;
}

.prizepool_tab.is-active {
    background: #e0e0e0 !important;
}

.prize_cards.prize_cards_grid {
    width: 730px;
    height: 230px;
    margin: 25px auto 0;
    overflow-y: auto;
}

.prize_cards::-webkit-scrollbar {
    width: 10px;
}

.prize_cards::-webkit-scrollbar-thumb {
    background-color: #ecb48c;
    border-radius: 8px;
}

.prize_cards::-webkit-scrollbar-track {
    background-color: #e2cebe;
    border-radius: 8px;
}

.prize_card {
    display: inline-block;
    width: 110px;
    height: 110px;
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-left: 10px;
    position: relative;
}

.prize_card img {
    position: absolute;
    width: 66px;
    height: 66px;
    left: 22px;
    top: 22px;
}

.prize_card_name {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    text-shadow: 0.01rem 0.01rem 0.07rem rgb(0 0 0), 0.02rem 0.02rem 0.11rem rgb(0 0 0), 0.02rem 0.02rem 0.11rem rgb(0 0 0);
}

/* 寻宝记录弹窗表格 */
.record_content {
    width: 720px;
    height: 270px;
    margin: 26px auto 0;
    display: flex;
    align-items: center;
}

.record_table {
    width: 100%;
    border: 2px solid #b34c2b;
    border-radius: 3px;
    /* overflow: hidden; */
    background: rgba(255, 240, 221, 0.55);
}

.record_row {
    display: flex;
    width: 100%;
    height: 44px;
}

.record_row+.record_row {
    border-top: 1px solid #b34c2b;
}

.record_header {
    height: 46px;
    background: #da916d;
}

.record_list {
    width: 100%;
    max-height: 220px;
    min-height: 44px;
    overflow-y: auto;
}

.record_list::-webkit-scrollbar {
    display: none;
}

.record_col {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN-Medium;
    font-size: 18px;
    color: #7a2f12;
    letter-spacing: 1px;
}

.record_col.quality1 {
    color: #53b901;
}

.record_col.quality2 {
    color: #12d1ff;
}

.record_col.quality3 {
    color: #c200ff;
}

.record_col.quality4 {
    color: #ff7800;
}

.record_col+.record_col {
    border-left: 1px solid #b34c2b;
}

.record_header .record_col {
    font-family: SourceHanSerifCN-Bold;
    font-size: 20px;
    color: #722800;
}

.qsyo {
    width: 86px;
    height: 34px;
    font-size: 16px;
    border-radius: 20px;
    background-color: #cd1818;
    color: #ffffff;
    text-align: center;
    line-height: 34px;
}

.qsyo.active {
    background-color: #666666;

}

.record_empty {
    width: 100%;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN-Medium;
    font-size: 18px;
    color: #9f462a;
}

.store_alert {
    width: 1074px;
    height: 859px;
    background: url(https://img.youxi290.com/khm/xchd2026/store_alert.png) center no-repeat;
    background-size: 100% 100%;
    padding-top: 235px;
}

.store_close {
    width: 71px;
    height: 71px;
    background: url(https://img.youxi290.com/khm/xchd2026/store_close.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    position: absolute;
    bottom: -27px;
    left: 509px;
}

.store_close:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/store_close_active.png) center no-repeat;
}

.store_title {
    font-family: SourceHanSansCN-Bold;
    font-size: 30px;
    line-height: 54px;
    color: #3c6249;
    text-align: center;
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #f9eab5 0%,
            /* 起始颜色和位置 */
            #fff5e7 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.store_jf {
    font-size: 20px;
    line-height: 40px;
    color: #5d280d;
    margin-left: 730px;
}

.prize_lists {
    width: 780px;
    height: 400px;
    margin: 0 auto;
    overflow-y: auto;
}

.prize_lists::-webkit-scrollbar {
    display: none;
}

.prize_list {
    display: inline-block;
    width: 123px;
    height: 167px;
    margin-left: 25px;
    margin-top: 25px;
}

.xianl {
    font-size: 14px;
    color: #ab2800;
    text-align: center;
}

.prize {
    width: 76px;
    height: 76px;
    background-color: #4c2919;
    box-shadow: 0px 2px 15px 1px rgba(135, 54, 0, 0.54);
    border-style: solid;
    border-width: 3px;
    border-image-source: linear-gradient(-44deg,
            #b78838 0%,
            #f1d971 100%);
    border-image-slice: 1;
    margin: 9px auto 0;
}

.prize img {
    width: 70px;
    height: 70px;
}

.prize_name {
    width: 119px;
    height: 29px;
    /* 背景放到伪元素里做两侧“虚化/羽化” */
    background-color: transparent;
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 16px;
    color: #333333;
    line-height: 28px;
    margin-top: 2px;
    position: relative;
    z-index: 0;
    overflow: hidden;
}

.prize_name::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    /* 只让背景变透明，不影响文字 */
    background-color: rgba(236, 208, 123, 0.7);

    border: 1px solid transparent;
    box-sizing: border-box;
    border-image-source: linear-gradient(0deg, #c16747 0%, #c8775e 100%);
    border-image-slice: 1;

    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 82%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 82%, transparent 100%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    pointer-events: none;
}

.prize_jf {
    width: 123px;
    height: 32px;
    background: url(https://img.youxi290.com/khm/xchd2026/store_get.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    text-align: center;
    font-size: 16px;
    color: #fffaef;
    margin-top: 6px;
    line-height: 30px;
}

.prize_jf.gray {
    filter: grayscale(0.8) !important;
}

.prize_jf:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/store_get_active.png) center no-repeat;
}

.exchange_alert {
    width: 609px;
    height: 392px;
    background: url(https://img.youxi290.com/khm/xchd2026/exchange_alert.png) center no-repeat;
    background-size: 100% 100%;
    position: relative;
}

.exchange_close {
    width: 35px;
    height: 35px;
    background: url(https://img.youxi290.com/khm/xchd2026/exchange_close.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    position: absolute;
    top: 29px;
    right: 50px;
    z-index: 20;
}

.exchange_close:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/exchange_close_active.png) center no-repeat;
}

.exchange_btn {
    width: 192px;
    height: 50px;
    background: url(https://img.youxi290.com/khm/xchd2026/exchange_btn.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    font-family: SourceHanSansCN-Bold;
    font-size: 22px;
    letter-spacing: 1px;
    color: #640e00;
    text-align: center;
    line-height: 44px;
}

.exchange_btn:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/exchange_btn_active.png) center no-repeat;
}

.exchange_text {
    position: absolute;
    left: 0;
    right: 0;
    top: 40px;
    text-align: center;
    color: #7a2f12;
}

.exchange_title_small {
    font-family: SourceHanSerifCN-Bold;
    font-size: 18px;
}

.exchange_title_big {
    font-family: SourceHanSerifCN-Bold;
    font-size: 23px;
    letter-spacing: 1px;
    color: #b93e13;
}

.exchange_item_content {
    width: 76px;
    height: 76px;
    background-color: #4c2919;
    box-shadow: 0px 2px 15px 1px rgba(135, 54, 0, 0.54);
    border-style: solid;
    border-width: 3px;
    border-image-source: linear-gradient(-44deg, #b78838 0%, #f1d971 100%);
    border-image-slice: 1;
    margin: 15px auto 0;
}

.exchange_item_content img {
    width: 96%;
    height: 96%;
    margin: 2%;
}

.exchange_item_name {
    margin-top: 15px;
    font-family: SourceHanSansCN-Medium;
    font-size: 18px;
    line-height: 26px;
    color: #a55a3a;
}

.exchange_qty_row {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: SourceHanSansCN-Medium;
    font-size: 18px;
    color: #a55a3a;
}

.exchange_step {
    width: 22px;
    height: 22px;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    line-height: 1;
}

.exchange_qty_num {
    width: 30px;
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 18px;
    color: #b93e13;
}

.exchange_btns {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 63px;
    display: flex;
    justify-content: center;
    gap: 44px;
}

.pay_alert {
    width: 549px;
    height: 310px;
    background: url(https://img.youxi290.com/khm/xchd2026/pay_alert.png) center no-repeat;
    background-size: 100% 100%;
    position: relative;
    padding-top: 39px;
}

.pay_back {
    position: absolute;
    top: 40px;
    left: 65px;
    height: 24px;
    line-height: 24px;
    padding-left: 15px;
    background: url(https://img.youxi290.com/khm/xchd2026/pay_back.png) left center no-repeat;
    font-family: SourceHanSansCN-Medium;
    font-size: 16px;
    color: #9f462a;
    cursor: pointer;
}

.pay_title {
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 22px;
    color: #651d0f;
}

.pay_price {
    margin-top: 40px;
    text-align: center;
    color: #b93e13;
}

.pay_price_num {
    font-family: SourceHanSansCN-Bold;
    font-size: 48px;
    letter-spacing: 2px;
    font-weight: bold;
}

.pay_price_unit {
    font-family: SourceHanSansCN-Medium;
    font-size: 22px;
}

.pay_qty_row {
    margin-top: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: SourceHanSansCN-Medium;
    font-size: 16px;
    color: #a55a3a;
}

.pay_step {
    width: 22px;
    height: 22px;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.pay_qty_input {
    width: 56px;
    height: 22px;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.35);
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 16px;
    color: #b93e13;
    outline: none;
}

.pay_btn {
    width: 191px;
    height: 50px;
    margin: 30px auto 0;
    background: url(https://img.youxi290.com/khm/xchd2026/pay_btn.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 18px;
    color: #640e00;
    transition: 0.3s;
}

.pay_btn:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/pay_btn_active.png) center no-repeat;
    background-size: 100% 100%;
}

.pay_method_list {
    width: 320px;
    margin: 30px auto 0;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 0 0 1px rgba(175, 117, 76, 0.45);
}

.pay_method_item {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    background-color: #fffcec;
    cursor: pointer;
}

.pay_method_item+.pay_method_item {
    border-top: 1px solid rgba(201, 165, 123, 0.7);
}

.pay_method_item.active {
    background-color: #e3dec8;
}

.pay_method_left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pay_method_icon {
    width: 30px;
    height: 30px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.pay_method_icon--alipay {
    background-image: url(https://img.youxi290.com/khm/xchd2026/alipay.png);
}

.pay_method_icon--wechat {
    background-image: url(https://img.youxi290.com/khm/xchd2026/wechat.png);
}

.pay_method_text {
    font-family: SourceHanSansCN-Medium;
    font-size: 16px;
    color: #5b240d;
}

.pay_method_check {
    width: 20px;
    height: 20px;
    background: url(https://img.youxi290.com/khm/xchd2026/pay_dui.png) center no-repeat;
    background-size: 100% 100%;
}

.pay_content {
    margin-top: 80px;
    margin-bottom: 74px;
    text-align: center;
    font-size: 18px;
    letter-spacing: 1px;
    color: #a03c29;
}

.pay_close {
    position: absolute;
    top: 38px;
    right: 55px;
    width: 32px;
    height: 32px;
    background: url(https://img.youxi290.com/khm/xchd2026/pay_close.png) center no-repeat;
    background-size: cover;
    cursor: pointer;
    transition: 0.3s;
}

.pay_close:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/pay_close_active.png) center no-repeat;
    background-size: cover;
}

.hs {
    width: 97px;
    height: 95px;
    background-size: 100% 100%;
}

.pay_item {
    font-size: 18px;
    margin-top: 30px;
}

.pay_hs {
    margin: 10px auto 0;
}

.hs_normal {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_normal.png);
}

.hs_cyan {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_cyan.png);
}

.hs_orange {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_orange.png);
}

.hs_green {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_green.png);
}

.hs_purple {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_purple.png);
}

.bag_content {
    width: 780px;
    margin: 26px auto 0;
}

.bag_header {
    padding-bottom: 6px;
    border-bottom: solid 2px #e54d30;
    margin-bottom: 6px;
}

.bag_header_row {
    display: flex;
    height: 44px;
    align-items: center;
    font-family: SourceHanSansCN-Medium;
    font-size: 18px;
    color: #7a2f12;
}

.bag_header_row .bag_col {
    font-size: 18px;
}

.bag_select_all {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 6px;
    justify-content: center;
    white-space: nowrap;
    width: 100%;
}

.bag_checkbox {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #c19e7b;
    background: rgba(255, 240, 221, 0.65);
    flex-shrink: 0;
}

.bag_select_all_text {
    white-space: nowrap;
    flex-shrink: 0;
    font-size: 18px;
}

.bag_header_label {
    min-width: 48px;
}

.bag_quality_filter select {
    width: 72px;
    height: 30px;
    padding: 0 8px;
    border-radius: 4px;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.85);
    font-family: inherit;
    font-size: 14px;
    color: #7a2f12;
    outline: none;
    appearance: none;
}

.bag_header_score {
    font-family: SourceHanSansCN-Bold;
    font-size: 18px;
    color: #7a2f12;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-left: 120px;
}

.bag_score {
    color: #b93e13;
    margin-left: 4px;
}

.bag_table {
    width: 100%;
    border-radius: 3px;
    overflow: hidden;
}

.bag_table_head {
    display: flex;
    height: 42px;
    background: #da916d;
}

.bag_table_body {
    max-height: 200px;
    overflow-y: auto;
}

.bag_table_body::-webkit-scrollbar {
    width: 10px;
}

.bag_table_body::-webkit-scrollbar-thumb {
    background-color: #ecb48c;
    border-radius: 8px;
}

.bag_table_body::-webkit-scrollbar-track {
    background-color: #e2cebe;
    border-radius: 8px;
}

.bag_row {
    display: flex;
    height: 44px;
    /* border-top: 1px solid #b34c2b; */
    border-bottom: solid 1px #9c7770;
}

.bag_col {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN-Medium;
    font-size: 16px;
    color: #7a2f12;
}

.bag_col_check {
    width: 80px;
    flex: 0 0 auto;
}

.bag_col_name {
    flex: 1.4;
}

.bag_col_quality {
    flex: 1;
}

.bag_col_actions {
    flex: 1.6;
    gap: 12px;
}

.bag_select {
    padding: 0 10px;
    width: 100px;
    height: 30px;
    background-color: #fffdf3;
    border-radius: 3px;
    border: solid 1px #e87944;
    outline: none;
    margin-left: 10px;
}

.bag_radio {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #c19e7b;
    background: rgba(255, 240, 221, 0.65);
    box-sizing: border-box;
    cursor: pointer;
}

.bag_radio.is-checked {
    position: relative;
}

.bag_radio.is-checked::after {
    content: "";
    position: absolute;
    /* inset: 3px;
    border-radius: 50%;
    background: linear-gradient(180deg,#ffdfb8 0%,#e66a34 100%); */
    width: 15px;
    height: 22px;
    top: -8px;
    left: 0;
    background: url(https://img.youxi290.com/khm/xchd2026/bag_dui.png) center no-repeat;
    background-size: cover;
}

.bag_checkbox.is-checked {
    position: relative;
}

.bag_checkbox.is-checked::after {
    content: "";
    position: absolute;
    width: 15px;
    height: 22px;
    top: -5px;
    left: 2px;
    background: url(https://img.youxi290.com/khm/xchd2026/bag_dui.png) center no-repeat;
    background-size: cover;
}

.bag_action_btn {
    width: 100px;
    height: 32px;
    padding: 0 10px;
    font-family: SourceHanSansCN-Medium;
    font-size: 14px;
    color: #fff7e5;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.3s;
    background-image: url(https://img.youxi290.com/khm/xchd2026/bag_btn.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.bag_action_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/bag_btn_active.png);
}

.bag_footer {
    position: absolute;
    bottom: 60px;
    right: 107px;
    display: flex;
    justify-content: center;
    gap: 40px;
}

.bag_footer_btn {
    width: 116px;
    height: 34px;
    font-family: SourceHanSansCN-Bold;
    font-size: 18px;
    color: #fff7e7;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.3s;
    background-image: url(https://img.youxi290.com/khm/xchd2026/alert_btn.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.bag_footer_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/alert_btn_active.png);
}

.card_alert {
    width: 1042px;
    height: 554px;
    background: url(https://img.youxi290.com/khm/xchd2026/card_alert.png) center no-repeat;
    background-size: cover;
    position: relative;
}

.card_close {
    position: absolute;
    top: 32px;
    right: 88px;
    width: 35px;
    height: 35px;
    background: url(https://img.youxi290.com/khm/xchd2026/alert_close.png) center no-repeat;
    background-size: cover;
    cursor: pointer;
    transition: 0.3s;
}

.card_close:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/alert_close_active.png) center no-repeat;
    background-size: cover;
}

.card_text {
    width: 261px;
    height: 58px;
    background: url(https://img.youxi290.com/khm/xchd2026/card_text.png) center no-repeat;
    background-size: cover;
}

.card_prize {
    width: 113px;
    height: 117px;
    background: url(https://img.youxi290.com/khm/xchd2026/card_prize.png) center no-repeat;
    background-size: cover;
    position: absolute;
    left: 50px;
    bottom: 20px;
    cursor: pointer;
    font-family: SourceHanSerifCN-Bold;
    font-size: 18px;
    line-height: 22px;
    color: #fff3d8;
    text-align: center;
    padding-top: 50px;
    text-shadow: 1px 1px 1px #000;
}

.card_prize p {
    color: #fff3d8;
}

.card_header {
    position: absolute;
    top: 34px;
    left: 150px;
    right: 150px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    pointer-events: none;
}

.card_tip_left {
    display: flex;
    align-items: center;
}

.card_tip_left .card_text {
    font-size: 20px;
    color: #fff9c2;
    padding-left: 28px;
}

.card_text {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN-Medium;
    font-size: 16px;
    color: #722800;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35);
}

.card_tip_right {
    font-family: SourceHanSansCN-Medium;
    font-size: 16px;
    color: #b93e13;
    letter-spacing: 1px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35);
}

.card_grid {
    position: absolute;
    left: 181px;
    top: 100px;
    height: 260px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
    width: 666px;
}

.card_grid.card_before {
    top: 150px;
}

.card_grid>div {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
}

.card_grid.card_grid_single>div {
    justify-content: center;
    align-items: center;
    align-content: center;
}

.card_slot {
    background-repeat: no-repeat;
    background-position: center;
}

.card_hs {
    width: 125px;
    height: 125px;
    position: relative;
}

.card_hs img {
    width: 60%;
    height: 60%;
    margin: 20%;
}

.card_hs span {
    position: absolute;
    width: 100%;
    bottom: 10px;
    left: 0;
    text-align: center;
    color: #fff;
    text-shadow: 0.01rem 0.01rem 0.07rem rgb(0 0 0), 0.02rem 0.02rem 0.11rem rgb(0 0 0), 0.02rem 0.02rem 0.11rem rgb(0 0 0);
    font-size: 18px;
}

.card_slot:nth-child(2),
.card_slot:nth-child(4),
.card_slot:nth-child(7),
.card_slot:nth-child(9) {
    transform: translateY(25px);
}

.card_slot:nth-child(3),
.card_slot:nth-child(8) {
    transform: translateY(-10px);
}

.card_footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 50px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.card_draw_group {
    width: 260px;
    text-align: center;
}

.card_draw_label {
    font-family: SourceHanSerifCN-Bold;
    font-size: 20px;
    color: #df3f0e;
    letter-spacing: 2px;
    margin-bottom: -5px;
}

.card_draw_btn {
    width: 249px;
    height: 80px;
    cursor: pointer;
    transition: 0.3s;
    background: url(https://img.youxi290.com/khm/xchd2026/card_one.png) center no-repeat;
    background-size: cover;
}

.card_draw_btn:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/card_one_active.png) center no-repeat;
    background-size: cover;
}

.card_draw_btn.is-ten {
    background: url(https://img.youxi290.com/khm/xchd2026/card_ten.png) center no-repeat;
    background-size: cover;
}

.card_draw_btn.is-ten:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/card_ten_active.png) center no-repeat;
}

.fix {
    position: fixed;
    z-index: 4;
}

.float {
    top: 10%;
    left: 10px;
    width: 266px;
    height: 344px;
    cursor: pointer;
    transition: 0.3s;
    background: url(https://img.youxi290.com/khm/xchd2026/float.png) center no-repeat;
    background-size: cover;
}

.join {
    top: 190px;
    right: 0;
    width: 192px;
    height: 193px;
    cursor: pointer;
    transition: 0.3s;
    background: url(https://img.youxi290.com/khm/xchd2026/gfhb.png) center no-repeat;
    background-size: cover;
    padding-top: 178px;
}

.fix p {
    text-align: center;
    font-size: 23px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 22px;
    letter-spacing: 0px;
    color: #ffebb0;
    text-shadow:
        0 0 4px rgba(82, 24, 5, 0.74),
        0 0 8px rgba(82, 24, 5, 0.74);
}

.fix span {
    margin-top: 8px;
    font-size: 20px;
    line-height: 22px;
    color: #ffebb0;
    display: block;
    text-align: center;
    text-shadow:
        0 0 4px rgba(82, 24, 5, 0.74),
        0 0 8px rgba(82, 24, 5, 0.74);
}

.hs_2 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_cyan.png);
}

.hs_4 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_orange.png);
}

.hs_1 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_green.png);
}

.hs_3 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_purple.png);
}

.hs_0 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/hs_normal.png);
}


.codebox {
    width: 256px;
    height: 256px;
    display: block;
    margin: 46px auto 0;
}

.codebox .code {
    width: 256px;
    height: 256px;
}

.alert_success {
    height: 460px;
    padding-top: 50px;
}

.alert_success span {
    height: 56px;
    line-height: 56px;
    display: block;
    text-align: center;
    font-size: 20px;
}

.alert_success .pay_back {
    top: 64px;
}