/*
    Created on : 2019/8/19, 下午 02:17:37
-- [Index Body]
-- [Banner]
-- [Login & Regist & Forget]
-- [Announce & Offer]
-- [Account]

*/

* {
    padding: 0;
    margin: 0;
    border-radius: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

svg {
    width: 100%;
    height: 100%;
}

select {
    cursor: pointer;
}

.flipx {
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    /*IE*/
    filter: FlipH;
}

.flipy {
    -moz-transform:scaleY(-1);
    -webkit-transform:scaleY(-1);
    -o-transform:scaleY(-1);
    transform:scaleY(-1);
    /*IE*/
    filter:FlipV;
}

.cursor-pointer {
    cursor: pointer !important;
}

.cursor-default {
    cursor: default !important;
}

.pointer-events-none {
    pointer-events: none !important;
}

.line-height-1 {
    line-height: 1;
}

html, body {
    height: 100%;
}
body > .wrap-content {
    position: relative;
    min-height: 100%;
    min-width: 1024px;
}

body > .wrap-content > .footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

body {
    color: white;
    font-weight: normal;
    font-size: 12px;
    padding: 0px;
    margin: 0px;
    background-size: cover;
    background-color: #000000;
    overflow-y: scroll;
}

a, a:hover {
    text-decoration: none;
}

[v-cloak] { display: none; }

.textlower {
    background: linear-gradient(to bottom, rgb(255, 255, 255)90%, rgb(88, 89, 91)10%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
}

.textupper {
    background-color: rgb(0, 195, 0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
}

.fa-line {
    background-color: rgb(0, 195, 0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
}

.material-icons {
    background-color: rgb(0, 195, 0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
}

/* prevent default bootstrap button style */
.btn:focus {
    box-shadow: none;
}

.float_active_icon {
    position: fixed;
    top: 190px;
    right: 18px;
    z-index: 3;
    transition: all 0.3s;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    flex-direction: column;
}
.float_active_icon .active-item {
    position: relative;
}

.float_active_icon .active-item .active-close-btn{
    position: absolute;
    right: 0;
    top: -10px;
    width: 22px;
    height: 22px;
    display: block;
    cursor: pointer;
}
.float_active_icon .active-item.Bravo .active-icon-btn{
    width: 115px;
    height: 115px;
    display: block;
    cursor: pointer;
}

.float_active_icon .active-item .active-close-btn img,
.float_active_icon .active-item.Bravo .active-icon-btn img{
    width: 100%;
    height: 100%;
}

/** ------- Login ----------------- Start */
.login-content-box {
    padding: 5px;
}
.main_card_login {
    background-color: rgb(255, 255, 255);
    color: black;
    border: 3px;
    border-style: solid;
    border-color: rgb(253, 231, 197);
    box-shadow: 1px 3px 8px rgb(88, 89, 91);
    font-weight: bold;
    border-radius: 10px;
    padding: 35px 47px 19px;
}
.main_card_login input[type="password"] {
    font: small-caption;
    font-size: 14px !important;
}
.main_card_login .login-title-text {
    font-size: 2.125rem;
    line-height: 1;
    display: block;
    text-align: center;
    margin-bottom: 35px;
}
.main_card_login .form-group {
    position: relative;
    padding: 0 0 0 30px;
    margin-bottom: 26px;
}
.main_card_login .form-group-pw .btn_forgot-password {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    position: absolute;
    right: 12px;
    top: 9px;
    font-size: 14px;
    text-decoration: underline;
}
.main_card_login .form-group-pw .btn_forgot-password:hover {
    opacity: 0.5;
}
.main_card_login .form-group-captcha {
    padding-right: 85px;
}
.main_card_login .css-captcha-btn {
    cursor: pointer;
    position: absolute;
    right: 3px;
    top: 3px;
    width: 72px;
    height: 32px;
}
.main_card_login .loginicon {
    width: 17px;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -17px;
}
.main_card_login .form-control {
    display: block;
    width: 100%;
    height: 38px;
    padding: 0 .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 38px;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    border: 1px solid #818181;
    font-weight: bold;
    box-sizing: border-box;
}
.btnregis, .btnlogin {
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.75rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    display: inline-block;
    vertical-align: middle;
    font-weight: 400;
    margin: 0 10px;
    min-width: 180px;
}
.main_card_login .form-footer {
    margin-top: 20px;
}


/** ------- Regist & Forget ------- Start */

.base-form {
    width: 800px;
    background: #101010;
    margin: 0 auto 0 auto;
    font-size: 14px;
    padding: 5px 0px 30px 0px;
}

.base-form label {
    text-align: left;
}

.base-form .custom-control-label::before {
    border-color: #b89a6f !important;
}

.custom-control-input:checked~.custom-control-label::before {
    border-color: #b89a6f!important;
    background: #000!important;
}

.base-form.success .anybox-area {
    font-weight: bold;
    padding: 90px 0px 60px;
}

/** ------- Regist & Forget ------- End */

.clear{
    clear: both;
}

.disable{
    pointer-events: none !important;
    cursor: default !important;
}

.wh100{
    height: 100%;
    width : 100%;
}

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

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

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

.display-flex-justend-top{
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}

.display-flex-justend-bottom{
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

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

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

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

.dropdown-menu{
    right: -10px;
    left: unset;
}

.btn-default{
    display: inline-block;
    text-align: center;
    cursor: pointer;
}

.hr-style1{
    border-top: 1px solid #000000;
    border-bottom: 1px solid #222222;
    width: 100%;
    height: 0px;
    margin: 26px 0px;
}

.font-size-1dot1rem {
    font-size: 1.1rem !important;
}

.content-title-step{
    width: 100%;
    max-width: 800px;
    height: 44px;
    margin: 5px auto 15px auto;
}

.content-title-text {
    font-size: 14px;
    line-height: 1;
    margin-top: 6px;
    padding: 20px 0px;
}

input.form-control.error{
    background: #000!important;
    border: 1px solid red;
}

/* bootstrap dependent extend */

.col-2dot4,
.col-sm-2dot4,
.col-md-2dot4,
.col-lg-2dot4,
.col-xl-2dot4 {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.col-2dot4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}
@media (min-width: 540px) {
    .col-sm-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 720px) {
    .col-md-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 960px) {
    .col-lg-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 1140px) {
    .col-xl-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
/* bootstrap dependent extend */

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

/** ------- Index Body ------- Start */

.header-box {
    width:100%;
    height: 100%;
}

.content-box {
    width: 100%;
    height: 100%;
}

.logo {
    height: 90px;
    padding: 8px 0 8px 5px;
}
.logo img {
    height: 100%;
    width: auto;
}
.flag {
    width: .8125rem;
}
.page-top .box-account {
    overflow: hidden;
    margin: 0.8rem 0;
    font-size: 12px;
    text-align: center;
    display: flex;
    justify-content: flex-end;
    align-items: stretch;
}
.page-top .box-account .balance-label #refresh_btn {
    border-radius: 3px;
    border: 1px solid #ffeb96;
    font-size: 14px;
    padding: 2px 6px;
    background-image: linear-gradient(0deg,#c19238 0%,#f6d67f 100%);
    cursor: pointer;
}
.page-top .box-account .balance-label #refresh_btn:hover {
    background-image: linear-gradient(0deg,#d2a13e 0%,#fae48c 100%);
}
.page-top .box-account .balance-label #refresh {
    display: inline-block;
    width: 14px;
    height: 14px;
}
.page-top .account-info-box {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: .2rem 1.125rem;
    border-radius: 4px;
}
.page-top .account-info-box .account-label a {
    margin-left: 10px;
}
.page-top .account-info-box .account-label {
    padding-bottom: .5rem;
    line-height: 1;
}
.page-top .account-info-box .balance-label {
    line-height: 1;
}
#header_point {
    font-size: 14px;
    color: #dbc097;
}
.page-top .account-link-box {
    background:#8c7458;
    height: 20px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
}
.page-top .account-link-box .account-link-text{
    line-height: 20px;
}
.page-top .account-link-box .account-link-hr {
    width: 2px;
    height: 70%;
    margin: 0 14px;
}
.page-top .page-top-btn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    padding: 0 1rem;
    margin: 0 0.4rem 0 0;
    background-image: linear-gradient(180deg, #2b1f04 0%, #503d14 100%);
    box-shadow: inset 0 0 3px 0px #9f8044;
    color: #fff4de;
    word-break: keep-all;
    min-width: 100px;
    cursor: pointer;
}
.page-top .page-top-btn.active,
.page-top .page-top-btn:hover {
    background-image: linear-gradient(180deg, #443416 0%, #74643a 100%);
}
.page-top .page-top-btn img {
    width: auto;
    height: 21px;
    margin: 0.3rem 0;
}
.guest-header-navbar {
    text-shadow: 0 0 5px rgb(88, 89, 91);
    font-weight: bold;
}
.guest-header-navbar .navbar-nav {
    width: 100%;
}
/* 語系下拉選擇選單 */
.lang-dropdown .dropdown-menu {
    right: 0;
    min-width: inherit;
}
.lang-dropdown .dropdown-toggle{
    display: flex;
    align-items: center;
    padding: 8px 3px;
}
.lang-dropdown .dropdown-menu .dropdown-item {
    background: transparent;
    font-size: .875rem;
}
.lang-box-area .navbar {
    padding: 0;
    margin-left: 0.2rem;
}
.lang-box-area .dropdown-toggle{
    padding: 0;
    display: block;
    height: 20px;
    width: 48px;
    line-height: 16px;
}
.lang-box-area .dropdown-toggle:after {
    vertical-align: middle;
}
/* 語系下拉選擇選單 END */

/* banner */
.home-banner .banner-slide .owl-dots {
    line-height: 1;
    font-size: 0;
    bottom: 3%;
}
.home-banner .banner-item {
    display: block;
    width: 100%;
    height: 250px;
    padding-top: 13.020833333333333333333333333333%;
    background-position: center top;
    background-size: cover;
}

.footer_option {
    font-size: 15px;
    color: white;
    height: 78px;

}

.footer_option ul {
    padding: 26px 0;
    margin: 0;
    text-align: center;
}
.footer_option ul li {
    display: inline-block;
    vertical-align: middle;
    margin: 0 15px;
}

.footer_option ul li a {
    color:#787878;
}

.footer_option ul li a:hover {
    color: #aaa;
}

.bottom-footer {
    font-size: 0.75rem;
    padding: 0.2rem 0;
}

.page_content {
    min-height: 83vh;
    background-color: #1b1b1b;
    padding: 50px 0;
}

.aside_fixed_menu {
    position: fixed;
    right: 0;
    top: 16%;
    z-index: 1;
}
.aside_fixed_menu ul {
    padding: 0;
    margin: 0;
    display: inline-block;
}
.aside_fixed_menu li {

    list-style-type: none;

}
.aside_fixed_menu li:first-child > a {
    border-top-left-radius: 25px;
}
.aside_fixed_menu li:last-child > a {
    border-bottom-left-radius: 25px;
}
.aside_fixed_menu li > a {
    text-decoration: none;
    text-align: center;
    display: block;
    font-weight: bold;
    font-size: 12px;
    border-radius: 3px 0 0 3px;
    padding: 10px 5px 10px 8px;
    min-width: 90px;
    position: relative;
    z-index: 5;
    cursor: pointer;
}
.aside_fixed_menu li i[class^="icon_fixedmenu_"] {
    display: block;
    width: 36px;
    height: 32px;
    background-size: auto 32px;
    background-repeat: no-repeat;
    background-position: center center;
    margin: auto;
}

.aside_fixed_menu .icon_fixedmenu_close {
    display: block;
    width: 18px;
    height: 18px;
    background-size: auto 18px;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
    position: absolute;
    left: -26px;
    top: 6px;
    z-index: 5;
}
.aside_fixed_menu .fixedmenu_contentbox {
    box-shadow: 0px 1px 0px 0px
        rgba(108, 90, 65, 0.5),
        inset -13px 0px 9px 0px
        rgba(163, 132, 90, 0.39);
    background-image: linear-gradient(0deg,
        #fde7c5 0%,
        #9f8564 100%);
    border-radius: 3px;
    border: solid 1px #bfaa8b;
    text-align: center;
    position: absolute;
    right: -140%;
    top: 50%;
    margin-top: -143px;
    padding: 15px 20px;
    opacity: 0;
    -webkit-transition: all 0.4s .05s ease;
    -moz-transition: all 0.4s .05s ease;
    -o-transition: all 0.4s .05s ease;
    transition: all 0.4s .05s ease;
}
.aside_fixed_menu li:hover .fixedmenu_contentbox {
    right: 98%;
    opacity: 1;
}
.aside_fixed_menu .fixedmenu_contentbox h4 {
    color: #2f2b26;
    text-shadow: 1px 1px 0px rgba(251, 229, 195, 0.6);
    margin: 0 0 10px 0;
    font-size: 18px;
}
.aside_fixed_menu .fixedmenu_contentbox img {
    margin-bottom: 5px;
}
.aside_fixed_menu .fixedmenu_contentbox .fixed_menu_btn {
    background: #3b3833;
    color: #f8e2c0;
    display: block;
    text-align: center;
    min-width: 180px;
    margin-top: 5px;
    font-size: 14px;
    line-height: 34px;
    padding: 0;
    font-weight: normal;
    z-index: 1;
    text-decoration: none;
}

.aside_fixed_menu .fixedmenu_contentbox .fixed_menu_btn:hover {
    color: #f8e2c0;
    background: #49453d;
}

/** ------- Index Body ------- End */


/** ------- Announce & Offer ------- Start */

.record-page-nav {
    text-align: right;
    margin: 15px 0 30px;
    font-size: 13px;
    line-height: 2;
}
.record-page-nav a {
    color: #969696;
    cursor: pointer;
}
.record-page-current{
    display: inline-block;
    margin: 0px 10px;
}

table.announce-table th {
    font-weight: normal;
    font-size: 16px;
    padding: 7px 0;
}

table.announce-table td {
    font-size: 14px;
    text-align: left;
    line-height: 2.5;
    cursor: pointer;
}

.announce-table .announce-date {
    text-align: center;
}

.announce-table td.announce-detail {
    line-height: 1.5;
    display: none;
    word-break: break-all;
}

.offer-wrapper {
    height: auto;
    margin: 0 auto;
}

.offer-category-btn{
    cursor: pointer;
}

.offer-category-btn .offer-category-box {
    font-size: 18px;
    height: 50px;
}

.offer-category-btn .offer-category-box span {
    word-break: break-all;
}

.offer-category-btn .offer-icon{
    display: inline-block;
    width: 30px;
    height: 30px;
    margin-right: 5px;
    background-position-x: 0;
    background-position-y: 0;
    background-size: 900% 200%; /* 7xicon * 100% , 2x图层 * 100% */
    background-repeat: no-repeat;
}

.offer-category-btn.active .offer-icon,
.offer-category-btn:hover .offer-icon{
    background-position-y: 100%;
}

.offer-category-btn .offer-icon-all {
    background-position-x: 0;
}

.offer-category-btn .offer-icon-slot {
    background-position-x: 12.5%;
}

.offer-category-btn .offer-icon-chess {
    background-position-x: 87.5%;
}

.offer-category-btn .offer-icon-pachinko{
    background-position-x: 100%;
}

.offer-category-btn .offer-icon-limit {
    background-position-x: 62.5%;
}


.offer-item-box{
    position: relative;
    width: 33%;
    margin-top: 1%;
    float: left;
}

.offer-item-banner {
    position: relative;
    cursor: pointer;
    overflow: hidden;
}
.offer-item-countdown {
    padding: 0px 5px;
    line-height: 25px;
    background-color: #C1272D;
    border-radius: 32px;
    position: absolute;
    color: #ffffff;
    font-size: 12px;
    right: 8px;
    top: 8px;
    -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.4);
    -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.4);
    box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.4);
}
.offer-item-banner .offer-item-img {
    width: 100%;
    padding-top: 73.529411764705882352941176470588%;
    position: relative;
}

.offer-item-banner .offer-item-img img {
    position: absolute;
    top: 0;
    left: 0;
}


.offer-item-banner-title {
    width: 100%;
    height: 47px;
    background-color: #000000;
    opacity: 0.97;
    position: absolute;
    bottom: 0px;
    transition: 0.5s;
}

.offer-item-banner:hover .offer-item-banner-title {
    height: 100%;
    transition: 0.5s;
}

.offer-item-banner .circle-rotate {
    width: 100%;
    height: 100%;
    position: absolute;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    top: 5%;
}
.offer-item-banner:hover .circle-rotate {
    opacity: 1;
    transition: 5s;
    -webkit-animation: spin 4s linear infinite;
    -moz-animation: spin 4s linear infinite;
    animation: spin 4s linear infinite;
}

.offer-item-banner-title div.text {
    font-size: 16px;
    text-align: center;
    line-height: 47px;
    height: 47px;
}

.offer-item-info {
    height: 54px;
}

.offer-item-icon {
    width: 26px;
    height: 26px;
    margin: 0px 10px;
    background-repeat: no-repeat;
    background-size: 100%;
    background-position-x: center;
}

.offer-item-info .offer-item-msg {
    width: 90%;
    height: 100%;
    font-size: 14px;
}

.offer-item-hr {
    width: 1px;
    height: 50%;
}

.offer-item-link{
    display: block;
    text-align: center;
    padding: 10px 0;
    line-height: 1;
    width: 48%;
}

.offer-item-list .detail-header {
    width: 100%;
    height: 50px;
    position: relative;
    font-size: 18px;
    line-height: 50px;
    text-align: center;
}

.offer-item-list .detail-header .detail-close {
    background-size: cover;
    width: 28px;
    height: 28px;
    position: absolute;
    right: 10px;
    top: 12px;
}

.record-table table tr td {
    font-size: 14px;
}
/** ------- Announce & Offer ------- End */

/** ------- Slot page ------- Start */

.slot-container {
    background-color: transparent;
    background-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .9) 50%, transparent 100%);
    padding: 2.5rem 5rem;
}
#game_list_block {
    min-height: 94vh;
}
#game_list_block .slot-game-list-btn {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 40%;
    height: 7rem;
    width: 3rem;
    border-radius: .5rem;
    font-size: 0;
    cursor: pointer;
}
#game_list_block .slot-game-list-btn.btn-prev {
    left: -4rem;
}
#game_list_block .slot-game-list-btn.btn-next {
    right: -4rem;
}

