@font-face {
    font-family: "tomorrow";
    src: url("/Assets/fonts/tomorrow.ttf") format("truetype");
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: "tomorrowB";
    src: url("/Assets/fonts/tomorrowB.ttf") format("truetype");
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: "tomorrowSMB";
    src: url("/Assets/fonts/tomorrowSMB.ttf") format("truetype");
    font-weight: normal;
    font-style: normal
}

.ftomorrow {
    font-family: "tomorrow"
}

.ftomorrowB {
    font-family: "tomorrowB"
}

.ftomorrowSMB {
    font-family: "tomorrowSMB"
}

a,
abbr,
acronym,
address,
applet,
big,
blockquote,
body,
caption,
cite,
code,
dd,
del,
dfn,
div,
dl,
dt,
em,
fieldset,
font,
form,
h1,
h2,
h3,
h4,
h5,
h6,
html,
iframe,
ins,
kbd,
label,
legend,
li,
object,
ol,
p,
pre,
q,
s,
samp,
small,
span,
strike,
strong,
sub,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
tr,
tt,
ul,
var {
    border: 0;
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    margin: 0;
    outline: 0;
    padding: 0;
    vertical-align: baseline
}

:focus {
    outline: 0
}

ol,
ul {
    list-style: none
}

table {
    border-collapse: separate;
    border-spacing: 0
}

caption,
td,
th {
    font-weight: normal;
    text-align: left
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: ""
}

blockquote,
q {
    quotes: "" ""
}

a img {
    border: 0
}

figure {
    margin: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: "";
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

a:focus,
a:hover,
a:hover p,
select:active,
select:focus,
select:hover {
    text-decoration: none;
    outline: none !important
}

a,
a:link {
    text-decoration: none;
    outline: none !important;
    color: #fff
}

.clearfix:after {
    content: "";
    visibility: hidden;
    display: table;
    clear: both
}

::-webkit-input-placeholder {
    color: #1eadf8;
    font-family: "tomorrowB"
}

::-moz-placeholder {
    color: #1eadf8;
    font-family: "tomorrowB"
}

:-ms-input-placeholder {
    color: #1eadf8;
    font-family: "tomorrowB"
}

::-ms-input-placeholder {
    color: #1eadf8;
    font-family: "tomorrowB"
}

::placeholder {
    color: #1eadf8;
    font-family: "tomorrowB"
}

:-ms-input-placeholder {
    color: #1eadf8;
    font-family: "tomorrowB"
}

::-ms-input-placeholder {
    color: #1eadf8;
    font-family: "tomorrowB"
}

*,
.box_sizing_border_box {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.a100 {
    width: 100%;
    height: 100%;
    display: block
}

.c-p,
.c-pointer,
.cp {
    cursor: pointer
}

.p-r,
.pr {
    position: relative
}

.p-a,
.pa {
    position: absolute
}

.w100percent {
    width: 100%
}

.m__inline {
    margin-left: auto;
    margin-right: auto
}

.dFlex,
.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.aCenter,
.act {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.jCenter,
.jct {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.fCl {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

button,
input,
select {
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0
}

input,
select {
    font-family: "tomorrowB";
    font-size: clamp(15px, 3vw, 22px);
    color: #1eadf8
}

.tUpper,
.tup {
    text-transform: uppercase
}

.tUnder {
    text-decoration: underline
}

.tCenter,
.tct {
    text-align: center
}

.f-left {
    float: left
}

.f-right {
    float: right
}

.img-res {
    max-width: 100%;
    width: auto;
    height: auto
}

.c-white,
.cWhite {
    color: #ffffff !important
}

.c-black,
.cBlack {
    color: #000 !important
}

.cPage {
    color: #542e18 !important
}

.link-under {
    text-decoration: underline !important
}

.t-shadow {
    text-shadow: 0px 4px 0px rgba(0, 0, 0, 0.3)
}

.t-shadow-red {
    text-shadow: 0px 3px 0px rgb(204, 70, 30)
}

@-webkit-keyframes zoomInOut {
    0% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }

    50% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }

    to {
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }
}

@keyframes zoomInOut {
    0% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }

    50% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }

    to {
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }
}

@-webkit-keyframes glowing {
    0% {
        background-color: #B20000;
        -webkit-box-shadow: 0 0 3px #B20000
    }

    50% {
        background-color: #FF0000;
        -webkit-box-shadow: 0 0 40px #FF0000
    }

    to {
        background-color: #B20000;
        -webkit-box-shadow: 0 0 3px #B20000
    }
}

@keyframes glowing {
    0% {
        background-color: #B20000;
        -webkit-box-shadow: 0 0 3px #B20000
    }

    50% {
        background-color: #FF0000;
        -webkit-box-shadow: 0 0 40px #FF0000
    }

    to {
        background-color: #B20000;
        -webkit-box-shadow: 0 0 3px #B20000
    }
}

@-webkit-keyframes rock-boat {
    0% {
        -webkit-transform: rotate(0) translateY(0);
        transform: rotate(0) translateY(0)
    }

    50% {
        -webkit-transform: rotate(-7deg) translateY(-5px);
        transform: rotate(-7deg) translateY(-5px)
    }

    to {
        -webkit-transform: rotate(0) translateY(0);
        transform: rotate(0) translateY(0)
    }
}

@keyframes rock-boat {
    0% {
        -webkit-transform: rotate(0) translateY(0);
        transform: rotate(0) translateY(0)
    }

    50% {
        -webkit-transform: rotate(-7deg) translateY(-5px);
        transform: rotate(-7deg) translateY(-5px)
    }

    to {
        -webkit-transform: rotate(0) translateY(0);
        transform: rotate(0) translateY(0)
    }
}

@-webkit-keyframes move {
    0% {
        -webkit-transform: translate(0px, 0px);
        transform: translate(0px, 0px)
    }

    50% {
        -webkit-transform: translate(0px, 5px);
        transform: translate(0px, 5px)
    }

    to {
        -webkit-transform: translate(0px, 0px);
        transform: translate(0px, 0px)
    }
}

@keyframes move {
    0% {
        -webkit-transform: translate(0px, 0px);
        transform: translate(0px, 0px)
    }

    50% {
        -webkit-transform: translate(0px, 5px);
        transform: translate(0px, 5px)
    }

    to {
        -webkit-transform: translate(0px, 0px);
        transform: translate(0px, 0px)
    }
}

@-webkit-keyframes tada {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }

    10%,
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }

    10%,
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

html.root__page {
    scroll-behavior: smooth;
    overflow-x: hidden;
    font-size: 62.5%
}

body.wpage {
    font-family: "tomorrowB";
    font-size: 1.6rem;
    line-height: 1.5;
    color: #fff;
    background-color: #000000;
    min-height: 100vh;
    margin-inline: auto;
    overflow-x: hidden !important
}

@media only screen and (min-width:992px) {
    body.wpage {
        background: url(../images/full__big.jpg) #000000;
        background-size: 100% auto;
        background-repeat: no-repeat;
        background-position: center top;
        width: 100vw
    }
}

@media only screen and (max-width:991px) {
    body.wpage {
        background: url(../images/sm__full.jpg) #000000;
        background-position: center 0;
        background-size: 100% auto;
        background-repeat: no-repeat
    }
}

.limit__game {
    position: relative;
    width: 100%;
    margin-inline: auto
}

@media only screen and (min-width:992px) {
    .limit__game {
        max-width: 56.5104166667vw
    }
}

@media only screen and (max-width:991px) {
    .hidden__mobile {
        display: none !important
    }
}

@media only screen and (min-width:992px) {
    .hidden__PC {
        display: none !important
    }
}

.link-hv.active .img-hv,
.link-hv:hover .img-hv {
    display: inline-block
}

.link-hv .img-ac,
.link-hv .img-hv {
    width: 100%
}

.link-hv .img-hv {
    display: none;
    position: absolute;
    left: 0;
    top: 0
}

.btn-tranY {
    -webkit-transition: all 0.25s;
    transition: all 0.25s
}

.btn-tranY.active,
.btn-tranY:hover {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px)
}

.btn-Zoom {
    -webkit-transition: all 0.25s;
    transition: all 0.25s
}

.btn-Zoom.active,
.btn-Zoom:hover {
    -webkit-transform: scale(1.1) !important;
    transform: scale(1.1) !important
}

.mt-1per {
    margin-top: 1%
}

.mt-2per {
    margin-top: 2%
}

.mt-3per {
    margin-top: 3%
}

.mt-4per {
    margin-top: 4%
}

@media only screen and (max-width:667px) {
    .btn-img-hv {
        width: 60%
    }
}

.btn-img-hv .img-ac,
.btn-img-hv .img-hv {
    width: 100%
}

.btn-img-hv .img-hv {
    display: none;
    position: absolute;
    left: 0;
    top: 0
}

.btn-img-hv:hover .img-hv {
    display: inline
}

.btn-page {
    width: 160px;
    height: 43px
}

@media only screen and (min-width:768px) {
    .btn-page {
        width: 271px;
        height: 72px
    }
}

@media only screen and (min-width:992px) {
    .pagination {
        margin-top: 1.0416666667vw
    }
}

@media only screen and (max-width:991px) {
    .pagination {
        margin-top: 1.3333333333vw
    }
}

.pagination ul {
    text-align: center
}

.pagination ul li {
    display: inline-block;
    width: 4.6666666667vw;
    height: 4.6666666667vw;
    line-height: 4.6666666667vw;
    background: #000;
    font-size: 1.1rem;
    border-radius: 0.8vw;
    margin: 0 0.2666666667vw
}

@media only screen and (min-width:992px) {
    .pagination ul li {
        margin-top: 0.5208333333vw;
        width: 2.0833333333vw;
        height: 2.0833333333vw;
        line-height: 2.0833333333vw;
        font-size: 0.9375vw;
        border-radius: 0.2083333333vw
    }
}

.pagination ul li a {
    color: #fff
}

.pagination ul li.active,
.pagination ul li:hover {
    background: #c8391f
}

.pagination ul li.active a,
.pagination ul li:hover a {
    color: #fff
}

.slick-custom-dots .slick-dots {
    bottom: -25%
}

.slick-custom-dots .slick-dots li {
    background: #fff;
    border-radius: 10px;
    width: 14px;
    height: 14px;
    margin: 0 3px
}

@media only screen and (min-width:992px) {
    .slick-custom-dots .slick-dots li {
        margin: 0 5px
    }
}

.slick-custom-dots .slick-dots li.slick-active {
    background: #ffc333
}

.slick-custom-dots .slick-dots li button {
    width: 14px;
    height: 14px
}

.slick-custom-dots .slick-dots li button:before {
    width: 14px;
    height: 14px;
    content: ""
}

.slick-custom-dots.slick-dot-black .slick-dots li {
    background: #fff
}

.slick-arrow {
    width: 40px;
    height: 40px;
    background: url(../images/arrow-left.png) no-repeat center center;
    background-size: contain;
    z-index: 2
}

.slick-arrow:focus,
.slick-arrow:hover {
    background: url(../images/arrow-left.png) no-repeat center center;
    background-size: contain
}

.slick-arrow.slick-disabled {
    background: transparent
}

.slick-arrow:before {
    content: ""
}

@media only screen and (min-width:1024px) {
    .slick-arrow {
        width: 100px;
        height: 100px
    }
}

.slick-arrow.slick-prev {
    left: -9%
}

@media only screen and (min-width:1024px) {
    .slick-arrow.slick-prev {
        left: 7%
    }
}

.slick-arrow.slick-next:not(.slick-disabled) {
    right: -9%;
    background: url(../images/arrow-right.png) no-repeat center center;
    background-size: contain
}

