/* Minification failed. Returning unminified contents.
(11,10): run-time error CSS1030: Expected identifier, found '#app'
(11,19): run-time error CSS1031: Expected selector, found ')'
(11,19): run-time error CSS1025: Expected comma or open brace, found ')'
(15,10): run-time error CSS1030: Expected identifier, found '#app'
(15,19): run-time error CSS1031: Expected selector, found ')'
(15,19): run-time error CSS1025: Expected comma or open brace, found ')'
(24,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(53,22): run-time error CSS1039: Token not allowed after unary operator: '-logo-bar-bg'
(115,16): run-time error CSS1039: Token not allowed after unary operator: '-body-bg'
(131,22): run-time error CSS1039: Token not allowed after unary operator: '-logo-bar-bg'
(132,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(137,22): run-time error CSS1039: Token not allowed after unary operator: '-logo-bar-bg'
(138,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(144,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(346,22): run-time error CSS1039: Token not allowed after unary operator: '-logo-bar-bg'
(699,22): run-time error CSS1039: Token not allowed after unary operator: '-logo-bar-bg'
(853,9): run-time error CSS1030: Expected identifier, found '.'
(853,20): run-time error CSS1031: Expected selector, found ')'
(853,20): run-time error CSS1025: Expected comma or open brace, found ')'
(929,22): run-time error CSS1039: Token not allowed after unary operator: '-logo-bar-bg'
(930,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(944,17): run-time error CSS1039: Token not allowed after unary operator: '-vip-card-tetx-color'
(1081,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(1086,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(1223,22): run-time error CSS1039: Token not allowed after unary operator: '-logo-bar-bg'
(1224,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(1305,17): run-time error CSS1039: Token not allowed after unary operator: '-main-color-text'
(1550,17): run-time error CSS1039: Token not allowed after unary operator: '-input-common-input-main-color'
(1552,28): run-time error CSS1039: Token not allowed after unary operator: '-input-common-form-wrap'
(1663,28): run-time error CSS1039: Token not allowed after unary operator: '-body-bg'
(1876,34): run-time error CSS1039: Token not allowed after unary operator: '-custom-pink-light'
(1925,21): run-time error CSS1039: Token not allowed after unary operator: '-custom-white'
(1959,30): run-time error CSS1039: Token not allowed after unary operator: '-custom-pink-dark'
(2169,26): run-time error CSS1039: Token not allowed after unary operator: '-vip-icon-bg'
(2197,26): run-time error CSS1039: Token not allowed after unary operator: '-custom-white'
 */
@charset "UTF-8";

@font-face {
    font-family: "HanWangYenHeavy";
    src: url("/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/fontFamily/HanWangYenHeavy.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

/* 修正 ios 滾動問題 */
html:has(#app.Home) {
    overflow: hidden;
}

html:has(#app.Home) {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100%;
} 
/* 修正 ios 滾動問題 */

:root {
    --login-banner: url("/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/login_banner.png");
}

body {
    font-family: "HanWangYenHeavy", sans-serif;
}

/* 確保所有元素都使用 HanWangYenHeavy 字體 */
* {
    font-family: "HanWangYenHeavy", sans-serif;
}

/* 確保表單元素也使用 HanWangYenHeavy 字體 */
input,
button,
select,
textarea,
.v-btn,
.v-label,
.v-input,
.v-text-field input,
.v-select,
.v-card__title,
.v-card__text,
.v-tab {
/*    font-family: "HanWangYenHeavy", sans-serif !important;*/
}

.main-color {
    background: var(--logo-bar-bg) !important;
}

/* 登入/註冊頁的切換按鈕顏色 */
.feature-switch-btn .grey {
    background-color: #471fb5 !important;
}

/* 註冊頁手機國碼的文字顏色 */
div.input-wrap.select.Mobile div.v-select__selections > .v-select__selection--disabled {
    color: rgba(255,255,255,.8);
}

/* 註冊頁手機國碼的箭頭 */
div.input-wrap.select.Mobile.require > div > div > div.v-input__slot > div.v-select__slot > div.v-input__append-inner {
    display: none
}

aside.live-chat {
    position: fixed;
    bottom: 53vh;
    right: 20px;
    width: 50px;
    height: 50px;
    padding-top: 5px;
    text-align: center;
    line-height: 40px;
    background: url(/CdnRedirect/Web.Mobile/_Common/Content/Views/Shared/images/service.1.png);
    background-size: contain;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    z-index: 99;
}

aside.live-chat a {
    display: block;
    height: 100%;
    text-decoration: none;
}

aside.live-chat a i {
    font-size: 40px;
    color: #e7c308;
}


#app-download ul li.download-btn {
    box-shadow: 0 0 4px #fff;
}

#app-download ul li.download-btn a {
    font-size: 0
}

#app-download ul li.download-btn a:before {
    content: 'Download';
    font-size: 12px;
}

/* #region 基本樣式 */
.theme--light.v-application{
    color:var(--body-bg) !important;
}

.input-wrapper input {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, .12) !important;
    box-shadow: none !important;
    color: #000000 !important;
    border-radius: 4px;
}

.input-wrapper::before {
    color: #000000 !important;
}

.v-dialog .v-card__title {
    background: var(--logo-bar-bg) !important;
    color: var(--main-color-text) !important;
}

button[type="submit"],
button.submit-btn {
    background: var(--logo-bar-bg) !important;
    color: var(--main-color-text) !important;
}


button[type="submit"] span,
button.submit-btn span{
    color: var(--main-color-text) !important;
}

button[disabled="disabled"] {
    opacity: 0.5 !important;
}

#app #footer .v-bottom-navigation {
    background: linear-gradient(to bottom, #0D3745,#2B7288);
}

#app #footer .v-btn i {
    width: 70%;
}

#footer .btn-bg {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/login_icon.png) no-repeat center / contain;
}
#footer .v-btn i.financial {
    display: none;
}

#app #footer .v-bottom-navigation a.active span,
#app #footer .v-bottom-navigation a span,
#app #footer .v-bottom-navigation span {
    color: #fff;
}
/* #endregion 基本樣式 */
/* #region 首頁 */
#app #home #logo-bar {
    background: linear-gradient( to bottom, #0D3745 0%, #164A5A 20%, #226073 50%, #296D83 78%, #2B7288 100% );
}

#app #home #logo-bar::after {
    display: none;
}

