.app-footer[data-v-0f6f757d] {
    background: #444a59;
    display: flex;
    justify-content: center;
    padding-top: 28px;
}

.app-footer .footer-title[data-v-0f6f757d] {
    color: #5d97f3;
    font-size: 13px;
}

.app-footer .footer-title.partner[data-v-0f6f757d] {
    padding-top: 10px;
}

.app-footer .w1200[data-v-0f6f757d] {
    width: 1200px;
}

.app-footer .logo-wrap[data-v-0f6f757d] {
    padding-bottom: 22px;
}

.app-footer .logo-wrap img[data-v-0f6f757d] {
    width: 136px;
}

.app-footer .content-wrap[data-v-0f6f757d] {
    display: flex;
}

.app-footer .content-wrap .content-item[data-v-0f6f757d] {
    width: 362px;
    padding-right: 38px;
    padding-left: 33px;
    border-right: 1px solid #63697c;
    color: #fff;
}

.app-footer .content-wrap .content-item[data-v-0f6f757d]:first-child {
    padding-left: 0;
}

.app-footer .content-wrap .content-item[data-v-0f6f757d]:last-child {
    padding-right: 0;
    border-right: none;
}

.app-footer .content-wrap .content-item p[data-v-0f6f757d] {
    padding-bottom: 20px;
    font-size: 12px;
    line-height: 19px;
}

.app-footer .content-wrap .content-item .mid-item[data-v-0f6f757d] {
    display: flex;
}

.app-footer .content-wrap .content-item .game-wrap[data-v-0f6f757d] {
    display: flex;
    flex-direction: column;
}

.app-footer .content-wrap .content-item .game-wrap .footer-title[data-v-0f6f757d] {
    margin-bottom: 23px;
}

.app-footer .content-wrap .content-item .game-wrap[data-v-0f6f757d]:first-child {
    margin-right: 60px;
}

.app-footer .content-wrap .content-item .game-item[data-v-0f6f757d] {
    font-size: 12px;
    margin-bottom: 23px;
    height: 13px;
}

.app-footer .content-wrap .content-item .licence[data-v-0f6f757d] {
    margin: 17px 0 46px;
}

.app-footer .content-wrap .content-item .bank[data-v-0f6f757d] {
    margin-top: 22px;
}

.app-footer .mid-content[data-v-0f6f757d] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: 20px;
}

.app-footer .qr-wrapper[data-v-0f6f757d] {
    display: flex;
    align-items: center;
}

.app-footer .qr-wrapper .qr-bg[data-v-0f6f757d] {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 105px;
    height: 105px;
    margin-right: 27px;
}

.app-footer .qr-wrapper .qr-title[data-v-0f6f757d] {
    font-size: 12px;
    color: #fff;
}

.app-footer .qr-wrapper .icon-wrap[data-v-0f6f757d] {
    display: flex;
    padding-top: 13px;
}

.app-footer .qr-wrapper .choose-icon[data-v-0f6f757d] {
    width: 48px;
    height: 48px;
    margin-right: 14px;
    cursor: pointer;
}

.app-footer .qr-wrapper .choose-icon.ios[data-v-0f6f757d] {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAolBMVEUAAACenp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp6enp7////CwsKkpKSzs7Ourq719fXo6OigoKD39/ff39/U1NTMzMypqamhoaH6+vru7u7Pz8/IyMi8vLzi4uLb29u4uLjj4+PV1dUW31NlAAAAHXRSTlMA8/nNjxr22nEnEwaUdVgW7tC3aWZQTri2W3t6BPOUuUcAAAGXSURBVEjHpZZnc8IwDIbt7JLBhi45i5BVKKP9/3+tl3D0kOzD5Hi+5e51LNmvZDGJcWTN3IlhTNyZFY2ZhpFnAsL0RnfktsVBwglspuYz5KCEh75K/4KCwUxfZP2Swx34kuoXBtzFWGD9HLTMb/UrA7QYq5t8OTwA/8/cnyoF7SEjZ3U93VCpP+QiBkzIemxlQLEQIqNBXe48UOmTLyF+gBL0fnNAwbcQeSP7qnOiByoqcWxAxmOMUQul+1N1LpI2q8tyT7MwGRuT2EvRkZc70XNqAWGzCH0XG0GoAPHGLPRdU/0mAYTFZmiDLdHnRA+vzEUJC0INBJdxfL2EVHIgw9clL6CgBfIOsVQVOKSzIByBMMFJJ0K3hYuPFTaCsm/JsVoka4kDubiIlgEhL7A1qPlqTRI2tXexI14i9pYLKENBbRtaQHKJptvux9XvrtOnconKTSCJ46bfK46pVwPUZvRwGzUyPeG1VZqP6U1/aDMe2u6HPijPPVn6R3H4syvjfzhqufPuDxwdnh1O5PFnfRl/1qrx5w+VRszs5rcq8wAAAABJRU5ErkJggg==);
}

.app-footer .qr-wrapper .choose-icon.ios[data-v-0f6f757d]:hover {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAilBMVEUAAAC0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLT////4+PjR0dG4uLi1tbXu7u7Y2NjExMTAwMDe3t77+/vm5ubU1NTOzs69vb3p6enKysq6urry8vLj4+PGxsalGXzXAAAAGHRSTlMA8/kZFI/22s/Mt3FnTycFlHVY7e56W1fMI1UbAAABkklEQVRIx6WW2XKDMAxFbRNDgBCWJI3MDiF7+v+/15JpO5Xs4jI5b8xcYUu+ks00FnsZeBshNl4g9wtmYRH6gPDDqRhHctBwE4eZiVMORngam/TrJfzJcq3rIw4T8IjqVwImESuiBysoIhJgRUS/8uXwD/hP5rG5PtW1I7X6rm5q1J9ydQJM+nW+xg0VSqmObsphI4lJfzsodQFK8vSbCwaOSuVn3VejE0Mw0avLGXTCzwAfMG3z6K9VWXbNMDQ0C5+xBSDKQY3kw109eVSAcFiGa18rQg+INybRd0P19Q0QkgVogZzo8xIwAfNQwopwBILHOD5eQqs5kOHj0gMoDCZXOGldgbf0TvS6nTY46VLZlvBwWaFWlKYkZZUka40rObgMW+lA9XlFrOHAtDcKYj5q7+pOvETsrTdQhzZFuy40tGg7RtR9X4/6Vm9RfQjciuL8XKsoqFcTNGbscAcNMjspGpV2lvHcYTx33M+9UF67suyX4vxrVyfeuWa5u4tfejrYHycWnEwG3laIrRfITP/5BzmLqq6wmkYcAAAAAElFTkSuQmCC);
}

.app-footer .qr-wrapper .choose-icon.android[data-v-0f6f757d] {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAq1BMVEUAAACatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkiatkj////G1pj5+/XN26T8/frg6cbY47ict0ufulD3+fDx9eTu8t/q8Njj6825zYHK2Z6rw2epwmTb5b3Q3arD05LB0o69z4e1yXmxx3KlvlukvVnc5r8otBDhAAAAHHRSTlMA8/mPGvbaz8y3cU8nE5RYFgR1aWbs7nZbBnt6Jrfa2wAAAaFJREFUSMel1tdSwzAQBVBZtlOcHgj1bsAlCalAKv//ZSDAjK9SPBrOWzK7M9q1tJI60u349cpA60Gl7ne6qkQrqoHUotaF8MD3cCRsB2fCe/083OL1e6fim1WcVW0exzc8XOA17PhrjYv0NcdfodQVrUejlG4U6uX1b+f4Md9SHX+V9+z+pNlyM9wss9TqVd7dPixvYzHGb2C3v9/XaugokVyScXMDZbTBEplMxZhO5AOk/b3fQpC5yCwVI52JzHlfmZ0Ygc2kaAYSfSXUwGJKeLJ2u1JdFGS7ffbMsN8VKw9UBwWvEq+ELWN5LUTcKR8FTyJDYUNelq/qbgl1VXFLqCjPLcFTcEuAa4J2XdKAix6LvAsxv8dUNLV1IZODsMNEFtRWn88CIMz8Rx+uA8sLxb+A3akuLKs0MYGJSUzSFViQb29imgPTLthq5gC5JER0RMsTwlZhCPD3W2MtEsPSzseMZRhPRxhN4wWYF9AgK3dLo7JctUfDuJTXdB33rheK65Xlfim6X7u2+8cQJ4UP985Ph/8/Tuznz43WN6efP5+GK8eyYoQXOQAAAABJRU5ErkJggg==);
}

.app-footer .qr-wrapper .choose-icon.android[data-v-0f6f757d]:hover {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAn1BMVEUAAACxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1mxz1n////T5KLY56z6/PX8/fiz0V3x9uHn8Mzh7b/S4575+/H0+OfO4ZW+13O51Grp8tHk7sTK3o3H3Yfu9Nrb6bLD2n++13a20mPq8tO+6dTgAAAAG3RSTlMA848a/Pbaz8y3d1gnEwaUFvnucU5pZnBQUQTSUYB8AAABnElEQVRIx6XWaXOCMBAG4AREERSv3u9qQfC+tf//t7Vxaoc3HkymzydldmfYJdlEXenGXrPe7/X69aYXd1WF9iAECQftB+G+p3El6Ph3wj8ijZt0lNyKbzVwV6N1Hf+k8YB+s+Nfanio9sLxz6j0TO9TQ6XaU6lefv/t5vfHZkt1/FWe2P0psuN8Mj9mhdWrS3cjWPZTMaZ7sEid+VZDs1wu8oyb6yujA5bLbCfGbiZrkM55vQUgG5FVIUaxEtnyujIr8RXsS8pWIK8/CSFYSgkpSKhUlx4cltmIYXlAia9ilKwlXQhbpFR5rDyUfIpMON78/yxFeKppJQyFDTmhqepuCXWl3RK0glsCXBN6rq/U56KnN9s6paKprSOZLYUtZzKitnq8FwBh5hl9uBiWMcWPwWLVhWVR5CYwN4l5sQDzz8vbZpoD0y7YQt5A1QkD2qLVCUG7NAR4080xN9vN0rmMGcswHZ9wGssQTPs0yKpFNCqrNRIaxpV0y3Xcux4o7kcWe3t8KL67H7vXkijATUGUOF4d/nU5cb7+fAMt68DdDCi5/QAAAABJRU5ErkJggg==);
}

.app-footer .partner-wrap[data-v-0f6f757d] {
    display: flex;
    padding-top: 28px;
    padding-bottom: 34px;
}

.app-footer .partner-wrap .partner-img[data-v-0f6f757d] {
    margin-left: 37px;
}

.app-footer[data-v-0f6f757d] .br_hmenu_main {
    display: flex;
    flex-direction: column;
}

.app-footer[data-v-0f6f757d] .br_hmenu_main li.br_hmenu_nav {
    position: relative;
    font-size: 12px;
    height: 13px;
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-bottom: 23px;
}

.app-footer[data-v-0f6f757d] .br_hmenu_main li.br_hmenu_nav:hover {
    color: #5d9fff;
}

/* @charset "UTF-8"; */

@-webkit-keyframes scrollLeft {
    0% {
        transform: translate(0);
    }

    100% {
        transform: translate(-100%);
    }
}

@keyframes scrollLeft {
    0% {
        transform: translate(0);
    }

    100% {
        transform: translate(-100%);
    }
}

@-webkit-keyframes live-nav-items_li {

    0%,
    50% {
        filter: grayscale(0.5) contrast(90%) drop-shadow(0 0 0 rgba(0, 0, 0, 0)) drop-shadow(0 0 0 rgba(0, 0, 0, 0));
    }

    0% {
        transform: rotateY(0deg);
    }

    50% {
        transform: rotateY(180deg);
    }

    to {
        filter: grayscale(0) contrast(100%);
        transform: rotateY(1turn);
    }
}

@keyframes live-nav-items_li {

    0%,
    50% {
        filter: grayscale(0.5) contrast(90%) drop-shadow(0 0 0 rgba(0, 0, 0, 0)) drop-shadow(0 0 0 rgba(0, 0, 0, 0));
    }

    0% {
        transform: rotateY(0deg);
    }

    50% {
        transform: rotateY(180deg);
    }

    to {
        filter: grayscale(0) contrast(100%);
        transform: rotateY(1turn);
    }
}

@-webkit-keyframes gp-logo-hover {
    0% {
        filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25)) drop-shadow(0 4px 6px rgba(0, 0, 0, 0.25));
        transform: scale(1);
    }

    100% {
        filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.45)) drop-shadow(0 6px 9px rgba(0, 0, 0, 0.45));
        transform: scale(1.05);
    }
}

@keyframes gp-logo-hover {
    0% {
        filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25)) drop-shadow(0 4px 6px rgba(0, 0, 0, 0.25));
        transform: scale(1);
    }

    100% {
        filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.45)) drop-shadow(0 6px 9px rgba(0, 0, 0, 0.45));
        transform: scale(1.05);
    }
}

.swiper-button-next {
    right: 135px;
    left: auto;
    color: #898989;
    padding: 30px 15px;
    background-color: rgba(207, 199, 199, 0.7);
}

.swiper-button-next:hover {
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
}

.swiper-button-prev {
    right: auto;
    left: 135px;
    color: #898989;
    padding: 30px 15px;
    background-color: rgba(207, 199, 199, 0.7);
}

.swiper-button-prev:hover {
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
}

.swiper-button-prev:after,
.swiper-button-next:after {
    font-size: 34px;
}

.swiper-pagination-bullet {
    width: 18px !important;
    height: 3px !important;
    border-radius: unset;
}

:root {
    --swiper-theme-color: #45494e;
}

* {
    outline: none;
    font-family: system-ui;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    text-decoration: none;
}

.container-web {
    width: 85%;
    margin: 0px auto;
}

img {
    width: 100%;
    vertical-align: middle;
}

a {
    color: #fff;
    font-weight: bold;
}

ul {
    list-style: none;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane .item img {
    -o-object-position: unset !important;
    object-position: unset !important;
    position: relative;
    z-index: 5;
    top: -7px;
}

.game-logo {
    position: absolute !important;
    max-width: 80px !important;
    -o-object-position: center;
    object-position: center;
    left: 0;
    bottom: 25px;
    z-index: 1;
    opacity: 0.6;
}

.game-title {
    position: absolute;
    bottom: 3px;
    /* background-image: linear-gradient(to bottom, #e25d03, rgba(247, 147, 57, 0.3294117647)); */
    z-index: 6;
    text-align: center;
    width: 100%;
    line-height: 19px;
    text-transform: uppercase;
    font-size: 17px;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane a.item img {
    transform: scale(1.2);
}

#body-web-register .main-wrap .register-block:after {
    background-size: contain !important;
}

.popup_web .hide-annou-content {
    display: none;
}

.popup_web .announcement-list {
    position: fixed;
    z-index: 200;
    width: 100%;
    height: 100%;
    top: 0;
}

.popup_web .announcement-list .bg-popup {
    position: absolute;
    background: #000;
    width: 100%;
    height: 100%;
    opacity: 0.5;
}

.popup_web .announcement-list .annoucement-container {
    position: relative;
    background: #fff;
    width: 600px;
    height: 420px;
    margin: auto;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 5px;
    overflow: hidden;
}

.popup_web .announcement-list .annou-header {
    display: flex;
    min-height: 50px;
    background-color: #000682;
    padding: 0px 20px;
    color: #fff;
    align-items: center;
    justify-content: space-between;
}

.popup_web .announcement-list .annou-header .title-center {
    font-size: 16px;
}

.popup_web .announcement-list .annou-header .close-icon i {
    font-size: 26px;
    cursor: pointer;
}

.popup_web .announcement-list .annou-wrap {
    display: flex;
    height: calc(100% - 50px);
}

.popup_web .announcement-list .annou-wrap .annou-menu {
    background-color: #f5f5f5;
    box-sizing: border-box;
    float: left;
    height: 100%;
    overflow-y: auto;
    position: relative;
    width: 30%;
}

.popup_web .announcement-list .annou-wrap .annou-menu .menu-item {
    word-wrap: break-word;
    border-bottom: 1px solid #d9d9d9;
    border-right: 1px solid #d9d9d9;
    color: #777;
    cursor: pointer;
    font-size: 13px;
    list-style: none;
    padding: 15px 20px;
    position: relative;
    transition: 0.2s;
    line-height: 1.2;
}

.popup_web .announcement-list .annou-wrap .annou-content {
    width: 70%;
    padding: 20px 30px;
    height: 100%;
    overflow-y: auto;
    box-sizing: border-box;
    word-wrap: break-word;
}

.popup_web .announcement-list .annou-wrap .annou-content .announcement-time {
    color: #999;
    font-size: 12px;
    line-height: 1.6;
}

.popup_web .announcement-list .annou-wrap .annou-content .announcement-title {
    word-wrap: break-word;
    color: #000;
    font-size: 21px;
    font-weight: 700;
    margin-bottom: 15px;
    text-align: left;
}

.popup_web .announcement-list .annou-wrap .annou-content .announcement-desc {
    word-wrap: break-word;
    color: #777;
    line-height: 1.6;
    font-size: 16px;
}

.popup_web .current-annou {
    background: #fff;
    border-right: 1px solid #fff !important;
}

.popup_web .popup-center img {
    width: 100%;
}

.popup_web .popup-center {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 120;
    top: 0;
    left: 0;
}

.popup_web .popup-center .bg-popup {
    background-color: #000;
    opacity: 0.5;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 29;
}

.popup_web .popup-center .popup-center-content {
    z-index: 130;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    display: flex;
    width: 1050px;
}

.popup_web .popup-center .popup-center-content .left-box {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 95%;
}

.popup_web .popup-center .popup-center-content .left {
    flex: 1;
    background-color: #fff;
}

.popup_web .current-popup {
    background-color: #000682;
    color: #fff !important;
}

.popup_web .popup-center .popup-center-content .left ul li {
    text-align: center;
    border-bottom: 1px solid #e6e6e6;
    color: #777;
    cursor: pointer;
    min-height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup_web .popup-center .popup-center-content .left ul li h3 {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1.4;
}

.popup_web .popup-center .close-popup {
    position: absolute;
    top: -15px;
    z-index: 150;
    right: -15px;
}

.popup_web .popup-center .close-popup .icon-close {
    width: 30px;
    height: 30px;
    text-align: center;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
}

.popup_web .popup-center .close-popup .icon-close i {
    font-size: 25px;
    color: rgb(0, 0, 0);
    line-height: 1.2;
}

.popup_web .hide-popup-img {
    display: none !important;
}

#body-web-show-wallet {
    padding-bottom: 50px;
    background-color: #e7e7e7;
}

#body-web-show-wallet .main-wrap {
    max-width: 62%;
    margin: 0 auto;
}

