i > svg {
    display: block;
    width: 100%;
    height: 100%;
    z-index: 0;
}

/* home page */
.title_game {
    position: relative;
    width: 100%;
    height: 56px;
    line-height: 56px;
    text-align: center;
    flex: none;
    z-index: 0;
}

.title_game tt {
    display: inline-block;
    height: 100%;
    padding: 0 16px;
    font-size: 16px;
    font-weight: 600;
    color: #a78025;
    background: #fff;
}

.title_game:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    z-index: -1;
    background: #d8d8d8;
    transform: translateZ(0px);
}

.home_page.no_event {
    width: 100%;
    margin: 34px 0 8px 0;
    padding: 0 8px;
    flex: none;
}

.no_event i {
    display: block;
    width: 120px;
    height: 85px;
    margin: 0 auto 25px auto;
    background: url('../images/hg/img_nodata.svg') no-repeat;
    background-size: cover;
    background-position: center;
}

.no_event span {
    display: block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.72);
}

.box_game {
    display: flex;
    width: 100%;
    height: auto;
    margin-bottom: 8px;
    padding: 16px 8px;
    align-items: flex-start;
    flex-wrap: wrap;
    flex: none;
}

.btn_sport {
    display: inline-block;
    margin: 0 8px 16px 8px;
    overflow: hidden;
    border-radius: 8px;
    border: solid 1px rgba(0, 0, 0, 0.08);
    background-color: #fff;
    transition: all 0.3s ease;
    will-change: opacity;
}

.btn_sport i {
    text-align: center;
    background-color: #faf9f5;
    transition: background 0.3s ease;
    will-change: opacity;
}

.btn_sport i svg {
    fill: rgba(0, 0, 0, 0.64);
    transition: fill 0.3s ease;
}

.btn_sport span {
    display: flex;
    font-size: 14px;
    text-align: center;
    align-items: center;
    color: rgba(0, 0, 0, .64);
}

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

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


/* 360 setting*/
@media screen and (min-width: 1px) and (max-width: 639px) {
    .box_img {
        width: 400%;
    }

    .box_img article {
        padding: 0 16px;
    }

    .box_img.img_01 {
        left: 0;
    }

    .box_img.img_02 {
        left: -100%;
    }

    .box_img.img_03 {
        left: -200%;
    }

    .box_img.img_04 {
        left: -300%;
    }

    .btn_sport {
        width: calc((100% - 48px) / 3);
        height: 133px;
    }

    .btn_sport i {
        display: block;
        width: 100%;
        height: 84px;
        padding: 26px 0;
    }

    .btn_sport i svg {
        width: 32px;
        height: 32px;
        margin: 0 auto;
    }

    .btn_sport span {
        width: 100%;
        height: 48px;
        line-height: 17px;
        padding: 8px;
        justify-content: center;
        flex: 1 1 auto;
    }
}


/* 640setting*/
@media screen and (min-width: 640px)/*  and (max-width: 1023px) */ {
    .box_img {
        width: 200%;
    }

    .box_img article:nth-child(2n+1) {
        padding: 0 8px 0 16px;
    }

    .box_img article:nth-child(2n+2) {
        padding: 0 16px 0 8px;
    }

    .box_img.img_01 {
        left: 0;
    }

    .box_img.img_02 {
        left: 00%;
    }

    .box_img.img_03 {
        left: -100%;
    }

    .box_img.img_04 {
        left: -100%;
    }

    .btn_sport {
        display: flex;
        width: calc((100% - 32px) / 2);
        height: 56px;
        align-items: center;
        justify-content: flex-start;
    }

    .btn_sport i {
        display: inline-block;
        width: 54px;
        height: 54px;
        padding: 15px;
        flex: 0 0 54px;
    }

    .btn_sport i svg {
        width: 24px;
        height: 24px;
        margin: 0 auto;
    }

    .btn_sport span {
        padding: 4px 16px 4px 8px;
        justify-content: flex-start;
        flex: 1 1 auto;
    }

    .btn_sport span p {
        text-align: left;
    }
}


/* nav menu */
.menu_bottom {
    position: fixed;
    left: 0;
    bottom: 0;
    display: block;
    text-align: center;
    background: #503f32;
}