#app #home #logo-bar .online-count {
    display: none;
}

    #app #home #logo-bar .login-btn {
        background: #E7F4FA;
        color: #2B7288;
        border-radius: 25px;
    }

    #app #home #logo-bar .signup-btn {
        background: #5FAFC8;
        color: #fff;
        border-radius: 25px;
    }
    #app #home #logo-bar .login-btn,
    #app #home #logo-bar .signup-btn {
        justify-content: center;
        -webkit-align-items: inherit;
        align-items: inherit;
    }

        #app #home #logo-bar .login-btn::before,
        #app #home #logo-bar .login-btn::after,
        #app #home #logo-bar .signup-btn::before,
        #app #home #logo-bar .signup-btn::after {
            display: none;
        }

    #app #home #logo-bar .account-box {
        padding-left: 10px;
    }

    #app #home #logo-bar .member-level {
        width: 40px;
        height: 15px;
        background-size: contain;
        background-repeat: no-repeat;
    }

    #app #home #logo-bar .member-level::after {
        display: none;
    }

        #app #home #logo-bar .member-level.vip0 {
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/vip0.png) no-repeat center / contain;
        }

        #app #home #logo-bar .member-level.vip1 {
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/vip1.png) no-repeat center / contain;
        }

        #app #home #logo-bar .member-level.vip2 {
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/vip2.png) no-repeat center / contain;
        }

        #app #home #logo-bar .member-level.vip3 {
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/vip3.png) no-repeat center / contain;
        }

        #app #home #logo-bar .member-level.vip4 {
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/vip4.png) no-repeat center / contain;
        }


    #app #home #logo-bar .text-truncate {
        width: 60px;
    }

    #app #home #logo-bar .balance {
        background: #E6F3F9;
        color: #0D3745;
    }
        #app #home #logo-bar .balance::before {
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/coin.png);
            background-size: contain;
            background-repeat: no-repeat;
        }

        #app #home #logo-bar .balance::after {
            display: inline-block;
            content: "";
            width: 10px;
            height: 10px;
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/reset.png);
            background-size: contain;
            background-repeat: no-repeat;
        }

        #app #home #logo-bar .balance .coin,
        #app #home #logo-bar .balance .add-btn {
            display: none;
        }

    #app #home #logo-bar .mail-btn::before {
        width: 18px;
        background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/mail.png);
        background-size: contain;
        background-repeat: no-repeat;
        position: relative;
        top: 3.5px;
    }
    #app #home #logo-bar .mail-btn .unread {
        top: 0;
    }

#app #home #slider {
    padding: 10px;
    padding-bottom: 5px;
}

    #app #home #slider .swiper-slide img {
        border-radius: 8px;
    }

#app #home .infor-mix-wrap .account-unlogin,
#app #home .infor-mix-wrap .account-login {
    display: none;
}

#app #home .news-wrap {
    margin: 0 0 5px !important;
    padding: 5px 10px;
    background: unset !important;
}

    #app #home .news-wrap #news {
        align-items: center;
        padding: 0;
        height: 30px;
        border-radius: 8px; /* 膠囊形狀 */
        /* 內層背景 */
        background: linear-gradient(180deg, #244a57, #1b3b46);
        /* 邊框 */
        border: 2px solid rgba(180, 255, 255, 0.8);
        /* 外發光 */
        box-shadow: 0 0 2px rgba(120, 255, 255, 0.6), 0 0 4px rgba(120, 255, 255, 0.4), 0 0 6px rgba(120, 255, 255, 0.2);
        color: #fff;
        font-size: 20px;
    }

/*        #app #home .news-wrap #news .marquee {
            height: 30px;
            line-height: 30px;
        }*/
            #app #home .news-wrap #news .marquee span {
                margin-top: -12px;
                font-size: 16px;
            }

            #app.Home .function-box {
                padding: 0 16px;
            }

#app.Home .function-box,
#app.Home .pages {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 5px;
}

#app.Home .function a,
#app.Home .pages a {
    background: var(--logo-bar-bg) !important;
    color: white;
    border-radius: 2vw;
    box-shadow: 0 0 4px #fff;
    margin-left: 8px;
    display: flex;
    line-height: 1;
    font-size: 12px;
    text-align: center;
    padding: 0;
    max-width: 65px;
    min-width: unset !important;
    width: 65px;
    min-height: unset;
    height: 44px !important;
}

@media (max-width: 389px) {
    #app.Home .pages{
        gap:5px;
    }

    #app.Home .pages a {
        margin-left: 0px;
    }
}

#app.Home .function a span,
#app.Home .pages a span {
    overflow-wrap: break-word;
    word-break: break-all;
    word-wrap: break-word;
    white-space: normal;
    width:100%;
}

#app.Home .function a,
#app.Home .function .balance button {
    display: none;
}

#app.Home .function .balance img{
    width: 20px;
    transform: translateY(5px);
}


/*home-navigation-a-component*/

#app.Home #home-navigation-horizontal .game-tab-wrap {
    padding: 5px 16px;
}

#app.Home #home-navigation-horizontal .game-tab{
    gap:5px;
}

#app.Home #home-navigation-horizontal .game-tab li {
    margin:0;
}

#app.Home #home-navigation-horizontal .game-list-block ul.game-list li {
    background: url('/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/game-bg.png') no-repeat center;
    background-size: 100% 100%;
}

#app.Home #home-navigation .game-tab.vertical {
    -webkit-box-shadow: none;
    box-shadow: none;
}

    #app.Home #home-navigation .game-tab.vertical li {
        padding-top: 20px;
        margin-bottom: 10px;
    }

        #app.Home #home-navigation .game-tab.vertical li::before {
            width: 8vw;
            height: 3.5vh;
            flex: 1;
        }

#app.Home #home-navigation .game-tab li.Favorite:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/favorite.png);
}

#app.Home #home-navigation .game-tab li.Hot:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/hot.png);
}

#app.Home #home-navigation .game-tab li.Slot:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/slot.png);
}

#app.Home #home-navigation .game-tab li.Live:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/live.png);
}

#app.Home #home-navigation .game-tab li.Board:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/board.png);
}

#app.Home #home-navigation .game-tab li.Fish:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/fish.png);
}

#app.Home #home-navigation .game-tab li.Sport:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/sport.png);
}

#app.Home #home-navigation .game-tab li.Lottery:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/lottery.png);
}

#app #home-navigation .game-tab li.swiper-pagination-bullet-active:before {
    animation :none;
    -webkit-animation: none;
}

#home-navigation .game-tab.vertical li::after {
    z-index: -1;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/tab.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: center;
}


#home-navigation .game-tab.vertical liswiper-pagination-bullet-active::after {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/tab-active.png);
    color: #0D3745;
}


#app.Home #home-navigation .game-tab.vertical li a {
    display: inline;
    padding-top: 0;
}

#app.Home #home-navigation .game-list-block ul li {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/game-bg.png) no-repeat center;
    background-position-x: 100%;
    background-size: 109% 153%;
}
/*home-navigation-a-component*/

/*home-navigation-l-component*/
#app #home #slider-banner.l-component {
    margin: 0;
    padding: 0;
    background: unset;
    border: none;
    border-radius: 0;
}

#app #home #slider-banner.l-component .jackpot {
    display: none;
}

#app #home-navigation .home-navigation-swiper > .swiper-wrapper {
    flex: 0 0 79%;
    max-width: 79%;
}

#app #home-navigation .swiper-slide.common .common-list.hot{
    gap:10px;
}
/**熱門遊戲外框*/
    #app #home-navigation .swiper-slide.common .common-list.hot .hot-item {
        position: relative;
        background: none;
        /*        background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/hot-game.png) no-repeat center;*/
        /*background-size: 100% 100%;*/
        height: unset;
    }
        #app #home-navigation .swiper-slide.common .common-list.hot .hot-item::after {
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/hot-game.png) no-repeat center;
            background-size: 100% 100%;
        }
#home-navigation-wrap.l-component .common-list .game-img-box {
    border-radius: 6px !important;
    padding: 0px 5px 0 5px;
    margin-bottom: 20px;
    margin-top: 5px;
}

#home-navigation .swiper-slide.common .common-list.hot .hot-item .game-name {
    font-size: 10px !important;
}

#app #home-navigation .swiper-slide.common .common-list .game-item{
    position: relative;
    height: 0;
}

#app #home-navigation .swiper-slide.common .common-list .game-item::before {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/game-bg.png) no-repeat center;
    background-position-x: 100%;
    background-size: 109% 150%;
}
    #app #home-navigation .swiper-slide.common .common-list .game-item .game-bg {
        display: none;
    }

    #app #home-navigation .swiper-slide.common .common-list .game-item .game-name-box{
        transform: translateY(-5px);
    }

    #app #home-navigation .swiper-slide.common .common-list .game-item .game-name-box span {
        font-size: 15px;
    }


