body {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace
}

html {
    -webkit-text-size-adjust: 100%
}

.pc-page,
.m-page {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    color: #fff;
    background: #69e2ed;
    overflow: hidden
}

.header-container {
    min-width: 380px
}

.pc-page .header-container,
.m-page .header-container {
    margin: 0 auto;
    background: url(../img/cloud.png) no-repeat bottom right;
    background-size: 333%
}

@media only screen and (min-width:600px) {

    .pc-page .header-container,
    .m-page .header-container {
        background-size: auto
    }
}

@media only screen and (min-width:1200px) {

    .pc-page .header-container,
    .m-page .header-container {
        background-size: 100%
    }
}

.pc-page .header-container .header-center,
.m-page .header-container .m-page-center {
    height: 103px;
    display: flex;
    line-height: 160px;
    justify-content: space-between
}

.pc-page .pc-page-center,
.m-page .m-page-center {
    margin: 0 auto
}

.pc-page .pc-page-header,
.m-page .m-page-header {
    min-width: 300px;
    width: 100%;
    height: 102px;
    opacity: 1;
    background: #ffde00;
    text-align: center
}

@media only screen and (max-width:600px) {

    .pc-page .header-container .header-center,
    .m-page .header-container .m-page-center {
        height: 68px
    }

    .pc-page .pc-page-header,
    .m-page .m-page-header {
        height: 67px
    }

    .short-logo {
        width: 208px !important
    }

    .pc-page-left {
        scale: .8;
        margin-top: -10px
    }

    .pc-page-right {
        padding-right: 0 !important;
        margin-right: -20px
    }

    .train-head,
    .train-div,
    .train-search {
        scale: .8;
        margin-top: -20px;
        margin-left: -10px !important
    }

    .train-search {
        margin: -25px 25px 0 5px !important
    }

    #headerMenu {
        right: 30px !important;
        top: -25px
    }

    .top_search_input {
        scale: .8;
        top: -30px !important
    }

    .top_search_input input {
        width: calc(100vw - 120px) !important
    }
}

.pc-page .pc-page-header .pc-page-left,
.m-page .m-page-header .m-page-left {
    float: left;
    padding-left: 10px
}

.pc-page .pc-page-header .pc-page-left .pc-page-logo,
.m-page .m-page-header .m-page-left .m-page-logo {
    float: left;
    text-align: left;
    width: 85px;
    height: 50px;
    background-size: cover
}

.pc-page .pc-page-header .pc-page-left .pc-page-logo img,
.m-page .m-page-header .m-page-left .m-page-logo img {
    vertical-align: middle;
    cursor: pointer
}

.pc-page .pc-page-header .pc-page-left .pc-page-menu,
.m-page .m-page-header .m-page-left .m-page-menu {
    float: left;
    font-size: 18px;
    line-height: 50px;
    text-align: left
}

.pc-page .pc-page-header .pc-page-right,
.m-page .m-page-header .m-page-right {
    float: right;
    padding-right: 10px
}

.pc-page .pc-page-container,
.m-page .m-page-container {
    color: #fff;
    background: #69e2ed;
    position: relative;
    z-index: 2
}

.pc-page .pc-page-container .pc-page-top,
.m-page .m-page-container .m-page-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    position: relative;
    height: 48px
}

.pc-page .pc-page-container .pc-page-name,
.m-page .m-page-container .m-page-name {
    font-family: FangZhengPangWaJianTi;
    text-align: left;
    color: #fff;
    line-height: 33px;
    overflow: hidden;
    position: relative;
    font-weight: 700
}

.pc-page .pc-page-container .pc-page-name .name-text,
.m-page .m-page-container .m-page-name .name-text {
    letter-spacing: 0;
    left: 30px;
    top: 15px;
    height: 40px;
    padding: 10px 20px 10px 10px;
    margin-top: 4px;
    box-sizing: border-box;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAPwAAAAyCAYAAAB4SbajAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDcuMS1jMDAwIDc5LmRhYmFjYmIsIDIwMjEvMDQvMTQtMDA6Mzk6NDQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NDU5NmM2MzQtOWM4YS04ODRlLTg1OGYtYjI4M2ZkZWFhZTAzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjI4RjQ2REQ5NDM0MDExRUZCREEzQjk1OTlGQUE0QkYyIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjI4RjQ2REQ4NDM0MDExRUZCREEzQjk1OTlGQUE0QkYyIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyMy4wIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjUzZTQ1NDM2LTVkOTYtMWM0YS05YjkxLWUxYzdlMDQzYjFmMiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NTk2YzYzNC05YzhhLTg4NGUtODU4Zi1iMjgzZmRlYWFlMDMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz48EQXgAAACPUlEQVR42uzdP0hVYRjH8eeayi0EJzdxagqaHGqIBgmxIAu3aGvKoTGI1kAa2oJcQjFoaWgoqCWECy0OugRBf7YiolqKS1yEOP0e3tPlJtrf6TzP9wO/I3rOdXjhxzn3vu+rraqqDEAOw35oPX1O64E4esoH5aXSUdaUN9WxQzbE2ADhtJUp5YRyTXmhnPUTFB6Ib79yq/9IPz3WZkiA2Cb6hd/s9hgOILYOj/RAHtcpPJDDsvKEwgPxPVAu/fiGwgNxbSnnlG8UHojtrXJG+Tr4QwoPxPNZOVWX3ig8ENe2sqA82+0khQdiuais73WSwgNx+Fz76q8uoPBADHeVq7+7iMIDzeeP8BeUisIDsb228iHd9p9cTOGB5vqonLQyDWcUHojLF9Scru/wRuGBuHyprC+Z3fjbF1J4oHmuWNkUYxQeiM23ut741xdTeKA5ftrqSuGBuDZsx1ZXCg/EdUAZ+d9fQuGBZjis3FP2UXggh1nlJoUH8li0Mi1H4YEklpTzFB7IoaWsKEcpPJDDqJV5+YMUHsjB/1/c4/orhQcS8Dv8Qyvz9BQeSOCIcrt+b0/hgQR82e0ShQfy8Pn5RQoP5OEr8eYpPJCDr7W/Y2XtPYUHEhhXHimTFB7IYbIu/TiFB3Lwx/r7NrCllsIDsc3YwJZaCg/E51N1cxQeyOOyH4b9MD3WZjiA2I73C7/Z7TEcQGzveKQHcujW7+PLHR5AGP53678on5RXSsfKyrv3frJVVRVDBCTxXYABABzQUHfMjMG1AAAAAElFTkSuQmCC) no-repeat;
    background-size: 100% 60%;
    background-position: center center;
    text-transform: uppercase;
    max-width: calc(100vw - 100px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

@media only screen and (min-width:600px) {

    .pc-page .pc-page-container .pc-page-name .name-text,
    .m-page .m-page-container .m-page-name .name-text {
        height: 47px
    }
}

@media only screen and (min-width:800px) {

    .pc-page .pc-page-container .pc-page-name .name-text,
    .m-page .m-page-container .m-page-name .name-text {
        height: 50px
    }
}

@media only screen and (min-width:1000px) {

    .pc-page .pc-page-container .pc-page-name .name-text,
    .m-page .m-page-container .m-page-name .name-text {
        height: 57px
    }
}

@media only screen and (min-width:460px) {

    .pc-page .pc-page-container .pc-page-name,
    .m-page .m-page-container .m-page-name {
        font-size: 20px
    }

    .pc-page .pc-page-container .pc-page-name .name-text,
    .m-page .m-page-container .m-page-name .name-text {
        padding: 10px 25px 10px 15px;
        background-size: 100% 70%;
        letter-spacing: 1px
    }
}

@media only screen and (min-width:680px) {

    .pc-page .pc-page-container .pc-page-name,
    .m-page .m-page-container .m-page-name {
        font-size: 24px
    }

    .pc-page .pc-page-container .pc-page-name .name-text,
    .m-page .m-page-container .m-page-name .name-text {
        padding: 10px 30px 10px 15px;
        background-size: 100% 80%;
        letter-spacing: 1px
    }
}

@media only screen and (min-width:960px) {

    .pc-page .pc-page-container .pc-page-name,
    .m-page .m-page-container .m-page-name {
        font-size: 26px
    }

    .pc-page .pc-page-container .pc-page-name .name-text,
    .m-page .m-page-container .m-page-name .name-text {
        padding: 10px 40px 10px 15px;
        background-size: 100% 90%;
        letter-spacing: 2px
    }
}

@media only screen and (min-width:1200px) {

    .pc-page .pc-page-container .pc-page-name,
    .m-page .m-page-container .m-page-name {
        font-size: 26px
    }

    .pc-page .pc-page-container .pc-page-name .name-text,
    .m-page .m-page-container .m-page-name .name-text {
        padding: 10px 40px 10px 15px;
        background-size: 100% 100%;
        letter-spacing: 2px
    }
}

.pc-page .pc-page-container .pc-page-text,
.m-page .m-page-container .m-page-text {
    margin: 10px;
    border-radius: 14px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    -ms-border-radius: 14px;
    -o-border-radius: 14px;
    box-sizing: border-box;
    color: #00747f;
    background-color: rgb(167 248 255 / .6);
    font-size: 16px;
    line-height: 24px;
    overflow: hidden
}

.pc-page .pc-page-container .pc-page-text a,
.m-page .m-page-container .m-page-text a {
    text-decoration: none;
    color: #000
}

.pc-page .pc-page-container .pc-page-text img,
.m-page .m-page-container .m-page-text img {
    vertical-align: middle
}

.pc-page .pc-page-container .pc-page-text .title-text,
.m-page .m-page-container .m-page-text .title-text {
    font-size: 24px;
    line-height: 36px
}

.pc-page .pc-page-container .pc-page-text .seo-text,
.m-page .m-page-container .m-page-text .seo-text {
    font-size: 13px;
    line-height: 24px
}

.pc-page .pc-page-container .pc-page-text .seo-text a,
.m-page .m-page-container .m-page-text .seo-text a {
    color: #00747f
}

.pc-page .pc-page-container .pc-page-text .seo-text h2,
.m-page .m-page-container .m-page-text .seo-text h2 {
    font-size: 16px
}

.pc-page .pc-page-container .pc-page-text .seo-text h3,
.m-page .m-page-container .m-page-text .seo-text h3 {
    font-size: 14px
}

.pc-page .pc-page-footer,
.m-page .m-page-footer {
    height: 110px;
    width: 100%;
    min-width: 300px;
    line-height: 40px;
    color: #fff;
    clear: both;
    overflow: hidden;
    text-align: center;
    background: url(../img/grass2.png) repeat-x bottom;
    font-size: 18px;
    line-height: 70px
}

.pc-page .pc-page-footer .pc-page-logo img,
.m-page .m-page-footer .m-page-logo img {
    vertical-align: middle;
    cursor: pointer
}

.pc-page .pc-page-footer .link-span,
.m-page .m-page-footer .link-span {
    cursor: pointer;
    margin-left: 25px;
    color: #3c5f00;
    text-decoration: underline
}

.pc-page .pc-page-footer .footer-center,
.m-page .m-page-footer .footer-center {
    display: flex;
    justify-content: space-between;
    padding: 30px 10px;
    box-sizing: border-box
}

.backToTop {
    width: 60px;
    height: 33px;
    position: fixed;
    bottom: 50px;
    right: 10px;
    cursor: pointer
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        display: none
    }
}

.showButton {
    animation: fadeIn 1s;
    opacity: 1
}

.hideButton {
    animation: fadeOut 1s;
    opacity: 0;
    pointer-events: none
}

.back-button {
    position: fixed;
    right: -10px;
    bottom: 60px;
    z-index: 1000;
    cursor: pointer;
    scale: .6
}

.game-container {
    overflow: hidden
}