.btn_nav,
.btn_betslip {
    position: relative;
    display: inline-block;
    width: 20%;
    max-width: 128px;
    height: 100%;
    margin-right: -4px;
    padding: 8px 0 4px 0;
    vertical-align: top;
    transition: background 0.3s ease;
    overflow: hidden;
}

.btn_nav i,
.btn_betslip i {
    display: block;
    width: 100%;
    height: 24px;
    margin-bottom: 4px;
    background-size: 24px;
    background-position: center center;
    background-repeat: no-repeat;
}

.btn_nav span,
.btn_betslip span {
    display: block;
    width: 100%;
    height: 16px;
    line-height: 16px;
    font-size: 11px;
    text-align: center;
    color: rgba(255, 255, 255, 0.64);
    transition: color 0.3s ease;
}

.btn_betslip span {
    padding: 0 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn_nav .icon_star {
    display: block !important;
}

.btn_nav i svg {
    fill: rgba(255, 255, 255, 0.64);
    transition: fill 0.3s ease;
}

.btn_nav.off {
    pointer-events: none;
}

.btn_nav.on:first-child {
    pointer-events: none;
}

.btn_nav.on span {
    color: #debb69;
}

.btn_nav.on svg {
    fill: #debb69;
}

.btn_nav.off,
.btn_nav.mygame_off {
    opacity: 0.375;
}

.num_betslip {
    position: absolute;
    display: none;
    min-width: 16px;
    height: 16px;
    padding: 0 2px;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    border-radius: 8px;
    color: #fff;
    background: #19805c;
    z-index: 2;
}

.num_betslip.on {
    display: flex;
}

.btn_nav .num_betslip {
    top: 4px;
    left: 50%;
    margin-left: 8px;
}

.dot_green {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #3DB893;
}

.btn_nav .dot_green {
    position: absolute;
    top: -4px;
    left: 50%;
    margin-left: 16px;
    transition: top 0.3s cubic-bezier(0.68, -0.55, 0.265, 1);
}

.btn_nav .dot_green.on {
    top: 8px;
}

.dot_red {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #e53c50;
}

.btn_nav .dot_red {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.btn_nav .dot_red.on {
    opacity: 1;
}

.btn_nav .text_new {
    position: absolute;
    top: 2px;
    right: calc(50% + 6px);
    display: flex;
    width: 24px;
    height: 12px;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    color: #FFF;
    background: #CE3636;
}

.btn_nav .text_new p {
    display: block;
    height: 16px;
    line-height: 16px;
    font-size: 16px;
    font-weight: 400;
    transform: scale(0.5);
}

/* ADD MY EVENT play on_ani */
.on_ani.btn_nav i svg,
.off_ani.btn_nav i svg {
    fill: #fff;
}

.on_ani.btn_nav span,
.off_ani.btn_nav span {
    color: #fff;
}

.btn_nav .ani_mygame {
    position: absolute;
    top: calc(50% - 24px);
    left: calc(50% - 24px);
    width: 48px;
    height: 48px;
    opacity: 0;
}

.btn_nav.on_ani .on_wave,
.btn_nav.on_ani .on_wave2,
.btn_nav.off_ani .off_wave {
    opacity: 1;
}

.on_ani .on_wave {
    animation: circle_ani 500ms ease both;
}

.on_ani .on_wave2 {
    animation: circle_ani 800ms 200ms ease both;
}

.off_ani .off_wave {
    animation: circle_ani 500ms ease both;
}

@keyframes circle_ani {
    0% {
        opacity: 1;
        transform: scale(0);
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

.btn_betslip {
    background-color: #a78025;
}

.btn_betslip i {
    display: block;
    width: 100%;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 32px;
    color: #fff;
}

/* showCleanData */
.clean_Main {
    width: 100%;
    height: 100%;
    padding: 64px 16px 32px 16px;
    overflow-y: auto;
}

.clean_Main img {
    display: block;
    width: 112px;
    height: 111px;
    margin: 0px auto 16px;
}

.clean_Main .title {
    display: block;
    width: 100%;
    height: 24px;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    color: #9b8d79;
    margin-bottom: 16px;
}

.clean_Main span p {
    font-size: 14px;
    text-align: center;
    color: rgba(0, 0, 0, 0.64);
}

.clean_Main span p tt {
    font-weight: bold;
    color: #19805c;
}

/* Regular&Scheduled_Maintenance */
.Reg_Sch_Main {
    display: flex;
    height: auto;
    min-height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.Reg_Sch_content {
    width: 100%;
    margin: 24px 0;
    padding: 0 16px;
    flex: 1 1 auto;
}

.Reg_Sch_Main img {
    display: block;
    width: 112px;
    height: 111px;
    margin: 0px auto 24px;
}

.Reg_Sch_Main .title {
    display: block;
    width: 100%;
    font-size: 18px;
    text-align: center;
    color: #9b8d79;
}

.Reg_Sch_Main .title_cn {
    font-weight: 600;
}

.Reg_Sch_Main .title_tw {
    font-weight: 500;
}

.Reg_Sch_Main .title_en {
    font-weight: bold;
}

.Reg_Sch_Main .title:nth-of-type(3) {
    margin-bottom: 16px;
}

.Reg_Sch_Main p {
    font-size: 14px;
    text-align: center;
    color: rgba(0, 0, 0, 0.64);
}

.Reg_Sch_Main p:nth-child(1) {
    white-space: nowrap;
}

.Reg_Sch_Main a {
    font-weight: bold;
}

.Reg_Sch_Main b {
    font-weight: 500;
}

.text_phone .mrg8 {
    margin-right: 8px;
}

@media (min-width: 639px) {
    p.text_break br {
        display: none;
    }
}

@media (max-width: 639px) {
    .Reg_Sch_Main p:nth-child(1) {
        white-space: pre-line;
    }
}

/* Urgent Pre Login Maintenance Page */
.UPL_Main {
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.UPL_content {
    width: 100%;
    margin: 24px 0;
    padding: 0 16px;
    flex: 1 1 auto;
}

.UPL_Main img {
    display: block;
    width: 112px;
    height: 111px;
    margin: 0px auto 24px;
}

.UPL_Main .title {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    color: #9b8d79;
    margin-bottom: 16px;
}

.UPL_Main p {
    font-size: 14px;
    text-align: center;
    color: rgba(0, 0, 0, 0.64);
}

.UPL_Main p:nth-child(1) {
    white-space: nowrap;
}

.UPL_Main a {
    font-weight: 600;
}

.text_copyright {
    width: 100%;
    height: 32px;
    line-height: 16px;
    padding: 8px 0;
    flex: none;
    font-size: 12px;
    text-align: center;
    color: #fff;
    background: #9b8d79;
}

@media (max-width: 639px) {
    .UPL_Main p:nth-child(1) {
        white-space: pre-line;
    }
}

/* 閮ㄥ垎缍插潃闅辫棌鑱怠璩囪▕ */
.none_tel .hidden_tel {
    display: none;
}

/* Urgent Maintenance */
.Urgent_Main {
    padding: 0px 16px;
    margin-top: 64px;
}

.Urgent_Main img {
    display: block;
    width: 112px;
    height: 111px;
    margin: 0px auto 16px;
}

.Urgent_Main .title {
    display: block;
    height: 24px;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    color: #9b8d79;
    margin-bottom: 14px;

}

.Urgent_Main p {
    font-size: 14px;
    text-align: center;
    color: rgba(0, 0, 0, 0.64);
}

@media screen and (min-width: 1024px) {
    .UPL_content,
    .Reg_Sch_content {
        margin: 32px 0;
    }
}

/* error 404 */
.error_Main {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex: 1 1 auto;
}

.error_Main img {
    display: block;
    width: 150px;
    height: 60px;
    margin: 0px auto 5px;
}

.error_Main p {
    display: block;
    height: 48px;
    line-height: 48px;
    margin: 0px 16px;
    font-size: 12px;
    text-align: center;
    color: rgba(0, 0, 0, 0.56);
}

.error_Main p:empty {
    display: none;
}

.error_Main tt {
    color: #007ba8;
}

/* Account View Only */
.view_only {
    margin: 64px 0 16px 0;
    padding: 0px 16px;
    transform: translate3d(0, 0, 0);
}

.view_only img {
    display: block;
    width: 120px;
    height: 120px;
    margin: 0px auto 24px auto;
}

.view_only span {
    display: block;
    margin: 0 auto;
    text-align: center;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.64);
}

.text_bold {
    font-weight: bold;
}

.btn_viewonly {
    cursor: pointer;
}

/* contactus */
.box_mail {
}

.icon_mail {
    display: block;
    width: 64px;
    height: 64px;
    margin: 0 auto 8px auto;
    background: url(../images/hg/contact_email.svg) center no-repeat;
    background-size: cover;
}

.icon_phone {
    display: block;
    width: 64px;
    height: 64px;
    margin: 32px auto 8px auto;
    background: url(../images/hg/contact_phone.svg) center no-repeat;
    background-size: cover;
}

.box_mail p,
.box_phone p {
    display: block;
    height: 24px;
    line-height: 24px;
    font-size: 14px;
    text-align: center;
}

.box_phone p {
    margin-bottom: 4px;
}

.box_mail a,
.box_phone a {
    display: inline-block;
    color: #000;
}


/* help_odds */
.help_odds table {
    width: 100%;
    background: #fff;
}

.help_tr_odd td,
.his_tr td {
    text-align: center;
    font-size: 14px;
    color: #000
}

.help_odds .f_red {
    color: #ce3636;
}

.his_title {
    width: 100%;
    height: 56px;
    line-height: 56px;
    margin-bottom: 8px;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    background-color: #352a21;
}

.his_title th {
    line-height: 16px;
    padding: 0px 8px;
    font-size: 14px;
    font-weight: normal;
    color: #fff;
    border: none;
    background-color: #352a21;
}

.hp_left {
    text-align: left;
}

.subtitle_help {
    height: 48px;
    line-height: 48px;
    margin: 16px 0px 0px;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    background-color: #503f32;
}

.EN .subtitle_help {
    font-size: 16px;
}

.help_odds_bottom {
    margin-top: 16px;
}

.help_odds_bottom table {
    table-layout: fixed;
}

.help_odds_top .help_td,
.help_odds_bottom .help_td {
    width: 78px;
    height: 113px;
    line-height: 113px;
}

.TW.help_odds_top .help_td,
.CN.help_odds_top .help_td {
    width: 78px;
}

.EN .help_odds_top .help_td {
    width: 110px;
    white-space: nowrap;
}

.help_odds_top .help_td {
    padding-left: 16px;
    text-align: left;
}

.help_odds_bottom .help_td {
    text-align: center;
}

.help_odds_top tr:nth-child(4),
.help_odds_top tr:nth-child(5),
.help_odds_top tr:nth-child(8),
.help_odds_top tr:nth-child(9) {
    background-color: #e6e6e6;
}

.help_odds_bottom tr:nth-child(odd) {
    background-color: #e6e6e6;
}

.help_odds_top .help_td {
    box-shadow: inset -1px 0px 1px rgba(0, 0, 0, 0.16)
}

.help_td_odd.up {
    border-bottom: 1px rgba(0, 0, 0, 0.16) solid;
}

.help_td_odd {
    padding: 0px 4px;
    height: 56px;
    line-height: 56px;
}

.help_odds_bottom .help_td {
    height: 56px;
    line-height: 56px;
}

.title_help {
    display: flex;
    width: 100%;
    height: 48px;
    align-items: center;
    flex: none;
    background-image: url('../images/hg/bg_op_league.jpg');
    background-position: bottom;
    background-color: #e1dbd8;
    margin-bottom: 16px; /* 1123 */
}

.title_help {
}

.title_help .btn_back {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 8px;
    flex: 0 0 32px;
    transition: background 0.3s ease;
}

.title_help .btn_back i {
    display: block;
    width: 100%;
    height: 100%;
    padding: 8px;
}

.btn_back svg {
    fill: rgba(0, 0, 0, 0.64);
}

.title_help span {
    display: inline-block;
    width: calc(100% - 96px);
    height: 24px;
    line-height: 24px;
    padding: 0 4px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    flex: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #000;
}


/* App download page */
.content_app {
    width: 100%;
    height: 100%;
    padding-bottom: 16px;
}

.content_app .title_help {
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
}

.content_app ul {
    display: block;
    width: 100%;
    padding: 0 16px 16px 16px;
}

.content_app li {
    display: block;
    margin-bottom: 16px;
}

.content_app li:last-child {
    margin-bottom: 0;
}

.content_app .text_app {
    display: block;
    margin-bottom: 16px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.64);
}

.btn_app {
    display: block;
    width: 100%;
    max-width: 140px;
    height: 48px;
    line-height: 48px;
    margin: 16px auto;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    border-radius: 4px;
    color: #fff;
    background: #19805c;
}

.img_app1,
.img_app2,
.img_app3,
.img_app4 {
    width: 192px;
    margin: 0 auto;
    background-size: contain;
    background-repeat: no-repeat;
}

.img_app1 {
    height: 205px;
}

.img_app2 {
    height: 208px;
}

.img_app3 {
    height: 208px;
}

.img_app4 {
    height: 192px;
}

.TW .img_app1 {
    background-image: url('../images/hg/img_app1_tw.jpg');
}

.TW .img_app2 {
    background-image: url('../images/hg/img_app2_tw.jpg');
}

.TW .img_app3 {
    background-image: url('../images/hg/img_app3_tw.jpg');
}

.TW .img_app4 {
    background-image: url('../images/hg/img_app4_tw.jpg');
}

.CN .img_app1 {
    background-image: url('../images/hg/img_app1_cn.jpg');
}

.CN .img_app2 {
    background-image: url('../images/hg/img_app2_cn.jpg');
}

.CN .img_app3 {
    background-image: url('../images/hg/img_app3_cn.jpg');
}

.CN .img_app4 {
    background-image: url('../images/hg/img_app4_cn.jpg');
}

.EN .img_app1 {
    background-image: url('../images/hg/img_app1_en.jpg');
}

.EN .img_app2 {
    background-image: url('../images/hg/img_app2_en.jpg');
}

.EN .img_app3 {
    background-image: url('../images/hg/img_app3_en.jpg');
}

.EN .img_app4 {
    background-image: url('../images/hg/img_app4_en.jpg');
}

.footer_app {
    width: 100%;
    text-align: center;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.64);
}

.footer_app span {
    display: inline-block;
    max-width: 212px;
    text-align: left;
    vertical-align: middle;
}

.icon_app {
    display: inline-block;
    width: 60px;
    height: 60px;
    margin-right: 16px;
    vertical-align: middle;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url('../images/hg/icon_app.svg');
}

/*
.TW .icon_app,.CN .icon_app{background-image: url('../images/hg/icon_app_tw.svg');}
.EN .icon_app{background-image: url('../mages/icon_app_en.svg');}
*/

.content_help_app {
    width: 100%;
    padding: 16px;
}

.help_app_gold {
    display: inline-block;
    font-size: 14px;
    vertical-align: middle;
    color: #a78025;
}

.box_btn {
    display: flex;
    width: 100%;
    height: 48px;
    margin-top: 16px;
    justify-content: space-between;
}

.btn_app_download {
    display: inline-flex;
    width: 100%;
    height: 48px;
    margin-right: 8px;
    padding: 4px 8px;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    border-radius: 4px;
    color: #fff;
    background: #19805c;
}

.btn_googleplay {
    display: inline-block;
    width: 100%;
    height: 48px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    border-radius: 4px;
    background: url('../images/hg/img_googleplay.png') no-repeat center;
    background-size: auto 100%;
    border: 1px solid #19805c;
}

.content_acchelp {
    width: 100%;
    will-change: opacity;
}


/* right_panel */
.wrap_event {
    width: 100%;
}

.box_event {
    position: relative;
    display: block;
    width: 100%;
    margin-bottom: 16px;
    background: #352a21;
}

.box_event.event_0 {
    background: #4F3E34;
}

.box_event.event_myGame {
    background: #45362B;
}

.box_event.event_newBK {
    background: #45362B;
}

.img_event {
    position: relative;
    max-width: 480px;
    margin: 0 auto;
    background-size: cover;
    background-position: center center;
}

.img_event:before {
    content: '';
    display: block;
    width: 100%;
    max-width: 480px;
    padding-bottom: 56.25%;
    opacity: 0;
}

.img_event img {
    display: block;
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    background-position: center;
}

.img_event button {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.downloadapp .btn_link1 {
    top: 57%;
    left: 6.3%;
    width: 34.5%;
    height: 14%;
}

.downloadapp .btn_link2 {
    top: 73%;
    left: 6.3%;
    width: 34.5%;
    height: 14%;
}

.box_news {
    position: relative;
    display: flex;
    width: 100%;
    margin-bottom: 16px;
    padding-bottom: 22.4%;
    background: #352a21;
}

.box_news > div {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
}

.img_news {
    display: inline-block;
    width: 40%;
    height: 100%;
    flex: 1 0 40%;
    vertical-align: top;
    /* background: #909090; */

    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.content_news {
    display: inline-flex;
    width: 60%;
    height: 100%;
    margin-left: -5px;
    padding: 8px 16px 16px 16px;
    flex-direction: column;
    vertical-align: top;
    color: #fff;
}

.title_news {
    display: block;
    width: 100%;
    line-height: 24px;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: bold;
}

.title_news > span {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text_news {
    display: flex;
    width: 100%;
    min-height: 17px;
    flex: 1 1 auto;
    align-items: center;
    font-size: 14px;
}

.text_news > span {
    display: block;
    width: 100%;

    overflow: hidden;
    overflow-wrap: break-word;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

@media screen and (min-width: 1024px) and (max-width: 1279px) {
    .text_news > span {
        -webkit-line-clamp: 1;
    }
}

@media screen and (min-width: 1280px) and (max-width: 1599px) {
    .text_news > span {
        -webkit-line-clamp: 2;
    }
}

@media screen and (min-width: 1600px) {
    .text_news > span {
        -webkit-line-clamp: 3;
    }
}


/* right_panel scored board*/
.box_r_score {
    width: 100%;
}


/* PC hover effect */
@media (pointer: fine) and (max-resolution: 2dppx), screen and (pointer: fine) and (-webkit-max-device-pixel-ratio: 2),
(-moz-touch-enabled: 0), screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .box_banner label:hover button {
        background: #debb69;
    }

    .btn_sport:hover {
        border: 1px solid #a78025;
    }

    .btn_sport:hover i {
        background-color: #f5f2e5;
    }

    .btn_sport:hover i svg {
        fill: #a78025;
    }

    .btn_sport:hover span {
        color: #a78025;
    }

    .btn_nav:hover {
        background-color: #5d4e42;
    }

    .btn_nav:hover span {
        color: #debb69;
    }

    .btn_nav:hover svg {
        fill: #debb69;
    }

}

/* All active effect */
.box_banner label:active button {
    background: #a78025;
}

.btn_sport:active {
    border: 1px solid #a78025;
}

.btn_sport:active i {
    background-color: #a78025;
}

.btn_sport:active i svg {
    fill: #fff;
}

.btn_sport:active span {
    color: #a78025;
}

.btn_nav:active {
    background-color: #433429;
}

.btn_nav:active span {
    color: #debb69;
}

.btn_nav:active svg {
    fill: #debb69;
}

.btn_betslip:active {
    background-color: #8c6b1f;
}


/* STAG 2 */
@media screen and (min-width: 1024px) {
    .title_game,
    .title_game ~ .no_event,
    .box_game {
        width: calc(100% - 32px);
        margin: 0 16px;
    }

    .title_inplay {
        margin-top: 32px;
    }

    .content_acchelp, .help_pwd {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .box_chgpwd, .box_help_pwd {
        width: 100%;
        max-width: 650px;
    }

    .content_acchelp .help_odds_top, .content_acchelp .help_odds_bottom {
        width: 100%;
        padding: 0 16px;
    }

    .view_only {
        margin: 144px 0 16px 0;
    }

    .clean_Main {
        padding-top: 112px;
    }

    .title_help {
        margin-bottom: 32px;
    }
}


.TW img.tw {
    display: block;
}

.CN img.cn {
    display: block;
}

.EN img.en {
    display: block;
}

.img_event img {
    background-size: cover;
}

/* .TW .sideshow_1 img,.TW .event_1{background-image: url('../images/hg/img_sideshow_1_tw.jpg');} */
.TW .sideshow_2 img, .TW .event_2 .img_event {
    background-image: url('../images/hg/img_sideshow_2_tw.jpg');
}

.TW .sideshow_3 img, .TW .event_3 .img_event {
    background-image: url('../images/hg/img_sideshow_3_tw.jpg');
}

.TW .sideshow_4 img, .TW .event_4 .img_event {
    background-image: url('../images/hg/img_sideshow_4_tw.jpg');
}

.TW .sideshow_5 img, .TW .event_5 .img_event {
    background-image: url('../images/hg/img_sideshow_5_tw.jpg');
}

.TW .sideshow_0 img, .TW .event_0 .img_event {
    background-image: url('../images/hg/img_sideshow_0_tw.jpg');
}

/* .CN .sideshow_1 img,.CN .event_1{background-image: url('../images/hg/img_sideshow_1_cn.jpg');} */
.CN .sideshow_2 img, .CN .event_2 .img_event {
    background-image: url('../images/hg/img_sideshow_2_cn.jpg');
}

.CN .sideshow_3 img, .CN .event_3 .img_event {
    background-image: url('../images/hg/img_sideshow_3_cn.jpg');
}

.CN .sideshow_4 img, .CN .event_4 .img_event {
    background-image: url('../images/hg/img_sideshow_4_cn.jpg');
}

.CN .sideshow_5 img, .CN .event_5 .img_event {
    background-image: url('../images/hg/img_sideshow_5_cn.jpg');
}

.CN .sideshow_0 img, .CN .event_0 .img_event {
    background-image: url('../images/hg/img_sideshow_0_cn.jpg');
}

/* .EN .sideshow_1 img,.EN .event_1{background-image: url('../images/hg/img_sideshow_1_en.jpg');} */
.EN .sideshow_2 img, .EN .event_2 .img_event {
    background-image: url('../images/hg/img_sideshow_2_en.jpg');
}

.EN .sideshow_3 img, .EN .event_3 .img_event {
    background-image: url('../images/hg/img_sideshow_3_en.jpg');
}

.EN .sideshow_4 img, .EN .event_4 .img_event {
    background-image: url('../images/hg/img_sideshow_4_en.jpg');
}

.EN .sideshow_5 img, .EN .event_5 .img_event {
    background-image: url('../images/hg/img_sideshow_5_en.jpg');
}

.EN .sideshow_0 img, .EN .event_0 .img_event {
    background-image: url('../images/hg/img_sideshow_0_en.jpg');
}

.sideshow_5 .btn_link2,
.event_5 .btn_link2 {
    display: none !important;
}

.TW .event_result .img_event {
    background-image: url('../images/hg/img_result_tw.png');
}

.CN .event_result .img_event {
    background-image: url('../images/hg/img_result_cn.png');
}

.EN .event_result .img_event {
    background-image: url('../images/hg/img_result_en.png');
}

.TW .sideshow_newBM, .TW .event_newBM .img_event {
    background-image: url('../images/hg/img_newbm_tw.jpg');
}

.CN .sideshow_newBM, .CN .event_newBM .img_event {
    background-image: url('../images/hg/img_newbm_cn.jpg');
}

.EN .sideshow_newBM, .EN .event_newBM .img_event {
    background-image: url('../images/hg/img_newbm_en.jpg');
}

.TW .sideshow_newBK, .TW .event_newBK .img_event {
    background-image: url('../images/hg/img_newbk_tw.jpg');
}

.CN .sideshow_newBK, .CN .event_newBK .img_event {
    background-image: url('../images/hg/img_newbk_cn.jpg');
}

.EN .sideshow_newBK, .EN .event_newBK .img_event {
    background-image: url('../images/hg/img_newbk_en.jpg');
}

.TW .sideshow_myGame, .TW .event_myGame .img_event {
    background-image: url('../images/hg/img_mygame_tw.jpg');
}

.CN .sideshow_myGame, .CN .event_myGame .img_event {
    background-image: url('../images/hg/img_mygame_cn.jpg');
}

.EN .sideshow_myGame, .EN .event_myGame .img_event {
    background-image: url('../images/hg/img_mygame_en.jpg');
}

/* footer */
.footer {
}

.content_footer {
    display: grid;
    padding: 24px 32px;
    flex-direction: column;
    background: #F5F5F5;

    gap: 16px;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, auto);
    grid-template-areas:
	"a"
	"b"
	"c";
}

@media screen and (min-width: 1024px) and (max-width: 1279px) {
    .content_footer {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto 1fr;
        grid-template-areas:
			"a b"
			"a c";
    }
}

@media screen and (min-width: 1280px) {
    .content_footer {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr;
        grid-template-areas:
			"a b c";
    }
}

.box_footer:nth-child(1) {
    grid-area: a;
}

.box_footer:nth-child(2) {
    grid-area: b;
}

.box_footer:nth-child(3) {
    grid-area: c;
}


.box_copyright {
    display: flex;
    width: 100%;
    height: 64px;
    font-size: 12px;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #534C46;
}

.btn_footer {
    position: relative;
    display: flex;
    width: 100%;
    height: 32px;
    line-height: 16px;
    margin-bottom: 8px;
    font-size: 14px;
    align-items: center;
    color: #503F32;
    fill: #503F32;
}

.btn_footer i {
    display: block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
}

.btn_footer svg {
    display: block;
    width: 100%;
    height: 100%;
}


.btn_footer .icon_lang {
    background-image: url('../images/hg/flag_lang.svg');
    background-size: 100% auto;
}

.icon_lang.icon_hk {
    background-position: center top;
}

.icon_lang.icon_cn {
    background-position: center center;
}

.icon_lang.icon_en {
    background-position: center bottom;
}

.btn_footer .btn_acc_sub {
    display: block;
    height: 16px;
    line-height: 16px;
    font-size: 12px;
    color: #a78025;
}

.btn_footer select {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100%;
    opacity: 0;
}

.box_popup_selec {
    position: absolute;
    top: -9px;
    left: 8px;
    display: flex;
    width: 244px;
    padding: 0;
    align-items: center;
    justify-content: center;
    z-index: 3;
    visibility: collapse;
}

.box_popup_selec.on {
    visibility: visible;
}

.box_popup_selec.on .mask_popup {
    opacity: 1;
}

.mobile .btn_footer select,
.main_ios .btn_footer select {
    display: block !important;
}

.mobile .box_popup_selec,
.main_ios .box_popup_selec {
    display: none !important;
}

.popup_lange {
    width: 244px;
    padding: 8px 0;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0);
}

.on > .popup_lange {
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.24);
    transform: translateY(0);
}

.btn_popup_selec {
    position: relative;
    display: flex;
    width: 100%;
    height: 40px;
    padding: 0 16px;
    align-items: center;
    cursor: pointer;
}

.btn_popup_selec.on {
    color: #A78025;
}

.contantus_footer span {
    display: block;
    width: 100%;
    height: 24px;
    line-height: 24px;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 700;
    color: #503F32;
}

.contantus_footer p {
    display: flex;
    width: 100%;
    line-height: 16px;
    font-size: 12px;
}

.contantus_footer p ~ p {
    margin-top: 8px;
}

.contantus_footer a {
    color: #503F32;
}

.contantus_footer a ~ a {
    margin-left: 1em;
}

.box_relating {
    display: flex;
    width: 100%;
    height: 48px;
    padding: 0 16px;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #007ba8;
    cursor: pointer;
}

@media (pointer: fine) and (max-resolution: 2dppx), screen and (pointer: fine) and (-webkit-max-device-pixel-ratio: 2),
(-moz-touch-enabled: 0), screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .btn_footer select {
        display: none;
    }

    .btn_footer {
        cursor: pointer;
    }

    .btn_footer:hover span,
    .btn_footer:hover i {
        color: #A78025;
        fill: #A78025;
    }

    .btn_popup_selec:hover {
        background: rgba(0, 0, 0, 0.04);
    }

    .box_relating:hover {
        color: #008abd;
    }
}

.btn_footer:active {
    color: #86661E;
    fill: #86661E;
}

.btn_popup_selec:active {
    color: #a78025;
    background: rgba(0, 0, 0, 0.08);
}

.box_relating:active {
    color: #005e80;
}