#app.Home #home-navigation .game-tab {
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 20%;
}

    #app.Home #home-navigation .game-tab li {
        padding-top: 5px;
        padding-bottom: 5px;
        gap:.5vw;
    }

        #app.Home #home-navigation .game-tab li::before {
            width: 6vw;
            max-width: 40px;
            height: 2vh;
        }


#app .main #home-navigation .game-tab li.swiper-pagination-bullet-active {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/tab-active.png);
    background-size: 110% 100%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-color: unset !important;
    color: #0D3745;
}

#app .main #home-navigation .game-tab li {
    content: "";
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/tab.png);
    background-size: 110% 100%;
    background-repeat: no-repeat;
    background-position-x: center;
    height: 76px;
    max-height: 80px;
}

    #app .main #home-navigation .game-tab li span {
        color: #fff;
        margin-top: clamp(0px, 1vw, 3px)
    }
    #app .main #home-navigation .game-tab li.swiper-pagination-bullet-active span {
        color: #0D3745;
    }


/*home-navigation-l-component*/
/* #endregion 首頁 */
/* #region 遊戲大廳 */
#app.Lobby .router-link-active:last-child {
    display: none !important;
}

#app.Lobby .lobby-name {
    right: 50%;
    transform: translateX(50%);
    padding: 0;
}

#app.Lobby .game-tab-wrap {
    padding: 8px;
}

#app.Lobby .categories-wrap .categories {
    gap:5px;
    padding:0;
}

#app.Lobby .categories-wrap .categories li {
    margin: 0;
}

#app .v-dialog.wallet-detail-dialog .container .d-flex {
    gap: 10px;
}

#app .v-dialog.wallet-detail-dialog .container .transfer-out,
#app .v-dialog.wallet-detail-dialog .container .transfer-in {
    display: flex;
    flex-direction: column;
    /*height: -webkit-fill-available;*/
}

#app .v-dialog.wallet-detail-dialog .container .manual-transfer-card {
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 4px;
    padding: 8px 16px;
    /*flex: 1;*/
    height:auto;
    min-height:60px;
    position: relative;
}

#app .v-dialog.wallet-detail-dialog .container .manual-transfer-select-btn-icon {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}

#app .v-dialog.wallet-detail-dialog .container .v-btn.v-btn--has-bg.btn-blue {
    background: none !important;
    color: rgba(0, 0, 0, .87);
    border-color: rgba(0, 0, 0, .12);
}

#app .v-dialog.wallet-detail-dialog .container .input-wrapper::before {
    top: 12px;
}

#app .v-dialog.wallet-detail-dialog .v-card__actions {
    justify-content: center !important;
    padding: 0 24px 20px;
}

#app .v-dialog.wallet-detail-dialog .v-card__actions .spacer {
    display: none;
}

#app .v-dialog.wallet-detail-dialog .v-card__actions button {
    background: var(--logo-bar-bg) !important;
    color: white;
}
/* #endregion 遊戲大廳 */

/* #region 會員中心 */
#app .member-center::before {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/member_center_bg.png) no-repeat center top;
    height: 235px;
}

#app .member-center .v-card__text {
    background: #eefffc;
}

#app .member-center .profile-wrap .profile {
    content: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/profile.png);
    border: none;
}
#app .member-center .profile-wrap .member-level .member-level  {
    background: linear-gradient(to right,#00B5E8 0%, #00BDD3 47%, #85F48C 96%, #90F986 100%);
    color: #004c52;
}

#app .member-center .action-link {
    color: #0D3745;
    position: relative;
}
    #app .member-center .action-link.financial::before {
        position: relative;
        top: -7px;
        z-index: 1;
        width: 11vmin;
        height: 11vmin;
        background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_deposit.png);
    }
    #app .member-center .action-link.withdraw::before {
        position: relative;
        top: -7px;
        z-index: 1;
        width: 11vmin;
        height: 11vmin;
        background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_withdraw.png);
    }
    #app .member-center .action-link.promotion::before {
        position: relative;
        top: -7px;
        z-index: 1;
        width: 11vmin;
        height: 11vmin;
        background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_promotion.png);
    }
    #app .member-center .action-link.vip::before {
        position: relative;
        top: -7px;
        z-index: 1;
        width: 11vmin;
        height: 11vmin;
        background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_vip.png);
    }

    #app .member-center .action-link.financial::after,
    #app .member-center .action-link.withdraw::after,
    #app .member-center .action-link.promotion::after,
    #app .member-center .action-link.vip::after {
        position: absolute;
        top: -7px;
        left: 9px;
        content: "";
        width: 11vmin;
        height: 11vmin;
        background: radial-gradient( circle, #2B7288 0%, #2A7085 35%, #26687D 56%, #205C6F 73%, #174A5B 88%, #0D3745 100% );
        border-radius: 10px;
    }

#app .member-center .row > div .action-link.big-link::after {
    background: radial-gradient( circle, #2B7288 0%, #2A7085 35%, #26687D 56%, #205C6F 73%, #174A5B 88%, #0D3745 100% );
    border-radius: 50%;
    border: none;
}

.member-center .action-link.big-link.bet-record:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_bet-record.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.transaction:before {
    background-image: url(/Content/Views/Shared/images/MemberCenter/icon_transaction.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.site-mail:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_site-mail.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.change-password:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_change-password.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.change-money-password:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_change-money-password.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.withdrawal-account-management:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/revise_bank.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.withdrawal-account-management-electronic:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/revise_wallet.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.withdrawal-account-management-convenience-store:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/convenience_store.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.withdrawal-account-management-electronic3:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/cash_wallet.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.mgm:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_mgm.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.member-transfer:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_transfer.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.award-center:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_prize.png);
    background-size: 100% !important;
}

.member-center .action-link.big-link.member-info:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_member-info.png);
    background-size: 100% !important;
}

.member-center .action-link.big-link.announcement-btn:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_announcement.png);
    background-size: 100% !important;
}
.member-center .action-link.big-link.withdrawal-account-management-electronic3:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/cash_wallet.png);
    background-size: 100% !important;
}

.member-center .action-link.big-link.set-language:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_lang.png);
    background-size: 100% !important;
}

.member-center .action-link.big-link.app:before {
    background-image: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/MemberCenter/icon_app.png);
    background-size: 100% !important;
}

div:has(.bet-record),
div:has(.transaction),
div:has(.award-center) {
    order: -1;
}

/* #endregion 會員中心 */
    /* #region 提款 */
    #withdraw .withdraw-info-bg .withdraw-tips {
        display: none;
    }
/* #endregion 提款 */

/* #region 存款 */
#app.Deposit .payment-list {
    gap: 10px;
}
#app.Deposit .payment-list > div{
    margin:0 !important;
}

#app.Deposit .company-deposit-apply-bg {
    padding: 16px !important;
}

#app.Deposit .company-deposit-layout > div.v-card{
    padding:16px !important;
}


#app.Deposit form,
#app.Deposit .v-card__actions {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#app.Deposit .v-card__actions button{
    width: 100%;
}

#app.Deposit .company-deposit-apply-bg .v-card__actions button {
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
    border: none;
}

#app.Deposit .company-deposit-apply-bg .v-card__actions button i{
    display:none;
}
/* #endregion 存款 */