#body-web-show-wallet .main-wrap .swiper-box {
    position: relative;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper {
    align-items: center;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide {
    display: flex;
    width: 400px !important;
    height: 186px !important;
    border-radius: 5px;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    padding: 30px;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip {
    font-size: 12px;
    font-weight: 300;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .top-box .level {
    padding: 3px;
    font-size: 24px;
    font-weight: 800;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.3);
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .top-box p {
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 400;
    overflow: hidden;
    padding: 3px;
    text-overflow: ellipsis;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.3);
    white-space: nowrap;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .bottom-box {
    font-size: 12px;
    font-weight: 300;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .bottom-box p {
    padding: 3px;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .badge-img {
    display: flex;
    align-items: center;
}

#body-web-show-wallet .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .badge-img img {
    max-width: 111px;
}

#body-web-show-wallet .main-wrap .vip-box {
    background-image: linear-gradient(0deg, #ededed 100%, #f2f2f2 0);
    padding: 0 25px;
    width: 1200px;
    padding-bottom: 35px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-privilege {
    background: #403e0b;
    margin-top: 20px;
    margin-left: 10px;
    width: 240px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-privilege>h5 {
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 600;
    letter-spacing: normal;
    line-height: normal;
    line-height: 2.5;
    text-align: center;
}

#body-web-show-wallet .main-wrap .vip-box .vip-privilege table {
    width: 100%;
    text-align: center;
}

#body-web-show-wallet .main-wrap .vip-box .vip-privilege table th {
    height: 52px;
    border: 1px solid transparent;
    background: #fff;
    white-space: nowrap;
    font-weight: 500;
}

#body-web-show-wallet .main-wrap .vip-box .vip-privilege table td {
    height: 40px;
    border: 1px solid transparent;
    background: #fff;
    white-space: nowrap;
    text-transform: uppercase;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .top-info {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 30px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .top-info .label {
    font-size: 24px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .top-info .main-wallet {
    display: flex;
    align-items: center;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .top-info .main-wallet .value {
    margin-right: 10px;
    color: #ff9b00;
    font-size: 24px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet {
    display: flex;
    flex-wrap: wrap;
    max-height: 600px;
    overflow-y: auto;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet::-webkit-scrollbar {
    width: 7px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet .data-box {
    align-items: center;
    background-color: #fff;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    height: 80px;
    margin: 0 1% 10px;
    width: 31%;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet .data-box div {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    font-size: 16px;
    justify-content: center;
    width: 100%;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet .data-box div.name {
    border-bottom: 1px solid #e9e9e9;
    color: #454545;
    height: 35px;
}

#body-web-show-wallet .main-wrap .vip-box .vip-rules .member-wallet .sub-wallet .data-box div.balance {
    color: #5f5f5f;
    height: 35px;
    font-size: 22px;
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
}

a:hover {
    text-decoration: none;
}

#body-web-history-promotion {
    background-color: #fff;
    width: 100%;
}

#body-web-history-promotion .wrap-info {
    width: 100%;
}

#body-web-history-promotion .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-history-promotion .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 220px;
}

#body-web-history-promotion .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-history-promotion .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-history-promotion .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-history-promotion .wrap-info .info-container .left .info-block .current-money {
    color: #ff9b00;
    font-size: 24px;
    font-weight: 500;
}

#body-web-history-promotion .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-history-promotion .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-history-promotion .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-history-promotion .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-history-promotion .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-history-promotion .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-history-promotion .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    width: 100%;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-history-promotion .wrap-info .info-container .right .main-content {
    width: 100%;
    padding: 24px;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    display: flex;
    align-items: center;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .title span {
    width: 80%;
    color: #6b6b6b;
    font-size: 12px;
    margin-left: 10px;
    font-weight: 500;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs {
    display: flex;
    justify-content: flex-start;
    margin: 5px 0px;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs li {
    border-radius: unset;
    border: none;
    flex: 1;
    font-weight: 500;
    height: 67px;
    padding: 0 !important;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs li a {
    font-size: 16px;
    width: 100%;
    border: none;
    height: 100%;
    padding: 0;
    text-align: center;
    color: #666;
    box-sizing: border-box;
    line-height: 2.1;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs li a:hover {
    border: none;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs li.active {
    border: none;
    border-radius: unset;
    background-color: unset;
    text-align: center;
    color: #403e0b;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs li.active a {
    border: none;
    border-bottom: none;
    border-radius: unset;
    color: #403e0b;
    background-color: unset;
    border-bottom: 3px solid #403e0b;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs li:hover {
    box-sizing: border-box;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .nav-tabs li:hover a {
    border: none;
    box-sizing: border-box;
    border-bottom: 3px solid #403e0b;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box {
    width: 100%;
    overflow: hidden;
    display: flex;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child {
    max-height: 400px;
    overflow: scroll;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child::-webkit-scrollbar-thumb {
    background-color: #c7c2c2;
    border-radius: 10px;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field {
    margin-bottom: 10px;
    width: 100%;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div {
    margin-right: 5px;
    background-color: #fff;
    max-height: inherit;
    max-width: inherit;
    min-height: inherit;
    min-width: inherit;
    border: 1px solid #e9e9e9;
    position: relative;
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    height: 54px;
    justify-content: space-around;
    padding: 0 15px;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block {
    box-sizing: border-box;
    position: relative;
    width: 100%;
    cursor: pointer;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block label {
    color: #6b6b6b;
    font-size: 10px;
    top: 8px;
    font-weight: 400;
    line-height: 1.29;
    pointer-events: none;
    position: absolute;
    transition: 0.2s;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block input[type="date"]::-webkit-calendar-picker-indicator {
    color: transparent;
    background: none;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block input,
#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block select {
    cursor: pointer;
    background-color: transparent;
    color: #454545;
    box-shadow: none;
    font-size: 14px;
    height: 100%;
    top: 0px;
    position: absolute;
    transition: 0.2s;
    width: 100%;
    border: none;
    padding: 0;
    padding-top: 22px;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .icon-celander i {
    color: rgb(60, 170, 225);
    transform: translateY(-50%);
    right: 10px;
    top: 50%;
    cursor: pointer;
    font-size: 22px;
    position: absolute;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box button {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    height: 54px;
    border: none;
    width: 54px;
    background-color: #007aff;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box button i {
    font-size: 18px;
    padding: 18px;
    color: #fff;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box:nth-child(2) {
    display: flex;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box table {
    width: 100%;
    overflow-x: scroll;
    border-radius: 5px;
    overflow: hidden;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr {
    min-height: 50px;
    color: #454545;
    height: 50px;
    text-align: center;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr:first-child {
    background-color: #e1e1e1;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr:not(:first-child) {
    background-color: #fff;
    height: 35px;
    border-bottom: 1px solid #e5e5e5;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr th {
    text-align: center;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    padding: 0 10px;
    text-overflow: ellipsis;
    white-space: normal;
}

#body-web-history-promotion .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr td {
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 5px 15px;
    font-size: 14px;
}

#body-web-bet-history {
    background-color: #fff;
    width: 100%;
}

#body-web-bet-history .wrap-info {
    width: 100%;
}

#body-web-bet-history .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-bet-history .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 276px;
}

#body-web-bet-history .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-bet-history .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-bet-history .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-bet-history .wrap-info .info-container .left .info-block .current-money {
    color: #cb0d0d;
    font-size: 24px;
    font-weight: 500;
}

#body-web-bet-history .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-bet-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-bet-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-bet-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-bet-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-bet-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-bet-history .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    width: 100%;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-bet-history .wrap-info .info-container .right .main-content {
    width: 100%;
    padding: 24px;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    display: flex;
    align-items: center;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .title span {
    width: 80%;
    color: #6b6b6b;
    font-size: 12px;
    margin-left: 10px;
    font-weight: 500;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs {
    display: flex;
    justify-content: flex-start;
    margin: 5px 0px;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs li {
    border-radius: unset;
    border: none;
    flex: 1;
    font-weight: 500;
    height: 40px;
    padding: 0 !important;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs li a {
    font-size: 16px;
    width: 100%;
    border: none;
    height: 100%;
    padding: 0;
    text-align: center;
    color: #666;
    box-sizing: border-box;
    line-height: 2.1;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs li a:hover {
    border: none;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs li.active {
    border: none;
    border-radius: unset;
    background-color: unset;
    text-align: center;
    color: #403e0b;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs li.active a {
    border: none;
    border-bottom: none;
    border-radius: unset;
    color: #403e0b;
    background-color: unset;
    border-bottom: 3px solid #403e0b;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs li:hover {
    box-sizing: border-box;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .nav-tabs li:hover a {
    border: none;
    box-sizing: border-box;
    border-bottom: 3px solid #403e0b;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box {
    width: 100%;
    overflow: hidden;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child {
    max-height: 400px;
    overflow: scroll;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child::-webkit-scrollbar-thumb {
    background-color: #c7c2c2;
    border-radius: 10px;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box:last-child::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field {
    margin-bottom: 10px;
    width: 100%;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div {
    margin-right: 5px;
    background-color: #fff;
    max-height: inherit;
    max-width: inherit;
    min-height: inherit;
    min-width: inherit;
    border: 1px solid #e9e9e9;
    position: relative;
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    height: 54px;
    justify-content: space-around;
    padding: 0 15px;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block {
    box-sizing: border-box;
    position: relative;
    width: 100%;
    cursor: pointer;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block label {
    color: #6b6b6b;
    font-size: 10px;
    top: 8px;
    font-weight: 400;
    line-height: 1.29;
    pointer-events: none;
    position: absolute;
    transition: 0.2s;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block input[type="date"]::-webkit-calendar-picker-indicator {
    color: transparent;
    background: none;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block input,
#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .input-block select {
    cursor: pointer;
    background-color: transparent;
    color: #454545;
    box-shadow: none;
    font-size: 14px;
    height: 100%;
    top: 0px;
    position: absolute;
    transition: 0.2s;
    width: 100%;
    border: none;
    padding: 0;
    padding-top: 22px;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box .input-field>div .icon-celander i {
    color: rgb(60, 170, 225);
    transform: translateY(-50%);
    right: 10px;
    top: 50%;
    cursor: pointer;
    font-size: 22px;
    position: absolute;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box button {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    height: 54px;
    border: none;
    width: 54px;
    background-color: #007aff;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box button i {
    font-size: 18px;
    padding: 18px;
    color: #fff;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box:nth-child(2) {
    display: flex;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box table {
    width: 100%;
    overflow-x: scroll;
    border-radius: 5px;
    overflow: hidden;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr {
    min-height: 50px;
    color: #454545;
    height: 50px;
    text-align: center;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr:first-child {
    background-color: #e1e1e1;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr:not(:first-child) {
    background-color: #fff;
    height: 35px;
    border-bottom: 1px solid #e5e5e5;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr th {
    text-align: center;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    padding: 0 10px;
    text-overflow: ellipsis;
    white-space: normal;
}

#body-web-bet-history .wrap-info .info-container .right .main-content .tab-content .wrap-box table tr td {
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 5px 15px;
    font-size: 14px;
}

#body-web-change-pass {
    background-color: #fff;
    width: 100%;
}

#body-web-change-pass .wrap-info {
    width: 100%;
}

#body-web-change-pass .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-change-pass .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 220px;
}

#body-web-change-pass .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-change-pass .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-change-pass .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-change-pass .wrap-info .info-container .left .info-block .current-money {
    color: #ff9b00;
    font-size: 24px;
    font-weight: 500;
}

#body-web-change-pass .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-change-pass .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-change-pass .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-change-pass .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-change-pass .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-change-pass .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-change-pass .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-change-pass .wrap-info .info-container .right .main-content {
    width: 50%;
    padding: 24px;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 15px;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs li {
    border-radius: unset;
    border: none;
    flex: 1;
    font-weight: 500;
    height: 40px;
    padding: 0 !important;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs li a {
    font-size: 16px;
    width: 100%;
    border: none;
    height: 100%;
    padding: 0;
    text-align: center;
    color: #666;
    box-sizing: border-box;
    line-height: 2.1;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs li a:hover {
    border: none;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs li.active {
    border: none;
    border-radius: unset;
    background-color: unset;
    text-align: center;
    color: #403e0b;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs li.active a {
    border: none;
    border-bottom: none;
    border-radius: unset;
    color: #403e0b;
    background-color: unset;
    border-bottom: 3px solid #403e0b;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs li:hover {
    box-sizing: border-box;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .nav-tabs li:hover a {
    border: none;
    box-sizing: border-box;
    border-bottom: 3px solid #403e0b;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field small {
    color: #6b6b6b;
    font-size: 90%;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content {
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    height: 54px;
    justify-content: space-around;
    align-items: center;
    padding: 0 15px;
    background-color: #fff;
    margin: 10px 0px;
    max-height: inherit;
    max-width: inherit;
    min-height: inherit;
    min-width: inherit;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .input-block {
    box-sizing: border-box;
    position: relative;
    width: 100%;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .input-block label {
    color: #6b6b6b;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.29;
    pointer-events: none;
    position: absolute;
    top: 6px;
    z-index: 15;
    transition: 0.2s;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .input-block label::before {
    bottom: 0;
    color: #e94951;
    content: "*";
    font-size: 10px;
    left: -8px;
    margin: auto;
    position: absolute;
    top: -2px;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .input-block input {
    font-size: 16px;
    border: none;
    box-sizing: border-box;
    height: 100%;
    transition: 0.2s;
    width: 100%;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .action-block {
    position: relative;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .action-block i {
    font-size: 16px;
    color: #007aff;
    cursor: pointer;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .action-block i.active::after {
    display: none;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .input-field .content .action-block i::after {
    content: "/";
    color: #007aff;
    position: absolute;
    font-size: 28px;
    font-weight: bold;
    top: -6px;
    left: 5px;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .box-btn {
    position: absolute;
    bottom: 24px;
    display: flex;
    width: 46%;
    justify-content: space-between;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .box-btn button {
    border-radius: 5px;
    width: 48%;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    height: 45px;
    padding: 0 40px;
    outline: none;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .box-btn button:first-child {
    background-color: #aaa;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .box-btn button:first-child:hover {
    background-color: #9d9d9d;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .box-btn button:last-child {
    background-color: #403e0b;
}

#body-web-change-pass .wrap-info .info-container .right .main-content .tab-content form .box-btn button:last-child:hover {
    background-color: #2997cf;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content {
    width: 50%;
    padding: 24px;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 10px;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .ads-block {
    height: 100%;
    max-height: 720px;
    overflow: auto;
    padding-top: 15px;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar {
    width: 7px;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .ads-block .promo-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    transition: all 0.4s ease-out;
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item {
    background-color: #fff;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 5px 10px;
    min-height: 200px;
    overflow: hidden;
    padding-bottom: 10px;
    width: calc(50% - 10px);
}

#body-web-change-pass .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item h3 {
    margin: 0;
    color: #454545;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    padding: 0 10px;
    word-break: break-all;
}

#body-web-transaction {
    background-color: #fff;
    width: 100%;
    /* Firefox */
}

#body-web-transaction .wrap-info {
    width: 100%;
}

#body-web-transaction .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-transaction .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 220px;
}

#body-web-transaction .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-transaction .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-transaction .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-transaction .wrap-info .info-container .left .info-block .current-money {
    color: #ff9b00;
    font-size: 24px;
    font-weight: 500;
}

#body-web-transaction .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-transaction .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-transaction .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-transaction .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-transaction .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-transaction .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-transaction .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    position: relative;
    width: calc(100% - 220px);
    padding: 24px;
}

#body-web-transaction .wrap-info .info-container .right.active {
    display: none;
}

#body-web-transaction .wrap-info .info-container .right .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 24px;
}

#body-web-transaction .wrap-info .info-container .right .top-content table {
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
}

#body-web-transaction .wrap-info .info-container .right .top-content table tr {
    min-height: 50px;
    color: #454545;
    height: 50px;
    text-align: center;
}

#body-web-transaction .wrap-info .info-container .right .top-content table tr:first-child {
    background-color: #e1e1e1;
}

#body-web-transaction .wrap-info .info-container .right .top-content table tr:last-child {
    background-color: #fff;
}

#body-web-transaction .wrap-info .info-container .right .top-content table tr th {
    text-align: center;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    padding: 0 10px;
    text-overflow: ellipsis;
    white-space: normal;
}

#body-web-transaction .wrap-info .info-container .right .top-content table tr td {
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
}

#body-web-transaction .wrap-info .info-container .right .top-content table tr td:last-child {
    color: #d22323;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content {
    display: flex;
    justify-content: space-between;
    margin-top: 32px;
    width: 100%;
    padding-bottom: 20px;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content {
    width: 49%;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: #fff;
    border-radius: 5px;
    padding: 10px;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes {
    display: flex;
    justify-content: space-between;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes>div {
    align-items: center;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    padding-top: 20px;
    position: relative;
    width: 47%;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes>div .tag {
    align-items: center;
    border: 1px solid #e9e9e9;
    border-radius: 100px;
    color: #929292;
    cursor: auto;
    display: flex;
    font-size: 12px;
    font-weight: 300;
    justify-content: center;
    max-width: 90%;
    padding: 5px;
    position: absolute;
    right: 5%;
    top: 10px;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes>div img {
    margin: 30px 0 10px;
    max-width: 75px;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes>div span {
    color: #929292;
    font-size: 16px;
    margin-bottom: 20px;
    text-align: center;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes>div .total {
    border-top: 1px solid #e9e9e9;
    display: flex;
    width: 100%;
    flex-direction: column;
    padding: 20px 0;
    align-items: center;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes>div .total .label {
    font-size: 14px;
    color: #929292;
    margin-bottom: 10px;
    font-weight: 500;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .boxes>div .total .value {
    font-size: 20px;
    font-weight: 500;
    color: #929292;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .left-content .content .deduction-comment {
    font-size: 14px;
    margin-bottom: 5px;
    text-align: center;
    width: 100%;
    color: #929292;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content {
    width: 49%;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content form {
    background-color: #fff;
    border-radius: 5px;
    padding: 10px;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content form dl {
    margin: 10px 0;
    height: 54px;
    width: 100%;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    position: relative;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content form dl label {
    font-weight: 500;
    color: #6b6b6b;
    padding-left: 15px;
    transition: 0.2s;
    position: absolute;
    font-size: 10px;
    top: 8px;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content form dl input,
#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content form dl select {
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 15px;
    height: 100%;
    padding: 25px 15px 5px;
    width: 100%;
    background: transparent;
    color: #454545;
}

#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content form dl input[type="button"],
#body-web-transaction .wrap-info .info-container .right .bottom-content .right-content form dl select[type="button"] {
    display: flex;
    padding: 0;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    background-color: #403e0b;
    height: 45px;
    border-radius: 5px;
}

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

#body-web-transaction input[type="number"] {
    -moz-appearance: textfield;
}

#body-web-timing {
    background-color: #fff;
    width: 100%;
    /* Firefox */
}

#body-web-timing .wrap-info {
    width: 100%;
}

#body-web-timing .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-timing .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 220px;
}

#body-web-timing .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-timing .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-timing .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-timing .wrap-info .info-container .left .info-block .current-money {
    color: #ff9b00;
    font-size: 24px;
    font-weight: 500;
}

#body-web-timing .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-timing .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-timing .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-timing .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-timing .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-timing .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-timing .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-timing .wrap-info .info-container .right.active {
    display: none;
}

#body-web-timing .wrap-info .info-container .right .main-content {
    width: 50%;
    padding: 24px;
}

#body-web-timing .wrap-info .info-container .right .main-content .title {
    color: #454545;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 24px;
}

#body-web-timing .wrap-info .info-container .right .main-content .title a {
    color: #454545;
}

#body-web-timing .wrap-info .info-container .right .main-content .msg-main {
    color: #929292;
}

#body-web-timing .wrap-info .info-container .right .main-content .msg-main p {
    margin: 0 0 10px;
}

#body-web-timing .wrap-info .info-container .right .main-content form {
    background-color: #fff;
    padding: 15px;
    border-radius: 10px;
}

#body-web-timing .wrap-info .info-container .right .main-content form .count-down .card {
    display: flex;
    align-items: center;
}

#body-web-timing .wrap-info .info-container .right .main-content form .count-down .card i {
    font-size: 26px;
    color: #ada9a9;
}

#body-web-timing .wrap-info .info-container .right .main-content form .count-down .card p {
    margin-left: 15px;
}

#body-web-timing .wrap-info .info-container .right .main-content form .count-down .card .box {
    border-right: 1px solid #e9e9e9;
    padding: 0px 20px;
    position: relative;
}

#body-web-timing .wrap-info .info-container .right .main-content form .count-down .card .box p {
    font-size: 12px;
    position: absolute;
    bottom: -7px;
    left: 15px;
    color: #9f9f9f;
}

#body-web-timing .wrap-info .info-container .right .main-content form .count-down .card .box span {
    color: #e94951;
    font-size: 32px;
    font-weight: 500;
}

#body-web-timing .wrap-info .info-container .right .main-content form .info>div {
    background-color: #fff;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    height: 54px;
    min-height: 54px;
    position: relative;
    transition: 0.8s;
    margin: 15px auto;
}

#body-web-timing .wrap-info .info-container .right .main-content form .info>div label {
    font-weight: 500;
    color: #6b6b6b;
    padding-left: 15px;
    transition: 0.2s;
    position: absolute;
    font-size: 10px;
    top: 8px;
}

#body-web-timing .wrap-info .info-container .right .main-content form .info>div input {
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 15px;
    height: 100%;
    padding: 25px 15px 5px;
    width: 100%;
    background: transparent;
    color: #454545;
}

#body-web-timing .wrap-info .info-container .right .main-content form .info .qr_code {
    border: none;
    height: auto;
    align-items: center;
    display: flex;
}

#body-web-timing .wrap-info .info-container .right .main-content form .info .qr_code label {
    position: unset;
    font-size: 16px;
}

#body-web-timing .wrap-info .info-container .right .main-content form dl {
    margin-top: 24px;
    width: 100%;
}

#body-web-timing .wrap-info .info-container .right .main-content form dl input {
    width: 100%;
    background-color: #aaa;
    height: 45px;
    border: none;
    border-radius: 5px;
    color: #fff;
}

#body-web-timing .wrap-info .info-container .right .sub-content {
    width: 50%;
    padding: 24px;
}

#body-web-timing .wrap-info .info-container .right .sub-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 10px;
}

#body-web-timing .wrap-info .info-container .right .sub-content .content {
    border-radius: 2px;
    padding: 5px;
}

#body-web-timing .wrap-info .info-container .right .sub-content .content .text {
    font-size: 14px;
    font-style: italic;
}

#body-web-timing .wrap-info .info-container .right .sub-content .content p:not(.text) {
    word-wrap: break-word;
    margin: 1.5em 0;
    font-size: 14px;
    text-transform: uppercase;
    line-height: 15px;
}

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

#body-web-timing input[type="number"] {
    -moz-appearance: textfield;
}

#body-web-payment {
    background-color: #fff;
    width: 100%;
    /* Firefox */
}

#body-web-payment .wrap-info {
    width: 100%;
}

#body-web-payment .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-payment .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 220px;
}

#body-web-payment .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-payment .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-payment .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-payment .wrap-info .info-container .left .info-block .current-money {
    color: #ff9b00;
    font-size: 24px;
    font-weight: 500;
}

#body-web-payment .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-payment .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-payment .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-payment .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-payment .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-payment .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-payment .wrap-info .info-container .right,
#body-web-payment .wrap-info .info-container .right-2 {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-payment .wrap-info .info-container .right.active,
#body-web-payment .wrap-info .info-container .right-2.active {
    display: none;
}

#body-web-payment .wrap-info .info-container .right .main-content,
#body-web-payment .wrap-info .info-container .right-2 .main-content {
    width: 50%;
    padding: 24px;
}

#body-web-payment .wrap-info .info-container .right .main-content .title,
#body-web-payment .wrap-info .info-container .right-2 .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    width: 100%;
    padding: 15px 0px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list .deposit-list-item,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list .deposit-list-item {
    cursor: pointer;
    background-color: #fff;
    display: flex;
    align-items: center;
    width: 49%;
    height: 70px;
    border-radius: 5px;
    padding: 10px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list .deposit-list-item input,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list .deposit-list-item input {
    width: 0px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list .deposit-list-item img,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list .deposit-list-item img {
    max-width: 40px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list .deposit-list-item .content,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list .deposit-list-item .content {
    margin-left: 10px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list .deposit-list-item .content h3,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list .deposit-list-item .content h3 {
    margin: 0;
    font-weight: 700;
    font-size: 16px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list .deposit-list-item .content small,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list .deposit-list-item .content small {
    font-size: 11px;
}

#body-web-payment .wrap-info .info-container .right .main-content .deposit-list .deposit-list-item:hover,
#body-web-payment .wrap-info .info-container .right-2 .main-content .deposit-list .deposit-list-item:hover {
    box-shadow: inset 0 0 0 1px #403e0b;
}

#body-web-payment .wrap-info .info-container .right .sub-content,
#body-web-payment .wrap-info .info-container .right-2 .sub-content {
    width: 50%;
    padding: 24px;
}

#body-web-payment .wrap-info .info-container .right .sub-content .title,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 10px;
}

#body-web-payment .wrap-info .info-container .right .sub-content .ads-block,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .ads-block {
    height: 100%;
    max-height: 720px;
    overflow: auto;
    padding-top: 15px;
}

#body-web-payment .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .ads-block::-webkit-scrollbar {
    width: 7px;
}

#body-web-payment .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-thumb,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .ads-block::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-payment .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-track,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .ads-block::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-payment .wrap-info .info-container .right .sub-content .ads-block .promo-container,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .ads-block .promo-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    transition: all 0.4s ease-out;
}

#body-web-payment .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .ads-block .promo-container .promo-item {
    background-color: #fff;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 5px 10px;
    min-height: 200px;
    overflow: hidden;
    padding-bottom: 10px;
    width: calc(50% - 10px);
}

#body-web-payment .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item h3,
#body-web-payment .wrap-info .info-container .right-2 .sub-content .ads-block .promo-container .promo-item h3 {
    margin: 0;
    color: #454545;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    padding: 0 10px;
    word-break: break-all;
}

#body-web-payment .wrap-info .info-container .right-2 img {
    max-width: 36px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    display: flex;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content .title i {
    font-size: 14px;
    line-height: 1.5;
    margin-right: 7px;
    cursor: pointer;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content .title span {
    line-height: 1;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form {
    margin-top: 4px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment {
    background-color: #fff;
    border-radius: 10px;
    padding: 10px;
    margin-top: 30px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment span.remind {
    color: #e94951;
    font-size: 12px;
    margin-top: 5px;
    word-break: break-all;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl.active {
    display: none;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd .box {
    display: flex;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd .box .content {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin-left: 8px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd .box .content span {
    color: #454545;
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    margin-bottom: 0px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd .box .content span:last-child {
    color: #6b6b6b;
    font-size: 10px;
    line-height: 14px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd .box:last-child {
    flex-direction: column;
    align-items: flex-end;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd .box:last-child span {
    color: #6b6b6b;
    font-size: 10px;
    line-height: 14px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd input {
    background: transparent;
    border: none;
    color: #454545;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl dd input[type="submit"] {
    height: 50px;
    min-height: 50px;
    background-color: #403e0b;
    border: 0;
    padding: 0 40px;
    cursor: pointer;
    font-size: 16px;
    color: #fff;
    border-radius: 5px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl:not(:first-child) dd {
    background-color: #fff;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    min-height: 54px;
    position: relative;
    transition: 0.8s;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl:not(:first-child) dd label {
    font-weight: 500;
    color: #6b6b6b;
    padding-left: 15px;
    transition: 0.2s;
    position: absolute;
    font-size: 10px;
    top: 8px;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl:not(:first-child) dd input,
#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl:not(:first-child) dd select {
    border: none;
    font-size: 14px;
    padding: 15px;
    height: 100%;
    width: 100%;
}

#body-web-payment .wrap-info .info-container .right-2 .main-content form .payment dl:not(:first-child) dd select {
    padding: 0;
    padding-left: 10px;
    padding-top: 25px;
}

#body-web-payment .wrap-info .info-container .right-2 .sub-content .content {
    border-radius: 2px;
    padding: 5px;
}

#body-web-payment .wrap-info .info-container .right-2 .sub-content .content .text {
    font-size: 14px;
    font-style: italic;
}

#body-web-payment .wrap-info .info-container .right-2 .sub-content .content p:not(.text) {
    word-wrap: break-word;
    margin: 1.5em 0;
    font-size: 14px;
    text-transform: uppercase;
    line-height: 15px;
}

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

#body-web-payment input[type="number"] {
    -moz-appearance: textfield;
}

#body-web-mess {
    background-color: #fff;
    width: 100%;
    /* Firefox */
}

#body-web-mess .wrap-info {
    width: 100%;
}

#body-web-mess .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-mess .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 220px;
}

#body-web-mess .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-mess .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-mess .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-mess .wrap-info .info-container .left .info-block .current-money {
    color: #ff9b00;
    font-size: 24px;
    font-weight: 500;
}

#body-web-mess .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
    padding-bottom: 30px;
}

#body-web-mess .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-mess .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-mess .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-mess .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-mess .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-mess .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-mess .wrap-info .info-container .right .main-content {
    width: 50%;
    padding: 24px;
}

#body-web-mess .wrap-info .info-container .right .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs {
    display: flex;
    justify-content: flex-start;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs li {
    border-radius: unset;
    border: none;
    flex: 1;
    font-weight: 500;
    height: 40px;
    padding: 0 !important;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs li a {
    width: 100%;
    border: none;
    height: 100%;
    padding: 0;
    font-size: 16px;
    text-align: center;
    color: #666;
    box-sizing: border-box;
    line-height: 2.1;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs li a:hover {
    border: none;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs li.active {
    border: none;
    border-radius: unset;
    background-color: unset;
    text-align: center;
    color: #403e0b;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs li.active a {
    border: none;
    border-bottom: none;
    border-radius: unset;
    color: #403e0b;
    background-color: unset;
    border-bottom: 3px solid #403e0b;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs li:hover {
    box-sizing: border-box;
}

#body-web-mess .wrap-info .info-container .right .main-content .nav-tabs li:hover a {
    border: none;
    box-sizing: border-box;
    border-bottom: 3px solid #403e0b;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box {
    padding: 15px 10px 0;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container {
    position: relative;
    height: 570px;
    width: 458px;
    overflow: auto;
    will-change: transform;
    direction: ltr;
    padding-right: 5px;
    padding-top: 25px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container::-webkit-scrollbar {
    width: 7px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item {
    cursor: pointer;
    background-color: #fff;
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    height: 110px;
    padding: 15px;
    margin-bottom: 10px;
    transition: 0.2s ease;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item:hover {
    box-shadow: inset 0 0 0 1px #403e0b;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item .mess-box .date {
    color: #6b6b6b;
    font-size: 12px;
    margin-bottom: 8px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item .mess-box .title {
    color: #454545;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 6px;
    text-transform: uppercase;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item .mess-box .content {
    color: #6b6b6b;
    font-size: 12px;
    max-height: 20px;
    overflow-y: auto;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item .mess-box .content::-webkit-scrollbar {
    width: 7px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item .mess-box .content::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item .mess-box .content::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-mess .wrap-info .info-container .right .main-content .tab-content .tab-box .mess-container .mess-item .icon i {
    color: #403e0b;
    font-size: 18px;
    padding: 7px;
}

#body-web-mess .wrap-info .info-container .right .sub-content {
    width: 50%;
    padding: 24px;
}

#body-web-mess .wrap-info .info-container .right .sub-content .mess-detail {
    display: none;
}

#body-web-mess .wrap-info .info-container .right .sub-content .mess-detail .date {
    color: #6b6b6b;
    font-size: 12px;
    margin-bottom: 10px;
}

#body-web-mess .wrap-info .info-container .right .sub-content .mess-detail .title {
    border-bottom: 1px solid #dcdcdc;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 24px;
    padding-bottom: 10px;
    word-break: break-word;
}

#body-web-mess .wrap-info .info-container .right .sub-content .mess-detail .content {
    font-size: 14px;
    line-height: 1.5;
    position: relative;
    word-break: break-word;
}

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

#body-web-mess input[type="number"] {
    -moz-appearance: textfield;
}

#body-web-question-history {
    background-color: #fff;
    width: 100%;
    /* Firefox */
}

#body-web-question-history .wrap-info {
    width: 100%;
}

#body-web-question-history .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-question-history .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 220px;
}

#body-web-question-history .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-question-history .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-question-history .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-question-history .wrap-info .info-container .left .info-block .current-money {
    color: #ff9b00;
    font-size: 24px;
    font-weight: 500;
}

#body-web-question-history .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
    padding-bottom: 30px;
}

#body-web-question-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-question-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-question-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-question-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-question-history .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-question-history .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-question-history .wrap-info .info-container .right .main-content {
    width: 50%;
    padding: 24px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs {
    display: flex;
    justify-content: flex-start;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs li {
    border-radius: unset;
    border: none;
    flex: 1;
    font-weight: 500;
    height: 40px;
    padding: 0 !important;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs li a {
    width: 100%;
    border: none;
    height: 100%;
    padding: 0;
    font-size: 16px;
    text-align: center;
    color: #666;
    box-sizing: border-box;
    line-height: 2.1;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs li a:hover {
    border: none;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs li.active {
    border: none;
    border-radius: unset;
    background-color: unset;
    text-align: center;
    color: #403e0b;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs li.active a {
    border: none;
    border-bottom: none;
    border-radius: unset;
    color: #403e0b;
    background-color: unset;
    border-bottom: 3px solid #403e0b;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs li:hover {
    box-sizing: border-box;
}

#body-web-question-history .wrap-info .info-container .right .main-content .nav-tabs li:hover a {
    border: none;
    box-sizing: border-box;
    border-bottom: 3px solid #403e0b;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box {
    padding: 15px 10px 0;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container {
    position: relative;
    height: 570px;
    width: 458px;
    overflow: auto;
    will-change: transform;
    direction: ltr;
    padding-right: 15px;
    padding-top: 25px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container::-webkit-scrollbar {
    width: 7px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item {
    background-color: #fff;
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    height: 110px;
    justify-content: space-between;
    padding: 15px;
    margin-bottom: 10px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box {
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 6px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box .condition {
    display: flex;
    font-size: 14px;
    justify-content: space-between;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box .condition span:first-child {
    color: #6b6b6b;
    flex: 1;
    padding: 0 3px 0 0;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box .condition span:last-child {
    color: #6b6b6b;
    font-size: 10px;
    display: flex;
    align-items: center;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box .condition span:last-child .progress-question {
    border: 1px solid #ffba00;
    border-radius: 20px;
    height: 10px;
    margin-left: 5px;
    overflow: hidden;
    width: 60px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box .condition span:last-child .progress-question>div {
    width: 60%;
    background-color: #ffba00;
    height: 10px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box .condition span:last-child .progress-question.completed {
    border: 1px solid #75943e;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .content-box .condition span:last-child .progress-question.completed>div {
    width: 100%;
    background-color: #75943e;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .prize {
    align-items: center;
    color: #403e0b;
    display: flex;
    font-size: 12px;
    justify-content: space-between;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .prize span {
    color: #403e0b;
    font-size: 12px;
}

#body-web-question-history .wrap-info .info-container .right .main-content .tab-content .tab-box .question-container .question-item .prize .reward button {
    border: none;
    background-color: #403e0b;
    border-radius: 10px;
    color: #fff;
    font-size: 11px;
    padding: 3px 12px;
}

#body-web-question-history .wrap-info .info-container .right .sub-content {
    width: 50%;
    padding: 24px;
}

#body-web-question-history .wrap-info .info-container .right .sub-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 10px;
}

#body-web-question-history .wrap-info .info-container .right .sub-content .ads-block {
    height: 100%;
    max-height: 720px;
    overflow: auto;
    padding-top: 15px;
}

#body-web-question-history .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar {
    width: 7px;
}

#body-web-question-history .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-question-history .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-question-history .wrap-info .info-container .right .sub-content .ads-block .promo-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    transition: all 0.4s ease-out;
}

#body-web-question-history .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item {
    background-color: #fff;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 5px 10px;
    min-height: 200px;
    overflow: hidden;
    padding-bottom: 10px;
    width: calc(50% - 10px);
}

#body-web-question-history .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item h3 {
    margin: 0;
    color: #454545;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    padding: 0 10px;
    word-break: break-all;
}

#body-web-question-history input::-webkit-outer-spin-button,
#body-web-question-history input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#body-web-question-history input[type="number"] {
    -moz-appearance: textfield;
}

#body-web-info-vip {
    background-color: #fff;
    width: 100%;
    /* Firefox */
}

#body-web-info-vip .wrap-info {
    width: 100%;
}

#body-web-info-vip .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-info-vip .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 276px;
}

#body-web-info-vip .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-info-vip .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-info-vip .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-info-vip .wrap-info .info-container .left .info-block .current-money {
    color: #cb0d0d;
    font-size: 24px;
    font-weight: 500;
}

#body-web-info-vip .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-info-vip .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-info-vip .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-info-vip .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-info-vip .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-info-vip .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-info-vip .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-info-vip .wrap-info .info-container .right .main-content {
    width: 50%;
    padding: 24px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content>.title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 20px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display {
    display: flex;
    justify-content: space-between;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-level {
    display: flex;
    justify-content: space-between;
    border-radius: 5px;
    color: rgb(16 16 16);
    height: 100%;
    padding: 10px;
    position: relative;
    width: 67%;
    /* background: linear-gradient(135deg,
            rgb(120, 120, 120),
            rgb(120, 120, 120) 50%,
            rgb(135, 135, 135) 0px,
            rgb(120, 120, 120)); */
    /* box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 3px 0px, rgb(100, 100, 100) 0px -10px 25px inset; */
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-level img {
    max-width: 110px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-level .info-display {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 15px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-level .info-display .top-box div {
    padding: 3px;
    font-size: 11px;
    line-height: 1;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-level .info-display .top-box .level {
    font-size: 24px;
    font-weight: 800;
    text-shadow: rgba(0, 0, 0, 0.3) 0px 2px 0px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-level .info-display .top-box p {
    font-size: 16px;
    font-weight: 400;
    overflow: hidden;
    text-transform: uppercase;
    padding: 3px;
    padding-top: 0px;
    text-overflow: ellipsis;
    text-shadow: rgba(0, 0, 0, 0.3) 0px 2px 0px;
    white-space: nowrap;
    width: 100%;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-link {
    background-color: rgb(255, 255, 255);
    border-radius: 10px;
    cursor: pointer;
    position: relative;
    width: 30%;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-link a {
    color: #454545 !important;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-link a img {
    height: 105%;
    width: 121%;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-link a div {
    font-weight: 400;
    position: absolute;
    text-align: center;
    top: 25%;
    width: 100%;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition {
    margin-top: 15px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card {
    margin: 10px 0px 0px;
    border-radius: 5px;
    line-height: 1;
    overflow: hidden;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: rgb(255, 255, 255);
    padding: 15px;
    font-weight: 400;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-content div {
    font-size: 16px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-content div:last-child {
    border: 1px solid rgb(233, 73, 81);
    color: rgb(233, 73, 81);
    border-radius: 100px;
    font-size: 12px;
    font-weight: 300;
    margin-left: 5px;
    padding: 4px 7px;
    white-space: nowrap;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail {
    padding: 10px 20px;
    background-color: rgb(255, 255, 255);
    border-top: 1px solid rgb(233, 233, 233);
    cursor: pointer;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail>div {
    padding: 3px 0px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail>div .title {
    color: rgb(146, 146, 146);
    font-size: 14px;
    padding: 5px 0px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail>div .point {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
    padding: 5px 0px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail>div .progress-bar {
    background-color: rgb(233, 233, 233);
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.2) 0.1px 0.1px 0.1px 0.1px inset;
    height: 5px;
    overflow: hidden;
    width: 100%;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail>div .progress-bar div {
    height: 5px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail>div .progress-bar div.prog-1 {
    background-color: rgb(255, 155, 0);
    width: 25%;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-condition .detail-card .card-detail>div .progress-bar div.prog-2 {
    background-color: rgb(154, 193, 67);
    width: 55%;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege {
    margin: 30px 0px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege .title {
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 20px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege .box {
    gap: 10px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege .box .vip-privilege-item {
    background-color: rgb(255, 255, 255);
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege .box .vip-privilege-item img {
    max-width: 64px;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege .box .vip-privilege-item .item-title {
    font-weight: 400;
    line-height: 22px;
    margin: 8px 0px;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

#body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege .box .vip-privilege-item button {
    opacity: 0.5;
    border: none;
    background-color: #403e0b;
    width: 100%;
    border-radius: 3px;
    color: rgb(255, 255, 255);
    font-size: 12px;
    height: inherit;
    padding: 3px 15px;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content {
    width: 50%;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs {
    display: flex;
    width: 100%;
    justify-content: space-between;
    border-bottom: unset;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs li {
    width: 45.33%;
    text-align: center;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs li a {
    margin: 0;
    color: #454545;
    background-color: #e1e1e1;
    padding: 16px 25px;
    font-size: 16px;
    border: none;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs li.active {
    background-color: unset;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs li.active a {
    border: none;
    background-color: unset;
    /* padding: 16px 25px; */
    font-size: 16px;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content {
    width: calc(100% - 20px);
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach {
    align-items: flex-start;
    display: flex;
    justify-content: space-around;
    padding: 15px 0px 0px;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach .input-field {
    margin-bottom: 10px;
    width: 100%;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach .input-field>div {
    margin-right: 5px;
    background-color: #fff;
    max-height: inherit;
    max-width: inherit;
    min-height: inherit;
    min-width: inherit;
    border: 1px solid #e9e9e9;
    position: relative;
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    height: 54px;
    justify-content: space-around;
    padding: 0 15px;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach .input-field>div .input-block {
    box-sizing: border-box;
    position: relative;
    width: 100%;
    cursor: pointer;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach .input-field>div .input-block label {
    color: #6b6b6b;
    font-size: 10px;
    top: 8px;
    font-weight: 400;
    line-height: 1.29;
    pointer-events: none;
    position: absolute;
    transition: 0.2s;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach .input-field>div .input-block input[type="date"]::-webkit-calendar-picker-indicator {
    color: transparent;
    background: none;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach .input-field>div .input-block input {
    cursor: pointer;
    background-color: transparent;
    color: #454545;
    box-shadow: none;
    font-size: 14px;
    height: 100%;
    top: 0px;
    position: absolute;
    transition: 0.2s;
    width: 100%;
    border: none;
    padding: 0;
    padding-top: 22px;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach .input-field>div .icon-celander i {
    color: rgb(60, 170, 225);
    transform: translateY(-50%);
    right: 10px;
    top: 50%;
    cursor: pointer;
    font-size: 22px;
    position: absolute;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach button {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    height: 54px;
    border: none;
    width: 54px;
    background-color: #007aff;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .history-sreach button i {
    font-size: 18px;
    padding: 18px;
    color: #fff;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .infinite-loader-wrapper .infinite-load-item {
    width: 506px;
    height: 541px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .infinite-loader-wrapper .infinite-load-item img {
    max-width: 350px;
}

#body-web-info-vip input::-webkit-outer-spin-button,
#body-web-info-vip input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#body-web-info-vip input[type="number"] {
    -moz-appearance: textfield;
}

#body-web-info {
    background-color: #fff;
    width: 100%;
    /* Firefox */
}

#body-web-info .wrap-info {
    width: 100%;
}

#body-web-info .wrap-info .info-container {
    color: #454545;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1280px;
    padding: 20px 0;
    width: 100%;
}

#body-web-info .wrap-info .info-container .left {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    margin-right: 10px;
    overflow: hidden;
    width: 276px;
}

#body-web-info .wrap-info .info-container .left .info-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 15px;
}

#body-web-info .wrap-info .info-container .left .info-block .name {
    color: #454545;
    font-size: 16px;
    font-weight: 600;
}

#body-web-info .wrap-info .info-container .left .info-block span {
    color: #5f5f5f;
    font-size: 14px;
    margin: 3px 0 0;
    min-height: 24px;
}

#body-web-info .wrap-info .info-container .left .info-block .current-money {
    color: #cb0d0d;
    font-size: 24px;
    font-weight: 500;
}

#body-web-info .wrap-info .info-container .left .menu-block ul.list-menu {
    display: flex;
    flex-direction: column;
}

#body-web-info .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item {
    width: 100%;
}

#body-web-info .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 16px;
    width: 100%;
    padding: 17px 10px;
    color: #403e0b;
    line-height: 1.2;
}

#body-web-info .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a:hover {
    background-color: #606052;
    color: #fff;
    cursor: pointer;
}

#body-web-info .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a i {
    width: 35px;
    margin-right: 15px;
    font-size: 26px;
}

#body-web-info .wrap-info .info-container .left .menu-block ul.list-menu li.menu-item a.active {
    background-color: #403e0b;
    color: #fff;
}

#body-web-info .wrap-info .info-container .right {
    background: #ededed;
    border-radius: 10px;
    box-shadow: 0 2px 4px 0rgba 0, 0, 0, 0.15;
    display: flex;
    justify-content: space-between;
    position: relative;
    width: calc(100% - 220px);
}

#body-web-info .wrap-info .info-container .right .main-content {
    width: 50%;
    padding: 24px;
}

#body-web-info .wrap-info .info-container .right .main-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs {
    display: flex;
    justify-content: flex-start;
}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs li {
    border-radius: unset;
    border: none;
    flex: 1;
    font-weight: 500;
    height: 40px;
    padding: 0 !important;
    text-align: center;
}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs li a {
    width: 100%;
    border: none;
    height: 100%;
    padding: 0;
    font-size: 15px;
    text-align: center;
    color: #666;
    box-sizing: border-box;
    line-height: 3.1;
}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs li a:hover {
    border: none;
}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs li.active {
    background: transparent !important;
    color: #403e0b !important;
    border-bottom: 3px solid #403e0b !important;
    border-radius: 0px !important;
    text-align: center;
}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs li.active a {}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs li:hover {
    box-sizing: border-box;
}

#body-web-info .wrap-info .info-container .right .main-content .nav-tabs li:hover a {
    border: none;
    box-sizing: border-box;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .setting-btn {
    align-items: center;
    background-image: linear-gradient(96deg, #ff9b00 1%, #e64800);
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    justify-content: center;
    margin: 24px 0;
    padding: 12px 0;
    width: 100%;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .setting-btn i {
    font-size: 22px;
    margin-right: 15px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .setting-btn:hover {
    opacity: 0.8;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .info-block {
    background-color: #fff;
    border-radius: 5px;
    max-height: 600px;
    overflow-y: auto;
    padding: 10px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .info-block .data-box {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    color: #454545;
    padding: 15px 0 15px 15px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .info-block .data-box:not(:last-child) {
    border-bottom: 1px solid #e9e9e9;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .info-block .data-box>div {
    width: 100%;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .info-block .data-box>div .label {
    padding: 0;
    color: #454545;
    font-size: 10px;
    margin-bottom: 5px;
    opacity: 0.6;
    font-weight: 500;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .info-block .data-box>div .value {
    margin-top: 5px;
    font-size: 14px;
    line-height: 1.29;
    min-height: 18px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form {
    margin-top: 24px;
    margin-bottom: 70px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field {
    transition: filter 0.1s ease-out;
    margin-bottom: 10px;
    width: 100%;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div {
    background-color: #fff;
    max-height: inherit;
    max-width: inherit;
    min-height: inherit;
    min-width: inherit;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    height: 54px;
    justify-content: space-around;
    padding: 0 15px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block {
    box-sizing: border-box;
    position: relative;
    width: 100%;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block .title {
    color: #6b6b6b;
    font-size: 14px;
    top: 18px;
    font-weight: 400;
    transition: 0.2s;
    line-height: 1.29;
    pointer-events: none;
    position: absolute;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block .title::before {
    top: 3px;
    bottom: 22px;
    color: #e94951;
    content: "*";
    font-size: 10px;
    left: -8px;
    margin: auto;
    position: absolute;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block .title.active {
    font-size: 10px;
    top: 8px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block input,
#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block select {
    padding: 0;
    background-color: transparent;
    color: #454545;
    box-shadow: none;
    font-size: 14px;
    height: 28px;
    line-height: 1.13;
    top: 24px;
    border: none;
    position: absolute;
    transition: 0.2s;
    width: 100%;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block input.disabled,
#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block select.disabled {
    cursor: not-allowed !important;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block input option,
#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .input-field>div .input-block select option {
    width: 100%;
    border-radius: 5px;
    font-size: 16px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .btns {
    bottom: 24px;
    display: flex;
    justify-content: space-between;
    position: absolute;
    width: 48%;
    transition: filter 0.1s ease-out;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .tab-form .btns button {
    border-radius: 5px;
    width: 48%;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    height: 45px;
    padding: 0 40px;
    border: 0;
    background-color: #403e0b;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .top-info {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin: 24px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .top-info .label {
    color: #454545;
    font-size: 16px;
    margin-bottom: 5px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .top-info .main-wallet {
    align-items: center;
    display: flex;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .top-info .main-wallet i {
    color: #5f5f5f;
    cursor: pointer;
    font-size: 15px;
    margin-left: 5px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .top-info .main-wallet .value {
    color: #ff9b00;
    font-size: 24px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet {
    display: flex;
    flex-wrap: wrap;
    max-height: 600px;
    overflow-y: auto;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet::-webkit-scrollbar {
    width: 7px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet .data-box {
    align-items: center;
    background-color: #fff;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    height: 63px;
    margin: 0 1% 10px;
    width: 31%;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet .data-box div {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    font-size: 14px;
    justify-content: center;
    width: 100%;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet .data-box div.name {
    border-bottom: 1px solid #e9e9e9;
    color: #454545;
    height: 27px;
}

#body-web-info .wrap-info .info-container .right .main-content .tab-content .tab-box .member-wallet .sub-wallet .data-box div.balance {
    color: #5f5f5f;
    height: 35px;
}

#body-web-info .wrap-info .info-container .right .sub-content {
    width: 50%;
    padding: 24px;
}

#body-web-info .wrap-info .info-container .right .sub-content .title {
    color: #454545;
    font-size: 19px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 10px;
}

#body-web-info .wrap-info .info-container .right .sub-content .ads-block {
    height: 100%;
    max-height: 720px;
    overflow: auto;
    padding-top: 15px;
}

#body-web-info .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar {
    width: 7px;
}

#body-web-info .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-thumb {
    background-color: #e9e9e9;
    border-radius: 10px;
}

#body-web-info .wrap-info .info-container .right .sub-content .ads-block::-webkit-scrollbar-track {
    background-color: #ededed;
    border-radius: 10px;
}

#body-web-info .wrap-info .info-container .right .sub-content .ads-block .promo-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    transition: all 0.4s ease-out;
}

#body-web-info .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item {
    background-color: #fff;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 5px 10px;
    min-height: 200px;
    overflow: hidden;
    padding-bottom: 10px;
    width: calc(50% - 10px);
}

#body-web-info .wrap-info .info-container .right .sub-content .ads-block .promo-container .promo-item h3 {
    margin: 0;
    color: #454545;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    padding: 0 10px;
    word-break: break-all;
}

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

#body-web-info input[type="number"] {
    -moz-appearance: textfield;
}

#body-web-register .main-wrap {
    position: relative;
}

#body-web-register .main-wrap .register-block {
    background-color: #e7e7e7;
    border-radius: 5px;
    box-shadow: none;
    margin: -25px auto;
    overflow: hidden;
    padding: 0 339px 0 0;
    position: absolute;
    top: 7%;
    left: 50%;
    transform: translateX(-50%);
    width: 892px;
    z-index: 2;
}

#body-web-register .main-wrap .register-block::after {
    background: url(/brand/asset-unavailable.svg) 100% no-repeat;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 339px;
    z-index: 2;
}

#body-web-register .main-wrap .register-block .head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    background-color: transparent;
    border-bottom: 1px solid #ccc;
    height: auto;
    padding: 20px 0 0 20px;
    margin-bottom: 10px;
}

#body-web-register .main-wrap .register-block .head h3 {
    margin: 0;
    color: #403e0b;
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 10px;
    border-bottom: 2px solid #403e0b;
}

#body-web-register .main-wrap .register-block .body {
    padding: 20px 30px 0;
}

#body-web-register .main-wrap .register-block .body form dl {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

#body-web-register .main-wrap .register-block .body form dl dt {
    color: #535353;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    line-height: 36px;
}

#body-web-register .main-wrap .register-block .body form dl dt span {
    font-size: 20px;
    color: #403e0b;
}

#body-web-register .main-wrap .register-block .body form dl dd {
    width: 318px;
    display: flex;
    flex-direction: column;
}

#body-web-register .main-wrap .register-block .body form dl dd input {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box;
    display: block;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    height: 36px;
    padding-left: 10px;
    padding-right: 10px;
}

#body-web-register .main-wrap .register-block .body form dl dd input[type="submit"] {
    background-color: #403e0b;
    border: 0;
    border-radius: 22.5px;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    height: 45px;
    width: 220px;
    margin: 0px auto;
}

#body-web-register .main-wrap .register-block .body form dl dd input[type="submit"]:hover {
    background-color: #26a0de;
}

#body-web-register .main-wrap .register-block .body form dl dd span {
    font-weight: 400;
    line-height: 1.4;
    color: #777;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
}

#body-web-register .main-wrap .register-block .body form dl#groupSubmit {
    justify-content: center;
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
}

a:hover {
    text-decoration: none;
}

#body-web-promotion {
    background: url(https://i.imgur.com/TrgCdO8.jpg) 50% / cover no-repeat fixed !important;
}

#body-web-promotion .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

.marquee-block .visible-area {
    font-size: 14px;
}

#body-web-promotion .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-promotion .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-promotion .main-wrap {
    max-width: 75%;
    margin: 0px auto;
}

#body-web-promotion .main-wrap .nav-tabs {
    display: flex;
    width: 100%;
    gap: 10px;
    border-bottom: unset;
}

#body-web-promotion .main-wrap .nav-tabs li {
    flex: 1;
    border-radius: unset;
    border: none;
}

#body-web-promotion .main-wrap .nav-tabs li a {
    margin: 0;
    border-radius: unset;
    border: none;
    background-color: #000;
    color: #fff;
    font-size: 16px;
    height: 54px;
    line-height: 36px;
    margin-top: 25px;
    margin-bottom: 25px;
    min-width: 130px;
    opacity: 0.6;
    text-align: center;
    text-transform: uppercase;
}

#body-web-promotion .main-wrap .nav-tabs li:hover a {
    background-color: #403e0b;
    cursor: pointer;
    opacity: 1;
}

#body-web-promotion .main-wrap .nav-tabs li.active a {
    background-color: #403e0b;
    cursor: pointer;
    opacity: 1;
}

#body-web-promotion .main-wrap .tab-content {
    padding-bottom: 50px;
}

#body-web-promotion .main-wrap .tab-content .promo-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

#body-web-promotion .main-wrap .tab-content .promo-container .promo-item {
    text-align: center;
    cursor: pointer;
}

#body-web-promotion .main-wrap .tab-content .promo-container .promo-item h3 {
    display: none;
    font-size: 18px;
}

#body-web-promotion .promo-popup {
    background-color: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px auto;
    z-index: 150;
}

#body-web-promotion .promo-popup.active {
    display: none;
}

#body-web-promotion .promo-popup .container-popup {
    max-width: 1350px;
    height: 80vh;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    position: relative;
}

#body-web-promotion .promo-popup .container-popup .head {
    position: fixed;
    background-color: #403e0b;
    border-radius: 5px 5px 0px 0px;
    height: 50px;
    top: 93px;
    left: 50%;
    transform: translateX(-50%);
    width: 1350px;
    display: flex;
    justify-content: flex-end;
}

#body-web-promotion .promo-popup .container-popup .head i {
    font-size: 25px;
    color: #fff;
    padding: 12px;
    cursor: pointer;
}

#body-web-promotion .promo-popup .container-popup .body {
    background-color: #fff;
    padding-top: 50px;
    height: 100%;
    display: flex;
}

#body-web-promotion .promo-popup .container-popup .body .left {
    max-width: 350px;
    width: 100%;
    padding: 15px;
    background-color: rgba(204, 204, 204, 0.1);
    box-shadow: 1px 0 0 0 rgba(204, 204, 204, 0.3);
    position: relative;
    transition: 0.4s;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

#body-web-promotion .promo-popup .container-popup .body .left.active {
    width: 0%;
    transition: 0.4s;
}

#body-web-promotion .promo-popup .container-popup .body .left .top img {
    max-width: 320px;
    height: auto;
}

#body-web-promotion .promo-popup .container-popup .body .left .top h3 {
    font-size: 21px;
    line-height: 1.4;
    margin: 15px 0;
}

#body-web-promotion .promo-popup .container-popup .body .left .top h3.active {
    display: none;
}

#body-web-promotion .promo-popup .container-popup .body .left .bot {
    width: 100%;
}

#body-web-promotion .promo-popup .container-popup .body .left .bot form button {
    width: 100%;
    border: none;
    outline: none;
    height: 45px;
    color: #fff;
    background-color: #403e0b;
    font-size: 18px;
}

#body-web-promotion .promo-popup .container-popup .body .left .toggle-icon {
    cursor: pointer;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    right: -15px;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(239, 239, 239, 0.9);
    box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 5px;
}

#body-web-promotion .promo-popup .container-popup .body .left .toggle-icon i {
    font-size: 18px;
    color: rgb(60, 170, 225);
    transition: 0.3s;
}

#body-web-promotion .promo-popup .container-popup .body .left .toggle-icon i.active {
    transform: rotate(180deg);
}

#body-web-promotion .promo-popup .container-popup .body .right {
    padding: 70px 20px 50px 40px;
    overflow-y: auto;
}

#body-web-promotion .promo-popup .container-popup .body .right .title h3 {
    font-size: 24px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}

#body-web-promotion .promo-popup .container-popup .body .right .content {
    font-size: 16px;
}

#body-web-promotion .promo-popup .container-popup .body .right .top-content .link {
    color: rgb(35, 175, 227);
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    margin: 15px auto;
}

#body-web-promotion .promo-popup .container-popup .body .right .top-content .re-comment {
    font-weight: 700;
    font-size: 18px;
    margin: 15px auto;
}

#body-web-promotion .promo-popup .container-popup .body .right .top-content .re-comment span {
    color: rgb(35, 175, 227);
}

#body-web-promotion .promo-popup .container-popup .body .right .top-content .re-comment span a {
    color: rgb(35, 175, 227);
    text-decoration: underline;
}

#body-web-promotion .promo-popup .container-popup .body .right .bottom-content p {
    font-size: 18px;
    margin: 15px auto;
}

#body-web-promotion .promo-popup .container-popup .body .right .bottom-content p span {
    font-weight: 700;
    color: rgb(35, 175, 227);
}

#body-web-promotion .promo-popup .container-popup .body .right .bottom-content p span a {
    color: rgb(35, 175, 227);
    text-decoration: underline;
}

#body-web-promotion .promo-popup .container-popup .body .right .bottom-content table {
    width: 100%;
    color: #fff;
}