.game-container .card-container {
    float: left;
    text-align: center;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    --margin: 10px;
    --allWidth: calc(100% - 40px);
    --width: calc((100% - 40px));
    margin: var(--margin);
    width: var(--width);
    min-width: 280px;
    min-height: 210px;
    aspect-ratio: 4 / 3;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

.game-container .card-container img {
    width: 100%;
    height: 100%;
    vertical-align: top;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 6
}

.game-container .card-container .game-name {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: auto;
    display: none;
    color: #fff;
    background: #ffde00;
    box-sizing: border-box;
    padding: 5px 4px 5px 0;
    font-size: 16px;
    color: #524700;
    box-shadow: 1px 26px 6px #ffde00;
    z-index: 7
}

.index-game .card-container .game-name {
    color: #003c41;
    background: rgb(255 255 255 / .7)
}

@keyframes namewrap {
    0% {
        transform: translateY(50%)
    }

    100% {
        transform: translateY(0%)
    }
}

.index-more {
    height: 32px;
    font-size: 14px;
    line-height: 34px;
    font-weight: 400;
    border: none;
    padding: 3px 10px 1px 12px;
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    -ms-border-radius: 24px;
    -o-border-radius: 24px;
    background: #29cedd;
    margin-right: 10px
}

.show-game a {
    display: none
}

.show-game a:nth-child(-n+3) {
    display: block
}

@media only screen and (min-width:320px) {
    .show-game a:nth-child(-n+6) {
        display: block
    }
}

@media only screen and (min-width:680px) {
    .show-game a:nth-child(-n+6) {
        display: block
    }
}

@media only screen and (min-width:880px) {
    .show-game a:nth-child(-n+8) {
        display: block
    }
}

@media only screen and (min-width:1200px) {
    .show-game a:nth-child(-n+10) {
        display: block
    }
}

.add-border .card-container img {
    width: 93%;
    height: 90%;
    vertical-align: top;
    position: absolute;
    top: 5%;
    left: 3.5%;
    z-index: 6;
    border-radius: 0 !important
}

.menu-antd {
    position: absolute;
    z-index: 1000;
    width: 240px !important;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    color: #474747;
    -webkit-user-select: none;
    user-select: none;
    top: 75px;
    left: -165px;
    bottom: 70px;
    height: fit-content;
    padding: 0;
    background: #fff;
    text-decoration: none
}

.menu-antd .ant-menu-item {
    background: #fff;
    margin: 0;
    width: 100%;
    height: 46px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-left: 10px;
    text-decoration: none
}

.ant-menu-title-content {
    margin-inline-start: 10px
}

.ant-menu-title-content a {
    text-decoration: none;
    color: #000;
    transform: translate3d(0, 0, 0)
}

.menu-antd .ant-menu-item:hover .ant-menu-title-content {
    background: #fff !important;
    color: #01c2d3 !important;
    text-decoration: underline
}

.menu-antd .ant-menu-item:hover .ant-menu-title-content a {
    color: #01c2d3 !important;
    transition: none !important
}

.ant-menu-item-icon {
    width: 32px;
    height: 32px;
    margin: 0 10px 0 5px;
    transform: translate3d(0, 0, 0)
}

.menu-antd .ant-menu-item:first-child {
    border-radius: 6px 6px 0 0;
    -webkit-border-radius: 6px 6px 0 0;
    -moz-border-radius: 6px 6px 0 0;
    -ms-border-radius: 6px 6px 0 0;
    -o-border-radius: 6px 6px 0 0
}

.menu-antd .ant-menu-item:last-child {
    border-radius: 0 0 6px 6px;
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    -ms-border-radius: 0 0 6px 6px;
    -o-border-radius: 0 0 6px 6px
}

.menu-antd .ant-menu-item:last-child img {
    z-index: 9
}

.menu-antd .ant-menu-item:last-child span {
    z-index: 9
}

.menu-antd .ant-menu-item:last-child ::after {
    content: '';
    display: block;
    clear: both
}

.menu-antd .ant-menu-item-active {
    background: #fff !important;
    color: #01c2d3 !important;
    text-decoration: underline
}

.menu-antd .ant-menu-item-selected {
    background: #fff !important;
    color: #01c2d3 !important;
    text-decoration: underline
}

.menu-antd .ant-menu-title-content {
    color: #474747;
    text-align: left;
    font-size: 18px;
    line-height: 40px
}

.menu-antd::after {
    content: url(../img/drop-down/bottom2.png);
    position: absolute;
    bottom: -92px;
    z-index: 7;
    display: block;
    clear: both;
    pointer-events: none
}

@keyframes driveIn {
    0% {
        position: relative;
        right: -400px
    }

    100% {
        position: relative;
        right: 0;
        display: none
    }
}

@keyframes driveInMobile {
    0% {
        position: relative;
        right: -100px
    }

    100% {
        position: relative;
        right: 0
    }
}

.showTrain {
    animation: driveIn 2s
}

.showTrain-mobile {
    animation: driveInMobile 1s
}

.not-show-menu {
    opacity: 0;
    pointer-events: none
}

.train-head {
    margin-bottom: 4px
}

.train-menu {
    display: flex;
    margin-top: 3px;
    justify-content: flex-end;
    position: relative
}

.train-menu .train-div {
    width: 85px
}

.train-menu .train-div img {
    cursor: pointer
}

.train-menu div {
    margin-left: 5px;
    position: relative
}

.train-menu div .train-img {
    position: absolute;
    transform: translateX(-50%) translateY(50%);
    cursor: pointer
}

.train-menu div .train-img-mobile {
    position: absolute;
    transform: translateX(-50%) translateY(45%)
}

.train-menu div .train-text {
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
    position: absolute;
    top: -33px;
    color: #fff;
    font-size: 20px;
    transform: translateX(-43%)
}

.train-menu .menu-div {
    height: -moz-fit-content;
    height: fit-content;
    display: block
}

.train-menu .menu-div .ant-menu-item:first-child {
    display: flex
}

.train-menu .menu-div .ant-menu-item:nth-child(2) {
    display: flex;
    border: none
}

.train-menu .menu-div .ant-menu-item:nth-child(3) {
    display: flex;
    border: none
}

.train-menu .menu-div .ant-menu-item:nth-child(4) {
    display: flex;
    border: none
}

@media only screen and (min-width:650px) {
    .train-menu .menu-div .ant-menu-item:first-child {
        display: none
    }

    .train-menu .menu-div .ant-menu-item:nth-child(2) {
        border-radius: 6px 6px 0 0;
        -webkit-border-radius: 6px 6px 0 0;
        -moz-border-radius: 6px 6px 0 0;
        -ms-border-radius: 6px 6px 0 0;
        -o-border-radius: 6px 6px 0 0
    }
}

@media only screen and (min-width:750px) {
    .train-menu .menu-div .ant-menu-item:first-child {
        display: none
    }

    .train-menu .menu-div .ant-menu-item:nth-child(2) {
        display: none
    }

    .train-menu .menu-div .ant-menu-item:nth-child(3) {
        border-radius: 6px 6px 0 0;
        -webkit-border-radius: 6px 6px 0 0;
        -moz-border-radius: 6px 6px 0 0;
        -ms-border-radius: 6px 6px 0 0;
        -o-border-radius: 6px 6px 0 0
    }
}

@media only screen and (min-width:1000px) {
    .train-menu .menu-div .ant-menu-item:first-child {
        display: none
    }

    .train-menu .menu-div .ant-menu-item:nth-child(2) {
        display: none
    }

    .train-menu .menu-div .ant-menu-item:nth-child(3) {
        display: none
    }

    .train-menu .menu-div .ant-menu-item:nth-child(4) {
        border-radius: 6px 6px 0 0;
        -webkit-border-radius: 6px 6px 0 0;
        -moz-border-radius: 6px 6px 0 0;
        -ms-border-radius: 6px 6px 0 0;
        -o-border-radius: 6px 6px 0 0
    }
}

.ramdom-background {
    position: absolute;
    left: 0;
    top: 60px;
    z-index: -1;
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
    width: calc(100% + 200px);
    height: 100%
}

#content .ramdom-background {
    z-index: -1
}

.ramdom-background img {
    position: absolute
}

.detail .detail-container .game-container a {
    display: none
}

.detail .detail-container .game-container a:nth-child(-n+4) {
    display: block
}

.detail-container {
    margin-top: 5px
}

@media only screen and (min-width:320px) {
    .detail .detail-container .game-container a:nth-child(-n+8) {
        display: block
    }
}

@media only screen and (min-width:680px) {
    .detail .detail-container .game-container a:nth-child(-n+12) {
        display: block
    }
}

@media only screen and (min-width:960px) {
    .detail .detail-container .game-container a:nth-child(-n+16) {
        display: block
    }
}

@media only screen and (min-width:1200px) {
    .detail .detail-container .game-container a:nth-child(-n+20) {
        display: block
    }
}

.game-tag-div {
    display: inline-block;
    background: #29cedd;
    height: 26px;
    text-align: center;
    padding: 0 15px;
    line-height: 26px;
    box-sizing: border-box;
    border-radius: 13px;
    -webkit-border-radius: 13px;
    -moz-border-radius: 13px;
    -ms-border-radius: 13px;
    -o-border-radius: 13px;
    color: #d3fbff;
    margin-right: 10px
}

.error-page-main {
    min-height: calc(100vh - 290px)
}

.error-display {
    text-align: center;
    margin-top: 40px
}

.error-display .error-code {
    color: #007782;
    font-size: 24px;
    font-weight: 700;
    margin-top: 15px
}

.error-display .error-text {
    color: #007782;
    font-size: 16px;
    margin: 10px 0
}

.error-display .error-button {
    width: 180px;
    height: 40px;
    background: #ffde00;
    box-shadow: 0 2px 0 0 #ffba00;
    color: #756600;
    border: none;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    font-size: 16px;
    margin: 20px;
    cursor: pointer
}

@media only screen and (min-width:460px) {
    .error-display .error-code {
        color: #007782;
        font-size: 24px;
        font-weight: 700;
        margin-top: 15px
    }

    .error-display .error-text {
        color: #007782;
        font-size: 16px;
        margin: 10px 0
    }

    .error-display .error-button {
        width: 180px;
        height: 40px;
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px;
        font-size: 16px;
        margin: 20px
    }
}

@media only screen and (min-width:680px) {
    .error-display .error-code {
        color: #007782;
        font-size: 26px;
        font-weight: 700;
        margin-top: 25px
    }

    .error-display .error-text {
        color: #007782;
        font-size: 18px;
        margin: 10px 0
    }

    .error-display .error-button {
        width: 200px;
        height: 40px;
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px;
        font-size: 20px;
        margin: 20px
    }
}

@media only screen and (min-width:960px) {
    .error-display .error-code {
        color: #007782;
        font-size: 30px;
        font-weight: 700;
        margin-top: 30px
    }

    .error-display .error-text {
        color: #007782;
        font-size: 20px;
        margin: 15px 0
    }

    .error-display .error-button {
        width: 240px;
        height: 40px;
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px;
        font-size: 24px;
        margin: 20px
    }
}

@media only screen and (min-width:1200px) {
    .error-display .error-code {
        color: #007782;
        font-size: 34px;
        font-weight: 700;
        margin-top: 45px
    }

    .error-display .error-text {
        color: #007782;
        font-size: 22px;
        margin: 20px 0
    }

    .error-display .error-button {
        width: 280px;
        height: 60px;
        background: #ffde00;
        box-shadow: 0 2px 0 0 #ffba00;
        color: #756600;
        border: none;
        border-radius: 30px;
        -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
        -ms-border-radius: 30px;
        -o-border-radius: 30px;
        font-size: 28px;
        margin: 20px;
        cursor: pointer
    }
}

#download-button {
    display: none
}

.show-text .show-text-container {
    font-size: 16px;
    color: #fff;
    background: #69e2ed;
    position: relative;
    z-index: 2
}

.show-text .show-text-container a {
    color: #000;
    text-decoration: none
}

.show-text .show-text-container .show-text-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px
}

.show-text .show-text-container .show-text-name {
    font-family: FangZhengPangWaJianTi;
    text-align: center;
    font-size: 24px;
    color: #fff;
    line-height: 33px;
    overflow: hidden;
    position: relative;
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%;
    height: 60px;
    padding: 0 59px;
    line-height: 48px;
    font-weight: 700
}

.show-text .show-text-container .show-text-name .name-text {
    letter-spacing: 0;
    font-size: 16px;
    left: 30px;
    top: 15px;
    text-transform: uppercase
}

@media only screen and (min-width:460px) {
    .show-text .show-text-container .show-text-name .name-text {
        letter-spacing: 0;
        font-size: 16px
    }
}

@media only screen and (min-width:680px) {
    .show-text .show-text-container .show-text-name .name-text {
        letter-spacing: 1px;
        font-size: 18px
    }
}

@media only screen and (min-width:960px) {
    .show-text .show-text-container .show-text-name .name-text {
        letter-spacing: 2px;
        font-size: 24px
    }
}

.show-text .show-text-container .show-text-text {
    margin: 10px;
    padding: 20px 45px;
    border-radius: 14px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    -ms-border-radius: 14px;
    -o-border-radius: 14px;
    box-sizing: border-box;
    color: #00747f;
    background-color: rgb(167 248 255 / .6);
    font-size: 16px;
    line-height: 24px
}

.contact-us .contact-us-container {
    font-size: 12px;
    color: #fff;
    background: #69e2ed;
    position: relative;
    z-index: 2;
    overflow: hidden
}

.contact-us .contact-us-container .contact-us-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    max-width: 1220px;
    margin: 0 auto
}