/* #region 提款 */
#app.Withdraw form button[type="submit"] {
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
    width: 100%;
}
#app.Withdraw .administration-fee-dialog-btn {
    padding: 0 16px !important;
    font-size: .875rem;
    text-align: center;
    word-break: break-all;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 4px;
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

#app.Withdraw .administration-fee-dialog-btn .v-btn__content{
    color:#000000;
}

#app.Withdraw .v-dialog.administration-fee-info-dialog .v-card__actions {
    justify-content: center;
}
/* #endregion 提款 */
/* #region VIP */
#app.Vip .v-card.first-card .btn-group .btn {
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
    background: var(--logo-bar-bg) !important;
    color: var(--main-color-text) !important;
    border:none;
}

#app.Vip .rule-content {
    overflow:auto;
}

#app.Vip .v-card .member-info .icon {
    background-position-y: -0px;
    padding-top: 23px;
}

#app.Vip .v-card p.level-title {
    color: var(--vip-card-tetx-color);
    font-size: 18px;
    font-weight: 700;
}

#app.Vip .next,
#app.Vip .prev {
    color: #1a1866;
}
/* #endregion VIP */
/* #region 投注紀錄 */
#app.BetRecord .search-box {
    background: linear-gradient(to right, #0D3745, #2B7288,#134352);
    border: 1px solid #fff;
}

#app.BetRecord #bet-record .v-label {
    color: #fff !important;
}

#app.BetRecord #bet-record .v-radio input[type="radio"] {
    accent-color: #fff;
    -webkit-text-fill-color: #0D3745 !important;
}

#app.BetRecord.v-application .primary--text,
#app.BetRecord.v-application .black--text,
#app.BetRecord .v-radio i,
#app.BetRecord .v-input--selection-controls__input i {
    color: #fff !important;
    caret-color: #fff !important;
}

#app.BetRecord .subtitle-2{
        color: #fff !important;
}
#app.BetRecord .v-divider {
    border-color: #fff !important;
}

#app.BetRecord .time-picker-box {
    color: #fff !important;
}

#app.BetRecord .mx-input {
    background-color: unset;
    color: #fff !important;
}
#app.BetRecord .mx-datepicker svg {
    fill: #fff;
}

#app.BetRecord .v-dialog.gametype-dialog-component .v-card__actions button {
    border: 1px solid rgba(0, 0, 0, .12);
    color: #fff !important;
}

#app.BetRecord #bet-record .game-picker-box button {
    background: transparent !important;
    border: 1px solid #fff;
    color: #fff !important;
    text-shadow: none;
}

#app.BetRecord #bet-record .game-picker-box p {
    color: #fff !important;
}

#app.BetRecord #bet-record .list-box {
    border: 1px solid #fff;
    color: #fff !important;
    background-color: unset !important;
}
    #app.BetRecord #bet-record .list-box .v-card__text {
        color: #fff !important;
    }

#app.BetRecord .v-data-table {
    border: none;
}

#app.BetRecord #bet-record table thead tr th {
    background-color: #2B7288;
    color: #fff !important;
}
#app.BetRecord #bet-record table thead tr th + th{
        border-left: none;
}
#app.BetRecord #bet-record table tbody tr {
    background-color: #eefffc;
}
    #app.BetRecord #bet-record table tbody tr td + td {
        border-left: none;
    }
#app.BetRecord #bet-record .all-wager-amount-val,
#app.BetRecord #bet-record .Bet-total-val,
#app.BetRecord #bet-record .lose-amount-val {
    color: #FC8B00 !important;
}
/* #endregion 投注紀錄 */

/* #region 交易紀錄 */
#app #transaction .v-card {
    background: linear-gradient(to right, #0D3745, #2B7288,#134352);
    border: 1px solid #fff;
}

#app.Transaction .transaction-content .btn-group button.active {
    background: #fff !important;
    color: #0D3745 !important;
    border: 1px solid #fff !important;
}

#app.Transaction .v-data-table {
    border: none;
}

#app.Transaction table thead tr th {
    background-color: #2B7288;
    color: #fff !important;
}

    #app.Transaction  table thead tr th + th {
        border-left: none;
    }

#app.Transaction table tbody tr {
    background-color: #eefffc;
}

    #app.Transaction table tbody tr td + td {
        border-left: none;
    }
/* #endregion 交易紀錄 */

/* #region 設定錢包(各種) */
#app.WithdrawAccountManagement .custom-text-color {
    color: var(--main-color-text) !important;
}
/* #endregion 設定錢包(各種) */
/* #region 推薦好友 */
#app.MGM .inner .container .heading {
    color: var(--main-color-text) !important;
}
/* #endregion 推薦好友   */

/* #region 會員轉帳 */
#app.MemberTransfer .member-transfer-info-bg,
#app.MemberTransfer .member-transfer-main-bg {
    padding: 0 !important;
    background: #eefffc;
    border-radius: 12px;
}

    #app.MemberTransfer .member-transfer-info-bg .v-card__text {
        color: #0D3745 !important;
    }

    #app.MemberTransfer .member-transfer-main-bg .subtitle-1 {
        padding: 16px 16px 0 16px;
    }

    #app.MemberTransfer .member-transfer-main-bg .v-card__text button {
        width: 100%;
    }

        #app.MemberTransfer .member-transfer-main-bg .v-card__text button[type=submit] {
            background: #00B9B8 !important;
            margin-top: 10px;
        }

        #app.MemberTransfer #transfer-form-wrap .transfer-input-wrap {
            color: #0D3745 !important;
            background: #fff !important;
            border: 1px solid #2B7288 !important;
            border-radius: 20px;
        }


#transfer-form-wrap .transfer-input-wrap .v-label {
    color: #0D3745 !important;
    -webkit-text-fill-color: #0D3745 !important;
}

#app.MemberTransfer .member-transfer-main-bg .getMobileSendCode {
    color: #00B9B8;
    justify-content: end;
}
    #app.MemberTransfer .member-transfer-main-bg .getMobileSendCode .primary--text {
        color: #00B9B8 !important;
    }
/* #endregion 會員轉帳 */
/* #region 領獎中心 */
#app.AwardCenter .inner {
    padding: 12px;
    color: #0D3745;
}

#app.AwardCenter #award-center .inner .scroll-content .navtab {
    background-color: unset;
    border-bottom: 1px solid #fff;
    border-radius: 0;
}

    #app.AwardCenter #award-center .inner .scroll-content .navtab li.active{
        color: #fff;
    }

    #app.AwardCenter #award-center .inner .scroll-content .navtab li {
        color: #fff;
    }

#app #award-center .inner .scroll-content .navtab li.active::after {
    background: #fff !important;
}

#app.AwardCenter .hint {
    color: #FC8B00;
    border: 1px solid #ffffff;
    border-radius: 8px;
    background: #fff;
}
#app.AwardCenter #award-center .hint .icon-hint {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/icon-hint.png) center no-repeat;
    background-size: 100% 100%;
}

#app.AwardCenter #award-center .inner .item {
    padding: 0;
    border:none;
}

    #app.AwardCenter #award-center .inner .item .event-name {
        width: 100%;
    }
        #app.AwardCenter #award-center .inner .item .event-name .text-h6 {
            background: #2B7288;
            color: #fff !important;
            padding: 5px 10px;
            border-radius: 8px 8px 0 0;
        }
        #app.AwardCenter #award-center .inner .item .event-name .event-type {
            color: #0D3745;
            background: #eefffc !important;
            padding: 5px 10px 30px;
            border-radius: 0 0 8px 8px;
        }
    #app.AwardCenter #award-center .inner .item .AwardStatusName {
        top: 8px;
        color: #fff;
        background-color: #57D147;
        border:none;
    }
    /* #endregion 領獎中心 */
    /* #region 錢包中心 */
    #app.WalletCenter .main-action {
        background: #FFFFFF;
        box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
        border-color: #FFFFFF;
        padding: 16px;
    }

