@font-face {
    font-family: "BeVietnam-Bold";
    src: url("../assets/fonts/BeVietnam-Bold.ttf")
}

@font-face {
    font-family: "BeVietnamPro-Regular";
    src: url("../assets/fonts/BeVietnamPro-Regular.ttf")
}

@font-face {
    font-family: "Kanit-Light";
    src: url("../assets/fonts/Kanit-Light.ttf")
}

@font-face {
    font-family: "UTMBanqueB";
    src: url("../assets/fonts/UTMBanqueB.ttf")
}

@font-face {
    font-family: "UTMBanqueR";
    src: url("../assets/fonts/UTMBanqueR.ttf")
}

@font-face {
    font-family: "Roboto-Bold";
    src: url("../assets/fonts/Roboto-Bold.ttf")
}

@font-face {
    font-family: "Roboto-Regular";
    src: url("../assets/fonts/Roboto-Regular.ttf")
}

@keyframes nn {
    0% {
        -webkit-filter: brightness(1);
        filter: brightness(1);
        transition: .1s;
        -moz-transition: .1s;
        -o-transition: .1s
    }

    50% {
        -webkit-filter: brightness(1.1);
        filter: brightness(1.1);
        transition: .1s;
        -moz-transition: .1s;
        -o-transition: .1s
    }

    100% {
        -webkit-filter: brightness(1);
        filter: brightness(1);
        transition: .1s;
        -moz-transition: .1s;
        -o-transition: .1s
    }
}

.header-active {
    color: #00fcff !important
}

    .header-active::after {
        content: "";
        position: absolute;
        bottom: -22px;
        left: 50%;
        transform: translateX(-50%);
        height: 6px;
        width: 50%;
        background: url(../assets/images/k-5.png);
        background-size: 100% 100%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%)
    }

.header-active1::after {
    width: 80%
}

.mySwiper3 .swiper-slide-thumb-active {
    background: url(../assets/images/btn-8.png);
    background-size: 100% 100%
}

.mySwiper4 .swiper-slide-thumb-active a {
    color: #6fedff
}

.control a.active {
    color: #fff
}

.control2.active, .control2:hover {
    color: #e62f41;
    border-color: #e62f41
}

.footer {
    background: #000;
    display: flex;
    padding: 36px 0 12px;
    align-items: center;
    justify-content: center;
    color: #fff
}

    .footer .container {
        display: flex
    }

    .footer span {
        font-size: 16px;
        line-height: 1.375
    }

    .footer a {
        text-decoration: none;
        color: #fff;
        font-size: 16px;
        line-height: 1.375
    }

.footer-logo {
    display: flex;
    flex-direction: column;
    width: 40%
}

    .footer-logo span {
        display: flex;
        flex-direction: column;
        font-size: 16px;
        line-height: 1.375;
        font-family: "BeVietnam-Bold";
        color: #fff
    }

        .footer-logo span strong {
            margin-top: 3px
        }

.footer-logo__img {
    display: flex;
    position: relative;
    align-items: center
}

    .footer-logo__img::after {
        content: "";
        position: absolute;
        display: block;
        width: 10px;
        height: 10px;
        top: 13px;
        left: 88px
    }

    .footer-logo__img img {
        margin-bottom: 24px;
        object-fit: contain;
        height: 30px
    }

        .footer-logo__img img:nth-child(1) {
            margin-right: 10px
        }

        .footer-logo__img img:nth-child(2) {
            margin-left: 10px;
            width: 176px
        }

.footer-info {
    width: 30%;
    display: flex;
    flex-direction: column;
    display: flex;
    flex-direction: column;
    margin-bottom: 32px
}

    .footer-info span {
        color: #fff;
        font-size: 16px;
        line-height: 1.375;
        font-family: "BeVietnam-Bold"
    }

    .footer-info > a {
        font-size: 16px;
        line-height: 1.375;
        font-family: "BeVietnamPro-Regular";
        margin-top: 5px;
        margin-bottom: 26px
    }

    .footer-info table tr {
        height: 30px
    }

        .footer-info table tr td {
            height: 30px;
            display: flex;
            align-items: center
        }

            .footer-info table tr td a {
                font-size: 16px;
                line-height: 1.375;
                font-family: "BeVietnamPro-Regular"
            }

            .footer-info table tr td img {
                margin-right: 10px;
                filter: invert(82%) sepia(100%) saturate(0%) hue-rotate(302deg) brightness(110%) contrast(101%)
            }

        .footer-info table tr:nth-child(1) td {
            font-family: "BeVietnam-Bold";
            color: #fff;
            padding-bottom: 5px
        }

