body, html, .container_main {
    height: 100%;
    background-color: #fff;
}

body {
    overflow: hidden;
    overscroll-behavior-y: contain;
}

.bg_header {
    background: #fff;
    color: #000;
}

.icon_inforMoney {
    color: #535867;
}

    .icon_inforMoney:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/icon_arrowGray.svg);
    }

.container_main {
    padding-right: 2%;
    padding-left: 2%;
    padding-top: 40px;
    display: flex;
    flex-wrap: wrap;
    position: fixed;
}

/*swiper2*/
.swiper2 {
    height: 38.5vw;
}

    .swiper2 img {
        width: 100%;
    }

    .swiper2 .swiper-slide:before,
    .swiper2 .swiper-slide:after {
        content: '';
        position: absolute;
        width: 100%;
        height: 30%;
        left: 0;
        right: 0;
        pointer-events: none;
    }

    .swiper2 .swiper-slide:before {
        top: -1px;
        background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 50%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 50%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
    }

    .swiper2 .swiper-slide:after {
        bottom: -1px;
        background: -moz-linear-gradient(top, rgba(255,255,255,0) 50%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(255,255,255,0) 50%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(255,255,255,0) 50%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
    }

.swiper-pagination-bullet {
    width: 4px;
    height: 4px;
    opacity: 1;
    background-color: #fff;
    margin: 0 3.5px !important;
    box-shadow: 0 0 3px rgba(0,0,0,.6);
}

.swiper-pagination-bullet-active {
    width: 6px;
    height: 6px;
    outline: none;
    margin: 0 2.5px !important;
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (min-width: 768px) {
    .swiper-pagination-bullet {
        width: 8px;
        height: 8px;
        margin: 0 6px !important;
    }

    .swiper-pagination-bullet-active {
        width: 10px;
        height: 10px;
        margin: 0 5px !important;
    }

    .swiper-horizontal > .swiper-pagination-bullets,
    .swiper-pagination-bullets.swiper-pagination-horizontal,
    .swiper-pagination-custom, .swiper-pagination-fraction {
        bottom: 5px;
    }
}

/*遊戲列表*/
.GameList {
    display: flex;
    width: 100%;
    height: calc(100% - 38.5vw);
    box-sizing: border-box;
}

[class*="btn_GL"] {
    margin-bottom: 6px;
    box-sizing: border-box;
}

    [class*="btn_GL"]:last-child,
    .GameList_R > [class*="btn_GL"]:not(.w100):nth-last-child(2) {
        margin-bottom: 12px;
    }

/*遊戲列表(左)*/
.GameList_L {
    display: flex;
    flex-wrap: wrap;
    overflow: auto;
    padding-right: 2%;
    padding-top: 6px;
    flex: 18%;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

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

    .GameList_L [class*="btn_GL"] {
        width: 100%;
        border-radius: 5px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        outline: none;
        padding: 1px;
        background-color: #e7f1fb;
    }

        .GameList_L [class*="btn_GL"].on {
            border: 1px solid #3281d0;
            padding: 0;
        }

    .GameList_L h2 {
        margin: 0.35vh 2px;
        font-size: 0.7em;
        text-align: center;
        color: #535867;
        line-height: 1em;
        white-space: nowrap;
    }

    .GameList_L [class*="ic_GL"] {
        min-width: 18px;
        min-height: 18px;
        width: 3vh;
        height: 3vh;
        margin-top: 0.2vh;
    }

.btn_GLhot h2 {
    font-size: 0.8em;
}

.ic_GLhot {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_hot.svg) no-repeat center;
    background-size: 100% auto !important;
}

.ic_GLsport {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_sport.svg) no-repeat center;
    background-size: 75% auto;
}

.ic_GLlive {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_live.svg) no-repeat center;
    background-size: 75% auto;
}

.ic_GLloto {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_loto.svg) no-repeat center;
    background-size: 75% auto;
}

.ic_GLslot {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_slot.svg) no-repeat center;
    background-size: 75% auto;
}

.ic_GLfish {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_fish.svg) no-repeat center;
    background-size: 80% auto;
}

.ic_GLchess {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_chess.svg) no-repeat center;
    background-size: 75% auto;
}

.ic_GLesport {
    background: url(/Areas/Mobile/Content/Images/th-th/icon_esport.svg) no-repeat center;
    background-size: 85% auto;
}

/*遊戲列表(左)-動畫*/
[class*="btn_GL"].on .ic_GLhot:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_hot_on.svg") no-repeat center top;
    background-size: 100% auto !important;
}

[class*="btn_GL"].on .ic_GLsport:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_sport_on.png") no-repeat center top;
    background-size: 100% auto !important;
}

[class*="btn_GL"].on .ic_GLlive:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_live_on.svg") no-repeat center top;
    background-size: 100% auto !important;
}

[class*="btn_GL"].on .ic_GLloto:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_loto_on.png") no-repeat center top;
    background-size: 100% auto !important;
}

[class*="btn_GL"].on .ic_GLslot:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_slot_on.png") no-repeat center top;
    background-size: 100% auto !important;
    width: 5.6vh !important;
    left: calc(50% - 2.8vh) !important;
}

[class*="btn_GL"].on .ic_GLfish:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_fish_on.png") no-repeat center top;
    background-size: 100% auto !important;
}

[class*="btn_GL"].on .ic_GLchess:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_chess_on.png") no-repeat center top;
    background-size: 100% auto !important;
}

[class*="btn_GL"].on .ic_GLesport:before {
    background: url("/Areas/Mobile/Content/Images/th-th/icon_esport_on.png") no-repeat center top;
    background-size: 100% auto !important;
}

.GameList_L .on [class*="ic_GL"] {
    position: relative;
    background: none;
}

[class*="btn_GL"].on [class*="ic_GL"]:before {
    display: block;
    width: 4vh;
    height: 4vh;
    content: " ";
    margin: auto;
    position: absolute;
    left: calc(50% - 2vh);
    z-index: 2;
    animation: aniGame 0.8s ease-out infinite;
    -webkit-animation: aniGame 0.8s ease-out infinite;
}

@keyframes aniGame {
    0% {
        bottom: -0.3vh;
    }

    50% {
        bottom: .3vh;
    }

    100% {
        bottom: -0.3vh;
    }
}

@-webkit-keyframes aniGame {
    0% {
        bottom: -0.3vh;
    }

    50% {
        bottom: .3vh;
    }

    100% {
        bottom: -0.3vh;
    }
}

[class*="btn_GL"].on [class*="ic_GL"]:after {
    background: url("/Areas/Mobile/Content/Images/th-th/ic_GLshadow.png") no-repeat center;
    background-size: 100% auto !important;
    display: block;
    width: 4vh;
    height: 4px;
    content: " ";
    margin: auto;
    opacity: .8;
    position: absolute;
    left: calc(50% - 2vh);
    bottom: -0.3vh;
    z-index: 1;
    animation: aniShadow 0.8s ease-out infinite;
    -webkit-animation: aniShadow 0.8s ease-out infinite;
}

@keyframes aniShadow {
    0% {
        width: 3.6vh;
        left: calc(50% - 1.8vh);
    }

    50% {
        width: 1.4vh;
        left: calc(50% - .7vh);
        opacity: .5;
    }

    100% {
        width: 3.6vh;
        left: calc(50% - 1.8vh);
    }
}