@media only screen and (min-width:1024px) {
    .slick-arrow.slick-next:not(.slick-disabled) {
        right: 7%
    }
}

@media only screen and (min-width:992px) {
    .slick-arrow.slick-next:not(.slick-disabled) {
        right: 15%
    }
}

@-webkit-keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0
    }

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

@keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0
    }

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

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

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

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

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

.out-hv {
    -webkit-transition: all 0.5s;
    transition: all 0.5s
}

.out-hv:hover {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px)
}

.logo-top {
    position: absolute;
    top: 5.7291666667vw;
    right: 0
}

.main_head {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
    background: #1a1a1a;
    border-bottom: 1px solid #ff461e;
    height: 13.0666666667vw;
    width: 100%;
    padding: 0.2666666667vw
}

@media only screen and (min-width:992px) {
    .main_head {
        border-bottom: 0;
        height: 4.1666666667vw;
        padding: 0;
        background: url(../images/header/bg.jpg) no-repeat center center;
        background-size: 100% 100%;
        position: absolute
    }
}

#toggle-menu__header-page:checked~.navbar #menu__header-page .inner-menu__header-page:before {
    top: 0px;
    -webkit-transform: rotate(0);
    transform: rotate(0)
}

#toggle-menu__header-page:checked~.navbar #menu__header-page .inner-menu__header-page:after {
    top: 0px;
    -webkit-transform: rotate(0);
    transform: rotate(0)
}

#toggle-menu__header-page:checked~.navbar .navbar-content {
    right: 0
}

@media only screen and (max-width:991px) {
    .navbar .limit__game {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-pack: distribute;
        justify-content: space-around
    }
}

.left-header {
    width: 60%;
    float: left
}

.icon-name-game .icon-game img {
    position: relative;
    z-index: 2;
    width: 16vw;
    display: block
}

.txt-name-game {
    color: #ffffff;
    font-size: 3.3333333333vw;
    margin-top: 0.6666666667vw;
    margin-left: 1.3333333333vw
}

.navbar-content {
    z-index: 2;
    right: -100%;
    top: 10.6666666667vw;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    position: fixed;
    background: rgba(27, 20, 37, 0.9);
    width: 100%;
    height: calc(100% - 10.6666666667vw);
    padding-top: 4vw;
    padding-left: 0.6666666667vw;
    padding-right: 0.6666666667vw
}

@media only screen and (min-width:992px) {
    .navbar-content {
        left: 0;
        top: 0;
        display: block;
        background: transparent;
        height: auto;
        position: inherit;
        padding: 0;
        width: auto;
        float: right;
        margin-top: 1.5625vw
    }
}

@media only screen and (min-width:992px) {
    .navbar-content ul {
        text-align: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.navbar-content ul li {
    padding-top: 10px;
    padding-bottom: 13px;
    position: relative;
    border-bottom: 1px solid #3d3d3d
}

@media only screen and (min-width:992px) {
    .navbar-content ul li {
        padding: 0;
        display: inline-block;
        margin: 0 2.0833333333vw;
        border-bottom: 0
    }
}

.navbar-content ul li:before {
    position: absolute;
    content: ""
}

@media only screen and (max-width:991px) {
    .navbar-content ul li:before {
        width: 94%;
        height: 2px;
        left: 5px;
        top: 0
    }
}

@media only screen and (max-width:999px) {
    .navbar-content ul li:last-child:after {
        width: 94%;
        height: 2px;
        position: absolute;
        content: "";
        left: 5px;
        bottom: 0
    }
}

.navbar-content ul li a {
    color: #fff;
    font-size: 3.3333333333vw;
    position: relative
}

@media only screen and (min-width:992px) {
    .navbar-content ul li a {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        color: #fff;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        gap: 0 0.2604166667vw;
        font-size: 0.9375vw
    }
}

.navbar-content ul li a:hover {
    color: #1cc1fa
}

.link-download {
    float: left;
    width: 26.6666666667vw;
    height: 7.3333333333vw;
    line-height: 7.3333333333vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0.9333333333vw
}

@media only screen and (min-width:992px) {
    .link-download {
        margin-right: 0;
        float: right
    }
}

.link-download a {
    font-size: 4vw
}

.link-download a img {
    width: 100%;
    display: block
}

.icon-hamburger {
    float: right;
    margin-top: 2vw
}

.icon-hamburger #menu__header-page {
    display: inline-block;
    position: relative;
    width: 7.3333333333vw;
    height: 6vw;
    cursor: pointer
}

.icon-hamburger #menu__header-page .inner-menu__header-page {
    height: 0.6666666667vw;
    width: 100%;
    top: 2.4vw;
    background-color: #fff;
    position: absolute;
    -webkit-transition: -webkit-transform 0.2s ease 0s;
    transition: -webkit-transform 0.2s ease 0s;
    transition: transform 0.2s ease 0s;
    transition: transform 0.2s ease 0s, -webkit-transform 0.2s ease 0s
}

.icon-hamburger #menu__header-page .inner-menu__header-page:after,
.icon-hamburger #menu__header-page .inner-menu__header-page:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    height: 0.6666666667vw;
    width: 100%;
    background-color: #fff
}

.icon-hamburger #menu__header-page .inner-menu__header-page:before {
    top: -2vw
}

.icon-hamburger #menu__header-page .inner-menu__header-page:after {
    top: 1.7333333333vw
}

.icon-hamburger .menu__cus {
    width: 130%
}

.logo-header {
    position: absolute;
    left: 3%;
    top: 0
}

@media only screen and (min-width:1600px) {
    .logo-header {
        left: 15%
    }
}

@media only screen and (min-width:1920px) {
    .logo-header {
        left: 19%
    }
}

.footer__game {
    background: #000000;
    width: 100%;
    padding: 5.3333333333vw 0 5.3333333333vw;
    text-align: center;
    color: #fff;
    font-size: 2.6666666667vw;
    line-height: 1.5
}

@media only screen and (min-width:992px) {
    .footer__game {
        padding: 1.8229166667vw 0 1.8229166667vw;
        font-size: 0.8333333333vw
    }
}

.footer__game .listLinkFGFt a {
    margin-inline: 0.5208333333vw
}

.footer__game .listLinkFGFt img {
    width: 10.6666666667vw
}

@media only screen and (min-width:992px) {
    .footer__game .listLinkFGFt img {
        width: 3.0208333333vw
    }
}

.footer-link-privacy {
    margin-bottom: 10px
}

.footer-link-privacy a {
    color: #fff;
    text-decoration: none
}

.footer-link-privacy a:hover {
    color: #ffa000
}

.footer__game p {
    margin-bottom: 6px
}

.footer__game-inner {
    width: 100%;
    text-align: center;
    position: relative;
    margin: 0 auto
}

@media only screen and (min-width:992px) {
    .footer__game-inner {
        width: 52.0833333333vw
    }
}

.ftace__ace {
    position: absolute;
    display: block;
    text-indent: -999em;
    background: url(../images/footer/vmge.png) 0 0 no-repeat;
    background-size: contain;
    left: 0;
    top: -0.5208333333vw;
    width: 5.7291666667vw;
    height: 2.8645833333vw
}

@media only screen and (max-width:991px) {
    .ftace__ace {
        position: inherit;
        top: 0;
        margin: 0 auto 1.3333333333vw;
        width: 26.6666666667vw;
        height: 9.3333333333vw
    }
}

.footer__game-18 {
    position: absolute;
    right: 0;
    top: 0;
    width: 3.6458333333vw
}

@media only screen and (max-width:991px) {
    .footer__game-18 {
        width: 13.3333333333vw;
        display: block;
        position: relative;
        left: 50%;
        margin-top: 1.3333333333vw;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.w100per {
    width: 100%
}

.h100per {
    height: 100%
}

.left0 {
    left: 0
}

.top0 {
    top: 0
}

.fs1424px {
    font-size: clamp(1.4rem, 4vw, 2.4rem)
}

@media only screen and (max-width:1199px) {
    .box_game {
        padding-top: 20%;
        padding-bottom: 9%
    }
}

.tsdBlack {
    text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000
}

.tsdRed {
    text-shadow: 1px 0 0 #bb341a, -1px 0 0 #bb341a, 0 1px 0 #bb341a, 0 -1px 0 #bb341a, 1px 1px #bb341a, -1px -1px 0 #bb341a, 1px -1px 0 #bb341a, -1px 1px 0 #bb341a
}

.tsdBlue {
    text-shadow: 1px 0 0 #1a4fbb, -1px 0 0 #1a4fbb, 0 1px 0 #1a4fbb, 0 -1px 0 #1a4fbb, 1px 1px #1a4fbb, -1px -1px 0 #1a4fbb, 1px -1px 0 #1a4fbb, -1px 1px 0 #1a4fbb
}

.tsdGreen {
    text-shadow: 1px 0 0 #0d882a, -1px 0 0 #0d882a, 0 1px 0 #0d882a, 0 -1px 0 #0d882a, 1px 1px #0d882a, -1px -1px 0 #0d882a, 1px -1px 0 #0d882a, -1px 1px 0 #0d882a
}

.st__ {
    padding-top: 40px;
    padding-bottom: 80px
}

@media only screen and (max-width:1199px) {
    .st__ {
        padding-top: 5%;
        padding-bottom: 10%
    }
}

.btnRed {
    background: url(../images/btn/btnRed.png) no-repeat center center;
    background-size: 100% 100%
}

.btnBlue {
    background: url(../images/btn/btnBlue.png) no-repeat center center;
    background-size: 100% 100%
}

.btnGreen {
    background: url(../images/btn/btnGreen.png) no-repeat center center;
    background-size: 100% 100%
}

.bgInput {
    background: #19202e
}

.bgImgGift {
    background: url(../images/bg-img.png) no-repeat center center;
    background-size: 100% 100%
}

.bgImgGift2 {
    background: url(../images/bg-img2.png) no-repeat center center;
    background-size: 100% 100%
}

.eaGiftImg__ .thum img {
    width: auto;
    max-width: 80%
}

.eaGiftImg__ .thum .num {
    right: 0;
    bottom: 0;
    font-size: 2vw
}

@media only screen and (min-width:992px) {
    .eaGiftImg__ .thum .num {
        font-size: 0.78125vw
    }
}

.img-hv .in-img-hv {
    top: 0;
    left: 0;
    opacity: 0
}

.img-hv.active .in-img-hv,
.img-hv:hover .in-img-hv {
    opacity: 1
}

@media only screen and (max-width:1199px) {
    .list-img {
        width: 90%
    }
}

.list-img .thumb-img {
    background: url(../images/bg-img.png) no-repeat center center;
    background-size: 100% 100%
}

@media only screen and (max-width:1199px) {
    .list-img .thumb-img {
        padding: 6px 3px;
        width: 13vw;
        height: 13vw
    }
}

@media only screen and (min-width:1024px) {
    .list-img .thumb-img {
        width: 85px;
        height: 85px
    }
}

.list-img .thumb-img img {
    width: 90%;
    width: auto;
    max-width: 90%
}

.list-img .thumb-img .sl {
    line-height: 1;
    background: rgba(0, 0, 0, 0.6);
    padding: 2px;
    right: 0;
    bottom: 0;
    font-size: clamp(1rem, 2vw, 1.4rem)
}

#videoBgMb,
#videoBgPC {
    position: absolute;
    top: 0
}

#videoBgMb {
    width: 100%;
    top: 20px
}

#videoBgPC {
    width: 100vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.front__game:after {
    pointer-events: none;
    position: absolute;
    content: ""
}

.front__game .numRegAll__ .tNumReg__all {
    font-size: 4.6666666667vw
}

