@charset "UTF-8";

@font-face {
    font-family: "Roboto";
    src: url("../fonts/roboto/Roboto-Regular.eot");
    src: url("../fonts/roboto/Roboto-Regular.eot?") format("embedded-opentype"), url("../fonts/roboto/Roboto-Regular.woff2") format("woff2"), url("../fonts/roboto/Roboto-Regular.ttf") format("truetype"), url("../fonts/roboto/Roboto-Regular.svg") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Roboto";
    src: url("../fonts/roboto/Roboto-Bold.eot");
    src: url("../fonts/roboto/Roboto-Bold.eot?") format("embedded-opentype"), url("../fonts/roboto/Roboto-Bold.woff2") format("woff2"), url("../fonts/roboto/Roboto-Bold.ttf") format("truetype"), url("../fonts/roboto/Roboto-Bold.svg") format("svg");
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "LuckiestGuy";
    src: url("../fonts/luckiestgauy/LuckiestGuy-Regular.eot");
    src: url("../fonts/luckiestgauy/LuckiestGuy-Regular.eot?") format("embedded-opentype"), url("../fonts/luckiestgauy/LuckiestGuy-Regular.woff2") format("woff2"), url("../fonts/luckiestgauy/LuckiestGuy-Regular.ttf") format("truetype"), url("../fonts/luckiestgauy/LuckiestGuy-Regular.svg") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

.currency-table tbody tr {
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out
}

.btn-more,
.currency-select .list,
.language-dropdown .list,
.tournament-content {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out
}

.go-top-btn,
.tournament-heading {
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}

:root {
    --header-height: 60px
}

html {
    font-family: "Roboto", "微软雅黑", sans-serif;
    width: 100%;
    max-width: 100%;
    height: 100%;
    font-size: 16px;
    scroll-behavior: smooth
}

@media screen and (max-width:820px) {
    html {
        font-size: 12px
    }
}

body {
    width: 100%;
    min-height: 100vh;
    background-color: #0b9def;
    -webkit-overflow-scrolling: touch;
    /* padding-top: var(--header-height) */
}

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text
}

a,
li,
ul {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    text-decoration: none;
    list-style: none;
    padding: 0;
    color: inherit;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

a:focus,
li:focus,
ul:focus {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    outline: inherit
}

button {
    border: none;
    background-color: transparent;
    outline: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    cursor: pointer
}

button:focus {
    outline: none
}

strong {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-weight: normal
}

h1 {
    font-size: 0;
    text-indent: -9999px
}

img {
    display: block
}

input,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    resize: none
}

input:focus,
textarea:focus {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

select:focus {
    outline: none
}

main {
    position: relative
}

input,
select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    min-width: 1px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    cursor: pointer
}

.container,
.nav {
    max-width: 1090px;
    padding: 0 15px;
    margin: 0 auto;
    position: relative
}

@media screen and (max-width:480px) {

    .container,
    .nav {
        padding: 0 10px
    }
}

.flag {
    width: 34px;
    height: 20px;
    background-size: cover;
    background-position: center;
    display: inline-block;
    background-repeat: no-repeat;
    border-radius: 3px;
}

.flag.en-US {
    background-image: url(../images/icon/flag/us.svg)
}

.flag.zh-CN {
    background-image: url(../images/icon/flag/cn.svg)
}

.flag.zh-TW {
    background-image: url(../images/icon/flag/tw.svg)
}

.flag.id-ID {
    background-image: url(../images/icon/flag/id.svg)
}

.flag.ms-MY {
    background-image: url(../images/icon/flag/my.svg)
}

.flag.vi-VN {
    background-image: url(../images/icon/flag/vn.svg)
}

.flag.th-TH {
    background-image: url(../images/icon/flag/th.svg)
}

.flag.ko-KR {
    background-image: url(../images/icon/flag/kr.svg)
}