#app.WalletCenter.theme--light.v-application {
    color: #000000;
}

#app.WalletCenter .right-box-transfer-back {
    border: 1px solid rgba(0, 0, 0, .12);
    background: none;
    padding: 8px 16px;
    color: #000000;
    line-height: 1;
}
    
#app.WalletCenter .main-link {
    gap: 10px;
}

#app.WalletCenter .main-link .action-link {
    background: var(--logo-bar-bg) !important;
    color: var(--main-color-text) !important;
    border-radius: 4px;
}

#app.WalletCenter .main-link .action-link i {
    display: none;
}

#app.WalletCenter .main-action {
    padding: 16px !important;
}

#app.WalletCenter #WalletCenter-wallet-detail .v-card,
#app.WalletCenter #WalletCenter-wallet-detail .v-card__text {
    padding: 0;
}
/* #endregion 錢包中心 */

/* #region 選擇語系彈窗 */
#app .v-dialog.lang-dialog button {
    border-radius: 4px;
    color: rgba(0, 0, 0, .87);
    height: 36px;
    min-width: 64px;
}

#app .v-dialog.lang-dialog button span{
    color: rgba(0, 0, 0, .87);
}
/* #endregion 選擇語系彈窗 */

/* #region 設定密碼 */

#app.ChangePassword .change-password-main {
    background-color: transparent;
}

#app.ChangePassword #change-password .v-alert.info {
    color: #FC8B00;
    border: none;
    border-radius: 8px;
    background: #eefffc !important;
}
#app.ChangePassword #change-password .v-alert .v-alert__icon {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/icon-hint.png) center no-repeat;
    background-size: 101% 100%;
    color: transparent !important;
    caret-color: transparent !important;
    border-radius: 0;
}

#app.ChangePassword #change-password .v-form {
    position: relative;
    margin-top: 40px;
}

    #app.ChangePassword #change-password .v-form::before {
        width: 110%;
        height: 120%;
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        background: #eefffc !important;
        transform: translate(-50%, -50%);
        border-radius: 15px;
    }

#app.ChangePassword .v-input__slot {
    background: #fff !important;
    border: 1px solid #2B7288 !important;
    border-radius: 20px;
}

    #app.ChangePassword .v-input__slot::before {
        border: none;
    }

#app.EmptyPassword button.v-btn,
#app.ChangePassword button.v-btn[type=submit] {
    background: #00B9B8 !important;
    color: var(--main-color-text);
}

#app.ChangePassword .v-btn.cancel-btn {
    border-color: #00B9B8 !important;
    color: #00B9B8;
}

#app.EmptyPassword button.v-btn.getOtp-btn {
    border: 1px solid rgba(0, 0, 0, .12);
    background: none;
    color: #000000;
}
/* #endregion 設定密碼 */

/* #region 提款密碼 */
#app.ChangeMoneyPassword .change-money-password-main {
    background: #eefffc !important;
    border-radius: 15px;
}

#app.ChangeMoneyPassword .v-input__slot {
    background: #fff !important;
    border: 1px solid #2B7288 !important;
    border-radius: 20px;
}

    #app.ChangeMoneyPassword .v-input__slot::before {
        border: none;
    }

#app.ChangeMoneyPassword .v-btn.cancel-btn {
    border-color: #00B9B8 !important;
    color: #00B9B8;
}

/* #endregion 提款密碼 */
/* #region 註冊/登入 */
#app #login .logo {
    margin: 0 auto 2vh;
}

#app.Login .logo {
    margin-bottom: 3vh;
}

#app.Login #login {
    height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6vh 0;
}

#app.Login #login .logo.showBanner {
    margin: 0;
    margin-bottom: 2vh;
    height: unset;
}
#app.Login .switch-page {
    height: auto;
    max-height: unset;
    min-height: unset;    
}

#login .switch-page .reg-box,
#login .switch-page.isRegisterView .login-box {
    display: none;
}


#login .switch-page.isRegisterView .reg-box {
    display: block;
    margin-top:0 ;
}

#app.Login .switch-page .switch-content {
    height: auto;
    max-height: 60vh;
    overflow: auto;
}

#app.Login .inner[data-v-ada7e0da]:before {
    width: 100vw;
    padding-top: calc(128 / 555 * 100%);
    height: unset;
    margin-bottom: 2vh;
}

#app.Login .tip-box button {
    background-color: #f5f5f5 !important;
    color: rgba(0, 0, 0, .87) !important;
    height: 30px;
    min-width: 64px;
    padding: 0 16px;
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
    border-radius: 4px;
    margin: 4px 0;
}

#app .v-dialog.login-dialog {
    border-radius: 15px;
    border: 1px solid #fff;
}

    #app .v-dialog.login-dialog .login-dialog-bg {
        background: #EEFFFC !important;
        height: unset;
    }

        #app .v-dialog.login-dialog .login-dialog-bg .v-card__title {
            background: #2B7288;
            padding: 16px 24px 10px;
            justify-content: start;
        }

            #app .v-dialog.login-dialog .login-dialog-bg .v-card__title .close-btn {
                top: 0;
                right: 0;
                background: none;
            }

                #app .v-dialog.login-dialog .login-dialog-bg .v-card__title .close-btn::before {
                    font-weight: bolder;
                    font-size: 40px;
                    line-height: 40px;
                    color: #fff;
                    content: '×';
                    position: absolute;
                    top: 0;
                    right: 0;
                    z-index: 1;
                    width: 50px;
                    height: 50px;
                }
    #app .v-dialog.login-dialog .feature-switch-btn {
        display: none;
    }

    #app .v-dialog.login-dialog .v-card__text {
        margin-top: 10px;
        padding: 0 0 20px;
    }

#app .login-dialog .form-wrap .input-wrap, #app .login-dialog .container .input-wrap {
    background-color: unset;
    background-image: none;
    margin: 0 auto 20px;
}
#app .login-dialog .form-wrap .input-wrap.account, #app .login-dialog .container .input-wrap.account,
#app .login-dialog .form-wrap .input-wrap.password, #app .login-dialog .container .input-wrap.password{
    background-image: none!important;
}

#app .login-dialog .form-wrap .input-wrap .v-label, #app .login-dialog .container .input-wrap .v-label {
    color: #0D3745 !important;
    top: -10px;
    padding-left: 5px !important;
}

    #app .login-dialog .form-wrap .input-wrap .v-label, #app .login-dialog .container .input-wrap .v-label.v-label--active {
        transform: translateY(-15px) !important;
    }

#app .login-dialog .v-input input,
#app .login-dialog input:-webkit-autofill {
    color: #0D3745 !important;
    -webkit-text-fill-color: #0D3745 !important;
}

#app .login-dialog .form-wrap .input-wrap input, #app .login-dialog .container .input-wrap input {
    color: #0D3745 !important;
    background: #fff !important;
    border: 1px solid #2B7288 !important;
    border-radius: 15px;
    height: 30px;
}

#app .login-dialog .v-input__control{
    position: relative;
}

#app .login-dialog .form-wrap .input-wrap .v-text-field__details {
    left: 10px;
    top: 4px;
}

#app .login-dialog .form-wrap .check_code.input-wrap .v-text-field__details .v-messages .v-messages__message {
    margin-top: 0;
}