@media only screen and (min-width:992px) {
    .front__game .numRegAll__ .tNumReg__all {
        font-size: 1.8229166667vw
    }
}

@media only screen and (max-width:991px) {
    .logo__tfrG {
        z-index: 1;
        position: fixed;
        right: 0.5%;
        top: 0.5%;
        width: 20vw
    }
}

@media only screen and (min-width:992px) {
    .logo__tfrG {
        margin-top: 0.78125vw;
        width: 10.4166666667vw
    }
}

.txtSL__frt {
    width: 90vw;
    margin-top: 53.3333333333vw
}

@media only screen and (min-width:992px) {
    .txtSL__frt {
        margin-top: 16.9270833333vw;
        width: 40.2604166667vw
    }
}

.txtSL__frt .img__txtSL__ {
    width: 100%;
    pointer-events: none
}

.dlStore__ftTop_ {
    gap: 0 2vw;
    margin-top: 4vw
}

@media only screen and (min-width:992px) {
    .dlStore__ftTop_ {
        gap: 0 0.78125vw;
        margin-top: 1.5625vw;
        font-size: 0.78125vw
    }
}

.dlStore__ftTop_ .btnReg__ergly {
    width: 30vw;
    height: 8vw
}

@media only screen and (min-width:992px) {
    .dlStore__ftTop_ .btnReg__ergly {
        padding: 0;
        width: 10.4166666667vw;
        height: 3.125vw
    }
}

.dlStore__ftTop_ .aLink__Dlstore {
    gap: 0 5px;
    width: 30vw;
    height: 8vw
}

@media only screen and (min-width:992px) {
    .dlStore__ftTop_ .aLink__Dlstore {
        padding: 0;
        width: 10.4166666667vw;
        height: 3.125vw
    }
}

.dlStore__ftTop_ .aLink__Dlstore .icnDL__gamtop {
    width: 4vw
}

@media only screen and (min-width:992px) {
    .dlStore__ftTop_ .aLink__Dlstore .icnDL__gamtop {
        width: 1.5625vw
    }
}

.dlStore__ftTop_ .aLink__Dlstore .tSl__op_ {
    line-height: 1.3
}

@media only screen and (min-width:992px) {
    .dlStore__ftTop_ .aLink__Dlstore .tSl__op_ {
        font-size: 0.78125vw
    }
}

@media only screen and (min-width:992px) {
    .dlStore__ftTop_ .aLink__Dlstore .tSl__op_ .tsl__bil {
        font-size: 0.6770833333vw
    }
}

.ifFront__game_MB {
    background: url(../images/front/bgGift1.png) no-repeat center center;
    background-size: 100% 100%;
    width: 72.1333333333vw;
    height: 25.3333333333vw;
    gap: 0 2.6666666667vw
}

.ifFront__game_MB .bannergame_ifMB {
    width: 23.0666666667vw
}