#slot_game_list {
    min-height: 595px;  /* jPages perPage = 18， set for the default height */
}

#slot_game_list .game-box {
    margin-bottom: 2rem;
    flex: 0 0 14.75%;
    margin-right: 2.3%;
}
#slot_game_list .game-box:nth-child(6n) {
    margin-right: 0;
}
#slot_game_list .game-box .pic {
    width: 100%;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
    transition: all .15s ease-in-out;
    -webkit-user-select:none;
    -moz-user-select:none;
    -o-user-select:none;
    user-select:none;
}
#slot_game_list .game-box .pic .game-img {
    width: 100%;
    height: 100%;
    z-index: 1;
    cursor: pointer;
}

#slot_game_list .game-box .open-game-options-btn-box {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    transition: visibility .15s, opacity .15s ease-in-out;
    opacity: 0;
    visibility: hidden;
    padding-top: 15px;
}
#slot_game_list .game-box .open-game-options-btn-box button {
    margin: 0 1rem;
    color: #ffffff;
    font-size: .75rem;
    border-radius: .25rem;
    line-height: 1;
}
#slot_game_list .game-box .open-game-options-btn-box button:not(:first-child) {
    margin-top: 6px;
}
@media (min-width: 1200px) {
    #slot_game_list .game-box .open-game-options-btn-box {

    }
    #slot_game_list .game-box .open-game-options-btn-box button {
        padding: .5rem;
    }
}
#slot_game_list .game-box .title {
    margin-top: .625rem;
    line-height: 1em;
}
#slot_game_list .game-box:hover .pic,
#slot_game_list .game-box:active .pic,
#slot_game_list .game-box:focus .pic,
#slot_game_list .game-box.active .pic {
    border: 2px solid #f2dbb9;
}
#slot_game_list .game-box:hover .open-game-options-btn-box,
#slot_game_list .game-box:active .open-game-options-btn-box,
#slot_game_list .game-box:focus .open-game-options-btn-box,
#slot_game_list .game-box.active .open-game-options-btn-box {
    opacity: 1;
    visibility: visible;
}
#slot_game_list .game-box:hover .title,
#slot_game_list .game-box:active .title,
#slot_game_list .game-box:focus .title,
#slot_game_list .game-box.active .title {
    color: #f2dbb9;
}