@-webkit-keyframes aniShadow {
    0% {
        width: 3.6vh;
        left: calc(50% - 1.8vh);
    }

    50% {
        width: 1.4vh;
        left: calc(50% - .7vh);
        opacity: .5;
    }

    100% {
        width: 3.6vh;
        left: calc(50% - 1.8vh);
    }
}

@media (min-width: 375px) and (min-height: 800px) {
    .btn_AD ~ .container_main [class*="btn_GL"].on [class*="ic_GL"]:before {
        height: 4vh;
    }

    [class*="btn_GL"].on [class*="ic_GL"]:before {
        height: 4.5vh;
    }
}

@media (min-width: 600px) {
    .btn_AD ~ .container_main [class*="btn_GL"].on [class*="ic_GL"]:before {
        width: 3.4vh;
        height: 3.4vh;
        left: calc(50% - 1.7vh);
    }

    [class*="btn_GL"].on [class*="ic_GL"]:before {
        width: 3.8vh;
        height: 3.8vh;
        left: calc(50% - 1.9vh);
    }
}

@media (min-width: 768px) {
    .btn_AD ~ .container_main [class*="btn_GL"].on [class*="ic_GL"]:before {
        height: 4vh;
    }

    [class*="btn_GL"].on [class*="ic_GL"]:before {
        width: 4vh;
        height: 4vh;
        left: calc(50% - 2vh);
    }
}

@media (orientation: landscape) {
    [class*="btn_GL"].on [class*="ic_GL"]:before {
        width: 22px;
        min-height: 24px;
        left: calc(50% - 11px);
    }

    [class*="btn_GL"].on .ic_GLslot:before {
        width: 32px !important;
        left: calc(50% - 16px) !important;
    }
}

@media (orientation: landscape) and (min-height: 400px) {
    [class*="btn_GL"].on [class*="ic_GL"]:before {
        width: 5.6vh;
        height: 5.6vh;
        left: calc(50% - 2.8vh);
    }
}

@media (orientation: landscape) and (min-height: 500px) {
    [class*="btn_GL"].on .ic_GLslot:before {
        width: 7vh !important;
        left: calc(50% - 3.5vh) !important;
    }
}

@media (orientation: landscape) and (min-width: 800px) and (min-height: 700px) {
    .btn_AD ~ .container_main [class*="btn_GL"].on [class*="ic_GL"]:before {
        height: 5vh;
    }

    [class*="btn_GL"].on [class*="ic_GL"]:before {
        width: 5vh;
        left: calc(50% - 2.5vh);
    }
}

/*遊戲列表(右)*/
.GameList_RBox {
    flex: 82%;
    margin-right: -2%;
    padding-right: 2%;
    padding-top: 6px;
}

.GameList_R {
    opacity: 0;
    display: flex;
    flex-wrap: wrap;
    overflow: auto;
    justify-content: space-between;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

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

    .GameList_R.on {
        display: flex;
    }

    .GameList_R [class*="btn_GL"] {
        border-radius: 10px;
        position: relative;
        min-height: 75px;
    }

        .GameList_R [class*="btn_GL"]:not([class*="hot"]):not([class*="ACT"]) {
            background: #b2d2ed; /* Old browsers */
            background: -moz-linear-gradient(top, #b2d2ed 0%, #d1e6f6 100%); /* FF3.6-15 */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2d2ed), color-stop(100%,#d1e6f6)); /* Chrome4-9,Safari4-5 */
            background: -webkit-linear-gradient(top, #b2d2ed 0%,#d1e6f6 100%); /* Chrome10-25,Safari5.1-6 */
            background: -o-linear-gradient(top, #b2d2ed 0%,#d1e6f6 100%); /* Opera 11.10-11.50 */
            background: -ms-linear-gradient(top, #b2d2ed 0%,#d1e6f6 100%); /* IE10 preview */
            background: linear-gradient(to bottom, #b2d2ed 0%,#d1e6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2d2ed', endColorstr='#d1e6f6',GradientType=0 ); /* IE6-9 */
        }

        .GameList_R [class*="btn_GL"]:not(.maintain):active {
            background: #ebf5fe;
        }

        .GameList_R [class*="btn_GL"]:not(.w100) {
            width: calc(50% - 3px);
        }

            .GameList_R [class*="btn_GL"]:not(.w100) h1 span {
                line-height: 1em;
            }

    .GameList_R:not([class*="wholeT"]) .img_GL:after {
        width: 22.5vh;
        height: 15.5vh;
        min-width: 128px;
        min-height: 89px;
    }

    .GameList_R .img_GL {
        position: absolute;
        overflow: hidden;
        width: 100%;
        height: 100%;
        right: 0;
        bottom: 0;
        border-radius: 10px;
    }

        .GameList_R .img_GL:after {
            content: '';
            background-position: 1em -1px;
            background-repeat: no-repeat;
            position: absolute;
            bottom: 0;
            right: 0;
            margin: auto;
            z-index: 1;
        }

    .GameList_R [class*="btn_GLhot"] {
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: calc(36% - 8px);
        min-height: 111px;
    }

        .GameList_R [class*="btn_GLhot"] .img_GL:after {
            background-image: url(/Areas/Mobile/Content/Images/th-th/img_hotOT.png);
            background-size: 100% auto;
        }

    .GameList_R [class*="btn_GLloto"] .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_lotoOT.png);
        background-size: 100% auto;
    }

    .GameList_R [class*="btn_GLfish"] .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_fishOT.png);
        background-size: 100% auto;
    }

    .GameList_R [class*="btn_GLchess"] .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_chessOT.png);
        background-size: 100% auto;
    }

    .GameList_R [class*="btn_GLesport"] .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_esportsOT.png);
        background-size: 100% auto;
    }

    .GameList_R [class*="btn_GLlive"] .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_liveOT.png);
        background-size: 100% auto;
    }

    .GameList_R [class*="btn_GLsport"] .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_sportOT.png);
        background-size: 100% auto;
    }

    .GameList_R [class*="btn_GLslot"] .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_slotOT.png);
        background-size: 100% auto;
    }

    .GameList_R .w100 {
        width: 100% !important;
        display: flex;
        align-items: center;
    }

        .GameList_R .w100 .img_GL:after {
            background-position-x: right;
        }

    .GameList_R:not([class*="wholeT"]) .w100 .img_GL {
        right: 10vw;
    }

    .GameList_R[class*="wholeT"] .img_GL:after {
        width: 55.7vw;
        height: 100%;
        max-height: 54vw;
    }

    .GameList_R [class*="btn_GL"]:not([class*="btn_GLhot"]) .t_GL {
        width: 55px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        margin-left: 6px;
        margin-right: 6px;
    }

    .GameList_R .w100 .t_GL {
        width: 47% !important;
        margin: 10px 0 0 0 !important;
    }

        .GameList_R .w100 .t_GL img {
            margin-top: -6px;
        }

    .GameList_R .w100 h1 {
        font-size: 1em;
    }

        .GameList_R .w100 h1 span {
            margin-bottom: -5px;
        }