#app .login-dialog .form-wrap .input-wrap .v-input__append-inner img {
    right: 17vw;
    top: 0.2vw;
}

#app .login-dialog .form-wrap, #app .login-dialog .container {
    padding-left: 0px;
    padding-right: 0px;
}

#app .login-dialog .container .input-wrap input::placeholder,
#app .login-dialog .container .input-wrap input::-webkit-input-placeholder {
    color: #0D3745 !important;
}

#app .login-dialog .form-wrap .input-wrap .v-input__append-inner button {
    top: -3px;
}

#app .login-dialog .form-wrap .v-input--checkbox i {
    color: #0D3745 !important;
}

#app .login-dialog .white--text,
#app .login-dialog .form-wrap .v-input--checkbox label {
    color: #0D3745 !important;
    caret-color: #0D3745 !important;
}

#app .login-dialog .title-other-login span {
    color: #0D3745 !important;
}


#app .login-dialog .form-wrap #submit, #app .login-dialog .container button#submit {
    background: linear-gradient( to right, #0E525E 0%, #00B9B8 50%, #02ABAC 58%, #07858B 74%, #104956 94%, #123847 100% ) !important;
    height: 40px !important;
    border-radius: 8px;
}

#app .login-dialog .other-login button.line-login.v-btn {
    background: linear-gradient( to right, #0E525E 0%, #00B9B8 50%, #02ABAC 58%, #07858B 74%, #104956 94%, #123847 100% );
    color: #fff !important;
    border-radius: 8px;
}
/* 註冊 經銷商欄位 */
.form-wrap .input-wrap.show-agent {
    position: relative;
    display: block;
    height: 11.5vw;
    margin: 0 auto 10px;
    padding: 4.5vw 0 0;
    color: var(--input-common-input-main-color);
    font-size: 3.5vw;
    background-color: var(--input-common-form-wrap);
    border-radius: 20vw;
    background-position: 9% center;
    background-repeat: no-repeat;
    background-size: 9%;
    z-index: 10;
    filter: brightness(.7);
}
.form-wrap .input-wrap.show-agent .v-label.v-label--active{
    display:block;

}

/* #endregion 註冊/登入 */
/* #region 優惠專區 */

#app.Promotion .inner .scroll-content .navtab,
#app #promotionProgress .promo-progress .progress-tab {
    background-color: unset;
    border-bottom: 1px solid #fff;
    margin-bottom: 15px;
    border-radius: 0;
}

    #app.Promotion .inner .scroll-content .navtab li.active,
    #app.Promotion .inner .scroll-content .navtab li:not(.v-tab--active),
    #app #promotionProgress .promo-progress .progress-tab li.active,
    #app #promotionProgress .promo-progress .progress-tab li:not(.v-tab--active) {
        color: #fff;
    }

    #app.Promotion .inner .scroll-content .navtab li::after,
    #app.Promotion .v-tabs-slider {
        background-color: #fff !important;
    }

    #app #promotionProgress .promo-progress .progress-tab li{
                position: relative;
    }

        #app #promotionProgress .promo-progress .progress-tab li.active::after {
            content: "";
            position: absolute;
            bottom: -11px;
            left: 50%;
            margin-left: -42px;
            min-width: 85px;
            height: 3px;
            background-color: #fff !important;
        }

#app.Promotion .inner {
    padding: 16px;
}

#app.Promotion .inner .scroll-content {
    margin:0;
    display:flex;
    flex-direction:column;
    gap:16px;
}

    #app.Promotion .inner button {
        background: #00B9B8 !important;
        color: #eefffc !important;
    }

#app #promotionProgress .promo-progress {
    background-color: unset;
    border: 1px solid #fff;
    border-radius: 8px;
    padding: 0 16px;
}
/* #endregion 優惠專區 */
/* #region 代理加盟 */
#app.Partner .btn-group {
    padding: 16px !important;
    margin: 0px !important;
    gap: 10px;
}

#app.Partner .btn-group > li{
    margin: 0px !important;
}

#app.Partner .agent-html {
    padding: 0 16px 16px 16px !important;
    text-align: justify;
}
/* #endregion 代理加盟 */

/* #region 站內信 */

#app.SiteMail #site-mail .v-tabs {
    background: unset;
    border-bottom: 1px solid #fff;
}
#app.SiteMail #site-mail .v-tab--active, #app.SiteMail #site-mail .v-tab:not(.v-tab--active) {
    color: #fff;
}

#app.SiteMail .v-tab:before, #app.SiteMail .v-tabs-slider {
    background-color: #fff;
}

#site-mail .v-card {
    border-radius: 10px;
}

#app.SiteMail .mail-container {
    padding: 12px;
    background-color: var(--body-bg);
    border-radius: 10px;
}

    #app.SiteMail .mail-container .v-alert--text:before {
        background: #eefffc;
        opacity: 1;
    }

    #app.SiteMail .mail-container .v-alert__wrapper {
        position: relative;
    }

    #app.SiteMail .mail-container .v-alert--text .v-alert__content {
        color: #fb8c00 !important;
        position: relative;
        z-index: 1;
    }

    #app.SiteMail .mail-container .v-alert--text i.v-alert__icon {
        background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/icon-hint.png) center no-repeat;
        background-size: 101% 100%;
        color: transparent !important;
        caret-color: transparent !important;
        border-radius: 0;
    }

    #app.SiteMail .mail-container .row {
        flex-direction: column;
        background-color: #EEFFFC;
    }
    #app.SiteMail .mail-container .row .overflow-hidden.col {
        overflow: unset !important;
        color: #fff;
        padding: 0;
    }

        #app.SiteMail .mail-container .row .overflow-hidden.col > p:first-of-type {
            display: block;
            color: #fff;
            background-color: #2B7288;
            padding: 5px 15px;
            border-radius: 8px 8px 0 0;
        }

        #app.SiteMail .mail-container .row .overflow-hidden.col > p:nth-of-type(2) {
            display: block;
            color: #000;
            margin-top: 10px;
            padding: 10px 20px;
        }

    #app.SiteMail .mail-container .row > .col:nth-of-type(2) {
        display: flex;
        justify-content: end;
    }
    /* #endregion 站內信 */
    /* #region 公告彈窗 */
    #app .tab-announcement .common-bg.v-card.v-sheet.theme--light .v-card__text.detail-content .detail-body p > img {
        object-fit: contain;
        width: 100% !important;
        height: auto !important;
    }
#app .tab-announcement .v-card__actions.detail-actions button {
    background: #00B9B8 !important;
}
/* #endregion 公告彈窗 */
/* #region 推薦好友 */
#app #mgm .inner:before {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/Refer_friend.png) no-repeat center center;
    background-size: cover;
}

#app #mgm .v-card {
    border-radius: 12px;
    background: #EEFFFC;
}


#app #mgm .invite-title .grid:nth-of-type(2) h2 {
    color: #FF3745;
}

#app #mgm .v-btn {
    background: #00B9B8 !important;
}
/* #endregion 推薦好友 */

/* #region 超商設定 */
#app #withdraw-account-management .submit-wrap button {
    background: #00B9B8 !important;
}

#app #withdraw-account-management #set-account .v-card {
    background: #EEFFFC;
    border-radius: 12px;
    padding: 16px;
}
#app #withdraw-account-management #set-account .card-title,
#app #withdraw-account-management #set-account label,
#app #withdraw-account-management #set-account .search-link {
    color: #0D3745;
}

#app #withdraw-account-management #set-account inpuut::placeholder {
    color: #0D3745 !important;
}