.contact-us .contact-us-container .contact-us-name {
    font-family: FangZhengPangWaJianTi;
    text-align: left;
    font-size: 24px;
    color: #fff;
    height: 65px;
    line-height: 33px;
    overflow: hidden;
    position: relative;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARwAAAAzCAYAAABFebe3AAAL30lEQVR4nO2dS2xcVx3Gvzue8Yxjx27cNnFCXmoSt5SkoUBYmEp1ugiqwqNVl112QReIDXQFCxbsYMWqICEEIiyaRdcgUXlTC5E+lDg0JYkTh7gkbZPY4/d4Hhd995wzc33n3nncx3hs/3/Sle071/d9vvm/zjmWbdtoxu+Grzbc4tRzJzF15eqx0dETN7O5bNP9CYKwtSisFXD9+o1nAPyn0Yn/6NHJhteVivGqX8nn81vuRgqC0Bzdtr8X9VbFKTjn50VwBGFbogXnfNRri0Vwpq5cHQLwAs0uLoIgbB/YptdUu34BwFCUC0vHdFfOAchAK+He3N66DTJ7gMo6UF5Wv/fsqn1WnAPKK7Je1sv6zVzP37nOiytUktFt/WJYoYhLcKqmFt2qvfvqBcfqAfoOA0vX1O+W+8hWbRtZL+tlfefX5/YDKzP+jdsTmz0fRXDiyFLRLbsHoKoyo6Mn4M1W8aKGvgnkPwLsUtjTFQQhbihCQ98A8h8CdnnjznV2yr3qCwD7AVT8TqMTWaozbrFBvSI68EJK80Dv4zEcURCE2LArwNKn9WIT0Jb36jYfijgEpy5yHZStWrsHlFdjOKIgCPFRAUoL/nsLKHUJna2KQ3DqcvNB2arSYvCFCYLQeVIZYPC0/2Fd2Skvr4Q90aiCcxjA834fBBUB9j4BZOtjyoIgbAK9T6rMcTttmJ0LdNtvm6iCE2haBblVDBhn90U8qiAIscCY6voD/z016TkQyq1KTHCC3KpiHkjl1CIIwuZhZdRS9NGVBu5U07bfiCiC0wfgpUYb+CqkDaw/lGyVIGw2dhHIf6zapJcW+kW+pDWgLaIITtMDBrlVq3dVxkoQhM2jp99fbNCa4DQ1OPyIIjhNTaogt4rKygu14uw6KghCy7Arw8AztWpjb7tt4k4Z2narEhUcNLBy+g4Bua9EOLogCKFhSKP4MLQ7ZeiY4LScFgs6eSeO82TIowuCEAm2vcKX7bVZH6gBAVU8/oQVnB+0umGQW2Vy/+mBkGcgCEIo2K/R6SnuU3/ThjtlaFkLEEFwvt/OxkFuVeG+pMcFodOwz9TKbf+Dhhi1sy23KozgtN15K+gi1v4XXHQkCEICWEDfkeCWH0Jw6jpvNyJtWT5h6ga8vWfq5XaFyrhVfgOs06Vi9XF5ra3TEAQhBOndQOYxYPWOfztt052C1oKX35w79Sf+8WYTOQlj4YSqMAxyq9JDQPZAmD0KgtAu7MsYsitDI1rWBDP+l6WXHi1Cvjo1ln01U7QL58Kc0cP5L7HPZyRAZqsGT2mfsvlYYIIghMVS6fCFKf//fzD/AEU71Jjk58ayr+6eLLxb9Ky39UBdZf27ndbiktLjldLn6XUJzwZOZ86Ordj5UIMor6zmsbJ2FLty/RvWV9bUkhkCivNh9iwIQqssX1ftra59ri3j0er9sPdx6HTm7HcnC+9OutYZoVmnt8ZulFxnBIdis1sv/frvOivHhv3DvB0+yjs7N4PR/V+rW8+uDhWvNgqCEC+2f0dN8tn8DKK0bWoDgNsbVimRYfKdo2AtUXzS2pLJarEZ1oKTdrlZVVKwXlyuhJ976taja76CI5aNICRMChh6Dli4ooYU9TL98BqitO0UUmcB/Fn/aeulpD0maPEpWXrFIPYfPIjf/uEXOHjkHNKMZSfDhV8fwtHPe+v2zVHjmanym6ZCEIRoZIZVG1v8d/1uZvat4/W37sZ/h0ulJcze+Rt+8savcG92lpZOLU7z+7/+FEePvZak2JB/nF7yXU/VzUpXB0FIhGyD7NR7pwOG/ItKOj3gaMrbf/mx2VNKB3eK2DsSed7gVgi6OGar0o+psmtBEGLEAnoGVBvzI8gIiI2RA6+ZoLERnAIsqyNJaZpvXLyw+I+DrKd1Diw9CPT0xTz7uSDsEHpyakZNulG5A2qgLb/54ILaY6wobSkYwVHR5HL5QqceRZCirn1Wm9UhNwIMfBXY8201SZeZMZDjIdMfFTESBC0qB4BdTwG7n621if6nldik+nTbCTAnEnOn3BSLf9QWjp3GpZs2zhyv4PKHb+H5bwGpntcB7Eny+LzIN/4+XLfePYXM0nX9C83BbE2dOXBQb07dyFQvMPcvZaPxhrO+oKzrejhPsiBsaVK1fE92RI3Q16PHA1+cUnP1s5CPnTErqxsTLguXW7vwhN2pOVTKFzD18c+1J2VbuHQz8l7f/9mxhp+PTdSvmxwH4+XPRjqwpR9ISk09Yx4G59phNSXjQRzVzAgRJ+ErPop0REGIFY56yS9PvqMUDg5Mx3BC9T2+rN5bWjFMrFS/VAuxVOZ/MjaBujqVyfHgf/jOb6Y3rjhzvK0Dptv9B19eDHXl7wD4ZaTjmsNW1FAXdR/bwNqsenh0wVJZJTj8e/CkfnCrQGlZ/7+lXgC/KU8FISz84nPewZyKU9IyoUXeO6zcHYrI0g01Pk1pSVn6zru5XnvHObJCAlxse5cR9SJt29FlspEiNuBiZMFpRkVXVnrqmfiAaQEZi8iUN9JdY78uCg6/VUp5VQVtXhjzLSQIXqqi0qd+mgGu+k8ot4fvk7FOWOxfuKdilhVP16UO16G90+4/RNWLdAvbJMLYBD7hc5ocd6qbnwJwzPOTy6GkQsN80M7DdokRX5C5f6rYEF8aM8g7f+8/rgSKZi3rGdjZlBYTq5bMi+SXBRC2F3wHmGI2FgtTzRSJvsPKFaqKim6XK7eA5Rv1t6ADc+wzZsJqvlt6mXb/HJvApgQXNk1wDPrCuXzg/Wxy3KmCPuojRubnriTOiaZsxZUppBCZIBz9alMrRHOYZjF9cPPyLd9UY/wwe1ANYK+KGG0ZdKGIeYZGWApfAIXPVa1YZlA9W8f10cIRNIJewhbxip+Y6OX22AQSzne3z6YLTiP0DbuulzomxzGixcfPOhpJ4pycTqa6oymFaMl9ZtoicvqqWOqF5ctKt44DHjGdz/FIjAiVF2Xgsc0gpbsm80uFoxT07qu514zlrf5XzUjJbehWU2hM1pOf+8ULE+R+gJUyPTaBzp5JDHS14DRD33Au73s3nRx3OqG6BcgtSkdcncriQ3eK48vJl9YLBarYUyvK4mCLFBxmIDiKPgPYpj8Zg4vVOnChbSgqtDx5/xiI5f2m2+O4xbaKoTijFJTU/S4Yt1h/mXBdh+Ip/FK9E2ClUFQ6UCjTOba04DRCP6gretnA5Lgz3s9Bj3XkFqVE6pAYM1r3mZqD36A0z03Q0cSO+g7WOrXSKuJspc52WRUjqHSdwdxZTKyN94yuC2NrFJaBUWVlmjIICg7FfmW6PtbG9X6zF8TMnJ+Y6J93xyawY1IR21ZwGqEf8B29vOfdtNOBbDYWNgp4arBoJTGTUW1U+tuX1hCFiLEkNiq6axzig0FLYzV5sx9bFYovA/Mp7fLwXrHUga5Q/2gt+2PGeaELNP9BfezEG5eLma4M0HYjO1JwmtFNgWwnRe/5FmaD41JN1+uG5AQ6h5XbwID20jXVEBk34rbVorH17hvO1QnAP15LK7MJMz5Gay53qOZumvvA65q/VL8fv7FeYmLLBWi7ERGcNummQLYRIwOLw0yBmFPAaD6wlBilnlCNmWlaumaMaXA747IxbpRIVsVSMRUKHYWFrqKx2vhZ/qPaOZb1eZjsD38uXk3gnPzZVgHabkQEJ2ZaCGT7WUWxB7Ld3/SMG/nFjig6LHZkHx1aF8vTSnDYaZYYq4L/6wiR1cAy0n3enGruvHI6B57W2Z+scvGcHssVJTzFBVfNCpS7uDwdsO/42FEB2m5EBKeD6Bd6Si8b2IxANuM+fsO7rs7UaosoSKYSm732nWC1Tuuv3FGuz9DXa66dE09ZqHU3cbYtuLJtlcTK9A1BAVouszspQNuNiOB0Cd0UyHZqhFar5UZVaKE4VozJplnK4Fn8VMeFPPGThNLKEqDdwojgbBG6IpBdcYmRS0z8ph2JiARotynWJnbeFDpHxyuyWyAwQKs/E7oQv6Fm2kEsnJ1BYCBbTwuURCC7YYBWz1ck7DBEcITAQLaegbVRIBuNArR65kVBUAD4P+4IrAcsYs/+AAAAAElFTkSuQmCC) no-repeat;
    background-size: 100% 100%;
    height: 60px;
    padding: 0 59px;
    line-height: 48px;
    font-weight: 700
}

.contact-us .contact-us-container .contact-us-name .name-text {
    letter-spacing: 0;
    font-size: 20px;
    left: 30px;
    top: 15px;
    text-transform: uppercase
}

@media only screen and (min-width:460px) {
    .contact-us .contact-us-container .contact-us-name .name-text {
        letter-spacing: 0;
        font-size: 22px
    }
}

@media only screen and (min-width:680px) {
    .contact-us .contact-us-container .contact-us-name .name-text {
        letter-spacing: 1px;
        font-size: 24x
    }
}

@media only screen and (min-width:960px) {
    .contact-us .contact-us-container .contact-us-name .name-text {
        letter-spacing: 2px;
        font-size: 24px
    }
}

.contact-us .contact-us-container .contact-us-text {
    margin: 10px;
    padding: 20px 45px;
    border-radius: 14px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    -ms-border-radius: 14px;
    -o-border-radius: 14px;
    box-sizing: border-box;
    color: #00747f;
    background-color: rgb(167 248 255 / .6);
    font-size: 16px;
    line-height: 24px
}

.contact-us .contact-us-container .contact-us-text a {
    text-decoration: none;
    color: #000
}

.contact-us .contact-us-container .contact-us-text img {
    vertical-align: middle
}

.contact-us .contact-us-container .contact-us-text .title-text {
    font-size: 24px;
    line-height: 36px
}

.contact-us .contact-us-container .contact-us-text .seo-text {
    font-size: 16px;
    line-height: 24px
}

.contact-us .contact-us-container .contact-us-form {
    padding: 20px 10px
}

.contact-us .contact-us-container .contact-us-form .contact-us-input {
    display: block;
    margin-bottom: 20px;
    box-sizing: border-box;
    border: 1px solid #a7f8ff;
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding-top: 4px;
    padding-left: 20px;
    padding-right: 60px;
    border-radius: 14px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    -ms-border-radius: 14px;
    -o-border-radius: 14px;
    background: rgb(167 248 255 / .6);
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us .contact-us-container .contact-us-form .contact-us-input:focus {
    outline: none
}

.contact-us .contact-us-container .contact-us-form ::-webkit-input-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us .contact-us-container .contact-us-form :-moz-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us .contact-us-container .contact-us-form ::-moz-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us .contact-us-container .contact-us-form :-ms-input-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us .contact-us-container .contact-us-form input:-webkit-autofill,
.contact-us .contact-us-container .contact-us-form input:-webkit-autofill:hover,
.contact-us .contact-us-container .contact-us-form input:-webkit-autofill:focus,
.contact-us .contact-us-container .contact-us-form input:-webkit-autofill:active {
    transition-delay: 99999s;
    transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-transition-delay: 99999s;
    -webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-text-fill-color: #005c64
}

.contact-us .contact-us-container .contact-us-form .contact-us-textarea {
    width: 100%;
    height: 350px;
    display: block;
    margin-bottom: 20px;
    box-sizing: border-box;
    border: 1px solid #a7f8ff;
    width: 100%;
    line-height: 50px;
    padding-top: 15px;
    padding-left: 20px;
    padding-right: 60px;
    border-radius: 14px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    -ms-border-radius: 14px;
    -o-border-radius: 14px;
    background: rgb(167 248 255 / .6);
    color: #005c64;
    font-size: 18px;
    line-height: 18px;
    resize: none
}

.contact-us .contact-us-container .contact-us-form .contact-us-textarea:focus {
    outline: none
}

.contact-us .contact-us-container .contact-us-form input:-webkit-autofill,
.contact-us .contact-us-container .contact-us-form input:-webkit-autofill:hover,
.contact-us .contact-us-container .contact-us-form input:-webkit-autofill:focus,
.contact-us .contact-us-container .contact-us-form input:-webkit-autofill:active {
    transition-delay: 99999s;
    transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-transition-delay: 99999s;
    -webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-text-fill-color: #005c64
}

.contact-us-form {
    padding: 20px 10px
}

.contact-us-form .contact-us-input {
    display: block;
    margin-bottom: 20px;
    box-sizing: border-box;
    border: 1px solid #a7f8ff;
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding-top: 4px;
    padding-left: 20px;
    padding-right: 60px;
    border-radius: 14px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    -ms-border-radius: 14px;
    -o-border-radius: 14px;
    background: rgb(167 248 255 / .6);
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us-form .contact-us-input:focus {
    outline: none
}

.contact-us-form ::-webkit-input-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us-form :-moz-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us-form ::-moz-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us-form :-ms-input-placeholder {
    color: #005c64;
    font-size: 18px;
    line-height: 18px
}

.contact-us-form input:-webkit-autofill,
.contact-us-form input:-webkit-autofill:hover,
.contact-us-form input:-webkit-autofill:focus,
.contact-us-form input:-webkit-autofill:active {
    transition-delay: 99999s;
    transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-transition-delay: 99999s;
    -webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-text-fill-color: #005c64
}

.contact-us-form .contact-us-textarea {
    width: 100%;
    height: 350px;
    display: block;
    margin-bottom: 20px;
    box-sizing: border-box;
    border: 1px solid #a7f8ff;
    width: 100%;
    line-height: 50px;
    padding-top: 15px;
    padding-left: 20px;
    padding-right: 60px;
    border-radius: 14px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    -ms-border-radius: 14px;
    -o-border-radius: 14px;
    background: rgb(167 248 255 / .6);
    color: #005c64;
    font-size: 18px;
    line-height: 18px;
    resize: none
}

.contact-us-form .contact-us-textarea:focus {
    outline: none
}

.contact-us-form input:-webkit-autofill,
.contact-us-form input:-webkit-autofill:hover,
.contact-us-form input:-webkit-autofill:focus,
.contact-us-form input:-webkit-autofill:active {
    transition-delay: 99999s;
    transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-transition-delay: 99999s;
    -webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
    -webkit-text-fill-color: #005c64
}

.contact-us-form input[type='search']::-webkit-search-cancel-button {
    color: red;
    background: red
}

.contact-us-form .input-div {
    width: 100%;
    position: relative
}

.contact-us-form .input-div input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    position: relative;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background: url(../img/sprites_universal.png) -499px -325px
}

.contact-us-form .input-div .warn-text {
    color: #f30300;
    font-size: 16px;
    margin: -16px 0 10px 20px
}

.contact-us-form .google-container {
    display: flex;
    justify-content: center;
    position: relative
}

.contact-us-form .verify-warn {
    display: flex;
    justify-content: center
}

.contact-us-form .verify-warn .warn-text {
    color: #f30300;
    font-size: 16px
}

.contact-us-form .button-container {
    display: flex;
    justify-content: center
}

.contact-us-form .button-container .contact-us-button {
    width: 200px;
    height: 60px;
    background: #ffde00;
    box-shadow: 0 2px 0 0 #ffba00;
    color: #756600;
    border: none;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    font-size: 22px;
    font-weight: 700;
    margin: 20px;
    cursor: pointer
}

.contact-us-form .button-container .contact-us-button-disabled {
    width: 200px;
    height: 60px;
    background: #d9d9d9;
    box-shadow: 0 2px 0 0 #c3c3c3;
    color: #fff;
    border: none;
    border-radius: 30px;
    font-size: 22px;
    font-weight: 700;
    margin: 20px;
    cursor: not-allowed
}

@keyframes submitting {
    0% {
        -webkit-transform: rotate(0deg)
    }

    25% {
        -webkit-transform: rotate(90deg)
    }

    50% {
        -webkit-transform: rotate(180deg)
    }

    75% {
        -webkit-transform: rotate(270deg)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

.contact-us-form .button-container .is-submitting div {
    margin-top: 7px;
    animation: submitting 2s linear infinite
}

#result-container {
    display: none
}

.contact-us-form .result-container {
    display: flex;
    justify-content: center
}

.contact-us-form .result-container .result-text {
    color: #f30300;
    font-size: 20px
}

.no-games-text {
    text-align: center;
    line-height: 50px;
    color: #007782;
    font-size: 18px;
    margin: 20px 0
}

.train-head,
.train-1,
.train-2,
.train-3 {
    display: none
}

@media only screen and (min-width:500px) {
    .train-head {
        display: block
    }

    .train-1,
    .train-2,
    .train-3 {
        display: none
    }
}

@media only screen and (min-width:650px) {

    .train-head,
    .train-1 {
        display: block
    }

    .train-2,
    .train-3 {
        display: none
    }
}

@media only screen and (min-width:750px) {

    .train-head,
    .train-1,
    .train-2 {
        display: block
    }

    .train-3 {
        display: none
    }
}

@media only screen and (min-width:1000px) {

    .train-head,
    .train-1,
    .train-2,
    .train-3 {
        display: block
    }
}

.verify-icon {
    display: none
}

.warn-text {
    display: none
}

.pc-page #keywordsInput {
    width: 340px
}

.pc-page .pc-page-main {
    min-height: calc(100vh - 202px)
}

.pc-page .game-container {
    position: relative
}

.pc-page .game-card {
    width: 100%;
    height: 100%;
    border: none
}

.pc-page .footer-center {
    display: flex
}

.pc-page .footer-left {
    display: block
}

.pc-page .pc-page-logo {
    line-height: 90px
}

.pc-page .footer-center .pc-page-logo {
    line-height: 70px
}

.pc-page .link-span {
    margin-left: 25px
}

.pc-page .back-button {
    bottom: 100px
}

.pc-page .back-button img {
    width: 80px
}

.pc-page .show-text-center {
    min-height: 689px
}

.pc-page .show-text-top .name-text {
    left: 44px;
    top: 18px
}

.pc-page .show-text-main {
    min-height: 689px
}

.pc-page .show-text-text {
    margin-bottom: 50px
}

.pc-page .contact-us-center {
    min-height: 654px
}

.pc-page .contact-us-top .name-text {
    left: 48px;
    top: 18px
}

.pc-page .contact-us-main {
    min-height: 654px
}

.pc-page .detail-main {
    min-height: 954px
}

.pc-page .iframe-main {
    width: 1200px;
    height: 674px
}

.pc-page .iframe-detail {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;
    width: 1200px;
    height: 674px
}

.pc-page .game-text {
    display: flex
}

.pc-page .game-tag-title {
    margin-right: 20px
}

.pc-page .game-tag-div {
    margin-right: 10px;
    margin-bottom: 10px
}

.pc-page .error-img img {
    max-width: 500px;
    width: 70%
}

.m-page .m-page-logo {
    line-height: 90px
}

.m-page .m-page-logo a img {
    width: 148px
}

.long-logo {
    display: none
}

.short-logo {
    display: inherit;
    width: 148px
}

@media only screen and (min-width:800px) {
    .long-logo {
        display: inherit;
        width: 286px
    }

    .short-logo {
        display: none
    }
}

.long-train {
    display: none
}

@media only screen and (min-width:500px) {
    .long-train {
        display: block
    }

    .short-train {
        display: none
    }
}

.game-container {
    padding: 0 3px
}

.train-menu-img-short {
    right: -54px;
    top: -32px
}

#train-menu-img-short {
    margin: -32px 0 0 -20px
}