.ifFront__game_MB .reg__checkRw {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.ifFront__game_MB .reg__checkRw .btnReg__ergly {
    width: 28.2666666667vw;
    height: 9.0666666667vw;
    font-size: 2.6666666667vw
}

.ifFront__game_MB .reg__checkRw .checkRward__ifMB .giftbtn {
    width: 27.3333333333vw
}

.ifFront__game_MB .reg__checkRw .checkRward__ifMB .teRward__ {
    font-size: 1.7333333333vw;
    color: #403659;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 1.2;
    padding-left: 4vw;
    text-shadow: 1px 0 0 #ffc808, -1px 0 0 #ffc808, 0 1px 0 #ffc808, 0 -1px 0 #ffc808, 1px 1px #ffc808, -1px -1px 0 #ffc808, 1px -1px 0 #ffc808, -1px 1px 0 #ffc808
}

.ifFront__game_PC {
    background: url(../images/front/bgGift2.png) no-repeat center center;
    background-size: 100% 100%
}

@media only screen and (min-width:992px) {
    .ifFront__game_PC {
        width: 34.8958333333vw;
        height: 6.4583333333vw;
        gap: 0 0.78125vw
    }
}

.ifFront__game_PC .lstIMG__gift_frtop {
    gap: 0 0.3125vw
}

.ifFront__game_PC .lstIMG__gift_frtop .eachG__frttop {
    width: 4.1666666667vw
}

.ifFront__game_PC .lstIMG__gift_frtop .eachG__frttop .thum__frt {
    background: url(../images/bg-img2.png) no-repeat center center;
    background-size: 100% 100%;
    width: 100%;
    height: 4.1666666667vw
}

.ifFront__game_PC .lstIMG__gift_frtop .eachG__frttop .thum__frt img {
    width: auto;
    max-width: 70%
}

.ifFront__game_PC .lstIMG__gift_frtop .eachG__frttop .thum__frt .num__ {
    right: 7%;
    bottom: 7%;
    font-size: 0.6770833333vw
}

.ifFront__game_PC .lstIMG__gift_frtop .eachG__frttop .nameGft__ {
    line-height: 1.1;
    font-size: 0.5729166667vw
}

@media only screen and (min-width:992px) {
    .ifFront__game_PC .btnReg__ergly {
        font-size: 0.78125vw;
        width: 9.6354166667vw;
        height: 2.6041666667vw
    }
}

.timeCountDown__ {
    background: url(../images/front/bgCDTime.png) no-repeat center center;
    background-size: 100% 100%;
    width: 42.9333333333vw;
    height: 52.5333333333vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ {
        position: absolute;
        width: 16.4583333333vw;
        height: 20.5208333333vw;
        left: 0.5208333333vw;
        top: 10.625vw
    }
}

@media only screen and (max-width:991px) {
    .timeCountDown__ {
        margin-inline: auto;
        margin-top: 9.7333333333vw
    }
}

.timeCountDown__ .noteTime__ {
    color: #2394ed;
    font-size: 2vw;
    gap: 0 0.6666666667vw;
    height: 8.6666666667vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .noteTime__ {
        font-size: 0.78125vw;
        gap: 0 0.2604166667vw;
        height: 3.3854166667vw
    }
}

.timeCountDown__ .noteTime__ .imgStar__noteTime {
    width: 3.2vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .noteTime__ .imgStar__noteTime {
        width: 1.25vw
    }
}

.timeCountDown__ .textDate__open {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: url(../images/front/bgDate.png) no-repeat center center;
    background-size: 100% 100%;
    line-height: 1.3;
    width: 35.7333333333vw;
    height: 12.4vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .textDate__open {
        width: 13.9583333333vw;
        height: 4.84375vw
    }
}

.timeCountDown__ .textDate__open .tDate___ {
    color: #dc3c10;
    font-size: 3.2vw;
    padding-top: 1.0666666667vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .textDate__open .tDate___ {
        font-size: 1.25vw;
        padding-top: 0.4166666667vw
    }
}

.timeCountDown__ .textDate__open .tDate___2 {
    color: #000;
    font-size: 2.2666666667vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .textDate__open .tDate___2 {
        font-size: 0.8854166667vw
    }
}

.timeCountDown__ .day__open {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    line-height: 1;
    height: 19.3333333333vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .day__open {
        height: 7.5520833333vw
    }
}

.timeCountDown__ .day__open .numDay__ {
    font-size: 12.1333333333vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .day__open .numDay__ {
        font-size: 4.7395833333vw
    }
}

.timeCountDown__ .day__open .numDay__2 {
    font-size: 3.2vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .day__open .numDay__2 {
        font-size: 1.25vw
    }
}

.timeCountDown__ .time2__countdown {
    background: url(../images/front/bgTime2.png) no-repeat center center;
    background-size: 100% 100%;
    color: #2394ed;
    font-size: 2.2666666667vw;
    width: 35.2vw;
    height: 5.2vw;
    margin-top: 1.6vw
}

@media only screen and (min-width:992px) {
    .timeCountDown__ .time2__countdown {
        font-size: 0.8854166667vw;
        width: 13.75vw;
        height: 2.03125vw;
        margin-top: 0.625vw
    }
}

@-webkit-keyframes zoomIcon {
    0% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50% {
        -webkit-transform: scale(1.1, 1.1);
        transform: scale(1.1, 1.1)
    }

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

@keyframes zoomIcon {
    0% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50% {
        -webkit-transform: scale(1.1, 1.1);
        transform: scale(1.1, 1.1)
    }

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

@-webkit-keyframes imgScrDown {

    0%,
    to {
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px)
    }

    50% {
        -webkit-transform: translateY(3px);
        transform: translateY(3px)
    }
}

@keyframes imgScrDown {

    0%,
    to {
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px)
    }

    50% {
        -webkit-transform: translateY(3px);
        transform: translateY(3px)
    }
}

.link__ {
    margin-top: 5.3333333333vw
}

@media only screen and (min-width:992px) {
    .link__ {
        margin-top: 7.8125vw
    }
}

.title__link img {
    width: 61.0666666667vw
}

@media only screen and (min-width:992px) {
    .title__link img {
        width: 23.5416666667vw
    }
}

.lstLInk__ {
    width: 84.6666666667vw;
    margin-top: 5.6vw
}

@media only screen and (min-width:992px) {
    .lstLInk__ {
        width: 66.6666666667vw;
        margin-top: 2.5vw
    }
}

.lstLInk__ .eacLInk__ {
    display: block;
    width: 38vw;
    height: 64.5333333333vw;
    margin-inline: 2vw
}

@media only screen and (min-width:992px) {
    .lstLInk__ .eacLInk__ {
        width: 14.6875vw;
        height: 25.0520833333vw;
        margin-inline: 0.78125vw
    }
}

.lstLInk__ .eacLInk__ .name__link {
    width: 100%;
    font-size: 1.8666666667vw;
    height: 6.6666666667vw
}

@media only screen and (min-width:992px) {
    .lstLInk__ .eacLInk__ .name__link {
        font-size: 0.7291666667vw;
        height: 2.3958333333vw
    }
}

.lstLInk__ .eacLInk__ .lstIMG__glink {
    gap: 0 0.6666666667vw;
    margin-top: 38.6666666667vw
}

@media only screen and (min-width:992px) {
    .lstLInk__ .eacLInk__ .lstIMG__glink {
        gap: 0 0.2604166667vw;
        margin-top: 15.1041666667vw
    }
}

.lstLInk__ .eacLInk__ .lstIMG__glink .eaGiftImg__ .thum {
    width: 8.2666666667vw;
    height: 8.2666666667vw
}

@media only screen and (min-width:992px) {
    .lstLInk__ .eacLInk__ .lstIMG__glink .eaGiftImg__ .thum {
        width: 3.2291666667vw;
        height: 3.2291666667vw
    }
}

.lstLInk__ .eacLInk__ .btnJooin_Lik__ {
    font-size: 2.4vw;
    width: 28.8vw;
    height: 8vw;
    margin-top: 1.0666666667vw
}

@media only screen and (min-width:992px) {
    .lstLInk__ .eacLInk__ .btnJooin_Lik__ {
        font-size: 0.9375vw;
        width: 11.25vw;
        height: 3.125vw;
        margin-top: 0.4166666667vw
    }
}

.lstLInk__ .eacLInk__1 {
    background: url(../images/link/bgea1.png) no-repeat center center;
    background-size: 100% 100%
}

.lstLInk__ .eacLInk__2 {
    background: url(../images/link/bgea2.png) no-repeat center center;
    background-size: 100% 100%
}

.lstLInk__ .eacLInk__3 {
    background: url(../images/link/bgea3.png) no-repeat center center;
    background-size: 100% 100%
}

.lstLInk__ .eacLInk__4 {
    background: url(../images/link/bgea4.png) no-repeat center center;
    background-size: 100% 100%
}

.all__ {
    margin-top: 14vw
}

@media only screen and (min-width:992px) {
    .all__ {
        margin-top: 8.3333333333vw
    }
}

.title__all img {
    width: 96.6666666667vw
}

@media only screen and (min-width:992px) {
    .title__all img {
        width: 37.6041666667vw
    }
}

.note__all_ {
    font-size: 2.4vw;
    margin-top: 1.3333333333vw
}

@media only screen and (min-width:992px) {
    .note__all_ {
        font-size: 0.9375vw;
        margin-top: 0.5208333333vw
    }
}

.numRegAll__ {
    background: url(../images/all/bgNumAll.png) no-repeat center center;
    background-size: 100% 100%;
    width: 94vw;
    height: 10.2666666667vw;
    margin-top: 2.6666666667vw;
    padding-left: 12.2666666667vw
}

@media only screen and (min-width:992px) {
    .numRegAll__ {
        width: 36.71875vw;
        height: 3.6979166667vw;
        margin-top: 1.0416666667vw;
        padding-left: 4.7916666667vw
    }
}

.numRegAll__ .tNumReg__all {
    font-size: 3.3333333333vw;
    width: 25.0666666667vw
}

@media only screen and (min-width:992px) {
    .numRegAll__ .tNumReg__all {
        font-size: 1.3020833333vw;
        width: 9.7916666667vw
    }
}

.numRegAll__ .tNumReg__all2 {
    font-size: 2.9333333333vw;
    margin-left: 2vw
}

@media only screen and (min-width:992px) {
    .numRegAll__ .tNumReg__all2 {
        font-size: 1.1458333333vw;
        margin-left: 0.78125vw
    }
}

.lstMoc__all {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 5.3333333333vw;
    width: 96vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all {
        margin-top: 3.125vw;
        width: 46.6145833333vw
    }
}

.lstMoc__all .process__out {
    border-radius: 1.0416666667vw;
    width: 100%;
    background: #000;
    height: 2.4vw;
    top: 13.3333333333vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .process__out {
        height: 1.1458333333vw;
        top: 6.3020833333vw
    }
}

.lstMoc__all .process__out .process__in {
    border-top-left-radius: 1.0416666667vw;
    border-bottom-left-radius: 1.0416666667vw;
    background: #dc3c10;
    border: 0.1041666667vw solid #000;
    min-width: 1%;
    height: 100%
}

.lstMoc__all .eaMoc__all {
    width: 22vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .eaMoc__all {
        width: 10.7291666667vw
    }
}

.lstMoc__all .eaMoc__all.active .numMoc__all {
    -webkit-filter: grayscale(0);
    filter: grayscale(0)
}

.lstMoc__all .eaMoc__all .numMoc__all {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    width: 9.6vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .eaMoc__all .numMoc__all {
        width: 4.53125vw
    }
}

.lstMoc__all .eaMoc__all .numMoc__all .imgNumber {
    width: 100%
}

.lstMoc__all .eaMoc__all .numMoc__all .tNum__regEach {
    top: 45%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    line-height: 1;
    right: -4vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .eaMoc__all .numMoc__all .tNum__regEach {
        right: -2.0833333333vw
    }
}

.lstMoc__all .eaMoc__all .numMoc__all .tNum__regEach .tbigReg__ {
    line-height: 0.8;
    font-size: 3.0666666667vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .eaMoc__all .numMoc__all .tNum__regEach .tbigReg__ {
        font-size: 1.484375vw
    }
}

.lstMoc__all .eaMoc__all .numMoc__all .tNum__regEach .tbigReg__2 {
    font-size: 1.3333333333vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .eaMoc__all .numMoc__all .tNum__regEach .tbigReg__2 {
        font-size: 0.625vw
    }
}

.lstMoc__all .eaMoc__all .lstGift_each__all {
    background: url(../images/all/bgLstImg_.png) no-repeat center center;
    background-size: 100% 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 22.9333333333vw;
    height: 22.9333333333vw;
    padding-top: 4.6666666667vw;
    padding-bottom: 4vw;
    padding-inline: 3.3333333333vw;
    gap: 0.8vw;
    margin-top: 5.3333333333vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .eaMoc__all .lstGift_each__all {
        width: 10.7291666667vw;
        height: 11.0416666667vw;
        padding-top: 2.3958333333vw;
        padding-bottom: 1.8229166667vw;
        padding-inline: 1.3020833333vw;
        gap: 0.3125vw;
        margin-top: 2.7083333333vw
    }
}

.lstMoc__all .eaMoc__all .lstGift_each__all .eaGiftImg__ .thum {
    width: 6.6666666667vw;
    height: 6.6666666667vw
}

@media only screen and (min-width:992px) {
    .lstMoc__all .eaMoc__all .lstGift_each__all .eaGiftImg__ .thum {
        width: 3.2291666667vw;
        height: 3.2291666667vw
    }
}

.game__ {
    margin-top: 8vw
}

@media only screen and (min-width:992px) {
    .game__ {
        margin-top: 6.25vw
    }
}

.title__game img {
    width: 60.2666666667vw
}

@media only screen and (min-width:992px) {
    .title__game img {
        width: 23.5416666667vw
    }
}

.outGame__wdt {
    width: 100%
}

@media only screen and (min-width:992px) {
    .outGame__wdt {
        width: 60.4166666667vw
    }
}

@media only screen and (min-width:992px) {
    .btnAct__hello {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-top: 2.6041666667vw;
        gap: 0 1.3020833333vw
    }
}

@media only screen and (max-width:991px) {
    .btnAct__hello {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        margin-top: 4vw
    }
}

.btnAct__hello .leftBTnACtion__ {
    gap: 0 1.3333333333vw
}

@media only screen and (min-width:992px) {
    .btnAct__hello .leftBTnACtion__ {
        gap: 0 0.78125vw
    }
}

.btnAct__hello .leftBTnACtion__ .btnActio__hls {
    font-size: 2.4vw;
    width: 20.6666666667vw;
    height: 7.0666666667vw
}

@media only screen and (min-width:992px) {
    .btnAct__hello .leftBTnACtion__ .btnActio__hls {
        font-size: 0.8333333333vw;
        width: 8.8541666667vw;
        height: 2.7604166667vw
    }
}

.btnAct__hello .rightInfo__ {
    background: url(../images/game/bgInfo.png) no-repeat center center;
    background-size: 100% 100%;
    width: 56.6666666667vw;
    height: 8.8vw;
    font-size: 2.6666666667vw
}

@media only screen and (min-width:992px) {
    .btnAct__hello .rightInfo__ {
        font-size: 0.9375vw;
        width: 22.1354166667vw;
        height: 3.4375vw
    }
}

@media only screen and (max-width:991px) {
    .btnAct__hello .rightInfo__ {
        margin-top: 4vw
    }
}

.btnAct__hello .rightInfo__ .nameUser__ {
    color: #ff6a00
}

.btnAct__hello .rightInfo__ .logOut__ {
    color: #dc3c10;
    text-decoration: underline;
    margin-left: 2vw
}

@media only screen and (min-width:992px) {
    .btnAct__hello .rightInfo__ .logOut__ {
        margin-left: 0.78125vw
    }
}

.imgRong__ {
    margin-top: 1.3333333333vw
}

@media only screen and (min-width:992px) {
    .imgRong__ {
        margin-top: 1.4583333333vw
    }
}

.imgRong__ .imgRong1 {
    width: 94.8vw
}

@media only screen and (min-width:992px) {
    .imgRong__ .imgRong2 {
        width: 49.8958333333vw
    }
}

.luotCOn__li {
    background: rgba(0, 0, 0, 0.6);
    display: inline-block;
    padding: 0.1333333333vw 6.6666666667vw;
    border-radius: 6px;
    font-size: 2.6666666667vw
}

@media only screen and (min-width:992px) {
    .luotCOn__li {
        padding: 0.1041666667vw 2.6041666667vw;
        font-size: 1.0416666667vw
    }
}

@media only screen and (max-width:991px) {
    .menGame__play {
        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;
        background: url(../images/game/bgGame1.png) no-repeat center center;
        background-size: 100% 100%;
        width: 88.9333333333vw;
        height: 31.3333333333vw;
        gap: 0 2.9333333333vw;
        margin-top: 2vw
    }
}

@media only screen and (min-width:992px) {
    .menGame__play {
        width: 55.0520833333vw;
        margin-top: 2.8645833333vw
    }
}

.menGame__play .btnChieuMo__game {
    width: 21.7333333333vw
}

@media only screen and (min-width:992px) {
    .menGame__play .btnChieuMo__game {
        width: 8.4895833333vw;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        top: -0.9375vw
    }
}

.menGame__play .lstGift__playgame {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 53.3333333333vw;
    gap: 2.1333333333vw
}

@media only screen and (min-width:992px) {
    .menGame__play .lstGift__playgame {
        width: 55.0520833333vw;
        height: 6.0416666667vw;
        background: url(../images/game/bgGame2.png) no-repeat center center;
        background-size: 100% 100%;
        gap: 0 0.8333333333vw
    }
}

.menGame__play .lstGift__playgame .eachGPlay__game {
    background: url(../images/bg-img.png) no-repeat center center;
    background-size: 100% 100%;
    width: 11.7333333333vw;
    height: 11.7333333333vw
}

@media only screen and (min-width:992px) {
    .menGame__play .lstGift__playgame .eachGPlay__game {
        width: 4.4270833333vw;
        height: 4.4270833333vw
    }
}

.menGame__play .lstGift__playgame .eachGPlay__game.active {
    background: url(../images/bg-img_ac.png) no-repeat center center;
    background-size: 100% 100%
}

@media only screen and (min-width:992px) {
    .menGame__play .lstGift__playgame .eachGPlay__game:nth-child(5) {
        margin-left: 10.4166666667vw
    }
}

.menGame__play .lstGift__playgame .eachGPlay__game img {
    width: auto;
    max-width: 80%
}

.lstGift__afterGetGame {
    background: url(../images/game/bgG1.png) no-repeat center center;
    background-size: 100% 100%;
    width: 98.5333333333vw;
    height: 130.5333333333vw;
    margin-top: 3.7333333333vw
}

@media only screen and (min-width:992px) {
    .lstGift__afterGetGame {
        background: url(../images/game/bgG2.png) no-repeat center center;
        background-size: 100% 100%;
        width: 59.4791666667vw;
        height: 46.1458333333vw;
        margin-top: 4.1666666667vw;
        padding-top: 2.8645833333vw;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

.lstGift__afterGetGame .img__titChieumo {
    width: 56.2666666667vw
}

@media only screen and (min-width:992px) {
    .lstGift__afterGetGame .img__titChieumo {
        width: 22.2916666667vw
    }
}

@media only screen and (max-width:991px) {
    .lstDt__getGift__game {
        margin-inline: auto;
        width: 81.0666666667vw
    }
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game {
        width: 31.40625vw
    }
}

.lstDt__getGift__game .each__giftGame__Change {
    width: 80.4vw;
    height: 19.3333333333vw;
    margin-bottom: 2vw
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game .each__giftGame__Change {
        width: 31.40625vw;
        height: 7.5520833333vw;
        margin-bottom: 0.78125vw
    }
}

.lstDt__getGift__game .each__giftGame__Change .name__gchagne {
    height: 6.6666666667vw;
    font-size: 2.6666666667vw;
    gap: 0 2vw;
    padding-left: 2.6666666667vw
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game .each__giftGame__Change .name__gchagne {
        height: 2.6041666667vw;
        font-size: 1.0416666667vw;
        gap: 0 0.78125vw;
        padding-left: 1.0416666667vw
    }
}

.lstDt__getGift__game .each__giftGame__Change .name__gchagne .imgG1__cnae {
    width: 5.7333333333vw
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game .each__giftGame__Change .name__gchagne .imgG1__cnae {
        width: 2.2395833333vw
    }
}

.lstDt__getGift__game .lstImg__GetBTn {
    height: 12vw;
    gap: 6vw
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game .lstImg__GetBTn {
        height: 4.6875vw;
        gap: 2.34375vw
    }
}

.lstDt__getGift__game .lstImg__GetBTn .lstIMG__sl__ {
    gap: 1.3333333333vw
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game .lstImg__GetBTn .lstIMG__sl__ {
        gap: 0.5208333333vw
    }
}

.lstDt__getGift__game .lstImg__GetBTn .lstIMG__sl__ .eaGiftImg__:not(.active) {
    -webkit-filter: grayscale(0.9);
    filter: grayscale(0.9)
}

.lstDt__getGift__game .lstImg__GetBTn .lstIMG__sl__ .eaGiftImg__ .thum {
    width: 8vw;
    height: 8vw
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game .lstImg__GetBTn .lstIMG__sl__ .eaGiftImg__ .thum {
        width: 3.125vw;
        height: 3.125vw
    }
}

.lstDt__getGift__game .lstImg__GetBTn .btnGetCode__ {
    width: 23.3333333333vw;
    height: 6vw;
    font-size: 2.1333333333vw
}

@media only screen and (min-width:992px) {
    .lstDt__getGift__game .lstImg__GetBTn .btnGetCode__ {
        width: 9.1145833333vw;
        height: 2.34375vw;
        font-size: 0.7291666667vw
    }
}

.lstDt__getGift__game .lstImg__GetBTn .btnGetCode__:not(.active) {
    -webkit-filter: grayscale(1);
    filter: grayscale(1)
}

.lstDt__getGift__game .each__giftGame__Change1 {
    background: url(../images/game/bgLg1.png) no-repeat center center;
    background-size: 100% 100%
}

.lstDt__getGift__game .each__giftGame__Change2 {
    background: url(../images/game/bgLg2.png) no-repeat center center;
    background-size: 100% 100%
}

.lstDt__getGift__game .each__giftGame__Change3 {
    background: url(../images/game/bgLg3.png) no-repeat center center;
    background-size: 100% 100%
}

.lstDt__getGift__game .each__giftGame__Change4 {
    background: url(../images/game/bgLg4.png) no-repeat center center;
    background-size: 100% 100%
}

.lstDt__getGift__game .each__giftGame__Change5 {
    background: url(../images/game/bgLg5.png) no-repeat center center;
    background-size: 100% 100%
}

.char__ {
    margin-top: 8vw
}

@media only screen and (min-width:992px) {
    .char__ {
        margin-top: 9.8958333333vw
    }
}

.title__char img {
    width: 66.9333333333vw
}

@media only screen and (min-width:992px) {
    .title__char img {
        width: 26.1458333333vw
    }
}

.menChar__ {
    width: 100vw;
    margin-top: 4vw
}

@media only screen and (min-width:992px) {
    .menChar__ {
        width: 57.2916666667vw;
        margin-top: 1.0416666667vw
    }
}

.slMenChar__ {
    width: 100%
}

.eacChar__ {
    display: none;
    width: 60vw;
    margin-left: auto
}

@media only screen and (min-width:992px) {
    .eacChar__ {
        width: 32.03125vw
    }
}

.eacChar__.active {
    display: block
}

.eacChar__ .imgChar__ {
    width: 59.3333333333vw;
    left: -2vw;
    top: 14.4vw
}

@media only screen and (min-width:992px) {
    .eacChar__ .imgChar__ {
        width: 22.03125vw;
        top: 0
    }
}

.eacChar__ .nameChar__ {
    font-size: 5.0666666667vw
}

@media only screen and (min-width:992px) {
    .eacChar__ .nameChar__ {
        font-size: 1.9791666667vw;
        margin-left: 3.90625vw
    }
}

.eacChar__ .nameChar__:before {
    pointer-events: none;
    position: absolute;
    content: "";
    background: url(../images/char/imgLineTop.png) no-repeat center center;
    background-size: 100% 100%;
    width: 59.3333333333vw;
    height: 14.6666666667vw;
    top: 1.3333333333vw;
    left: -19.3333333333vw
}

@media only screen and (min-width:992px) {
    .eacChar__ .nameChar__:before {
        width: 23.1770833333vw;
        height: 5.7291666667vw;
        top: 0.5208333333vw;
        left: -7.03125vw
    }
}

.eacChar__ .des_Char__ {
    background: url(../images/char/bgDes.png) no-repeat center center;
    background-size: 100% 100%;
    width: 59.3333333333vw;
    height: 28vw;
    font-size: 1.4666666667vw;
    padding-top: 6vw;
    padding-left: 10.6666666667vw;
    padding-right: 2.6666666667vw;
    margin-top: 4vw
}

@media only screen and (min-width:992px) {
    .eacChar__ .des_Char__ {
        width: 28.8541666667vw;
        height: 13.4895833333vw;
        font-size: 0.6770833333vw;
        padding-top: 2.8645833333vw;
        padding-left: 5.7291666667vw;
        padding-right: 2.0833333333vw;
        margin-top: 1.3020833333vw
    }
}

@media only screen and (min-width:992px) {
    .eacChar__ .des_Char__ .tDes_char__ {
        height: 9.6354166667vw;
        overflow-y: auto
    }
}

.eacChar__ .lstSkill__char {
    position: relative;
    z-index: 4;
    margin-left: 4vw;
    margin-top: 53.3333333333vw
}

@media only screen and (min-width:992px) {
    .eacChar__ .lstSkill__char {
        margin-left: 9.6354166667vw;
        margin-top: 1.3020833333vw
    }
}

.eacChar__ .lstSkill__char:before {
    pointer-events: none;
    position: absolute;
    content: "";
    background: url(../images/char/imgLineBottom.png) no-repeat center center;
    background-size: 100% 100%;
    width: 75.2vw;
    height: 18.4vw;
    top: -7.3333333333vw;
    left: -32.6666666667vw
}

@media only screen and (min-width:992px) {
    .eacChar__ .lstSkill__char:before {
        width: 29.375vw;
        height: 7.1875vw;
        top: -2.8645833333vw;
        left: -12.7604166667vw
    }
}

.eacChar__ .lstSkill__char img {
    width: 10vw
}

@media only screen and (min-width:992px) {
    .eacChar__ .lstSkill__char img {
        width: 4.0104166667vw
    }
}

.menListAva__char {
    width: 92.6666666667vw;
    margin-top: 5.2vw
}

@media only screen and (min-width:992px) {
    .menListAva__char {
        width: 57.2916666667vw;
        margin-top: 1.875vw
    }
}

.menListAva__char .slMenAva__char {
    background: url(../images/char/bgAvatar.png) no-repeat center center;
    background-size: 100% 100%;
    gap: 0 0.6666666667vw;
    width: 67.3333333333vw;
    height: 14vw;
    padding-inline: 4.6666666667vw
}

@media only screen and (min-width:992px) {
    .menListAva__char .slMenAva__char {
        width: 26.1458333333vw;
        height: 5.5729166667vw;
        margin-right: 2.34375vw;
        gap: 0 0.2604166667vw;
        padding-inline: 1.8229166667vw;
        margin-left: auto
    }
}

@media only screen and (max-width:991px) {
    .menListAva__char .slMenAva__char {
        margin-inline: auto
    }
}

.menListAva__char .slMenAva__char .avaTar__ {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    width: 10.8vw;
    margin-inline: 0.4vw
}

@media only screen and (min-width:992px) {
    .menListAva__char .slMenAva__char .avaTar__ {
        width: 4.21875vw;
        margin-inline: 0.15625vw
    }
}

.menListAva__char .slMenAva__char .avaTar__.slick-current {
    -webkit-filter: grayscale(0);
    filter: grayscale(0)
}

.menListAva__char .slMenAva__char .slick-arrow {
    top: 60%
}

@media only screen and (min-width:992px) {
    .menListAva__char .slMenAva__char .slick-arrow {
        width: 5.2083333333vw;
        height: 5.2083333333vw
    }
}

.menListAva__char .slMenAva__char .slick-arrow.slick-prev {
    left: -15%
}

@media only screen and (min-width:992px) {
    .menListAva__char .slMenAva__char .slick-arrow.slick-prev {
        left: -20%
    }
}

.menListAva__char .slMenAva__char .slick-arrow.slick-next {
    right: -15%
}

@media only screen and (min-width:992px) {
    .menListAva__char .slMenAva__char .slick-arrow.slick-next {
        right: -20%
    }
}

.feature__ {
    margin-top: 10vw
}

@media only screen and (min-width:992px) {
    .feature__ {
        margin-top: 7.1875vw
    }
}

.title__feature img {
    width: 60.2666666667vw
}

@media only screen and (min-width:992px) {
    .title__feature img {
        width: 23.5416666667vw
    }
}

.menSlideFT__ {
    margin-top: 7.6vw;
    width: 74vw
}

@media only screen and (min-width:992px) {
    .menSlideFT__ {
        margin-top: 5.3645833333vw;
        width: 36.71875vw
    }
}

.menSlideFT__ .eacSliFT__ {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    width: 74vw
}

@media only screen and (min-width:992px) {
    .menSlideFT__ .eacSliFT__ {
        width: 36.71875vw
    }
}

.menSlideFT__ .eacSliFT__ .imgBg__eaSlide {
    width: 100%
}

.menSlideFT__ .eacSliFT__ .imgMen__slide {
    width: 64.2666666667vw;
    left: 4.6666666667vw;
    top: 2.4vw
}

@media only screen and (min-width:992px) {
    .menSlideFT__ .eacSliFT__ .imgMen__slide {
        width: 32.03125vw;
        left: 2.1875vw;
        top: 1.25vw
    }
}

@media only screen and (min-width:992px) {
    .menSlideFT__ .slick-arrow.slick-prev {
        left: -15%
    }
}

@media only screen and (min-width:992px) {
    .menSlideFT__ .slick-arrow.slick-next {
        right: -15%
    }
}

.about___ {
    margin-top: 24vw;
    padding-bottom: 9.3333333333vw
}

@media only screen and (min-width:992px) {
    .about___ {
        margin-top: 10.9375vw;
        padding-bottom: 2.8645833333vw
    }
}

.title__about {
    font-size: 4vw
}

@media only screen and (min-width:992px) {
    .title__about {
        font-size: 1.5625vw
    }
}

.menAbout__ {
    margin-top: 4.2666666667vw
}

@media only screen and (min-width:992px) {
    .menAbout__ {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-top: 1.8229166667vw;
        width: 65.625vw;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
        position: relative;
        left: -2.8645833333vw
    }
}

.menAbout__ .leftAbout__ {
    background: url(../images/about/bgLeft.png) no-repeat center center;
    background-size: 100% 100%
}

@media only screen and (min-width:992px) {
    .menAbout__ .leftAbout__ {
        width: 25.6770833333vw;
        height: 8.8541666667vw;
        gap: 0 1.1458333333vw
    }
}

.menAbout__ .leftAbout__:after {
    pointer-events: none;
    position: absolute;
    content: ""
}

@media only screen and (min-width:992px) {
    .menAbout__ .leftAbout__:after {
        background: url(../images/about/lineLeft.png) no-repeat center center;
        background-size: 100% 100%;
        width: 8.4375vw;
        height: 5.1041666667vw;
        right: -8.4375vw;
        top: -0.6770833333vw
    }
}

@media only screen and (min-width:992px) {
    .menAbout__ .leftAbout__ .icG__about {
        width: 7.5520833333vw
    }
}

.menAbout__ .leftAbout__ .dlStore__ {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.menAbout__ .leftAbout__ .dlStore__ .aLink__Dlstore {
    line-height: 1.1;
    gap: 0 0.2604166667vw
}

@media only screen and (min-width:992px) {
    .menAbout__ .leftAbout__ .dlStore__ .aLink__Dlstore {
        width: 8.8541666667vw;
        height: 3.125vw;
        font-size: 0.5729166667vw
    }
}

.menAbout__ .rightAbout__ {
    width: 66.6666666667vw
}

@media only screen and (min-width:992px) {
    .menAbout__ .rightAbout__ {
        width: 25.5208333333vw
    }
}

.menAbout__ .rightAbout__:before {
    pointer-events: none;
    position: absolute;
    content: ""
}

@media only screen and (min-width:992px) {
    .menAbout__ .rightAbout__:before {
        background: url(../images/about/lineRight.png) no-repeat center center;
        background-size: 100% 100%;
        width: 5.8854166667vw;
        height: 3.4375vw;
        left: -3.59375vw;
        top: -1.71875vw
    }
}

.menAbout__ .rightAbout__ .title__rab {
    font-size: 2.4vw
}

@media only screen and (min-width:992px) {
    .menAbout__ .rightAbout__ .title__rab {
        font-size: 0.9375vw
    }
}

.menAbout__ .rightAbout__ .lstSocial__ab {
    background: url(../images/about/bgRight.png) no-repeat center center;
    background-size: 100% 100%;
    width: 100%;
    margin-top: 2.6666666667vw;
    height: 14.4vw
}

@media only screen and (min-width:992px) {
    .menAbout__ .rightAbout__ .lstSocial__ab {
        height: 5.5208333333vw;
        margin-top: 1.0416666667vw;
        gap: 0 0.5208333333vw
    }
}

.menAbout__ .rightAbout__ .lstSocial__ab .linkSCial__ab img {
    display: block;
    width: 11.2vw
}

@media only screen and (min-width:992px) {
    .menAbout__ .rightAbout__ .lstSocial__ab .linkSCial__ab img {
        width: 4.375vw
    }
}

.modal {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 9;
    color: #000000;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px)
}

.modal.open {
    display: block
}

.modal .content-modal {
    top: 45%;
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 9;
    width: 96%;
    max-width: 700px
}

.modal .content-modal:after,
.modal .content-modal:before {
    pointer-events: none;
    position: absolute;
    content: ""
}

.modal .wrapper-modal {
    background: url(../images/modal/bg-modal.png) no-repeat center center;
    background-size: 100% 100%;
    width: 100%;
    position: relative;
    min-height: 200px;
    padding: 2% 2%;
    border-top: 0
}

@media only screen and (min-width:768px) {
    .modal .wrapper-modal {
        min-height: 300px
    }
}

.modal .wrapper-modal:before {
    pointer-events: none;
    position: absolute;
    content: ""
}

@media only screen and (min-width:1024px) {
    .modal .wrapper-modal:before {
        width: 130px;
        height: 210px;
        background: url(../images/modal/art.png) no-repeat center center;
        background-size: contain;
        bottom: 0;
        left: -85px;
        pointer-events: none
    }
}

.modal .wrapper-modal .ic_br,
.modal .wrapper-modal .ic_tl {
    pointer-events: none
}

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

    .modal .wrapper-modal .ic_br,
    .modal .wrapper-modal .ic_tl {
        width: 15vw
    }
}

.modal .wrapper-modal .ic_tl {
    left: -4%;
    top: 0
}

.modal .wrapper-modal .ic_br {
    right: -7%;
    bottom: 3%
}

.modal .main-modal {
    position: relative;
    z-index: 1
}

.modal .title-modal {
    text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
    color: #fff;
    background: url(../images/modal/bgTit.png) no-repeat center center;
    background-size: 100% 100%;
    font-size: clamp(13px, 3vw, 20px);
    line-height: 1.2;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 3% 0%;
    width: 100%
}

@media only screen and (min-width:1024px) {
    .modal .title-modal {
        padding: 13px 0
    }
}

.modal .note {
    width: 80%;
    margin-top: 15px;
    font-size: clamp(1.3rem, 3.5vw, 1.8rem)
}

@media only screen and (min-width:768px) {
    .modal .note {
        margin-top: 25px
    }
}

.modal .note a {
    color: #ffe138;
    text-decoration: underline
}

.close_modal {
    position: absolute;
    background: url(../images/modal/close-modal.png) no-repeat center center;
    background-size: 100%;
    top: -38px;
    right: 0%;
    width: 40px;
    height: 40px;
    cursor: pointer;
    z-index: 99;
    -webkit-transition: all 0.5s;
    transition: all 0.5s
}

@media only screen and (min-width:768px) {
    .close_modal {
        width: 60px;
        height: 60px;
        top: -50px;
        right: -10px
    }
}

.close_modal-full {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: 1
}

#modal__confirm .wrapper-modal,
#modal__giftcode .wrapper-modal,
#modal__login .wrapper-modal,
#modal__login2 .wrapper-modal,
#modal__mamoi .wrapper-modal,
#modal__server .wrapper-modal {
    padding: 3% 0% 5%
}

#modal__confirm .helloUser,
#modal__giftcode .helloUser,
#modal__login .helloUser,
#modal__login2 .helloUser,
#modal__mamoi .helloUser,
#modal__server .helloUser {
    font-size: clamp(14px, 3vw, 24px)
}

#modal__confirm .noteEmail,
#modal__giftcode .noteEmail,
#modal__login .noteEmail,
#modal__login2 .noteEmail,
#modal__mamoi .noteEmail,
#modal__server .noteEmail {
    font-size: clamp(10px, 2.7vw, 18px)
}