#app #withdraw-account-management #set-account .v-input__slot {
    color: #0D3745 !important;
    background: #fff !important;
    border: 1px solid #2B7288 !important;
    border-radius: 20px;
}

#app #withdraw-account-management #set-account button[type=submit] {
    background: #00B9B8 !important;
}
/* #region 超商設定 */

/* #region 個人資訊 */
#app #member-infor .v-card {
    background: #EEFFFC;
    border-radius: 12px;
    padding: 16px;
}

#app #member-infor label {
    color: #0D3745;
}

#app #member-infor .form-wrap .input-wrap {
    color: #0D3745 !important;
    background: #fff !important;
    border: 1px solid #2B7288 !important;
}

    #app #member-infor .form-wrap .input-wrap .mx-input {
        border: none;
    }
#app #member-infor button[type=submit] {
    background: #00B9B8 !important;
}
#app #member-infor .v-btn.cancel-btn {
    border-color: #00B9B8 !important;
    color: #00B9B8;
}
/* #endregion 個人資訊 */
/*  #region 測試用 */
#app #home #logo-bar .logo {
    background: url(/CdnRedirect/Web.Mobile/DN021-01.Mobile/Content/Views/Shared/images/logoTopBar.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position-y: 50%;
    height: 55px;
    width: 140px;
}

    #app #home #logo-bar .logo img {
        display: none;
    }

/* #endregion 測試用 */


/* 彈窗背景 */
/*#app .v-dialog__content--active {
    backdrop-filter: blur(8px);
    background-color: rgba(0, 0, 0, 0.4);
}*/

#app .v-dialog.announcement {
    position: relative;
    padding: 0 0 60px;
    background: transparent;
    background-size: 100% 100%;
    border: none;
    box-shadow: none;
    margin-top: 10vh;
}

    #app .v-dialog.announcement .v-card {
        border: none;
        background: transparent;
        box-shadow: none;
    }

        #app .v-dialog.announcement .v-card::before {
            content: none;
        }

    #app .v-dialog.announcement .v-card__text {
        padding: 0px;
        color: #fff;
    }

        #app .v-dialog.announcement .v-card__text .swiper-slide {
            position: relative;
            overflow: hidden;
            border-radius: 12px;
            padding: 2px;
        }

            #app .v-dialog.announcement .v-card__text .swiper-slide::before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                z-index: -1;
                border-radius: 12px;
                border: 2px solid rgba(0, 0, 0, 0);
                background: var(--custom-pink-light) border-box;
                -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
                -webkit-mask-composite: xor;
                mask-composite: exclude;
                content: none;
            }

            #app .v-dialog.announcement .v-card__text .swiper-slide .v-card__text {
                border-radius: 12px;
                position: relative;
            }

                #app .v-dialog.announcement .v-card__text .swiper-slide .v-card__text::after {
                    content: "";
                    position: absolute;
                    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 40.5%, #000 100%);
                    width: 100%;
                    height: 100px;
                    bottom: 0;
                    content: none;
                }

        #app .v-dialog.announcement .v-card__text .navigationp-btn {
            display: none;
        }

    #app .v-dialog.announcement .v-card .v-card__title {
        border: none;
        background: transparent;
        box-shadow: none;
        padding: 0;
    }



        #app .v-dialog.announcement .v-card .v-card__title button {
            position: absolute;
            top: 100%;
            right: 50%;
            margin-right: -30px;
            width: 50px;
            height: 50px;
            font-size: 0;
        }

    #app .v-dialog.announcement .v-card.v-sheet.theme--light button::before {
        content: "✕";
        width: 30px;
        height: 30px;
        color: var(--custom-white);
        border: solid #fff 2px;
        border-radius: 50%;
        font-size: 15px;
        font-weight: bold;
        line-height: 21px;
    }

    #app .v-dialog.announcement .v-card .v-card__title span {
        display: none;
    }

    #app .v-dialog.announcement .v-card .v-card__title button:active {
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }

    #app .v-dialog.announcement .v-card .swiper-pagination-bullets {
        bottom: 14px;
    }

    #app .v-dialog.announcement .v-card .swiper-pagination .swiper-pagination-bullet {
        width: 6px !important;
        height: 6px !important;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        background: #FFFFFF !important;
    }

        #app .v-dialog.announcement .v-card .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
            background: var(--custom-pink-dark) !important;
        }

    #app .v-dialog.announcement .v-card .v-card__text img {
        display: block;
        margin: 0 auto;
        width: 100%;
        height: auto;
    }

    #app .v-dialog.announcement .v-divider {
        display: none;
    }

    #app .v-dialog.announcement .footer {
        justify-content: center;
        color: #fff;
    }

        #app .v-dialog.announcement .footer p {
            display: none;
        }

        #app .v-dialog.announcement .footer label,
        #app .v-dialog.announcement .footer .v-input--selection-controls__input .v-icon {
            color: #fff;
        }

@media (max-width: 400px) { /*輪播圖太大，iPhone SE 會出現滾動。*/
    #app .v-dialog.announcement .v-card .v-card__actions {
        padding: 10px 16px 20px 16px;
    }
}

.v-dialog.financial-dialog .v-card ul li.deposit::before,
.v-dialog.financial-dialog .v-card ul li::before {
    width: 20%;
}


@media (max-width: 376px) {

    #app .main #home-navigation .game-tab li span {
        margin-top: 0;
    }
}