#body-web-promotion .promo-popup .container-popup .body .right .bottom-content table th {
    background-color: rgb(35, 175, 227);
    border: 1px solid #fff;
    text-transform: capitalize;
    height: 40px;
    text-align: center;
}

#body-web-promotion .promo-popup .container-popup .body .right .bottom-content table td {
    background-color: rgb(35, 175, 227);
    border: 1px solid #fff;
    height: 30px;
    text-align: center;
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
    font-size: unset;
}

a:hover {
    text-decoration: none;
}

#body-web-vip {
    padding-bottom: 50px;
    background-color: #e7e7e7;
}

#body-web-vip .swiper {
    width: 400px;
    height: 320px;
}

#body-web-vip .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
}

#body-web-vip .swiper-slide {
    /* background: linear-gradient(135deg, #787878, #787878 50%, #878787 0, #787878); */
    /* box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #646464; */
}

#body-web-vip .swiper-slide:nth-child(11n) {
    background: linear-gradient(135deg, #31d0be, #31d0be 50%, #4ad6c6 0, #31d0be);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #28b0a1;
}

#body-web-vip .swiper-slide:nth-child(12n) {
    background: linear-gradient(135deg, #78c963, #78c963 50%, #8cd17a 0, #78c963);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #5ebf45;
}

#body-web-vip .swiper-slide:nth-child(20n) {
    background: linear-gradient(135deg, #f28f39, #f28f39 50%, #f49f56 0, #f28f39);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #ef7913;
}

#body-web-vip .swiper-slide:nth-child(19n) {
    background: linear-gradient(135deg, #f28f39, #f28f39 50%, #f49f56 0, #f28f39);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #ef7913;
}

#body-web-vip .swiper-slide:nth-child(18n) {
    background: linear-gradient(135deg, #df5757, #df5757 50%, #e47171 0, #df5757);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #d83535;
}

#body-web-vip .swiper-slide:nth-child(17n) {
    background: linear-gradient(135deg, #cf42a9, #cf42a9 50%, #d55ab4 0, #cf42a9);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #b92f94;
}

#body-web-vip .swiper-slide:nth-child(16n) {
    background: linear-gradient(135deg, #996ff1, #996ff1 50%, #ad8bf4 0, #996ff1);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #7f4aed;
}

#body-web-vip .swiper-slide:nth-child(15n) {
    background: linear-gradient(135deg, #7ac7ef, #7ac7ef 50%, #95d3f2 0, #7ac7ef);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #56b8eb;
}

#body-web-vip .swiper-slide:nth-child(14n) {
    background: linear-gradient(135deg, #c18149, #c18149 50%, #c99160 0, #c18149);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #a86d39;
}

#body-web-vip .swiper-slide:nth-child(13n) {
    background: linear-gradient(135deg, #f0d17b, #f0d17b 50%, #f3db96 0, #f0d17b);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -10px 25px #ecc456;
}

#body-web-vip .swiper-pagination-bullet {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50%;
}

#body-web-vip .swiper-pagination-bullet-active {
    background-color: #007aff;
}

#body-web-vip .swiper-button-next {
    right: -130px;
}

#body-web-vip .swiper-button-prev {
    left: -130px;
}

#body-web-vip .main-wrap {
    max-width: 62%;
    margin: 0 auto;
}

#body-web-vip .main-wrap .swiper-box {
    position: relative;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper {
    align-items: center;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide {
    display: flex;
    width: 400px !important;
    height: 186px !important;
    border-radius: 5px;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    padding: 30px;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip {
    font-size: 12px;
    font-weight: 300;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .top-box .level {
    padding: 3px;
    font-size: 24px;
    font-weight: 800;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.3);
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .top-box p {
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 400;
    overflow: hidden;
    padding: 3px;
    text-overflow: ellipsis;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.3);
    white-space: nowrap;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .bottom-box {
    font-size: 12px;
    font-weight: 300;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .info-vip .bottom-box p {
    padding: 3px;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .badge-img {
    display: flex;
    align-items: center;
}

#body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide .box .badge-img img {
    max-width: 111px;
}

#body-web-vip .main-wrap .vip-box {
    background-image: linear-gradient(0deg, #ededed 100%, #f2f2f2 0);
    padding: 0 25px;
    width: 1200px;
    padding-bottom: 35px;
}

#body-web-vip .main-wrap .vip-box .vip-privilege>h5 {
    color: #454545;
    font-size: 20px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 600;
    letter-spacing: normal;
    line-height: normal;
    line-height: 4.5;
    text-align: center;
}

#body-web-vip .main-wrap .vip-box .vip-privilege table {
    width: 100%;
    text-align: center;
}

#body-web-vip .main-wrap .vip-box .vip-privilege table th {
    height: 52px;
    border: 1px solid transparent;
    background: #fff;
    white-space: nowrap;
    font-weight: 500;
}

#body-web-vip .main-wrap .vip-box .vip-privilege table td {
    height: 40px;
    border: 1px solid transparent;
    background: #fff;
    white-space: nowrap;
    text-transform: uppercase;
}

#body-web-vip .main-wrap .vip-box .vip-rules h5 {
    color: #454545;
    font-size: 20px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 600;
    letter-spacing: normal;
    line-height: 4.5;
    text-align: center;
}

#body-web-vip .main-wrap .vip-box .vip-rules h2 {
    color: rgb(37, 168, 222);
    text-align: center;
    font-size: 30px;
    line-height: 1.5;
    margin: 15px auto;
}

#body-web-vip .main-wrap .vip-box .vip-rules p {
    font-size: 24px;
    margin: 14px auto;
    line-height: 1.5;
}

#body-web-vip .main-wrap .vip-box .vip-rules p span {
    color: red;
}

#body-web-vip .main-wrap .vip-box .vip-rules table {
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 18px;
}

#body-web-vip .main-wrap .vip-box .vip-rules table th {
    padding: 5px;
    border: 1px solid transparent;
    background-color: rgb(35, 175, 227);
    font-weight: 500;
}

#body-web-vip .main-wrap .vip-box .vip-rules table td {
    padding: 5px;
    background-color: rgb(35, 175, 227);
    border: 1px solid transparent;
}

#body-web-vip .main-wrap .vip-box .vip-rules h3 {
    text-align: center;
    margin: 15px auto;
    font-size: 24px;
    color: rgb(35, 175, 227);
}

#body-web-vip .main-wrap .vip-box .vip-rules h3 span a {
    color: rgb(85, 26, 139);
    text-decoration: underline;
}

#body-web-vip .main-wrap .vip-box .vip-rules h3 span a:focus {
    color: rgb(255, 0, 15);
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
}

a:hover {
    text-decoration: none;
}

#body-web-slot {
    background: #000 url(/web/nato888/images/banner-main.jpg?912446e5c336f3ab5a631781f5e3d48b) top/auto 300px no-repeat;
}

#body-web-slot .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

#body-web-slot .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-slot .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-slot .main-wrap .game-main {
    margin: 0 auto;
    padding-top: 270px;
    position: relative;
    width: 1000px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    overflow-x: scroll;
    border: 1px solid #3b3933;
    margin-bottom: -1px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li {
    border: none;
    border-radius: unset;
    background-color: #1c1c1c;
    color: #dadada;
    cursor: pointer;
    font-size: 14px;
    height: 98px;
    border-right: 1px solid #3b3933;
    transition: color 0.4s, background-color 0.4s;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li:last-child {
    border-right: none;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li a {
    border: none;
    border-radius: unset;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 10px;
    height: 100%;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li a .logo {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    height: 60px;
    margin: 0 auto;
    width: 60px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li a span {
    margin-top: 2px;
    max-width: 125px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-transform: uppercase;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li a:hover {
    background-color: #151515;
    color: #f4ecad;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li.active {
    background-color: #000;
}

#body-web-slot .main-wrap .game-main .game-tabs>.nav-tabs li.active a {
    background-color: #000;
    color: #f4ecad;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content {
    padding-bottom: 50px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content {
    padding: 15px;
    border: 1px solid #3b3933;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box {
    display: flex;
    align-items: center;
    background: linear-gradient(180deg, #352b2a, #241c1a);
    border-bottom: 2px solid #cfba81;
    height: 56px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box .box-search {
    position: relative;
    padding: 9px 15px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box .box-search input {
    width: 270px;
    font-size: 14px;
    padding: 0 36px 0 15px;
    background-color: 151010;
    border: 0;
    color: #fff;
    height: 36px;
    border-radius: 30px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box .box-search i {
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box>.nav-tabs {
    height: 100%;
    border-bottom: none;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box>.nav-tabs li {
    border: none;
    border-radius: unset;
    margin: 0;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box>.nav-tabs li a {
    border: none;
    border-radius: unset;
    height: 100%;
    color: rgba(255, 255, 255, 0.5);
    font-size: 17px;
    line-height: 2;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box>.nav-tabs li.active {
    background-color: unset;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box>.nav-tabs li.active a {
    background-color: unset;
    background-image: linear-gradient(180deg, hsla(53deg, 76%, 82%, 0), #f4ecad 0, #d2b068);
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .top-box>.nav-tabs li:hover a {
    background-color: unset;
    color: #fff;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box {
    background-color: #100c0b;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game {
    margin-bottom: 60px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 15px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item img {
    max-width: 148px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item .title {
    color: #cfba81;
    font-size: 16px;
    text-align: center;
    line-height: 1.2;
    margin-top: 5px;
    width: 100%;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item .link-cover {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 148px;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    transition: 0.4s;
    opacity: 0;
    transform: translateY(100%);
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item .link-cover button,
#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item .link-cover .launch-game {
    border: none;
    font-size: 16px;
    padding: 0;
    width: 80%;
    border-radius: 22.5px;
    color: #fff;
    cursor: pointer;
    height: 45px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item .link-cover button {
    background-color: #ea4747;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item .link-cover .launch-game {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, #f4ecad, #d2b068);
    color: #333;
    margin-top: 15px;
}

#body-web-slot .main-wrap .game-main .game-tabs>.tab-content .main-content .bottom-box .list-game .games .game-item:hover .link-cover {
    transform: translateY(0);
    opacity: 1;
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
}

a:hover {
    text-decoration: none;
}

#body-web-sport {
    background: url(/web/nato888/images/sports-bg.jpg?f27016bbce93453844da4574fdbc7286) top/cover no-repeat fixed !important;
}

#body-web-sport .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

#body-web-sport .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-sport .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-sport .main-wrap .game-tabs {
    max-width: 80%;
    margin: 0 auto;
    padding: 50px 0px;
    padding-bottom: 120px;
}

#body-web-sport .main-wrap .game-tabs .nav-tabs {
    width: 100%;
    display: flex;
    justify-content: center;
    border-bottom: none;
}

#body-web-sport .main-wrap .game-tabs .nav-tabs li {
    flex: 1;
    background-color: #070a0f;
    border: 1px solid #ffb703;
}

#body-web-sport .main-wrap .game-tabs .nav-tabs li a {
    padding: 5px 10px;
    border: none;
    border-radius: unset;
}

#body-web-sport .main-wrap .game-tabs .nav-tabs li a img {
    max-width: 90px;
    display: block;
    margin: 0px auto;
}

#body-web-sport .main-wrap .game-tabs .nav-tabs li.active {
    background: #ffb703;
    color: #333;
}

#body-web-sport .main-wrap .game-tabs .nav-tabs li.active a {
    background: #ffb703;
}

#body-web-sport .main-wrap .game-tabs .nav-tabs li:hover a {
    background: unset;
}

#body-web-sport .main-wrap .game-tabs .tab-content .btn-sport {
    margin: 15px auto;
    display: block;
    background: #ffb703;
    font-size: 16px;
    color: #333;
    font-size: 16px;
    cursor: pointer;
    height: 44px;
    line-height: 36px;
    position: relative;
    text-align: center;
    width: 214px;
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
}

a:hover {
    text-decoration: none;
}

#body-web-casino .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

#body-web-casino .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
    font-size: 14px;
}

#body-web-casino .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-casino .main-wrap .tab-content .tab-pane .live-item {
    background-size: cover;
    background-position: 50%;
    display: flex;
    height: 78%;
    width: 100%;
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    justify-content: center;
}

#body-web-casino .main-wrap .tab-content .tab-pane .live-item .logo-start {
    margin: 110px 0px;
    -webkit-animation: 0.8s infinite linear;
    animation: 0.8s infinite linear;
}

#body-web-casino .main-wrap .tab-content .tab-pane .live-item .logo-start:hover {
    -webkit-animation: gp-logo-hover 0.8s linear infinite;
    animation: gp-logo-hover 0.8s linear infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
}

#body-web-casino .main-wrap .tab-content .tab-pane .live-item .person-img {
    margin-top: 70px;
    margin-left: 100px;
}

#body-web-casino .main-wrap .tab-content .tab-pane .live-item .person-img img {
    height: 100%;
}

#body-web-casino .main-wrap .tab-content .tab-pane:nth-child(even) .live-item {
    flex-direction: row-reverse;
}

#body-web-casino .main-wrap .nav-tabs {
    display: flex;
    position: absolute;
    top: 77%;
    width: 100%;
    justify-content: center;
    border-bottom: none;
}

#body-web-casino .main-wrap .nav-tabs li {
    cursor: pointer;
    margin: 0 5px;
    perspective: 300px;
    transform: scale3d(0.9, 0.9, 1);
    transform-origin: 50% 90%;
    transition: transform 0.4s;
    width: 123px;
    border: none;
    border-radius: unset;
    transition: filter 0.4s;
    filter: grayscale(1) contrast(80%) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.75)) drop-shadow(0 4px 8px rgba(0, 0, 0, 0.75));
}

#body-web-casino .main-wrap .nav-tabs li:hover {
    filter: grayscale(0.5) contrast(90%) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.75)) drop-shadow(0 4px 8px rgba(0, 0, 0, 0.75));
}

#body-web-casino .main-wrap .nav-tabs li.active {
    transform: scale(1);
    -webkit-animation: live-nav-items_li 0.8s linear both;
    animation: live-nav-items_li 0.8s linear both;
}

#body-web-casino .main-wrap .nav-tabs li a {
    border: none;
    border-radius: unset;
    padding: 0;
}

#body-web-casino .main-wrap .nav-tabs li.active img {
    -webkit-animation: live-nav-items_li 0.8s linear both;
    animation: live-nav-items_li 0.8s linear both;
}

#body-web-casino .nav-tabs>li.active>a,
#body-web-casino .nav-tabs>li.active>a:focus,
#body-web-casino .nav-tabs>li.active>a:hover {
    transform: scaleX(1);
    border: none;
    border-radius: none;
    text-decoration: none;
    background-color: unset;
}

#body-web-casino .nav>li>a:focus,
#body-web-casino .nav>li>a:hover {
    border: none;
    border-radius: unset;
    text-decoration: none;
    background-color: unset;
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
}

a:hover {
    text-decoration: none;
}

#body-web-lottery {
    background: url(/web/nato888/images/pbg-lottery.jpg?e50eb2bda7a69e0b8653ec6c1861ba86) top/cover no-repeat no-repeat;
    min-height: calc(100vh - 345px);
    min-width: 1100px;
}

#body-web-lottery .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

#body-web-lottery .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-lottery .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-lottery .main-wrap {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    margin: auto;
    padding: 40px;
}

#body-web-lottery .main-wrap .nav-tabs {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 50px;
    display: inline-block;
    padding: 6px 8px;
}

#body-web-lottery .main-wrap .nav-tabs li a {
    margin: 0;
    font-size: 18px;
    border: none;
    border-radius: none;
    text-transform: uppercase;
    border: none;
    border-radius: none;
    color: #fff;
    display: inline-block;
    line-height: 45px;
    overflow: hidden;
    padding: 0 34px;
    vertical-align: middle;
}

#body-web-lottery .main-wrap .tab-content .wrap {
    display: flex;
    justify-content: center;
    width: 1100px;
    margin: 0 auto;
    padding: 50px 20px;
    text-align: center;
}

#body-web-lottery .main-wrap .tab-content .wrap .wrap-item {
    cursor: pointer;
    margin: 0 20px;
    padding-bottom: 20px;
    position: relative;
    width: calc(20% - 40px);
}

#body-web-lottery .main-wrap .tab-content .wrap .wrap-item .cover {
    background-color: #fff;
    border-radius: 10px;
    margin: 8px auto 12px;
    max-width: 180px;
    overflow: hidden;
    position: relative;
    transition: 0.3s;
    width: 100%;
    box-shadow: inset 0 -10px 20px rgba(0, 0, 0, 0.5);
    z-index: 3;
}

#body-web-lottery .main-wrap .tab-content .wrap .wrap-item .cover img {
    display: block;
    height: auto;
    position: relative;
    width: 100%;
}

#body-web-lottery .main-wrap .tab-content .wrap .wrap-item .cont {
    position: relative;
}

#body-web-lottery .main-wrap .tab-content .wrap .wrap-item .cont h2 {
    padding-top: 5px;
    position: relative;
    z-index: 3;
    color: #444;
    font-size: 16px;
    margin: 0;
}

#body-web-lottery .main-wrap .tab-content .wrap .wrap-item .cont::before {
    background: linear-gradient(90deg, hsla(0deg, 0%, 100%, 0) 0, hsla(0deg, 0%, 100%, 0.8) 50%, hsla(0deg, 0%, 100%, 0));
    border-radius: 50%;
    content: "";
    filter: blur(6px);
    height: 25px;
    left: -40px;
    position: absolute;
    top: -25px;
    width: calc(100% + 80px);
    z-index: 1;
}

#body-web-lottery .main-wrap .tab-content .wrap .wrap-item .cont::after {
    background-color: rgba(0, 0, 0, 0.9);
    border-radius: 50%;
    content: "";
    filter: blur(4px);
    height: 15px;
    left: 0;
    position: absolute;
    top: -20px;
    width: 100%;
    z-index: 2;
}

#body-web-lottery .nav-tabs>li.active>a,
#body-web-lottery .nav-tabs>li.active>a:focus,
#body-web-lottery .nav-tabs>li.active>a:hover {
    background-color: #403e0b;
    border-radius: 50px;
    box-shadow: inset 0 -3px 0 rgba(255, 255, 255, 0.3);
    position: relative;
    background: linear-gradient(180deg, #54c6ff 0, #199bdd);
}

#body-web-lottery .nav>li>a:focus,
#body-web-lottery .nav>li>a:hover {
    text-decoration: none;
    background-color: unset;
}

nav {
    height: 100%;
}

ul {
    margin: 0;
}

p {
    margin: 0;
}

a:hover {
    text-decoration: none;
}

#body-web-e-sport {
    background: #0b131c url(/web/nato888/images/esports-bg.jpg?0805f827ee598441f1ec6ce190bcc077) 50% / cover no-repeat;
    height: 100%;
    width: 100%;
}

#body-web-e-sport img {
    width: auto;
}

#body-web-e-sport .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

#body-web-e-sport .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-e-sport .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-e-sport .main-wrap .game-wrap {
    background: url(/web/nato888/images/ctr-l.png?fb2763714636e8c71c3d09cb30ec50b1) 0 100% / auto 80% no-repeat,
        url(/web/nato888/images/ctr-r.png?514c21b2781fbd5a43b0b2d2649fa4d7) 100% 100% / auto 80% no-repeat;
    height: calc(100vh - 366px);
    min-height: 700px;
    position: relative;
    text-align: center;
    width: 100%;
}

#body-web-e-sport .main-wrap .game-wrap>img {
    height: 62%;
    left: 50%;
    position: absolute;
    top: 50px;
    transform: translateX(-50%);
}

#body-web-e-sport .main-wrap .game-wrap .games {
    align-items: flex-end;
    display: flex;
    height: 100%;
    justify-content: center;
    margin: 0 auto;
    max-width: 1000px;
    width: 100%;
}

#body-web-e-sport .main-wrap .game-wrap .games .play {
    margin: 0 auto 20px;
    position: relative;
    width: 350px;
}

#body-web-e-sport .main-wrap .game-wrap .games .play>img {
    display: block;
    height: 90px;
    margin: 0 auto;
    width: auto;
}

#body-web-e-sport .main-wrap .game-wrap .games .play .play-btn {
    cursor: pointer;
    height: 90px;
    margin: 10px auto 20px;
    position: relative;
    top: 0;
    transition: 0.2s ease;
    width: 320px;
    display: block;
}

#body-web-e-sport .main-wrap .game-wrap .games .play .play-btn:hover {
    top: 3px;
}

#body-web-e-sport .main-wrap .game-logo {
    background: #09111b url(/web/nato888/images/esports_bg.jpg?0303a196f0fc292f282b440f46e6268f) 50% no-repeat;
    background-size: cover;
    padding: 50px 0;
    text-align: center;
}

#body-web-chicken {
    background: url(/web/nato888/images/ani-bg.jpg?61cb479a297490652052a02f68ef282a) 50% / cover no-repeat;
}

#body-web-chicken .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

#body-web-chicken .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-chicken .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-chicken .main-wrap {
    overflow: hidden;
}

#body-web-chicken .main-wrap .game-animal {
    max-width: 1400px;
    margin: auto;
}

#body-web-chicken .main-wrap .game-animal .game-type {
    display: flex;
    justify-content: center;
}

#body-web-chicken .main-wrap .game-animal .game-type .box-img {
    position: relative;
}

#body-web-chicken .main-wrap .game-animal .game-type .box-img>img {
    transform: scale(1.5);
    transition: 0.5s;
}

#body-web-chicken .main-wrap .game-animal .game-type .box-img:hover>img {
    transform: scale(1.75);
    transition: 0.5s;
}

#body-web-chicken .main-wrap .game-animal .game-type .box-img .game-list {
    position: absolute;
    top: 360px;
    left: 50%;
    transform: translate(-50%);
    cursor: pointer;
    max-width: 220px;
    margin: auto;
    transition: 0.3s;
}

#body-web-chicken .main-wrap .game-animal .game-type .box-img .game-list img {
    transition: 0.3s;
}

#body-web-chicken .main-wrap .game-animal .game-type .box-img .game-list img:hover {
    transform: scale(1.1);
    transition: 0.3s;
}

#body-web-chess {
    background: url(/web/nato888/images/bg-cq9.png?d4cbd3da87f31527d699121d333c0639) bottom/auto no-repeat fixed,
        #101010 url(/web/nato888/images/bg-cq9.jpg?d42f9c434f9fd4ae103f55f9b6f88d05) top/100% auto no-repeat;
}

#body-web-chess nav {
    height: 100%;
}

#body-web-chess ul {
    margin: 0;
}

#body-web-chess p {
    margin: 0;
}

#body-web-chess a:hover {
    text-decoration: none;
}

#body-web-chess img {
    max-width: 155px;
}

#body-web-chess .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
    position: relative;
}

#body-web-chess .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-chess .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-chess .main-wrap {
    display: flex;
    gap: 40px;
    max-width: 1200px;
    margin: auto;
    padding: 100px 0px;
}

#body-web-chess .main-wrap ul.nav {
    display: flex;
    flex-direction: column;
    border-bottom: none;
}

#body-web-chess .main-wrap ul.nav li {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
    color: #8c7d78;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    line-height: 70px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    text-align: center;
    text-indent: 10px;
    transition: 0.2s;
    background: linear-gradient(180deg, #352b2b 0, #241b1b);
    width: 100%;
    border: none;
    border-radius: unset;
}

#body-web-chess .main-wrap ul.nav li:hover a {
    background: linear-gradient(180deg, #e8d793 0, #d4b26a);
    color: #573714;
    border: unset;
}

#body-web-chess .main-wrap ul.nav li a {
    padding: 24px 22px;
    text-transform: uppercase;
    text-align: center;
    border-radius: unset;
    color: #8c7d78;
    cursor: pointer;
    font-size: 16px;
    overflow: hidden;
    border: none;
    margin: 0;
}

#body-web-chess .main-wrap ul.nav li.active {
    background: linear-gradient(180deg, #e8d793 0, #d4b26a);
    color: #573714;
}

#body-web-chess .main-wrap .tab-content .tab-pane {
    background-color: rgba(0, 0, 0, 0.8);
    border-top: 2px solid #d4b26a;
    box-sizing: border-box;
    margin-bottom: 50px;
    min-height: 380px;
    padding: 20px;
}

#body-web-chess .main-wrap .tab-content .tab-pane .games {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
}

#body-web-chess .main-wrap .tab-content .tab-pane .games .game-item {
    position: relative;
}

#body-web-chess .main-wrap .tab-content .tab-pane .games .game-item:hover .img {
    filter: grayscale(80%);
    opacity: 0.7;
}

#body-web-chess .main-wrap .tab-content .tab-pane .games .game-item::after {
    background-image: linear-gradient(180deg, #e8d793, #d4b26a);
    border-radius: 50%;
    box-shadow: 0 1px 6px #000, inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
    color: #573714;
    content: "\25B6";
    font-size: 35px;
    height: 70px;
    left: calc(50% - 35px);
    line-height: 72px;
    position: absolute;
    text-indent: 23px;
    top: calc(50% - 45px);
    transform: scale(0);
    transition: 0.2s;
    width: 70px;
}

#body-web-chess .main-wrap .tab-content .tab-pane .games .game-item:hover::after {
    cursor: pointer;
    transform: scale(1);
}

#body-web-chess .nav-tabs>li.active>a,
#body-web-chess .nav-tabs>li.active>a:focus,
#body-web-chess .nav-tabs>li.active>a:hover {
    background: linear-gradient(180deg, #e8d793 0, #d4b26a);
    color: #573714 !important;
}

#body-web-fishing {
    background: #2b2d42 url(/web/nato888/images/fishing4_bg.jpg?9b921d270a20688f39ee6fce24df991e) top/cover no-repeat !important;
    min-height: 45vw;
    overflow: hidden;
}

#body-web-fishing .marquee-block {
    background-color: rgba(0, 0, 0, 0.4);
    height: 35px;
    color: #fff;
}

#body-web-fishing .marquee-block .visible-area {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0px auto;
    width: 90%;
    justify-content: center;
}

#body-web-fishing .marquee-block .icon-title {
    position: absolute;
    top: 50%;
    left: 65px;
    transform: translateY(-50%);
}

#body-web-fishing .main-wrap {
    max-width: 1200px;
    margin: auto;
}

#body-web-fishing .main-wrap nav {
    padding-top: 70px;
    padding-bottom: 100px;
}

#body-web-fishing .main-wrap nav .fishing-game-list {
    display: flex;
    flex-wrap: wrap;
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item {
    margin: 10px 25px 50px;
    width: calc(20% - 50px);
    cursor: pointer;
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item:hover .cover {
    transform: translateY(-4px);
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item .cover {
    background-color: transparent;
    box-shadow: none !important;
    filter: drop-shadow(0 10px 6px rgba(0, 0, 0, 0.7));
    transition: 0.3s ease;
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item .cover img {
    max-width: 190px;
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item .cont {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item .cont h2 {
    font-size: 16px;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
    top: 190px;
    transition: 0.3s;
    width: 100%;
    color: #fff;
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item .cont a {
    background-image: linear-gradient(rgb(230, 218, 70), rgb(251, 131, 8) 53%, rgb(213, 96, 43));
    box-shadow: rgba(0, 0, 0, 0.5) 0px 3px 3px;
    color: rgb(255, 255, 255);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    height: 40px;
    margin-top: 15px;
    line-height: 40px;
    text-shadow: rgba(0, 0, 0, 0.8) 0px 1px 2px;
    width: 100px;
    border-width: 2px;
    border-style: solid;
    border-color: rgb(194, 114, 45);
    -o-border-image: initial;
    border-image: initial;
    border-radius: 50px;
}

#body-web-fishing .main-wrap nav .fishing-game-list .fishing-game-item .cont a:hover {
    background-image: linear-gradient(180deg, #d5602b, #fb8308 53%, #e6da46);
}

body {
    font-family: "Open Sans", sans-serif !important;
}

body #shortcut_list {
    position: fixed;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    z-index: 99;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body #shortcut_list .item {
    background-image: linear-gradient(90deg, #34b7e6, #1b6db6);
    border-radius: 25px;
    box-shadow: inset 0 0 0 1px #035293, 0 2px 5px 0 rgba(0, 0, 0, 0.6);
    color: rgba(255, 255, 255, 0.9);
    display: block;
    font-size: 12px;
    height: 70px;
    line-height: 1.4;
    overflow: initial;
    text-decoration: none;
    transform: translateZ(0);
    transition: transform 0.3s linear;
    transition: 0.3s ease;
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 5px;
}

body #shortcut_list .item i {
    font-size: 26px;
    color: #fff;
}

body #shortcut_list .item span {
    color: #fff;
}

body #shortcut_list .item:hover {
    background-image: linear-gradient(90deg, #60c1e4, #3a95e4);
}

body header {
    color: #fff;
    position: relative;
}

body header .top-head {
    background: #2199ca;
    height: 50px;
}

body header .top-head .container-web {
    width: 85%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

body header .top-head .container-web .left {
    position: relative;
    font-size: 14px;
}

body header .top-head .container-web .left a {
    color: #fff;
    cursor: pointer;
    padding: 0 10px;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

body header .top-head .container-web .left a i {
    margin-right: 5px;
}

body header .top-head .container-web .left a.download:hover+.qrdownload {
    display: block !important;
}

body header .top-head .container-web .left a:hover {
    opacity: 0.5;
}

body header .top-head .container-web .left .qrdownload {
    background-color: #fff;
    border: 0.5px solid #dcdcdc;
    border-radius: 6px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
    display: none;
    left: 15%;
    position: absolute;
    text-align: center;
    top: calc(100% + 14px);
    transform: translateX(-50%);
    width: 140px;
    z-index: 10000;
}

body header .top-head .container-web .left .qrdownload .code {
    border-radius: 6px;
    overflow: hidden;
}

body header .top-head .container-web .left .qrdownload .icon i {
    color: #403e0b;
    font-size: 20px;
    padding: 8px;
    line-height: 1;
}

body header .top-head .container-web .left .qrdownload .title {
    color: #000;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    padding: 5px;
}

body header .top-head .container-web .left .qrdownload::before {
    border-bottom: 9px solid #fff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    content: "";
    display: inline-block;
    position: absolute;
    right: calc(50% - 10px);
    top: -9px;
}

body header .top-head .container-web .right {
    display: flex;
    align-items: center;
}

body header .top-head .container-web .right input {
    border: 0;
    border-radius: 3px;
    font-size: 12px;
    height: 30px;
    padding: 0 10px;
    width: 140px;
    margin-right: 5px;
}

body header .top-head .container-web .right input-internal-autofill-selected {
    -webkit-appearance: menulist-button;
    -moz-appearance: menulist-button;
    appearance: menulist-button;
    background-image: none !important;
    background-color: -internal-light-dark(rgb(232, 240, 254), rgba(70, 90, 126, 0.4)) !important;
    color: fieldtext !important;
}

body header .top-head .container-web .right .password {
    position: relative;
}

body header .top-head .container-web .right .password i {
    cursor: pointer;
    position: absolute;
    right: 10px;
    color: #c5c5c5;
    top: 50%;
    transform: translateY(-50%);
}

body header .top-head .container-web .right .password i.active::after {
    display: none;
}

body header .top-head .container-web .right .password i::after {
    content: "/";
    color: #c5c5c5;
    position: absolute;
    font-size: 28px;
    font-weight: bold;
    top: -6px;
    left: 5px;
}

body header .top-head .container-web .right a,
body header .top-head .container-web .right button {
    font-size: 13px;
    color: #fff;
}

body header .top-head .container-web .right a.forget-pass,
body header .top-head .container-web .right button.forget-pass {
    margin-right: 10px;
}

body header .top-head .container-web .right a.forget-pass:hover,
body header .top-head .container-web .right button.forget-pass:hover {
    text-decoration: underline;
}

body header .top-head .container-web .right a.btn-wrap,
body header .top-head .container-web .right button.btn-wrap {
    align-items: center;
    border: 2px solid #fff;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 30px;
    justify-content: center;
    margin-right: 5px;
    padding: 0 10px;
    text-align: center;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

body header .top-head .container-web .right a.btn-wrap.btn-login:hover,
body header .top-head .container-web .right button.btn-wrap.btn-login:hover {
    background-color: #fff;
    border-color: #fff !important;
    color: #2199ca;
}

body header .top-head .container-web .right a.btn-wrap.btn-register,
body header .top-head .container-web .right button.btn-wrap.btn-register {
    background: #33c85d;
    border-color: #33c85d;
}

body header .top-head .container-web .right a.btn-wrap.btn-register:hover,
body header .top-head .container-web .right button.btn-wrap.btn-register:hover {
    background-color: #42d163;
    border-color: #42d163;
    color: #fff;
}

body header .top-head .container-web .right a.logined-item,
body header .top-head .container-web .right button.logined-item {
    font-size: 15px;
    padding: 12px;
    text-decoration: none;
    position: relative;
}

body header .top-head .container-web .right a.logined-item span,
body header .top-head .container-web .right button.logined-item span {
    width: 15px;
    text-align: center;
    border-radius: 50%;
    padding: 4px 0px;
    line-height: 0.8;
    height: 15px;
    font-weight: bold;
    font-size: 10px;
    position: absolute;
    right: 0px;
    top: 4px;
    color: #fff;
    background-color: red;
}

body header .top-head .container-web .right a.logined-item:not(.special):hover,
body header .top-head .container-web .right button.logined-item:not(.special):hover {
    opacity: 0.5;
}

body header .top-head .container-web .right a.logined-item.special,
body header .top-head .container-web .right button.logined-item.special {
    font-size: 18px;
    padding: 5px;
}

body header .top-head .container-web .right a.logined-item i,
body header .top-head .container-web .right button.logined-item i {
    font-size: 15px;
    cursor: pointer;
}

body header .top-head .container-web .right button.btn-wrap.btn-login:hover {
    color: #fff;
}

body header .top-head .container-web .right .lang .lang-toggle {
    display: flex;
    width: 40px;
    align-items: center;
    justify-content: space-evenly;
}

body header .top-head .container-web .right .lang .lang-toggle img {
    width: 45%;
}

body header .top-head .container-web .right .lang .lang-toggle i {
    font-size: 11px;
    line-height: 2;
}

body header .bottom-head {
    height: 58px;
    /* background-color: #403e0b; */
    position: relative;
}

body header .bottom-head .container-web {
    display: flex;
    height: 100%;
    width: 75%;
    position: relative;
    align-items: center;
    /* justify-content: space-between; */
    justify-content: flex-end;
}

body header .bottom-head .container-web .logo {
    max-width: 130px;
    position: absolute;
    left: -90px;
    height: 100%;
}

body header .bottom-head .container-web .logo::after {
    /* content: ""; */
    display: block;
    position: absolute;
    left: 140px;
    top: 0;
    width: 190px;
    height: 100%;
    background: url(../img/world-cup.jpg) top left no-repeat;
    background-size: contain;
}

body header .bottom-head .container-web .main-menu {
    display: flex;
    font-size: 15px;
    list-style: none;
    height: 100%;
    align-items: center;
}

@media (max-width: 1600px) {
    body header .bottom-head .container-web .main-menu {
        font-size: 14px;
    }

    body header .bottom-head .container-web .main-menu .menu-item {
        padding: 21px 12px;
    }

    body header .bottom-head .container-web .logo img {
        width: 130px;
    }
}

body header .bottom-head .container-web .main-menu .menu-item {
    cursor: pointer;
    color: #fff;
    text-transform: uppercase;
    height: 100%;
    padding: 21px 16px;
    line-height: 1;
}

@media (max-width: 1600px) {
    body header .bottom-head .container-web .main-menu .menu-item {
        padding: 21px 12px;
    }
}

body header .bottom-head .container-web .main-menu .menu-item:hover {
    background: #fff;
    color: #1585cf;
}

body header .bottom-head .container-web .main-menu .menu-item:hover a {
    color: #1585cf;
}

body header .bottom-head .container-web .main-menu .menu-item:hover>.sub-menu {
    transform: scaleY(1);
    opacity: 1;
}

body header .bottom-head .container-web .main-menu .menu-item .nav-item {
    position: relative;
}

body header .bottom-head .container-web .main-menu .menu-item .nav-item i {
    margin-left: 3px;
}

body header .bottom-head .container-web .main-menu .menu-item .sub-menu {
    z-index: 20;
    background: url(/web/nato888/images/submenu-bg.jpg?1e6b6c3f767d1ff25bc3cebfc0d7356c) top/cover no-repeat;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
    transform: scaleY(0);
    transform-origin: top;
    left: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    text-align: center;
    top: 58px;
    transition: 0.3s;
    width: 100%;
}

body header .bottom-head .container-web .main-menu .menu-item .sub-menu ul {
    display: flex;
    justify-content: center;
    list-style: none;
    width: 80%;
    margin: 0px auto;
    flex-wrap: wrap;
}

body header .bottom-head .container-web .main-menu .menu-item .sub-menu ul li a {
    position: relative;
    padding: 30px 10px;
    display: block;
    width: 100%;
    height: 100%;
}

body header .bottom-head .container-web .main-menu .menu-item .sub-menu ul li a img {
    max-width: 165px;
}

body header .bottom-head .container-web .main-menu .menu-item .sub-menu ul li:hover {
    background-color: rgba(255, 255, 255, 0.15);
}

body header .bottom-head .container-web .main-menu .menu-item .sub-menu ul li:hover ::after {
    background-color: #403e0b;
    bottom: 0;
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    width: 100%;
}

body #body-web .marquee-block {
    position: relative;
    z-index: 8;
}

body #body-web .marquee-block .marquee-news {
    display: block;
    background-color: #8b8b8b;
    height: 35px;
    line-height: 35px;
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 1;
}

body #body-web .marquee-block .marquee-news .marquee-wrap {
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    height: 35px;
    line-height: 35px;
    margin: auto;
    position: relative;
    width: 100%;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
}

body #body-web .marquee-block .marquee-news .marquee-wrap .visible-area {
    height: 100%;
    margin-left: 110px;
    overflow: hidden;
    position: relative;
}

body #body-web .marquee-block .marquee-news .marquee-wrap .visible-area .marquee-content {
    position: absolute;
    white-space: nowrap;
    -webkit-animation: scrollLeft linear infinite;
    animation: scrollLeft linear infinite;
}

body #body-web .marquee-block .marquee-news .marquee-wrap .visible-area .marquee-content .marquee-item {
    margin-right: 0;
    font-size: 14px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8);
}

body #body-web .marquee-block .marquee-news .icon-title {
    position: absolute;
    top: 0;
    left: 80px;
}