.flag:hover {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

.zh-CN .date-item-box {
    min-width: 156px
}

@-webkit-keyframes slogan {
    0% {
        -webkit-filter: brightness(100%);
        filter: brightness(100%);
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    25% {
        -webkit-filter: brightness(150%);
        filter: brightness(150%);
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    26% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    27% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    28% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    29% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-filter: brightness(100%);
        filter: brightness(100%)
    }

    75% {
        -webkit-filter: brightness(150%);
        filter: brightness(150%)
    }

    78% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    79% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    80% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    81% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    82% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-filter: brightness(100%);
        filter: brightness(100%)
    }
}

@keyframes slogan {
    0% {
        -webkit-filter: brightness(100%);
        filter: brightness(100%);
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    25% {
        -webkit-filter: brightness(150%);
        filter: brightness(150%);
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    26% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    27% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    28% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    29% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-filter: brightness(100%);
        filter: brightness(100%)
    }

    75% {
        -webkit-filter: brightness(150%);
        filter: brightness(150%)
    }

    78% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    79% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    80% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    81% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04)
    }

    82% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-filter: brightness(100%);
        filter: brightness(100%)
    }
}

@-webkit-keyframes blowUpModal {
    0% {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes blowUpModal {
    0% {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-keyframes spin3D {
    0% {
        -webkit-transform: rotate3d(0.5, 0.5, 0.5, 360deg);
        transform: rotate3d(0.5, 0.5, 0.5, 360deg)
    }

    to {
        -webkit-transform: rotate3d(0deg);
        transform: rotate3d(0deg)
    }
}

@keyframes spin3D {
    0% {
        -webkit-transform: rotate3d(0.5, 0.5, 0.5, 360deg);
        transform: rotate3d(0.5, 0.5, 0.5, 360deg)
    }

    to {
        -webkit-transform: rotate3d(0deg);
        transform: rotate3d(0deg)
    }
}

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes float {
    0% {
        -webkit-filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        -webkit-transform: translatey(0px);
        transform: translatey(0px)
    }

    50% {
        -webkit-filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        -webkit-transform: translatey(-20px);
        transform: translatey(-20px)
    }

    to {
        -webkit-filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        -webkit-transform: translatey(0px);
        transform: translatey(0px)
    }
}

@keyframes float {
    0% {
        -webkit-filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        -webkit-transform: translatey(0px);
        transform: translatey(0px)
    }

    50% {
        -webkit-filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        -webkit-transform: translatey(-20px);
        transform: translatey(-20px)
    }

    to {
        -webkit-filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        filter: drop-shadow(6px 10px 3px rgba(0, 0, 0, 0.24));
        -webkit-transform: translatey(0px);
        transform: translatey(0px)
    }
}

header {
    background-color: rgb(74, 155, 254, 0.5);  /* #121215; */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--header-height);
    z-index: 3;
    -webkit-box-shadow: 0 5px 14px rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.5)
}

.nav {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 1400px
}

.mobile .nav {
    padding: 0 16px
}

.nav-logo {
    height: 38px
}

.nav-logo img {
    margin-top: 3px;
    max-height: 100%
}

.mobile .nav-logo {
    height: 30px;
    text-align: center;
    width: calc(100% - 34px);
    margin-left: 24px
}

.mobile .nav-logo img {
    margin-top: 0px;
    display: inline-block
}

.language-dropdown {
    position: relative
}

.language-dropdown .default {
    height: var(--header-height);
    display: none
}

.language-dropdown .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px
}

.mobile .language-dropdown .default {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.mobile .language-dropdown .list {
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    padding: 0 8px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: rgb(18 18 21 / 72%);
    -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5019607843);
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5019607843);
    pointer-events: none;
    max-height: 0;
    overflow: hidden;
    gap: 10px
}

.mobile .language-dropdown .list.active {
    opacity: 1;
    padding: 10px 16px 14px 16px;
    pointer-events: initial;
    max-height: 500px
}

footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.5019607843);
    height: 48px
}

.copy-right {
    color: #fff;
    opacity: 0.8;
    font-size: 0.75rem
}

.banner {
    width: 100%;
    min-height: 25vw;
    position: relative;
    overflow: hidden
}

.bn-bg {
    width: 100%
}

.bn-money {
    width: 80%;
    position: absolute;
    top: 55%;
    right: 50%;
    -webkit-transform: translateX(50%);
    transform: translateX(50%)
}

.bn-subject {
    width: 50%;
    position: absolute;
    top: 78%;
    right: 50%;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
}

.bn-subject img {
    max-width: 100%;
    max-height: 70px;
    margin: 0 auto;
}

.bn-date {
    width: 30%;
    position: absolute;
    top: 92%;
    right: 50%;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
}

.bn-date img {
    width: 100%;
}

.bn-money img {
    width: 100%;
    -webkit-animation: slogan 4s;
    animation: slogan 4s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

.mobile .bn-money {
    width: 100%;
    top: 56%
}

.mobile .bn-subject {
    width: 80%;
    top: 72%
}

.mobile .bn-date {
    width: 70%;
    top: 90%
}

.mobile .bn-desc {
    width: 80%;
    top: 68%
}

.mobile.id-ID .bn-money {
    width: 90%
}

main {
    background: url(../images/kingbet_bg001.png) ;
    background-repeat: round;
    background-size: cover;
}

.mobile main {
    background-image: url(../images/kingbet_bg001.png);
    background-size: contain;
}

.index {
    min-height: calc(100vh - 64px);
    padding: -1rem 0 5rem
}

.index-heading {
    font-size: 1.125rem;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.625rem;
    padding: 2.8125rem 0 10px
}

.index-heading [class^=icon-] {
    color: #FFCC66;
    font-size: 1.75rem
}

.mobile .index-heading {
    padding-top: 20px;
    padding-bottom: 16px;
    max-width: calc(100% - 82px)
}

.tournament-block {
    margin: 0 auto;
    position: relative;
    -webkit-transform: translateY(-9vw);
    transform: translateY(-9vw);
    margin-bottom: -8vw;
    padding: 1.25rem 1.25rem 0
}

.tournament-block>div {
    z-index: 2
}

.tournament-block:after,
.tournament-block:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    width: 100%
}

.tournament-block:before {
    bottom: 0;
    height: 75%;
    /* background: -webkit-gradient(linear, left top, left bottom, color-stop(-20%, #0756BC), color-stop(40%, #1D007C), to(#0067C9));
    background: linear-gradient(180deg, #0756BC -20%, #1D007C 40%, #0067C9 100%); */
    z-index: 1;
    border-radius: 0 0 30px 40px
}

.tournament-block:after {
    height: 50%;
    /* background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #0756BC), color-stop(150%, #1D007C));
    background: linear-gradient(180deg, #0756BC 0, #1D007C 150%); */
    top: 0;
    /* -webkit-clip-path: ellipse(50% 50% at 50% 50%);
    clip-path: ellipse(50% 50% at 50% 50%) */
}

.mobile .tournament-block {
    padding: 0
}

.mobile .tournament-block:after,
.mobile .tournament-block:before {
    display: none
}

.mobile .tournament-block .tournament-main:after,
.mobile .tournament-block .tournament-main:before {
    display: none
}

.tournament-main {
    /* background: center/contain url(../images/common/kingbet_bg2.png) no-repeat; */
    position: relative;
    padding-bottom: 0.8125rem;
    aspect-ratio: 986/338;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.tournament-main>div {
    z-index: 2
}

.tournament-main:after,
.tournament-main:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%
}

.tournament-main:before {
    bottom: 0;
    height: 72%;
    /* background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #008AE0), to(#151A95));
    background: linear-gradient(180deg, #008AE0 0, #151A95 100%); */
    z-index: 1;
    /* border-radius: 0 0 30px 40px */
}