/* #region 鎖住最大寬度只能450px */
@media (min-width: 451px) {
    html {
        background: #000;
    }
    html,
    body,
    body .layout-wrap > * {
        margin: 0 auto;
    }

        body,
        body .layout-wrap > *,
        #app #footer .v-bottom-navigation,
        #app.Home .game-list-block-wrap .hot-swiper-slide,
        #app #footer .v-bottom-navigation,
        #app .v-overlay, #app .v-dialog__content,
        .swal2-modal {
            max-width: 450px !important;
        }

    #app .v-overlay {
        width: 450px;
    }

    #app #custom-float,
    #app #vpn-float,
    #app #activity-float {
        right: calc(50vw - 215px);
        margin-bottom: 15px;
        left: unset !important;
    }

    #app .v-main {
        background-size: cover !important;
    }

    #app #page-title,
    #app .v-bottom-navigation {
        display: block;
    }

    .col-3 {
        width: 25%;
    }

    #app.Home #home-navigation-wrap {
        margin-bottom: 79px;
    }

    #app #footer .v-bottom-navigation,
    #app .v-overlay,
    #app .v-dialog__content {
        left: 50%;
        transform: translateX(-50%) !important;
    }

    #app #footer .v-bottom-navigation {
        display: flex;
        /* max-height: 102px; */
        padding-top: 25px;
        /* height: 102px !important; */
    }

        #app #footer .v-bottom-navigation .v-btn {
            top: unset;
            bottom: 24px;
            height: 56px !important;
        }

    #app.Home #home-navigation .game-list-block ul li > span {
        font-size: 18px;
    }

    #app #login .switch-page .switch-content {
        font-size: calc( 0.038*450px);
    }

    .form-wrap .input-wrap .v-label,
    .form-wrap .input-wrap input,
    #app.Promotion .inner .scroll-content .navtab li,
    #app.MemberTransfer #transfer-form-wrap .transfer-input-wrap .v-label,
    #app.MemberTransfer #transfer-form-wrap .transfer-input-wrap input {
        font-size: calc( 0.035*450px);
    }

    .form-wrap .input-wrap {
        padding-top: 4% !important;
        height: calc(0.115*450px);
        font-size: calc(0.035*450px);
    }

    .v-select.v-input--dense .v-select__selection--comma,
    #app .register-switch-btn,
    #app.PartnerApply #agent-apply .form-wrap button[type="submit"],
    #app #login .switch-page .switch-btn.tab .li.go-register,
    #app #login .go-login {
        font-size: calc(0.035* 450px) !important;
    }

    #app .v-form .v-input__append-outer {
        top: 67px;
    }

    #app .v-dialog.login-dialog .v-form .v-input__append-outer {
        top: 54px;
    }

    #app .form-wrap #submit {
        font-size: calc( 0.042*450px);
        height: calc(0.11*450px);
    }

    .form-wrap .input-wrap .v-text-field__details {
        left: calc(0.27*450px);
        top: calc(0.03*450px);
    }

    #app #login .logo {
        margin: 0 auto calc(0.03*450px);
        height: calc(0.24*450px);
        width: auto;
    }

        #app #login .logo a {
            margin: auto;
        }

    .member-center-g .action-link.big-link:before,
    .member-center-g .action-link.big-link:after {
        width: calc(0.11*450px);
        height: calc(0.11*450px);
    }

    .member-center-g:before,
    #promotion:before,
    #deposit:before {
        position: relative;
    }

    #app #page-title {
        font-size: calc(0.05*450px);
    }

    #app.Home #home-navigation .game-tab {
        padding: 16px 12px 50px 16px;
        flex-direction: column;
        flex-wrap: nowrap;
    }

    #app.Home #home-navigation .game-list-block {
        padding: 16px 16px 50px 16px;
    }

    #app.OnlineServices .services-link {
        max-height: 90px;
    }

    #app.MemberCenter .page-box-2 > .row > div .action-link.big-link {
        height: 55px;
    }

    #app.Vip .member-info .icon {
        background: var(--vip-icon-bg) no-repeat center center;
        background-size: contain;
        font-weight: 700;
    }

        #app.Vip .member-info .icon p {
            margin: 0;
            font-size: 12px;
            font-weight: 700;
        }

        #app.Vip .member-info .icon span {
            display: block;
            font-size: 24px;
            font-weight: bold;
        }

    #app.Vip .v-card.first-card .v-card__text.member-info {
        padding-left: 40px;
    }

        #app.Vip .v-card.first-card .v-card__text.member-info .vip {
            font-size: 15px;
            font-weight: bold;
        }

    #app.Promotion .inner .scroll-content {
        border-radius: 50px;
        background: var(--custom-white);
    }

        #app.Promotion .inner .scroll-content .navtab {
            display: flex;
        }

            #app.Promotion .inner .scroll-content .navtab li {
                flex: 1;
                display: flex;
                justify-content: center;
                align-items: center;
            }

    #app.Home .maintaining:before,
    #app.Home .hot-maintaining:before,
    #app.Lobby .maintaining:before {
        width: 30px;
        height: 30px;
    }

    #app.MemberCenter .member-center::before {
        width: 100%;
        max-width: 450px !important;
        height: 236px;
        transform: translateX(-50%);
        left: 50%;
    }

    #app .member-center .profile-wrap .member-level .member-level span {
        font-size: 14px;
        vertical-align: top;
    }

    #app .member-center .action-link.financial::before,
    #app .member-center .action-link.withdraw::before,
    #app .member-center .action-link.promotion::before,
    #app .member-center .action-link.vip::before {
        width: 40px;
        height: 40px;
    }
    #app .member-center .action-link.financial::after,
    #app .member-center .action-link.withdraw::after,
    #app .member-center .action-link.promotion::after,
    #app .member-center .action-link.vip::after {
        width: 40px;
        height: 40px;
        left: 19px;
    }

    #app.MemberCenter .member-center .row > div .action-link.big-link:before,
    #app.MemberCenter .member-center .row > div .action-link.big-link:after {
        width: 48px;
        height: 48px;
    }

    #app.Vip #vip table tr th,
    #app.Vip #vip table tr td {
        padding: 10px;
    }

    #app.MemberTransfer .v-input button.getMobileSendCode,
    #app .v-dialog.login-dialog .v-card .v-card__text .v-form .input-wrap.check_code.tip-box,
    #app .v-dialog.login-dialog .v-card .v-card__text .v-form .input-wrap.check_code.tip-box button {
        height: 36px !important;
    }

        #app .v-dialog.register-dialog .v-card .v-card__text .v-form .input-wrap.check_code .tip-box button,
        #app .v-dialog.login-dialog .v-card .v-card__text .v-form .input-wrap.check_code.tip-box button {
            height: 34px !important;
        }

    #app .v-dialog.login-dialog .v-card .v-card__text .v-form .input-wrap.check_code.tip-box {
        bottom: 1px;
        right: 0;
    }

    #app .v-dialog.register-dialog .v-card .v-card__text .v-form .input-wrap.check_code .tip-box {
        bottom: -10px;
        right: 2px;
    }

    #app #member-transfer .transfer-input-wrap .v-input__append-inner,
    #app #member-transfer .transfer-input-wrap .v-input__append-outer {
        right: -3%;
        bottom: -34%;
    }

    #app.MemberTransfer #member-transfer .warn-text {
        line-height: 3;
        font-size: 16px;
    }

    #app .v-dialog.forget-password-dialog .input-wrap {
        padding: 16px 12px 0 12px;
    }

    #app .v-dialog.forget-password-dialog .v-text-field__details {
        left: 0;
    }

    #app #footer .v-btn i.financial {
        margin-top: 0;
    }

    #app.MemberCenter .mamber-info-wrap {
        max-height: 252px;
    }

    #app.Vip .vip-list-wrap .vip-list .swiper-slide {
        max-height: 215px;
    }

    #app #home {
        overflow: hidden;
    }

    #home-navigation .swiper-slide {
        padding-top: 16px;
    }

    #app .forget-password-dialog-bg .get-captcha-btn {
        top: 47px;
    }

    #app.Home .jackpot {
        max-width: 189px;
    }

    #app .v-alert.notify-msg {
        position: absolute;
    }

    #app .v-dialog.register-dialog .v-card .v-card__text .v-form .get-mobile-verification-code {
        top: 50px;
    }

    #app .v-dialog.login-dialog .v-card .v-card__title {
        overflow: visible;
    }

    .light-mode .v-main:before {
        max-width: 450px !important;
        margin: auto;
    }

    .v-dialog.financial-dialog{
        margin: 0 0 57px 0 !important;
    }

    #app .form-wrap .input-wrap .v-input__append-inner button {
        top: -12px;
        right: 18px;
    }

    #app #partner .v-card ul.btn-group {
        width: 100%;
    }

    #app.MemberTransfer #transfer-form-wrap .transfer-input-wrap {
        height: 40px;
        padding: 10px 0 0;
    }

    #app #member-infor label.label-birth {
        font-size: calc(0.035 * 450px);
    }

    #app .login-dialog .form-wrap .input-wrap .v-input__append-inner img {
        right: 55px;
        top: 0;
        width: 74px;
        height: 30px;
    }

    #app #footer .v-bottom-navigation .v-btn.deposit .v-btn__content{
        width: 50px;
    }

    #app #footer .v-bottom-navigation .v-btn.deposit .v-btn__content .btn-bg {
        width: 72px;
    }
    .form-wrap .input-wrap.show-agent{
        height: calc(0.115 * 450px);
    }

    #home-navigation .swiper-slide.common .common-list.hot .hot-item .game-name{
        bottom: 6px;
    }
}