.train-menu-short {
    display: none;
    margin: -32px 0 0 -35px
}

#train-menu-short {
    margin: -32px 0 0 -35px
}

#headerMenu {
    position: absolute;
    right: 0;
    width: 80px;
    display: none
}

#menu-div-short ul {
    top: 105px;
    left: -160px
}

#footer-long {
    display: none
}

@media only screen and (min-width:1100px) {
    .footer-center .footer-separator {
        display: none
    }

    #footer-short .footer-center .footer-right {
        line-height: 70px
    }

    #footer-short .footer-center .footer-right span {
        margin-left: 25px
    }
}

#footer-short .footer-center {
    display: flex
}

#footer-short .footer-center img {
    width: 286px
}

#footer-short .footer-right {
    font-size: 18px;
    line-height: 35px;
    min-width: 230px;
    text-indent: -30px
}

#footer-short .footer-right a {
    color: #3c5f00
}

#footer-short .footer-right .link-span {
    margin-left: 8px
}

#footer-short .footer-left {
    display: none
}

#footer-short .footer-right {
    text-indent: 0
}

#footer-short .footer-center {
    justify-content: center
}

@media only screen and (min-width:750px) {
    #footer-short .footer-left {
        display: block
    }

    #footer-short .footer-center {
        justify-content: center;
    }

    #footer-short .footer-right {
        text-indent: -30px
    }
}

.game-category {
    width: 100%;
    overflow: hidden
}

.game-category .title {
    text-align: center;
    color: #fff;
    font-size: 22px;
    padding-bottom: 10px
}

.game-category .list {
    overflow: hidden
}

.game-category .list a:nth-child(-n+36) {
    display: block
}

.game-category .list .name {
    float: left;
    height: 30px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100% !important;
    font-size: 13px;
    overflow: hidden
}

.game-category .list a {
    color: #000
}

@media (hover:hover) {
    .game-category .list a:hover {
        color: #fdb504
    }
}

.game-category .list .name .text {
    float: left;
    text-align: center
}

.categories-title {
    display: flex;
    margin: 10px
}

.game-category .categories-title {
    margin-top: 0
}

.category-title {
    width: 242px;
    height: 42px
}

.category-tags {
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%
}

.link-name {
    text-decoration: none;
    color: inherit;
    display: inline-block;
    width: max-content
}

@media only screen and (min-width:400px) {
    .game-category .list .name {
        height: 60px;
        width: calc(100% - 60px);
        font-size: 13px
    }
}

@media only screen and (min-width:320px) {
    .game-container .card-container {
        --margin: 8px;
        --allWidth: calc(100% - 48px);
        --width: calc((100% - 48px) / 3);
        margin: var(--margin);
        width: var(--width);
        min-width: 0;
        min-height: 0
    }
}

@media only screen and (min-width:600px) {
    .game-category .list .name {
        height: 70px;
        width: calc(100% - 70px);
        font-size: 13px
    }
}

@media only screen and (min-width:880px) {
    .game-container .card-container {
        --margin: 10px;
        --allWidth: calc(100% - 80px);
        --width: calc((100% - 80px) / 4);
        margin: var(--margin);
        width: var(--width);
        min-width: 0;
        min-height: 0
    }

    .game-category .list .name {
        height: 80px;
        width: calc(100% - 80px);
        font-size: 16px
    }
}

@media only screen and (min-width:1200px) {
    .game-container .card-container {
        --margin: 10px;
        --allWidth: calc(100% - 100px);
        --width: calc((100% - 100px) / 5);
        margin: var(--margin);
        width: var(--width);
        min-width: 0;
        min-height: 0
    }

    .game-category .list .name {
        height: 100px;
        width: calc(100% - 100px);
        font-size: 18px
    }
}

.detail-show-main {
    display: flex
}

.detail-show-main .game-container {
    padding: 0
}

.detail-show-main .game-right {
    display: none;
    margin-left: -3px;
    margin-top: -3px
}

.game-right a {
    display: none !important
}

@media only screen and (min-width:1000px) {
    .detail-show-main .game-right {
        display: block
    }
}

#pregamediv {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 7;
    width: 100%;
    height: 100%;
    text-align: center;
    float: left
}

#pregamediv_ad {
    position: relative;
    padding: 10px 10px 0 10px
}

#adsContainer {
    width: 100%;
    height: 100%;
    display: none;
    flex: 1;
    overflow: hidden;
    position: relative
}

#ClickToPlayHref {
    display: inline-block
}

.play-button-container:hover {
    opacity: .8;
    cursor: pointer
}

#ClickToPlayHref img {
    width: 200px;
    height: 150px
}

.play-button-container {
    margin: 10px;
    position: relative;
    width: 180px;
    height: 60px
}

@keyframes loading {
    0% {
        -webkit-transform: rotate(0deg)
    }

    25% {
        -webkit-transform: rotate(90deg)
    }

    50% {
        -webkit-transform: rotate(180deg)
    }

    75% {
        -webkit-transform: rotate(270deg)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

#blurred-img {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    z-index: 6;
    filter: blur(45px);
    opacity: .9;
    background: #20daeb
}

#iframe-container {
    opacity: 0
}

#game_frame {
    display: none
}

#game-iframe-div,
#iframe-main-div,
#game_frame {
    width: calc(100vw - 20px)
}

#game-iframe-div {
    min-height: 230px
}

#iframe-main-div,
#game_frame {
    min-height: 186px
}

@media only screen and (min-width:1000px) {

    #game-iframe-div,
    #iframe-main-div,
    #game_frame {
        width: calc(100vw - 230px)
    }
}

@media only screen and (min-width:1220px) {

    #game-iframe-div,
    #iframe-main-div,
    #game_frame {
        width: 1000px
    }
}

#game-iframe-div {
    height: min(450px, calc(100vh - 92px))
}

#iframe-main-div,
#game_frame {
    height: min(404px, calc(100vh - 184px))
}

@media only screen and (min-height:240px) {
    .game-right a:nth-child(1) {
        display: block !important
    }
}

@media only screen and (min-height:385px) {
    .game-right a:nth-child(2) {
        display: block !important
    }
}

@media only screen and (min-height:539px) {
    .game-right a:nth-child(3) {
        display: block !important
    }
}

.sprite {
    display: inline-block
}

.bg-add {
    width: 56px;
    height: 56px;
    background: url(../img/sprites_game.png) -307px -94px;
    scale: .6;
    cursor: pointer
}

.bg-button {
    width: 193px;
    height: 73px;
    background: url(../img/sprites_game.png) -10px -10px;
    scale: .9
}

.bg-collect {
    width: 64px;
    height: 64px;
    background: url(../img/sprites_game.png) -223px -10px
}

.bg-full_screen {
    width: 64px;
    height: 64px;
    background: url(../img/sprites_game.png) -10px -169px;
    scale: .5;
    cursor: pointer
}

.bg-exit_full_screen {
    width: 64px;
    height: 64px;
    background: url(../img/sprites_game.png) -94px -169px;
    scale: .5;
    cursor: pointer
}

.bg-loading {
    width: 44px;
    height: 44px;
    background: url(../img/sprites_game.png) -307px -165px
}

.bg-not_collect {
    width: 64px;
    height: 64px;
    background: url(../img/sprites_game.png) -178px -169px
}

.bg-play {
    width: 114px;
    height: 46px;
    background: url(../img/sprites_game.png) -10px -103px
}

.bg-refresh {
    width: 64px;
    height: 64px;
    background: url(../img/sprites_game.png) -307px -10px;
    scale: .5;
    cursor: pointer
}

.bg-segment {
    width: 2px;
    height: 50px;
    background: url(../img/sprites_game.png) -223px -94px;
    scale: .7
}

.bg-bear {
    width: 60px;
    height: 80px;
    background: url(../img/sprites_universal.png) -296px -117px
}

.bg-bell {
    width: 50px;
    height: 80px;
    background: url(../img/sprites_universal.png) -396px -229px
}

.bg-bottle {
    width: 57px;
    height: 80px;
    background: url(../img/sprites_universal.png) -10px -259px
}

.bg-cloud {
    width: 80px;
    height: 49px;
    background: url(../img/sprites_universal.png) -10px -359px
}

.bg-duck {
    width: 80px;
    height: 87px;
    background: url(../img/sprites_universal.png) -296px -10px
}

.bg-star {
    width: 60px;
    height: 57px;
    background: url(../img/sprites_universal.png) -499px -10px
}

.bg-locomotive {
    width: 114px;
    height: 77px;
    background: url(../img/sprites_universal.png) -162px -10px
}

.bg-locomotive_choose {
    width: 114px;
    height: 77px;
    background: url(../img/sprites_universal.png) -144px -162px;
    margin-left: 0 !important
}

.bg-locomotive_more {
    width: 114px;
    height: 77px;
    background: url(../img/sprites_universal.png) -10px -162px
}

.bg-train1 {
    width: 83px;
    height: 53px;
    background: url(../img/sprites_universal.png) -87px -259px
}

.bg-train2 {
    width: 83px;
    height: 53px;
    background: url(../img/sprites_universal.png) -190px -259px
}

.bg-train3 {
    width: 83px;
    height: 53px;
    background: url(../img/sprites_universal.png) -293px -259px
}

.bg-train4 {
    width: 83px;
    height: 53px;
    background: url(../img/sprites_universal.png) -396px -156px
}

.bg-train4_choose {
    width: 83px;
    height: 53px;
    background: url(../img/sprites_universal.png) -396px -10px
}

.bg-train4_more {
    width: 83px;
    height: 53px;
    background: url(../img/sprites_universal.png) -396px -83px
}

.bg-clear {
    width: 30px;
    height: 30px;
    background: url(../img/sprites_universal.png) -499px -325px
}

.bg-search {
    width: 40px;
    height: 40px;
    background: url(../img/sprites_universal.png) -499px -87px
}

.sc75 {
    scale: .75
}

.bg-searching {
    width: 40px;
    height: 40px;
    background: url(../img/sprites_universal.png) -499px -147px
}

.bg-submitting {
    width: 40px;
    height: 40px;
    background: url(../img/sprites_universal.png) -499px -207px
}

.bg-totop {
    width: 132px;
    height: 132px;
    background: url(../img/sprites_universal.png) -10px -10px;
    scale: .4;
    right: -30px
}

@media only screen and (min-width:500px) {
    .bg-totop {
        scale: .5;
        right: -20px
    }
}

@media only screen and (min-width:800px) {
    .bg-totop {
        scale: .6;
        right: -10px
    }
}

.bg-verify {
    width: 38px;
    height: 38px;
    background: url(../img/sprites_universal.png) -499px -267px;
    scale: .7;
    display: none
}