.tournament-main:after {
    /* height: 56%;
    background: #008AE0;
    top: 0;
    -webkit-clip-path: ellipse(50% 50% at 50% 50%);
    clip-path: ellipse(50% 50% at 50% 50%) */
}

.tournament-heading {
    width: 100%;
    position: relative;
    margin: 0 auto;
    /* background: center/contain url(../images/common/kingbet_bg2.png) no-repeat; */
    aspect-ratio: 986/338;
    max-width: 23.75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    padding-bottom: 1%;
    -webkit-transform: translateY(-30%);
    transform: translateY(-30%)
}

.tournament-heading .heading {
    text-transform: uppercase;
    font-size: 1.875rem;
    text-align: center;
    color: #fff;
    text-shadow: 2px 2px 0px #083469;
    font-family: "LuckiestGuy", "微软雅黑";
    letter-spacing: 1px;
    font-weight: 700;
    display: block
}

.mobile .tournament-heading {
    padding-bottom: 2%
}

.en-US .tournament-heading,
.id-ID .tournament-heading,
.ms-MY .tournament-heading {
    padding-bottom: 1.5%
}

.heading-date-box {
    font-family: "LuckiestGuy", "微软雅黑";
    font-size: 2.1875rem;
    color: #ffe62c;
    text-align: center;
    gap: 5px;
    text-transform: uppercase;
    position: relative;
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%);
    padding: 0 3.125rem;
    -webkit-filter: drop-shadow(2px 2px 0px rgba(0, 0, 0, 0.5));
    filter: drop-shadow(2px 2px 0px rgba(0, 0, 0, 0.5))
}

.heading-date-box sup {
    display: inline-block;
    margin: 0 0.5em 0 0.2em;
    font-size: 0.5em;
    text-transform: lowercase;
    vertical-align: super
}

.mobile .heading-date-box {
    font-size: 21px;
    padding: 0;
    margin-bottom: 5px
}

.tournament-content {
    text-align: center;
    color: #fff;
    padding: 0 20px;
    margin: 4rem 0 1.25rem;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: block;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0.9375rem
}

.mobile .tournament-content {
    padding: 0
}

.list-order {
    background: #032E7F;
    color: rgba(255, 255, 255, 0.7);
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
    padding: 9px 5px 2px 5px;
    position: absolute;
    top: -3px;
    left: -3px;
    width: calc(100% + 6px);
    border-radius: 10px 10px 0 0;
    z-index: 2
}

.list-order .number {
    display: inline-block;
    font-size: 1.75rem
}

.list-order .round {
    text-transform: uppercase;
    vertical-align: top
}

.zh-CN .list-order .round {
    vertical-align: middle;
    font-weight: bold
}

.vi-VN .list-order {
    direction: rtl
}

.vi-VN .list-order .round {
    vertical-align: middle;
    font-weight: bold
}

.mobile .list-order {
    background: #0536A5
}

.date-item {
    background: #062B57;
    border: 3px solid #46A0F7;
    color: rgba(255, 255, 255, 0.7);
    border-radius: 10px;
    padding-bottom: 0.5rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 20%;
    max-width: 220px;
    font-family: "LuckiestGuy";
    position: relative;
    padding-top: 2.8125rem
}

.date-item.active {
    background-color: #0F2E69;
    border-color: #BA6400;
    color: #fff
}

.date-item.active .list-order {
    background: #FE7C0C;
    color: #fff;
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.7098039216)
}

.mobile .date-item {
    min-width: 47%;
    max-width: 75px
}

.date-dash {
    display: block;
    font-size: 0.9375rem
}

.date-item-box {
    padding: 8px 0;
    text-align: justify;
    font-size: 36px;
    color: #FFFFFF;
    font-weight: bold;
}