body #body-web .marquee-block .marquee-news .icon-title i {
    color: #fff;
    font-size: 14px;
}

body #body-web .body-content {
    padding-top: 40px;
}

body #body-web .body-content .home-feature .home-title {
    color: #403e0b;
    font-size: 20px;
    font-weight: 700;
    margin: auto;
    padding: 23px 8px 20px;
    text-transform: capitalize;
}

body #body-web .body-content .home-feature .feature-lists ul {
    display: flex;
}

body #body-web .body-content .home-feature .feature-lists ul li {
    width: 25%;
    display: flex;
    height: 120px;
    border-right: 1px solid #cacaca;
}

body #body-web .body-content .home-feature .feature-lists ul li:last-child {
    border: none;
    width: 31%;
}

body #body-web .body-content .home-feature .feature-lists ul li img {
    flex: 1;
    margin: 0px 25px 55px 25px;
}

body #body-web .body-content .home-feature .feature-lists ul li .feature-content {
    margin-right: 15px;
}

@media (max-width: 1600px) {
    body #body-web .body-content .home-feature .feature-lists ul li .feature-content {
        font-size: 14px;
    }
}

body #body-web .body-content .home-feature .feature-lists ul li .feature-content h5 {
    color: #000;
    font-weight: 700;
    margin-bottom: 0.5rem;
    font-size: 17px;
}

body #body-web .body-content .home-feature .feature-lists ul li .feature-content p {
    text-rendering: optimizeLegibility;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 1rem;
}

body #body-web .body-content .home-types {
    background: url(/web/nato88/images/home_quick_bg.png?b2e4383dd5c8eac7e2c280f57e718fce) 50% / cover no-repeat;
    height: 490px;
}

body #body-web .body-content .home-types .container-web h2 {
    color: #403e0b;
    font-size: 20px;
    font-weight: 700;
    margin: auto;
    padding: 23px 8px 20px;
    text-transform: capitalize;
}

body #body-web .body-content .home-types .swiper-slide {
    width: 100%;
}

body #body-web .body-content .home-types .swiper-slide .box-main {
    height: 418px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    padding: 20px 25px;
    color: #fff;
}

body #body-web .body-content .home-types .swiper-slide .box-main .type-icon img {
    max-width: 46px;
    margin: 0px auto;
    margin-bottom: 15px;
}

body #body-web .body-content .home-types .swiper-slide .box-main .title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 10px;
    text-transform: uppercase;
}

body #body-web .body-content .home-types .swiper-slide .box-main .desc {
    font-size: 12px;
    line-height: 1.4;
}

body #body-web .body-content .home-types .swiper-slide .box-main a {
    background-color: #33c85f;
    bottom: 20px;
    color: #fff;
    font-size: 12px;
    left: 25px;
    line-height: 28px;
    position: absolute;
    text-decoration: none;
    width: calc(100% - 50px);
}

body #body-web .body-content .home-types .swiper-slide .box-main a:hover {
    background-color: #403e0b;
}

body #body-web .body-content .home-promo {
    padding-bottom: 40px;
}

body #body-web .body-content .home-promo .promo-list {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    width: 100%;
}

body #body-web .body-content .home-promo .promo-list .video-item {
    width: 25%;
}

body #body-web .body-content .home-promo .promo-list .video-item .video iframe {
    vertical-align: middle;
    width: 100%;
    height: 220px;
}

body #body-web .body-content .home-promo .promo-list .video-item .video-text {
    align-items: center;
    background: #403e0b;
    border-radius: 0 0 8px 8px;
    color: #fff;
    display: flex;
    font-size: 14px;
    line-height: 1.2;
    margin-top: 0px;
    min-height: 55px;
    padding: 10px 15px;
    width: 100%;
}

body #body-web .home-vip-affiliate .home-swiper-item {
    display: flex;
    justify-content: space-between;
    padding-bottom: 30px;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left {
    width: 49%;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-title {
    background-color: #d2b596;
    border-radius: 8px 8px 0 0;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 38px;
    text-align: center;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content {
    display: flex;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper3 {
    width: 60%;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper4 {
    width: 40%;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper4 .vip-box {
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 100%;
    background: #36a7f8;
    border-bottom: 1px solid #fff;
    color: #fff;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper4 .vip-box .vip-icon {
    max-width: 52px;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper4 .vip-box .vip-level {
    font-size: 20px;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper4 .vip-box .vip-right {
    font-size: 12px;
    text-align: right;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper4 .vip-box .vip-right div {
    padding: 4px 0;
}

body #body-web .home-vip-affiliate .home-swiper-item .home-swiper-left .swiper-box-content .mySwiper4 .content {
    background: #36a7f8;
    align-items: center;
    border-bottom: 1px solid #fff;
    color: #fff;
    display: flex;
    justify-content: center;
    height: 100%;
    text-transform: uppercase;
    font-weight: 700;
}

body footer {
    background: #403e0b url(/web/nato888/images/footer-bg.jpg?db3e296650d8bb1ff4598d5504edd0b5) no-repeat;
}

body footer .container-web {
    width: 66.666%;
}

body footer .container-web .payment-list {
    display: flex;
    justify-content: space-between;
    padding: 30px 0;
    border-bottom: 1px solid #fff;
}

body footer .container-web .payment-list .logo-list .logo-list-item h3 {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
}

body footer .container-web .payment-list .logo-list .logo-list-item .box {
    display: flex;
    margin-top: 13px;
    gap: 20px;
}

body footer .container-web .payment-list .logo-list .logo-list-item .box .aboveAgeResponsibility {
    background-position: -25px -198px;
    width: 34px;
    height: 34px;
    cursor: pointer;
}

body footer .container-web .payment-list .logo-list .logo-list-item .box .aboveAgeResponsibility:hover {
    background-position: -115px -198px;
}

body footer .container-web .payment-list .logo-list .logo-list-item .box .gameCareResponsibility {
    background-position: -25px -232px;
    width: 33px;
    height: 33px;
    cursor: pointer;
}

body footer .container-web .payment-list .logo-list .logo-list-item .box .gameCareResponsibility:hover {
    background-position: -115px -232px;
}

body footer .container-web .payment-list .logo-list .logo-list-item:last-child {
    margin-top: 30px;
}

body footer .container-web .payment-list .logo-list .logo-list-item:last-child .box {
    display: flex;
    margin-top: 13px;
    gap: 20px;
}

body footer .container-web .payment-list .logo-list .logo-list-item:last-child .firstCagayanLicenses {
    background-position: -25px -266px;
    width: 33px;
    height: 33px;
    cursor: pointer;
}

body footer .container-web .payment-list .logo-list .logo-list-item:last-child .firstCagayanLicenses:hover {
    background-position: -115px -266px;
}

body footer .container-web .payment-list .logo-list .logo-list-item:last-child .pagcorLicenses {
    background-position: -25px -301px;
    width: 33px;
    height: 33px;
    cursor: pointer;
}

body footer .container-web .payment-list .logo-list .logo-list-item:last-child .pagcorLicenses:hover {
    background-position: -115px -301px;
}

body footer .container-web .payment-list .logo-suporter {
    width: 80%;
}

body footer .container-web .payment-list .logo-suporter h3 {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px;
}

body footer .container-web .payment-list .logo-suporter .list-logo {
    display: flex;
    flex-wrap: wrap;
}

body footer .container-web .payment-list .logo-suporter .list-logo .img-logo {
    max-width: 80px;
}

body footer .container-web .footer-link-wrap {
    display: flex;
    justify-content: space-between;
    padding: 30px 0;
    border-bottom: 1px solid #fff;
}

body footer .container-web .footer-link-wrap .footer-links {
    width: 25%;
    display: flex;
    flex-direction: column;
}

body footer .container-web .footer-link-wrap .footer-links .item-link {
    font-size: 16px;
    margin: 5px 0;
}

body footer .container-web .footer-link-wrap .footer-links .item-link:hover {
    opacity: 0.5;
}

body footer .container-web .footer-link-wrap .footer-links h3 {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 5px;
}

body footer .container-web .footer-link-wrap .footer-links .sns-list a {
    margin-right: 10px;
}

body footer .container-web .footer-link-wrap .footer-links .sns-list a img {
    max-width: 40px;
}

body footer .container-web .copyright {
    color: #fff;
    font-size: 12px;
    line-height: 60px;
    margin: auto;
    max-width: 1200px;
    text-align: center;
}

body .popup-login {
    background-color: rgba(0, 0, 0, 0.7);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    align-items: center;
    display: flex;
    justify-content: center;
}

body .popup-login.active {
    display: none;
}

body .popup-login .login-container {
    width: 620px;
    padding-bottom: 5px;
    background-color: #e7e7e7;
    height: 550px !important;
    max-height: none;
    padding-right: 240px;
    position: relative;
    border-radius: 5px;
    box-shadow: 0 0 10px 0 rgba(15, 2, 20, 0.7);
    overflow: auto;
}

body .popup-login .login-container::after {
    background: url(/web/nato888/images/anhmoiluu-1.jpg) bottom/cover no-repeat;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 240px;
}

body .popup-login .login-container .head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    background-color: transparent;
    border-bottom: 1px solid #ccc;
    height: 50px;
    padding: 0 20px;
}

body .popup-login .login-container .head h2 {
    border-bottom: 2px solid #403e0b;
    color: #403e0b;
    font-size: 20px;
    font-weight: 700;
    position: relative;
    line-height: 50px;
    font-stretch: normal;
    font-style: normal;
}

body .popup-login .login-container .head i {
    z-index: 15;
    font-size: 22px;
    position: absolute;
    color: #fff;
    right: 15px;
    top: 10px;
    cursor: pointer;
}

body .popup-login .login-container .body {
    margin: 20px 40px;
    padding: 40px 0 20px;
}

body .popup-login .login-container .body form dd {
    position: relative;
    margin-bottom: 25px;
}

body .popup-login .login-container .body form dd span i {
    color: #777;
    cursor: pointer;
    font-size: 18px;
    position: absolute;
    right: 10px;
    top: 17%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

body .popup-login .login-container .body form dd span i.active {
    display: none;
}

body .popup-login .login-container .body form dd input {
    height: 50px;
    margin-right: 0;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box;
    display: block;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    padding-left: 10px;
    padding-right: 10px;
    background-color: rgba(255, 223, 223, 0.4);
    color: #403e0b;
    border-color: #403e0b;
    box-shadow: 0 0 3px #403e0b;
}

body .popup-login .login-container .body form dd input:valid {
    background-color: #fff;
    color: #000;
}

body .popup-login .login-container .body form dd small {
    max-width: 500px;
    min-width: 200px;
    line-height: 2.2;
    margin-top: 4px;
    color: #d22323;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    height: 36px;
    text-align: left;
    width: 100%;
}

body .popup-login .login-container .body form dd input[type="submit"] {
    width: 175px;
    margin: 0px auto;
    background: linear-gradient(90deg, #3bc1e9, #1d77bd 50%, #3bc1e9) 0/200%;
    border: 0;
    border-radius: 5px;
    font-size: 25px;
    font-weight: 700;
    height: auto;
    padding: 10px 25px;
    color: #fff;
    cursor: pointer;
}

body .popup-login .login-container .body form dd input[type="submit"]:hover {
    background: linear-gradient(90deg, #3bc1e9, #1d77bd 50%, #3bc1e9) 100%/200%;
}

body .popup-login .login-container .body .text-center {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

body .popup-login .login-container .body .text-center .register-now p span a {
    cursor: pointer;
    color: #403e0b;
}

body .popup-login .login-container .body .text-center .forget a {
    cursor: pointer;
    color: #403e0b;
    text-decoration: underline;
    font-size: 12px;
    margin: 5px;
}

body .popup-forgetPass {
    background-color: rgba(0, 0, 0, 0.7);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    align-items: center;
    display: flex;
    justify-content: center;
}

body .popup-forgetPass.active {
    display: none;
}

body .popup-forgetPass .forgetPass-container {
    width: 540px;
    padding-bottom: 5px;
    background-color: #fff;
    height: 464px !important;
    max-height: none;
    position: relative;
    border-radius: 5px;
    box-shadow: 0 0 10px 0 rgba(15, 2, 20, 0.7);
    overflow: hidden;
}

body .popup-forgetPass .forgetPass-container .head {
    display: flex;
    background-color: #403e0b;
    width: 100%;
    align-items: center;
    color: #fff;
    justify-content: space-between;
    padding: 0px 15px;
    height: 50px;
}

body .popup-forgetPass .forgetPass-container .head h2 {
    font-size: 16px;
    line-height: 1;
    margin: 0;
}

body .popup-forgetPass .forgetPass-container .head i {
    font-size: 22px;
    cursor: pointer;
}

body .popup-forgetPass .forgetPass-container .body {
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

body .popup-forgetPass .forgetPass-container .body .top-link {
    border: 1px solid #403e0b;
    border-radius: 8px;
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.25), inset 0 -5px 15px #fff;
}

body .popup-forgetPass .forgetPass-container .body .top-link a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

body .popup-forgetPass .forgetPass-container .body .top-link a:hover {
    background-color: #f7f7f7;
    border-radius: 8px;
    transition: background-color 0.3s linear;
}

body .popup-forgetPass .forgetPass-container .body .top-link a img {
    max-width: 50px;
}

body .popup-forgetPass .forgetPass-container .body .top-link a h2 {
    margin: 0;
    color: #403e0b;
    font-size: 14px;
    text-align: center;
    margin-top: 5px;
}

body .popup-forgetPass .forgetPass-container .body .bot-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}

body .popup-forgetPass .forgetPass-container .body .bot-content i {
    font-size: 75px;
    margin-bottom: 50px;
    color: #403e0b;
    -webkit-animation: zoomArrow 1s infinite;
    animation: zoomArrow 1s infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
}

body .popup-forgetPass .forgetPass-container .body .bot-content h3 {
    text-align: center;
    text-transform: uppercase;
    font-size: 24px;
    font-weight: 700;
}

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

    100% {
        transform: scale(1.25);
    }
}

@keyframes zoomArrow {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.25);
    }
}

.recommend-wrap[data-v-4c7406bb] {
    padding-top: 45px;
    position: relative;
}

.recommend-wrap .special-title[data-v-4c7406bb] {
    font-size: 34px;
    color: #5f77b5;
    font-weight: 700;
    font-family: Barlow Condensed, Microsoft YaHei, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 30px;
}

.recommend-wrap .special-title[data-v-4c7406bb]:before {
    content: "";
    width: 237px;
    height: 2px;
    border-radius: 1px;
    background-image: linear-gradient(-90deg, #5f77b5, rgba(95, 119, 181, 0));
    margin-right: 40px;
}

.recommend-wrap .special-title[data-v-4c7406bb]:after {
    content: "";
    width: 237px;
    height: 2px;
    border-radius: 1px;
    background-image: linear-gradient(90deg, #5f77b5, rgba(95, 119, 181, 0));
    margin-left: 40px;
}

.recommend-wrap .recomend-item[data-v-4c7406bb] {
    cursor: pointer;
}

.recommend-wrap .arrow[data-v-4c7406bb] {
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    opacity: 0.9;
    cursor: pointer;
}

.recommend-wrap .rec-prev[data-v-4c7406bb] {
    left: -50px;
    transform: translateY(-50%);
}

.recommend-wrap .rec-next[data-v-4c7406bb] {
    right: -50px;
    margin-top: -20px;
    transform: rotate(180deg);
}

.recommend-wrap .rec-next[data-v-4c7406bb],
.recommend-wrap .rec-prev[data-v-4c7406bb] {
    top: 50%;
    background-size: 8px 12px;
    background-position: 50%;
    background-color: #fff;
}

.recommend-wrap .rec-next[data-v-4c7406bb]:hover,
.recommend-wrap .rec-prev[data-v-4c7406bb]:hover {
    background-size: 8px 12px;
    background-position: 50%;
    background-color: #5d9fff;
}

.recommend-wrap .rec-next.swiper-button-disabled[data-v-4c7406bb],
.recommend-wrap .rec-prev.swiper-button-disabled[data-v-4c7406bb] {
    cursor: not-allowed;
}

.home-game[data-v-5e2cd1c6] {
    position: relative;
    width: 389px;
    height: 218px;
    border-radius: 12px;
    display: flex;
    cursor: pointer;
    overflow: hidden;
}

/* .home-game .SPORTS[data-v-5e2cd1c6] {
  background: url(/web/nato888/images/SPORTS.png?b4d4e8c595e89677c6056fc61201b2f4) no-repeat top;
  background-size: 100% 100%;
}

.home-game .PVP[data-v-5e2cd1c6] {
  background: url(/web/nato888/images/PVP.png?979107acddc25b80bc6d6309ffa91636) no-repeat top;
  background-size: 100% 100%;
}

.home-game .FISH[data-v-5e2cd1c6] {
  background: url(/web/nato888/images/FISH.png?878dce3cc3caf00a3ca5e43ee6b8ac07) no-repeat top;
  background-size: 100% 100%;
}

.home-game .LIVE[data-v-5e2cd1c6] {
  width: 255px;
  height: 384px;
  background: url(/web/nato888/images/LIVE.png?ff6d6ef33f313d168cf13bafba6e7c1b) no-repeat top;
  background-size: 100% 100%;
} */

.home-game .container[data-v-5e2cd1c6] {
    height: 100%;
    display: flex;
    align-items: center;
    border-radius: 12px 0 0 12px;
    border-right: 1px solid #e4f1fa;
}

.home-game .container .SPORTS[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #ff6c50 55%, #fa7);
}

.home-game .container .PVP[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #fcb020 55%, #ffdb80);
}

.home-game .container .FISH[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #358df9 55%, #6fd2ff);
}

.home-game .container .LIVE[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #8565ff 60%, #b590fe);
}

.home-game .items_box[data-v-5e2cd1c6] {
    width: 92px;
    border-radius: 12px 0 0 12px;
    position: relative;
}

.home-game .items_box .PVP li .ball-item[data-v-5e2cd1c6] {
    color: #c36e00;
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(188, 123, 3, 0.5);
}

.home-game .items_box .PVP li .ball-item[data-v-5e2cd1c6]:hover {
    background-image: linear-gradient(0deg,
            #aecfff,
            rgba(171, 205, 255, 0.75) 16%,
            rgba(167, 203, 255, 0.5) 33%,
            rgba(171, 206, 255, 0.75) 66%,
            #afd0ff),
        linear-gradient(#005eba, #005eba);
}

.home-game .items_box .FISH li .ball-item[data-v-5e2cd1c6] {
    color: #1167d0;
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(17, 96, 195, 0.5);
}

.home-game .items_box .SPORTS li .ball-item[data-v-5e2cd1c6] {
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(214, 49, 18, 0.5);
}

.home-game .items_box .LIVE li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.5s infinite;
    animation: floating 2.5s ease-in-out 0.5s infinite;
    margin-left: 8px;
}

.home-game .items_box .LIVE li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 0.2s infinite;
    animation: floating 2.5s ease-in-out 0.2s infinite;
    margin-left: 26px;
    margin-top: 8px;
    margin-bottom: 8px;
}

.home-game .items_box .LIVE li[data-v-5e2cd1c6]:nth-child(3) {
    -webkit-animation: floating 2.5s ease-in-out 0.9s infinite;
    animation: floating 2.5s ease-in-out 0.9s infinite;
    margin-left: 6px;
}

.home-game .items_box .LIVE li[data-v-5e2cd1c6]:nth-child(4) {
    -webkit-animation: floating 2.5s ease-in-out 1s infinite;
    animation: floating 2.5s ease-in-out 1s infinite;
    margin-left: 25px;
    margin-top: 8px;
    margin-bottom: 8px;
}

.home-game .items_box .LIVE li[data-v-5e2cd1c6]:nth-child(5) {
    -webkit-animation: floating 2.5s ease-in-out 0.8s infinite;
    animation: floating 2.5s ease-in-out 0.8s infinite;
    margin-left: 9px;
}

.home-game .items_box .LIVE li .ball-item[data-v-5e2cd1c6] {
    color: #5c46b0;
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(80, 48, 201, 0.5);
}

.home-game .items_box .LIVE li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 62px;
    height: 62px;
}

.home-game .items_box .LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 56px;
    height: 56px;
}

.home-game .items_box .LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(3) {
    width: 68px;
    height: 68px;
}

.home-game .items_box .LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(4) {
    width: 54px;
    height: 54px;
}

.home-game .items_box .LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(5) {
    width: 58px;
    height: 58px;
}

.home-game .items_box li[data-v-5e2cd1c6] {
    color: #da4326;
}

.home-game .items_box li .ball-item[data-v-5e2cd1c6] {
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-direction: column;
    font-size: 21px;
    font-family: Be Vietnam, Microsoft YaHei, sans-serif;
    font-weight: 700;
}

.home-game .items_box li .ball-item[data-v-5e2cd1c6]:hover {
    transform: scale(1.1);
}

.home-game .items_box li .ball-item p[data-v-5e2cd1c6] {
    height: 26px;
    text-align: center;
    line-height: 24px;
}

.home-game .items_box li .forward[data-v-5e2cd1c6] {
    height: 12px;
    width: 16px;
    display: none;
}

.home-game .items_box li .forward img[data-v-5e2cd1c6] {
    display: block;
    height: 100%;
    width: 100%;
}

.home-game .items_box li :hover .ball-item[data-v-5e2cd1c6] {
    color: #fff;
    background-image: linear-gradient(0deg,
            #aecfff,
            rgba(171, 205, 255, 0.75) 16%,
            rgba(167, 203, 255, 0.5) 33%,
            rgba(171, 206, 255, 0.75) 66%,
            #afd0ff),
        linear-gradient(#005eba, #005eba);
}

.home-game .items_box li :hover .ball-item .forward[data-v-5e2cd1c6] {
    display: block;
}

.home-game .type_name[data-v-5e2cd1c6] {
    flex: 1;
    position: relative;
}

.home-game .type_name :hover .choose[data-v-5e2cd1c6] {
    display: flex !important;
}

.home-game .type_name .desc[data-v-5e2cd1c6] {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
}

.home-game .type_name .desc .SPORTS .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(214, 49, 18, 0.5);
}

.home-game .type_name .desc .PVP .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(188, 123, 3, 0.5);
}

.home-game .type_name .desc .FISH .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(17, 96, 195, 0.5);
}

.home-game .type_name .desc .LIVE .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(80, 48, 201, 0.5);
}

.home-game .type_name .desc p[data-v-5e2cd1c6] {
    white-space: nowrap;
    font-size: 32px;
    text-align: center;
    font-family: Be Vietnam, Microsoft YaHei, sans-serif;
    font-weight: 800;
    font-style: italic;
}

.home-game .type_name .desc .choose[data-v-5e2cd1c6] {
    display: none;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    font-size: 25px;
}

.home-game .type_name .desc .choose .icon[data-v-5e2cd1c6] {
    width: 26px;
    height: 26px;
    margin-right: 10px;
    margin-top: 4px;
    border-radius: 50%;
    background: url(/web/nato888/images/aggle-left.png?52a7f1672b4d67b3fd60213007063226) no-repeat;
    background-size: 100% 100%;
}

.home-game .LIVE .type_name .desc[data-v-5e2cd1c6] {
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
}

.home-game .LIVE .type_name .desc p[data-v-5e2cd1c6] {
    text-align: center;
    line-height: 36px;
    white-space: normal;
}

.home-game .LIVE .type_name .desc .choose[data-v-5e2cd1c6] {
    width: 160px;
}

.home-game .LIVE .type_name .desc .choose .icon[data-v-5e2cd1c6] {
    margin-right: 0;
}

.home-game .items_box.length4.FISH[data-v-5e2cd1c6],
.home-game .items_box.length4.PVP[data-v-5e2cd1c6],
.home-game .items_box.length4.SPORTS[data-v-5e2cd1c6] {
    width: 142px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-left: 8px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 1s infinite;
    animation: floating 2.5s ease-in-out 1s infinite;
    margin-left: 72px;
    margin-top: -22px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:nth-child(3) {
    -webkit-animation: floating 2.5s ease-in-out 0.3s infinite;
    animation: floating 2.5s ease-in-out 0.3s infinite;
    margin-top: -22px;
    margin-left: 6px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:nth-child(4) {
    -webkit-animation: floating 2.5s ease-in-out 0.8s infinite;
    animation: floating 2.5s ease-in-out 0.8s infinite;
    margin-left: 68px;
    margin-top: -20px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 68px;
    height: 67px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 61px;
    height: 60px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(3) {
    width: 68px;
    height: 67px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(4) {
    width: 67px;
    height: 66px;
}

.home-game .items_box.length3.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.5s infinite;
    animation: floating 2.5s ease-in-out 0.5s infinite;
    margin-left: 10px;
}

.home-game .items_box.length3.FISH li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.PVP li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.SPORTS li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-left: 26px;
    margin-top: 7px;
    margin-bottom: 7px;
}

.home-game .items_box.length3.FISH li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.PVP li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.SPORTS li[data-v-5e2cd1c6]:nth-child(3) {
    -webkit-animation: floating 2.5s ease-in-out 0.2s infinite;
    animation: floating 2.5s ease-in-out 0.2s infinite;
    margin-left: 8px;
}

.home-game .items_box.length3.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 60px;
    height: 60px;
}

.home-game .items_box.length3.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 54px;
    height: 54px;
}

.home-game .items_box.length3.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(3) {
    width: 62px;
    height: 62px;
}

.home-game .items_box.length2.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.5s infinite;
    animation: floating 2.5s ease-in-out 0.5s infinite;
    margin-left: 10px;
}

.home-game .items_box.length2.FISH li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.PVP li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.SPORTS li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-top: 20px;
    margin-left: 12px;
}

.home-game .items_box.length2.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 70px;
    height: 70px;
}

.home-game .items_box.length2.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 64px;
    height: 64px;
}

.home-game .items_box.length1.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-left: 9px;
}

.home-game .items_box.length1.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 72px;
    height: 72px;
}

.home-game .type_name .desc.SPORTS .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.SPORTS p[data-v-5e2cd1c6] {
    text-shadow: rgba(214, 49, 18, 0.5) 2px 0 10px;
}

.home-game .type_name .desc.PVP .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.PVP p[data-v-5e2cd1c6] {
    text-shadow: rgba(188, 123, 3, 0.5) 2px 0 10px;
}

.home-game .type_name .desc.FISH .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.FISH p[data-v-5e2cd1c6] {
    text-shadow: rgba(17, 96, 195, 0.5) 2px 0 10px;
}

.home-game .type_name .desc.LIVE .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.LIVE p[data-v-5e2cd1c6] {
    text-shadow: rgba(80, 48, 201, 0.5) 2px 0 10px;
}

.slots_contaniner {
    height: 384px;
    display: flex;
    border-radius: 12px;
    overflow: hidden;
}

.slots_contaniner .rng_menu {
    width: 130px;
    margin-right: 2px;
}

.slots_contaniner .rng_menu li {
    width: 130px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background-color: #fcfcff;
    opacity: 0.9;
    margin-bottom: 2px;
    position: relative;
}

.slots_contaniner .rng_menu li .active {
    background-color: #5d9fff;
}

.slots_contaniner .rng_menu li .active :after {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-left-color: #5d9fff;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
}

.slots_contaniner .rng_menu li :hover {
    background-color: #5d9fff;
}

.slots_contaniner .rng_menu li img {
    max-width: 120px;
    max-height: 58px;
}

.slots_contaniner .rng_menu .more {
    background-color: #fcfcff;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.slots_contaniner .rng_menu .more p {
    color: #5d9fff;
    font-size: 14px;
}

.slots_contaniner .lists {
    width: 798px;
    background-color: #fcfcff;
    display: flex;
    padding: 28px 10px;
    flex-wrap: wrap;
}

.slots_contaniner .lists li {
    width: 155px;
    height: 158px;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    position: relative;
}

.slots_contaniner .lists li :hover .btns {
    display: flex;
}

.slots_contaniner .lists li .item_box {
    width: 128px;
}

.slots_contaniner .lists li .item_box img {
    width: 100%;
    height: 128px;
    border-radius: 10px;
}

.slots_contaniner .lists li .item_box .name {
    max-width: 100%;
    font-size: 15px;
    color: #414141;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    margin-top: 5px;
}

.slots_contaniner .lists li .btns {
    display: none;
    position: absolute;
    width: 128px;
    height: 128px;
    top: 0;
    left: 13.5px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.6);
}

.slots_contaniner .lists li .btns span {
    border-radius: 18px;
    display: block;
    text-align: center;
    font-size: 12px;
    width: 100px;
    height: 34px;
    line-height: 34px;
    color: #fff;
}

.slots_contaniner .lists li .btns span .palynow {
    background-color: #5aa0fe;
    -webkit-animation: fadeInDown 0.3s ease-in;
    animation: fadeInDown 0.3s ease-in;
}

.slots_contaniner .lists li .btns span .freeplay {
    -webkit-animation: fadeInUp 0.3s ease-in;
    animation: fadeInUp 0.3s ease-in;
    background: hsla(0deg, 0%, 100%, 0.3);
    margin-top: 10px;
    border: 1px solid #e2e5ec;
}

.home-games[data-v-44f03a1d] {
    margin: 25px auto 35px;
}

.home-games[data-v-44f03a1d],
.slots_live[data-v-44f03a1d] {
    display: flex;
    justify-content: space-between;
}

.width_1200 {
    margin: 0 auto;
    width: 1200px;
}

.home-content {
    padding: 30px 0 70px;
    background-size: cover !important;
}

slots_contaniner {
    height: 384px;
    display: flex;
    border-radius: 12px;
    overflow: hidden;
}

slots_contaniner .rng_menu {
    width: 130px;
    margin-right: 2px;
}

slots_contaniner .rng_menu li {
    width: 130px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background-color: #fcfcff;
    opacity: 0.9;
    margin-bottom: 2px;
    position: relative;
}

slots_contaniner .rng_menu li.active {
    background-color: #5d9fff;
}

slots_contaniner .rng_menu li.active:after {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-left-color: #5d9fff;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
}

slots_contaniner .rng_menu li:hover {
    background-color: #5d9fff;
}

slots_contaniner .rng_menu li img {
    max-width: 120px;
    max-height: 58px;
}

slots_contaniner .rng_menu .more {
    background-color: #fcfcff;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

slots_contaniner .rng_menu .more p {
    color: #5d9fff;
    font-size: 14px;
}

slots_contaniner .lists {
    width: 798px;
    background-color: #fcfcff;
    display: flex;
    padding: 28px 10px;
    flex-wrap: wrap;
}

slots_contaniner .lists li {
    width: 155px;
    height: 158px;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    position: relative;
}

slots_contaniner .lists li:hover .btns {
    display: flex;
}

slots_contaniner .lists li .item_box {
    width: 128px;
}

slots_contaniner .lists li .item_box img {
    width: 100%;
    height: 128px;
    border-radius: 10px;
}

slots_contaniner .lists li .item_box .name {
    max-width: 100%;
    font-size: 15px;
    color: #414141;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    margin-top: 5px;
}

slots_contaniner .lists li .btns {
    display: none;
    position: absolute;
    width: 128px;
    height: 128px;
    top: 0;
    left: 13.5px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.6);
}

slots_contaniner .lists li .btns span {
    border-radius: 18px;
    display: block;
    text-align: center;
    font-size: 12px;
    width: 100px;
    height: 34px;
    line-height: 34px;
    color: #fff;
}

slots_contaniner .lists li .btns span.palynow {
    background-color: #5aa0fe;
    -webkit-animation: fadeInDown 0.3s ease-in;
    animation: fadeInDown 0.3s ease-in;
}

slots_contaniner .lists li .btns span.freeplay {
    -webkit-animation: fadeInUp 0.3s ease-in;
    animation: fadeInUp 0.3s ease-in;
    background: hsla(0deg, 0%, 100%, 0.3);
    margin-top: 10px;
    border: 1px solid #e2e5ec;
}

.home-games[data-v-44f03a1d] {
    margin: 25px auto 35px;
}

.home-games[data-v-44f03a1d],
.slots_live[data-v-44f03a1d] {
    display: flex;
    justify-content: space-between;
}

.home-game .container.LIVE[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #8565ff 60%, #b590fe);
}

.home-game .container[data-v-5e2cd1c6] {
    height: 100%;
    display: flex;
    align-items: center;
    border-radius: 12px 0 0 12px;
    border-right: 1px solid #e4f1fa;
}

.game-banner-cambo,
.game-banner-cambo .one_banner,
.game-banner-cambo .swiper-container,
.game-banner-cambo .swiper-slide {
    height: 100%;
    width: 100%;
}

.game-banner-cambo .one_banner img,
.game-banner-cambo .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
}

.game-banner-cambo .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    display: inline-block;
    border-radius: 100%;
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(#e4e4e4, #e4e4e4);
}