#slot_game_list .game-box .game-hall-icon {
    width: 50px;
    height: 50px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: -7px;
    left: -7px;
    z-index: 3;
    pointer-events: none;
}
#slot_game_list .game-box:before {
    content: '';
    width: 100px;
    height: 28px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    position: absolute;
    top: 5px;
    right: -5px;
    z-index: 3;
    pointer-events: none;
}
#slot_game_list .game-box.RSG:before{
    background-image: url('../img/common/icon/img_gametype_RSG.png?v=1');
}
#slot_game_list .game-box.PTG:before{
    background-image: url('../img/common/icon/img_gametype_PTG.png?v=1');
}
#slot_game_list .game-box.CQ9:before {
    background-image: url('../img/common/icon/img_gametype_CQ9.png?v=1');
}
#slot_game_list .game-box.APIU:before {
    background-image: url('../img/common/icon/img_gametype_NS.png');
}
#slot_game_list .game-box.AWS:before {
    background-image: url('../img/common/icon/img_gametype_AWS.png?v=1');
}
#slot_game_list .game-box.BONGO:before {
    background-image: url('../img/common/icon/img_gametype_BNG.png?v=1');
}
#slot_game_list .game-box.MGPLUS:before {
    background-image: url('../img/common/icon/img_gametype_MG.png?v=1');
}
#slot_game_list .game-box.VDD:before {
    background-image: url('../img/common/icon/img_gametype_VDD.png?v=1');
}
#slot_game_list .game-box.CG:before {
    background-image: url('../img/common/icon/img_gametype_CG.png?v=1');
}
/* special fish icon. */
#slot_game_list .game-box.MGPLUS.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_MG-fish.png');
}
#slot_game_list .game-box.UPG:before {
    background-image: url('../img/common/icon/img_gametype_UPG.png?v=1');
}
#slot_game_list .game-box.AUG:before {
    background-image: url('../img/common/icon/img_gametype_AUG.png');
}
#slot_game_list .game-box.MT:before {
    background-image: url('../img/common/icon/img_gametype_MT.png');
}
#slot_game_list .game-box.LP:before {
    background-image: url('../img/common/icon/img_gametype_LP.png');
}
#slot_game_list .game-box.YGG:before {
    background-image: url('../img/common/icon/img_gametype_YGG.png');
}
#slot_game_list .game-box.VA:before {
    background-image: url('../img/common/icon/img_gametype_VA.png');
}
#slot_game_list .game-box.DC.HS:before {
    background-image: url('../img/common/icon/img_gametype_DCHS.png');
}
#slot_game_list .game-box.DC.PS:before {
    background-image: url('../img/common/icon/img_gametype_DCPS.png');
}
#slot_game_list .game-box.DC.OP:before {
    background-image: url('../img/common/icon/img_gametype_DCOP.png');
}
#slot_game_list .game-box.DC.TK:before {
    background-image: url('../img/common/icon/img_gametype_DCTK.png');
}
/* special fish icon. */
#slot_game_list .game-box.APIU.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_APIU-fish.png');
}
#slot_game_list .game-box.AUG.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_AUG-fish.png');
}
#slot_game_list .game-box.YGG.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_YGG-fish.png');
}
#slot_game_list .game-box.MT.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_MT-fish.png');
}
#slot_game_list .game-box.CQ9.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_CQ9-fish.png');
}
#slot_game_list .game-box.VA.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_VA-fish.png');
}
#slot_game_list .game-box.DC.fish:before {
    width: 100px;
    background-image: url('../img/common/icon/img_gametype_DC-fish.png');
}
/** ------- Slot page ------- End */