.date-item-box sup {
    font-size: 0.5em;
    display: inline-block;
    margin: 0 0.4em 0 0.25em
}

.tournament-time {
    position: relative;
    text-align: center;
    color: #ffe62c;
    text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.5);
    font-family: "LuckiestGuy";
    font-size: 2rem
}

.tournament-time .gmt {
    color: #FFE162;
    font-size: 1rem;
    display: block
}

.tournament-time .dash {
    margin: 0 0.5rem
}

.mobile .tournament-time {
    font-size: 24px
}

.tournament-info {
    font-size: 0.8125rem;
    text-align: center;
    padding: 0.9375rem;
    position: relative;
    color: #c0eaff
}

.tournament-info p {
    padding: 0.3125rem 0
}

.tournament-info .title {
    margin-right: 0.2em;
    font-weight: bold
}

.tournament-info .content {
    font-weight: normal
}

.mobile .tournament-info {
    background: rgba(0, 0, 0, 0.3607843137);
    border-radius: 5px;
    text-align: left
}

.mobile .tournament-info span {
    display: block;
    margin: 3px 0
}

.point-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.point-item .head,
.point-item .value {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 2.625rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.point-item .head {
    background: #6174f2;
    color: #f9f377;
    font-size: 0.875rem;
    font-weight: bold;
    text-align: center;
}

.point-item .value {
    background: #88a9f3;
    color: #fff;
    font-size: 0.9375rem
}

.mobile .point-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.mobile .point-item:first-child {
    display: block;
    -ms-grid-column-span: 2;
    grid-column: span 2
}

.mobile .point-item .head {
    background: #6174f2
}

.points-block {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1px
}

.mobile .points-block {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr)
}

.currency-block {
    position: relative
}

.currency-select {
    position: absolute;
    right: 0;
    bottom: calc(100% + 12px)
}

.currency-select .list {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    background: #FFFFFF;
    -webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.3607843137);
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.3607843137);
    border-radius: 5px;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 16px 1fr 16px 1fr;
    grid-template-columns: repeat(3, 1fr);
    padding: 0 16px;
    gap: 16px;
    max-height: 0;
    width: 95vw;
    overflow: hidden;
    opacity: 0;
    pointer-events: none
}

.currency-select .list li {
    padding: 6px;
    font-size: 1rem;
    color: rgba(0, 0, 0, 0.7019607843);
    white-space: nowrap;
    text-align: center
}

.currency-select .list li.active {
    color: #c4801b
}

.currency-select .list.active {
    pointer-events: initial;
    opacity: 1;
    max-height: 1000px;
    padding: 16px
}

.currency-select .default {
    height: 30px;
    width: 78px;
    color: #fff;
    background: #0F3D9A;
    border: 1px solid #2760D3;
    border-radius: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 18px 0 2px;
    font-size: 0.9375rem;
    text-align: center
}

.currency-select .default:after {
    content: "\e901";
    font-family: "icomoon";
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7450980392);
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    position: absolute;
    top: 9px;
    right: 4px
}

.currency-table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 5px;
    overflow: hidden;
    color: #000;
    table-layout: fixed
}

.currency-table .table-index {
    width: 62px
}

.currency-table thead {
    color: #f9f377;
    font-weight: bold;
    background-color: #e96219;
    /* background-image: -webkit-gradient(linear, left top, left bottom, from(#008AE0), to(#151A95));
    background-image: linear-gradient(to bottom, #008AE0, #151A95) */
}

.currency-table thead:first-child tr th:last-child {
    font-size: 0.9375rem
}

.currency-table th {
    height: 2.5rem;
    border: solid 1px rgba(0, 0, 0, 0.1607843137);
    font-size: 0.875rem
}

.currency-table tbody tr:nth-of-type(odd) {
    background: #f2e2da
}

.currency-table tbody tr:nth-of-type(2n) {
    background: #D8E7EB
}