.footer-address {
    width: 30%;
    display: flex;
    flex-direction: column
}

.footer-address__item {
    margin-bottom: 26px
}

    .footer-address__item h5 {
        font-family: "BeVietnam-Bold";
        font-size: 16px;
        line-height: 1.375;
        color: #fff
    }

    .footer-address__item p {
        margin-top: 5px;
        font-size: 16px;
        line-height: 1.375;
        font-family: "BeVietnamPro-Regular"
    }

.swiper-pagination span {
    width: 35px;
    height: 4px;
    background-color: #23c0f4;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0
}

.hs-collapse-toggle.open img {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg)
}

#tabs-with-icons-item-1.active, #tabs-with-icons-item-2.active {
    color: #00eaff
}

.active-co.active {
    color: #00eaff;
    background: url(../assets/images/qa-btn-4.png);
    background-size: 100% 100%
}

.no-scrollbar::-webkit-scrollbar {
    display: none
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none
}

@media(min-width: 740px)and (max-width: 1280px) {
    .footer-logo span {
        font-size: 14px
    }

    .footer-info span {
        font-size: 14px
    }

    .footer-info > a {
        font-size: 12px
    }

    .footer-info table tr:nth-child(1) td {
        font-size: 14px
    }

    .footer-address__item h5 {
        font-size: 14px
    }

    .footer-address__item p {
        font-size: 12px
    }
}

@media(min-width: 993px)and (max-width: 1399px) {
    .hidepc {
        display: none
    }
}

@media(min-width: 769px)and (max-width: 992px) {
    .footer {
        height: unset
    }

        .footer .container {
            flex-direction: column
        }

    .footer-info {
        width: 100%
    }

        .footer-info > a {
            margin-top: 14px
        }

    .footer-address {
        width: 100%
    }

    .footer-logo {
        width: 100%;
        line-height: 1.6
    }
}

@media(max-width: 768px) {
    .footer {
        height: unset
    }

        .footer .container {
            flex-direction: column
        }

    .footer-info {
        width: 100%
    }

        .footer-info > a {
            margin-top: 12px
        }

    .footer-address {
        width: 100%
    }

    .footer-logo {
        width: 100%;
        line-height: 1.6
    }
}

.night {
    position: fixed;
    width: 100%;
    height: 100%;
    transform: rotateZ(45deg);
    top: 0;
    z-index: 1
}

.night1 {
    left: -33.3333333333%
}

.night2 {
    left: 33.3333333333%
}

.night3 {
    right: 0
}