/** --- AccountCenter --- Start */
.account-top > ul {
    text-align: center;
    margin-bottom: 0px;
}
.account-top > ul > li {
    cursor: pointer;
    display: inline-block;
    font-size: 17px;
    padding-top: 10px;
    padding-bottom: 5px;
    text-align: center;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    letter-spacing: 0px;
}
.account-top > ul > li.router-link-active,
.account-top > ul > li:hover {
    font-weight: bold;
}
.account-main {
    border-radius: 3px;
}
.account-main-left {
    display: inline-block;
}
.account-main-left > ul > li {
    display: block;
    border-radius: 3px;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
}
.account-main-right {
    display: inline-block;
    font-size: 14px;
    min-height: 300px;
}
#account_pages_view .title-style-1 {
    font-size: 1.125rem;
    line-height: 1.1rem;
    padding: 0.875rem 1rem;
}
#account_pages_view .inner-title-navbar {
    font-size: 0.875rem;
}
#account_pages_view .inner-title-navbar * {
    vertical-align: middle;
}
#account_pages_view .inner-title-navbar span.navbar-link-hr {
    height: 100%;
    margin: 0 .75rem;
}
/** --- AccountCenter --- End */

/** --- UpdatePassword --- Start */
.password-problem-alert {
    font-weight: 700;
    text-align: center;
    font-size: .9375rem;
    color: #b01414;
    border: 1px solid #390404;
    border-radius: .1875rem;
    line-height: 1.4em;
    background: #180808;
}
/** --- UpdatePassword --- End */

/** ------- Deposit  ------- Start */
.css-deposit-category .deposit-category {
    min-width: 138px;
    min-height: 42px;
    list-style: none;
    border-radius: 3px;
}