#modal__confirm .box-input,
#modal__confirm .login-fb,
#modal__giftcode .box-input,
#modal__giftcode .login-fb,
#modal__login .box-input,
#modal__login .login-fb,
#modal__login2 .box-input,
#modal__login2 .login-fb,
#modal__mamoi .box-input,
#modal__mamoi .login-fb,
#modal__server .box-input,
#modal__server .login-fb {
    width: 80%;
    max-width: 462px;
    height: 50px;
    line-height: 50px;
    font-size: clamp(14px, 3.5vw, 22px);
    margin-bottom: 2%
}

@media only screen and (min-width:768px) {

    #modal__confirm .box-input,
    #modal__confirm .login-fb,
    #modal__giftcode .box-input,
    #modal__giftcode .login-fb,
    #modal__login .box-input,
    #modal__login .login-fb,
    #modal__login2 .box-input,
    #modal__login2 .login-fb,
    #modal__mamoi .box-input,
    #modal__mamoi .login-fb,
    #modal__server .box-input,
    #modal__server .login-fb {
        height: 65px;
        line-height: 65px
    }
}

#modal__confirm .login-fb,
#modal__giftcode .login-fb,
#modal__login .login-fb,
#modal__login2 .login-fb,
#modal__mamoi .login-fb,
#modal__server .login-fb {
    margin-top: 3%;
    color: #915024
}