.shooting_star {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 2px;
    background: linear-gradient(-45deg, rgb(95, 145, 255), rgba(0, 0, 255, 0));
    border-radius: 999px;
    filter: drop-shadow(0 0 6px rgb(105, 155, 255));
    animation: tail 3000ms ease-in-out infinite,shooting 3000ms ease-in-out infinite
}

    .shooting_star::before {
        content: "";
        position: absolute;
        top: calc(50% - 1px);
        right: 0;
        height: 2px;
        background: linear-gradient(-45deg, rgba(0, 0, 255, 0), rgb(95, 145, 255), rgba(0, 0, 255, 0));
        transform: translateX(50%) rotateZ(45deg);
        border-radius: 100%;
        animation: shining 3000ms ease-in-out infinite
    }

    .shooting_star::after {
        content: "";
        position: absolute;
        top: calc(50% - 1px);
        right: 0;
        height: 2px;
        background: linear-gradient(-45deg, rgba(0, 0, 255, 0), rgb(95, 145, 255), rgba(0, 0, 255, 0));
        transform: translateX(50%) rotateZ(45deg);
        border-radius: 100%;
        animation: shining 3000ms ease-in-out infinite;
        transform: translateX(50%) rotateZ(-45deg)
    }

    .shooting_star:nth-child(1) {
        top: calc(50% - 171px);
        left: calc(50% - 242px);
        animation-delay: 1128ms
    }

        .shooting_star:nth-child(1)::before, .shooting_star:nth-child(1)::after {
            animation-delay: 1128ms
        }

    .shooting_star:nth-child(2) {
        top: calc(50% - 98px);
        left: calc(50% - 176px);
        animation-delay: 4110ms
    }

        .shooting_star:nth-child(2)::before, .shooting_star:nth-child(2)::after {
            animation-delay: 4110ms
        }

    .shooting_star:nth-child(3) {
        top: calc(50% - 58px);
        left: calc(50% - 35px);
        animation-delay: 3334ms
    }

        .shooting_star:nth-child(3)::before, .shooting_star:nth-child(3)::after {
            animation-delay: 3334ms
        }

    .shooting_star:nth-child(4) {
        top: calc(50% - 178px);
        left: calc(50% - 214px);
        animation-delay: 1251ms
    }

        .shooting_star:nth-child(4)::before, .shooting_star:nth-child(4)::after {
            animation-delay: 1251ms
        }

    .shooting_star:nth-child(5) {
        top: calc(50% - -165px);
        left: calc(50% - 273px);
        animation-delay: 4791ms
    }

        .shooting_star:nth-child(5)::before, .shooting_star:nth-child(5)::after {
            animation-delay: 4791ms
        }

    .shooting_star:nth-child(6) {
        top: calc(50% - -199px);
        left: calc(50% - 195px);
        animation-delay: 2532ms
    }

        .shooting_star:nth-child(6)::before, .shooting_star:nth-child(6)::after {
            animation-delay: 2532ms
        }

    .shooting_star:nth-child(7) {
        top: calc(50% - 110px);
        left: calc(50% - 125px);
        animation-delay: 7409ms
    }

        .shooting_star:nth-child(7)::before, .shooting_star:nth-child(7)::after {
            animation-delay: 7409ms
        }

    .shooting_star:nth-child(8) {
        top: calc(50% - -196px);
        left: calc(50% - 122px);
        animation-delay: 1606ms
    }

        .shooting_star:nth-child(8)::before, .shooting_star:nth-child(8)::after {
            animation-delay: 1606ms
        }

    .shooting_star:nth-child(9) {
        top: calc(50% - 6px);
        left: calc(50% - 106px);
        animation-delay: 4260ms
    }

        .shooting_star:nth-child(9)::before, .shooting_star:nth-child(9)::after {
            animation-delay: 4260ms
        }

    .shooting_star:nth-child(10) {
        top: calc(50% - -8px);
        left: calc(50% - 140px);
        animation-delay: 8291ms
    }

        .shooting_star:nth-child(10)::before, .shooting_star:nth-child(10)::after {
            animation-delay: 8291ms
        }

    .shooting_star:nth-child(11) {
        top: calc(50% - -46px);
        left: calc(50% - 217px);
        animation-delay: 4960ms
    }

        .shooting_star:nth-child(11)::before, .shooting_star:nth-child(11)::after {
            animation-delay: 4960ms
        }

    .shooting_star:nth-child(12) {
        top: calc(50% - -13px);
        left: calc(50% - 106px);
        animation-delay: 480ms
    }

        .shooting_star:nth-child(12)::before, .shooting_star:nth-child(12)::after {
            animation-delay: 480ms
        }

    .shooting_star:nth-child(13) {
        top: calc(50% - -80px);
        left: calc(50% - 123px);
        animation-delay: 4504ms
    }

        .shooting_star:nth-child(13)::before, .shooting_star:nth-child(13)::after {
            animation-delay: 4504ms
        }

    .shooting_star:nth-child(14) {
        top: calc(50% - 102px);
        left: calc(50% - 268px);
        animation-delay: 1570ms
    }

        .shooting_star:nth-child(14)::before, .shooting_star:nth-child(14)::after {
            animation-delay: 1570ms
        }

    .shooting_star:nth-child(15) {
        top: calc(50% - -17px);
        left: calc(50% - 83px);
        animation-delay: 4441ms
    }

        .shooting_star:nth-child(15)::before, .shooting_star:nth-child(15)::after {
            animation-delay: 4441ms
        }

    .shooting_star:nth-child(16) {
        top: calc(50% - -125px);
        left: calc(50% - 130px);
        animation-delay: 9243ms
    }

        .shooting_star:nth-child(16)::before, .shooting_star:nth-child(16)::after {
            animation-delay: 9243ms
        }

    .shooting_star:nth-child(17) {
        top: calc(50% - 96px);
        left: calc(50% - 52px);
        animation-delay: 4239ms
    }

        .shooting_star:nth-child(17)::before, .shooting_star:nth-child(17)::after {
            animation-delay: 4239ms
        }

    .shooting_star:nth-child(18) {
        top: calc(50% - 161px);
        left: calc(50% - 16px);
        animation-delay: 3469ms
    }

        .shooting_star:nth-child(18)::before, .shooting_star:nth-child(18)::after {
            animation-delay: 3469ms
        }

    .shooting_star:nth-child(19) {
        top: calc(50% - 61px);
        left: calc(50% - 155px);
        animation-delay: 9568ms
    }

        .shooting_star:nth-child(19)::before, .shooting_star:nth-child(19)::after {
            animation-delay: 9568ms
        }

    .shooting_star:nth-child(20) {
        top: calc(50% - 76px);
        left: calc(50% - 122px);
        animation-delay: 4974ms
    }

        .shooting_star:nth-child(20)::before, .shooting_star:nth-child(20)::after {
            animation-delay: 4974ms
        }