.currency-table tbody tr:hover {
    background-color: #a2bed6
}

.currency-table td {
    font-size: 0.8125rem;
    border-width: 0 1px 0 1px;
    border-style: solid;
    border-color: transparent;
    height: 2.5rem;
    text-align: center
}

.currency-table tbody tr:first-child td:first-child,
.currency-table tbody tr:nth-child(2) td:first-child,
.currency-table tbody tr:nth-child(3) td:first-child {
    color: transparent;
    background-position: center;
    background-size: 28px;
    background-repeat: no-repeat
}

.currency-table tbody tr:first-child td:first-child {
    background-image: url(../images/icon/ranking/icon_no_1.svg)
}

.currency-table tbody tr:nth-child(2) td:first-child {
    background-image: url(../images/icon/ranking/icon_no_2.svg)
}

.currency-table tbody tr:nth-child(3) td:first-child {
    background-image: url(../images/icon/ranking/icon_no_3.svg)
}

.mobile .currency-table {
    table-layout: auto
}

.mobile .currency-table .table-index {
    width: auto
}

.mobile .currency-table tbody tr:first-child td:first-child,
.mobile .currency-table tbody tr:nth-child(2) td:first-child,
.mobile .currency-table tbody tr:nth-child(3) td:first-child {
    background-size: 22px
}

.go-top-btn {
    width: 50px;
    border-radius: 50%;
    aspect-ratio: 1/1;
    position: fixed;
    bottom: 6vh;
    right: calc((100% - 1090px) / 2 - 50px);
    font-size: 1.25rem;
    color: #145B98;
    background: rgba(255, 255, 255, 0.7058823529);
    -webkit-box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.5450980392);
    box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.5450980392);
    border: 1px solid #D8E7EB;
    border-radius: 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    z-index: 2
}

.go-top-btn:hover {
    background: #fff
}

.go-top-btn:hover i {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: all 0.3s;
    transition: all 0.3s
}

.go-top-btn.active {
    opacity: 1;
    pointer-events: initial
}

@media screen and (max-width:1240px) {
    .go-top-btn {
        right: 10px
    }
}

@media screen and (max-width:820px) {
    .go-top-btn {
        bottom: 2vh;
        right: 10px;
        width: 45px
    }
}

.btn-more {
    display: block;
    margin: 2.0625rem auto;
    background: #0F3D9A;
    border: 1px solid #2760D3;
    border-radius: 18px;
    color: #fff;
    line-height: 2.125rem;
    padding: 0 1.125rem;
    font-size: 0.8125rem
}

.btn-more:hover {
    -webkit-filter: brightness(1.2);
    filter: brightness(1.2);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    padding: 0 1.625rem
}

.btn-more2 {
    display: block;
    width: 100%;
    height: 60px;
    margin: 2.0625rem auto 0;
    /* background: #0F3D9A; */
    background-image: url(../images/common/kingbet_activity_btn2.png);
    background-repeat: round;
    /* background-size: contain; */
    /* border: 1px solid #2760D3; */
    /* border-radius: 18px; */
    color: #1d1c1c;
    line-height: 1.125rem;
    padding: 0 1.125rem;
    font-size: 0.8125rem;
    font-weight: bold;
}

.btn-more2:hover {
    -webkit-filter: brightness(1.2);
    filter: brightness(1.2);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    /* background-image: url(../images/common/kingbet_activity_btn1.png); */
}

.btn-more2:active{
    background-image: url(../images/common/kingbet_activity_btn1.png);
}

.game-list2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 5%
}

.game-item2 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 130px
}

.game-item2 img {
    width: 100%
}

.game-list2 {
    gap: 6%
}

.game-list2 .game-item2 {
    padding: 30px 0 0 0;
    max-width: 130px
}

.game-item2 img {
    -webkit-filter: drop-shadow(0px 3px 10px rgba(0, 0, 0, 0.4));
    filter: drop-shadow(0px 3px 10px rgba(0, 0, 0, 0.4))
}