.css-deposit-category .deposit-category-icon{
    width: 26px;
    height: 26px;
    margin:0 5px 0 8px;
    vertical-align: middle;
    overflow: hidden;
    display: inline-block;
    background-size: 100% auto;
    background-position: 0px -26px;
}
.css-deposit-category .deposit-category.active .deposit-category-icon,
.css-deposit-category .deposit-category:hover .deposit-category-icon {
    background-position: 0px 0px;
}

ul.css-deposit-payway li {
    list-style: none;
}

input.style-primary.css-conspicuous-red-style{
    color: #c40520;
    font-size: 20px;
}

input.css-actual-deposit-money {
    border: none;
    cursor: default;
    background-color: transparent;
    outline: none;
    height: 100%;
    width: 100%;
}
/****存款-歷史姓名彈窗****/
/****存款-歷史姓名彈窗****/
/****存款-歷史姓名彈窗****/
.history-name-modal .namemod {
    width: 100%;
    border-radius: 3px;
    box-sizing: border-box;
    display: none;
}
.history-name-modal .namemod .history-name-modal-title {
    font-size:14px;
}
.history-name-modal .namemod .list {
    height: 200px;
    overflow: auto;
    width: 100%;
    box-sizing: border-box;
    padding-left: 10px;
}
.history-name-modal .namemod .list ul {
    list-style: none;
}
.history-name-modal .namemod .list ul li {
    clear: both;
    padding: 8px 0;
    position: relative;
    font-size: 14px;
}

.history-name-modal .namemod .list ul li a.close {
    line-height: 1;
    font-size: 20px;
    vertical-align: middle;
    margin: 6px 1rem;
    display: inline-block
}
/****存款-歷史姓名彈窗****/
/** ------- Deposit  ------- End */


/** ------- NewMessage ------- Start */
#new_message .upload-photo-icon {
    position: absolute;
    left:20px;
    bottom: 20px;
    cursor: pointer;

    border: 1px solid #b89a6f;
    padding: 5px;
    color: #232323;
    background-color: #b89a6f;
    border-radius: 3px;
}
#new_message .upload-photo-icon:hover {
    color: #b89a6f;
    background-color: #232323;
}
/** ------- NewMessage ------- End */

/** ------- Action ------- Start */

/** ------- Action ------- End */

/** ------- Action ------- Start */

/** ------- Action ------- End */

/** ------- Action ------- Start */

/** ------- Action ------- End */