:root {
    --game-show-color1: #29d9e9;
    --game-more-color1: #e4e4e4;
    --game-thumb-color1: #f2f2f2;
    --game-show-color2: #ffa67a;
    --game-more-color2: #d1d4ff;
    --game-thumb-color2: #e1e2ff;
    --game-show-color3: #b6d863;
    --game-more-color3: #efc7ad;
    --game-thumb-color3: #f3d6c4;
    --game-show-color4: #f5aaaa;
    --game-more-color4: #f8c7e4;
    --game-thumb-color4: #ffddf1;
    --game-show-color5: #9ba9f1;
    --game-more-color5: #b6ebf1;
    --game-thumb-color5: #d5faff;
    --game-show-color6: #ba95ff;
    --game-more-color6: #f9daa4;
    --game-thumb-color6: #fbe7c2;
    --all-bg-color: #fbfbfb;
    --all-text-color: #000;
    --page-bg-color: #fbfbfb;
    --header-footer-color: #f2f2f2;
    --search-input-bg-color: #fff;
    --search-icon-color: #8f8f8f;
    --normal-card-bg-color: #f2f2f2;
    --svg-close-all-color: #c1c1c1;
    --svg-close-one-color: #ffffff;
    --svg-close-one-bg-color: #f2f2f266;
    --close-bg-color: #f2f2f2;
    --play-bg-color: #f2f2f2;
    --play-info-bg-color: #fbfbfb;
    --play-foot-bg-color: #ffde00;
    --like-hover-color: #00b8c9;
    --form-input-color: #e4e4e4;
    --item-bg-color: #e4e4e4;
    --item-hover-bg-color: #f2f2f2;
    --info-btn-color: #fdb504;
    --top-menu-bg-color: #e4e4e4;
    --game-menu-color: #fdb504;
    --highlight-color: #fdb504;
    --move-btn-path-color: #e5d45d;
    --highlight-bg-color: #fd613b33;
    --loading-bg-color: #e4e4e4;
    --totop-url: url(../img/totop-white.png);
    --pagi-li-bg-color: #29cedd;
    --model-bg-color: rgba(20, 20, 20, 0.8);
    --game-btn-more-color: #e5d45d;
    --game-btn-help-color: #ff9788;
    --game-btn-feedback-color: #53f1ff;
    --game-btn-refresh-color: #eaa4e4;
    --game-btn-fullscreen-color: #7eff81;
    --game-btn-download-color: #ffb57a
}

body {
    background: var(--all-bg-color);
    color: var(--all-text-color)
}

a {
    color: var(--all-text-color)
}

@font-face {
    font-family: montserrat;
    src: url(../font/Montserrat-Regular.ttf);
    font-display: swap
}

@font-face {
    font-family: bobohei;
    src: url(../font/JingNanBoBoHei-Bold-2.ttf);
    font-display: swap
}

* {
    scrollbar-width: none;
    -ms-overflow-style: none;
    font-family: montserrat, arial, sans-serif !important
}

.game-category .list a,
.tag-game .thumb {
    background: var(--normal-card-bg-color)
}

.played-all-close-icon svg path {
    fill: var(--svg-close-all-color)
}

.played-close-icon svg path {
    fill: var(--svg-close-one-color)
}

.card-per-container .thumb {
    background-color: #fff !important
}

.played-close-icon {
    background: var(--svg-close-one-bg-color)
}

.card-per-container:nth-child(6n+1) .index-more,
.card-per-container:nth-child(6n+1) .game-show-container,
.card-per-container:nth-child(6n+1) .game-show-icon-background {
    background: var(--game-show-color1)
}

.card-per-container:nth-child(6n+1) .name-more {
    background: var(--game-more-color1)
}

.card-per-container:nth-child(6n+1) .category-tags {
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%
}

.card-per-container:nth-child(6n+1) .thumb {
    background: var(--game-thumb-color1)
}

.card-per-container:nth-child(6n+2) .index-more,
.card-per-container:nth-child(6n+2) .game-show-container,
.card-per-container:nth-child(6n+2) .game-show-icon-background {
    background: var(--game-show-color2)
}

.card-per-container:nth-child(6n+2) .name-more {
    background: var(--game-more-color2)
}

.card-per-container:nth-child(6n+2) .category-tags {
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%
}

.card-per-container:nth-child(6n+2) .thumb {
    background: var(--game-thumb-color2)
}

.card-per-container:nth-child(6n+3) .index-more,
.card-per-container:nth-child(6n+3) .game-show-container,
.card-per-container:nth-child(6n+3) .game-show-icon-background {
    background: var(--game-show-color3)
}

.card-per-container:nth-child(6n+3) .name-more {
    background: var(--game-more-color3)
}

.card-per-container:nth-child(6n+3) .category-tags {
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%
}

.card-per-container:nth-child(6n+3) .thumb {
    background: var(--game-thumb-color3)
}

.card-per-container:nth-child(6n+4) .index-more,
.card-per-container:nth-child(6n+4) .game-show-container,
.card-per-container:nth-child(6n+4) .game-show-icon-background {
    background: var(--game-show-color4)
}

.card-per-container:nth-child(6n+4) .name-more {
    background: var(--game-more-color4)
}

.card-per-container:nth-child(6n+4) .category-tags {
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%
}

.card-per-container:nth-child(6n+4) .thumb {
    background: var(--game-thumb-color4)
}

.card-per-container:nth-child(6n+5) .index-more,
.card-per-container:nth-child(6n+5) .game-show-container,
.card-per-container:nth-child(6n+5) .game-show-icon-background {
    background: var(--game-show-color5)
}

.card-per-container:nth-child(6n+5) .name-more {
    background: var(--game-more-color5)
}

.card-per-container:nth-child(6n+5) .category-tags {
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%
}

.card-per-container:nth-child(6n+5) .thumb {
    background: var(--game-thumb-color5)
}

.card-per-container:nth-child(6n+6) .index-more,
.card-per-container:nth-child(6n+6) .game-show-container,
.card-per-container:nth-child(6n+6) .game-show-icon-background {
    background: var(--game-show-color6)
}

.card-per-container:nth-child(6n+6) .name-more {
    background: var(--game-more-color6)
}

.card-per-container:nth-child(6n+6) .category-tags {
    background: url(data:image/png;base64,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) no-repeat;
    background-size: 100% 100%
}

.card-per-container:nth-child(6n+6) .thumb {
    background: var(--game-thumb-color6)
}

.card-per-container .game-show-container {
    padding: 0
}

.card-per-container {
    position: relative
}

.game-tag-name {
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.thumb a {
    width: 100%;
    display: block;
    height: 100%;
    box-sizing: border-box
}

.game-tag-name {
    height: 42px;
    user-select: none
}

.game-tag-name a {
    text-decoration: none
}

.tag-name-text {
    font-size: 18px;
    line-height: 42px;
    text-transform: uppercase;
    position: relative;
    display: flex;
    align-items: center;
    font-family: bobohei !important
}

.tag-name-text .tag-bg {
    position: absolute;
    z-index: -1;
    width: calc(100% + 27px);
    height: 100%
}

.tag-name-text .tag-icon {
    width: 38px;
    height: 38px;
    padding: 0 5px
}

.tag-name-text .tag-text-games {
    line-height: 42px;
    text-transform: uppercase;
    font-family: bobohei !important;
    margin-left: 5px
}

.tag-text-tag {
    line-height: 42px;
    text-transform: uppercase;
    font-family: bobohei !important;
    margin-left: 5px;
    display: block
}

@keyframes text-cartoon {
    2% {
        transform: translate(3px, -2px) rotate(3.5deg)
    }

    8% {
        transform: translate(4px, -2px) rotate(1.5deg)
    }

    10% {
        transform: translate(-4px, 5px) rotate(-1.5deg)
    }

    16% {
        transform: translate(0, 4px) rotate(1.5deg)
    }

    22% {
        transform: translate(4px, -6px) rotate(-2.5deg)
    }

    38% {
        transform: translate(2px, 4px) rotate(-1.5deg)
    }

    56% {
        transform: translate(-3px, 0) rotate(-0.5deg)
    }

    72% {
        transform: translate(-4px, 2px) rotate(1.5deg)
    }

    76% {
        transform: translate(2px, 4px) rotate(2.5deg)
    }

    98% {
        transform: translate(3px, 2px) rotate(-0.5deg)
    }

    0%,
    100% {
        transform: translate(0, 0) rotate(0)
    }
}

.more-text {
    animation: text-cartoon 1s 1 ease-in-out
}

.tag-name-text a {
    text-decoration: none
}

.played-title {
    padding-right: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.played-all-close-icon {
    width: 30px;
    height: 30px;
    cursor: pointer
}

.played-all-close-icon svg {
    pointer-events: none
}

.played-game-container .thumb {
    position: relative
}

.played-close-icon {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    top: 2px;
    right: 2px;
    z-index: 6;
    cursor: pointer;
    border-bottom-left-radius: 4px
}

.played-close-svg {
    pointer-events: none;
    width: 28px;
    height: 28px
}

.game-show-container {
    overflow: hidden;
    position: relative
}

.game-show-container ::-webkit-scrollbar {
    width: 0;
    display: none
}

.game-show {
    overflow: scroll;
    transition: all 1s linear
}

.game-show ::-webkit-scrollbar {
    width: 0;
    display: none
}

.game-show .game-container {
    display: block;
    padding: 10px 0;
    width: max-content;
    overflow: scroll;
    display: flex;
    align-items: center
}

.game-show .game-container:nth-child(2) {
    display: none
}

@media (max-width:700px) {
    .game-show .game-container:nth-child(2) {
        display: flex;
        padding-top: 0
    }
}

.game-show div.thumb {
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    margin: 0 5px;
    width: 46vw
}

@media screen and (min-width:360px) {
    .game-show div.thumb {
        width: 31vw
    }
}

@media screen and (min-width:500px) {
    .game-show div.thumb {
        width: 23vw
    }
}

@media screen and (min-width:720px) {
    .game-show div.thumb {
        width: 15.4vw
    }
}

@media screen and (max-width:800px) {
    .game-show div.thumb {}
}

@media screen and (min-width:800px) {
    .game-show div.thumb {}
}

@media screen and (min-width:900px) {
    .game-show div.thumb {
        width: 15.6vw
    }
}

@media screen and (min-width:1000px) {
    .game-show div.thumb {}
}

@media screen and (min-width:1172px) {
    .game-show div.thumb {
        width: 11.7vw
    }
}

@media screen and (min-width:1400px) {
    .game-show div.thumb {
        width: 11.9vw
    }
}

@media screen and (min-width:1600px) {
    .game-show div.thumb {}
}

@media screen and (min-width:1800px) {
    .game-show div.thumb {
        width: 7.8vw
    }
}

@media screen and (min-width:1900px) {
    .game-show div.thumb {}
}

@media screen and (min-width:2200px) {
    .game-show div.thumb {
        width: 7.9vw
    }
}

@media screen and (min-width:2400px) {
    .game-show div.thumb {
        width: 5.9vw
    }
}

@media screen and (min-width:3000px) {
    .game-show div.thumb {}
}

div.thumb a .img-container {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    aspect-ratio: 4/3;
    overflow: hidden;
    width: 100%
}

.GameText {
    height: auto;
    width: 100%;
    padding: 5px;
    text-align: left;
    box-sizing: border-box
}

.game-show-icon {
    position: absolute;
    top: 0;
    width: 36px;
    height: 100%;
    display: none;
    align-items: center;
    cursor: pointer;
    z-index: 10
}

.game-show-icon-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    pointer-events: none;
    transition: opacity 0.5s ease;
    opacity: .25
}

@media (hover:hover) {
    .game-show-container:hover .game-show-icon {
        display: flex
    }
}

@media (max-width:700px) {
    .game-show .game-container {
        padding: 5px 0
    }

    .played-close-icon {
        width: 20px;
        height: 20px;
        top: 2px;
        right: 2px
    }

    .played-close-svg {
        width: 18px;
        height: 18px
    }

    .game-show-icon {
        width: 18px
    }

    .game-tag-name {
        height: 36px
    }

    .tag-name-text {
        font-size: 14px;
        line-height: 36px
    }

    .card-per-container {
        margin: 7px 0
    }

    .tag-name-text .tag-bg {
        min-width: 142px
    }

    .card-per-container .game-show-container {
        padding: 0
    }

    .index-more {
        height: 23px;
        font-size: 14px;
        line-height: 28px;
        border: none;
        padding: 0 5px 3px 6px
    }

    .game-tag-name {
        height: 26px
    }

    .category-title {
        width: 153px;
        height: 30px
    }
}

@media (max-width:400px) {
    .tag-text-games {
        display: none
    }
}

.game-show-icon svg {
    width: 36px;
    height: 36px;
    pointer-events: none;
    position: relative;
    z-index: 10;
    fill: #fff;
    opacity: .5
}

.game-show-icon:hover svg {
    opacity: 1
}

.game-show-icon:hover .game-show-icon-background {
    opacity: .75
}

.previous-icon {
    left: 0;
    opacity: 0;
    pointer-events: none
}

.next-icon {
    right: 0;
    opacity: 0;
    pointer-events: none
}

.game-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr
}

.tag-tittle {
    font-size: 18px;
    margin: 10px 20px 6px;
    user-select: none;
    text-transform: uppercase;
    font-family: bobohei !important
}

.tag-game {
    grid-template-columns: 1fr !important
}

.tag-game .thumb {
    text-align: center;
    position: relative;
    aspect-ratio: inherit;
    float: left;
    --margin: 4px;
    --allWidth: calc(100% - 16px);
    --width: calc((100% - 16px) / 2);
    margin: var(--margin);
    overflow: hidden;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px
}

.img-container img {
    background: url(/assets/img/default.jpg) no-repeat;
    background-size: cover
}

.tag-game .thumb a .img-container {
    aspect-ratio: 4/3;
    margin: 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    overflow: hidden
}

.tag-game .thumb a {
    text-decoration: none;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    display: flex;
    align-items: center;
    flex-direction: row;
    text-align: left
}

.tag-game .thumb img {
    border: none !important;
    max-height: 160px;
    max-width: 160px;
    aspect-ratio: 4/3
}

.tag-game .GameText {
    width: 70%;
    height: 70%;
    margin-right: 10px
}

.tag-game .GameText .GameName {
    font-weight: bolder;
    font-size: 16px
}

.GameDescribe {
    font-size: 14px;
    line-height: 16px;
    max-height: 48px;
    font-weight: 400;
    overflow: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: none
}

.GameDescribe::-webkit-scrollbar {
    display: none
}

.tag-game .GameDescribe {
    display: block
}