#modal__confirm .login-fb a,
#modal__giftcode .login-fb a,
#modal__login .login-fb a,
#modal__login2 .login-fb a,
#modal__mamoi .login-fb a,
#modal__server .login-fb a {
    color: #000
}

#modal__confirm .box-input,
#modal__giftcode .box-input,
#modal__login .box-input,
#modal__login2 .box-input,
#modal__mamoi .box-input,
#modal__server .box-input {
    font-size: clamp(16px, 4vw, 25px)
}

#modal__confirm .btn-log,
#modal__giftcode .btn-log,
#modal__login .btn-log,
#modal__login2 .btn-log,
#modal__mamoi .btn-log,
#modal__server .btn-log {
    color: #fff5e1;
    font-size: clamp(14px, 5vw, 28px);
    width: 160px;
    height: 45px
}

@media only screen and (min-width:768px) {

    #modal__confirm .btn-log,
    #modal__giftcode .btn-log,
    #modal__login .btn-log,
    #modal__login2 .btn-log,
    #modal__mamoi .btn-log,
    #modal__server .btn-log {
        width: 220px;
        height: 65px
    }
}

#modal__login .lstG_RegLLL__ .name__gElres__ {
    font-size: clamp(13px, 3.5vw, 23px)
}

#modal__login .lstG_RegLLL__ .lstImg__reg__modal {
    gap: 0 10px;
    margin-top: 1%
}

#modal__login .lstG_RegLLL__ .lstImg__reg__modal .eachImg__regModal {
    background: url(../images/bg-img.png) no-repeat center center;
    background-size: 100% 100%;
    width: 10vw;
    height: 10vw;
    max-width: 50px;
    max-height: 50px
}

#modal__login .lstG_RegLLL__ .lstImg__reg__modal .eachImg__regModal img {
    width: auto;
    max-width: 95%
}

#modal__login .lstG_RegLLL__ .lstImg__reg__modal .eachImg__regModal .num {
    color: #fff;
    padding: 1px 2px;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.5);
    font-size: clamp(5px, 1.5vw, 11px);
    right: 0;
    bottom: 0
}

#modal__email .main-modal {
    margin-top: 3%
}

#modal__confirm .listGiftCongrat,
#modal__giftcode .listGiftCongrat,
#modal__mamoi .listGiftCongrat {
    gap: 0 10px;
    margin-block: 2% 4%
}

#modal__confirm .boxGiftCode,
#modal__giftcode .boxGiftCode,
#modal__mamoi .boxGiftCode {
    margin-top: 3%
}

#modal__confirm #codeMamoi,
#modal__confirm #myGiftcode,
#modal__giftcode #codeMamoi,
#modal__giftcode #myGiftcode,
#modal__mamoi #codeMamoi,
#modal__mamoi #myGiftcode {
    width: 100%;
    height: 100%
}

#modal__confirm .btn-copy,
#modal__giftcode .btn-copy,
#modal__mamoi .btn-copy {
    color: #ffdb9d;
    width: 35%;
    height: 60px;
    font-size: clamp(16px, 4vw, 28px)
}

#modal__confirm .dlPopup,
#modal__giftcode .dlPopup,
#modal__mamoi .dlPopup {
    margin-top: 5%;
    gap: 0 10px
}

#modal__confirm .dlPopup .itDLPC img,
#modal__giftcode .dlPopup .itDLPC img,
#modal__mamoi .dlPopup .itDLPC img {
    width: 40vw;
    max-width: 201px
}

#modal__login2 .note,
#modal__mamoi .note,
#modal__server .note {
    width: 70%
}

#modal__login2 .form-control,
#modal__mamoi .form-control,
#modal__server .form-control {
    width: 80%;
    max-width: 460px;
    height: 45px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin-bottom: 10px
}

@media only screen and (min-width:768px) {

    #modal__login2 .form-control,
    #modal__mamoi .form-control,
    #modal__server .form-control {
        height: 55px;
        margin-bottom: 15px
    }
}

#modal__login2 .form-control input,
#modal__login2 .form-control select,
#modal__mamoi .form-control input,
#modal__mamoi .form-control select,
#modal__server .form-control input,
#modal__server .form-control select {
    width: 100%;
    height: 100%;
    font-size: clamp(13px, 2.8vw, 20px)
}

#modal__login2 .form-control select,
#modal__mamoi .form-control select,
#modal__server .form-control select {
    padding-left: 5%;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: url(../images/modal/icon-down.png) no-repeat 96% center;
    background-size: 4%
}

@media only screen and (min-width:768px) {

    #modal__login2 .form-control select,
    #modal__mamoi .form-control select,
    #modal__server .form-control select {
        background-size: auto
    }
}