/* home login page */
.main_card_login.__color-main_card_login {
    border-color: #f2bc2c;
}
.login-title-text.__color-login-title-text {
    background: -webkit-linear-gradient(#de56c7, #270b42);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.btn_forgot-password.__color-btn_forgot-password {
    color: #65219e;
}
.btnregis.__color-btnregis {
    background-image: linear-gradient(-90deg,#f09b2d 0%,#f2c12c 100%);
    border-left: 1px solid #efcf67;
    border-right: 1px solid #efcf67;
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.22);
}
.btnregis.__color-btnregis:hover {
    background-image: linear-gradient(-90deg,#ffaf48 0%,#f5d983 100%);
}
.btnregis.__color-btnregis .text_in_btn {
    background: -webkit-linear-gradient(rgb(255, 255, 255), rgb(229, 229, 229));
    -webkit-background-clip: text;
    -webkit-text-fill-color: #341753;
}
.btnlogin.__color-btnlogin {
    background-image: linear-gradient(90deg, #591295 0%, #3a195b 100%);
    border-left: 1px solid #7934b4;
    border-right: 1px solid #7934b4;
    color: #fffefe;
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.22);
}
.btnlogin.__color-btnlogin:hover {
    background-image: linear-gradient(90deg,#7e3cb6 0%,#4d2576 100%);
}
/* guest header color */
.guest-header-navbar.__color-guest-header-navbar {
    background-image: linear-gradient(0deg,#4f217d 0%,#1e0b30 100%)
}
.guest-header-navbar.__color-guest-header-navbar.__color-guest-header-navbar-pink {
    background-image: linear-gradient(0deg, #2e0728 0%, #8e1c7a 100%);
}
.guest-header-navbar .navbar-nav .nav-link {
    color: #f0eadc;
}
.guest-header-navbar .navbar-nav .nav-link:hover {
    color: #ffffff;
}
/* 語系下拉選擇選單 */
.lang-dropdown.__color-lang-dropdown .dropdown-menu {
    background: #000;
    border: solid 1px #2b2b2b;
}
.lang-dropdown.__color-lang-dropdown {
    background-image: linear-gradient(0deg,
        #6f5931 0%,
        #a18f5e 100%);
    border-radius: 100px;
    border: solid 1px #857754;
}
.lang-dropdown.__color-lang-dropdown:hover {
    background-image:  linear-gradient(180deg,#97722b 0%,#a18f5e 100%);
}
.lang-dropdown.__color-lang-dropdown .dropdown-menu .dropdown-item {
    color: #fff;
}

.lang-dropdown.__color-lang-dropdown .dropdown-menu .dropdown-item:hover {
    color: #ebc76e;
}
/* 語系下拉選擇選單 END */

/* 遊戲館標題 */
.search .left-box .title.__color-title {
    background: -webkit-linear-gradient(90deg, #b6986f 0%, #f6e3c6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* 遊戲館標題 END */

/* 游戏搜寻 */
.search .right-box .search-input-group.__color-search-input-group input {
    background: #0e0e0e;
    border: #35332a 1px solid;
    color: #f6e3c6;
}
.search .right-box .search-input-group.__color-search-input-group input:focus,
.search .right-box .search-input-group.__color-search-input-group input:active{
    background: #26221b;
    border: #3d3b32 1px solid;
    outline: none;
}
/* 游戏搜寻 END */

/* footer color */
.footer.__color-footer {
    background-color: #141414;
}
.bottom-footer.__color-bottom-footer {
    font-size: 11px;
    color: #9a9999;
    background-image: linear-gradient(180deg,
        #1d1d1d 0%,
        #101010 100%)
}
/* right aside menu color */
.aside_fixed_menu.__color-aside_fixed_menu li > a {
    color: #181818;
    text-shadow: 1px 1px 0px 0px rgba(225, 225, 225, 0.45);
    background-image: linear-gradient(259deg,#84827e 0%,#e7e4df 100%);
    border: 1px solid #84827e;
    box-shadow: 0px 1px 0px 0px rgba(21, 44, 77, 0.5);
}
.aside_fixed_menu.__color-aside_fixed_menu li:hover a,
.aside_fixed_menu.__color-aside_fixed_menu li:active a,
.aside_fixed_menu.__color-aside_fixed_menu li.active a {
    background: #acaaa7;
    box-shadow: inset 0px 0px 13px 0px  rgba(96, 94, 92, 0.86);
}
/* offer page color */
.offer-category-btn.__color-offer-category-btn .offer-category-box {
    background-image: linear-gradient(180deg, #83376f 0%, #2b0725 100%);
    color: #fdf9f1;
}
.offer-category-btn.__color-offer-category-btn.active .offer-category-box,
.offer-category-btn.__color-offer-category-btn:hover .offer-category-box {
    background-image: linear-gradient(0deg,#838383 0%,#e7e7e7 100%);
    color: #000000;
}
.offer-category-slide.__color-offer-category-slide {
    border-bottom: 2px #dcd5c5 solid;
}
.offer-item-info.__color-offer-item-info {
    background-color: #361755;
    border-top: 1px solid #b869e3;
}
.offer-item-info.__color-offer-item-info .offer-item-msg {
    color: #fdf9f1;
}
.offer-item-info.__color-offer-item-info .offer-item-msg .offer-item-hr {
    background-color: #b869e3;
}
.offer-item-list .detail-header.__color-detail-header {
    background-color: #361755;
    color: #fdf9f1;
}
/* announce page color */
table.announce-table.__color-announce-table th {
    color: #f0eadc;
    border: 1px solid #361755;
    background-color: #0f0514;
}
table.announce-table.__color-announce-table tr:hover td {
    background-color: #2a162d;
}
table.announce-table.__color-announce-table td {
    color: #fdf9f1;
    border: 1px solid #361755;
    background-color: #180b1a;
}
table.announce-table.__color-announce-table td.announce-detail, table.announce-table.__color-announce-table tr:hover td.announce-detail {
    background-color: #270528;
}
/* top login header color */
.header-box.__color-header-box.login {
    background-image: url('../img/common/bg_header.jpg');
    border-bottom: 1px solid #80714c;
    background-color: #110c02;
    background-size: cover;
    background-position: center center;
}
.header-navbar.__color-header-navbar .nav-link {
    background-image: linear-gradient(0deg,#000000 0%,  #1e1e1e 100%);
    box-shadow: inset 0 0 5px 0 #282828;
    font-size: 14px;
    color: #c2ae87;
    border-radius: 100px;
}
.header-navbar.__color-header-navbar .nav-link.active,
.header-navbar.__color-header-navbar .nav-link:hover {
    background-image: linear-gradient(180deg,
        #443416 0%,
        #74643a 100%);
    box-shadow: inset 0 0 3px 0px #eab754;
}
.header-navbar.__color-header-navbar .nav-link.active span,
.header-navbar.__color-header-navbar .nav-link:hover span{
    font-size: 14px;
    color: #fff1c2;
}
.subnav-dropdown-lg.__color-subnav-dropdown-lg {
    background-color: rgba(0,0,0,0.9);
}
.subnav-dropdown-lg.__color-subnav-dropdown-lg:after {
    background-color: #edc76e;
}

/* page top account color */
.page-top .box-account.__color-box-account .account-info-box {
    background-color: #0e0e0e;
    border: 1px solid #6d5e43;
    box-shadow: inset 0 0 8px #805b15;
}
.page-top .box-account.__color-box-account .account-label,
.page-top .box-account.__color-box-account .account-label a {
    color: #FFF;
    font-size: 16px;
}
.page-top .box-account.__color-box-account .account-label a:hover {
    color: #808080;
}
.page-top .box-account.__color-box-account .balance-label {
    color: #666666;
}
.page-top .box-account.__color-box-account .balance-label #refresh_btn {
    color: #010101;
}
.page-top .box-account.__color-box-account .balance-label #refresh {
    color: #010101;
}
.page-top .box-account.__color-box-account .balance-label #refresh:hover {
    color: #010101;
}
.page-top .box-account.__color-box-account .account-link-box {
    background:#f2aa2c;
}
.page-top .box-account.__color-box-account .account-link-box .account-link-text a {
    color: #ffffff;
}
.page-top .box-account.__color-box-account .account-link-box .account-link-text a:hover {
    color: #744b04;
}
.page-top .box-account.__color-box-account .account-link-box .account-link-hr {
    border-left: 1px solid rgba(0, 0, 0, 0.2);
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}
/* banner */
.home-banner.__color-home-banner .banner-slide .owl-dots .owl-dot span {
    background-color: #ffffff;
    border: 1px solid #ffffff;
}
.home-banner.__color-home-banner .banner-slide .owl-dots .owl-dot:hover span,
.home-banner.__color-home-banner .banner-slide .owl-dots .owl-dot.active span {
    background-color: #6c36a7;
    border: 1px solid #6c36a7;
}
/* game list color */
#game_list_block .slot-game-list-btn.__color-slot-game-list-btn {
    background-image: linear-gradient(180deg,
        #e7d39d 0%,
        #b19560 100%);
}
#game_list_block .slot-game-list-btn.__color-slot-game-list-btn:hover {
    background-image: linear-gradient(0deg,
        #838383 0%,
        #e7e7e7 100%);
}
#slot_game_list.__color-slot_game_list .game-box .pic {
    border: 1px solid #272727;
    box-shadow: 3px 3px 5px rgb(0 0 0 / 40%);
}
#slot_game_list.__color-slot_game_list .game-box:hover .pic,
#slot_game_list.__color-slot_game_list .game-box:active .pic,
#slot_game_list.__color-slot_game_list .game-box:focus .pic,
#slot_game_list.__color-slot_game_list .game-box.active .pic {
    border: 2px solid #76532b;
}
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button {
    background-image: linear-gradient(180deg,
        #ceb680 0%,
        #8b7548 100%);
    background-color: #000;
    color: #ffffff;
}
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button.btn-forfun {

}
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button.btn-delete-favorite {
    background-image: linear-gradient(90deg,
        #dc3837 0%,
        #8c1205 100%)
}
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button:hover,
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button:active,
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button:focus,
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button.active {
    border: 1px solid #ebc76e;
    background: #000;
    color: #ebc76e;
}
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button.btn-delete-favorite:hover,
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button.btn-delete-favorite:active,
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button.btn-delete-favorite:focus,
#slot_game_list.__color-slot_game_list .game-box .open-game-options-btn-box button.btn-delete-favorite.active {
    border: 1px solid #d73634;
    background: #000;
    color: #d83634;
}
#slot_game_list.__color-slot_game_list .game-box .title {
    color: #f0eadc;
}
#game_list_page.__color-game_list_page a:hover,
#game_list_page.__color-game_list_page a.jp-current {
    background: #ebc76e;
}
/* account center color */
.account-top.__color-account-top > ul > li {
    color: #ffffff;
    background-image: linear-gradient(180deg,
        #83376f 0%,
        #2b0725 100%);
    box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.3);
}
.account-top.__color-account-top > ul > li.router-link-active,
.account-top.__color-account-top > ul > li:hover {
    color: #1a1a1a;
    background-image: linear-gradient(0deg,
        #838383 0%,
        #e7e7e7 100%);
    box-shadow: inset 0px 1px 0px 0px
        rgba(21, 44, 77, 0.5);

}
.account-main.__color-account-main {
    border: 1px solid #361755;
}
.account-main.__color-account-main .account-main-left {
    background-color: #0b0b0b;
    border-right: 1px solid #000000;
}
.account-main.__color-account-main .account-main-left > ul > li {
    color: #afafaf;
    background-color: #1b1b1b;
}
.account-main.__color-account-main .account-main-left > ul > li:hover,
.account-main.__color-account-main .account-main-left > ul > li.active {
    color: #ffffff;
    background-color: #361755;
}
.account-main.__color-account-main .account-main-right {
    background-color: #111111;
    border-left: 1px solid #222222;
}
#account_pages_view.__color-account_pages_view .title-style-1 {
    color: #dcd5c5;
    border-bottom: 2px solid #dcd5c5;
    background-color: #1C1C1C;
}
#account_pages_view.__color-account_pages_view .inner-title-navbar a {
    color: #ffffff;
}
#account_pages_view.__color-account_pages_view .inner-title-navbar a:hover {
    opacity: 0.5;
}
#account_pages_view.__color-account_pages_view .inner-title-navbar span.navbar-link-hr {
    border: 1px solid #ffffff;
}
/* deposit page color */
.css-deposit-category.__color-css-deposit-category .deposit-category {
    background-image: linear-gradient(0deg,
        #1c0a2d 0%,
        #4f217d 100%);
    border: solid 1px #361755;
    color: #f0eadc;
}
.css-deposit-category.__color-css-deposit-category .deposit-category:hover,
.css-deposit-category.__color-css-deposit-category .deposit-category.active {
    background-image: linear-gradient(0deg, #5f523c 0%, #e1dbd0 50%, #e2dcd1 58%, #e2ddd2 68%, #a4967f 100%);
    border: solid 1px #d7d6d4;
    color: #1a1a1a;
}
ul.css-deposit-payway.__color-css-deposit-payway {
    background-color: #110417;
}
ul.css-deposit-payway.__color-css-deposit-payway li {
    color: #ffffff;
}
ul.css-deposit-payway.__color-css-deposit-payway li:hover,
ul.css-deposit-payway.__color-css-deposit-payway li.active {
    color: #f0eadc;
    border-bottom: 2px solid #f0eadc;
}
.deposit-box .memo2-tip.__color-memo2-tip {
    background-color: #12181f;
    color: #bdbdbd;
    border: 1px solid transparent;
}
input.css-actual-deposit-money.__color-css-actual-deposit-money {
    color: #f0eadc;
}
.history-name-modal.__color-history-name-modal .namemod {
    border: 1px solid #361755;
    background-color: #2a162d;
}
.history-name-modal.__color-history-name-modal .namemod .history-name-modal-title {
    border-bottom: 1px solid #361755;
    background-color: #120518;
}
.history-name-modal.__color-history-name-modal .namemod .list ul li {
    color: #fff;
}
/* record table color */
.record-table.__color-record-table .record-button-disabled,
.record-table.__color-record-table .record-button-disabled:link,
.record-table.__color-record-table .record-button-disabled:visited,
.record-table.__color-record-table .record-button-disabled:hover,
.record-table.__color-record-table .record-button-disabled:active {
    color: #3d3d3d !important;
}

.record-table.__color-record-table .table-detail-cover-box {
    background-color: #18140d;
}

.read-status.__color-read-status.is-read {
    color: rgba(255, 255, 255, 0.4);
}
.read-status.__color-read-status.un-read {
    color: #f0eadc;
}


/*---------- 重要信彈窗 - Start ----------*/
/*---------- 重要信彈窗 - Start ----------*/
#important_message_modal.__color-important_message_modal .important-message-modal-header {
    color: #d8cab3;
    border-bottom: 1px solid #000000;
}
#important_message_modal.__color-important_message_modal .message-content {
    color: #dcd6e1;
}
#important_message_modal.__color-important_message_modal .important-message-modal-content {
    border: 1px solid #857754;
    box-shadow: 2px 0px 8px 0px rgba(1, 1, 0, 0.5);
    background-image: linear-gradient(180deg,
        #1a1a1a 0%,
        #101010 100%);
}
#important_message_modal.__color-important_message_modal .read-more-btn {
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.43);
    color: #8f949a;
    border: solid 1px #312839;
    background-image: linear-gradient(0deg,
        #0e0614 0%,
        #37293e 100%);
}

#important_message_modal.__color-important_message_modal .read-more-btn:hover,
#important_message_modal.__color-important_message_modal .read-more-btn:active,
#important_message_modal.__color-important_message_modal .read-more-btn:focus {
    color: #bdc0c4;
    border: solid 1px #312839;
    background-image: linear-gradient(0deg,
        #1f1925 0%,
        #2d2831 100%);
}

#important_message_modal.__color-important_message_modal  .read-btn,
#important_message_modal.__color-important_message_modal  .customer-service-btn {
    color: #1a1a1a;
    border: solid 1px #e7d39f;
    background-image: linear-gradient(180deg,
        #e7d39d 0%,
        #b19560 100%);
}
#important_message_modal.__color-important_message_modal .read-btn:hover,
#important_message_modal.__color-important_message_modal .read-btn:active,
#important_message_modal.__color-important_message_modal .read-btn:focus,
#important_message_modal.__color-important_message_modal .customer-service-btn:hover,
#important_message_modal.__color-important_message_modal .customer-service-btn:active,
#important_message_modal.__color-important_message_modal .customer-service-btn:focus {
    color: #1a1a1a;
    border: solid 1px #e7d39f;
    background-image: linear-gradient(180deg,
        #ceb680 0%,
        #77643f 100%);
}
/*---------- 重要信彈窗 - End ----------*/
/*---------- 重要信彈窗 - End ----------*/


/*---------- 首頁免費試玩遊戲 - Start ----------*/
/*---------- 首頁免費試玩遊戲 - Start ----------*/
.home-free-game.__color-home-free-game .pic .game-img{
    border: 2px solid #d8a32e;
}
.home-free-game.__color-home-free-game .owl-theme .owl-dots .owl-dot.active span,
.home-free-game.__color-home-free-game .owl-theme .owl-dots .owl-dot:hover span{
    background: #ffcc00;
    border: 1px solid #ffcc00;
}
/*---------- 首頁免費試玩遊戲 - End ----------*/
/*---------- 首頁免費試玩遊戲 - End ----------*/


/*---------- HomePopup - Start ----------*/
/*---------- HomePopup - Start ----------*/
#home_popup_modal .home-popup-title {
    width: 35%;
}
#home_popup_modal .home-popup-container {
    max-width: 630px;
    border-radius: 10px;
    margin: auto;
    padding: 26px 38px 22px;
}
#home_popup_modal .home-popup-content {
    max-height: 450px;
    border-radius: 3px;
    overflow-y: auto;
    padding: 13px 10px 0 13px;
}
#home_popup_modal .home-popup-link {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
    margin-bottom: 8px;
}
#home_popup_modal .home-popup-link:last-of-type {
    margin-bottom: 0;
}
#home_popup_modal .home-popup-close {
    width: 312px;
    height: 35px;
    font-size: 16px;
    text-align: center;
    border: none;
    border-radius: 5px;
    margin-top: 21px;
}