div.thumb a img {
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

div.thumb a {
    text-decoration: none;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    display: flex;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .2);
    background: rgb(167 248 255 / .6)
}

@media (hover:hover) {
    div.thumb a:hover img {
        transition: 0.5s;
        transform: scale(1.1)
    }
}

.thumb img {
    border: none !important;
    object-fit: fill
}

.GameText {
    display: flex;
    flex-direction: column;
    height: 70%;
    justify-content: space-evenly;
    align-items: center
}

div.thumb div.GameName {
    width: 100%;
    height: auto;
    padding: 0 0 5px 0;
    font-size: 12px;
    font-weight: lighter;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    padding: 0;
    color: #00636c;
    text-align: center;
    min-height: 26px
}

.index-card div.thumb div.GameName {
    color: #fff
}

@media only screen and (min-width:600px) {
    div.thumb div.GameName {
        font-size: 12px;
        min-height: 30px
    }
}

@media only screen and (min-width:1200px) {
    div.thumb div.GameName {
        font-size: 14px;
        min-height: 34px
    }
}

@media only screen and (min-width:650px) {
    body {}

    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr
    }

    .tag-game {
        grid-template-columns: 1fr 1fr !important
    }

    .gt {
        min-height: 135px
    }

    #gla {
        order: 2
    }
}

@media only screen and (min-width:800px) {
    .pregame-more .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
    }
}

@media only screen and (min-width:1072px) {
    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr
    }

    .tag-game {
        grid-template-columns: 1fr 1fr 1fr !important
    }

    .game-menu {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
    }

    #gla {
        order: 3
    }
}

@media only screen and (min-width:1424px) {
    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr
    }

    .tag-game {
        grid-template-columns: 1fr 1fr 1fr 1fr !important
    }

    .info-container .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
    }

    .info-container .game-container2 {
        grid-template-columns: inherit
    }

    .pregame-more .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
    }

    .game-menu {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
    }

    #gla {
        order: 4
    }
}

@media only screen and (min-width:1900px) {
    .info-container .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
    }

    .info-container .game-container2 {
        grid-template-columns: inherit
    }

    .pregame-more .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
    }
}

.game-category {
    width: 100%;
    overflow: hidden
}

.game-category .title {
    text-align: center;
    font-size: 22px;
    padding: 10px;
    user-select: none
}

.game-category .list {
    overflow: hidden;
    margin: 0 -12px 0 5px
}

.game-category .list a {
    display: none;
    font-size: 16px;
    float: left;
    margin: 5px 12px 5px 0;
    overflow: hidden;
    width: calc(50% - 15px);
    box-sizing: border-box;
    transition: none;
    border-radius: 6px;
    background-color: rgb(167 248 255 / .6) !important
}

.game-category .list a:nth-child(-n+36) {
    display: block
}

@media (hover:hover) {
    .game-category .list a:hover {
        color: var(--highlight-color)
    }
}

.game-category .list .item {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 1/1;
    float: left
}

.game-category .list .item img {
    height: 100% !important;
    width: 100% !important;
    vertical-align: middle
}

.game-category .list .name {
    float: left;
    height: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: calc(100% - 50px)
}

.game-category .list .name .text {
    float: left;
    text-align: center
}

.game-category .list .name .num {
    float: left;
    text-align: center;
    font-size: 12px
}

.game-page-background .game-category .list .item {
    width: 50px;
    height: 50px
}

.game-page-background .game-category .list .name {
    height: 50px;
    width: calc(100% - 50px)
}

@media only screen and (min-width:1300px) {
    .game-page-background .game-category .list .item {
        width: 100px;
        height: 100px
    }

    .game-page-background .game-category .list .name {
        height: 100px;
        width: calc(100% - 100px)
    }
}

@media only screen and (min-width:300px) {
    .game-category .list a {
        width: calc(33% - 12px)
    }
}

@media only screen and (min-width:500px) {
    .game-category .list a {
        width: calc(25% - 14px)
    }
}

@media only screen and (min-width:700px) {
    .game-category .list a {
        width: calc((100% / 6) - 13px)
    }
}

@media only screen and (min-width:900px) {
    .game-category .list a {
        width: calc((100% / 8) - 13px)
    }
}

@media only screen and (min-width:1200px) {
    .game-category .list a {
        width: calc((100% / 10) - 13px)
    }
}

@media only screen and (min-width:1600px) {
    .game-category .list a {
        width: calc((100% / 12) - 13px)
    }
}

@media only screen and (min-width:600px) {
    .game-page-background .game-category .list a {
        width: calc(33% - 12px)
    }
}

@media only screen and (min-width:1000px) {
    .game-page-background .game-category .list a {
        width: calc(25% - 14px)
    }
}

.game-category .name .text::after {
    content: ' '
}

.gamesPagination {
    clear: both;
    width: 100%;
    text-align: center;
    padding-top: 10px
}

.gamesPagination a {
    text-decoration: none;
    display: inline-block;
    overflow: hidden
}

.gamesPagination .pagination-btn {
    margin: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

.pagination-ul {
    list-style: none;
    user-select: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.pagination-ul li {
    display: inline-block;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-size: 20px;
    line-height: 44px;
    background: var(--pagi-li-bg-color);
    color: #72e9f4;
    position: relative;
    overflow: hidden;
    margin: 0 3px;
    box-sizing: border-box
}

.pagination-ul .pagination-li-first {
    color: #29cedd;
    background: #fff
}

.pagination-ul .pagination-li-split {
    background-color: #fff0;
    color: var(--pagi-li-bg-color)
}

.pagination-ul .pagination-li-active {
    color: #fff;
    background-color: #fff0;
    border: #fff 2px solid
}

.gamesPagination ul li.pagination-li-mobile {
    width: 200px;
    border-radius: 30px
}

.gamesPagination ul li.pagination-li-mobile {
    display: none
}

@media screen and (max-width:600px) {
    .gamesPagination ul li {
        display: none
    }

    .gamesPagination ul li.pagination-li-mobile {
        display: inline-block
    }
}

.pagi-icon {
    display: block;
    transform: translateY(1px);
    font-size: 16px
}

.random-game {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    user-select: none
}

.random-game img {
    width: 300px;
    user-select: none;
    cursor: pointer
}

.random-game-button {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #877500;
    width: max-content;
    min-width: 120px;
    line-height: 40px;
    margin: 20px auto;
    padding: 5px 15px;
    border-radius: 30px;
    cursor: pointer;
    transition: none;
    background-color: #ffde00;
    border: none;
    font-size: 16px;
    box-shadow: inset 0 1px 0 0 #fff6bd, inset 0 -2px 0 0 #f1d200
}

@media only screen and (max-width:500px) {
    .random-game-button {
        font-size: 12px
    }
}

.random-svg {
    fill: #877500;
    margin-right: 10px
}

@media (hover:hover) {
    .back-to-game-button:hover {
        scale: 1.1;
        background-color: var(--play-foot-bg-color)
    }

    .random-game-button:hover {
        scale: 1.1;
        background-color: var(--play-foot-bg-color)
    }
}

.submit-btn {
    border: 1px solid;
    width: 60px;
    margin: 20px auto;
    padding: 10px 20px;
    border-radius: 20px
}

@media (hover:hover) {
    .submit-btn:hover {
        background-color: var(--play-foot-bg-color)
    }
}

.train-menu .train-search {
    cursor: pointer;
    margin: -10px 10px 0 35px
}

@media only screen and (max-width:500px) {
    .train-menu .train-search {
        margin: -10px 10px 0 15px
    }
}

.top_search {
    display: flex;
    align-items: center;
    justify-content: center
}

.top_search_input {
    position: relative;
    line-height: 96px
}

.top_search_input input {
    line-height: 44px;
    padding: 0 0 0 5px;
    width: calc(100vw - 220px);
    max-width: 570px;
    height: 44px;
    font-size: 18px;
    padding-left: 10px;
    padding-right: 40px;
    box-sizing: border-box;
    border: none;
    background: #fff5b2;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

@media only screen and (min-width:700px) {
    .top_search_input input {
        width: calc(100vw - 400px)
    }
}

.top_search_input span {
    position: absolute;
    right: 3px;
    top: 2px;
    cursor: pointer
}

.top_search_input {
    position: relative;
    display: inline-block
}

.show {
    display: block !important
}

.dropdown-content {
    position: absolute;
    background-color: var(--normal-card-bg-color);
    overflow: auto;
    border: 1px solid var(--all-text-color);
    z-index: 11;
    margin-top: 3px;
    width: 100%
}

.dropdown-content a {
    color: var(--all-text-color);
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    background: var(--normal-card-bg-color)
}

@media (hover:hover) {
    .dropdown-content a:hover {
        background-color: var(--svg-close-all-color)
    }
}

.no-result-text {
    color: var(--all-text-color);
    padding: 12px 16px;
    display: block;
    background: var(--normal-card-bg-color);
    text-align: justify
}

.mobile-header input:focus {
    outline: 1px solid var(--all-text-color)
}

.pc-header input:focus {
    outline: 1px solid var(--all-text-color)
}

#myDropdown2 {
    margin-top: 2px;
    width: calc(100% - 106px)
}

.input-title {
    display: none
}

.contact-title {
    font-size: 22px;
    text-align: center;
    margin: 30px 0 0 0
}

.contact_container .input-div {
    margin: 0 auto;
    padding: 5px 0;
    justify-content: center;
    align-items: baseline;
    position: relative
}

.contact_container .contact-us-input {
    min-width: 300px;
    max-width: 500px;
    height: 40px;
    width: calc(100% - 50px);
    font-family: auto;
    padding: 5px;
    padding-right: 40px;
    background: var(--search-input-bg-color);
    color: #005c64;
    border-radius: 5px;
    background-color: var(--form-input-color);
    border: none
}

.contact_container .contact-us-textarea {
    min-width: 298px;
    max-width: 498px;
    height: 300px;
    resize: none;
    width: calc(100% - 52px);
    font-family: auto;
    background: var(--search-input-bg-color);
    color: var(--all-text-color);
    padding: 5px;
    border-radius: 5px;
    background-color: var(--form-input-color);
    border: none;
    box-sizing: border-box
}

.contact-us-main {
    width: 100%;
    display: flex;
    justify-content: center
}

.contact-us-form {
    width: 100%;
    max-width: 1220px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative
}

.contact-us-main .input-title {
    position: absolute;
    left: -110px;
    top: 22px;
    width: 100px;
    text-align: right;
    font-size: 1rem
}

.warn-text {
    display: none;
    text-align: left;
    margin-left: 0;
    margin-top: 7px;
    margin-bottom: -5px;
    color: var(--highlight-color)
}

.contact-us-form .button-container {
    display: flex;
    justify-content: center
}

.contact-us-form .button-container .contact-us-button {
    width: 200px;
    height: 60px;
    color: #fff;
    background-color: #29d9e9;
    border: 1px #00c3d5 solid;
    box-shadow: 3px 3px 2px #00c3d5;
    background: none;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    font-size: 22px;
    margin: 20px;
    cursor: pointer
}

@media (hover:hover) {
    .contact-us-button:hover {
        background-color: var(--pagi-li-bg-color) !important
    }
}

.contact-us-form .button-container .contact-us-button-disabled {
    width: 200px;
    height: 60px;
    background: #d9d9d9;
    box-shadow: 0 2px 0 0 #c3c3c3;
    color: #fff;
    border: none;
    border-radius: 30px;
    font-size: 22px;
    margin: 20px;
    cursor: not-allowed
}

@media only screen and (min-width:1000px) {
    .pc-header {
        display: block
    }

    .mobile-header {
        display: none
    }

    .input-title {
        display: block
    }

    .warn-text {
        margin-left: 75px;
        margin-bottom: -10px
    }

    .verify-icon {
        top: 19px;
        right: 81px
    }

    .contact-title {
        font-size: 2em
    }

    .contact_container .contact-us-input {
        width: 500px
    }

    .contact_container .contact-us-textarea {
        width: 498px
    }

    .contact_container .input-div {
        margin: 0 auto;
        width: 500px;
        padding: 10px 0;
        justify-content: flex-end;
        align-items: baseline
    }
}

.contact-us-form .verify-icon {
    position: absolute;
    right: 7px;
    top: 7px
}

.bg-verify {
    width: 38px;
    height: 38px;
    background: url(../img/sprites_universal.png) -499px -267px;
    scale: .7;
    display: none
}

#promote-game-container {
    display: block;
    overflow: hidden;
    margin-top: 10px
}

.promote-game .thumb {
    aspect-ratio: 4 / 3;
    position: relative;
    float: left;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px
}

.promote-game .thumb div.GameName {
    position: absolute;
    text-align: center;
    bottom: -3px;
    left: 0;
    width: 100%;
    height: auto;
    display: none;
    color: #fff;
    background-color: var(--highlight-color);
    padding: 5px 0 5px 0;
    font-size: 14px;
    font-weight: 700;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    opacity: .95
}

.promote-game .img-container img {
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border: 2px solid white !important
}

@keyframes cardwrap2 {
    0% {
        transform: translateY(5px)
    }

    100% {
        transform: translateY(0)
    }
}

.promote-game .GameName {
    display: none
}

@media (hover:hover) {
    .promote-game .thumb :hover .GameName {
        display: block;
        border: none !important;
        animation: cardwrap2 0.2s linear;
        font-weight: lighter
    }

    .promote-game .thumb :hover .img-container img {
        transform: none !important;
        transition: 0ms;
        border: 2px solid var(--highlight-color) !important
    }
}

@media only screen and (min-width:200px) {
    .promote-game .thumb {
        --margin: 4px;
        --allWidth: calc(100% - 16px);
        --width: calc((100% - 16px) / 2);
        margin: var(--margin);
        width: var(--width)
    }
}

@media only screen and (min-width:300px) {
    .promote-game .thumb {
        --margin: 4px;
        --allWidth: calc(100% - 24px);
        --width: calc((100% - 24px) / 3);
        margin: var(--margin);
        width: var(--width)
    }
}

@media only screen and (min-width:540px) {
    .promote-game .thumb {
        --margin: 4px;
        --allWidth: calc(100% -32px);
        --width: calc((100% - 32px) / 4);
        margin: var(--margin);
        width: var(--width)
    }
}

@media only screen and (min-width:720px) {
    .promote-game .thumb {
        --margin: 5px;
        --allWidth: calc(100% - 60px);
        --width: calc((100% - 60px) / 6);
        margin: var(--margin);
        width: var(--width)
    }
}

@media only screen and (min-width:1200px) {
    .promote-game .thumb {
        --margin: 6px;
        --allWidth: calc(100% - 96px);
        --width: calc((100% - 96px) / 8);
        margin: var(--margin);
        width: var(--width)
    }
}

@media only screen and (min-width:1600px) {
    .promote-game .thumb {
        --margin: 7px;
        --allWidth: calc(100% - 168px);
        --width: calc((100% - 168px) / 12);
        margin: var(--margin);
        width: var(--width)
    }
}

.GameDescribe {
    font-size: 14px;
    line-height: 16px;
    max-height: 48px;
    font-weight: 400;
    overflow: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: none
}

.GameDescribe::-webkit-scrollbar {
    display: none
}

.tag-game .GameDescribe {
    display: block
}

.cateTitle {
    width: 35px;
    height: 35px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAYAAAAehFoBAAAAAXNSR0IArs4c6QAAAgFJREFUWEftmD9rU1EYxn/PN+giKHVoHYrtlDEKgn4B9y4dO9hFQ0FwsM2kS+lkwNmP4AdwsUPo0NqhUKmQQinUQr/CKyfcQk1y7zknybk3CXmXO9yX5/3x5Mn5c8WUlaaMlzlw6l9s7vBEOmxm68DKiHA3klqxGtGRMLN94G3soJz+bUl7MVrDAO8AuzFDCnpbkrZitIYBXgIctHuOUh2gKck9gysaOFg5UeNsApvZyywGiXzryr6TdOwbEOSwmZlPaAzvO5KWfTqTBPxd0uuxADsRM3MrQ7KS1AwRD3I4RKisntkANrOvwGZZruXM2ZfU6H3X57CZPQKuKoa9G7/cuxMOAn4A/J0Q4IeSru+zDMywmf0A3GZRZf2U9MIbiWwJewN8qZIWaEhyR9n/Ks/hReCyYuAlSRdBwJnLVcaiLak+yLDcddjMqozFB0mfYoGfAH8qisVTSWdRwBXGIjcOjqlwazYzd9ns+6cmdn236CDkA14FThMD9srXJP3Km+k9/JS8iRTGwRuJLMfvgc8luVwYh1DgGnBUEnBdUrtoljcSmcsHwPPE0N44BDmcAX90Hz0SA3vjEAPsYuG26oVE0LfAK0knPv2gSGQuuxuIu4mkqA1J30KEg4Ez6DXgGfA4RDyg5xw4lPQ7oLfbEgUcKpqybw6c0t15JFK7O5UO/wOZAo4t3jDlQgAAAABJRU5ErkJggg==) 100% 100% no-repeat;
    background-size: 100% 100%
}