#modal__login2 .form-control select option,
#modal__mamoi .form-control select option,
#modal__server .form-control select option {
    background: rgb(0, 0, 0);
    color: #fff
}

#modal__login2 .btn-login,
#modal__mamoi .btn-login,
#modal__server .btn-login {
    font-size: clamp(16px, 4vw, 30px);
    width: 180px;
    height: 50px;
    line-height: 50px
}

@media only screen and (min-width:768px) {

    #modal__login2 .btn-login,
    #modal__mamoi .btn-login,
    #modal__server .btn-login {
        width: 260px;
        height: 70px;
        line-height: 70px
    }
}

#modal__login2 .other-login {
    margin-top: 10px;
    gap: 0 10px
}

@media only screen and (max-width:767px) {
    #modal__login2 .other-login {
        margin-top: 10px;
        gap: 0 5px
    }
}

#modal__login2 .other-login a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

@media only screen and (max-width:767px) {
    #modal__login2 .other-login a img {
        width: 50px
    }
}

#modal__result .content-modal {
    max-width: 600px
}

#modal__result .wrapper-modal {
    min-height: 200px
}

@media only screen and (min-width:768px) {
    #modal__result .wrapper-modal {
        min-height: 300px
    }
}

#modal__result .main-modal {
    width: 90%;
    padding-top: 3%
}

#modal__result .helloUser {
    line-height: 1.2;
    font-size: clamp(14px, 3vw, 23px)
}

#modal__result .listGiftCongrat {
    margin-top: 3%;
    gap: 4px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#modal__result .listGiftCongrat .thumb-img img {
    width: auto;
    max-width: 80%
}

#modal__result .listGiftCongrat .thumb-img .sl__cus {
    width: 13vw;
    height: 13vw;
    max-width: 30px;
    max-height: 30px;
    line-height: 1;
    color: #fdf8b9;
    font-size: clamp(17px, 3.5vw, 25px);
    background: #e87842;
    border: 1px solid #ffeea4;
    border-radius: 50%;
    top: 55%;
    padding-bottom: 15%
}

#modal__result .text-gc {
    width: 75%;
    font-size: clamp(20px, 6vw, 28px);
    border-radius: 15px;
    background: #322826;
    padding: 10px 0;
    margin-top: 5%
}

#modal__result .btn-okay {
    margin-top: 3%;
    width: 210px;
    height: 55px
}

#modal__result .btn-close {
    display: inline-block;
    font-size: clamp(17px, 5vw, 30px);
    margin-top: 2%;
    padding: 2% 5%
}

#modal__alert {
    z-index: 99
}

@media only screen and (min-width:768px) {
    #modal__alert .wrapper-modal {
        height: 250px
    }
}

#modal__alert .detail-alert {
    padding: 5% 3% 2%;
    line-height: 1.3;
    min-height: 150px
}

#modal__alert .detail-alert .text-alert {
    font-size: clamp(13px, 3vw, 20px)
}

.modal__content {
    overflow: auto
}

.modal__content .content-modal {
    max-width: 750px
}

#modal__mission .wrapper-modal {
    min-height: inherit
}

#modal__mission .tit-form {
    padding-top: 5%;
    margin-bottom: 0
}

.list-mission {
    overflow-y: auto;
    padding-top: 1%;
    height: 350px
}

@media only screen and (min-width:768px) {
    .list-mission {
        height: 450px
    }
}

@media only screen and (min-width:1024px) {
    .list-mission {
        height: 600px
    }
}

.item-mission {
    color: #c8391f;
    width: 98%;
    padding-bottom: 1%;
    margin-bottom: 1%
}

.item-mission .stt {
    background: url(../images/modal/stt.png) no-repeat center center;
    background-size: contain;
    width: 5vw;
    height: 5vw;
    max-width: 33px;
    max-height: 33px
}

.item-mission .des-mission {
    line-height: 1.1;
    margin-left: 2%;
    margin-right: 2%;
    width: 60%
}

.item-mission .des-mission .des-top {
    border-bottom: 1px solid #cacaca;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: clamp(13px, 3vw, 18px)
}

.item-mission .des-mission .des-bottom {
    font-style: italic;
    color: #1290f7;
    line-height: 1.2;
    margin-top: 1%;
    font-size: clamp(12px, 2.7vw, 16px)
}

.item-mission .btn-get-luot {
    font-size: clamp(10px, 2vw, 16px);
    padding-block: 3% 3%
}

@media only screen and (max-width:767px) {
    .item-mission .btn-get-luot {
        width: 100px
    }
}

@media only screen and (min-width:768px) {
    .item-mission .btn-get-luot {
        width: 150px;
        height: 50px
    }
}

.item-mission.done .btn-get-luot {
    -webkit-filter: grayscale(1);
    filter: grayscale(1)
}

#modal__doiqua .f_t_dangco {
    font-size: clamp(10px, 3vw, 16px);
    line-height: 1
}

@media only screen and (max-width:767px) {
    #modal__doiqua .f_t_dangco .bg-havevp {
        width: 170px
    }
}

#modal__doiqua .listBallHas {
    gap: 0 6px
}

@media only screen and (min-width:1024px) {
    #modal__doiqua .listBallHas {
        gap: 0 15px
    }
}

#modal__doiqua .listBallHas .itBallHas .imgBall {
    width: 10vw;
    max-width: 50px
}

#modal__doiqua .listBallHas .itBallHas .sl-ball {
    font-size: clamp(12px, 2.5vw, 16px)
}

#modal__doiqua .listDoiQua {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 5px 1fr;
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px 5px;
    margin-top: 3%;
    width: 90%;
    max-width: 570px
}

@media only screen and (min-width:768px) {
    #modal__doiqua .listDoiQua {
        grid-gap: 10px
    }
}

@media only screen and (min-width:1024px) {
    #modal__doiqua .listDoiQua {
        grid-gap: 20px 30px
    }
}

#modal__doiqua .listDoiQua .itDoiQua .boxItDoiqua {
    background: url(../images/doiqua_popup/bg_it_doiqua.html) no-repeat center center;
    background-size: 100% 100%;
    padding: 5px 0
}

@media only screen and (min-width:1024px) {
    #modal__doiqua .listDoiQua .itDoiQua .boxItDoiqua {
        width: 267px;
        padding: 10px 0
    }
}

#modal__doiqua .listDoiQua .itDoiQua .listImgDq {
    gap: 0 6px
}

@media only screen and (min-width:1024px) {
    #modal__doiqua .listDoiQua .itDoiQua .listImgDq {
        gap: 0 10px
    }
}

#modal__doiqua .listDoiQua .itDoiQua .listImgDq .thumbImg img {
    width: 10vw;
    max-width: 50px
}

#modal__doiqua .listDoiQua .itDoiQua .needBall {
    font-size: clamp(13px, 3vw, 16px);
    gap: 0 5px
}

@media only screen and (min-width:1024px) {
    #modal__doiqua .listDoiQua .itDoiQua .needBall {
        gap: 0 7px
    }
}

#modal__doiqua .listDoiQua .itDoiQua .needBall .imgBall {
    width: 5vw;
    max-width: 30px
}

#modal__doiqua .btn-doiqua {
    display: inline-block;
    padding: 5px 25px;
    font-size: clamp(14px, 3vw, 18px)
}

@media only screen and (min-width:1024px) {
    #modal__doiqua .btn-doiqua {
        padding: 8px 30px
    }
}

#modal__doiqua .btn-doiqua:not(.active) {
    -webkit-filter: grayscale(1);
    filter: grayscale(1)
}

#modal__history .content-modal {
    max-width: 800px
}

#modal__history .wrapper-modal .main-modal {
    margin: 0 auto
}

#modal__history .tab-history {
    margin-top: 1%;
    gap: 0 10px;
    width: 80%;
    padding-top: 15px
}

@media only screen and (min-width:768px) {
    #modal__history .tab-history {
        gap: 0 20px
    }
}

#modal__history .tab-history .tab-item {
    font-size: clamp(12px, 2.5vw, 18px);
    width: 120px;
    height: 35px
}

@media only screen and (min-width:768px) {
    #modal__history .tab-history .tab-item {
        width: 190px;
        height: 50px
    }
}

#modal__history .tab-history .tab-item:not(.active) {
    -webkit-filter: grayscale(1);
    filter: grayscale(1)
}

#modal__history .tab-content-his {
    display: none
}

#modal__history .tab-content-his.active {
    display: block
}

#modal__history .table-history {
    width: 96%;
    max-height: 300px;
    overflow-y: auto
}

@media only screen and (min-width:414px) {
    #modal__history .table-history {
        max-height: 350px
    }
}

@media only screen and (min-width:768px) {
    #modal__history .table-history {
        max-height: 450px
    }
}

@media only screen and (min-width:1024px) {
    #modal__history .table-history {
        max-height: 500px
    }
}

#modal__history .table-history::-webkit-scrollbar {
    width: 4px
}

#modal__history .table-history::-webkit-scrollbar-track {
    background: #000000
}

#modal__history .table-history::-webkit-scrollbar-thumb {
    background: #2174ec
}

#modal__history .table-history::-webkit-scrollbar-thumb:hover {
    background: #c8391f
}

#modal__history .table-history table {
    width: 100%
}

#modal__history .table-history table tr td {
    text-align: center;
    font-size: clamp(10px, 2.5vw, 14px);
    padding: 2px;
    border: none
}

@media only screen and (min-width:768px) {
    #modal__history .table-history table tr td {
        font-size: 16px;
        padding: 5px 2px
    }
}

@media only screen and (min-width:1024px) {
    #modal__history .table-history table tr td {
        padding: 7px 2px
    }
}

#modal__history .table-history table thead tr {
    position: sticky;
    top: 0;
    left: 0
}

#modal__history .table-history table thead tr td {
    background: #c8391f;
    text-transform: uppercase;
    font-size: clamp(10px, 2.5vw, 14px);
    padding: 4px
}

@media only screen and (min-width:768px) {
    #modal__history .table-history table thead tr td {
        font-size: 16px;
        padding: 6px 0
    }
}

#modal__history .table-history table tbody tr:first-child td {
    background: transparent;
    color: #000
}

#modal__history .table-history table tbody tr:nth-child(odd) {
    background: #fff
}

#modal__history .table-history table tbody tr:nth-child(2n) {
    background: #f5f2f2
}

#modal__history .table-history table tbody tr td {
    color: #000
}

#modal__rule .content-modal,
#modal__thuong .content-modal {
    max-width: 900px
}

#modal__rule .wrapper-modal,
#modal__thuong .wrapper-modal {
    max-height: 650px
}

@media only screen and (min-width:1150px) {

    #modal__rule .wrapper-modal,
    #modal__thuong .wrapper-modal {
        max-height: 700px
    }
}

#modal__rule .main-modal,
#modal__thuong .main-modal {
    padding-top: 2.5%;
    padding-inline: 1%
}

#modal__rule .content-rule,
#modal__thuong .content-rule {
    height: 300px;
    overflow-y: auto;
    width: 98%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2%
}

@media only screen and (min-width:1024px) {

    #modal__rule .content-rule,
    #modal__thuong .content-rule {
        height: 400px
    }
}

#modal__rule .content-rule::-webkit-scrollbar,
#modal__thuong .content-rule::-webkit-scrollbar {
    width: 4px
}

#modal__rule .content-rule::-webkit-scrollbar-thumb,
#modal__thuong .content-rule::-webkit-scrollbar-thumb {
    background: #417474;
    border-radius: 5px
}

#modal__rule .content-rule::-webkit-scrollbar-track,
#modal__thuong .content-rule::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 5px
}