@keyframes tail {
    0% {
        width: 0
    }

    30% {
        width: 100px
    }

    100% {
        width: 0
    }
}

@keyframes shining {
    0% {
        width: 0
    }

    50% {
        width: 30px
    }

    100% {
        width: 0
    }
}

@keyframes shooting {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(300px)
    }
}

@keyframes sky {
    0% {
        transform: rotate(45deg)
    }

    100% {
        transform: rotate(405deg)
    }
}
.bxh.active {
    background-image: url(../assets/images/bxh-btn1.png);
    color: #00e6ec
}

.bxh-control.active {
    background: #019cfc
}

@font-face {
    font-family: "Kanit-Regular";
    src: url("../assets/fonts/Kanit-Regular.ttf")
}

@font-face {
    font-family: "Kanit-Medium";
    src: url("../assets/fonts/Kanit-Medium.ttf")
}

@font-face {
    font-family: "UTMAvoBold";
    src: url("../assets/fonts/UTMAvoBold.ttf")
}
.manh-css table{width:100% !important}
.manh-css table tr th, .manh-css table tr td {
    border: 1px solid #000;
    vertical-align:middle;
    text-align:center;
    padding:0 5px;
}
.manh-css img{
    max-width: 95%;
    margin: auto;
    display: block;
    object-fit:contain;
}
.manh-btn:hover {
    transform: scale(1.1)
}
.manh-css table {
    width: auto !important;
    max-width: 100%;
    margin: auto;
    color: #000 !important;
}

    .manh-css table tr th,
    .manh-css table tr td {
        text-wrap: wrap;
    }

    .manh-css table tbody tr:nth-child(1) span {
        font-size: 16px !important;
    }

    .manh-css table span {
        font-size: 14px !important;
    }

@media (min-width: 1024px) {
    .manh-css table tbody tr:nth-child(1) span {
        font-size: 18px !important;
    }

    .manh-css table span {
        font-size: 18px !important;
    }
}
.manh-scrollbar{
    height:600px;
    overflow:hidden;
    overflow-y:scroll;

}
.manh-scrollbar::-webkit-scrollbar {
   display:none;
}
.manh-bg::after {
    content: "";
    position: absolute;
    top: -20px;
    left: 0;
    display: block;
    width: 100%;
    height: 20px;
    background: url(/Content/assets/images/k-update2.png);
    background-size: 100%;
}

.manh-bg::before {
    content: "";
    position: absolute;
    bottom: -19px;
    left: 0;
    display: block;
    width: 100%;
    height: 20px;
    background: url(/Content/assets/images/k-update3.png);
    background-size: 100%;
}
@media (max-width : 768px){
    .valid-age {
        z-index: 10;
        scale: 0.5;
        margin-left: -37px;
        margin-top: -20px;
    }
    .manh-bg::after {
        top: -12px;
        background-repeat:no-repeat;
    }

    .manh-bg::before {
        bottom: -11px;
        background-repeat: no-repeat;
    }
}