.game-banner-cambo .swiper-pagination-bullet-active {
    opacity: 1;
    background-image: linear-gradient(#fff, #fff), linear-gradient(#e4e4e4, #e4e4e4);
}

.game-banner-cambo .swiper-container-horizontal>.swiper-pagination-bullets,
.game-banner-cambo .swiper-pagination-custom,
.game-banner-cambo .swiper-pagination-fraction {
    bottom: 10%;
    width: auto;
    padding: 0 5px;
    left: 50%;
    height: 19px;
    display: flex;
    align-items: center;
    transform: translate(-50%);
    border-radius: 10px;
}

.br_carousel_main[data-v-7436cc99] {
    margin: 0 auto;
    width: 100%;
}

.br_index_modal[data-v-614642e3] {
    display: none;
    z-index: 2500;
    -webkit-user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    user-select: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.br_index_modal.active[data-v-614642e3] {
    display: block;
}

.br_imodal_main[data-v-614642e3] {
    position: relative;
    width: 100%;
    height: 100%;
}

.br_imodal_mbg[data-v-614642e3] {
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.br_imodal_content[data-v-614642e3] {
    width: 878px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -439px;
    margin-top: -262px;
    background-color: #fff;
    border-radius: 12px;
    overflow: hidden;
}

.br_imodal_content .ad_head_bg[data-v-614642e3] {
    height: 49px;
    background-image: linear-gradient(0deg, #e9f2fe, #b0d0ff), linear-gradient(#fff, #fff);
}

.br_imodal_cmain[data-v-614642e3] {
    width: 100%;
    height: 438px;
    position: relative;
    display: flex;
    padding-top: 18px;
}

.br_imodal_cmain .ad_left_titles[data-v-614642e3] {
    position: relative;
    padding: 5px 5px 0 10px;
    width: 222px;
    height: 420px;
    background-image: linear-gradient(#e6f1fa, #e6f1fa), linear-gradient(#0b7d8a, #0b7d8a);
    border-radius: 0 12px 0 12px;
}

.br_imodal_cmain .ad_left_titles .lists[data-v-614642e3] {
    padding-right: 10px;
    height: 350px;
    overflow-y: auto;
}

.br_imodal_cmain .ad_left_titles .lists[data-v-614642e3]::-webkit-scrollbar {
    width: 4px;
}

.br_imodal_cmain .ad_left_titles .lists[data-v-614642e3]::-webkit-scrollbar-thumb {
    border-radius: 5px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #b5d2fc;
}

.br_imodal_cmain .ad_left_titles .lists[data-v-614642e3]::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #fff;
    border-radius: 5px;
    background: #fdf3f3;
}

.br_imodal_cmain .ad_left_titles .br_imodal_cmtitle[data-v-614642e3] {
    width: 100%;
    line-height: 38px;
    color: #999cb9;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    font-size: 14px;
    cursor: pointer;
}

.br_imodal_cmain .ad_left_titles .br_imodal_cmtitle svg[data-v-614642e3] {
    width: 18px;
    height: 18px;
    fill: #999cb9;
    margin-right: 8px;
}

.br_imodal_cmain .ad_left_titles .br_imodal_cmtitle.active[data-v-614642e3],
.br_imodal_cmain .ad_left_titles .br_imodal_cmtitle[data-v-614642e3]:hover {
    color: #5d9fff;
}

.br_imodal_cmain .ad_left_titles .br_imodal_cmtitle.active svg[data-v-614642e3],
.br_imodal_cmain .ad_left_titles .br_imodal_cmtitle:hover svg[data-v-614642e3] {
    fill: #5d9fff;
}

.br_imodal_cmclose[data-v-614642e3] {
    width: 31px;
    height: 31px;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 10px;
    border-radius: 50%;
    background-image: linear-gradient(#a2b4ce, #a2b4ce), linear-gradient(#8b97b8, #8b97b8);
    display: flex;
    align-items: center;
    justify-content: center;
}

.br_imodal_cmclose img[data-v-614642e3] {
    display: block;
    width: 17px;
    height: 17px;
}

.content_wrap[data-v-614642e3] {
    width: 625px;
    margin: 0 0 0 18px;
}

.content_wrap .br_imodal_cmbody[data-v-614642e3] {
    padding: 10px;
    height: 350px;
    overflow: auto;
    width: 100%;
    color: #666;
    background-image: linear-gradient(#f0f1f2, #f0f1f2), linear-gradient(#ececec, #ececec);
    border-radius: 12px;
}

.content_wrap .br_imodal_cmbody[data-v-614642e3] img {
    max-width: 100%;
}

.content_wrap .notice_footer[data-v-614642e3] {
    height: 68px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0 18px;
}

.content_wrap .notice_footer button[data-v-614642e3] {
    width: 96px;
    height: 30px;
    border-radius: 15px;
    color: #fff;
    cursor: pointer;
}

.content_wrap .notice_footer .btn_promo[data-v-614642e3] {
    background-image: linear-gradient(0deg, #5d9fff, #71abff);
}

.content_wrap .notice_footer .btn_know[data-v-614642e3] {
    margin-left: 20px;
    background-image: linear-gradient(0deg, #abadc8, #c9cbdf);
}

[data-v-614642e3] .max_public_pagination,
[data-v-614642e3] .public_pagination {
    display: flex;
    height: 26px;
    align-items: center;
    position: absolute;
    bottom: 15px;
    left: 50%;
    max-width: 100%;
    transform: translateX(-50%);
}

[data-v-614642e3] .max_public_pagination a,
[data-v-614642e3] .public_pagination a {
    display: block;
    width: 24px;
    overflow: hidden;
    font-size: 14px;
    color: #dbd9d9;
    text-align: center;
    line-height: 26px;
    font-weight: 600;
    text-decoration: none;
    outline: none;
    background-color: rgba(0, 0, 0, 0.1);
}

[data-v-614642e3] .max_public_pagination .public_page_next a,
[data-v-614642e3] .max_public_pagination .public_page_prev a,
[data-v-614642e3] .public_pagination .public_page_next a,
[data-v-614642e3] .public_pagination .public_page_prev a {
    display: block;
    width: 28px;
    height: 26px;
}

[data-v-614642e3] .max_public_pagination .public_page_prev a,
[data-v-614642e3] .public_pagination .public_page_prev a {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    background-size: 8px 12px;
    background-position: 50%;
    background-color: rgba(0, 0, 0, 0.25);
}

[data-v-614642e3] .max_public_pagination .public_page_prev.disabled a,
[data-v-614642e3] .public_pagination .public_page_prev.disabled a {
    background-size: 8px 12px;
    background-position: 50%;
    background-color: rgba(0, 0, 0, 0.14);
}

[data-v-614642e3] .max_public_pagination .public_page_next a,
[data-v-614642e3] .public_pagination .public_page_next a {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    background-size: 8px 12px;
    background-position: 50%;
    background-color: rgba(0, 0, 0, 0.25);
}

[data-v-614642e3] .max_public_pagination .public_page_next.disabled a,
[data-v-614642e3] .public_pagination .public_page_next.disabled a {
    background-size: 8px 12px;
    background-position: 50%;
    background-color: rgba(0, 0, 0, 0.14);
}

[data-v-614642e3] .max_public_pagination .disabled a,
[data-v-614642e3] .public_pagination .disabled a {
    color: #cfcccc;
}

[data-v-614642e3] .max_public_pagination .max_public_pagination.active a,
[data-v-614642e3] .max_public_pagination .public_page-item.active a,
[data-v-614642e3] .public_pagination .max_public_pagination.active a,
[data-v-614642e3] .public_pagination .public_page-item.active a {
    color: #fff;
    background-color: #21c1cc;
}

[data-v-614642e3] .max_public_pagination a {
    width: 30px !important;
    line-height: 28px;
}

[data-v-614642e3] .max_public_pagination .public_page_next a,
[data-v-614642e3] .max_public_pagination .public_page_prev a {
    display: block;
    width: 32px !important;
    height: 28px !important;
}

.index_notice[data-v-dafa49f0] {
    width: 100%;
}

.index_notice .notice_main[data-v-dafa49f0] {
    display: flex;
    align-items: center;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
}

.index_notice .notice_main .notice-icon[data-v-dafa49f0] {
    width: 18px;
    height: 20px;
    display: inline-block;
    margin-right: 10px;
}

.seamless-warp2[data-v-dafa49f0] {
    flex: 1;
    overflow: hidden;
    height: 100%;
}

.seamless-warp2 .notice_list[data-v-dafa49f0] {
    display: flex;
    height: 100%;
    min-width: 1150px;
}

.seamless-warp2 .notice_list li[data-v-dafa49f0] {
    margin-right: 40px;
    font-size: 14px;
    cursor: pointer;
    display: inline-block;
    white-space: nowrap;
}

.popular_container[data-v-6e365a76] {
    width: 100%;
    position: relative;
}

.popular_container .popular-list .popular_list_item[data-v-6e365a76] {
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
}

.popular_container .popular-list .popular_list_item:hover .game_top[data-v-6e365a76] {
    background-color: #6ba6fb !important;
}

.popular_container .popular-list .popular_list_item:hover .game_bott[data-v-6e365a76] {
    background-color: #6ba6fb;
}

.popular_container .popular-list .popular_list_item:hover .game_bott>p[data-v-6e365a76] {
    color: #fff;
}

.popular_container .popular-list .popular_list_item:hover .game_bott .num_box li[data-v-6e365a76] {
    background-color: #fff !important;
    color: #5d9fff !important;
}

.popular_container .popular-list .popular_list_item .lott_item.on .game_bott .num_box li[data-v-6e365a76] {
    background-color: #ff7270;
    color: #fff;
}

.popular_container .popular-list .popular_list_item .game_top[data-v-6e365a76] {
    padding: 0 10px;
    background-color: #fff;
    opacity: 0.9;
    display: flex;
    height: 77px;
    align-items: center;
    position: relative;
}

.popular_container .popular-list .popular_list_item .game_top .icon[data-v-6e365a76] {
    width: 50px;
    height: 50px;
}

.popular_container .popular-list .popular_list_item .game_top .icon img[data-v-6e365a76] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    box-shadow: 0 3px 10px 0 rgba(61, 151, 249, 0.35);
}

.popular_container .popular-list .popular_list_item .game_top .name_box[data-v-6e365a76] {
    margin-left: 10px;
}

.popular_container .popular-list .popular_list_item .game_top .name_box[data-v-6e365a76] .lott-count-down {
    width: 121px;
    font-size: 15px;
    color: #8d8faf;
}

.popular_container .popular-list .popular_list_item .game_top .name_box .lott_remark[data-v-6e365a76] {
    color: #747f95;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 3px;
    max-width: 148px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.popular_container .popular-list .popular_list_item .game_top .hot[data-v-6e365a76] {
    position: absolute;
    left: 4px;
    top: 4px;
}

.popular_container .popular-list .popular_list_item .game_top .hot img[data-v-6e365a76] {
    width: 25px;
    height: 28px;
}

.popular_container .popular-list .popular_list_item .game_bott[data-v-6e365a76] {
    padding: 5px 10px;
    background-color: #fff;
    opacity: 0.9;
    height: 70px;
    margin-top: 2px;
    display: flex;
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
}

.popular_container .popular-list .popular_list_item .game_bott>p[data-v-6e365a76] {
    color: #8d8faf;
    font-size: 15px;
    margin-bottom: 8px;
    height: 20px;
}

.popular_container .popular-list .popular_list_item .game_bott .num_box[data-v-6e365a76] {
    display: flex;
    align-items: center;
    max-width: 100%;
}

.popular_container .popular-list .popular_list_item .game_bott .num_box li[data-v-6e365a76] {
    min-width: 26px;
    height: 26px;
    line-height: 25px;
    background-color: #5f77b5;
    border-radius: 13px;
    color: #fff;
    font-weight: 700;
    text-align: center;
    margin-right: 8px;
}

.popular_container .popular-list .popular_list_item .game_bott .num_box li[data-v-6e365a76]:last-child {
    margin-right: 0;
}

.popular_container .arrow[data-v-6e365a76] {
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    opacity: 0.9;
    cursor: pointer;
}

.popular_container .popuplar-prev[data-v-6e365a76] {
    left: -50px;
    transform: translateY(-50%);
}

.popular_container .popuplar-next[data-v-6e365a76] {
    right: -50px;
    margin-top: -20px;
    transform: rotate(180deg);
}

.popular_container .popular-list .popular_list_item:hover .game_top .name_box .lott_remark[data-v-6e365a76],
.popular_container .popular-list .popular_list_item:hover .game_top .name_box[data-v-6e365a76] .lott-count-down {
    color: #fff !important;
}

.popular_container .popular-list .popular_list_item .lott_item.on .name_box .lott_remark[data-v-6e365a76],
.popular_container .popular-list .popular_list_item .lott_item.on .name_box[data-v-6e365a76] .lott-count-down {
    color: #ff7270;
    font-weight: 700;
}

.popular_container .popuplar-next[data-v-6e365a76],
.popular_container .popuplar-prev[data-v-6e365a76] {
    top: 50%;
    background-size: 8px 12px;
    background-position: 50%;
    background-color: #fff;
}

.popular_container .popuplar-next[data-v-6e365a76]:hover,
.popular_container .popuplar-prev[data-v-6e365a76]:hover {
    background-size: 8px 12px;
    background-position: 50%;
    background-color: #5d9fff;
}

.popular_container .popuplar-next.swiper-button-disabled[data-v-6e365a76],
.popular_container .popuplar-prev.swiper-button-disabled[data-v-6e365a76] {
    cursor: not-allowed;
}

.recommend-wrap[data-v-4c7406bb] {
    padding-top: 45px;
    position: relative;
}

.recommend-wrap .special-title[data-v-4c7406bb] {
    font-size: 34px;
    color: #5f77b5;
    font-weight: 700;
    font-family: Barlow Condensed, Microsoft YaHei, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 30px;
}

.recommend-wrap .special-title[data-v-4c7406bb]:before {
    content: "";
    width: 237px;
    height: 2px;
    border-radius: 1px;
    background-image: linear-gradient(-90deg, #5f77b5, rgba(95, 119, 181, 0));
    margin-right: 40px;
}

.recommend-wrap .special-title[data-v-4c7406bb]:after {
    content: "";
    width: 237px;
    height: 2px;
    border-radius: 1px;
    background-image: linear-gradient(90deg, #5f77b5, rgba(95, 119, 181, 0));
    margin-left: 40px;
}

.recommend-wrap .recomend-item[data-v-4c7406bb] {
    cursor: pointer;
}

.recommend-wrap .arrow[data-v-4c7406bb] {
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    opacity: 0.9;
    cursor: pointer;
}

.recommend-wrap .rec-prev[data-v-4c7406bb] {
    left: -50px;
    transform: translateY(-50%);
}

.recommend-wrap .rec-next[data-v-4c7406bb] {
    right: -50px;
    margin-top: -20px;
    transform: rotate(180deg);
}

.recommend-wrap .rec-next[data-v-4c7406bb],
.recommend-wrap .rec-prev[data-v-4c7406bb] {
    top: 50%;
    background-size: 8px 12px;
    background-position: 50%;
    background-color: #fff;
}

.recommend-wrap .rec-next[data-v-4c7406bb]:hover,
.recommend-wrap .rec-prev[data-v-4c7406bb]:hover {
    background-size: 8px 12px;
    background-position: 50%;
    background-color: #5d9fff;
}

.recommend-wrap .rec-next.swiper-button-disabled[data-v-4c7406bb],
.recommend-wrap .rec-prev.swiper-button-disabled[data-v-4c7406bb] {
    cursor: not-allowed;
}

.home-game[data-v-5e2cd1c6] {
    position: relative;
    width: 389px;
    height: 218px;
    border-radius: 12px;
    display: flex;
    cursor: pointer;
    overflow: hidden;
}

.home-game.SPORTS[data-v-5e2cd1c6] {
    background: url(/web/nato888/images/SPORTS.png?b4d4e8c595e89677c6056fc61201b2f4) no-repeat top;
    background-size: 100% 100%;
}

.home-game.PVP[data-v-5e2cd1c6] {
    background: url(/web/nato888/images/PVP.png?979107acddc25b80bc6d6309ffa91636) no-repeat top;
    background-size: 100% 100%;
}

.home-game.FISH[data-v-5e2cd1c6] {
    background: url(/web/nato888/images/FISH.png?878dce3cc3caf00a3ca5e43ee6b8ac07) no-repeat top;
    background-size: 100% 100%;
}

.home-game.LIVE[data-v-5e2cd1c6] {
    width: 255px;
    height: 384px;
    background: url(/web/nato888/images/LIVE.png?ff6d6ef33f313d168cf13bafba6e7c1b) no-repeat top;
    background-size: 100% 100%;
}

.home-game .container[data-v-5e2cd1c6] {
    height: 100%;
    display: flex;
    align-items: center;
    border-radius: 12px 0 0 12px;
    border-right: 1px solid #e4f1fa;
}

.home-game .container.SPORTS[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #ff6c50 55%, #fa7);
}

.home-game .container.PVP[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #fcb020 55%, #ffdb80);
}

.home-game .container.FISH[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #358df9 55%, #6fd2ff);
}

.home-game .container.LIVE[data-v-5e2cd1c6] {
    background-image: linear-gradient(hsla(0deg, 0%, 100%, 0.2), hsla(0deg, 0%, 100%, 0.2)),
        linear-gradient(0deg, #8565ff 60%, #b590fe);
}

.home-game .items_box[data-v-5e2cd1c6] {
    width: 92px;
    border-radius: 12px 0 0 12px;
    position: relative;
}

.home-game .items_box.PVP li .ball-item[data-v-5e2cd1c6] {
    color: #c36e00;
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(188, 123, 3, 0.5);
}

.home-game .items_box.PVP li .ball-item[data-v-5e2cd1c6]:hover {
    background-image: linear-gradient(0deg,
            #aecfff,
            rgba(171, 205, 255, 0.75) 16%,
            rgba(167, 203, 255, 0.5) 33%,
            rgba(171, 206, 255, 0.75) 66%,
            #afd0ff),
        linear-gradient(#005eba, #005eba);
}

.home-game .items_box.FISH li .ball-item[data-v-5e2cd1c6] {
    color: #1167d0;
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(17, 96, 195, 0.5);
}

.home-game .items_box.SPORTS li .ball-item[data-v-5e2cd1c6] {
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(214, 49, 18, 0.5);
}

.home-game .items_box.LIVE li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.5s infinite;
    animation: floating 2.5s ease-in-out 0.5s infinite;
    margin-left: 8px;
}

.home-game .items_box.LIVE li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 0.2s infinite;
    animation: floating 2.5s ease-in-out 0.2s infinite;
    margin-left: 26px;
    margin-top: 8px;
    margin-bottom: 8px;
}

.home-game .items_box.LIVE li[data-v-5e2cd1c6]:nth-child(3) {
    -webkit-animation: floating 2.5s ease-in-out 0.9s infinite;
    animation: floating 2.5s ease-in-out 0.9s infinite;
    margin-left: 6px;
}

.home-game .items_box.LIVE li[data-v-5e2cd1c6]:nth-child(4) {
    -webkit-animation: floating 2.5s ease-in-out 1s infinite;
    animation: floating 2.5s ease-in-out 1s infinite;
    margin-left: 25px;
    margin-top: 8px;
    margin-bottom: 8px;
}

.home-game .items_box.LIVE li[data-v-5e2cd1c6]:nth-child(5) {
    -webkit-animation: floating 2.5s ease-in-out 0.8s infinite;
    animation: floating 2.5s ease-in-out 0.8s infinite;
    margin-left: 9px;
}

.home-game .items_box.LIVE li .ball-item[data-v-5e2cd1c6] {
    color: #5c46b0;
    background-image: linear-gradient(0deg, #fff, hsla(0deg, 0%, 100%, 0.75) 16%, hsla(0deg, 0%, 100%, 0.5) 33%, #fff);
    box-shadow: 0 3px 10px 0 rgba(80, 48, 201, 0.5);
}

.home-game .items_box.LIVE li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 62px;
    height: 62px;
}

.home-game .items_box.LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 56px;
    height: 56px;
}

.home-game .items_box.LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(3) {
    width: 68px;
    height: 68px;
}

.home-game .items_box.LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(4) {
    width: 54px;
    height: 54px;
}

.home-game .items_box.LIVE li .ball-item[data-v-5e2cd1c6]:nth-child(5) {
    width: 58px;
    height: 58px;
}

.home-game .items_box li[data-v-5e2cd1c6] {
    color: #da4326;
}

.home-game .items_box li .ball-item[data-v-5e2cd1c6] {
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-direction: column;
    font-size: 21px;
    font-family: Be Vietnam, Microsoft YaHei, sans-serif;
    font-weight: 700;
}

.home-game .items_box li .ball-item[data-v-5e2cd1c6]:hover {
    transform: scale(1.1);
}

.home-game .items_box li .ball-item p[data-v-5e2cd1c6] {
    height: 26px;
    text-align: center;
    line-height: 24px;
}

.home-game .items_box li .forward[data-v-5e2cd1c6] {
    height: 12px;
    width: 16px;
    display: none;
}

.home-game .items_box li .forward img[data-v-5e2cd1c6] {
    display: block;
    height: 100%;
    width: 100%;
}

.home-game .items_box li:hover .ball-item .forward[data-v-5e2cd1c6] {
    display: block;
}

.home-game .type_name[data-v-5e2cd1c6] {
    flex: 1;
    position: relative;
}

.home-game .type_name:hover .choose[data-v-5e2cd1c6] {
    display: flex !important;
}

.home-game .type_name .desc[data-v-5e2cd1c6] {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
}

.home-game .type_name .desc.SPORTS .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(214, 49, 18, 0.5);
}

.home-game .type_name .desc.PVP .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(188, 123, 3, 0.5);
}

.home-game .type_name .desc.FISH .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(17, 96, 195, 0.5);
}

.home-game .type_name .desc.LIVE .icon[data-v-5e2cd1c6] {
    box-shadow: 0 1px 10px 0 rgba(80, 48, 201, 0.5);
}

.home-game .type_name .desc p[data-v-5e2cd1c6] {
    white-space: nowrap;
    font-size: 32px;
    text-align: center;
    font-family: Be Vietnam, Microsoft YaHei, sans-serif;
    font-weight: 800;
    font-style: italic;
}

.home-game .type_name .desc .choose[data-v-5e2cd1c6] {
    display: none;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    font-size: 25px;
}

.home-game .type_name .desc .choose .icon[data-v-5e2cd1c6] {
    width: 26px;
    height: 26px;
    margin-right: 10px;
    margin-top: 4px;
    border-radius: 50%;
    background: url(/web/nato888/images/aggle-left.png?52a7f1672b4d67b3fd60213007063226) no-repeat;
    background-size: 100% 100%;
}

.home-game.LIVE .type_name .desc[data-v-5e2cd1c6] {
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
}

.home-game.LIVE .type_name .desc p[data-v-5e2cd1c6] {
    text-align: center;
    line-height: 36px;
    white-space: normal;
}

.home-game.LIVE .type_name .desc .choose[data-v-5e2cd1c6] {
    width: 160px;
}

.home-game.LIVE .type_name .desc .choose .icon[data-v-5e2cd1c6] {
    margin-right: 0;
}

.home-game .items_box.length4.FISH[data-v-5e2cd1c6],
.home-game .items_box.length4.PVP[data-v-5e2cd1c6],
.home-game .items_box.length4.SPORTS[data-v-5e2cd1c6] {
    width: 142px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-left: 8px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 1s infinite;
    animation: floating 2.5s ease-in-out 1s infinite;
    margin-left: 72px;
    margin-top: -22px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:nth-child(3) {
    -webkit-animation: floating 2.5s ease-in-out 0.3s infinite;
    animation: floating 2.5s ease-in-out 0.3s infinite;
    margin-top: -22px;
    margin-left: 6px;
}

.home-game .items_box.length4.FISH li[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.PVP li[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.SPORTS li[data-v-5e2cd1c6]:nth-child(4) {
    -webkit-animation: floating 2.5s ease-in-out 0.8s infinite;
    animation: floating 2.5s ease-in-out 0.8s infinite;
    margin-left: 68px;
    margin-top: -20px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 68px;
    height: 67px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 61px;
    height: 60px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(3) {
    width: 68px;
    height: 67px;
}

.home-game .items_box.length4.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(4),
.home-game .items_box.length4.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(4) {
    width: 67px;
    height: 66px;
}

.home-game .items_box.length3.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.5s infinite;
    animation: floating 2.5s ease-in-out 0.5s infinite;
    margin-left: 10px;
}

.home-game .items_box.length3.FISH li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.PVP li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.SPORTS li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-left: 26px;
    margin-top: 7px;
    margin-bottom: 7px;
}

.home-game .items_box.length3.FISH li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.PVP li[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.SPORTS li[data-v-5e2cd1c6]:nth-child(3) {
    -webkit-animation: floating 2.5s ease-in-out 0.2s infinite;
    animation: floating 2.5s ease-in-out 0.2s infinite;
    margin-left: 8px;
}

.home-game .items_box.length3.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length3.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 60px;
    height: 60px;
}

.home-game .items_box.length3.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length3.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 54px;
    height: 54px;
}

.home-game .items_box.length3.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(3),
.home-game .items_box.length3.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(3) {
    width: 62px;
    height: 62px;
}

.home-game .items_box.length2.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.5s infinite;
    animation: floating 2.5s ease-in-out 0.5s infinite;
    margin-left: 10px;
}

.home-game .items_box.length2.FISH li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.PVP li[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.SPORTS li[data-v-5e2cd1c6]:nth-child(2) {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-top: 20px;
    margin-left: 12px;
}

.home-game .items_box.length2.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length2.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 70px;
    height: 70px;
}

.home-game .items_box.length2.FISH li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.PVP li .ball-item[data-v-5e2cd1c6]:nth-child(2),
.home-game .items_box.length2.SPORTS li .ball-item[data-v-5e2cd1c6]:nth-child(2) {
    width: 64px;
    height: 64px;
}

.home-game .items_box.length1.FISH li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.PVP li[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.SPORTS li[data-v-5e2cd1c6]:first-child {
    -webkit-animation: floating 2.5s ease-in-out 0.1s infinite;
    animation: floating 2.5s ease-in-out 0.1s infinite;
    margin-left: 9px;
}

.home-game .items_box.length1.FISH li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.PVP li .ball-item[data-v-5e2cd1c6]:first-child,
.home-game .items_box.length1.SPORTS li .ball-item[data-v-5e2cd1c6]:first-child {
    width: 72px;
    height: 72px;
}

.home-game .type_name .desc.SPORTS .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.SPORTS p[data-v-5e2cd1c6] {
    text-shadow: rgba(214, 49, 18, 0.5) 2px 0 10px;
}

.home-game .type_name .desc.PVP .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.PVP p[data-v-5e2cd1c6] {
    text-shadow: rgba(188, 123, 3, 0.5) 2px 0 10px;
}

.home-game .type_name .desc.FISH .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.FISH p[data-v-5e2cd1c6] {
    text-shadow: rgba(17, 96, 195, 0.5) 2px 0 10px;
}

.home-game .type_name .desc.LIVE .choose[data-v-5e2cd1c6],
.home-game .type_name .desc.LIVE p[data-v-5e2cd1c6] {
    text-shadow: rgba(80, 48, 201, 0.5) 2px 0 10px;
}

.slots_contaniner {
    height: 384px;
    display: flex;
    border-radius: 12px;
    overflow: hidden;
}

.slots_contaniner .rng_menu {
    width: 130px;
    margin-right: 2px;
}

.slots_contaniner .rng_menu li {
    width: 130px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background-color: #fcfcff;
    opacity: 0.9;
    margin-bottom: 2px;
    position: relative;
}

.slots_contaniner .rng_menu li.active {
    background-color: #5d9fff;
}

.slots_contaniner .rng_menu li.active:after {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-left-color: #5d9fff;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
}

.slots_contaniner .rng_menu li:hover {
    background-color: #5d9fff;
}

.slots_contaniner .rng_menu li img {
    max-width: 120px;
    max-height: 58px;
}

.slots_contaniner .rng_menu .more {
    background-color: #fcfcff;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.slots_contaniner .rng_menu .more p {
    color: #5d9fff;
    font-size: 14px;
}

.slots_contaniner .lists {
    width: 798px;
    background-color: #fcfcff;
    display: flex;
    padding: 28px 10px;
    flex-wrap: wrap;
}

.slots_contaniner .lists li {
    width: 155px;
    height: 158px;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    position: relative;
}

.slots_contaniner .lists li:hover .btns {
    display: flex;
}

.slots_contaniner .lists li .item_box {
    width: 128px;
}

.slots_contaniner .lists li .item_box img {
    width: 100%;
    height: 128px;
    border-radius: 10px;
}

.slots_contaniner .lists li .item_box .name {
    max-width: 100%;
    font-size: 15px;
    color: #414141;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    margin-top: 5px;
}

.slots_contaniner .lists li .btns {
    display: none;
    position: absolute;
    width: 128px;
    height: 128px;
    top: 0;
    left: 13.5px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.6);
}

.slots_contaniner .lists li .btns span {
    border-radius: 18px;
    display: block;
    text-align: center;
    font-size: 12px;
    width: 100px;
    height: 34px;
    line-height: 34px;
    color: #fff;
}

.slots_contaniner .lists li .btns span.palynow {
    background-color: #5aa0fe;
    -webkit-animation: fadeInDown 0.3s ease-in;
    animation: fadeInDown 0.3s ease-in;
}

.slots_contaniner .lists li .btns span.freeplay {
    -webkit-animation: fadeInUp 0.3s ease-in;
    animation: fadeInUp 0.3s ease-in;
    background: hsla(0deg, 0%, 100%, 0.3);
    margin-top: 10px;
    border: 1px solid #e2e5ec;
}

.home-games[data-v-44f03a1d] {
    margin: 25px auto 35px;
}

.home-games[data-v-44f03a1d],
.slots_live[data-v-44f03a1d] {
    display: flex;
    justify-content: space-between;
}

.banner_notice[data-v-337ba735] {
    position: relative;
    width: 100%;
}

.banner_notice .notice-content[data-v-337ba735] {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(124, 130, 145, 0.8);
    color: #fff;
}

.home-content[data-v-337ba735] {
    padding: 30px 0 70px;
    background: url(/web/nato888/images/bg.png?635e4b7f3cf96cd32f3a90771bf300a5) no-repeat top;
    background-size: cover;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
    background-color: unset;
    border: unset;
}

.nav-tabs>li>a:hover {
    border-color: unset;
}

.nav>li>a:focus,
.nav>li>a:hover {
    border: unset;
    text-decoration: none;
    background-color: unset;
}

.profile-user {
    position: fixed;
    z-index: 1000;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
}

.profile-user .content-box {
    display: flex;
    width: 1290px;
    margin: 0px auto;
    background-color: #fff;
    height: 620px;
    overflow: hidden;
    border-radius: 10px;
}

.profile-user .content-box .left-box {
    width: 180px;
    height: 100%;
    background-color: #3d4145;
    color: #fff;
}

.profile-user .content-box .left-box .title {
    padding: 0 5px 0 15px;
    height: 70px;
    line-height: 1.1;
    font-size: 20px;
    color: #fff;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.profile-user .content-box .left-box .tab li {
    padding-left: 16px;
    height: 50px;
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}

.profile-user .content-box .left-box .tab li:hover {
    background: #0286eb;
}

.profile-user .content-box .left-box .tab li.active {
    background: #0286eb;
}

.profile-user .content-box .left-box .tab li h3 {
    font-size: 16px;
    color: #fff;
}

.profile-user .content-box .left-box .tab li i {
    display: block;
    width: 25px;
    height: 25px;
    margin-right: 3px;
    margin-top: 3px;
    background-image: url(/web/nato888/images/icon-tab.png?94345a04b446e9fa3278221d82733260);
}

.profile-user .content-box .left-box .tab li i.icon-1 {
    background-position: -148px -84px;
}

.profile-user .content-box .left-box .tab li i.icon-2 {
    background-position: -316px -15px;
}

.profile-user .content-box .left-box .tab li i.icon-3 {
    background-position: -14px -49px;
}

.profile-user .content-box .left-box .tab li i.icon-4 {
    background-position: -59px -48px;
}

.profile-user .content-box .left-box .tab li i.icon-5 {
    background-position: -274px -53px;
}

.profile-user .content-box .left-box .tab li i.icon-6 {
    background-position: -57px -84px;
}

.profile-user .content-box .left-box .tab li i.icon-7 {
    background-position: -182px -85px;
}

.profile-user .content-box .left-box .tab li i.icon-8 {
    background-position: -106px -49px;
}

.profile-user .content-box .left-box .tab li i.icon-9 {
    background-position: -148px -48px;
}

/*=============== END LEFT BOX ===============*/

.profile-user.hide {
    display: none;
}

.profile-user .content-box .right-box {
    width: 1110px;
    position: relative;
}

.profile-user .content-box .right-box .close-profile {
    cursor: pointer;
    position: absolute;
    top: 8px;
    right: 10px;
    display: flex;
    width: 30px;
    height: 30px;
    align-items: center;
    justify-content: center;
    border: 1px solid #0286eb;
    background-color: #fff;
    border-radius: 50%;
    color: #0286eb;
    transition: 0.3s ease-in-out;
}

.profile-user .content-box .right-box .close-profile i {
    font-size: 18px;
}

.profile-user .content-box .right-box .close-profile:hover {
    color: #fff;
    background-color: #0286eb;
}

.profile-user .content-box .right-box #tab-1 {
    padding: 40px 30px;
}

.profile-user .content-box .right-box .box-user {
    display: flex;
    justify-content: space-between;
}

.profile-user .content-box .right-box .box-user .info-wrap {
    border-radius: 10px;
    height: 539px;
    width: 330px;
    position: relative;
    line-height: 1;
    padding-top: 18px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left {
    background: url(/web/nato888/images/bg-info.png?028ad50dd1eb839b0504ce6fd90d29a6) no-repeat top center;
    box-shadow: 0 7px 62px 0 rgb(170 106 226/19%);
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-top {
    padding: 0 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-top .upper-left {
    width: 40px;
    height: 40px;
    background: url(/web/nato888/images/sign.png?c0e5daca3b5a01fc4507032d942b3045) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-top .upper-right .name {
    color: #fff;
    font-size: 16px;
    margin-right: 10px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-top .upper-right {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-top .upper-right .ava {
    width: 40px;
    height: 40px;
    text-align: center;
    color: transparent;
    background-size: 100% 100%;
    border-radius: 50%;
    line-height: 40px;
    font-weight: 700;
    font-size: 22px;
    position: relative;
    background-image: url(/web/nato888/images/avatar.png?66da19ddc2c91bfd735d6a6110d98481);
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-money {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-money .tips {
    font-size: 16px;
    color: #fff;
    line-height: 1;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-money .amount {
    display: flex;
    color: #fff;
    line-height: 1;
    font-size: 16px;
    justify-content: center;
    align-items: center;
    padding-top: 10px;
    padding-bottom: 5px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-money .amount span:first-child {
    font-size: 20px;
    font-weight: 400;
    margin-right: 3px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-money .amount span:nth-child(2) {
    font-size: 30px;
    font-weight: 700;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .info-money .amount span.reload {
    width: 20px;
    height: 20px;
    background: url(/web/nato888/images/reload.png?68f413999c87a772db5710ab68add9e3) no-repeat;
    background-size: 100% 100%;
    margin-left: 10px;
    cursor: pointer;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard {
    /* display: flex; */
    margin: 10px 30px;
    width: 266px;
    height: 134px;
    background: url(/web/nato888/images/vipcard.png?f2f0201552c2f4352c9c2a4d1ed834e6) no-repeat;
    background-size: 100% 100%;
    margin: 6px auto 0;
    padding-top: 17px;
    /* display: none; */
    position: relative;
    z-index: 1;
    padding-left: 117px;
    color: #fff;
    justify-content: center;
    /* background-image: linear-gradient(30deg, rgb(246, 218, 152), rgb(218, 170, 91)); */
    box-shadow: none;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard .vipcon {
    width: 70px;
    height: 78px;
    position: absolute;
    background: url(/web/nato888/images/vipcoin.png?3ebe9c4436af8ea6dd76046e8b04094d) no-repeat;
    background-size: 100% 100%;
    left: 20px;
    top: 50%;
    z-index: 10;
    margin-top: -39px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard .member-level .level {
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard .member-level .wait {
    font-size: 14px;
    margin: 5px 0px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard .progress-wrap {
    width: 120px;
    padding: 5px 0 20px;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard .progress-wrap .progress-bar {
    box-shadow: unset;
    width: 100%;
    height: 6px;
    border-radius: 3px;
    background-color: rgba(102, 102, 102, 0.3);
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard .progress-wrap .progress-bar .progress-cur-bar {
    width: 30%;
    height: 6px;
    border-radius: 3px;
    background-color: #fff;
    transition: 1s ease;
}

.profile-user .content-box .right-box .box-user .info-wrap.left .vipcard .detail a {
    display: block;
    width: 78px;
    height: 30px;
    border-radius: 15px;
    background-color: #fff;
    color: #d09b34;
    cursor: pointer;
    text-align: center;
    line-height: 30px;
}

.money-plan {
    margin-top: 36px;
    margin-left: 30px;
}

.money-plan .plan-item {
    margin-top: 36px;
    background: url(/web/nato888/images/deposit.png?7e87c1b5d02ab51d9e58fc393b0a9b59) no-repeat left center;
    height: 38px;
    padding-left: 55px;
    position: relative;
    font-size: 14px;
}

.money-plan .plan-item:nth-child(2) {
    background: url(/web/nato888/images/deposit2.png?43dd108caa557e80b5d1e32cfdc42746) no-repeat left center;
}

.money-plan .plan-item:nth-child(3) {
    background: url(/web/nato888/images/deposit3.png?052a9a3c364b37de90651c6bfb35a5f6) no-repeat left center;
}

.money-plan .plan-item label {
    font-weight: 500;
    margin: 0px;
}

.money-plan .plan-item .now {
    padding-top: 8px;
    font-size: 12px;
    color: #aaa;
}

.money-plan .plan-item:last-child label {
    font-size: 12px;
}

.money-plan .plan-item:last-child div {
    font-size: 12px;
    padding: 5px 0px;
}

.profile-user .content-box .right-box .box-user .info-wrap.center {
    padding-top: 0px;
    background: url(/web/nato888/images/bg-center.png?bc6a4c58ac3c9f837e846e2e7c6ac9d4) no-repeat;
    box-shadow: 0 7px 62px rgb(218 81 97/19%);
}

.profile-user .content-box .right-box .box-user .info-wrap.center .grade-view {
    color: #bb3c55;
    font-size: 74px;
    text-align: center;
    margin-top: 125px;
}

.profile-user .content-box .right-box .box-user .info-wrap.center .grade-view .small-view {
    font-size: 15px;
    margin-top: 12px;
}

.profile-user .content-box .right-box .box-user .info-wrap.center .grade-info {
    margin-top: 70px;
    font-size: 14px;
    line-height: 25px;
    text-align: center;
    color: #fff;
}

.profile-user .content-box .right-box .box-user .info-wrap.center .grade-info strong {
    font-size: 22px;
}

.setting-text {
    margin-top: 45px;
    color: #5e5e5e;
    font-weight: 700;
    text-align: center;
    font-size: 15px;
}

.setting-option {
    margin-top: 25px;
}

.setting-option .setting-item {
    width: 33.33%;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    float: left;
    height: 104px;
}

.setting-option .setting-item .icon {
    display: inline-block;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    vertical-align: middle;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(/web/nato888/images/icon.png?74600232d7df8fce374582aac3dfd9d5);
}

.setting-option .setting-item:nth-child(1) .icon {
    background-position: -245px -7px;
    box-shadow: 9px 9px 21px rgb(254 235 107/35%);
}

.setting-option .setting-item:nth-child(1) .icon:active {
    /* transition: .5s all; */
    background-position: -713px -7px !important;
}

.setting-option .setting-item:nth-child(2) .icon {
    background-position: -245px -269px;
    box-shadow: 9px 9px 21px rgb(100 194 253/35%);
}

.setting-option .setting-item:nth-child(2) .icon:active {
    background-position: -713px -269px !important;
}

.setting-option .setting-item:nth-child(3) .icon {
    background-position: -474px -701px;
    box-shadow: 9px 9px 21px rgb(254 235 107/35%);
}

.setting-option .setting-item:nth-child(3) .icon:active {
    background-position: -713px -701px !important;
}

.setting-option .setting-item .text {
    margin-top: 12px;
}

.profile-user .content-box .right-box .box-user .info-wrap.right {
    box-shadow: none;
    height: 580px;
    padding-left: 20px;
    width: 340px;
    padding-right: 20px;
    overflow-y: scroll;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item {
    display: flex;
    min-height: 61px;
    margin-bottom: 24px;
    /* padding-left: 74px; */
    position: relative;
}

/* width */

.info-wrap.right::-webkit-scrollbar {
    width: 5px;
}

/* Track */

.info-wrap.right::-webkit-scrollbar-track {
    box-shadow: #fff;
    border-radius: 10px;
}

/* Handle */

.info-wrap.right::-webkit-scrollbar-thumb {
    background-color: #c0bfc0;
    border-radius: 10px;
}

/* Handle on hover */

.info-wrap.right::-webkit-scrollbar-thumb:hover {
    background: #9b9a9a;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .title {
    color: rgb(90, 90, 90);
    font-size: 16px;
    line-height: 18px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .title .text {
    margin-right: 5px;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .title .icon {
    width: 18px;
    vertical-align: sub;
    height: 18px;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .title .icon.danger {
    background: url(/web/nato888/images/danger.png?950f4ed93fc780a6e2f45e11d2c7d466) no-repeat;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .title .icon.checked {
    background: url(/web/nato888/images/checked.png?5d6e27ecfae57b9f49fdf7151961fdc7) no-repeat;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .box {
    width: 221px;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .icon-ava {
    margin-right: 15px;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    vertical-align: middle;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(/web/nato888/images/icon.png?74600232d7df8fce374582aac3dfd9d5);
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item:nth-child(1) .icon-ava {
    background-position: -245px -7px;
    box-shadow: 9px 9px 21px rgb(254 235 107/35%);
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item:nth-child(2) .icon-ava {
    background-position: -245px -95px;
    box-shadow: 9px 9px 21px rgb(87 239 235/35%);
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item:nth-child(3) .icon-ava {
    background-position: -245px -269px;
    box-shadow: 9px 9px 21px rgb(100 194 253/35%);
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item:nth-child(4) .icon-ava {
    background-position: -245px -701px;
    box-shadow: 9px 9px 21px rgb(254 235 107/35%);
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item:nth-child(5) .icon-ava {
    background-position: -245px -356px;
    box-shadow: 9px 9px 21px rgb(221 205 120/35%);
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item:nth-child(6) .icon-ava {
    background-position: -245px -529px;
    box-shadow: 9px 9px 21px rgb(219 133 253/35%);
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item:nth-child(7) .icon-ava {
    box-shadow: 9px 9px 21px rgb(255 109 124/35%);
    background-image: url(/web/nato888/images/logout.png?fdc76ec5890cc7474295f996ef7c977e);
    background-size: 55px 55px;
}

.profile-user .content-box .right-box .box-user .info-wrap.right .account-item .detail {
    line-height: 18px;
    font-size: 13px;
    color: #979797;
}

.right-box .tabcontent .setting-wrap {
    position: absolute;
    /* opacity: 0; */
    top: 0px;
    right: -100%;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    z-index: 60;
    transition: 0.3s all ease-in-out;
}

.right-box .tabcontent .setting-wrap.show {
    right: 0;
    display: flex !important;
    /* opacity: 1; */
}

.right-box .tabcontent .setting-wrap .bg {
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    width: 100%;
    height: 100%;
}

.right-box .tabcontent .setting-wrap .setting-model {
    position: relative;
    width: auto;
    display: flex;
    justify-content: flex-end;
    padding: 15px 30px;
    background-color: #fff;
}

.right-box .tabcontent .setting-wrap .setting-model .close-btn {
    position: absolute;
    cursor: pointer;
    left: -30px;
    top: 0;
    padding: 29px 5px 0;
    width: 30px;
    background: #fefefe url(/web/nato888/images/close.png?db37a47d80956459b36fb3d5cbb1ab43) center 7px no-repeat;
}

.right-box .tabcontent .setting-wrap .setting-model .close-btn::after {
    content: "";
    width: 0;
    height: 0;
    right: 0;
    position: absolute;
    top: 100%;
    border: 30px solid transparent;
    border-top-width: 0;
    border-bottom-width: 13px;
    border-right-color: #fefefe;
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav {
    position: absolute;
    top: 85px;
    left: -52px;
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li {
    position: relative;
    margin-bottom: 14px;
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .title {
    display: none;
    position: absolute;
    padding: 0 10px;
    line-height: 30px;
    /* -webkit-transform: translateX(-100%); */
    transform: translateX(-100%);
    margin-left: -12px;
    top: 50%;
    margin-top: -15px;
    white-space: nowrap;
    color: #fff;
    font-size: 13px;
    background: linear-gradient(to top, rgba(46, 42, 66, 0.92), rgba(81, 78, 98, 0.92));
    border-radius: 5px;
    box-shadow: 0 8px 21px rgb(0 0 0/39%);
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .title::after {
    content: "";
    position: absolute;
    right: -11px;
    top: 50%;
    margin-top: -6px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-left-color: #4c4a5e;
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li:hover .title {
    display: block;
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li.active .title {
    display: block;
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .icon {
    display: inline-block;
    width: 39px;
    height: 39px;
    border-radius: 50%;
    vertical-align: middle;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(/web/nato888/images/icon-2.png?cc9b534dc6b7a2feafb4945b0ac59534);
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .icon.icon-1 {
    background-position: -241px -5px;
    box-shadow: 0 7px 13px rgb(254 235 107/35%);
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .icon.icon-2 {
    background-position: -241px -58px;
    box-shadow: 0 7px 13px rgb(87 239 235/35%);
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .icon.icon-3 {
    background-position: -241px -164px;
    box-shadow: 0 7px 13px rgb(100 194 253/35%);
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .icon.icon-4 {
    background-position: -241px -430px;
    box-shadow: 0 7px 13px rgb(254 235 107/35%);
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .icon.icon-5 {
    background-position: -241px -217px;
    box-shadow: 0 7px 13px rgb(221 205 120/35%);
}

.right-box .tabcontent .setting-wrap .setting-model .setting-nav li .icon.icon-6 {
    background-position: -241px -324px;
    box-shadow: 0 7px 13px rgb(219 133 253/35%);
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .title {
    padding-left: 15px;
    font-weight: 400;
    border-left: 5px solid #23e63a;
    line-height: 1;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .ava-user {
    display: flex;
    margin: 38px auto;
    align-items: center;
    margin-bottom: 28px;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .ava-user .ava {
    width: 65px;
    height: 65px;
    overflow: hidden;
    border-radius: 50%;
    margin-right: 30px;
    cursor: pointer;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .ava-user .ava img {
    width: 100%;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box {
    display: flex;
    margin-bottom: 15px;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    position: relative;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box:last-child {
    padding-top: 15px;
    margin-bottom: 0;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box label {
    line-height: 1;
    margin: 0;
    font-weight: 400;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box input,
select {
    min-width: 330px;
    vertical-align: middle;
    height: 34px;
    border-radius: 5px;
    /* width: 118px; */
    border: 1px solid #e5e5e5;
    background-color: #f5f5f5;
    color: #646464;
    outline: 0;
    padding-left: 5px;
    font-size: 12px;
    box-shadow: 0 1px 5px rgb(0 0 0/8%) inset;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box input:-ms-input-placeholder {
    /* Internet Explorer */
    color: #9e9e9e;
    font-weight: 600;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box input::-moz-placeholder {
    color: #9e9e9e;
    font-weight: 600;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box input::placeholder {
    color: #9e9e9e;
    font-weight: 600;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box input:hover {
    border-color: #a0dbff !important;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-submit {
    position: absolute;
    bottom: 5px;
    left: 0;
    width: 100%;
    border-top: 1px solid #ccc;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent button {
    font-size: 14px;
    position: relative;
    display: inline-block;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    background-color: #fd2f2f;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    min-width: 98px;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0 10px #ffd3d3;
    margin-top: 5px;
    margin-left: 30px;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box i {
    position: absolute;
    right: 5px;
    color: #646464;
    cursor: pointer;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .box i.active:after {
    content: "/";
    position: absolute;
    cursor: pointer;
    right: -3px;
    top: -8px;
    width: 20px;
    text-align: center;
    font-size: 26px;
    font-weight: 700;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .title {
    margin-bottom: 15px;
}

/* .right-box .tabcontent .setting-wrap .setting-model #tabSetting-3 .title{
    margin-bottom: 15px;
} */

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-2 form .box input,
select {
    min-width: 250px;
    position: relative;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-3 form .box input,
select {
    min-width: 250px;
    position: relative;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-4 form .box input,
select {
    min-width: 250px;
    position: relative;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-5 form .box input,
select {
    min-width: 250px;
    position: relative;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-6 form .box input,
select {
    min-width: 250px;
    position: relative;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-6 form .box.special input,
select {
    min-width: 150px;
    position: relative;
}

/* Chrome, Safari, Edge, Opera */

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

/* Firefox */

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

.right-box .tabcontent .setting-wrap .setting-model .settingcontent form .warning .content {
    color: #ea604b;
    font-size: 14px;
    font-weight: 700;
    display: block;
    margin: 5px 0;
    max-width: 328px;
    white-space: normal;
    word-break: break-word;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .wrap-box {
    display: flex;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right {
    padding-left: 30px;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card {
    width: 333px;
    height: 208px;
    margin-bottom: 16px;
    background-image: url(/web/nato888/images/bankcard.png?d083438eafbdcbe60762c940fa2052e5);
    box-shadow: 0 8px 30px rgb(163 11 120/26%);
    margin-top: 25px;
    padding: 14px 20px 0;
    /* width: 359px; */
    background-size: 100% 100%;
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: center;
    color: #fff;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card .name-card {
    height: 18px;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 2px;
    position: relative;
    line-height: 1;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card .account-bank {
    margin-top: 27px;
    margin-left: 5px;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card .account-bank p {
    width: 130px;
    font-size: 13px;
    margin: 0;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card .account-bank .num-account {
    margin-top: 17px;
    text-align: center;
    font-size: 22px;
    line-height: 1;
    text-shadow: 0 2px 5px rgb(0 0 0/23%);
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card .info-bank {
    display: flex;
    margin-top: 35px;
    margin-left: 5px;
    font-size: 12px;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card .info-bank .name {
    width: 130px;
}

.right-box .tabcontent .setting-wrap .setting-model .settingcontent .box-right .list-bank .bank-card .info-bank h3 {
    font-size: 15px;
    margin-top: 10px;
    font-weight: 700;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-6 .box.special button {
    margin: 0;
    min-width: 65px;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-6 .box.special input:-ms-input-placeholder {
    /* Internet Explorer */
    color: #fd2f2f;
    font-weight: 600;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-6 .box.special input::-moz-placeholder {
    color: #fd2f2f;
    font-weight: 600;
}

.right-box .tabcontent .setting-wrap .setting-model #tabSetting-6 .box.special input::placeholder {
    color: #fd2f2f;
    font-weight: 600;
}

.profile-user .content-box .right-box #tab-4 {
    /* padding: 40px 30px; */
    height: 100%;
    padding: 0;
}

.profile-user .content-box .right-box #tab-4 .box-history {
    height: 100%;
}

.profile-user .content-box .right-box #tab-4 .box-history ul.nav {
    padding-left: 30px;
    height: 47px;
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-4 .box-history ul.nav li {
    line-height: 1;
    height: 100%;
    margin-right: 20px;
}

.profile-user .content-box .right-box #tab-4 .box-history ul.nav li a {
    line-height: 1;
    height: 100%;
    padding: 17px 10px;
    color: #666;
    /* border-bottom: 2px solid #fff; */
}

.profile-user .content-box .right-box #tab-4 .box-history ul.nav li a:hover {
    border: 1px solid #fff;
}

.profile-user .content-box .right-box #tab-4 .box-history ul.nav li.active a {
    color: #fd2f2f;
    border: 1px solid #fff;
    border-radius: unset;
    border-bottom: 3px solid #fd2f2f;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content {
    height: 100%;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .tab-pane {
    height: 100%;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .content {
    height: 100%;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search {
    display: flex;
    align-items: center;
    margin-left: 30px;
    padding: 10px 0px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-date {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-date .box {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-date .box label {
    font-weight: 400;
    margin: 0;
    cursor: pointer;
    line-height: 2;
    margin-right: 15px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-date .box input:checked {
    border-color: #fb322a;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-date .box input {
    cursor: pointer;
    margin: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    vertical-align: middle;
    border: 2px solid #fb322a;
    color: #fb322a;
    margin-right: 10px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-search {
    display: flex;
    align-items: center;
    border-left: 1px solid #ebebeb;
    padding-left: 20px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-search .box {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-search select {
    min-width: 111px;
    background-color: #fff;
    /* padding: 0 34px 0 5px; */
    display: inline-block;
    vertical-align: middle;
    height: 34px;
    line-height: 32px;
    border: 1px solid #e5e5e5;
    background: #fbfbfb;
    color: #646464;
    outline: 0;
    cursor: pointer;
    border-radius: 5px;
    box-shadow: 0 1px 5px rgb(0 0 0/6%);
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-search label {
    font-weight: 400;
    margin: 0;
    cursor: pointer;
    line-height: 2;
    margin-right: 15px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-search button {
    position: relative;
    display: inline-block;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    background-color: #fd2f2f;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    width: 98px;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0 10px #ffd3d3;
    margin-left: 15px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .form-search .wrap-search button:hover {
    background-color: #f25252;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content table,
td,
tr,
th {
    border: none;
    text-align: center;
    color: #818181 !important;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .box-table {
    width: 100%;
    height: 520px;
    background-color: #efefef;
    overflow: hidden;
    overflow-y: scroll;
}

/* width */

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .box-table::-webkit-scrollbar {
    width: 5px;
}

/* Track */

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .box-table::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

/* Handle */

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .box-table::-webkit-scrollbar-thumb {
    background: grey;
    border-radius: 10px;
}

/* Handle on hover */

.profile-user .content-box .right-box #tab-4 .box-history .tab-content .box-table::-webkit-scrollbar-thumb:hover {
    background: rgb(99, 99, 99);
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content table {
    width: 100%;
    height: 100%;
    border: none;
    margin: 0px auto;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content tr:first-child th {
    color: #818181 !important;
    background-color: #f6f6f6;
    border-bottom: 1px solid #efefef;
    font-weight: 400;
    height: 30px;
    border-top: 1px solid #d7d7d7;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content tr td {
    font-size: 12px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content tbody tr {
    height: 25px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content tfoot td {
    color: #686868 !important;
    background-color: #e3e2e2;
    border-bottom: 1px solid #efefef;
    font-size: 14px;
    font-weight: 400;
    height: 30px;
    border-top: 1px solid #d7d7d7;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content #game3 .form-search .wrap-search .box {
    margin-right: 10px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content #game3 .form-search .wrap-search select {
    min-width: 90px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content #game3 .form-search .wrap-search {
    font-size: 14px;
    padding-left: 10px;
    margin-right: 10px;
}

.profile-user .content-box .right-box #tab-4 .box-history .tab-content #game3 .form-search .wrap-search label {
    margin-right: 5px;
}

/* -------- tab 5 -------- */

.profile-user .content-box .right-box #tab-5 {
    /* padding: 40px 30px; */
    height: 100%;
    padding: 0;
}

.profile-user .content-box .right-box #tab-5 .box-history {
    height: 100%;
}

.profile-user .content-box .right-box #tab-5 .box-history ul.nav {
    padding-left: 30px;
    height: 47px;
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-5 .box-history ul.nav li {
    line-height: 1;
    height: 100%;
    margin-right: 20px;
}

.profile-user .content-box .right-box #tab-5 .box-history ul.nav li a {
    line-height: 1;
    height: 100%;
    padding: 17px 10px;
    color: #666;
    /* border-bottom: 2px solid #fff; */
}

.profile-user .content-box .right-box #tab-5 .box-history ul.nav li a:hover {
    border: 1px solid #fff;
}

.profile-user .content-box .right-box #tab-5 .box-history ul.nav li.active a {
    color: #fd2f2f;
    border: 1px solid #fff;
    border-radius: unset;
    border-bottom: 3px solid #fd2f2f;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content {
    height: 100%;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .tab-pane {
    height: 100%;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .content {
    height: 100%;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search {
    display: flex;
    align-items: center;
    margin-left: 30px;
    padding: 10px 0px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-date {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-date .box {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-date .box label {
    font-weight: 400;
    margin: 0;
    cursor: pointer;
    line-height: 2;
    margin-right: 15px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-date .box input:checked {
    border-color: #fb322a;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-date .box input {
    cursor: pointer;
    margin: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    vertical-align: middle;
    border: 2px solid #fb322a;
    color: #fb322a;
    margin-right: 10px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-search {
    display: flex;
    align-items: center;
    border-left: 1px solid #ebebeb;
    padding-left: 20px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-search .box {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-search select {
    min-width: 111px;
    background-color: #fff;
    /* padding: 0 34px 0 5px; */
    display: inline-block;
    vertical-align: middle;
    height: 34px;
    line-height: 32px;
    border: 1px solid #e5e5e5;
    background: #fbfbfb;
    color: #646464;
    outline: 0;
    cursor: pointer;
    border-radius: 5px;
    box-shadow: 0 1px 5px rgb(0 0 0/6%);
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-search label {
    font-weight: 400;
    margin: 0;
    cursor: pointer;
    line-height: 2;
    margin-right: 15px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-search button {
    position: relative;
    display: inline-block;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    background-color: #fd2f2f;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    width: 98px;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0 10px #ffd3d3;
    margin-left: 15px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .form-search .wrap-search button:hover {
    background-color: #f25252;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content table,
td,
tr,
th {
    border: none;
    text-align: center;
    color: #818181 !important;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .box-table {
    width: 100%;
    height: 520px;
    background-color: #efefef;
    overflow: hidden;
    overflow-y: scroll;
}

/* width */

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .box-table::-webkit-scrollbar {
    width: 5px;
}

/* Track */

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .box-table::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

/* Handle */

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .box-table::-webkit-scrollbar-thumb {
    background: grey;
    border-radius: 10px;
}

/* Handle on hover */

.profile-user .content-box .right-box #tab-5 .box-history .tab-content .box-table::-webkit-scrollbar-thumb:hover {
    background: rgb(99, 99, 99);
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content table {
    width: 100%;
    height: 100%;
    border: none;
    margin: 0px auto;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content tr:first-child th {
    color: #818181 !important;
    background-color: #f6f6f6;
    border-bottom: 1px solid #efefef;
    font-weight: 400;
    height: 30px;
    border-top: 1px solid #d7d7d7;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content tr td {
    font-size: 12px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content tbody tr {
    height: 25px;
}

.profile-user .content-box .right-box #tab-5 .box-history .tab-content tfoot td {
    color: #686868 !important;
    background-color: #e3e2e2;
    border-bottom: 1px solid #efefef;
    font-size: 14px;
    font-weight: 400;
    height: 30px;
    border-top: 1px solid #d7d7d7;
}

/* .profile-user .content-box .right-box #tab-4 .box-history .tab-content #oposite2 .form-search .wrap-search .box{
    margin-right: 10px;
}
.profile-user .content-box .right-box #tab-4 .box-history .tab-content #oposite2 .form-search .wrap-search select{
    min-width: 90px;
}
.profile-user .content-box .right-box #tab-4 .box-history .tab-content #oposite2 .form-search .wrap-search{
    font-size: 14px;
    padding-left: 10px;
    margin-right: 10px;
}
.profile-user .content-box .right-box #tab-4 .box-history .tab-content #oposite2 .form-search .wrap-search label{
    margin-right: 5px;
} */

/* -------- tab 6 -------- */

.profile-user .content-box .right-box #tab-6 {
    /* padding: 40px 30px; */
    height: 100%;
    padding: 0;
}

.profile-user .content-box .right-box #tab-6 .box-history {
    height: 100%;
}

.profile-user .content-box .right-box #tab-6 .box-history ul.nav {
    padding-left: 30px;
    height: 47px;
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-6 .box-history ul.nav li {
    line-height: 1;
    height: 100%;
    margin-right: 20px;
}

.profile-user .content-box .right-box #tab-6 .box-history ul.nav li a {
    line-height: 1;
    height: 100%;
    padding: 17px 10px;
    color: #666;
    /* border-bottom: 2px solid #fff; */
}

.profile-user .content-box .right-box #tab-6 .box-history ul.nav li a:hover {
    border: 1px solid #fff;
}

.profile-user .content-box .right-box #tab-6 .box-history ul.nav li.active a {
    color: #fd2f2f;
    border: 1px solid #fff;
    border-radius: unset;
    border-bottom: 3px solid #fd2f2f;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content {
    height: 100%;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .tab-pane {
    height: 100%;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .content {
    height: 100%;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search {
    display: flex;
    align-items: center;
    margin-left: 30px;
    padding: 10px 0px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-date {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-date .box {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-date .box label {
    font-weight: 400;
    margin: 0;
    cursor: pointer;
    line-height: 2;
    margin-right: 15px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-date .box input:checked {
    border-color: #fb322a;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-date .box input {
    cursor: pointer;
    margin: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    vertical-align: middle;
    border: 2px solid #fb322a;
    color: #fb322a;
    margin-right: 10px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-search {
    display: flex;
    align-items: center;
    border-left: 1px solid #ebebeb;
    padding-left: 20px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-search .box {
    display: flex;
    align-items: center;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-search select {
    min-width: 111px;
    background-color: #fff;
    /* padding: 0 34px 0 5px; */
    display: inline-block;
    vertical-align: middle;
    height: 34px;
    line-height: 32px;
    border: 1px solid #e5e5e5;
    background: #fbfbfb;
    color: #646464;
    outline: 0;
    cursor: pointer;
    border-radius: 5px;
    box-shadow: 0 1px 5px rgb(0 0 0/6%);
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-search label {
    font-weight: 400;
    margin: 0;
    cursor: pointer;
    line-height: 2;
    margin-right: 15px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-search button {
    position: relative;
    display: inline-block;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    background-color: #fd2f2f;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    width: 98px;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0 10px #ffd3d3;
    margin-left: 15px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .form-search .wrap-search button:hover {
    background-color: #f25252;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content table,
td,
tr,
th {
    border: none;
    text-align: center;
    color: #818181 !important;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .box-table {
    width: 100%;
    height: 520px;
    background-color: #efefef;
    overflow: hidden;
    overflow-y: scroll;
}

/* width */

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .box-table::-webkit-scrollbar {
    width: 5px;
}

/* Track */

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .box-table::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

/* Handle */

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .box-table::-webkit-scrollbar-thumb {
    background: grey;
    border-radius: 10px;
}

/* Handle on hover */

.profile-user .content-box .right-box #tab-6 .box-history .tab-content .box-table::-webkit-scrollbar-thumb:hover {
    background: rgb(99, 99, 99);
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content table {
    width: 100%;
    height: 100%;
    border: none;
    margin: 0px auto;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content tr:first-child th {
    color: #818181 !important;
    background-color: #f6f6f6;
    border-bottom: 1px solid #efefef;
    font-weight: 400;
    height: 30px;
    border-top: 1px solid #d7d7d7;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content tr td {
    font-size: 12px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content tbody tr {
    height: 25px;
}

.profile-user .content-box .right-box #tab-6 .box-history .tab-content tfoot td {
    color: #686868 !important;
    background-color: #e3e2e2;
    border-bottom: 1px solid #efefef;
    font-size: 14px;
    font-weight: 400;
    height: 30px;
    border-top: 1px solid #d7d7d7;
}

.profile-user .content-box .right-box #tab-8 .box-user {
    justify-content: flex-start;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left {
    margin: 39px 0 0 24px;
    width: 290px;
    /* overflow: hidden; */
    background: url(/web/nato888/images/task-bg.png?82a24157eecf86974ec19d6112eca9c7) no-repeat 0;
    height: 212px;
    position: relative;
    border-radius: 0px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-top {
    display: flex;
    color: #fff;
    align-items: center;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-top .user {
    display: flex;
    align-items: center;
    font-size: 24px;
    font-weight: 700;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-top .user .ava {
    display: inline-block;
    vertical-align: middle;
    width: 47px;
    height: 47px;
    color: #fff;
    text-align: center;
    background-size: 100% 100%;
    border-radius: 50%;
    line-height: 48px;
    font-weight: 700;
    font-size: 24px;
    margin-right: 5px;
    position: relative;
    background-image: url(/web/nato888/images/avatar.png?66da19ddc2c91bfd735d6a6110d98481);
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-top .reload {
    cursor: pointer;
    position: absolute;
    top: 6px;
    right: 6px;
    width: 34px;
    height: 34px;
    line-height: 32px;
    background-color: rgba(0, 0, 0, 0.1);
    text-align: center;
    border-radius: 50%;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-top :hover {
    background-color: rgba(255, 255, 255, 0.2);
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-top .reload a {
    background: url(/web/nato888/images/mcac-icon.png?37d19f8864f93dc5210ad6a60c9ef73b) no-repeat;
    width: 20px;
    height: 20px;
    background-position: -317px 0;
    display: inline-block;
    vertical-align: middle;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-top .reload a:hover {
    background-position: -317px -20px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-money div {
    margin-bottom: 5px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-money div:last-child {
    margin-bottom: 0;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task {
    padding: 23px 20px;
    background-color: #f7f7f7;
    box-shadow: 0 4px 18px rgb(0 0 0/11%);
    height: 330px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box .task-img {
    position: relative;
    border-radius: 10px;
    color: #fff;
    font-size: 19px;
    white-space: nowrap;
    line-height: 60px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    width: 64px;
    height: 65px;
    cursor: pointer;
    background-image: url(/web/nato888/images/reward-sign.png?2d437b0fcfdf452df16785e423e05d28);
    background-repeat: no-repeat;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box .task-img.list {
    filter: drop-shadow(0 3px 14px rgba(196, 113, 9, 0.39));
    background-position: -12px -134px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box .task-img.present {
    filter: drop-shadow(0 3px 14px rgba(11, 65, 206, 0.39));
    background-position: -12px -257px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box .task-view {
    margin-left: 10px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box .task-view .title {
    color: #262626;
    font-size: 14px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box .task-view .status {
    color: #818181;
    font-size: 12px;
    margin-top: 6px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box button {
    display: inline-block;
    height: 34px;
    line-height: 34px;
    font-size: 12px;
    width: 65px;
    color: #747474;
    padding: 0 5px;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    background-color: #fff;
    box-shadow: 0 1px 7px rgb(148 147 147/26%);
    transition: 0.2s ease-in-out;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.left .info-task .box button:hover {
    color: #b3b3b3;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right {
    width: 71%;
    height: 700px;
    /* background-color: #f7f7f7; */
    padding: 0px;
    margin-left: 20px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .title {
    margin: 0 23px;
    line-height: 39px;
    position: relative;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .title::before {
    content: "";
    display: block;
    position: absolute;
    width: 5px;
    height: 14px;
    background-color: #4c11d3;
    top: 50%;
    margin-top: -7px;
    left: -11px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list {
    height: 581px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item {
    height: 200px;
    position: relative;
    padding: 68px 0 0 126px;
    display: flex;
    background-image: url(/web/nato888/images/reward-bg.jpg?b716fececc0a028e36bfdae83d9e0ce8);
    background-position: 0 -1200px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-name {
    font-size: 21px;
    font-weight: 700;
    color: #555;
    line-height: 23px;
    width: 195px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view {
    position: absolute;
    top: 37px;
    right: 73px;
    height: 126px;
    width: 310px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .left {
    float: left;
    width: 210px;
    font-size: 12px;
    height: 100%;
    color: #fff;
    background-image: url(/web/nato888/images/tikker-bg.png?9d13f41f045edb016f22bee52b270b8b);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 210px 882px;
    padding-top: 35px;
    background-position: 0 -756px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .left .text {
    position: absolute;
    color: #fff;
    top: 10px;
    left: 11px;
    font-weight: 600;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .left .center {
    text-align: center;
    font-size: 24px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .left .off-day {
    padding-left: 11px;
    position: absolute;
    font-weight: 500;
    bottom: 10px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .right {
    float: left;
    background-image: url(/web/nato888/images/dot.svg?d082a07aef534da2217e1e70da7554e1);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
    transform-origin: 0 126px;
    width: 100px;
    height: 100%;
    text-align: center;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .right .text {
    font-size: 12px;
    margin-top: 10px;
    color: #818181;
    margin-bottom: 6px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .right .return-day {
    font-weight: 700;
    font-size: 40px;
    color: #818181;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .right .return-day span {
    font-size: 14px;
    font-weight: 700;
    color: #818181;
    margin-left: -10px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .right .clock {
    font-weight: 700;
    color: #818181;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .right button {
    width: auto;
    min-width: 54px;
    height: 24px;
    line-height: 24px;
    margin-top: 10px;
    color: #fff;
    background-color: #30d005;
    font-size: 12px;
    border-radius: 12px;
}

.profile-user .content-box .right-box #tab-8 .box-user .info-wrap.right .reward-list .reward-item .reward-view .right button.not-add {
    cursor: not-allowed;
    background-color: #ececec !important;
    box-shadow: none;
}

/* ----------------------------------------------------------------------------------------------------------- */

.right-box .tabcontent .reward-wrap {
    position: absolute;
    /* opacity: 0; */
    top: 0px;
    right: -100%;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    z-index: 60;
    transition: 0.3s all ease-in-out;
}

.right-box .tabcontent .reward-wrap.show {
    right: 0;
    display: flex !important;
    /* opacity: 1; */
}

.right-box .tabcontent .reward-wrap .bg {
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    width: 100%;
    height: 100%;
}

.right-box .tabcontent .reward-wrap .reward-model {
    position: relative;
    width: auto;
    display: flex;
    justify-content: flex-end;
    /* padding: 15px 30px; */
    background-color: #fff;
}

.right-box .tabcontent .reward-wrap .reward-model .close-btn {
    position: absolute;
    cursor: pointer;
    left: -30px;
    top: 0;
    padding: 29px 5px 0;
    width: 30px;
    background: #fefefe url(/web/nato888/images/close.png?db37a47d80956459b36fb3d5cbb1ab43) center 7px no-repeat;
}

.right-box .tabcontent .reward-wrap .reward-model .close-btn::after {
    content: "";
    width: 0;
    height: 0;
    right: 0;
    position: absolute;
    top: 100%;
    border: 30px solid transparent;
    border-top-width: 0;
    border-bottom-width: 13px;
    border-right-color: #fefefe;
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav {
    position: absolute;
    top: 85px;
    left: -52px;
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li {
    position: relative;
    margin-bottom: 14px;
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .title {
    display: none;
    position: absolute;
    line-height: 1;
    max-width: 190px;
    transform: translateX(-100%);
    margin-left: -12px;
    top: 50%;
    margin-top: -15px;
    white-space: nowrap;
    color: #000;
    font-size: 13px;
    text-overflow: ellipsis;
    background: linear-gradient(to top, #badfff, #fff);
    border-radius: 5px;
    box-shadow: 0 8px 21px rgb(0 0 0/39%);
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .title span {
    display: inline-block;
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 9px 10px;
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .title::after {
    content: "";
    position: absolute;
    right: -11px;
    top: 50%;
    margin-top: -6px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-left-color: rgba(219, 240, 255);
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li:hover .title {
    display: block;
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li.active .title {
    display: block;
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .icon {
    display: inline-block;
    width: 39px;
    height: 39px;
    border-radius: 50%;
    vertical-align: middle;
    background-repeat: no-repeat;
    cursor: pointer;
    /* background-image: url(../web/nato888/images/user/.); */
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .icon.icon-1 {
    background-image: url(/web/nato888/images/reward-1.png?cb4412a02a048505cdf2b2b750f73cfa);
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .icon.icon-2 {
    background-image: url(/web/nato888/images/reward-2.png?0887a07d3ca3f66b81bf20c60c686d58);
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .icon.icon-3 {
    background-image: url(/web/nato888/images/reward-3.png?7b31dff39ce1d5b93c247fef51d55661);
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .icon.icon-4 {
    background-image: url(/web/nato888/images/reward-4.png?7d5fe404fd95502f710219097abd39f6);
}

.right-box .tabcontent .reward-wrap .reward-model .reward-nav li .icon.icon-5 {
    background-image: url(/web/nato888/images/reward-1.png?cb4412a02a048505cdf2b2b750f73cfa);
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .wrap-box {
    display: flex;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule {
    width: 339px;
    height: 100%;
    background-image: url(/web/nato888/images/rules.png?6b536871318b72a4dedacc2f1d9abb20);
    background-repeat: no-repeat;
    background-color: #fff;
    padding-top: 239px;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .every-rule {
    display: flex;
    margin: 0 auto;
    width: 308px;
    height: 72px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 8px 21px rgb(202 202 202/33%);
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .every-rule .every-item {
    width: 103px;
    border-right: 1px solid #fff1ca;
    text-align: center;
    height: 100%;
    position: relative;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .every-rule .every-item .title {
    font-size: 12px;
    color: #555;
    padding-top: 15px;
    white-space: normal;
    line-height: 1;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .every-rule .every-item .number {
    font-size: 23px;
    color: #009cff;
    line-height: 39px;
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .every-rule .every-item:nth-child(2) .number {
    color: #fd2f2f;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .every-rule .every-item:nth-child(3) .number {
    color: #e640ff;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .promo-time {
    margin: 23px 30px;
    font-weight: 700;
    white-space: normal;
    line-height: 22px;
    color: #656565;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .promo-time label:last-child {
    color: #fd2f2f;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .rule-view {
    margin: 0 20px 0 30px;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .rule-view {
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    padding-bottom: 14px;
    color: #656565;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .rule-content {
    color: #656565;
    line-height: 26px;
    text-align: start;
    font-size: 14px;
    padding-right: 10px;
    margin-top: 8px;
    height: 124px;
    overflow: hidden;
    position: relative;
    font-weight: 400;
    overflow-y: scroll;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .rule-content::-webkit-scrollbar {
    width: 0;
}

/* Track */

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .rule-content::-webkit-scrollbar-track {
    box-shadow: #fff;
    border-radius: 10px;
}

/* Handle */

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .rule-content::-webkit-scrollbar-thumb {
    background-color: #c0bfc0;
    border-radius: 10px;
}

/* Handle on hover */

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-rule .rule-content::-webkit-scrollbar-thumb:hover {
    background: #9b9a9a;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .box-right {
    padding: 0;
    padding-left: 0;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar {
    position: relative;
    /* float: right; */
    width: 513px;
    height: 100%;
    padding: 23px 10px 10px 25px;
    background-color: #f5f5f5;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar .calendar-item {
    background-image: url(/web/nato888/images/coin-2.png?f5781679661a50ca0ef353b8ea2e76b0);
    float: left;
    width: 147px;
    height: 171px;
    border-radius: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    box-shadow: 0 3px 43px rgb(0 0 0/11%);
    position: relative;
    background-color: #fafafa;
    background-position: bottom 48px right 50%;
    background-repeat: no-repeat;
    text-align: center;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar .calendar-item:last-child {
    background-image: url(/web/nato888/images/coin-2.1.png?47dbb43a00bde6ce3a2f2a6aa570fb99);
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent.coin-special .sign-calendar .calendar-item {
    background-image: url(/web/nato888/images/coin.png?bd1d63e5bb6a32af5e8356d2c7a45bb6);
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar .calendar-item .day {
    font-size: 14px;
    font-weight: 700;
    font-stretch: normal;
    line-height: 31px;
    letter-spacing: 1px;
    color: #656565;
    text-align: center;
    position: relative;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar .calendar-item .amount {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #656565;
    line-height: 14px;
    max-height: 28px;
    padding: 0 5px;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    word-break: break-word;
    text-overflow: ellipsis;
    text-align: center;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar .calendar-item button {
    position: absolute;
    text-align: center;
    color: #fff;
    font-size: 14px;
    width: 98px;
    height: 23px;
    line-height: 23px;
    border-radius: 10px;
    left: 50%;
    transform: translateX(-50%);
    bottom: 12px;
    background-image: linear-gradient(0deg, #c2c2c2 0, #8f8f8f 100%);
    cursor: not-allowed;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar .calendar-item button.active {
    background-image: linear-gradient(0deg, #f48075 0, #e94040 100%);
    cursor: pointer;
}

.right-box .tabcontent .reward-wrap .reward-model .rewardcontent .sign-calendar .calendar-item button.active:hover {
    opacity: 0.7;
}

.bank-card {
    width: 380px;
    height: 208px;
    margin-bottom: 16px;
    background-image: url(/web/nato888/images/bankcard.png?d083438eafbdcbe60762c940fa2052e5);
    /* box-shadow: 0 8px 30px rgb(163 11 120 / 26%); */
    margin-top: 25px;
    padding: 14px 20px 0;
    /* width: 359px; */
    background-size: 100% 100%;
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: center;
    color: #fff;
}

.list-bank .bank-card .name-card {
    height: 18px;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 2px;
    position: relative;
    line-height: 1;
}

.list-bank .bank-card .account-bank {
    margin-top: 27px;
    margin-left: 5px;
}

.list-bank .bank-card .account-bank p {
    width: 130px;
    font-size: 13px;
    margin: 0;
}

.list-bank .bank-card .account-bank .num-account {
    margin-top: 17px;
    text-align: center;
    font-size: 22px;
    line-height: 1;
    text-shadow: 0 2px 5px rgb(0 0 0/23%);
}

.list-bank .bank-card .info-bank {
    display: flex;
    margin-top: 35px;
    margin-left: 5px;
    font-size: 12px;
}

.list-bank .bank-card .info-bank .name {
    width: 130px;
}

.list-bank .bank-card .info-bank h3 {
    font-size: 15px;
    margin-top: 10px;
    font-weight: 700;
}

.box-withdraw ul.nav {
    padding-left: 30px;
    height: 47px;
    display: flex;
    align-items: center;
}

.box-withdraw ul.nav li {
    line-height: 1;
    height: 100%;
    margin-right: 20px;
}

.box-withdraw ul.nav li a {
    line-height: 1;
    height: 100%;
    padding: 17px 10px;
    color: #666;
    /* border-bottom: 2px solid #fff; */
}

.box-withdraw ul.nav li a:hover {
    border: 1px solid #fff;
    border-bottom: 1px solid #dddddd;
}

.box-withdraw ul.nav li.active a {
    color: #fd2f2f;
    border: 1px solid #fff;
    border-radius: unset;
    border-bottom: 3px solid #fd2f2f;
}

.box-withdraw .left ul {
    border: none;
    margin-top: 10px;
}

.box-withdraw .left ul li {
    border: 2px solid #eee;
    border-radius: 5px;
    min-width: 89px;
    text-align: center;
}

.box-withdraw .left ul li a {
    padding: 15px 10px;
}

.box-withdraw .left ul li.active {
    border: 2px solid #fd2f2f;
}

.box-withdraw .left ul li.active a {
    color: #666;
    border-bottom: unset;
    padding: 15px 10px;
}

.box-withdraw .left {
    width: 800px;
}

.box-withdraw .left .tab-content {
    padding-left: 30px;
    /* display: flex; */
}

.box-withdraw .left .tab-content .tab-pane .wrap-wallet {
    display: flex;
}

.box-withdraw .left .tab-content .tab-pane .wrap-wallet>div {
    width: 50%;
}

.box-withdraw .left .tab-content .tab-pane .bank-content .swiper-pagination {
    bottom: -4px;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet {
    margin-top: 50px;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
    position: relative;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box .label {
    display: block;
    width: 112px;
    color: #4b4b4b;
    font-size: 14px;
    font-weight: 500;
    margin: 0;
    padding: 0;
    text-align: start;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box span {
    font-size: 20px;
    color: #0094d1;
    margin-left: 10px;
    font-weight: 700;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box input {
    width: 136px;
    height: 34px;
    border-radius: 5px;
    border: 1px solid #e5e5e5;
    background-color: #f5f5f5;
    color: #646464;
    outline: 0;
    padding-left: 5px;
    font-size: 12px;
    box-shadow: 0 1px 5px rgb(0 0 0/8%) inset;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box input:hover {
    border-color: #a0dbff !important;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box i {
    position: absolute;
    right: 140px;
    color: #646464;
    cursor: pointer;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box i.active:after {
    content: "/";
    position: absolute;
    cursor: pointer;
    right: -3px;
    top: -8px;
    width: 20px;
    text-align: center;
    font-size: 26px;
    font-weight: 700;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box button {
    min-width: 98px;
    position: relative;
    display: inline-block;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    background-color: #fd2f2f;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0 10px #ffd3d3;
}

.box-withdraw .left .tab-content .tab-pane .money-wallet .box.accept {
    position: absolute;
    bottom: 5px;
}

.box-withdraw .left .tab-content .time-box .tip-wrap {
    width: 288px;
    max-height: 340px;
    margin-top: 135px;
    position: relative;
    background-image: linear-gradient(90deg, rgba(255, 253, 251, 0.2) 0, #ffe7d6 100%);
    background-blend-mode: normal, normal;
    border-radius: 10px;
    border: solid 1px #f9dacb;
    padding: 14px;
    margin-left: 47px;
    padding-right: 12px;
}

.box-withdraw .left .tab-content .time-box .tip-wrap .time {
    margin-bottom: 4px;
    line-height: 20px;
    word-break: break-word;
}

.box-withdraw .left .tab-content .time-box .tip-wrap .time .title span:first-child {
    min-width: 68px;
    display: inline-block;
    height: 21px;
    line-height: 21px;
    text-align: center;
    font-size: 13px;
    border-radius: 11px 0 11px 0;
    letter-spacing: 1px;
    margin-right: 5px;
    padding: 0 5px;
}

.box-withdraw .left .tab-content .time-box .tip-wrap .time .title.time-content span:first-child {
    background-color: #ffe6d1;
    color: #f55600;
}

.box-withdraw .left .tab-content .time-box .tip-wrap .time .title.atten span:first-child {
    background-color: #d1e3ff;
    color: #2a74e7;
}

.box-withdraw .left .tab-content .time-box .tip-wrap .time .title span:last-child {
    font-weight: 700;
    color: rgb(78, 78, 78);
}

.box-withdraw .left .tab-content .time-box .tip-wrap .time .clock span {
    color: #fd2f2f;
    font-weight: 700;
}

.box-withdraw .left .tab-content .time-box .tip-wrap .time .title.atten span:last-child {
    font-weight: 400;
}

.box-withdraw .right {
    position: absolute;
    background-color: #f5f5f5;
    width: 300px;
    top: 47px;
    right: 0;
    height: calc(100% - 47px);
}

.box-withdraw .right .history-title {
    line-height: 15px;
    margin: 18px 30px 0;
    padding-left: 10px;
    border-left: 4px solid #4c8bff;
    font-weight: 400;
}

.box-withdraw .right .history-list {
    position: absolute;
    top: 53px;
    width: 100%;
    height: calc(100% - 53px);
    overflow-y: auto;
    overflow-x: hidden;
    display: block;
}

.box-withdraw .right .history-list .history-item.not-data {
    margin-left: 30px;
    box-shadow: 0 5px 24px 0 rgb(0 0 0/8%);
    margin-bottom: 16px;
    height: 101px;
    line-height: 101px;
    background-color: #fafafa;
    color: #d1d1d1;
    border-radius: 10px;
    text-align: center;
    width: 240px;
}

.box-withdraw .right .history-list .history-item.not-data .no-text i {
    display: inline-block;
    width: 20px;
    height: 18px;
    margin-right: 6px;
    vertical-align: middle;
    background: url(/web/nato888/images/not-his.png?3ae3a979682118f4dca428cbc8306aad) center no-repeat;
    background-size: 100%;
}

#withdraw2 .nav.nav-tabs {
    position: absolute;
}

#withdraw2 .wrap-wallet {
    display: block;
}

#withdraw2 .wrap-wallet .bank-content {
    display: flex;
    /* justify-content: space-around; */
    width: 100%;
}

#withdraw2 .wrap-wallet .bank-content .money-wallet {
    margin-top: 0;
    padding-top: 70px;
    padding-right: 30px;
    padding-bottom: 350px;
    border-right: 1px solid #efefef;
}

#withdraw2 .wrap-wallet .bank-content .box {
    margin-bottom: 15px;
}

#withdraw2 .wrap-wallet .bank-content .box input,
select {
    min-width: 230px;
}

#withdraw2 .money-wallet .box i {
    right: 5px;
}

#withdraw2 .list-bank {
    margin-top: 15px;
    margin-left: 30px;
}

#withdraw2 .list-bank .title {
    padding-left: 5px;
    border-left: 5px solid #23e63a;
}

#withdraw2 .bank-card {
    width: 333px;
    box-shadow: 0 8px 30px rgb(163 11 120/26%);
}

.wrap-mess {
    display: flex;
}

.tabDeposit {
    display: none;
}

#tab-2 .deposit-wrap {
    height: 100%;
    display: flex;
}

#tab-2 .deposit-wrap .left-deposit .tab {
    width: 255px;
    height: 620px;
    padding-top: 22px;
    position: relative;
    background-color: #f7f7f7;
    overflow-y: scroll !important;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit {
    width: 205px;
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 5px 30px 0 rgb(0 0 0/8%);
    border-radius: 6px;
    border: solid 1px transparent;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    cursor: pointer;
    position: relative;
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit.active {
    border-color: #ff2f34;
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit.recommend::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 24px;
    background: url(/web/nato888/images/recommend.png?3594a79239b3b0a9d0aab137c8e084f2);
    background-size: 100% 100%;
    right: 0;
    top: 0;
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit.active:after {
    content: "";
    position: absolute;
    width: 19px;
    height: 19px;
    background: url(/web/nato888/images/check-bank.svg?f4f1841f1f6c9a3a185a4042c90e5d63);
    background-size: 100% 100%;
    right: 0;
    bottom: 0;
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon {
    width: 40px;
    height: 40px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-radius: 6px;
    flex-shrink: 0;
    margin: 3px 0;
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-1 {
    background-image: url(/web/nato888/images/bank-1.png?79e6cc5bcf73cd08cb252dec90769cf1);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-2 {
    background-image: url(/web/nato888/images/bank-2.png?a399badca0eab8de64b345edf14cbad6);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-3 {
    background-image: url(/web/nato888/images/bank-3.png?610655dab26faa47969206c8305f26c7);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-4 {
    background-image: url(/web/nato888/images/bank-4.png?8107630796eb05a8611da33cd7346cb7);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-5 {
    background-image: url(/web/nato888/images/bank-5.png?e0ffbe1043ca9bbe1f4aadb2ff726f00);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-6 {
    background-image: url(/web/nato888/images/bank-6.png?ac7ac948850eae0fb2a45c7db2abbb24);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-7 {
    background-image: url(/web/nato888/images/bank-7.png?f16153c4eec21abb5893a035ee000190);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .icon.icon-8 {
    background-image: url(/web/nato888/images/bank-8.png?e911e8a8b91c013175d05bbfec018ab0);
}

#tab-2 .deposit-wrap .left-deposit .tab .boxDeposit .bank-name {
    color: #646464;
    text-transform: capitalize;
    font-size: 14px;
    font-stretch: normal;
    margin-left: 9px;
}

#tab-2 .deposit-wrap .left-deposit .tab::-webkit-scrollbar-button {
    display: block;
    height: 4px;
}

#tab-2 .deposit-wrap .left-deposit .tab::-webkit-scrollbar {
    width: 6px;
    background-color: transparent !important;
}

#tab-2 .deposit-wrap .left-deposit .tab::-webkit-scrollbar-thumb {
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgb(139 139 137/50%);
    background-color: #8b8a8a;
}

#tab-2 .deposit-wrap .right-deposit .deposit-title {
    width: 100%;
    border-bottom: 1px solid #efefef;
    height: 47px;
    line-height: 46px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 60px;
    padding-left: 30px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-title .text {
    color: #000;
    font-size: 16px;
    font-weight: 400;
    position: relative;
}

#tab-2 .deposit-wrap .right-deposit .deposit-title .text:before {
    content: "";
    position: absolute;
    display: block;
    width: 5px;
    height: 15px;
    background-color: #23e63a;
    top: 50%;
    margin-top: -7.5px;
    left: -13px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-title .teaching {
    height: 34px;
    line-height: 30px;
    padding: 0 10px 0 36px;
    border-radius: 17px;
    color: #5076f3;
    font-size: 14px;
    letter-spacing: 0;
    border: solid 2px rgba(80, 118, 243, 0.3);
    position: relative;
    cursor: pointer;
}

#tab-2 .deposit-wrap .right-deposit .deposit-title .teaching .icon {
    position: absolute;
    top: 50%;
    margin-top: -10px;
    left: 10px;
    display: block;
    width: 20px;
    height: 20px;
    background: url(/web/nato888/images/help.png?118200ef0ad981ce72526da7e4e3e52d) no-repeat;
    background-size: 100% 100%;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 10px;
    width: 855px;
    position: static;
    height: 525px;
    overflow-x: hidden;
    overflow-y: scroll;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content::-webkit-scrollbar {
    width: 6px;
    background-color: transparent !important;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content::-webkit-scrollbar-button {
    display: block;
    height: 4px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgb(139 139 137/50%);
    background-color: #8b8a8a;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content .bank-mess {
    display: inline-block;
    max-width: 725px;
    background-image: linear-gradient(90deg, rgba(255, 253, 251, 0.2) 0, #ffe7d6 100%), linear-gradient(#f5f5f5, #f5f5f5);
    background-blend-mode: normal, normal;
    border-radius: 10px;
    border: solid 1px #f9dacb;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0;
    color: #ff2f34;
    padding: 10px 15px;
    margin: 10px 0 20px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content .pay-desc {
    margin-bottom: 1em;
    display: flex;
    align-items: center;
    position: relative;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content .pay-desc:before {
    content: "";
    position: absolute;
    left: 22px;
    top: 50%;
    margin-top: -9px;
    width: 0;
    height: 0;
    border: 9px solid transparent;
    border-right-color: #616161;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content .pay-desc .icon {
    width: 24px;
    height: 24px;
    background: url(/web/nato888/images/danger.png?950f4ed93fc780a6e2f45e11d2c7d466);
    background-size: 100% 100%;
    margin-right: 15px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content .pay-desc .content {
    background-color: #616161;
    padding: 4px 0;
    box-shadow: 0 2px 4px rgb(0 0 0/28%);
    border-radius: 4px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content .pay-desc .content .desc-wrap {
    background-color: #616161;
    color: #fff;
    max-width: 480px;
    line-height: 21px;
    padding: 0 8px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
    overflow: hidden;
    max-height: 42px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box {
    display: flex;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .label {
    font-size: 14px;
    color: #666;
    font-weight: 400;
    margin-right: 30px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box ul li img {
    width: 100%;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box ul {
    display: flex;
    width: 600px;
    flex-wrap: wrap;
    vertical-align: middle;
    max-height: 153px !important;
    margin-bottom: 16px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box ul li {
    position: relative;
    width: 125px;
    display: flex;
    cursor: pointer;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0 !important;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box ul li label {
    width: 100%;
    /* position: absolute; */
    z-index: 300;
    margin: 0;
    padding: 0 15px;
    cursor: pointer;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box ul li label.active {
    border: 2px solid red !important;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box ul li input[type="radio"] {
    cursor: pointer;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .money input {
    display: inline-block;
    vertical-align: middle;
    height: 34px;
    border-radius: 5px;
    width: 223px;
    border: 1px solid #e5e5e5 !important;
    background-color: #f5f5f5 !important;
    color: #646464;
    outline: 0;
    padding-left: 12px;
    box-shadow: 0 1px 5px rgb(0 0 0/8%) inset;
    margin-bottom: 10px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .money .wrap-cash {
    display: flex;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .money .wrap-cash .cash {
    display: inline-block;
    margin-right: 10px;
    line-height: 30px;
    color: #7e7e7e;
    padding: 0 10px;
    border: 2px solid #f5f5f5;
    background-color: #f5f5f5;
    border-radius: 5px;
    min-width: 60px;
    margin-bottom: 10px;
    text-align: center;
    cursor: pointer;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .money .wrap-cash .cash.active {
    border: 2px solid #fdd3dd;
    background-color: #fff0f0;
    color: #fd1e4b;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .money .atten {
    display: block;
    color: red;
    line-height: 34px;
    text-transform: capitalize;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .list .list-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .list .list-item label {
    width: 500px;
    background-color: #f5f5f5;
    color: #7f7f7f;
    border-radius: 10px;
    margin-left: 10px;
    border: 2px solid transparent;
    padding: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .list .list-item label.not-data {
    background-color: #f5f5f5;
    color: #c7c7c7;
    cursor: not-allowed;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .list .list-item label .top-text {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    width: 420px;
    font-weight: 700;
    color: #ccc;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-right: 0px;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box .list .list-item label .bot-text {
    color: rgb(0, 71, 178);
    font-size: 14px;
    width: 420px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box.btn {
    position: absolute;
    bottom: 0 !important;
    left: 255px;
    width: 855px;
    border-top: 1px solid #e6e6e6;
    padding-left: 30px;
    line-height: 45px !important;
    height: 48px;
    text-align: left;
}

#tab-2 .deposit-wrap .right-deposit .deposit-content form .box.btn button {
    position: relative;
    /* display: inline-block; */
    height: 34px;
    line-height: 34px;
    min-width: 100px;
    padding: 0 10px;
    background-color: #fd2f2f;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    width: auto !important;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0 10px #ffd3d3;
}

.login-header {
    padding: 5px 0px;
    color: #363941;
    /* background-color: #e6f1fa; */
}

.login_wrapper {
    height: 34px;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    align-items: center;
}

.login_wrapper .time-wrapper {
    font-size: 14px;
    display: flex;
    align-items: center;
}

.login_wrapper .time-wrapper span {
    margin-right: 6px;
}

.login_wrapper .time-wrapper span.now-time {
    white-space: nowrap;
}

.login_wrapper .time-wrapper .affiliate_service {
    position: relative;
    margin-left: 10px;
    color: #65a4ff;
    cursor: pointer;
}

.login_wrapper .time-wrapper .affiliate_service span {
    white-space: nowrap;
}

.login_wrapper .time-wrapper .affiliate_service i {
    display: none;
    width: 300px;
    padding: 5px 10px;
    position: absolute;
    left: 100%;
    top: 100%;
    transform: translateY(-50%);
    z-index: 9999;
    background: #373855;
    font-size: 12px;
    color: #fff;
    font-style: normal;
    border-radius: 5px;
}

.login_wrapper .time-wrapper .affiliate_service:hover i {
    display: block;
}

.login_wrapper .login_btns {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.login_wrapper .login_btns.isLogin {
    flex: 1;
}

.login_wrapper .login_btns .br_login_button .text,
.login_wrapper .login_btns .btn_join {
    border: none;
    min-width: 0;
    white-space: nowrap;
    margin-right: 5px;
}

.logined_wrap[data-v-a5d500de] {
    font-size: 14px;
    width: 100%;
}

.logined_wrap .wrap[data-v-a5d500de] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.logined_wrap .wrap .logined_item[data-v-a5d500de] {
    margin-right: 13px;
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #56575c;
    position: relative;
}

.logined_wrap .wrap .logined_item.nickname[data-v-a5d500de] {
    font-weight: 700;
}

.logined_wrap .wrap .logined_item.balance[data-v-a5d500de] {
    color: #ff726f;
    font-weight: 700;
}

.logined_wrap .wrap .logined_item.unreadMessage[data-v-a5d500de] {
    position: relative;
}

.logined_wrap .wrap .logined_item.unreadMessage span.cil[data-v-a5d500de] {
    display: block;
    position: absolute;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background-color: #ff6260;
    box-shadow: 0 1px 5px 0 rgba(255, 50, 93, 0.5);
    right: 0;
    top: -2px;
}

.logined_wrap .wrap .logined_item[data-v-a5d500de]:hover {
    color: #5d9fff;
}

.logined_wrap .wrap .logined_item:hover .name_icon[data-v-a5d500de] {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAYCAYAAAD6S912AAABy0lEQVQ4ja2VwSvlURTHP/e5GBaEhZXBbCyU7SwsxKzYiMjm5aWspEZKZvwBNlNDTU0mm7eVLYmklAXTlLWNjY2SDUW8d+9Ph/tr3rv3Rx7vW2dzfud8+v7u75z7U5lsxDNqAuaAUaAdyAHHwCqQBYy0ZTPFzbq2KpHWCWwBLQU5qfzsYhgYAW79Rl1fEzisAzY9mK8BYAXIgCoGNtQGxV+B1hdgscaBZXcM/4F1HwKHQ6+AxRoEVQys1kHRa9zF+ugntAqL7koABrUpC3jxNyH3XPwLgJEFL34n5JLiMrKsB0ATgRc7JuJPQr4wrImYMBFXwRkam3g2U8AFMA9Ues/OgUk3q4HUrz1TmJNh7hHnwBrQ/DQatAF5N3Mbbg3H3NHuT/emzmKAWtp9tCgfe9HtboV7dgLMuhWMh1Xq+oGfQIfLiaMfwMLMFxXp3JPB78A3z36He61T4MjlZI8/eXUVrvdaTKnFLdsIiOVwCUvTjRyZOEyXAYZjpAXYVwZYrD6dN3SVEdilc/bFe69Utei8UeF983ZpnbePQ+pvw1uVE+AB0Fsm4IHs8oKsj/sJvUf3si0pYzk0lm5j2TaWe7ksSgzpkd7u1TSHD8zM2KSnTBLlAAAAAElFTkSuQmCC) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap .logined_item:hover .balance_icon[data-v-a5d500de] {
    width: 25px;
    height: 21px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAVCAYAAACzK0UYAAABfElEQVRIibWVPUsDQRCGn72sqAlBTeMfECwsLIyFoohgIQhqbWGKSPwq01hEBBG00FKQgCFdasVCsFEsRGKjYCWICIJaiUEj5vZOVk4IiYRwl3tg2eJm52V29t4RsawN0AWkgFEgBCjcEwCKwBmwmY1xK5ZzdjdwDTR7SFyLPhkJ2RkfBTT7MhK0+30U0PTIcAsm0OSjSEkGxK+InwSl3ZjsBeAVsABR8e1DWpZngfn4kJGuFSCVt1KmEsPGYfrcSgCTwDfwBPxl1VV9id1T9Q6EXQhcAfplbgNJ4A1o++e6MEwFLteFcy5pKvJLI0aHqWg1FaoiX0GWVJVwvUSduD1gYefEfgDR7thKOWFZcu9SA8DYyrhY3Dq274FpQO+PFT0pivUjy21P/phZnRC5WgEideBZRPMCPDsVVP8nHq6rnE5n/YsWqWxUo/nUr8tPc9Q0SdP6HVjROoLdcidNRdyZjH4xpyu5AXqBNWDQmZJebNNwPOwS2MjMkv8BJ0yUROTN5c4AAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap .logined_item:hover .deposit_icon[data-v-a5d500de] {
    width: 25px;
    height: 25px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAACz0lEQVRIibWWXWjNYRzHP//jf7Ydbcy8zAVzQRQXSom2ZQqZK2GRvMxEmUQpu5ELtUQsLa+NskmUjCHEDTNWXGiSxdAuyGtN2hq28/z+ek7POf57/M9Oy9m3np7/8/ud5/f2/F6OU17v4cNmYD0wGwgDb4DrwGHgJwGoLw+iDoQbyYidHeAusMTizzFrC1AKtKcWGaBkdFbMk/tAiY9+HugAqs15MvAEmAJ0DRThpFaSG4mFx6/gERAPQiawz3xnA7XAhiF7Miri7bJoe81eCay1eNqgncB325OTzVIALAMmGuJvoGZ7SajPjYSZaQnSj/8U+ARMCzBsLnDPTzjXKrsjYQ6aZPHjGNDnOjDCYuhQfQWqgIXANWCMj//L7NpiqW+VMgdqLBk9wPxNhaGeWLg8eG9Z/Nm4Ox14Dny0lLQAS4GbgM6ajABv11UUhl7GDyHxuCAe+NZ+8dgjHh3isVE8Zvl4D8TDE49K8QiLR4Z1V6/2isLQDb9Gp65FZRpr8wxNp+g2HUugybIw3zx6X4D1cei3LNpaHOpMKDnVrPSeC7wFxg5yuQxoBO6YwhwM34CjpnifhZRQpIReJYxTwgkldCsB37qlhAIlNCrhiBJKLT7mTo4STpvzeCUcUEKTEtpcJZwBJgHFwA6z8kw6fjHWZgFXgFVJrHeBlcDUAF6eGxVHhyrHZNJD4KKpk37TCfTlNSnCEwEakvC63X6VeHCNBWalE44blVjhZKZZsB/Z2pMXprKHA7pYG9yoom6YlFzSzbZ6udPpVF0VTXgFzEijgq5DK5xEzWlPNBYDr4GRaVCgQ7TIT9AprPcPhvFY97P/VFJWu5q2gUpU4luP12iSrjoUPLZ/qys+jvyAga2n2zwzH2zoOdRs5oofWk68Uxglf/8R6dZgT7bbphMkw2Uzjv34p+b8nvwA3gETzFlzjqcI01kz9+PG9dpeAPwB1IX/St4Xej0AAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap .logined_item:hover .msg_icon[data-v-a5d500de] {
    width: 22px;
    height: 22px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAABeUlEQVQ4jbWVIUgDYRiGn3/+2DSIQSwWi3E2QUzC2gWLIs4V05oiFmFhWBRMwxkmY7Bg1jYGBkVsrigWi21BFhwY9O4m/+12eOf97OZub7uPu+e+u+/9v1dkKh00mgHSQApIAlNuvQU0gBpQrWRohj0sspd/wBNAHsgC47q3uvoCikDubIO2D3x4Zf++XgCugfk+wKBeAePIEC8e+LTugRX0FpgeENrTO7Cyt9qFi9Kdhfv5j//oNKzzxZ3lRFvKhFPIxwDFZSjWrijfW2r6bxEGFVVqoHPS7jiWiguKy0pL23Z8GtQDcBIRdAAsBWopaXUc8wc16brD7AMdc+8NKikKN5b26A0jadpiFFzktxVafwYuQuqqi31gtg+3pQN/AE8h/1hN/DNCww0dWE25HgGgU00HHkbqgFRHAS4er4lm3GC1hHI4rojPbmptGoX17sKXZjwdO4v+fBNv0UvTFyADy4um0pY/mqRlO+HYC8oo8oVpeTskTIEfUFBpwRavg5kAAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap .logined_item:hover .center_icon[data-v-a5d500de] {
    width: 27px;
    height: 23px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAXCAYAAAD6FjQuAAAC5ElEQVRIib2VXWjPURjHP+fnTxMKERfkLUQoNTfzcjG5sBvvIhez0uZlliKLlps1hbTaUEPbSuRCQpQ01NZWoobmJTPzlmhemhWz3/+cn87///zn5/j9/9zYU0/nfL/nOc9zXp7zHJVfH/AXGQxsAJYC84AZwDCgF3gGPARuA+fr8/mWyZXafi5jsN3ALmCCw/cAIxzuA1B1fCMH0wbbf8lE8eOBC8BCh98K1ITwGuA0MDLE3QXWV6xQL/8IduTGH8HsLu4B4xzeBm6RdhHwCLgKTJbjHByy7QYW7Fmm2n8LVtOow3gQ0AFMcgKdAHYA5UBZiD9fuNjbeLLJFAPVzpwuu5DCxV7/Paq65t+C1QIF7laBKcAbIB4xNnFzjve2vsVEXf7FzTnemhTwrIXo7AAKQjisnwKIpRkbSzRvdXVdi1nwK1gAontDfVfzgoAfQUC7w/cW5Hittc1mToa5+/qP8VRT4hgV8BEYHXEUKbGJ8AOoA+bL3W4DXgEvMsy173HUlkVeb0wnkzH7L4HaALuq98ByZ8w+8M4M87Mkexs8G0wbZkkbpWXaMFcb3mrDSm3YqQ1F2lCsDWu1oa9oiZetDSUZfNiqQyye3NnwNKs6DFRIqaqPqCRWuqpumW0luV511S0zFDgUYZPw7/lGkUa7faNKfaPyfKMafKMmpLEb6xt14WhDsKkk1zvsG/U+wsZL7iz5zO5KdQjLMemvA1ohY5G197IKOBvXFAKlznjCtyq/Flkb/1nK8tQ/26oDV0wlMAToS3HS2loXk3QPQjxOP8xlSdb6Dm/9fI/5OvGFDIjYYFF/0/+QHs+mvqOv44YjccMD4d8IbhPcKfip4HbBHYKfCH7u+vZ8rXC01ddqr6/VZeHvC74u+I7gm4IbK9clcLPgBsFNrm9VdDb46hyjPdbHwFSSFT2FpwFj5GN8CkyXEvVFPs+Z8mN/BuynmcL9ftWWM7Y2D1CCaMO7AUkQ6PkJz4jI76GN2kwAAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap .logined_item:hover .agent_icon[data-v-a5d500de] {
    width: 26px;
    height: 21px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAVCAYAAABYHP4bAAACTklEQVRIiaWVX4hNQRzHP3McxWptVsqD2lKiPKw/qdX+Yf2JSEnKPiw3XbXZZT14IFF44MWDf/vgslopK7WSB1ubZXMlG1F40SbZlFJbiPy5d85o7p17zT333HOPvd/61Znf/GY+8/vNmRkR61NUqBNAOzALeAWc6osx5J9SdPWHguYDOuB9if5+oC3A33qxjZEC0LG7XtAES4GzQItpPwS6gTdWzErgSYkFjAELT24R+Szc2qqijOqA54BjrxB4Yfo+Gd/aEhCtBcBcELlY3OppRUFHfJCcpgJHgS7T/hwC0vphN5wpAny2PMCXswbreyAkLhFvdL4VgJTZbcs+BvhyNm59TyhYp+C7L2ZYwX5/euJKUvp9zcCjEuVoAEZtR7zJofex1wjM0fsYb3LGgwY6UoHPklKxTypSlv+3VHRIxagvtjqR9FqkYp5U1EhFfSLp1QeBRM9IUUb+DLSeBvQdJ1ui2oC+Z8DhzlXOgzzo3HAgaDWwGJht2hPAa6uk78xhLqcD3Wuc8xnQmaGCA7sM6LEy8UuD9gCbzIGOos0H14t74vRgHrQRGIww8CdQBewAbkaI/wXUuKls5eoiQrSmA1/1YGC7sTDpK6HD/ZMFRVmZrZnABSAWAaS1Vxy67S0BXv4nKCd9di4B28rEpXXpdk4SorUBuBwB5LopKZorALWajMppzE17rKgQ1BvSf988jjfctMwExicJGjCH9zowA/gC6Lvurb4TE+3/Xmax+1rm4dMPlf57tgKLtD9k8g/AHeCWvi2u7oqwHOAv+fO/2HRuG/4AAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap .logined_item:hover .logout_icon[data-v-a5d500de] {
    width: 25px;
    height: 25px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAADHUlEQVRIiZWWTWxVRRTHf3NzH3JRsCtJCRWJSCI24gIxPBPbhJC2YVEJUSAQsStIXZDYRUl0aUxl4QoraqolhJo0hFIW5sVUTZUPqySNYFy0xoTEiMSNUGxo73yYeZxHptf7Ls9/8n/3nDln5syZuee8qw4OOxpEDHwGdADfAvuBheGDD54cJ8sajcFe4IDIu4GvgA8bmRg/ujw3k17gGvBdMNaS8RFdVX+PjrkXgOeBEwO7lF4SpClZMvEh4AKwRfSNwKzI85kg9/WBilvblPC9qIcHKq58tFPdvh9kVbIkkylgc0HmOVBk1ngGuDI46Vp726JFPxAlJRCOJCU2B3pXUmI20HPp0dsW/Z6UaA/sTyUlztaiRureqb6oYJ/Inh0KKoFelzX0lKNJWafmu3P4ku2sBvGJOjguT893HXwZ6IUM8Xo5uuSgP/A/Xg1iHc9ax3PWgXXcso63RG6IWfSUo2PWcVPmPjl00ZZ9kFeCxYb+T4C8IB7WMRj47ImMZauxIDwfyFlGeXoejOWLwG9LbCwbahsAZgre1RUZ/eF6jsZW11mQumvxu1kpEe8ay1xBJhMZvVKQyR1j+Vv8VsTaqrti813M1/+dOhv0hbpDGuQk8E29TLRVy4FHRF2MU8N16UO+y64H/io4sglhIVJTXad2nH9G2jKtrY9e5fZAboj5mdAezP0pSg3nUlON7nkokBtiHlLDG8Hcc7E2fA3cAJqBdYD/Gzr5oCOph7fHXTfwtJhvvdOtxqPUQmrpk6fnx6nliUAvZIj+Mbc6tZwK/Pu9OdIGtOFzbZgWeZk2TGnDOtELWUPfGdesDT9ow0rxn3lvl/roXhCrEO7UVs2L/Ji26qq2ak9gz6XHkVFeFv/Hxcdoq7pqG1C9I0sa0Cbgx0x1X5Y78nf3m681vzl53dvkDl8KXy5g2wf7uFIbiDNV+4v8M54GtsrYNqHHH8Cc1MDanLu/6r9iTuzn53AwNv/tpL8C/qOgD3gTWBPYQjmEL+D3PznAQJ5R9Zws/O7yDe5VwJ9vK7BaWo9vRTcl8wow+ulr/JO7AvAvzCIchXqx4uwAAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap .logined_item:hover .tooltip[data-v-a5d500de] {
    visibility: visible;
}

.logined_wrap .wrap .logined_item .tooltip[data-v-a5d500de] {
    visibility: hidden;
    position: absolute;
    top: 18px;
    left: 60%;
    font-size: 12px;
    background-color: rgba(93, 159, 255, 0.7);
    border-radius: 4px;
    z-index: 1;
    color: #fff;
    white-space: nowrap;
    padding: 2px 6px;
}

.logined_wrap .wrap i[data-v-a5d500de] {
    display: inline-block;
    margin-right: 5px;
}

.logined_wrap .wrap i.name_icon[data-v-a5d500deXd] {
    width: 20px;
    height: 24px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAYCAYAAAD6S912AAAB1UlEQVQ4ja2Vz0uUYRDHP2/77G546GCHTvZDQg+BNxFSkrzVpVqSLlIEnboEQVT+AV2C8CSFF68i3YpQiBANtgi8CSJ46RKElwRFt52RWZ4Xt+d5lF3bLwwvfHfmuzPzzsybzb+vcgTOAs+AceASUANWgRlgFqhb2N3K0D/Rrlh0KbkrwCegp4krAUPeKqYF7IaBrlwuhtwZ4GMgFuIm8BZ4EAmeLpdC7glw4RixHPeBKd+GQ8FSnOGdFsRy3IoEXaEQOrWSXY7zIeHIIqe9NgQj31MoBPY9wR1lPyJBVSWw6QSXsi1VnY8ERZXAFkX1XYJvNhHVh6L6J+qh/XMCj4HfwHMgHINfwCM/qxGy5a8bzZwN82ijtzAHnPOjcRH460fkg1/De4AASyNXL//MBbKl5fXGE3jldzefI/vhqV/BvAzzuwG8Afo9Zzv9Gpi8NtKnTqTh+xJ4EaTf78vaBL55zva4N/Ar+NhtSyr7/GWtG7CUu1I9aQM71jInIhMdEMNrTFjJYx0QyzHmpC4DHRQcsJKPu3vtosfVRZMn+4RwTkVqiW04KWpOVFeA6x0SXLG3PGnr4z9C/4N92xY7X1VVHVbVBVXdb/F0NZvFWOxw5fZg9QCMHhPceQiMgAAAAABJRU5ErkJggg==) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap i.balance_icon[data-v-a5d500de] {
    width: 25px;
    height: 21px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAVCAYAAACzK0UYAAABfElEQVRIibWVzStEURTAf2/cGTMkrKx9lLCwwEwzG5G175Ut+VjbKhtl4w+QYmshC2OlSZqUITZDkySTlMJKJkZ45+nWS9OYZvHevF/d7uLed36de88719jZPQVoA5aAAaAWMHFOFZAHksDq5HgkY+ztX7QDaaDaReBy9KhgsHrLQ4FmU4VCgT4PBZouFfD7fwC/h5JvZfiMHw8FmhqFVZFAOeAFEMAoWntXluXaMhcJN2+U26DEnWQkGmmJp86ys8Aw8AU8wt/56Kw+lSWOJRdA/CR1twYsAq9AfYnjwiciOBwp+7tFETmPRVsbRSQkImZRvJwyRZxm0mvP68B88vjmHmiw20ohdUqcS6LA0EB/x8JR8joLjAJ6fii6k7yROMy8aZtTEzA1NNi5XW6DcZC4civRPANPdgb//xPTdHxchTTZoyT6ToovqtJ8KDHFy+ao8esSTheUoxfc6t41bb+MXjGjRKxLoBtYBmL2K+mmGnx2DzsDVibGwue/4/m281InUIoAAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap i.deposit_icon[data-v-a5d500de] {
    width: 25px;
    height: 25px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAACyklEQVRIibWVbWjPURTHP//t/v8bbcU8zAtmsSjSatkDE4q1LXkzK8lQ8sJKlOKNvFCSYkko4c0kCsuQeXjjcQ9GmmQxW1uRx5q0NQz36Or81293/20t2/fX7dx7zu/e83DvOSd0qaqBADYDZUAmEAbeAFeBQ8B3YqC0JDcWux+MMfFuHQJuAwWePEvHFqAIaB72xFhKEhIijt4FlgX4Z4EWYL+uZwCPgZlA54iVJCaGyzwFj4BNOk8A9uo8CTgKbBi5J5HwDo+3R2k5sM6TOYO2A1/9g+rqW9OAYmCahv8nULF4UUavMcbM8/53l98IfAAyYhiWDdwJMhqfdOw0xhzUxxLEMaDXECLeE7hQfQZ2A8uBK8DEgPyHUmexbXzaUUqICu+MbiAvZ2F6979wIbz1LP6o7s4BngPvPSUPgULgOiBAJIa363Oy019GF3GCnBP6ffsE2SVIiyAbBZkfkN4TRAQpFyQsSMTb677mnOz0a0GNofqGtgS1NkV57oludbEEqj0LU/XSe2NYH4W7y/y83FntfUrq6lsdnQC4yaQhNpcCVcBNTcyh8AU4osn7LM6K5FuRHisy2YqcsCJdVoTAuGFF0qxIlRU5bEWKPDm6J9mKnNT1FCtywIpUW5EmY62cBqYDS4BtOlL0OX5SaxOBy8CaQaw3QAkwO4YsxYi1LlTJ+pIeAOc1T35pJXCb1w4TnnFA5SCyLudJSoCxVMdoImT+WNutNWqskOQ8eaGZPRZwyVpprLWnxkjJBVdsCwsWtIdqbjU5xitg7igq6CwuzOzLORcuR1cCr4Hxo6DAHbgiyHDhcvSdCmpdPftPJaWrV2U1eUokOnft9fcgVXUkqPX/Na6mKlK1xAfhuluu9gcfrg/d174ShDsnWikGeOJKg9/ZarQSDIaL2o6DGJBzQU++AW3AVF27yzo+TJjOaN+PGtfjewHwF8K1Ikm/87uoAAAAAElFTkSuQmCC) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap i.msg_icon[data-v-a5d500de] {
    width: 22px;
    height: 22px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAABiUlEQVQ4jbWVMUsCYRjHf2cvbTVEQ7QEEUFDhFZWQ25xBHWZtfoF2oJodGjsAzi1OUYQTllTUpgRCVFEVESbQzgkNETeG6+dovaap+Z/u+fe+91zz/Pc8zf2Dy6oowEgDJiAF+hz4jkgAySA2HpoJqt72DiMX9XGeoAdYAPorvdWR59AFIisLE/mq8BHxzeV12NAHBhpAKzVE2CZC+P3ZfBp8qESmgT6m4SW9AYEAvOjRbiRSj/jfP51C5nqMvfN+ofzwuPx4NS0XSgOQ7E2jfTli+r+q4tGuZVq6JCQyPA/QnFYYSFtaWpupoBdl6BtYK4mZgpbSq/mcK8zHV8NoF3O2Vp5jbPzR+kys6YkCrbdCS7C1oPvgD1N3AC2gMEG3JywbW0l3oFbTY1Vxz9cJJwRdkGbseryiQtAPSU6UWP1g8Tq1bgdRRfNiawo6EvRqtQSivAzFf82xmptWtaSL88f49asios+aE2VF327GZetKRScrrImIaVU5lgySjeqMtO1Vf9vMwW+AQPrdlpXOlcEAAAAAElFTkSuQmCC) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap i.center_icon[data-v-a5d500de] {
    width: 27px;
    height: 23px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAXCAYAAAD6FjQuAAAC5klEQVRIib2VbWiOYRTHf888RChEfJhsY5OFkr1YM9KKLMK8RD75Igu1UlvKN1HmgzIpJXxRKy8z+eBlXmZt8+xRY+b12RuTpnlpVmzYuXU9zvN0u9zPM9Kcu7v7+v/Puc65z3Wd6zq+cxfuMYSMBDYD+cB8IA0YC/QDL4Bm4DZQsaEw+3M8V75Ll+/H0+8BioFEi+8DxlvcW+DomtULD8YMdvVasxc/DTgP5Fr8DuCEC68HTgITXFwQ2LRi+bzO34LdqXlmcyYLk+5UizeB6/W7GHgMXAGSdDlHumx7gcylS2aHfglWf6/NjUcAhphhBToO7AT2A/tcfEVOdsqWhkD7LqDcmtNjfiQnOyW6j75AsMNtcArYZqcKJANdwHcP3fSsjKTXjfc7HQ/dxayMpPURkIAx+fmm47DNhd3vexz8MXRTwp68dYWNwc7MaDCH6FPiGttPgYMz4OCELL4/KzOpKRDsmBtn7t7oMjYE2sNf4B0wyWMpImIKYQA4DSzQvS0CXgLtceaa8zhxUVZyv99xwkudMUSgFmAQ6AZWWjpzwDvizB+t1VvtFxFDzIkTyFTfAR2vNQUBfNVSN8GrcnNmZdQ1tO42hzqGjzQNFs5sXAyjMg1krqozHjeJkZ7aulBRXm5qeW1daAxwyMMm7D/BZBbj7RWRUhEpEJFqEUmMYTdFRM7X1D7fmpebWiYi3R42CSZYJLOg3g5uOabjjUATEO+SNfuyDjgr4mwHSi192Lev+tbjOD6Glvxl6X9s67t+49ERYJRuOnoM0ALwa7k7Lh5r7OZGa9V+s3jj54t/UKT4n1L7CzF75tWbhkP6vKrxlYgcFpGHirsUtyjuUPxMcUhxm+Kniltt317BmkSkRESqFD9QfFVxQPFNxXdXFSwwuE5xteJa27evsir4yVpGs6xPgBQI3+gRPBOYrI3RdNxUvaI+avOcrR37A2CaZgRH/fouVDZ69aHhKRDHcd78lwKBvh9kTPEUTAJeQAAAAABJRU5ErkJggg==) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap i.agent_icon[data-v-a5d500de] {
    width: 26px;
    height: 21px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAVCAYAAABYHP4bAAACV0lEQVRIiaWVX4hMURzHP3e6uxliQ8qD2oa2VdRi25lda5bNhhB2bfFAHqhN/r1KHnjxLPKAPCmEEan1f0277O5FxEpYZrMppbYQIeb8dKYz253bnTvX7rd+dX+/8z3ne37n3N/vWJdS/YwTh4EtwFTgBXCkvS1x27ukde36kyCZ2YAAQ0XGzwObfeLN69bWpguEbt0Z8FtgIXAUaDL+fWAv8NLFaQB6i2xgEKhe0TJf8gE7Gi33kioBnWbEvUPgqRn7ZGLLi4hoVAEzXVzs8rIyL+mARyQPTTwI7DL+5wAhjR9uJ2JFLDxW6xPLW73rOxXAO5WIx74VCOWuutA++sTyNuz6HkFoQfju4dxD2ONNz+p3Mt5YEuguchz1gOMOJOIxnEdDjcAMfY+JeGzYb2JEieCxHiWyW4n8ccV/K5EOJeJ4uJP7nEyTEpmlRCqUSE2fk6nxE7Ie9r4repsmAw2/qj4EuSOa5jP2GNi/uGFO16hQz4O3fgLLgHnAdOOPAAOuI31virkU9i1prDqWE0p3v3ZzFwEnXJl4oYV2AKtNQYfBmqXJ6k6rK/0qz10F3Agx8ScwEdgEXAjB/wVU2NlsrktUhhTRiAJf9WSg3VgQJgAdtlKKkDtzYwpwHNgWQkhjp9V58/kC4Nl/CuWha+ck0FaC91dntHWMIhorgdMhhGxbZVVyHELNJqNSGLSzStWNU+hMwPhd8zies0VEE7ePUShlivcsMAn4Auhe90b3xNb1daMvs3X5Sq5H6odK/z0bgLk6HrD4B+AqcFF3i42t8dLbAf4Bsk7X/xSDZv4AAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.logined_wrap .wrap i.logout_icon[data-v-a5d500de] {
    width: 25px;
    height: 25px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAADFElEQVRIiZ2WX4hXVRDHP7/bcfeX5mtSaK64Bf7BDdr9xW6Rhsi2SLlqaVHgY2Fv+eCD7xFBPYlWEBGhQqKshu1umbIp6q5L6ioJKpUgpfSSaaLifkfOOrudvdzfb381ly93Zs6cmTtzz8y9pd17TlAnBeALoBP4EXgTuPPqmmen3B1CeKjeIK8Dbzm/FvgB2F7PxtDY2FCk3wicBY4kujk5m0lyb/9ITKkN+KSrc8m9SUHK5Wmp3AgcBVpdfgq46PytXJAJ+fDA+dnl8rTxur9zeOB8x4tLF/z9byYNk4IMAi3V0q5GOR+LgOFjxy8t7mhvvhsVWQgBx84QQksid4UQLiZyISJ1tDdfCSEsS9afDCHsHY+aUQJKPEeJN5yP6KREXyJXh1OlrWnA/Yzbrhwa/u2lB0EMMLb6PeJ9jO8SuTYSqrQ2HcPYnNhvHQti2BLDnjbGruuGbXG+ritPlbamDw275nvnD578tSMz2Wsmw/F5wteFIjLZtmTv+szMKmaGY3/C55EVyYVBzL5N7FqDzJp9TcCFGid1ek6eUc1QZtHPHe+7OZlkMyVDstuS3XC+CAdzuj5VKZdkNyX7y+2mB5Nu+1qcLw8DN6s8YGzUFT4gB2KjV8vEpDLwiIt3g2SXfQ7FzpoH/FmjZAcdNUmyeUk5r4ZR6RTwvCuWA0NTOZmKRqVlicmZ+E56kjq/XeOdFKKIJHs3se3JJB2S9IckJM2VtMH5upCn/u/PrpK0wPdeX7F80b7MhU2Jw88kNf2fIL39Z2ZJ+ipZ3xz1mae0S7JTzjdINijZ3P9SrgO9px+TbChpiQtdnS2fepCJqCsl3XL+UUkjktbXk8k3B37qdvsnXD8qqWv8AUo9+4fTjBcCJ3PdfRz4EjgE/BIPz9j0fnDclwIbgBcS+/jpbV/18jMTjkNu/vzsX8YdcaC6rt0R6XfghvfA7IKDNRL/YrpfaT2XKmMz5g0vAfGnYBPwHvB4spbyKcUG/nhNd9sHRYv5TFL6CMY+OuuAWN/FwCwfPXEUXfPM+4Cv166u/FPoBbgP2lPG/mXsZ0MAAAAASUVORK5CYII=) no-repeat top;
    background-size: 100% 100%;
}

.login_modal_wrap[data-v-fb5ae9f8] {
    width: 400px;
    background-color: #e6f1fa;
    border-radius: 12px;
    overflow: hidden;
    padding: 14px 0 18px;
}

.login_modal_close[data-v-fb5ae9f8] {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    cursor: pointer;
    background-color: #a2b4ce;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login_modal_close svg[data-v-fb5ae9f8] {
    fill: #fff;
}

.login-title[data-v-fb5ae9f8] {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    padding: 0 20px;
    font-weight: 700;
    font-size: 26px;
    letter-spacing: 1px;
    color: #5f77b5;
}

.login_wrap[data-v-fb5ae9f8] {
    width: 260px;
    margin: 0 auto;
}

.login_content[data-v-6bfc405e] {
    height: 100%;
    margin-right: 20px;
}

.login_content .username_login[data-v-6bfc405e] {
    display: flex;
    align-items: center;
}

.login_content .username_login .btn_freeplay[data-v-6bfc405e] {
    font-size: 14px;
}

.login_content .username_login .login_select[data-v-6bfc405e] {
    margin-right: 10px;
    height: 26px;
    position: relative;
}

.login_content .username_login .login_select[data-v-6bfc405e]:after {
    position: absolute;
    right: 10px;
    top: 10px;
    content: "";
    width: 0;
    height: 0;
    border-top: 6px solid #ccc;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
}

.login_content .username_login .login_select .select-input[data-v-6bfc405e] {
    width: 130px;
    height: 26px;
    padding: 0 10px;
    border-radius: 20px;
}

.login_content .username_login .login_select ul[data-v-6bfc405e] {
    width: 100%;
    position: relative;
    z-index: 210;
    background-color: #e6f1fa;
}

.login_content .username_login .login_select ul li[data-v-6bfc405e] {
    height: 26px;
    line-height: 26px;
    white-space: nowrap;
    padding-left: 10px;
    font-size: 12px;
}

.login_content .username_login .login_select ul li[data-v-6bfc405e]:hover {
    background-color: #66a6fe;
    color: #fff;
}

.login_content .username_login .login_select select[data-v-6bfc405e] {
    border: none;
    outline: none;
    width: 100%;
    height: 26px;
    line-height: 26px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0 20px;
}

.login_content .username_login .login_select option[data-v-6bfc405e] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 26px;
    line-height: 26px;
}

.login_content .username_login form[data-v-6bfc405e] {
    display: flex;
    align-items: center;
    font-size: 14px;
}

.login_content .username_login form .form_item[data-v-6bfc405e] {
    display: flex;
    align-items: center;
    position: relative;
    margin-right: 8px;
}

.login_content .username_login form .form_item .mobileNum_input[data-v-6bfc405e] {
    display: flex;
    align-items: center;
    background-color: #fff;
    border-radius: 20px;
    border: 1px solid #dfe3e6;
}

.login_content .username_login form .form_item input.phone_input[data-v-6bfc405e] {
    border-radius: 20px;
    border: none;
    height: 26px;
    line-height: 26px;
}

.login_content .username_login form .form_item input[data-v-6bfc405e] {
    width: 180px;
    background-color: #fff;
    height: 33px;
    line-height: 34px;
    padding: 0 10px;
    border-radius: 18px;
    border: 1px solid #dfe3e6;
    display: block;
    color: #56575c;
}

.login_content .username_login form .form_item input[data-v-6bfc405e]:-ms-input-placeholder {
    color: #ccc;
    font-size: 12px;
}

.login_content .username_login form .form_item input[data-v-6bfc405e]::-moz-placeholder {
    color: #ccc;
    font-size: 12px;
}

.login_content .username_login form .form_item input::placeholder {
    color: #6e6d6d;
    font-size: 14px;
}

.login_content .username_login form .form_item input.password_input[data-v-6bfc405e] {
    padding: 0 50px 0 10px;
}

.login_content .username_login form .form_item input.captcha_input[data-v-6bfc405e] {
    padding: 0 90px 0 10px;
}

.login_content .username_login form .form_item .forget_box[data-v-6bfc405e] {
    color: #ff726f;
    font-size: 12px;
    position: absolute;
    right: 9px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

.login_content .username_login form .form_item .captcha_box[data-v-6bfc405e] {
    display: inline-block;
    cursor: pointer;
    position: absolute;
    right: 1px;
    top: 50%;
    transform: translateY(-50%);
}

.login_content .username_login form .form_item .captcha_box img[data-v-6bfc405e] {
    border-radius: 0 18px 18px 0;
    height: 26px;
    vertical-align: middle;
}

.login_content .username_login .login_submitk[data-v-6bfc405e] {
    height: 26px;
    line-height: 26px;
    display: block;
    color: #fff;
    border-radius: 18px;
    padding: 0 20px;
    background-color: #f66;
    margin-right: 10px;
}

.login_content .username_login .join-select[data-v-6bfc405e] {
    position: relative;
    font-size: 14px;
}

.login_content .username_login .join-select .btn_join[data-v-6bfc405e] {
    height: 30px;
    line-height: 26px;
    display: block;
    color: #fff;
    border-radius: 18px;
    padding: 0 20px;
    background-color: #66a6fe;
}

.login_content .username_login .join-select:hover .select_drop[data-v-6bfc405e] {
    display: block;
}

.login_content .username_login .join-select .select_drop[data-v-6bfc405e] {
    display: none;
    position: absolute;
    left: 50%;
    top: 26px;
    z-index: 10;
    transform: translateX(-50%);
    width: 110px;
    padding-top: 4px;
    background-color: #e6f1fa;
    border-radius: 0 0 5px 5px;
    overflow: hidden;
}

.login_content .username_login .join-select .select_item[data-v-6bfc405e] {
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
}

.login_content .username_login .join-select .select_item[data-v-6bfc405e]:hover {
    background-color: #6da7fc;
    color: #fff;
}

.login_content .sms-btn[data-v-6bfc405e] {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    font-size: 12px;
    color: #ff726f;
    cursor: pointer;
    vertical-align: middle;
}

.login_content .sms-btn.disabled[data-v-6bfc405e] {
    color: #b7baa8;
}

.login_content .login_btn[data-v-6bfc405e] {
    display: flex;
    align-items: center;
    font-size: 14px;
}

.login_content .br_login_button[data-v-6bfc405e] {
    color: #fff;
    background-color: #66a6fe;
    margin-right: 10px;
    border-radius: 20px;
}

.login_content .br_login_button .text[data-v-6bfc405e] {
    height: 26px;
    display: block;
    text-align: center;
    line-height: 26px;
    padding: 0 25px;
    font-size: 14px;
    cursor: pointer;
    background-color: #66a6fe;
    border-radius: 20px;
    color: #fff;
}

.login_content .br_login_button.firebase[data-v-6bfc405e] {
    position: relative;
    display: flex;
    flex-direction: row;
}

.login_content .br_login_button.firebase .text[data-v-6bfc405e] {
    position: relative;
}

.login_content .br_login_button.firebase .text[data-v-6bfc405e]:after {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 0.5px;
    height: 70%;
    background-color: #fff;
}

.login_content .br_login_button.firebase .drop[data-v-6bfc405e] {
    display: flex;
    width: 30px;
    height: auto;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    color: #888;
}

.login_content .br_login_button.firebase .drop[data-v-6bfc405e]:before {
    content: "";
    position: absolute;
    width: 40px;
    top: 0;
    right: 0;
    bottom: -10px;
}

.login_content .br_login_button.firebase .drop:hover .drop_menu[data-v-6bfc405e] {
    display: block;
}

.login_content .br_login_button.firebase .drop .icon[data-v-6bfc405e] {
    display: block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
}

.login_content .br_login_button.firebase .drop .drop_menu[data-v-6bfc405e] {
    display: none;
    position: absolute;
    width: 120%;
    top: 30px;
    left: -10%;
    z-index: 100;
    background-color: #e6f1fa;
    border-radius: 0 0 10px 10px;
}

.login_content .br_login_button.firebase .drop .drop_menu span[data-v-6bfc405e] {
    height: 28px;
    display: block;
    text-align: center;
    line-height: 28px;
    font-size: 14px;
    cursor: pointer;
    padding: 0 4px !important;
}

.login_content .br_login_button.firebase .drop .drop_menu .item[data-v-6bfc405e] {
    width: 121.5px;
    height: 36.9px;
    margin: 0 auto 12px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
}

.logined_item a {
    color: #1a2c38;
    align-items: center;
    justify-content: center;
    display: flex;
    font-weight: 500;
}

:root {
    --bg: #403e0b;
}

#mobile .menu-mobile-wrapper {
    width: 100%;
    bottom: 0;
    box-sizing: initial !important;
    color: rgba(255, 255, 255, 0.4);
    height: -webkit-max-content;
    height: -moz-max-content;
    height: max-content;
    left: 0;
    position: fixed;
    z-index: 7;
    background-color: #fefefe;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -2px 10px rgba(65, 70, 92, 0.2);
}

#mobile .menu-mobile {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 25px;
}

#mobile .menu-mobile .item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex-direction: column;
}

#mobile .menu-mobile .item img {
    max-width: 25px;
}

#mobile .menu-mobile .item h3 {
    color: #daeaf1;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 0;
}

#mobile header {
    display: flex;
    justify-content: space-between;
    padding: 8px 15px;
}

#mobile header .header__logo img {
    max-width: 122px;
}

#mobile header .header__login {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-right: 29px;
}

#mobile header .header__login a.item {
    color: var(--bg);
    font-size: 14px;
}

#mobile header .header__login a {
    position: relative;
}

#mobile header .header__login a img {
    width: 20px;
    height: 20px;
}

#mobile header .header__login a .red-dot {
    width: 13px;
    text-align: center;
    border-radius: 50%;
    padding: 4px 0px;
    line-height: 0.8;
    height: 13px;
    font-weight: bold;
    font-size: 9px;
    position: absolute;
    right: -8px;
    top: -2px;
    color: #fff;
    background-color: red;
}

#mobile #content .banner__swiper img {
    width: 100%;
    max-height: 100%;
    max-width: unset;
}

#mobile #content .banner__swiper .swiper-button-prev::after,
#mobile #content .banner__swiper .swiper-button-next::after {
    font-size: 16px;
    color: #fff;
}

#mobile #content .banner__swiper .swiper-button-prev,
#mobile #content .banner__swiper .swiper-button-next {
    height: 34px;
    padding: 0;
    width: 34px;
    border-radius: 50px;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0.6;
}

#mobile #content .banner__swiper .swiper-button-prev {
    left: 10px;
}

#mobile #content .banner__swiper .swiper-button-next {
    right: 10px;
}

#mobile #content .notification {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #9aa4c2;
    font-size: 12px;
}

#mobile #content .notification i {
    color: var(--bg);
}

@keyframes scrollLeft {
    0% {
        transform: translate(0);
    }

    to {
        transform: translate(-100%);
    }
}

#mobile #content .notification .marquee-wrap {
    cursor: pointer;
    height: 28px;
    line-height: 27px;
    width: 100%;
}

#mobile #content .notification .marquee-wrap .visible-area {
    height: 100%;
    margin: auto;
    overflow: hidden;
    position: relative;
    width: 100%;
}

#mobile #content .notification .marquee-wrap .marquee-content {
    -webkit-animation-delay: 2s !important;
    animation-delay: 2s !important;
    -webkit-animation-duration: 35.82s !important;
    animation-duration: 35.82s !important;
    color: #9aa4c2;
    box-sizing: border-box;
    margin: 0 auto;
    padding-left: 100%;
    position: absolute;
    white-space: nowrap;
}

#mobile #content .notification .marquee-wrap .marquee-content.scrollLeft {
    -webkit-animation: scrollLeft linear infinite;
    animation: scrollLeft linear infinite;
}

#mobile #content .content-wrapper {
    padding: 0 8px;
}

#mobile #content .content-wrapper .list-action {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 15px;
}

@-webkit-keyframes at-ripple-blue {
    0% {
        box-shadow: 0 4px 10px rgba(111, 155, 180, 0.77), 0 0 0 0 rgba(72, 126, 161, 0.64),
            0 0 0 5px rgba(42, 94, 161, 0.79);
    }

    100% {
        box-shadow: 0 4px 10px rgba(91, 162, 209, 0.19), 0 0 0 5px rgba(80, 157, 219, 0.27),
            0 0 0 10px rgba(126, 196, 237, 0.21);
    }
}

@keyframes at-ripple-blue {
    0% {
        box-shadow: 0 4px 10px rgba(111, 155, 180, 0.77), 0 0 0 0 rgba(72, 126, 161, 0.64),
            0 0 0 5px rgba(42, 94, 161, 0.79);
    }

    100% {
        box-shadow: 0 4px 10px rgba(91, 162, 209, 0.19), 0 0 0 5px rgba(80, 157, 219, 0.27),
            0 0 0 10px rgba(126, 196, 237, 0.21);
    }
}

#mobile #content .content-wrapper .list-action a.telegram {
    border-radius: 50%;
    -webkit-animation: at-ripple-blue 0.6s linear infinite;
    animation: at-ripple-blue 0.6s linear infinite;
}

#mobile #content .content-wrapper .list-action h3 {
    font-size: 11px;
    color: var(--bg);
    font-weight: bold;
}

#mobile #content .content-wrapper .list-action .action {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

#mobile #content .content-wrapper .list-action .action-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
}

#mobile #content .content-wrapper .list-action img {
    width: 30px;
    height: 30px;
}

#mobile #content .content-wrapper .list-game {
    display: flex;
    justify-content: space-between;
    height: calc(100vh - 250px);
    overflow: hidden;
    padding-bottom: 55px;
}

#mobile #content .content-wrapper .list-game ul.nav-tabs {
    flex-direction: column;
    width: 86px;
    padding-right: 10px;
    flex-wrap: nowrap;
    gap: 8px;
    height: 100%;
    overflow: scroll;
}

#mobile #content .content-wrapper .list-game ul.nav-tabs li.nav-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 61px;
    background: #fff;
    border: 0;
    box-shadow: 0 1px 4px 0 rgba(65, 70, 92, 0.2);
    border-radius: 15px;
    color: #9aa4c2;
    flex-shrink: 0;
    position: relative;
    text-align: center;
}

#mobile #content .content-wrapper .list-game ul.nav-tabs li.nav-item a {
    border: unset;
    padding: 0;
    font-size: 14px;
    color: var(--bg);
    height: 100%;
    width: 100%;
    display: flex;
    height: 100;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    align-items: center;
}

#mobile #content .content-wrapper .list-game ul.nav-tabs li.nav-item img {
    width: 30px;
    height: 30px;
}

#mobile #content .content-wrapper .list-game ul.nav-tabs li.nav-item.active {
    background-color: var(--bg);
}

#mobile #content .content-wrapper .list-game ul.nav-tabs li.nav-item.active a,
#mobile #content .content-wrapper .list-game ul.nav-tabs li.nav-item.active span {
    background-color: transparent;
    color: #fff;
}

#mobile #content .content-wrapper .list-game .tab-content {
    width: calc(100% - 86px);
    height: 100%;
    padding-right: 0px;
    overflow: scroll;
}

#mobile #content .content-wrapper .list-game .tab-content::-webkit-scrollbar {
    display: none;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane {
    width: 100%;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane .warning {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.4901960784);
    color: gold;
    border-radius: 6px;
    border: 2px solid;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane .warning i {
    font-size: 24px;
    margin-bottom: 5px;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane .warning span {
    font-size: 12px;
    line-height: 1.2;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane .item {
    position: relative;
    width: 100%;
    height: 128px;
    border-radius: 8px;
    box-shadow: 0 1px 5px rgba(65, 70, 92, 0.2);
    align-items: center;
    margin-bottom: 6px;
    display: block;
}

#mobile #content .content-wrapper .list-game .tab-content .tab-pane .item img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    max-width: unset;
    -o-object-position: 70px;
    object-position: 70px;
}

.promotion-mobile {
    padding: 0 8px;
    padding-bottom: 50px;
}

.promotion-mobile h1 {
    font-size: 16px;
    color: #777777;
    margin-bottom: 0;
    padding: 20px 0;
}

.promotion-mobile select {
    border-radius: unset;
    font-size: 16px;
    text-transform: uppercase;
}

.promotion-mobile .list-promotion .item img {
    width: 100%;
    height: auto;
}

.promotion-mobile .list-promotion .item h3 {
    font-size: 14px;
    color: #777;
    font-weight: bold;
    padding: 5px 0;
}

.promotion-mobile .promotion-mobile {
    padding: 0;
}

.promotion-mobile .promotion-mobile .model-header-content h2 {
    line-height: 1;
    font-size: 19px;
    font-weight: bold;
}

.promotion-mobile .promotion-mobile .model-header-content span {
    font-size: 12px;
    color: rgb(119, 119, 119);
}

.promotion-mobile .promotion-mobile .modal-dialog {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.promotion-mobile .promotion-mobile .modal-content {
    height: auto;
    min-height: 100%;
    border-radius: 0;
}

.promotion-mobile .promotion-mobile .modal-content .modal-body {
    padding: 10px;
    font-size: 16px !important;
}

.promotion-mobile .promotion-mobile .modal-content .modal-body img {
    width: 100% !important;
}

.promotion-mobile .promotion-mobile .modal-content .modal-body h6,
.promotion-mobile .promotion-mobile .modal-content .modal-body h2 {
    font-size: 16px !important;
}

.promotion-mobile .promotion-mobile .modal-content .modal-body pre {
    background: #fff !important;
    border: none !important;
    border-radius: unset !important;
    font-size: 16px !important;
}

.promotion-mobile .promotion-mobile .modal-footer {
    padding: 10px;
}

.promotion-mobile .promotion-mobile .modal-footer button {
    width: 100%;
}

#mobile .setting {
    background-color: #ededed;
    height: 100vh;
}

#mobile .setting .setting__header {
    position: relative;
    padding: 14px 0;
    background-color: #fff;
}

#mobile .setting .setting__header h3 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 0px;
}

#mobile .setting .setting__header a {
    display: block;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

#mobile .setting .setting__header a i {
    color: #403e0b;
}

#mobile .setting .setting__button {
    display: flex;
    justify-content: space-between;
    padding: 15px;
}

#mobile .setting .setting__button a {
    align-items: center;
    background-image: linear-gradient(96deg, #ff9b00 1%, #e64800);
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    height: 36px;
    justify-content: center;
    width: 48%;
}

#mobile .setting .setting__info {
    padding: 0 15px;
    height: 100%;
    overflow-y: auto;
}

#mobile .setting .setting__info-content {
    border-radius: 5px;
    background-color: #fff;
    padding: 0 25px;
}

#mobile .setting .setting__info-content .item {
    padding: 15px;
    border-bottom: 1px solid #e9e9e9;
}

#mobile .setting .setting__info-content .item p:first-child {
    color: #454545;
    font-size: 10px;
    margin-bottom: 0;
    opacity: 0.6;
}

#mobile .setting .setting__info-content .item p:last-child {
    font-size: 14px;
    line-height: 1.29;
    min-height: 18px;
}

#mobile .setting .setting__info-content .item:last-child {
    border: unset;
}

#mobile .changePass {
    background-color: #ededed;
    height: 100vh;
}

#mobile .changePass .changePass__header {
    position: relative;
    padding: 14px 0;
    background-color: #fff;
}

#mobile .changePass .changePass__header h3 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 0px;
}

#mobile .changePass .changePass__header a {
    display: block;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

#mobile .changePass .changePass__header a i {
    color: #403e0b;
}

#mobile .changePass .changePass__form {
    padding: 15px;
}

#mobile .changePass .changePass__form .m-input-field {
    margin-bottom: 10px;
    width: 100%;
}

#mobile .changePass .changePass__form .m-input-field .content {
    background-color: #fff;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    box-sizing: border-box;
    display: flex;
    height: 54px;
    justify-content: space-around;
    padding: 0 15px;
}

#mobile .changePass .changePass__form .m-input-field .content.focus {
    border: 1px solid #403e0b;
    box-shadow: 0 0 10px 0 #403e0b;
}

#mobile .changePass .changePass__form .m-input-field .content .input-block {
    box-sizing: border-box;
    position: relative;
    width: 100%;
}

#mobile .changePass .changePass__form .m-input-field .content .input-block:hover label {
    top: 4px;
    font-size: 10px;
}

#mobile .changePass .changePass__form .m-input-field .content .input-block label {
    color: #929292;
    font-size: 14px;
    line-height: 1.29;
    pointer-events: none;
    position: absolute;
    top: 18px;
    transition: 0.2s;
    padding-left: 12px;
}

#mobile .changePass .changePass__form .m-input-field .content .input-block label::before {
    bottom: 0;
    color: #e94951;
    content: "*";
    font-size: 10px;
    left: 0;
    margin: auto;
    position: absolute;
    top: 4px;
}

#mobile .changePass .changePass__form .m-input-field .content .input-block label.focus {
    top: 4px;
    font-size: 10px;
}

#mobile .changePass .changePass__form .m-input-field .content .input-block input {
    background-color: transparent;
    color: #454545;
    border: none;
    box-sizing: border-box;
    height: 100%;
    position: absolute;
    top: 0;
    transition: 0.2s;
    width: 100%;
    padding: 0;
}

#mobile .changePass .changePass__form .m-input-field .content .action-block {
    color: #403e0b;
    display: flex;
    justify-content: flex-end;
    width: 15%;
}

#mobile .changePass .changePass__form .m-input-field .content .action-block>div {
    align-items: center;
    display: flex;
}

#mobile .changePass .changePass__form .m-input-field .content .action-block>div i {
    cursor: pointer;
    font-size: 24px;
}

#mobile .changePass .changePass__form .m-input-field .info-msg {
    color: #787878;
    display: flex;
    font-size: 8px;
    margin: 5px 0 10px;
}

#mobile .changePass .changePass__form .m-input-field .info-msg small {
    color: #787878;
    font-size: 13px;
}

#mobile .changePass .changePass__form button {
    margin-top: 20px;
    background-color: #00aae6;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    height: 44px;
    width: 100%;
}

.app .navbar-wrapper.active {
    display: none;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container {
    padding: 0;
    padding-top: 50px;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container .right {
    border-radius: unset;
    width: 100%;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container .right .main-content {
    width: 100%;
    padding: 5px 15px;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container .right .main-content>.title {
    display: flex;
    justify-content: space-between;
    font-weight: 500;
    font-size: 16px;
    margin: 0;
    margin-bottom: 15px;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container .right .main-content>.title span a {
    color: #454545;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container .right .main-content .vip-display .vip-level {
    width: 100%;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege>.title {
    color: inherit;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
}

.app .navbar-wrapper #body-web-info-vip .wrap-info .info-container .right .main-content .vip-privilege .box {
    grid-template-columns: repeat(2, 1fr);
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container {
    padding: 0;
    padding-top: 50px;
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container .right {
    border-radius: unset;
    width: 100%;
    display: unset;
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container .right .sub-content {
    width: 100%;
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs {
    display: unset;
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs li {
    width: unset;
    text-align: start;
    background-color: #fff;
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container .right .sub-content .nav-tabs li a {
    padding: 0;
    margin-left: 15px;
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content {
    background-color: #fff;
    width: 100%;
    padding: 10px;
    height: calc(100vh - 117px);
}

.app .navbar-wrapper:last-child #body-web-info-vip .wrap-info .info-container .right .sub-content .tab-content .tab-pane .infinite-loader-wrapper .infinite-load-item {
    width: 100%;
    height: 100%;
}

.app .center-main {
    overflow: hidden;
}

.app #body-web-vip .swiper {
    width: 350px;
}

.app #body-web-vip .main-wrap {
    max-width: unset;
    margin-top: 50px;
    font-size: 10px;
}

.app #body-web-vip .main-wrap .swiper-box .swiper-wrapper .swiper-slide {
    width: 350px !important;
}

.app #body-web-vip .main-wrap .vip-box {
    width: unset;
    padding: 0 15px;
}

.app #body-web-vip .main-wrap .vip-box .vip-privilege table {
    font-size: 14px;
    margin-bottom: 25px;
}

.app #body-web-vip .main-wrap .vip-box .vip-rules h2 {
    margin: 10px auto;
    font-weight: 700;
    font-size: 16px;
}

.app #body-web-vip .main-wrap .vip-box .vip-rules p {
    font-size: 14px;
}

.app #body-web-vip .main-wrap .vip-box .vip-rules table {
    margin-bottom: 15px;
    font-size: 10px;
}

.app #body-web-vip .main-wrap .vip-box .vip-rules table tr:first-child {
    text-transform: uppercase;
}

.app #body-web-vip .main-wrap .vip-box .vip-rules h3 {
    font-size: 14px;
}

#mobile .showWallet {
    background-color: #ededed;
    min-height: 100vh;
    padding-bottom: 70px;
}

#mobile .showWallet .showWallet__header {
    position: relative;
    padding: 14px 0;
    background-color: #fff;
}

#mobile .showWallet .showWallet__header h3 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 0px;
}

#mobile .showWallet .showWallet__header a {
    display: block;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

#mobile .showWallet .showWallet__header a i {
    color: #403e0b;
}

#mobile .showWallet .showWallet__info {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
    margin-bottom: 5px;
}

#mobile .showWallet .showWallet__info span:last-child {
    color: #ff9b00;
    line-height: 1;
    font-size: 24px;
    display: flex;
    align-items: center;
    gap: 5px;
}

#mobile .showWallet .showWallet__info span:last-child i {
    color: #000;
    font-size: 15px;
}

#mobile .showWallet .showWallet__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 0 15px;
    gap: 10px;
}

#mobile .showWallet .showWallet__list .item {
    background-color: #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
}

#mobile .showWallet .showWallet__list .item h5 {
    border-bottom: 1px solid #e9e9e9;
    color: #454545;
    font-size: 14px;
    padding: 5px 0;
    margin-bottom: 0;
}

#mobile .showWallet .showWallet__list .item span {
    padding: 6px 0;
    display: block;
    color: #5f5f5f;
}

#mobile .serviceCustomer {
    background-color: #ededed;
    height: 100vh;
}

#mobile .serviceCustomer__header {
    position: relative;
    padding: 14px 0;
    background-color: #fff;
}

#mobile .serviceCustomer__header h3 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 0px;
}

#mobile .serviceCustomer__header a {
    display: block;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

#mobile .serviceCustomer__header a i {
    color: #403e0b;
}

#mobile .serviceCustomer__body {
    background-color: #fff;
    padding: 0 15px;
    margin-top: 15px;
}

#mobile .serviceCustomer__body .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    padding: 20px 0;
}

#mobile .serviceCustomer__body .item:first-child {
    border-bottom: 1px solid #e9e9e9;
}

#mobile .serviceCustomer__body .item span,
#mobile .serviceCustomer__body .item i {
    color: #000;
}

#mobile .serviceCustomer__body .item span i,
#mobile .serviceCustomer__body .item i i {
    margin-right: 10px;
}

#mobile .serviceCustomer__body .item>i {
    color: #403e0b;
}

#mobile .serviceCustomer__body.history .item {
    border-bottom: 1px solid #e9e9e9;
}

#mobile .serviceCustomer__body.history .item:last-child {
    border: unset;
}

#mobile .serviceCustomer .modal-dialog {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

#mobile .serviceCustomer .modal-content {
    height: auto;
    min-height: 100%;
    border-radius: 0;
}

#mobile .serviceCustomer .modal-content h2 {
    font-size: 20px;
}

#mobile .serviceCustomer .modal-content .modal-body {
    background-color: #ededed;
}

#mobile .historyGame {
    background-color: #ededed;
    height: 100vh;
}

#mobile .historyGame__header {
    position: relative;
    padding: 14px 0;
    background-color: #fff;
}

#mobile .historyGame__header h3 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 0px;
}

#mobile .historyGame__header a {
    display: block;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

#mobile .historyGame__header a i {
    color: #403e0b;
}

#mobile .historyGame__body {
    background-color: #fff;
    padding: 0 15px;
    padding-top: 20px;
    padding-bottom: 10px;
}

#mobile .historyGame__body .form-group {
    position: relative;
}

#mobile .historyGame__body .form-group label {
    position: absolute;
    font-size: 10px;
    top: 5px;
    left: 15px;
}

#mobile .historyGame__body .form-group select,
#mobile .historyGame__body .form-group input {
    height: 50px;
    font-size: 15px;
    padding-top: 20px;
}

#mobile .historyGame__body .form-group button {
    background-color: #00aae6;
    border: none;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    height: 44px;
    width: 100%;
}

#mobile .historyGame .search-box {
    background-color: #fff;
}

#mobile .historyGame .search-box .content {
    padding: 10px;
}

#mobile .historyGame .search-box .content .search-item {
    display: flex;
    justify-content: space-between;
    padding: 5px 10px;
    border-bottom: 1px solid #ccc;
}

#mobile .historyGame .search-box .content .search-item:last-child {
    border-bottom: unset;
}

#mobile .historyGame .search-box .content .search-item .detail {
    font-weight: 700;
}

.popup_mobile .hide-annou-content {
    display: none;
}

.popup_mobile .announcement-list {
    position: fixed;
    z-index: 200;
    width: 100%;
    height: 100%;
    top: 0;
}

.popup_mobile .annou-content {
    font-size: 14px;
    white-space: unset !important;
}

.popup_mobile .announcement-list .bg-popup {
    position: absolute;
    background: #000;
    width: 100%;
    height: 100%;
    opacity: 0.5;
}

.popup_mobile .announcement-list .annoucement-container {
    position: relative;
    background: #fff;
    width: 90%;
    height: 375px;
    margin: auto;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 5px;
}

.popup_mobile .announcement-list .annou-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.popup_mobile .announcement-list .annou-header .title-center {
    display: block;
    text-align: center;
    width: 100%;
    font-size: 23px;
    margin-bottom: 15px;
    margin-top: 45px;
    line-height: 1;
    font-weight: bolder;
    text-transform: capitalize;
}

.popup_mobile .announcement-list .annou-header .close-icon {
    position: absolute;
    right: 12px;
    top: 10px;
}

.popup_mobile .announcement-list .annou-header .close-icon i {
    font-size: 26px;
    cursor: pointer;
}

.popup_mobile .announcement-list .annou-wrap ul {
    padding: 0;
    margin: 0;
}

.popup_mobile .announcement-list .annou-wrap ul .annou-item {
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    height: auto;
    list-style: none;
    overflow: hidden;
    padding: 10px 30px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.popup_mobile .announcement-list .annou-wrap ul .annou-item .annou-date {
    color: #4868e7;
    font-size: 12px;
    margin-bottom: 5px;
}

.popup_mobile .announcement-list .close-btn button {
    display: block;
    margin: 26px auto;
    width: calc(100% - 62px);
    background-color: #4868e7;
    border: none;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    height: 44px;
    outline: none;
}

.popup_mobile .current-annou {
    background: #fff;
    border-right: 1px solid #fff !important;
}

.popup_mobile .popup-center img {
    width: 100%;
}

.popup_mobile .popup-center {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 120;
    top: 0;
    left: 0;
}

.popup_mobile .popup-center .bg-popup {
    background-color: #000;
    opacity: 0.5;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 29;
}

.popup_mobile .popup-center .popup-center-content {
    z-index: 130;
    position: relative;
    color: #fff;
    display: flex;
    width: 1050px;
    margin: 175px auto;
}

.popup_mobile .popup-center .popup-center-content .left-box {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 95%;
}

.popup_mobile .popup-center .popup-center-content .left {
    flex: 1;
    background-color: #fff;
}

.popup_mobile .current-popup {
    background-color: #000682;
    color: #fff !important;
}

.popup_mobile .popup-center .popup-center-content .left ul li {
    text-align: center;
    border-bottom: 1px solid #e6e6e6;
    color: #777;
    cursor: pointer;
    min-height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup_mobile .popup-center .popup-center-content .left ul li h3 {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1.4;
}

.popup_mobile .popup-center .close-popup {
    position: absolute;
    top: 162px;
    z-index: 150;
    right: 422px;
}

.popup_mobile .popup-center .close-popup .icon-close {
    width: 30px;
    height: 30px;
    text-align: center;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
}

.popup_mobile .popup-center .close-popup .icon-close i {
    font-size: 25px;
    color: rgb(0, 0, 0);
    line-height: 1.2;
}

.popup_mobile .hide-popup-img {
    display: none !important;
}

.popup_mobile .popup-center-content-2 {
    z-index: 200;
}

.popup_mobile .popup-center-content-2 .mySwiperPopup {
    z-index: 201;
    width: 370px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: fixed;

}

.popup_mobile .popup-center-content-2 .mySwiperPopup .swiper-slide .box-detail .content {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #4868e7;
    min-height: 60px;
}

.popup_mobile .popup-center-content-2 .mySwiperPopup .swiper-slide .box-detail .content h3 {
    color: #fff;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
}

.popup_mobile .popup-center .close-popup-2 {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 210;
}

.popup_mobile .popup-center .close-popup-2 .icon-close-2 {
    width: 30px;
    height: 30px;
    text-align: center;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
}

.popup_mobile .popup-center .close-popup-2 .icon-close-2 i {
    font-size: 25px;
    color: rgb(0, 0, 0);
    line-height: 1.2;
}

.popup_mobile .hide-popup-img {
    display: none !important;
}


@media (max-width: 1200px) {
    body header .bottom-head .container-web .main-menu .menu-item .nav-item {
        display: flex;
    }

    body header .bottom-head .container-web .main-menu .menu-item {
        font-size: 12px;
        padding: 21px 5px;
    }
}

@media (max-width: 800px) {
    body header .bottom-head .container-web .main-menu .menu-item {

        font-size: 10px;
        padding: 18px 2px;
    }

    body header .bottom-head .container-web .logo img {
        width: 110px !important;
    }

    .recommend-wrap .special-title[data-v-4c7406bb] {
        font-size: 28px;

    }

    .recommend-wrap .special-title[data-v-4c7406bb]:before {
        width: 200px;
    }

    .recommend-wrap .special-title[data-v-4c7406bb]:after {
        width: 200px;
    }

    body header .bottom-head .container-web {
        width: 85%;
    }
}

.home-promotion .container-web {
    width: 100%;
    padding-top: 40px;
}

.home-promotion .promo-list {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    width: 100%;
}

.home-promotion .promo-list .video iframe {
    vertical-align: middle;
    width: 100%;
    height: 450px;
}

.home-promotion .promo-list .video-text {
    color: #fff;
    display: flex;
    font-size: 14px;
    line-height: 1.2;
    margin-top: 0px;
    min-height: 55px;
    padding: 10px 15px;
    width: 100%;
    align-items: center;
    border-radius: 0;
    background-image: linear-gradient(90deg, #ce3900, #d95420);
}
footer .footer-title {
    color: #f5dab2;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px
}

footer .footer-content {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    border-bottom: 1px solid #fff;
}

footer .footer-content>* {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin: 0 30px 20px
}

footer .footer-content>* .footer-title {
    margin: 25px 0 35px
}

footer .footer-content .footer-index-logo {
    display: block;
    margin: 0 auto 15px;
    width: 200px
}

footer .footer-content .footer-about {
    color: #fff;
    font-size: 16px;
    line-height: 1.2;
    margin-bottom: 15px;
    text-align: justify
}

footer .footer-content .footer-about span {
    cursor: pointer
}

footer .footer-content .footer-about span:hover {
    color: #3cc2ea
}

footer .footer-content .footer-logos {
    display: flex;
    justify-content: space-between
}

footer .footer-content .footer-logos img {
    display: block;
    height: 65px;
    margin: 5px;
}

footer .footer-content .footer-links {
    display: flex;
    flex-wrap: wrap
}

footer .footer-content .footer-links>* {
    color: #fff;
    display: block;
    font-size: 15px;
    margin-bottom: 20px;
    text-decoration: none;
    transition: color .3s;
    white-space: nowrap;
    width: 50%
}

footer .footer-content .footer-links>:hover {
    color: #fa2c11
}

footer .footer-content .footer-payment-list {
    display: flex;
    flex-wrap: wrap
}

footer .footer-content .footer-payment-list>* {
    cursor: pointer;
    display: block;
    filter: grayscale(1) opacity(.8);
    height: 30px;
    margin: 10px;
    transition: all .2s ease-in
}

footer .footer-content .footer-payment-list>:hover {
    filter: grayscale(0) opacity(1)
}

footer .footer-provider {
    margin-bottom: 10px
}

footer .footer-provider .provider-list-box {
    justify-content: center
}