#modal__giftFirst .content-modal {
    max-width: 800px
}

#modal__giftFirst .tb__gcTh {
    width: 98%
}

#modal__giftFirst .tb__gcTh .rw__gcth {
    line-height: 1.2;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
    font-size: clamp(10px, 2vw, 20px);
    padding-block: 2%
}

#modal__giftFirst .tb__gcTh .rw__head {
    font-size: clamp(14px, 3.2vw, 24px)
}

#modal__giftFirst .body__rwTB {
    padding-right: 1%;
    height: 160px;
    overflow-y: auto
}

@media only screen and (min-width:1024px) {
    #modal__giftFirst .body__rwTB {
        height: 300px
    }
}

#modal__giftFirst .body__rwTB::-webkit-scrollbar {
    width: 5px
}

#modal__giftFirst .body__rwTB::-webkit-scrollbar-track {
    background: #000000
}

#modal__giftFirst .body__rwTB::-webkit-scrollbar-thumb {
    background: #2174ec
}

#modal__giftFirst .body__rwTB::-webkit-scrollbar-thumb:hover {
    background: #0f261b
}

#modal__giftFirst .body__rwTB .rw__gcth {
    border-bottom: 1px solid #cacaca
}

#modal__giftFirst .btn-getMDG {
    color: #fff;
    width: 70%;
    padding: 4% 0 4%;
    font-size: clamp(12px, 2vw, 18px)
}

#modal__giftFirst .sGC__copy {
    gap: 0 5px
}

#modal__giftFirst .sGC__copy .tgccPy {
    width: 55%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

#modal__giftFirst .sGC__copy button img {
    display: block;
    width: 3vw;
    max-width: 17px
}

#modal__rank .content-modal {
    max-width: 800px
}

#modal__rank .rank-top10 {
    border: 1px solid #c8391f;
    width: 100%;
    max-width: 730px;
    position: relative
}

#modal__rank .rank-top10 .row-rank {
    text-align: center;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 20% 20% 35% 30%;
    grid-template-columns: 20% 20% 35% 30%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #c8391f;
    font-size: clamp(12px, 2.5vw, 16px);
    width: 100%;
    margin-left: auto;
    margin-right: auto
}

#modal__rank .rank-top10 .row-rank:nth-child(2) {
    color: #ff4235
}

#modal__rank .rank-top10 .row-rank:nth-child(3) {
    color: #668bc9
}

#modal__rank .rank-top10 .row-rank:nth-child(4) {
    color: #02a380
}

#modal__rank .rank-top10 .row-rank .column {
    height: 100%;
    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
}

#modal__rank .rank-top10 .my-rank,
#modal__rank .rank-top10 .row-head {
    font-size: clamp(10px, 2.5vw, 16px)
}

#modal__rank .rank-top10 .my-rank .column,
#modal__rank .rank-top10 .row-head .column {
    height: auto
}

#modal__rank .rank-top10 .rr-content {
    background: #fff;
    padding: 4px 0
}

@media only screen and (max-width:1023px) {
    #modal__rank .rank-top10 .rr-content {
        padding: 2px 0
    }
}

#modal__rank .rank-top10 .rr-content:nth-child(odd) {
    background: #ededed
}

#modal__rank .rank-top10 .row-head {
    background: #c8391f;
    height: 30px
}

@media only screen and (min-width:1024px) {
    #modal__rank .rank-top10 .row-head {
        height: 40px;
        padding-top: 0
    }
}

@media only screen and (max-width:1023px) {
    #modal__rank .rank-top10 .row-head {
        position: relative
    }
}

@media only screen and (max-width:1023px) {
    #modal__rank .rank-top10 .row-head .column {
        position: relative
    }
}

#modal__rank .rank-top10 .my-rank {
    background: #b4443e
}

@media only screen and (max-width:1023px) {
    #modal__rank .rank-top10 .my-rank {
        padding: 8px 0
    }
}

@media only screen and (min-width:1024px) {
    #modal__rank .rank-top10 .my-rank {
        height: 40px
    }
}

#modal__rank .img__gRank {
    margin-inline: auto;
    background: url(../images/bg-img.png) no-repeat center center;
    background-size: 100% 100%;
    width: 7vw;
    height: 7vw;
    max-width: 35px;
    max-height: 35px
}

#modal__rank .img__gRank img {
    width: auto;
    max-width: 80%
}

#modal__rank .btnquatoppoup {
    display: inline-block;
    font-size: clamp(12px, 3vw, 20px);
    padding: 15px 30px 10px;
    margin-top: 2%
}

.fixed__right {
    width: 10.1041666667vw;
    height: 22.3958333333vw;
    position: fixed;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: -10.1041666667vw;
    -webkit-transition: all 0.1s ease;
    transition: all 0.1s ease;
    padding-top: 0.78125vw
}

.fixed__right.open {
    right: 0px;
    z-index: 9
}

.fixed__right.open .nav-right-content {
    opacity: 1
}

.fixed__right:before {
    position: absolute;
    content: "";
    background: url(../images/sibarRight/art.png) no-repeat center center;
    background-size: 100%;
    width: 11.6145833333vw;
    height: 12.8125vw;
    left: -1.4583333333vw;
    top: -10.78125vw;
    z-index: -1
}

.fixed__right:after {
    pointer-events: none;
    position: absolute;
    content: "";
    background: url(../images/sibarRight/bg-navright.png) no-repeat center center;
    background-size: 100%;
    width: 10.1041666667vw;
    height: 22.3958333333vw;
    left: 0;
    top: 0;
    z-index: -1
}

.fixed__right .fbGr__sbright {
    gap: 0 0.5208333333vw
}

.fixed__right .fbGr__sbright .fbgrLlink__sbr img {
    width: 2.96875vw
}

.fixed__right .outBNGame {
    margin-bottom: 0.2604166667vw
}

.fixed__right .outBNGame .icNR {
    width: 6.9270833333vw
}

.fixed__right .dlStore__ {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0.6666666667vw 0
}

@media only screen and (min-width:992px) {
    .fixed__right .dlStore__ {
        gap: 0.2604166667vw 0;
        margin-top: 0.78125vw
    }
}

.fixed__right .dlStore__ .aLink__Dlstore {
    gap: 0 5px;
    width: 30vw;
    height: 8vw
}

@media only screen and (min-width:992px) {
    .fixed__right .dlStore__ .aLink__Dlstore {
        padding: 0;
        width: 8.0729166667vw;
        height: 2.6041666667vw
    }
}

.fixed__right .dlStore__ .aLink__Dlstore .icnDL__gamtop {
    width: 4vw
}

@media only screen and (min-width:992px) {
    .fixed__right .dlStore__ .aLink__Dlstore .icnDL__gamtop {
        width: 1.3020833333vw
    }
}

.fixed__right .dlStore__ .aLink__Dlstore .tSl__op_ {
    line-height: 1.3
}

@media only screen and (min-width:992px) {
    .fixed__right .dlStore__ .aLink__Dlstore .tSl__op_ {
        font-size: 0.5208333333vw
    }
}

@media only screen and (min-width:992px) {
    .fixed__right .dlStore__ .aLink__Dlstore .tSl__op_ .tsl__bil {
        font-size: 0.5729166667vw
    }
}

.fixed__right .checkRward .giftbtn {
    width: 8.6458333333vw
}

.fixed__right .checkRward .teRward__ {
    color: #403659;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 1.2;
    font-size: 0.5729166667vw;
    padding-left: 1.5625vw;
    text-shadow: 1px 0 0 #ffc808, -1px 0 0 #ffc808, 0 1px 0 #ffc808, 0 -1px 0 #ffc808, 1px 1px #ffc808, -1px -1px 0 #ffc808, 1px -1px 0 #ffc808, -1px 1px 0 #ffc808
}

.fixed__right .i-control {
    cursor: pointer;
    position: absolute;
    background: url(../images/sibarRight/bg__ar.png) no-repeat center center;
    background-size: contain;
    width: 1.9270833333vw;
    height: 4.1145833333vw;
    left: -1.71875vw;
    top: 5.2083333333vw
}

.fixed__right .i-control.i-control-open {
    left: -1.9270833333vw
}

.fixed__right .i-control.i-control-open:before {
    -webkit-transform: rotateZ(0deg);
    transform: rotateZ(0deg)
}

.fixed__right .i-control:before {
    position: absolute;
    content: "";
    width: 1.25vw;
    height: 1.6666666667vw;
    background: url(../images/sibarRight/img-arrow.png) no-repeat center center;
    background-size: 100%;
    -webkit-transform: rotateZ(180deg);
    transform: rotateZ(180deg);
    top: 1.25vw;
    left: 0.3125vw
}

.fixed__right .go-top {
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.fixed__right .go-top img {
    width: 3.59375vw
}

.te-content {
    font-size: clamp(1.3rem, 3vw, 1.6rem);
    color: #000000
}

.te-content span.content-event-first {
    float: left;
    font-size: 4rem;
    line-height: 5px;
    margin: 4px 2px 0px 0px
}

.te-content .content-event-h1,
.te-content h1 {
    font-size: 18px;
    color: #d31d29;
    padding: 4px 0 8px 35px;
    position: relative
}

@media only screen and (min-width:1024px) {

    .te-content .content-event-h1,
    .te-content h1 {
        font-size: 2.4rem
    }
}

.te-content .content-event-h1:before,
.te-content h1:before {
    content: "";
    width: 27px;
    height: 27px;
    background: url(../images/icon-h22-b.png) no-repeat center center;
    background-size: 100%;
    position: absolute;
    left: 0;
    top: 5px
}

.te-content .content-event-h2,
.te-content h2 {
    margin-left: 10px;
    font-size: 1.6rem;
    padding: 4px 0 8px 35px;
    color: #d31d29;
    margin-bottom: 10px;
    margin-top: 10px;
    position: relative
}

@media only screen and (min-width:1024px) {

    .te-content .content-event-h2,
    .te-content h2 {
        font-size: 18px
    }
}

.te-content .content-event-h2:before,
.te-content h2:before {
    content: "";
    width: 27px;
    height: 27px;
    background: url(../images/icon-h22-b.png) no-repeat center center;
    background-size: 100%;
    position: absolute;
    left: 0;
    top: 5px
}

.te-content a {
    color: #d31d29
}

.te-content ul {
    margin-left: 25px
}

.te-content ul li {
    line-height: 28px
}

.te-content p {
    line-height: 1.8
}

.te-content p img {
    margin-top: 15px;
    margin-bottom: 15px;
    max-width: 100%;
    height: auto
}

.te-content table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 15px;
    margin-bottom: 15px;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width:1024px) {
    .te-content table {
        width: auto
    }
}

.te-content table tr td {
    border: 1px solid #2ccefd;
    margin: 0;
    padding: 5px;
    vertical-align: middle !important;
    text-align: center
}

.te-content table tr:first-child {
    background: #d97815
}

.te-content table tr:first-child td p {
    color: #333
}

.te-content fieldset {
    border: 1px solid #2ccefd;
    margin: 20px 0;
    padding: 10px;
    color: #2a2a2a;
    background: #f3f3f3
}

.te-content fieldset legend {
    color: white;
    background: #fb8142;
    padding: 0 15px
}

.te-content fieldset ul {
    margin-left: 15px
}

.te-content em {
    font-style: italic
}

table img {
    display: block
}

table {
    border-collapse: collapse;
    font-size: 1.4rem;
    margin-top: 10px
}

table tr:first-child td {
    background-color: #f0f0f0;
    color: #ffffff;
    text-align: center
}

table tr td {
    vertical-align: middle;
    color: #f0f0f0;
    font-weight: normal;
    text-align: center;
    padding: 5px 0px
}