.play-game {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    box-sizing: border-box;
    background-color: var(--play-bg-color);
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row
}

.play-game-left {
    width: 40px;
    background-color: #00b8c9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 3;
    box-sizing: border-box;
    height: 100%
}

.play-game-left a {
    transition: none
}

#header-as {
    display: none;
    height: 100px;
    overflow: hidden;
    min-width: 300px;
    text-align: center;
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 999;
    background: var(--item-bg-color)
}

#play-game {
    display: none
}

#loading-cover-div {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0
}

.flex-container {
    width: 100%;
    height: 100%;
    position: relative
}

.pregame-container {
    padding: 0 10px;
    box-sizing: border-box
}

.pregame-main {
    width: 100%;
    height: max-content;
    min-width: 340px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
    text-align: center;
    box-sizing: border-box;
    margin-bottom: 15px;
    padding: 15px 0 15px;
    overflow: hidden
}

.pregame-bg {
    width: 90%;
    height: 90%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 350px
}

.blurred-img {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    z-index: 0;
    background-size: 100% auto;
    background-position: center
}

@media only screen and (max-width:500px) {
    .blurred-img {
        background-size: auto 100%
    }
}

.blurred-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
    opacity: .2
}

.game-box {
    position: absolute;
    height: 100%;
    aspect-ratio: 181/150;
    background-repeat: no-repeat;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center
}

.game-box-svg {
    width: 100%;
    height: 100%
}

.game-box-opacity {
    cursor: pointer
}

.game-box-opacity+div {
    pointer-events: none
}

@media (hover:hover) {
    .game-box-opacity:hover {
        opacity: .6
    }

    .game-box-opacity:hover+div {
        opacity: .6
    }
}

.play-btn-img {
    position: absolute;
    width: 80px;
    pointer-events: none;
    z-index: 3;
    bottom: -20px;
    right: -60px
}

.pregame-back {
    height: 100%;
    width: 100%
}

.pregame-name {
    font-size: 18px;
    margin: 30px 0 0;
    font-weight: 700
}

.pregame-img-container {
    position: relative;
    width: 70%;
    max-width: 293px;
    z-index: 3;
    margin-top: 68px
}

.pregame-main .pregame-info-container {
    z-index: 3;
    position: absolute;
    top: 8%;
    pointer-events: none;
    width: calc(90% - 12px)
}

.pregame-img-container img {
    border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -ms-border-radius: 25px;
    -o-border-radius: 25px;
    width: 100%
}

.pregame-text {
    padding: 0 20px;
    font-size: 14px;
    max-height: 32px;
    overflow: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.pregame-text::-webkit-scrollbar {
    display: none
}

.pregame-name {
    font-size: 18px;
    margin: 15px 0 -15px;
    font-weight: 700
}

.pregame-img-container {
    position: relative;
    width: 50%;
    max-width: 200px;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center
}

.GameNameText {
    display: flex;
    align-items: center;
    justify-content: center
}

.GameNameText-span {
    vertical-align: middle;
    color: #fff;
    font-size: 16px;
    font-weight: bolder;
    line-height: 30px;
    width: 100%;
    max-width: 100%;
    height: 30px;
    margin-top: -10px;
    overflow: hidden;
    display: inline-block;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical
}

.bottom-info {
    background-color: #29cedd;
    color: #000;
    text-align: left;
    padding: 30px 20px;
    border-radius: 10px;
    margin: 10px 0;
    box-sizing: border-box
}

@media only screen and (max-width:700px) {
    .pregame-main {}
}

@media only screen and (max-width:500px) {
    .pregame-name {
        font-size: 14px;
        margin: 10px 0 -3px
    }
}

.play-btn {
    position: absolute;
    bottom: -33px;
    right: -65px;
    z-index: 1000
}

.play-triangle {
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ef574f;
    border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    -ms-border-radius: 40px;
    -o-border-radius: 40px;
    box-shadow: inset 0 -2px 0 0 #db2e27
}

.play-triangle .triangle-svg {
    margin-left: 3px
}

.played-info {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px 0;
    font-size: 14px
}

.info-item {
    display: flex;
    justify-content: center;
    align-items: center
}

.played-icon {
    margin: 0 10px
}

.played-icon2 {
    margin-left: 30px
}

@media only screen and (max-width:500px) {
    .played-info {
        display: block !important
    }

    .info-item {
        justify-content: left !important
    }

    .played-icon2 {
        margin-left: 8px !important
    }

    .info-item2 {
        margin-top: 5px !important
    }
}

.hover-opacity {
    cursor: pointer
}

@media (hover:hover) {
    .hover-opacity:hover {
        opacity: .6
    }
}

@keyframes loading {
    0% {
        -webkit-transform: rotate(0deg)
    }

    25% {
        -webkit-transform: rotate(90deg)
    }

    50% {
        -webkit-transform: rotate(180deg)
    }

    75% {
        -webkit-transform: rotate(270deg)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

#mobile-play-loading {
    animation: loading 2s linear infinite
}

.played-info {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px 0;
    font-size: 14px
}

.played-icon {
    margin: 0 10px
}

.played-icon2 {
    margin-left: 30px
}

.pregame-ad {
    height: max-content;
    width: 100%;
    margin: 0 auto;
    min-width: 300px;
    min-height: 90px;
    text-align: center
}

.loading-cover {
    width: 100%;
    height: 100%;
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #29cedd
}

.loading-cover img,
.loading-cover svg {
    width: 300px;
    max-width: 90vh
}

@media only screen and (max-height:500px) {
    .pregame-main {}

    .pregame-bg {
        min-height: 260px;
        padding: 2%
    }

    .pregame-img-container {
        max-width: 240px;
        margin-top: 55px
    }

    .pregame-img-container img {
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px
    }

    .GameNameText-span {
        font-size: 14px;
        padding: 0 5px
    }
}

@media only screen and (max-width:500px) {
    .pregame-main {}

    .pregame-bg {
        min-height: 260px;
        padding: 2%
    }

    .pregame-img-container {
        max-width: 240px;
        margin-top: 55px
    }

    .pregame-img-container img {
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px
    }

    .GameNameText-span {
        font-size: 14px;
        padding: 0 5px
    }
}

.play-game-main {
    height: 100%;
    flex: 1;
    overflow: hidden
}

.play-game-iframe {
    height: 100%;
    display: flex;
    box-sizing: border-box;
    position: relative
}

.drag-btn {
    display: none;
    position: absolute;
    width: 40px;
    height: 40px;
    top: 10px;
    left: 10px;
    z-index: 1;
    cursor: pointer;
    border: 2px solid var(--highlight-color);
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 10px
}

.drag-btn .drag-click-btn {
    width: 30px;
    height: 30px;
    display: block;
    margin: auto;
    top: -15px;
    right: -15px
}

.drag-btn .drag-move-btn {
    position: absolute;
    width: 20px;
    height: 20px;
    top: -10px;
    right: -10px;
    cursor: move
}

.drag-move-btn path {
    stroke: var(--move-btn-path-color)
}

@media screen and (min-width:800px) {
    .drag-btn {
        width: 50px;
        height: 50px
    }

    .drag-btn .drag-click-btn {
        width: 40px;
        height: 40px
    }

    .drag-btn .drag-move-btn {
        width: 25px;
        height: 25px;
        top: -12px;
        right: -12px
    }
}

@media screen and (min-width:1200px) {
    .drag-btn {
        width: 60px;
        height: 60px
    }

    .drag-btn .drag-click-btn {
        width: 50px;
        height: 50px
    }
}

.play-game-iframe #play_game_frame {
    user-select: none;
    display: none;
    flex: 1;
    width: 100%;
    height: 100%;
    margin: auto
}

.bigsidebar {
    width: 300px;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    overflow: hidden;
    min-width: 160px
}

#bigrightbar {
    margin-left: 10px;
    text-align: center
}

.ad-container {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

#header-as .ad-container {
    display: flex;
    align-items: center;
    justify-content: center
}

#bigrightbar .ad-container {
    height: 100%;
    max-height: 600px
}

#info1,
#info2,
#info3 {
    flex: 1;
    z-index: 2;
    display: none;
    text-align: center;
    overflow-y: auto;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    color: #00747f !important;
    position: relative
}

.scroll-container {
    padding: 30px
}

#info1 .scroll-container {
    padding-top: 5px
}

#info1 .game-tag-title {
    margin: 10px
}

.game-desc {
    text-align: left;
    line-height: 1.6;
    font-size: 12px
}

.game-desc-name {
    font-size: 16px;
    margin-bottom: 20px
}

.game-desc h2 {
    font-size: 14px
}

.control-container {
    text-align: left;
    width: auto
}

.control-text {
    display: flex;
    justify-content: left;
    font-size: 14px
}

.control-text .inner-text {
    font-weight: 100;
    text-align: left
}

.control-text1 {
    margin-bottom: 20px
}

.control-title {
    margin-right: 20px;
    font-weight: 800px;
    text-align: left
}

@media only screen and (max-width:500px) {
    .control-container {
        width: auto
    }

    .control-text {
        display: block;
        text-align: center
    }

    .control-title {
        display: block;
        margin-bottom: 5px
    }
}

@media only screen and (max-height:700px) {
    .control-container {}

    .control-text {
        display: block
    }

    .control-title {
        display: block;
        margin-bottom: 5px
    }
}

.info-btn-container {
    position: sticky;
    cursor: pointer;
    display: flex;
    top: -2px;
    justify-content: space-between;
    padding: 7px;
    margin-top: -6px;
    z-index: 9
}

.only-close {
    float: right
}

.close-info svg path {
    fill: #00b8c9
}

.home-button a {
    display: inline-block
}

.home-button-g {
    fill: #00b8c9
}

.game-tag-title,
.more-game-title {
    text-align: left;
    margin-left: 10px;
    color: #00747f
}

.more-game {
    width: 240px;
    margin-left: 7px;
    margin-bottom: 5px
}

.back-to-game {
    font-weight: bolder;
    color: var(--highlight-color);
    margin-top: 10px
}

.feedback-text {
    cursor: auto !important
}

.back-to-game {
    font-weight: bolder;
    color: var(--highlight-color);
    margin-top: 10px;
    user-select: none
}

.back-to-game-button {
    width: max-content;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #877500;
    width: max-content;
    min-width: 120px;
    line-height: 40px;
    margin: 20px auto;
    padding: 5px 15px;
    border-radius: 30px;
    cursor: pointer;
    transition: none;
    background-color: #ffde00;
    border: none;
    font-size: 16px;
    font-weight: bolder;
    box-shadow: inset 0 1px 0 0 #fff6bd, inset 0 -2px 0 0 #f1d200
}

.game-show-tag {
    display: grid
}

@media screen and (max-width:360px) {
    .game-show-tag .game-container {
        grid-template-columns: 1fr 1fr
    }
}

.game-show-tag .game-container .thumb {
    margin: 5px;
    border-radius: 4px
}

@media screen and (max-width:800px) {
    .game-show-tag .game-container .thumb {
        margin: 5px !important
    }
}

.game-show-tag .game-container .thumb .img-container {
    aspect-ratio: 4/3;
    overflow: hidden
}

.game-show-tag .game-container .thumb .GameText {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    height: auto
}

.game-show-tag .game-container .thumb .GameText .GameName {
    -webkit-line-clamp: 2;
    line-clamp: 2
}

.wrapper {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;
    overflow: hidden
}

.hide-background .ramdom-background {
    display: none
}

.show-background .random-background {
    display: block
}

.scroll-container {
    position: relative
}

.info-container {
    background: #8eeff8
}

.info-container::-webkit-scrollbar {
    width: 0;
    display: none
}