#home_popup_modal.__color-home_popup_modal .home-popup-container {
    border: 2px solid #5c5448;
    background-image: linear-gradient(0deg, #020101 0%, #1e1613 100%);
}
#home_popup_modal.__color-home_popup_modal .home-popup-content {
    background-color: #090909;
}
#home_popup_modal.__color-home_popup_modal .home-popup-content::-webkit-scrollbar {
    width: 3px;
    background-color: #090909;
}
#home_popup_modal.__color-home_popup_modal .home-popup-content::-webkit-scrollbar-thumb {
    border-radius: 1px;
    background-color: #b09775;
}
#home_popup_modal.__color-home_popup_modal .home-popup-link {
    border: 2px solid #090909;
}
#home_popup_modal.__color-home_popup_modal .home-popup-link:hover {
    border: 2px solid #b09775;
}
#home_popup_modal.__color-home_popup_modal .home-popup-close {
    color: #000;
    background-image: linear-gradient(0deg, #b59a65 0%, #e5d09b 100%);
}
#home_popup_modal.__color-home_popup_modal .home-popup-close:hover {
    background-image: linear-gradient(0deg, #c3a770 0%, #fdebbe 100%);
}
/*---------- HomePopup - End ----------*/
/*---------- HomePopup - End ----------*/