.btn_AD ~ .container_main .GameList_R [class*="btn_GLhot"] .img_GL:after {
    width: 21vh;
    height: 14vh;
}

/*only for IOS*/
@supports (-webkit-overflow-scrolling: touch) {
    .GameList_R [class*="btn_GLhot"] .img_GL:after {
        width: 21vh;
        height: 14vh;
    }

    .btn_AD ~ .container_main .GameList_R [class*="btn_GLhot"] .img_GL:after {
        width: 19vh;
        height: 12vh;
    }

    @media (min-aspect-ratio: 495/1000) {
        .GameList_R:not([class*="wholeT"]) [class*="btn_GL"]:not([class*="hot"]) .img_GL:after {
            width: 21vh;
            height: 14vh;
        }
    }
}

/*swiper1*/
.swiper1 .swiper-wrapper {
    height: auto !important;
}

.swiper-slide-active {
    opacity: 1;
}

.swiper-pagination-vertical.swiper-pagination-bullets {
    transform: initial;
}

.t_GL {
    margin: 10px 10px 0;
    position: relative;
    z-index: 2;
}

    .t_GL h1 {
        font-size: 0.85em;
        color: #535867;
        line-height: 1em;
        margin: 0;
    }

    .t_GL img {
        height: 47px;
        width: auto;
        margin-top: -8px;
        display: block;
    }

.btn_GLliveKU:not(:active):after,
.btn_GLlotoKU:not(:active):after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 10px;
}

.btn_GLlotoKU:not(:active):after {
    background-image: url(/Areas/Mobile/Content/Images/th-th/img_lotoKUBG.png);
    background-size: 100% 100%;
}

.btn_GLlotoKU .img_GL:after {
    background-position-x: 1em !important;
}

.btn_GLliveKU:not(:active):after {
    background-image: url(/Areas/Mobile/Content/Images/th-th/img_liveKUBG.png);
    background-size: cover;
}

.btn_GLliveKU.w100 .img_GL {
    right: 0 !important;
}

/*五列的liveKU不切眼睛(以下)*/
@media (max-width: 349px) and (min-aspect-ratio: 320/795) {
    .btn_GLliveKU .img_GL:after {
        background-position-y: 0.2em !important;
    }

    .btn_AD ~ .container_main .btn_GLliveKU .img_GL:after {
        background-position-y: 0.5em !important;
    }
}

@media (min-width: 350px) and (max-width: 374px) and (min-aspect-ratio: 360/825) {
    .btn_GLliveKU .img_GL:after,
    .btn_AD ~ .container_main .btn_GLliveKU .img_GL:after {
        background-position-y: 0.8em !important;
    }
}

@media (min-width: 375px) and (max-width: 399px) and (min-aspect-ratio: 360/825) {
    .btn_GLliveKU .img_GL:after,
    .btn_AD ~ .container_main .btn_GLliveKU .img_GL:after {
        background-position-y: 1em !important;
    }

    /*only for IOS*/
    @supports (-webkit-overflow-scrolling: touch) {
        .btn_GLliveKU .img_GL:after,
        .btn_AD ~ .container_main .btn_GLliveKU .img_GL:after {
            background-position-y: 0.55em !important;
        }
    }
}

@media (min-width: 400px) and (max-width: 529px) and (min-aspect-ratio: 414/770) {
    .btn_GLliveKU .img_GL:after {
        background-position-y: 0.8em !important;
    }
}

@media (min-width: 400px) and (max-width: 529px) and (min-aspect-ratio: 414/900) {
    .btn_AD ~ .container_main .btn_GLliveKU .img_GL:after {
        background-position-y: 0.8em !important;
    }
}

@media (min-width: 530px) and (max-width: 767px) and (min-aspect-ratio: 534/825) {
    .btn_GLliveKU .img_GL:after {
        background-position-y: 0.6em !important;
    }
}

@media (min-width: 530px) and (max-width: 767px) and (min-aspect-ratio: 534/880) {
    .btn_AD ~ .container_main .btn_GLliveKU .img_GL:after {
        background-position-y: 0.8em !important;
    }
}

@media (min-width: 768px) and (min-aspect-ratio: 768/1160) {
    .btn_GLliveKU .img_GL:after {
        background-position-y: 1em !important;
    }
}

@media (min-width: 768px) and (min-aspect-ratio: 768/1330) {
    .btn_AD ~ .container_main .btn_GLliveKU .img_GL:after {
        background-position-y: 1.2em !important;
    }
}
/*五列的liveKU不切眼睛(以上)*/

.logo_CAO {
    display: flex;
    width: calc(40px + 0.5vw);
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

    .btn_GLhotSlot img,
    .btn_GLhotLoto img,
    .btn_GLhotLive img,
    .logo_CAO img {
        height: 40px;
    }

        .logo_CAO img:nth-last-child(3) {
            margin-left: auto;
            margin-right: auto;
        }

        .logo_CAO img + img {
            width: auto;
            height: 25px;
            margin-top: -2vw;
        }

.btn_GLsportKU:not(.w100) .logo_CAO {
    -webkit-transform: scale(0.8,0.8) translateY(-10%);
    transform: scale(0.8,0.8) translateY(-10%);
}

.btn_GLsportKU.w100 .logo_CAO {
    flex-wrap: nowrap;
    width: auto !important;
    max-width: initial;
}

    .btn_GLsportKU.w100 .logo_CAO img + img {
        margin-left: 1.5vw;
    }

.btn_GLhotSport {
    background-image: url(/Areas/Mobile/Content/Images/th-th/img_sportHotBG.png);
    background-size: cover;
}

    .btn_GLhotSlot img,
    .btn_GLhotLoto img,
    .btn_GLhotLive img,
    .btn_GLhotSport img {
        margin-top: -6px;
    }

.btn_GLhotLive {
    background-image: url(/Areas/Mobile/Content/Images/th-th/img_liveHotBG.png);
    background-size: cover;
}

    .btn_GLhotLive .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_hotLive.png) !important;
    }

    .btn_GLhotLoto .img_GL:after,
    .btn_GLhotLive .img_GL:after {
        max-height: initial !important;
        height: 100% !important;
        background-position-y: bottom !important;
    }

.btn_GLhotLoto {
    background-image: url(/Areas/Mobile/Content/Images/th-th/img_lotoHotBG.png);
    background-size: cover;
}

    .btn_GLhotLoto .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_hotLoto.png) !important;
    }

.btn_GLhotSlot {
    background-image: url(/Areas/Mobile/Content/Images/th-th/img_slotHotBG.png);
    background-size: cover;
}

    .btn_GLhotSlot .img_GL:after {
        bottom: 10%;
    }