.info-container .game-container .thumb {
    aspect-ratio: inherit;
    margin: 5px;
    box-sizing: border-box;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

.info-container .game-container .thumb .thumb a:hover .img-container img {
    transform: none;
    transition: none
}

@media (hover:hover) {
    .info-container .game-container .thumb .thumb a:hover .img-container img {
        transition: 0.5s;
        transform: scale(1.1)
    }
}

@media only screen and (max-width:400px) {
    .info-container .game-container .thumb {
        margin: 5px;
        padding: 2px
    }
}

.info-container .game-container .thumb .img-container {
    overflow: hidden;
    aspect-ratio: 4/3
}

.info-container .game-container .thumb .GameText {
    display: block;
    margin-top: 5px;
    text-align: center
}

.info-container .game-container .thumb .GameText .GameName {
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    padding: 0
}

.game-tag-container {
    margin: 10px;
    overflow: hidden
}

.game-tag-container a {
    text-decoration: none;
    color: var(--all-bg-color);
    font-weight: lighter;
    display: block;
    width: max-content;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px
}

.game-tag-container .tag-button {
    background: #69e2ed;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    padding: 5px 10px;
    color: #00636c
}

@media (hover:hover) {
    .game-tag-container .tag-button:hover {
        background: #00b8c9;
        color: #fff
    }
}

.like-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-top: 20px
}

.like-reply {
    display: none;
    position: absolute;
    top: -20px;
    font-weight: bolder;
    color: #00b8c9;
    cursor: pointer;
    width: max-content
}

.like-option {
    display: flex;
    flex-direction: column-reverse;
    margin: 10px;
    cursor: pointer
}

.like-option svg {
    margin: 10px;
    fill: #00b8c9
}

@keyframes likeAndDislike {
    0% {}

    50% {
        transform: rotate(23deg) translateY(-5px)
    }
}

.like-animation {
    animation: likeAndDislike 0.7s linear
}

.like-radio {
    display: none
}

.like-div {
    width: 60px;
    height: 60px;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px
}

@media (hover:hover) {
    .like-div:hover {
        background: var(--like-hover-color)
    }

    .like-div:hover svg {
        margin: 10px;
        fill: #fff
    }
}

.like-selected {
    background: var(--like-hover-color) !important
}

.like-selected svg {
    fill: #fff
}

.feedback-container {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center
}

.form-container {
    width: 80%;
    max-width: 500px;
    text-align: left;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    font-family: inherit;
    border-top: 1px solid #8eeff8;
    padding-top: 30px;
    margin-top: 20px
}

.form-title {
    font-size: 18px;
    margin: 10px 0;
    font-weight: bolder
}

#feedback-subject {
    color: #00b8c9
}

.form-input {
    height: 40px;
    font-size: 18px;
    background: #69e2ed;
    border: none;
    color: #fff;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    padding: 5px;
    box-sizing: border-box;
    font-family: inherit
}

.form-input:focus {
    outline: none
}

.form-container ::-webkit-input-placeholder {
    color: #00b8c9;
    font-size: 18px;
    line-height: 18px
}

.form-container :-moz-placeholder {
    color: #00b8c9;
    font-size: 18px;
    line-height: 18px
}

.form-container ::-moz-placeholder {
    color: #00b8c9;
    font-size: 18px;
    line-height: 18px
}

.form-container :-ms-input-placeholder {
    color: #00b8c9;
    font-size: 18px;
    line-height: 18px
}

.form-container select {
    -webkit-appearance: none;
    width: 100%;
    padding-right: 30px
}

.select-container {
    position: relative;
    display: inline-block
}

.select-container:after {
    position: absolute;
    pointer-events: none;
    right: 10px;
    top: 50%;
    transform: translateY(-25%);
    width: 0;
    height: 0;
    content: '';
    border: 7px solid #fff0;
    border-top: 5px solid #00b8c9
}

.feedback-container textarea {
    height: 200px;
    resize: none;
    font-family: inherit
}

.required {
    color: var(--highlight-color) !important;
    margin: 0 3px
}

.play-game-foot {
    display: flex;
    height: 40px;
    width: 100%;
    left: 0;
    background: #00b8c9
}

@media screen and (min-width:728px) {
    .wrapper {
        height: calc(100% - 90px)
    }
}

@media screen and (min-height:800px) {
    .play-game-foot {
        height: 50px
    }
}

.footer-nav {
    display: flex;
    flex: 1;
    background: #00b8c9;
    box-sizing: border-box
}

.not-allow .footer-nav,
.not-allow {
    border: none !important
}

.footer-nav a {
    color: var(--all-text-color);
    font-weight: lighter;
    transition: none
}

.border-btn,
.border-btn2 {
    position: relative
}

.border-btn::before {
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    width: 1px;
    height: 70%;
    background: #00ccdf
}

.border-btn2::before {
    content: '';
    position: absolute;
    left: 7px;
    top: 0;
    width: 70%;
    height: 1px;
    background: #00ccdf
}

@media only screen and (max-width:400px) {
    .footer-nav a {
        font-size: 0
    }
}

@media only screen and (min-width:400px) {
    #bottom-more-container {
        flex: 2
    }
}

.button-text-more {
    display: none !important;
    margin-right: 5px
}

@media only screen and (min-width:600px) {
    .button-text-more {
        display: flex !important;
        color: var(--game-btn-more-color)
    }
}

.menu-btn-path {
    stroke: var(--game-menu-color)
}

.path-more {
    stroke: var(--game-btn-more-color)
}

.path-help {
    stroke: var(--game-btn-help-color)
}

.path-feedback {
    stroke: var(--game-btn-feedback-color)
}

.path-refresh {
    stroke: var(--game-btn-refresh-color)
}

.path-fullscreen {
    stroke: var(--game-btn-fullscreen-color)
}

.path-download {
    stroke: var(--game-btn-download-color)
}

.btn {
    color: #f2f2f2;
    text-decoration: none;
    font-size: .9rem;
    border: 1px solid #444
}

.side-nav-btn {
    width: 40px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: none
}

.footer-nav-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: none
}

.footer-nav-btn a {
    font-weight: lighter
}

.footer-nav-btn svg {
    margin-right: 5px;
    cursor: pointer
}

.full-screen .exit-full-screen-button {
    display: none
}

.exit-full-screen .full-screen-button {
    display: none
}

#fullscreen-btn1,
.footer-nav-btn span {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

#download-button-left,
#download-button-bottom {
    display: none
}

.flex-div {
    justify-content: space-evenly
}

#bottom-download-container {
    display: none
}

.not-allow {
    cursor: not-allowed
}

.not-allow .side-nav-btn,
.not-allow .footer-nav-btn {
    pointer-events: none
}

.menu-btn-svg {
    fill: var(--game-menu-color)
}

.btn-more {
    fill: var(--game-btn-more-color)
}

.btn-help {
    fill: var(--game-btn-help-color)
}

.btn-refresh {
    fill: var(--game-btn-refresh-color)
}

.btn-fullscreen {
    fill: var(--game-btn-fullscreen-color)
}

.not-allow .menu-btn-svg {
    fill: #00ccdf !important
}

.not-allow .menu-btn-path {
    stroke: #00ccdf !important
}

.not-allow .button-text-more {
    color: #00ccdf !important
}

.button-text {
    color: var(--game-btn-more-color);
    width: auto !important
}

.not-allow .button-text {
    color: #00ccdf !important
}

#left-more-container,
#bottom-more-container {
    position: relative
}

@keyframes zoomInOut {

    0%,
    100% {
        transform: scale(1)
    }

    50% {
        transform: scale(1.5)
    }
}

.more-btn {
    fill: var(--game-btn-more-color);
    animation: zoomInOut 1s infinite
}

@keyframes textInLeft {
    0% {
        transform: scale(.1);
        right: -50px
    }

    25% {
        transform: scale(.25);
        right: -25px
    }

    50% {
        transform: scale(.5);
        right: 0
    }

    75% {
        transform: scale(.75);
        right: 20px
    }

    100% {
        transform: scale(1);
        right: 43px
    }
}

@keyframes showLeft {
    0% {
        right: 43px
    }

    25% {
        right: 47px
    }

    50% {
        right: 55px
    }

    75% {
        right: 47px
    }

    100% {
        right: 43px
    }
}

@keyframes showBottom {
    0% {
        bottom: 44px
    }

    25% {
        bottom: 50px
    }

    50% {
        bottom: 55px
    }

    75% {
        bottom: 50px
    }

    100% {
        bottom: 44px
    }
}

@keyframes textInBottom {
    0% {
        bottom: -70px
    }

    25% {
        bottom: -45px
    }

    50% {
        bottom: -20px
    }

    75% {
        bottom: 10px
    }

    100% {
        bottom: 44px
    }
}

.more-btn-text-left {
    position: absolute;
    right: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    animation-name: textInLeft, showLeft;
    animation-duration: 0.3s, 0.7s;
    animation-delay: 0s, 0.3s;
    animation-iteration-count: 1, infinite;
    animation-timing-function: linear, linear
}

.more-btn-text-left .more-btn-inner-text {
    background: #fff;
    color: var(--highlight-color);
    border-radius: 4px;
    padding: 10px;
    margin-right: 10px;
    width: max-content
}

.more-btn-text-bottom {
    position: absolute;
    bottom: 44px;
    left: 5px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    animation-name: textInBottom, showBottom;
    animation-duration: 0.3s, 1s;
    animation-delay: 0s, 0.3s;
    animation-iteration-count: 1, infinite;
    animation-timing-function: linear, linear
}

.more-btn-text-bottom .more-btn-inner-text {
    background: #fff;
    color: var(--highlight-color);
    border-radius: 4px;
    padding: 10px;
    margin-left: 5px;
    width: 150px;
    font-size: 0.9rem !important
}

@media screen and (min-width:400px) {
    .more-btn-text-bottom {
        left: auto;
        transform: translateX(25%)
    }
}

@media screen and (min-width:600px) {
    .more-btn-text-bottom {
        left: auto;
        transform: translateX(15%)
    }
}

.more-highlight {
    color: var(--highlight-bg-color) !important
}

.hand-left {
    transform: rotate(90deg)
}

.hand-bottom {
    transform: rotate(180deg)
}

@media only screen and (min-width:500px) {
    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr
    }
}

@media only screen and (min-width:720px) {
    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr
    }

    .tag-game {
        grid-template-columns: 1fr 1fr !important
    }

    .gt {
        min-height: 135px
    }

    #gla {
        order: 2
    }
}

@media only screen and (min-width:1172px) {
    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr
    }

    .tag-game {
        grid-template-columns: 1fr 1fr 1fr !important
    }

    #gla {
        order: 3
    }
}

@media only screen and (min-width:1424px) {
    .tag-game {
        grid-template-columns: 1fr 1fr 1fr 1fr !important
    }

    #gla {
        order: 4
    }
}

@media only screen and (min-width:1800px) {
    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr
    }
}

@media only screen and (min-width:2400px) {
    .game-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr
    }
}

.show-text-card,
.hide-text-card {
    line-height: 24px
}

.show-text-card {
    content-visibility: auto;
    contain: layout paint;
    contain-intrinsic-size: 400px;
    overflow-anchor: none;
    height: auto;
    position: relative;
    font-size: 14px;
    overflow-anchor: auto
}

.show-text-card h1,
.hide-text-card h1 {
    font-size: 18px;
    padding: 0 0 10px 0
}

.show-text-card h2,
.hide-text-card h2 {
    font-size: 16px;
    padding: 10px 0 10px 0
}

.show-text-card h3,
.hide-text-card h3 {
    font-size: 15px;
    padding: 0 0 10px 0
}

.show-text-card ol,
.hide-text-card ol {
    margin-top: 0
}

.show-text-card a {
    text-decoration: none;
    font-weight: 700
}

.show-text-card .show-text {
    height: 100%;
    overflow: hidden auto;
    padding: 25px 30px 0
}

.show-text-card .show-text ul {
    margin-left: 30px;
    list-style: disc
}

.show-text-card .show-button {
    height: 25px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 30px
}

.button-span {
    display: flex
}

.button-span svg {
    fill: #00747f;
    width: 16px;
    height: 12px;
    margin: 7px 0 0 5px
}

#bottom-button-span {
    width: fit-content
}

.show-text-card .show-button .button-span {
    cursor: pointer;
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #00747f;
    font-weight: 700
}

.hide-text-card {
    content-visibility: auto;
    contain: layout paint;
    contain-intrinsic-size: 400px;
    overflow: hidden;
    overflow-anchor: none;
    max-height: 200px;
    position: relative;
    font-size: 14px;
    overflow-anchor: auto;
    overflow: hidden
}

.hide-text-card a {
    text-decoration: none;
    font-weight: 700
}

.hide-text-card .show-text {
    height: 100%;
    overflow: hidden auto;
    padding: 25px 30px 0
}

.hide-text-card .show-button {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 4px;
    background: #29cedd;
    height: 25px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 30px
}

.hide-text-card .show-button .button-span {
    cursor: pointer;
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #00747f;
    font-weight: 700
}

@keyframes djqRmU-8e7a8d5a {
    0% {
        opacity: 0
    }

    to {
        opacity: .8
    }
}

@keyframes etkMLf-8e7a8d5a {

    0%,
    80%,
    to {
        transform: scale(0)
    }

    40% {
        transform: scale(1)
    }
}

.dgmlwU[data-v-8e7a8d5a] {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    animation: djqRmU-8e7a8d5a .2s cubic-bezier(.25, .1, .25, 1) both;
    z-index: 100001
}

.AFSJx[data-v-8e7a8d5a] {
    display: flex;
    align-items: center;
    justify-content: center
}

.AFSJx div[data-v-8e7a8d5a] {
    width: 18px;
    height: 18px;
    margin: 0 2px;
    border-radius: 100%;
    background: #fff;
    animation: 1.4s ease-in-out 0s infinite normal both running etkMLf-8e7a8d5a;
}

.AFSJx div[data-v-8e7a8d5a]:nth-child(2) {
    animation-delay: -.16s
}

.header[data-v-8e7a8d5a] {
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 70px;
    opacity: 1;
    background: #fc0;
    box-shadow: 0 1px 2px #0003;
    padding: 0 80px;
    box-sizing: border-box
}

.pt {
    margin: 0;
    height: 30px;
    display: flex;
    justify-content: center;
}