/*---------- ad slider - Start ----------*/
/*---------- ad slider - Start ----------*/
.ad-slider {
    overflow: hidden;
    position: relative;
    padding: 15px 0;
    width: 106%;
    left: -3%;
}
.ad-slider:before,
.ad-slider:after {
    content: '';
    display: block;
    position: absolute;
    width: 26px;
    height: 100%;
    top: 0;
    background-size: 100% 100%;
    background-position: center center;
    z-index: 2;
}
.ad-slider:before {
    left: 0;
    background-image: url('../img/common/gamepage/ad-slider/img_ad-slider-shadow-l.png');
}
.ad-slider:after {
    right: 0;
    background-image: url('../img/common/gamepage/ad-slider/img_ad-slider-shadow-r.png');
}
.ad-slider img {
    width: 100%;
    border: 2px solid #e4d09a;
    border-radius: 5px;
}
.ad-slider .swiper-slide {
    width: 200px;
}
.ad-slider .swiper-slide:hover img {
    border: 2px solid #fff;
}
/* 讓swiper無縫輪播 */
.ad-slider .swiper-wrapper {
    -webkit-transition-timing-function: linear!important;
    -moz-transition-timing-function: linear!important;
    -ms-transition-timing-function: linear!important;
    -o-transition-timing-function: linear!important;
    transition-timing-function: linear!important;
}
/*---------- ad slider - End ----------*/
/*---------- ad slider - End ----------*/


/*---------- 優惠頁 - Start ----------*/
/*---------- 優惠頁 - Start ----------*/
.activityList {
    padding: 0 30px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
}
.activityList__item a {
    color: #f5e1ac
}
.activityList__item {
    width: 49%;
    background-color: #191919;
    border: solid 1px #232323;
    margin-bottom: 17px;
    border-radius: 2px 2px 10px 10px;
    box-shadow: 0px 4px 5px 1px #000000;
    list-style: none;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
}
.activityList__item:hover {
    border: solid 1px #80714c;
}
.activityList__item.special-type {
    position: relative;
    background-image: linear-gradient(0deg, #131313 0%, #353535 100%);
    box-shadow: 0px 4px 5px 1px #000000;
    border: solid 1px #383838;
    border-bottom: none;
}

.activityList__item__pic img {
    width: 100%;
    padding: 1px;
}
.activityList__item__con {
    font-size: 0.75rem;
    padding: 25px 20px;
    position: relative;
}
.activityList__item__con table tr td:nth-child(1) {
    word-break: keep-all;
}
.activityList__item__bottom {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: end;
    z-index: 0;
    background-color: rgba(0,0,0,0.8);
    transition: all 0.3s ease;
    opacity: 0;
}
.activityList__item__bottom:before {
    transition: all 0.3s ease;
}
.activityList__item__bottom:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-size: 100% 80px;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-image: url('../img/common/activity/img_bgbottom_web.png?');
    transform: translateY(100%);
}
.activityList__item.special-type:hover .activityList__item__bottom {
    opacity: 1;
}
.activityList__item.special-type:hover .activityList__item__bottom:before {
    transform: translateY(0);
}
.activityList__item__bottom__btn{
    width: 180px;
    height: 46px;
    margin-bottom: 9px;
    position: relative;
    z-index: 2;
}

.activityList__item__promotag{
    position: absolute;
    right: 10px;
    top: -10px;
    width: 59px;
    height: 70px;
}

.activity-empty{
    padding: 63px 0px;
}
.activity-empty .activity-empty-icon{
    background: url('../img/common/activity/icon_noactivity.png?');
    background-repeat: no-repeat;
    background-size: cover;
    width:120px;
    height:120px;
    margin: 0 auto 17px auto;
}
.activity-empty .activity-empty-msg{
    font-size:16px;
    color: rgb(160 151 131 / 73%);
    text-align: center;
}
/*---------- 優惠頁 - End ----------*/
/*---------- 優惠頁 - End ----------*/