.boxGL {
    display: flex;
    flex-flow: column;
    width: calc(50% - 3px);
    height: calc(28% - 10px) !important;
    min-height: 80px;
    margin-bottom: 12px;
}

    .boxGL [class*="btn_GL"] {
        width: 100% !important;
        height: calc(50% - 3px) !important;
        min-height: auto !important;
        background: #daddfe;
        background: -moz-linear-gradient(-45deg, #e3ebff 0%, #daddfe 50%, #ccbef7 100%);
        background: -webkit-linear-gradient(-45deg, #e3ebff 0%,#daddfe 50%,#ccbef7 100%);
        background: linear-gradient(135deg, #e3ebff 0%,#daddfe 50%,#ccbef7 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e3ebff', endColorstr='#ccbef7',GradientType=1 );
    }

        .boxGL [class*="btn_GL"]:not(.maintain):active {
            background: #e3ebff !important;
        }

        .boxGL [class*="btn_GL"]:last-child {
            margin-bottom: 0 !important;
        }

    .boxGL h1 {
        font-size: 0.8em !important;
        display: flex !important;
        flex: 1;
        white-space: nowrap;
        text-align: center;
        justify-content: center;
        padding-top: 1px;
    }

    .boxGL .t_GL {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0 !important;
        padding-right: 1.9vw;
        box-sizing: border-box;
    }

    .boxGL img {
        max-height: 80% !important;
        height: 8.7vw !important;
        margin: 0;
    }

.btn_GLhotCAO,
.btn_GLhotStudio {
}

    .btn_GLhotStudio h1 {
        flex-flow: column;
        justify-content: flex-start;
        height: 70%;
        overflow: hidden;
    }

    .btn_GLhotStudio .swiper-slide {
        position: relative;
        height: 50%;
        line-height: 1em;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .btn_GLhotStudio .swiper-slide:after {
            content: '';
            position: absolute;
            background-color: #a89cdf;
            height: 1px;
            width: 17vw;
            max-width: 70px;
            display: flex;
            margin: auto;
            bottom: -2px;
            left: 0;
            right: 0;
        }

    .btn_GLhotCAO h1 {
        line-height: 1.2em;
    }

.btn_GLACT {
    height: calc(28% - 10px) !important;
    min-height: 80px !important;
    background: #ebf5fe url(/Areas/Mobile/Content/Images/th-th/img_hotBG.png) no-repeat center;
    background-size: cover;
}

    .btn_GLACT:active {
        background: #ebf5fe !important;
    }

    .btn_GLACT .img_GL {
        background: url(/Areas/Mobile/Content/Images/th-th/img_hotACT.png) no-repeat center;
        background-size: 100% auto;
    }

        .btn_GLACT .img_GL:after {
            display: none;
        }

.popupCI {
    overflow: initial;
    border-radius: 0;
    width: 72%;
    max-width: 300px;
}

    .popupCI .popup_close {
        background-image: url(/Areas/Mobile/Content/Images/th-th/btn_closeW2.svg);
        top: calc(-7.2vw - 34px);
        right: -8px;
        width: 41px;
        height: 41px;
        background-size: 25px auto;
    }

.btn_chat,
.btn_studio,
.btn_CI {
    width: 100%;
    max-width: 300px;
    height: 27.7vw;
    max-height: 115px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 1em;
    font-weight: bold;
    color: #535867;
    position: relative;
    padding: 0 13.5vw;
    box-sizing: border-box;
}

    .btn_CI ~ * {
        margin-top: 4.8vw
    }

    .btn_studio img,
    .btn_CI img {
        width: 12vw;
        max-width: 50px;
    }

    .btn_chat img {
        width: 14.5vw;
        max-width: 60px;
    }

    .btn_chat > span,
    .btn_studio > span,
    .btn_CI > span {
        width: 65px;
        white-space: nowrap;
        display: flex;
        justify-content: center;
    }

.btn_CI {
    background: #ffc6c7; /* Old browsers */
    background: -moz-linear-gradient(left, #ffc6c7 0%, #ffc6c7 50%, #ff98c6 100%); /* FF3.6-15 */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ffc6c7), color-stop(50%,#ffc6c7), color-stop(100%,#ff98c6)); /* Chrome4-9,Safari4-5 */
    background: linear-gradient(to right, #ffc6c7 0%,#ffc6c7 50%,#ff98c6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc6c7', endColorstr='#ff98c6',GradientType=1 ); /* IE6-8 */
}

    .btn_CI:not(.maintain):active {
        background: #ffc6c7;
    }

.btn_studio {
    background: #dfe5fe; /* Old browsers */
    background: -moz-linear-gradient(left, #dfe5fe 0%, #dfe5fe 50%, #cfc6f9 100%); /* FF3.6-15 */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#dfe5fe), color-stop(50%,#dfe5fe), color-stop(100%,#cfc6f9)); /* Chrome4-9,Safari4-5 */
    background: linear-gradient(to right, #dfe5fe 0%,#dfe5fe 50%,#cfc6f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dfe5fe', endColorstr='#cfc6f9',GradientType=1 ); /* IE6-8 */
}

    .btn_studio:not(.maintain):active {
        background: #dfe5fe;
    }

.btn_chat {
    background: #dff0fe; /* Old browsers */
    background: -moz-linear-gradient(left, #dff0fe 0%, #dff0fe 50%, #bbdeff 100%); /* FF3.6-15 */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#dff0fe), color-stop(50%,#dff0fe), color-stop(100%,#bbdeff)); /* Chrome4-9,Safari4-5 */
    background: linear-gradient(to right, #dff0fe 0%,#dff0fe 50%,#bbdeff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dff0fe', endColorstr='#bbdeff',GradientType=1 ); /* IE6-8 */
}

    .btn_chat:not(.maintain):active {
        background: #dff0fe;
    }

[class*="btn_GL"][class*="EVO"]:not(.w100) .t_GL img,
[class*="btn_GL"][class*="KA"]:not(.w100) .t_GL img,
[class*="btn_GL"][class*="DS"]:not(.w100) .t_GL img,
[class*="btn_GL"][class*="KU"]:not(.w100) .t_GL > img,
[class*="btn_GL"][class*="3D"]:not(.w100) .t_GL img,
[class*="btn_GL"][class*="KY"]:not(.w100) .t_GL img {
    height: 37px;
    margin-top: -3px;
}

[class*="btn_GL"][class*="JK"]:not(.w100) .t_GL img,
[class*="btn_GL"][class*="SB"]:not(.w100) .t_GL img,
[class*="btn_GL"][class*="BBIN"]:not(.w100) .t_GL img,
[class*="btn_GL"][class*="LC"]:not(.w100) .t_GL img {
    height: 37px;
    margin-top: -6px;
}

.btn_GLsportKJ:not(.w100) img {
    margin-top: -12px;
}

.btn_GLfishCQ9:not(.w100) .img_GL:after {
    background-position-x: 1.6em;
}

.btn_GLslot3D.w100 .img_GL {
    right: 0 !important;
}

    .btn_GLslot3D.w100 .img_GL:after {
        background-image: url(/Areas/Mobile/Content/Images/th-th/img_slot3D.png) !important;
        max-height: initial !important;
        height: 100% !important;
        background-position-y: bottom !important;
    }

/*二列三列遊戲圖片*/
/*2*/
.btn_GLlotoBBIN .img_GL:after,
.btn_GLchessMP .img_GL:after,
.btn_GLesportOB .img_GL:after {
    background-position-y: -55vw;
}
/*3*/
.btn_GLchessOB .img_GL:after,
.btn_GLesportSB .img_GL:after {
    background-position-y: -110vw;
}
/*四列以上遊戲圖片*/
/*2*/
.btn_GLfishKS .img_GL:after,
.btn_GLslotPG .img_GL:after,
.btn_GLliveEVO .img_GL:after,
.btn_GLsportAI .img_GL:after {
    background-position-y: 11.1%;
}
/*3*/
.btn_GLfishAG .img_GL:after,
.btn_GLslotBNG .img_GL:after,
.btn_GLliveAG .img_GL:after,
.btn_GLsportJZ .img_GL:after,
.btn_GLhotSlot .img_GL:after {
    background-position-y: 22%;
}
/*4*/
.btn_GLfishDS .img_GL:after,
.btn_GLslotCQ9 .img_GL:after,
.btn_GLliveDG .img_GL:after,
.btn_GLsportSB .img_GL:after {
    background-position-y: 33%;
}
/*5*/
.btn_GLfishKY .img_GL:after,
.btn_GLslotDS .img_GL:after,
.btn_GLliveAES .img_GL:after,
.btn_GLsportAG .img_GL:after {
    background-position-y: 44%;
}
/*6*/
.btn_GLfishKA .img_GL:after,
.btn_GLslotKA .img_GL:after,
.btn_GLliveXG .img_GL:after,
.btn_GLsportCMD .img_GL:after {
    background-position-y: 55%;
}
/*7*/
.btn_GLsportOB .img_GL:after, /*2-26*/
.btn_GLfishLC .img_GL:after,
.btn_GLslot3D:not(.w100) .img_GL:after,
.btn_GLliveWM .img_GL:after {
    background-position-y: 66%;
}
/*8*/
.btn_GLfishCQ9 .img_GL:after,
.btn_GLslotJK .img_GL:after,
.btn_GLliveSA .img_GL:after,
.btn_GLsportBBIN .img_GL:after {
    background-position-y: 77%;
}
/*9*/
/*.btn_GLsportOB .img_GL:after,*/ /*2-26*/
.btn_GLslotPLS .img_GL:after,
.btn_GLliveAB .img_GL:after {
    background-position-y: 88%;
}
/*10*/
.btn_GLfishOB .img_GL:after,
.btn_GLslotFC .img_GL:after,
.btn_GLliveOB .img_GL:after {
    background-position-y: 99%;
}

@media (min-aspect-ratio: 5/10) {
    .btn_GLACT .img_GL {
        background-size: auto 115%;
    }

    .btn_GLhotStudio h1 {
        height: 80%;
    }
}

@media (min-width: 350px) {
    .GameList_RBox,
    .GameList_L {
        padding-top: 7px;
    }

    [class*="btn_GL"] {
        margin-bottom: 7px;
    }

        .boxGL,
        [class*="btn_GL"]:last-child,
        .GameList_R > [class*="btn_GL"]:not(.w100):nth-last-child(2) {
            margin-bottom: 13px;
        }

    .GameList_R [class*="btn_GLhot"] {
        height: calc(36% - 9px);
    }

    .btn_GLACT,
    .boxGL {
        height: calc(28% - 9px) !important;
    }

        .boxGL [class*="btn_GL"] {
            height: calc(50% - 3.5px) !important;
        }

    .btn_chat > span,
    .btn_studio > span,
    .btn_CI > span {
        width: 70px;
    }

    .GameList_R [class*="btn_GL"]:not([class*="btn_GLhot"]) .t_GL {
        width: 59px;
        margin-left: 9px;
        margin-right: 9px;
    }
}

@media (max-width: 399px) {
    .GameList_R:not([class*="wholeT"]) .img_GL:after {
        max-width: 184px;
        max-height: 125px;
    }
}

@media (max-width: 399px) and (min-aspect-ratio: 360/650) {
    .boxGL h1 {
        font-size: 12px !important;
    }

    .btn_GLhotCAO h1 {
        line-height: 1em;
    }
}

@media (max-width: 399px) and (min-aspect-ratio: 360/612) {
    .btn_GLhotStudio h1 {
        height: 90%;
    }
}

@media (max-width: 700px) and (min-aspect-ratio: 5/10) {
    .GameList_R:not([class*="wholeT"]) [class*="btn_GL"]:not([class*="hot"]) .img_GL:after {
        max-width: 166px;
        max-height: 115px;
    }
}

@media (min-width: 700px) and (max-width: 767px) and (min-aspect-ratio: 5/10) {
    .GameList_R:not([class*="wholeT"]) [class*="btn_GL"]:not([class*="hot"]) .img_GL:after {
        max-width: 201px;
        max-height: 137px;
    }
}

@media (min-width: 350px) and (max-width: 399px) and (min-height: 660px) {
    .GameList_R .w100 .t_GL img {
        margin-top: -2px;
    }
}

@media (min-width: 350px) and (max-width: 399px) and (min-height: 724px) {
    .logo_CAO {
        width: calc(47px + 0.5vw);
    }

        .btn_GLhotSlot img,
        .btn_GLhotLoto img,
        .btn_GLhotLive img,
        .logo_CAO img {
            height: 47px;
        }

            .logo_CAO img + img {
                height: 29px;
            }
}

@media (min-width: 400px) {
    .GameList_RBox,
    .GameList_L {
        padding-top: 8px;
    }

    [class*="btn_GL"] {
        margin-bottom: 8px;
    }

        .boxGL,
        [class*="btn_GL"]:last-child,
        .GameList_R > [class*="btn_GL"]:not(.w100):nth-last-child(2) {
            margin-bottom: 14px;
        }

    .GameList_L [class*="ic_GL"] {
        margin-top: 2px;
    }

    .boxGL,
    .GameList_R [class*="btn_GL"]:not(.w100) {
        width: calc(50% - 4px);
    }

    .GameList_R [class*="btn_GLhot"] {
        height: calc(35% - 10px);
    }

    .t_GL {
        margin: 10px 15px 0;
    }

        .t_GL img {
            height: 55px;
        }

    .logo_CAO {
        width: calc(55px + 0.5vw);
    }

        .logo_CAO img + img {
            height: 34px;
            margin-top: -10px;
        }

    .btn_GLhotSlot img,
    .btn_GLhotLoto img,
    .btn_GLhotLive img,
    .btn_GLhotSport img {
        margin-top: -3px;
    }

    .btn_GLACT,
    .boxGL {
        height: calc(30% - 10px) !important;
        min-height: 93px !important;
    }

        .boxGL [class*="btn_GL"] {
            height: calc(50% - 4px) !important;
        }

        .boxGL h1 {
            font-size: 0.85em !important;
        }

    .btn_chat,
    .btn_studio,
    .btn_CI {
        padding: 0 57px;
    }

        .btn_CI ~ * {
            margin-top: 20px
        }

        .btn_chat > span,
        .btn_studio > span,
        .btn_CI > span {
            width: 76px;
        }

    .popupCI .popup_close {
        top: -64px;
    }

    [class*="btn_GL"][class*="EVO"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KA"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="DS"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KU"]:not(.w100) .t_GL > img,
    [class*="btn_GL"][class*="3D"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KY"]:not(.w100) .t_GL img {
        height: 45px;
    }

    [class*="btn_GL"][class*="JK"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="SB"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="BBIN"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="LC"]:not(.w100) .t_GL img {
        height: 43px;
    }
}

@media (min-width: 400px) and (max-width: 529px) and (min-aspect-ratio: 414/770) {
    .boxGL h1 {
        font-size: 0.8em !important;
    }
}

@media (min-width: 400px) and (max-width: 529px) and (min-aspect-ratio: 414/680) {
    .btn_GLhotCAO h1 {
        line-height: 1em;
    }
}

@media (min-width: 400px) and (max-width: 529px) {
    .GameList_R:not([class*="wholeT"]) .img_GL:after {
        max-width: 200px;
        max-height: 137px;
        min-width: 148px;
        min-height: 102px;
    }
}

@media (min-width: 400px) and (max-height: 773px) {
    .t_GL {
        margin: 10px 15px 0;
    }

    .logo_CAO {
        width: calc(47px + 0.5vw);
    }

        .btn_GLhotSlot img,
        .btn_GLhotLoto img,
        .btn_GLhotLive img,
        .logo_CAO img {
            height: 47px;
        }

            .logo_CAO img + img {
                height: 28px;
            }
}

@media (min-width: 400px) and (max-width: 462px) and (min-height: 774px) and (max-height: 835px) {
    .btn_AD ~ .container_main .logo_CAO {
        width: calc(47px + 0.5vw);
    }

        .btn_AD ~ .container_main .btn_GLhotSlot img,
        .btn_AD ~ .container_main .btn_GLhotLoto img,
        .btn_AD ~ .container_main .btn_GLhotLive img,
        .btn_AD ~ .container_main .logo_CAO img {
            height: 47px;
        }

            .btn_AD ~ .container_main .logo_CAO img + img {
                height: 28px;
            }
}

@media (min-width: 400px) and (max-width: 529px) and (min-height: 774px) {
    .GameList_R .w100 .t_GL img {
        margin-top: -2px;
    }
}

@media (min-width: 530px) {
    .GameList_RBox,
    .GameList_L {
        padding-top: 10px;
    }

    [class*="btn_GL"] {
        margin-bottom: 10px;
    }

    .boxGL,
    .GameList_R [class*="btn_GL"]:not(.w100) {
        width: calc(50% - 5px);
    }

        .GameList_R [class*="btn_GL"]:not(.w100) h1 span {
            line-height: normal;
        }

    .GameList_R [class*="btn_GL"]:not([class*="btn_GLhot"]) .t_GL {
        width: 98px;
        white-space: nowrap;
    }

    .GameList_R [class*="btn_GLhot"] {
        height: calc(34% - 12px);
        min-height: 98px;
    }

    .GameList_R:not([class*="wholeT"]) .img_GL:after {
        width: 21vh;
        height: 14vh;
        min-width: 142px;
        min-height: 98px;
        background-position-x: right;
    }

    .btn_AD ~ .container_main .GameList_R [class*="btn_GLhot"] .img_GL:after {
        width: 20vh;
        height: 13.5vh;
    }

    .GameList_R[class*="wholeT"] .img_GL {
        right: 8vw;
    }

        .GameList_R[class*="wholeT"] .img_GL:after {
            width: 40vw;
            max-height: 38vw;
        }

    /*二列三列遊戲圖片*/
    /*2*/
    .btn_GLlotoBBIN .img_GL:after,
    .btn_GLchessMP .img_GL:after,
    .btn_GLesportOB .img_GL:after {
        background-position-y: -40vw;
    }
    /*3*/
    .btn_GLchessOB .img_GL:after,
    .btn_GLesportSB .img_GL:after {
        background-position-y: -79vw;
    }

    .GameList_R:not([class*="wholeT"]) .w100 .img_GL {
        right: 15vw;
    }

    .btn_GLlotoKU {
        background-size: cover !important;
        background-position-y: center !important;
    }

        .btn_GLlotoKU .img_GL {
            right: 0 !important;
        }

            .btn_GLlotoKU .img_GL:after {
                background-position-x: right !important;
            }

    .btn_GLhotSlot .img_GL:after {
        bottom: 0;
    }

    .btn_GLACT,
    .boxGL {
        height: calc(32% - 12px) !important;
    }

        .boxGL [class*="btn_GL"] {
            height: calc(50% - 5px) !important;
        }

        .boxGL .t_GL {
            padding-right: 4.5vw;
        }

    .btn_GLsportKU:not(.w100) .logo_CAO {
        width: auto;
        flex-wrap: nowrap;
        -webkit-transform: scale(0.9,0.9);
        transform: scale(0.9,0.9);
    }

        .btn_GLsportKU:not(.w100) .logo_CAO img + img {
            margin-left: 1vw;
        }

    .btn_GLslot3D.w100 .img_GL {
        right: 8vw !important;
    }
}

@media (min-width: 530px) and (max-width: 699px) and (min-aspect-ratio: 534/785) {
    .boxGL h1 {
        font-size: 0.8em !important;
    }

    .btn_GLhotStudio h1 {
        height: 90%;
    }

    .btn_GLhotCAO h1 {
        line-height: 1em;
    }
}

@media (min-width: 530px) and (max-width: 767px) and (max-height: 755px) {
    .t_GL {
        margin: 10px 15px 0;
    }
}

@media (min-width: 530px) and (max-width: 767px) and (min-height: 800px) {
    .GameList_R .w100 .t_GL img {
        margin-top: -2px;
    }
}

@media (min-width: 700px) and (max-width: 767px) and (min-aspect-ratio: 712/870) {
    .boxGL h1 {
        font-size: 0.8em !important;
    }

    .btn_GLhotCAO h1 {
        line-height: 1em;
    }
}

@media (min-width: 768px) {
    .GameList_RBox,
    .GameList_L {
        padding-top: 15px;
    }

    [class*="btn_GL"] {
        margin-bottom: 15px !important;
    }

    .GameList_L h2 {
        font-size: 0.8em;
    }

    .t_GL {
        margin: 20px 20px 0;
    }

        .t_GL h1 {
            font-size: 0.95em !important;
        }

        .t_GL img {
            height: 7.5vw;
            max-height: 57px;
        }

    .GameList_R [class*="btn_GL"] {
        min-height: 92px;
    }

        .boxGL,
        .GameList_R [class*="btn_GL"]:not(.w100) {
            width: calc(50% - 8px);
        }

        .GameList_R [class*="btn_GL"]:not([class*="btn_GLhot"]) .t_GL {
            width: 135px;
            margin-left: 1.5vw;
            margin-right: 1.5vw;
        }

    .GameList_R .w100 .t_GL img {
        margin-top: -2px;
    }

    .GameList_R:not([class*="wholeT"]) .img_GL:after {
        min-width: 178px;
        min-height: 118px;
    }

    [class*="btn_GL"][class*="JK"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="SB"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="BBIN"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="LC"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="EVO"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KA"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="DS"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KU"]:not(.w100) .t_GL > img,
    [class*="btn_GL"][class*="3D"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KY"]:not(.w100) .t_GL img {
        height: 6.5vw;
    }

    .GameList_R [class*="btn_GLhot"] {
        height: calc(36% - 15px);
    }

    .logo_CAO {
        width: 8vw;
        max-width: 60px;
    }

        .logo_CAO img + img {
            height: 36px
        }

    .btn_GLsportKU:not(.w100) .logo_CAO {
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
    }

    .btn_GLsportKU.w100 .logo_CAO img + img {
        margin-left: 10px !important;
    }

    .btn_GLACT,
    .boxGL {
        height: calc(28% - 15px) !important;
        min-height: 104px !important;
    }

        .boxGL [class*="btn_GL"] {
            height: calc(50% - 7.5px) !important;
        }

        .boxGL .t_GL {
            padding-right: 6.5vw;
        }

    .btn_GLhotCAO h1 {
        line-height: 1.2em;
    }
}

@media (min-width: 768px) and (min-aspect-ratio: 768/1000) {
    .boxGL h1 {
        font-size: 0.8em !important;
    }

    .btn_GLhotCAO h1 {
        line-height: 1em;
    }
}

@media (min-width: 768px) and (max-height: 1000px) {
    .t_GL {
        margin: 2vw 3vw 0;
    }

    .GameList_R .w100 .t_GL img {
        margin-top: -8px;
    }
}

@media (min-width: 1024px) and (min-height: 768px) {
    .GameList_R:not([class*="wholeT"]) .img_GL:after {
        min-width: 215px;
        min-height: 143px;
    }
}

@media (orientation: landscape) {
    body {
        overflow: initial;
    }

    .container_main {
        position: static;
    }

    .GameList {
        height: calc(100vh - 40px);
    }

    .btn_AD ~ .container_main .GameList {
        height: calc(100vh - 95px);
    }

    .GameList_R:not([class*="wholeT"]) .img_GL:after {
        background-position-x: right;
    }

    .btn_GLlotoKU {
        background-size: cover !important;
        background-position-y: center !important;
    }

    .logo_CAO {
        flex-wrap: nowrap;
        max-width: initial;
    }

        .logo_CAO img:nth-last-child(3) {
            margin-left: 0;
            margin-right: 0;
        }

        .logo_CAO img + img {
            margin-left: 1.5vw !important;
        }

    .popupCI .popup_close {
        top: -8px;
        right: -55px;
    }
}

@media (min-height: 451px) and (min-width: 350px) and (orientation: landscape) {
    .GameList {
        padding-bottom: 48px;
    }
}

@media (min-height: 451px) and (min-width: 400px) and (orientation: landscape) {
    .GameList {
        padding-bottom: 55px;
    }
}

@media (min-height: 451px) and (min-width: 768px) and (orientation: landscape) {
    .GameList {
        padding-bottom: 75px;
    }
}

@media (min-width: 768px) and (orientation: landscape) {
    .t_GL {
        margin: 15px 15px 0;
    }

        .t_GL h1 {
            min-width: 55px;
        }

        .t_GL img {
            height: 55px;
        }

    .logo_CAO img + img {
        margin-left: 10px !important;
    }

    [class*="btn_GL"][class*="EVO"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KA"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="DS"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KU"]:not(.w100) .t_GL > img,
    [class*="btn_GL"][class*="3D"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="KY"]:not(.w100) .t_GL img {
        height: 45px;
    }

    [class*="btn_GL"][class*="JK"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="SB"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="BBIN"]:not(.w100) .t_GL img,
    [class*="btn_GL"][class*="LC"]:not(.w100) .t_GL img {
        height: 43px;
    }
}

/*維護中狀態/登录泡泡*/
[class*="btn_GL"].maintain .gameMainTain_text {
    display: flex;
}

.gameMainTain_text {
    display: none;
    color: #fff;
    position: absolute;
    z-index: 2;
    width: 35.5vw;
    height: 32px;
    min-height: 1.7em;
    max-height: calc(100% - 2vw);
    box-sizing: border-box;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 100px;
    left: 0;
    right: 0;
    bottom: 1vw;
    margin: auto;
    align-items: flex-end;
    justify-content: space-between;
}

    .gameMainTain_text:before {
        content: '';
        width: 10vw;
        height: 10vw;
        max-width: 47px;
        max-height: 47px;
        background: url(/Areas/Mobile/Content/Images/th-th/icon_fix.svg) no-repeat center bottom;
        background-size: 100% auto;
    }

    .gameMainTain_text div {
        font-size: .8em;
        line-height: 1em;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        white-space: nowrap;
        position: relative;
        z-index: 1;
        flex: 1;
        margin-right: 2vw;
    }

    .gameMainTain_text span {
        font-size: .8em;
        margin-bottom: -2px;
    }

.w100 .gameMainTain_text {
    left: auto;
    right: 1vw;
}

.gameMainTain_in {
    position: absolute;
    top: calc(100% - 1.2em);
    left: 0;
    background-color: #ff9900;
    color: #fff;
    padding: 6px 10px 5px;
    border-radius: 3px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    font-size: 0.7em;
    line-height: 1.2em;
    z-index: 3;
    display: none;
}

    .gameMainTain_in:before {
        content: '';
        position: absolute;
        top: -8px;
        left: 10px;
        border-style: solid;
        border-width: 0 0 9px 9px;
        border-color: transparent transparent #ff9900 transparent;
    }

.GameList_R [class*="btn_GL"]:last-child .gameMainTain_in,
.GameList_R [class*="btn_GL"]:not([class*="w100"]):nth-last-child(2) .gameMainTain_in {
    bottom: calc(100% - 1.2em);
    top: auto;
}

    .GameList_R [class*="btn_GL"]:last-child .gameMainTain_in:before,
    .GameList_R [class*="btn_GL"]:not([class*="w100"]):nth-last-child(2) .gameMainTain_in:before {
        bottom: -8px;
        top: auto;
        border-width: 9px 9px 0 0;
        border-color: #ff9900 transparent transparent transparent;
    }

.popupCI .gameMainTain_text {
    display: flex;
    font-weight: normal;
    width: calc(100% - 2vw);
}

    .popupCI .gameMainTain_text div {
        flex-direction: row;
    }

    .popupCI .gameMainTain_text span {
        margin-left: 5px;
    }

.popupCI .gameMainTain_in {
    font-weight: normal;
}

@media screen and (max-aspect-ratio:3/4) and (min-height: 640px) {
    .gameMainTain_text {
        bottom: 1.2vw;
        max-height: calc(100% - 2.4vw);
    }

    .popupCI .gameMainTain_text {
        width: calc(100% - 2.4vw);
    }
}

@media (min-width: 360px) {
    .gameMainTain_text {
        height: 36px;
    }

        .gameMainTain_text:before {
            width: 11.5vw;
            height: 11.5vw;
            margin-left: 1px;
            margin-bottom: -1px;
        }
}

@media (min-width: 400px) {
    .gameMainTain_text {
        height: 40px;
    }

        .gameMainTain_text div {
            font-size: .85em;
            margin-right: 3vw;
        }

    .gameMainTain_in:before {
        left: 12px;
    }
}

@media (min-width: 768px) {
    .gameMainTain_in {
        font-size: 0.9em;
    }

        .gameMainTain_in:before {
            top: -12px;
            left: 14px;
            border-width: 0 0 13px 14px;
        }
}

@media (orientation: landscape) and (max-height: 767px) {
    .boxGL .gameMainTain_text {
        top: 0;
        bottom: 0;
    }
}

/*最新/熱門/超彩標籤*/
.GL_hot, .GL_new, .GL_jackpot {
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}

.GL_hot {
    background-image: url(/Areas/Mobile/Content/Images/th-th/icon_hot.png);
    background-size: cover;
}

.GL_new {
    background-image: url(/Areas/Mobile/Content/Images/th-th/icon_new.png);
    background-size: cover;
}

.GL_jackpot {
    background-image: url(/Areas/Mobile/Content/Images/th-th/icon_superGold.svg);
    background-size: 100% auto;
    width: 32px;
    height: 33px;
    top: 3px;
}

.w100 .GL_jackpot {
    width: 37px;
}

.btn_GLhotLive .GL_jackpot ~ * h1 {
    letter-spacing: -0.5px;
    word-spacing: -0.5px;
}

@media (min-height: 800px) {
    .GL_jackpot {
        top: 5px;
    }
}

@media (min-width: 350px) {
    .GL_hot, .GL_new {
        width: 45px;
        height: 45px;
    }

    .GL_jackpot {
        width: 37px;
        height: 37px;
    }

    .w100 .GL_jackpot {
        width: 41px;
    }
}

@media (min-width: 375px) {
    .GL_jackpot {
        width: 41px;
    }
}

@media (min-width: 400px) {
    .GL_hot, .GL_new {
        width: 52px;
        height: 52px;
    }

    .GL_jackpot {
        width: 45px;
        height: 42px;
        right: 1px;
    }

    .w100 .GL_jackpot {
        width: 47px;
    }
}

@media (min-width:530px) {
    .GL_jackpot {
        width: 47px;
    }

    .btn_GLhotLive .GL_jackpot ~ * h1 {
        letter-spacing: 0;
        word-spacing: 0;
    }
}

@media (max-width: 399px) and (min-aspect-ratio: 54/100) {
    .btn_GLhotLive .img_GL:after {
        background-position-x: right !important;
    }
}

@media (min-width: 400px) and (min-aspect-ratio: 54/100) {
    .btn_GLhotLive .img_GL:after {
        background-position-x: -0.5em !important;
    }
}

@media (max-width: 529px) and (min-aspect-ratio: 495/1000) and (orientation: portrait) {
    [class*="btn_GL"]:not(.w100) .img_GL:after {
        background-position-x: 0.1em;
    }
}

@media (max-width: 399px) and (min-aspect-ratio: 495/1000) and (orientation: portrait) {
    [class*="btn_GL"]:not(.w100) .img_GL:after {
        background-position-x: 0.5em;
    }
}

/*Line客服*/
.servLine {
    position: fixed;
    left: 17.5%;
    bottom: 54px;
    z-index: 1;
    width: 45px;
    height: 45px;
}

    .servLine a {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: url(/Areas/Mobile/Content/Images/th-th/icon_line.png) no-repeat center;
        background-size: 100%;
        cursor: pointer;
    }

.btn_closeLine {
    position: absolute;
    right: -15px;
    top: -8px;
    width: 15px;
    height: 15px;
    background: #00b900 url(/Areas/Mobile/Content/Images/th-th/btn_close_white.svg) no-repeat center;
    background-size: 7px auto;
    border-radius: 50%;
}

    .btn_closeLine:before {
        content: '';
        width: 100%;
        height: 100%;
        background: #00b900;
        position: absolute;
        top: 0;
        right: 0;
        border-radius: 50%;
        z-index: -1;
    }

@media (min-width: 350px) {
    .servLine {
        height: 50px;
        width: 50px;
        bottom: 61px;
    }
}

@media (min-width: 400px) {
    .servLine {
        height: 60px;
        width: 60px;
        bottom: 69px;
    }

    .btn_closeLine {
        right: -20px;
        top: -10px;
        width: 20px;
        height: 20px;
        background-size: 8px auto;
    }
}

@media (min-width: 768px) {
    .servLine {
        bottom: 90px;
    }
}

@media (max-height: 450px) {
    .servLine {
        bottom: 14px;
    }
}

/*領取禮金入口*/
.btn_receive {
    position: fixed;
    z-index: 9;
    right: 0;
    top: 41%;
    width: 35px;
    height: 90px;
    color: #fff;
    background-color: #ffa61a;
    border-radius: 100px 100px 0 80px;
    line-height: 1em;
    font-size: 1em;
    text-shadow: 1px 1px 2px #b27512;
}

    .btn_receive span {
        transform: rotate(90deg) translate(145%);
        -webkit-transform: rotate(90deg) translate(145%);
        white-space: nowrap;
        position: absolute;
        right: 0;
        left: 0;
        margin: auto;
    }

    .btn_receive:before {
        content: '';
        background: url(/Areas/Mobile/Content/Images/th-th/btn_sideGift.svg) no-repeat center;
        width: 35px;
        height: 35px;
        position: absolute;
        top: 0;
        background-size: 100% auto;
    }

    .btn_receive:active {
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    }

@media (min-width: 350px) {
    .btn_receive {
        font-size: .9em;
    }
}

@media (min-width: 400px) {
    .btn_receive {
        width: 40px;
        height: 105px;
        font-size: .95em;
    }

        .btn_receive:before {
            width: 40px;
            height: 40px;
        }
}

@media (min-width: 768px) {
    .btn_receive {
        width: 50px;
        height: 125px;
        font-size: 1.1em;
    }

        .btn_receive:before {
            width: 50px;
            height: 50px;
        }
}

/*AV女优活动*/
.btn_AVactiv {
    background: url(/Areas/Mobile/Content/Images/th-th/btn_AV.png) no-repeat center;
    background-size: 100% auto;
    width: 74px;
    height: 74px;
    position: fixed;
    left: 17.5%;
    bottom: 48px;
    z-index: 1;
    cursor: pointer;
}

    .btn_AVactiv:active {
        filter: contrast(115%);
    }

.servLine ~ .btn_AVactiv {
    left: calc(70px + 17.5%);
    bottom: 54px;
}

.btn_closeACT {
    background: rgba(0,0,0,.25) url(/Areas/Mobile/Content/Images/th-th/btn_close_white.svg) no-repeat center;
    background-size: 7px auto;
    width: 15px;
    height: 15px;
    position: absolute;
    border-radius: 50%;
    cursor: pointer;
    right: 0;
    top: 0;
}

    .btn_closeACT:active {
        background-color: rgba(0,0,0,.5);
    }

@media (min-width: 350px) {
    .btn_AVactiv {
        width: 84px;
        height: 84px;
        bottom: 54px;
    }

    .servLine ~ .btn_AVactiv {
        left: calc(75px + 17.5%);
        bottom: 61px;
    }
}

@media (min-width: 400px) {
    .btn_AVactiv {
        width: 100px;
        height: 100px;
        bottom: 61px;
    }

    .servLine ~ .btn_AVactiv {
        left: calc(90px + 17.5%);
        bottom: 69px;
    }

    .btn_closeACT {
        width: 20px;
        height: 20px;
        background-size: 8px auto;
    }
}

@media (min-width: 768px) {
    .btn_AVactiv {
        bottom: 84px;
    }
}

@media (max-height: 450px) {
    .btn_AVactiv {
        bottom: 0;
    }
}