.loading-mask,
.modal {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 1000;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.btn-close {
    position: absolute;
    top: 20px;
    right: 25px;
    font-size: 18px;
    color: #131313
}

@media screen and (max-width:820px) {
    .btn-close {
        font-size: 16px
    }
}

.modal-box {
    border-radius: 10px;
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.4549019608);
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.4549019608);
    background-color: #ECECEC;
    width: 90%;
    max-width: 600px;
    min-height: 300px;
    padding: 1.5rem
}

.modal-box .title {
    font-weight: 600;
    font-size: 1.125rem;
    margin-bottom: 1.5625rem;
    display: block
}

.modal-box .content {
    color: #454545;
    font-size: 0.875rem;
    line-height: 1.5625rem
}

.modal-box ol {
    padding-left: 1em
}

.modal-box ol li {
    list-style: decimal;
    line-height: 24px
}

.modal-box ol li:not(:last-child) {
    margin-bottom: 1rem
}

.blowUpModal {
    -webkit-animation: blowUpModal 0.3s ease forwards;
    animation: blowUpModal 0.3s ease forwards
}

.mark-dot {
    display: inline-block;
    width: 1.625rem;
    aspect-ratio: 1/1;
    background: center/contain url(../images/icon/img_seastar.webp) no-repeat
}

.loading {
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 2px solid #e6b407;
    border-radius: 50%;
    border-top-color: transparent;
    -webkit-animation: spin 1000ms infinite linear;
    animation: spin 1000ms infinite linear;
    z-index: 1
}

.float-ad {
    position: fixed;
    bottom: 60px;
    right: 8px;
    -webkit-animation: float 3.6s ease-in-out infinite;
    animation: float 3.6s ease-in-out infinite
}

.float-ad img {
    width: 12.5rem
}

.mobile .float-ad {
    bottom: 60px;
    right: -6px
}

.mobile .float-ad img {
    width: 10rem
}

.game-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 5%
}

.game-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 150px
}

.game-item img {
    width: 100%
}

.game-list {
    gap: 6%
}

.game-list .game-item {
    padding: 30px 0 0 0;
    max-width: 174px
}

.game-item img {
    -webkit-filter: drop-shadow(0px 3px 10px rgba(0, 0, 0, 0.4));
    filter: drop-shadow(0px 3px 10px rgba(0, 0, 0, 0.4))
}

.common-title {
    width: 100%;
    position: relative;
    margin-bottom: 30px;
}

.common-title img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%,-50%);
}

.common-title2 {
    width: 100%;
    position: relative;
    right: 50%;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
}

.common-title2 img {
    width: 100%;
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
}

.common-window {
    width: 100%;
    position: relative;
    right: 50%;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
}

.common-window img {
    width: 100%;
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
}

.btn{
    /*将a转换为块元素*/
    display: block;
    /*设置宽高*/
    width: 308px;
    height: 119px;
    /* aspect-ratio: 308/119; */
    /* margin: 2.0625rem auto 0; */
    /*设置背景图片*/
    /*background-image: url(img/btn/link.png);*/
    background-image: url(../images/common/kingbet_activity_btn2.png);
    /*设置图片不重复*/
    background-repeat: no-repeat;
}

.btn:hover{
    /*设置鼠标移入链接时的背景图片*/
    /*background-image: url(img/btn/hover.png);*/
    background-image: url(../images/common/kingbet_activity_btn2.png);
    /*当hover状态时，希望图片可以向左移动*/
    /* background-position: -93px 0px; */
}

.btn:active{
    /*设置鼠标正在点击链接时的背景图片*/
    /*background-image: url(img/btn/active.png);*/
    background-image: url(../images/common/kingbet_activity_btn1.png);
    /*当active状态时，希望图片可以再一次向左移动*/
    /* background-position: -186px 0px; */
}