@media (min-width: 1920px) {
    body {
        background-size: cover;
    }
}



@media (max-width: 1560px) {
    .news {
        margin-top: 5vw;
    }

    .nhanvat {
        margin-top: 0vw;
    }

    .daily-seemore a {
        font-size: 13px;
    }

    .bg-detail {
        height: 156vw;
    }
	
	
}


@media (max-width: 1430px) {
    .main-menu .menu-social .mainmenu--icon ul li {
        width: 1.75vw;
    }
}

@media (max-width: 1280px) {
    .content-daily .menu-tab li a {
        font-size: 14px;
    }

    .nhanvat .contentnv {
        font-size: 14px;
    }

    .tinhnang .slick-list {
        padding-top: 3% !important;
    }

    .footer-inner {
        max-width: 100%;
    }

    .product-info {
        display: inline-flex;
        gap: 4vw;
        align-items: flex-start;
        padding-bottom: 2vw;
        width: 65vw;
        margin: auto;
    }

    .daily-content-text a {
        font-size: 13px;
    }

    .bg-detail {
        height: 160vw;
    }

    .bg-detail .title {
        font-size: 18px;
    }

    .nap-the-box,
    .nap-the-card {
        width: 56vw;
    }

}

@media (max-width: 1080px) {
    .content-daily .menu-tab li a {
        font-size: 12px;
    }

    .nhanvat .contentnv {
        font-size: 12px;
    }

    .bg-detail {
        height: 180vw;
    }

}


/* Mobile */

@media (max-width: 1000px) {

    .pc {
        display: none !important;
    }

    .mb {
        display: block !important;
    }

    body {
        background: url(../images/bgmb-detail.png) top center no-repeat;
        background-size: contain;
    }

    .figuretop,
    .slogan {
        display: none;
    }

    .wrapper {
        margin-top: 120vw;
    }

    .main-menu .menu-bg {
        background: transparent;
        width: 100%;
        height: 38vw;
        margin: auto;
    }

    .main-menu .menu--icon ul li img {
        width: 46vw;
    }

    .main-menu .menu--icon {
        width: 64vw;
    }

    .menu--dkymb ul li {
        display: inline-block;
        width: 100%;
    }

    .menu--dkymb ul li img {
        width: 35vw;
        margin-top: 0.325vw;

    }

    .main-menu .layout-flex {
        flex-direction: column;
    }

    .news .news-bg {
        background: transparent;
        height: auto;
        padding: 5vw 6vw 1vw 6vw;
        z-index: 1;
    }

    .newslayout {
        display: inline-flex;
        width: 100%;
        flex-direction: column;
    }

    .new--img {
        width: 84.5vw;
        margin: auto;
    }

    .news--content {
        width: 84vw;
        margin: 3vw 0 0 2vw;
    }

    .content-daily .menu-tab li,
    .content-daily .menu-tab .active,
    .content-daily .menu-tab li:hover {
        width: 20vw;
        height: 5.5vw;
        background-size: cover;
    }

    .news--content .daily-detail .menu-tab {
        justify-content: space-between;
    }

    .content-daily .menu-tab li a {
        font-size: 16px;
    }

    .daily-content-text a {
        font-size: 14px;
        padding: 3.65vw 0px 2.5vw;
    }

    .daily-seemore {
        position: absolute;
        bottom: -10.75vw;
        right: 0;
        left: 50%;
        transform: translate(-50%, 0);
        background: url(../images/bangtt-seemoremb.png) top center no-repeat;
        background-size: contain;
        width: 85%;
        height: 6vw;
    }

    .daily-seemore a {
        font-size: 14px;
    }


    .nhanvat {
        margin-top: 22vw;
    }

    .nhanvat .title {
        width: 86%;
        margin: auto;
    }

    .nhanvat .nv-layout {
        flex-direction: column-reverse;
        width: 100%;
        margin: auto;
    }

    .nhanvat .nv-figure {
        width: 128vw;
        position: relative;
    }

    .nhanvat .nv-figure .nveffect {
        position: absolute;
        top: -1vw;
        left: 4vw;
        width: 88.125vw;
        height: auto;
        z-index: -1;
    }

    .nhanvat .nv-figure .nvline {
        position: absolute;
        top: 9vw;
        right: 33vw;
        width: 40.7125vw;
        height: auto;
        z-index: -1;
        display: inline-block;
        transform: rotate(18deg) !important;
    }

    .nhanvat .slick-dots li button {

        padding: 0 0.5vw;
    }

    .nhanvat .slick-dots {
        margin-top: -6vw;
        margin-bottom: 30vw;
    }

    .nhanvat .slick-dots li:nth-child(1) button::before {
        top: -90vw;
        right: -3vw;
        width: 9.375vw;
        height: 9.125vw;
    }

    .nhanvat .slick-dots li:nth-child(2) button::before {
        top: -77vw;
        right: -3vw;
        width: 9.375vw;
        height: 9.125vw;
    }

    .nhanvat .slick-dots li:nth-child(3) button::before {
        top: -66vw;
        right: 1.5vw;
        width: 9.375vw;
        height: 9.125vw;
    }

    .nhanvat .slick-dots li:nth-child(4) button::before {
        top: -56vw;
        right: 10vw;
        width: 9.375vw;
        height: 9.125vw;
    }

    .nhanvat .slick-dots li:nth-child(5) button::before {
        top: -49vw;
        right: 21vw;
        width: 9.375vw;
        height: 9.125vw;
    }

    .nhanvat .nv-info--bg {
        background: url(../images/framemb-kim.png) top center no-repeat;
        width: 81.795vw;
        height: 41vw;
        background-size: cover;
        text-align: left;
        padding: 3vw 3vw 3vw 3vw;
        display: inline-flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        margin-top: 8vw;
    }

    .nhanvat .namenv-kim {
        width: 58vw;
    }

    .nhanvat .namenv {
        width: 62vw;
    }

    .nhanvat .contentnv {
        font-size: 8px;
    }

    .nhanvat .contentnv p {
        margin: 1vw 0;
    }

    .nhanvat .utube-bg {
        height: 22vw;
        background: transparent;
        padding: 0;
        width: 36vw;
    }

    .nhanvat .play {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%) !important;
        width: 13vw;
    }

    .nv-info {
        margin-top: 6vw;
    }

    .infonutube {
        margin-left: 3vw;
    }

    .nhanvat .skill {
        left: 6vw;
        top: 4vw;
        width: 10vw;
    }

    .nhanvat .labelclass {
        position: absolute;
        top: 0vw;
        left: 3vw;
        width: 13vw;
    }

    .nhanvat .slick-dots li button::after,
    .nhanvat .slick-dots li.slick-active button::after,
    .tinhnang .slick-dots li button::after,
    .tinhnang .slick-dots li.slick-active button::after {
        width: 5.136vw;
        height: 5.084vw;
    }

    .tinhnang {
        margin-top: 24vw;
    }

    .tinhnang .slick-dots {
        display: none !important;
    }

    .tinhnang .title {
        width: 86%;
        margin: 0 auto 5vw;
    }

    .footer-inner {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 12px;
    }

    .product-info {
        width: 100%;
    }

    .product-icon {
        width: 18vw;
    }

    .product-table {
        font-size: 16px;
        color: #FFF2CE;
        text-align: left;
    }

    .footer .social-link {
        font-size: 18px;
        letter-spacing: 20%;
        color: #FFEE2D;
        text-decoration: none;
        padding: 0vw 4.5vw;
        position: relative;
    }

    .social-row {
        margin-top: 6vw;
    }

    .partner-logo {
        width: 26vw;
    }

    .legal-block p {
        font-size: 9px;
    }

    .tinhnang .slick-slider {
        width: 75%;
        margin: 0vw auto 4vw;
    }

    .tinhnang .slick-track {
        max-width: 100% !important;
        transform: translate3d(0, 0, 0) !important;
        perspective: 100px;
    }

    .tinhnang .slick-slide {
        width: 100% !important;
        transform: translate3d(0, 0, 0);
    }

    .tinhnang .slick-sprev2,
    .tinhnang .slick-sprev,
    .tinhnang .slick-snext,
    .tinhnang .slick-snext2 {
        opacity: 0;
    }

    .tinhnang .slick-list {
        padding-top: 0% !important;
        padding-bottom: 0% !important;
        padding-left: 0% !important;
        padding-right: 0% !important;
        height: 66vw !important;
    }

    .tinhnang .slide-img {
        width: 74vw;
        margin: auto;
    }

    .tinhnang {
        margin-top: -12vw;
    }

    .tinhnang .slick-slider .slick-next {
        right: -12%;
        top: 50%;
    }

    .tinhnang .slick-slider .slick-prev {
        left: -14%;
        top: 50%;
    }

    .tinhnang .slick-slider .slick-next::before,
    .tinhnang .slick-slider .slick-prev::before {
        width: 9vw;
        height: 9vw;
    }

    .tinhnang .slick-slider .slick-next::before {
        transform: translateY(-7vw)
    }

    .tinhnang .slick-slider .slick-prev::before {
        transform: translateY(-7vw) rotate(180deg);
    }

    .mainmenu--icon {
        margin-top: 4vw;
        margin-left: 3vw;
    }

    .mainmenu--icon ul li img {
        width: 9vw;
    }

    .iconmenu {
        position: absolute;
        top: 2vw;
        right: 3vw;
    }

    .iconmenu img {
        width: 10.5vw;
        height: 10vw;
    }

    .menu-right {
        /* right: -1000%; */

        left: unset;
        z-index: 999999999;
        position: absolute;
        top: 18vw;
        background: url(../images/menutop-mb.png) top center no-repeat;
        background-size: cover;
        width: 100%;
        height: 103vw;
        display: none;
    }

    .menu-right ul {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4vw;
        padding: 30vw 0 0 0;
    }

    .menu-right ul li {
        padding: 0vw 0vw 2.5vw 5vw;
        border-bottom: 2px solid #FCEDB2;
        width: 95%;
        margin: auto;
        text-align: left;
    }

    .menu-right ul li img {
        transform: unset !important;
        width: 28vw;
        filter: invert(0) brightness(100);
    }

    .mbmenutop .menuclose {
        position: absolute;
        top: 0vw;
        right: 3vw;
        display: none;
        z-index: 9999;
        width: 14vw;
    }

    .regis-gender-form-row {
        display: flex;
        align-items: center;
        gap: unset;
        flex-direction: row;
        justify-content: flex-start;
    }

    .regis-gender-form-label {
        min-width: auto;
        margin-right: 18px;
    }

    .regis-birthday-select {
        width: 71px;
    }

    .regis-gender-radio-circle {
        width: 9px;
        height: 9px;
    }

    .signup-modal.register-step2 .layout-flex {
        bottom: -46px;
    }

    .pop-register,
    .register-step2 {
        background: url(../images/register-bgmb.png) no-repeat center center;
        width: 308px;
        height: 375px;
        background-size: contain;
        padding: 18px;
    }

    .register-step1,
    .register-step3 {
        background: url(../images/popupmb-step1.png) no-repeat center center;
        width: 308px;
        height: 271px;
        background-size: cover;
        padding: 18px 16px 18px 17px;
    }

    .stepper .step-label {
        margin-top: 10px;
        font-size: 5px;
    }

    .stepper .step-circle {
        width: 16px;
        height: 16px;
    }

    .stepper .step-number {
        font-size: 8px;
    }

    .signup-modal .cta-dangnhap a,
    .signup-modal .cta-dangky a {
        font-size: 10px;
    }

    .custom-popup .popup-icon {
        position: absolute;
        top: 1.725vw;
        left: 1.25vw;
        width: 1.675vw;
        height: 1.675vw;
        opacity: 0.5;
    }

    .custom-popup input {
        height: 22px;
        padding: 1.5vw 1vw 1vw 5.5vw;
    }

    .regis-birthday-select {
        height: 22px;
    }

    .stepper .step.active .step-circle {
        border: 1px solid #9F3F2F;
    }

    .stepper-line {
        top: 32%;
    }

    .regis-gender-form-label,
    .custom-popup input,
    .custom-popup .regis-gender-radio-text,
    .regis-birthday-select,
    .OTP-layout .register--otp,
    .submit,
    .signup-modal .back {
        font-size: 8px;
    }

    .signup-modal .back,
    .submit,
    .submit:hover {
        width: 110px;
        height: 24px;
    }

    .register-step1.signup-modal .submit {
        margin: 26px auto 0;
    }

    .register-step3.signup-modal .layout-flex {
        margin: 26px auto 0;
    }

    .signup-modal .back::before {
        left: 28px;
    }

    .regis-birthday-warning,
    .signup-modal .otp-container p,
    .signup-modal h5,
    .signup-modal .register-box p {
        font-size: 6px;
    }

    .signup-modal h5 {
        margin: 10px auto 0;
    }

    .register--otp.active img {
        width: 12px;
    }

    .OTP-layout .register--otp {
        border-radius: 4px;
        padding: 0.475vw 1vw;
        width: 64px;
    }

    .stepper-line::before,
    .stepper-line::after {
        width: 4px;
        height: 4px;
        margin-top: -1.5px;
    }

    .custom-popup .icon-mail {
        width: 3.15vw;
        height: 3.15vw;
        top: 0.925vw;
        left: 0.5vw;
    }

    .pop-close {
        position: absolute;
        right: -7vw;
        top: 0vw;
        width: 6vw;
    }

    .pop-login {
        background: url(../images/login-bgmb.png) no-repeat center center;
        width: 80vw;
        height: 51vw;
        padding: 4.5vw 5vw 2vw 5vw;
    }

    .register--layout {
        margin: 1.5vw 0;
    }

    .bg-detail {
        position: relative;
        background: url(../images/bgmb-detail-top.jpg) no-repeat center top 0px, url(../images/bgmb-detail-ct.jpg) repeat center top;
        background-size: 100%;
        width: 100%;
    }

    .bg-detail .footer-detail:after {
        background: url(../images/bgmb-detail-ft.jpg) no-repeat center bottom;
        background-size: 100% 100%;
    }

    .bg-detail .wrapper {
        margin-top: 79vw;
    }

    .bg-detail .subtitle {
        margin-top: 8vw;
    }

    .nap-the-box,
    .nap-the-card {
        width: 75%;
    }

    .nap-the-card {
        grid-template-columns: unset;
        background: transparent;
        border: transparent;
    }

    .left-col {
        background: #FFFCED;
        border: 2px solid #E9B164;
        border-radius: 12px;
        padding: 0 2vw 2vw 2vw;
    }

    .nap-the-card::after {
        background: transparent;
    }

    .footer .product-info {
        display: inline-flex;
        gap: 48px;
        align-items: flex-start;
        padding-bottom: 32px;
        width: 74vw;
        margin: auto;
    }

    .footer .product-icon {
        width: 18vw;
    }

    .bg-detail .subtitle {
        font-size: 2.5vw;
    }

    .bg-detail .title {
        font-size: 3vw;
    }

    .nap-the-box {
        text-align: left;
    }

    .bg-detail .tintuc {
        width: 75%;
    }

    .bg-detail .menu-tab {
        display: inline-flex;
        align-items: center;
        margin: 3vw 0 2vw 0;
        padding: 0vw 0px 0.725vw;
        width: 100%;
        justify-content: space-between;
    }

    .bg-detail .menu-tab .active,
    .bg-detail .menu-tab li:hover,
    .bg-detail .menu-tab li {
        width: 8vw;
        height: 2.25vw;
        width: 18vw;
        height: 5.25vw;
    }
	.label18 {
			position: absolute;
			top: 72vw;
			left: 87vw;
			width: 10vw;
	}
	.tintuc .main-title {
		font-size: 1em;
		font-weight: 700;
		font-family: SVN-Poppins, Helvetica, Arial, sans-serif;
		text-transform: capitalize;
	}
}

@media (max-width: 640px) {
    .tintuc .search-input {
        padding: 2px 8px;
        font-size: 10px;
    }

    .pagination a {
        padding: 6px 12px;
        font-size: 10px;
    }

    .tintuc .search-btn img {
        width: 6vw;
        height: 6vw;
    }

    .bg-detail .menu-tab li a,
    .content-tintuc a {
        font-size: 10px;
    }
	
	/* game content bài viết*/
	.main-title {
		color: #1a1a1a;
		font-size: 1em;
		font-weight: 700;
		font-family: SVN-Poppins, Helvetica, Arial, sans-serif;
	}
	.game-description {
	  margin-top: 8px;
	}
	.game-description div {
	  max-width: 100%;
	}
	.game-description * {
		font-family: SVN-Poppins, Helvetica, Arial, sans-serif !important;
		font-size: 0.875rem !important;
		overflow-wrap: break-word; /* Ép xuống dòng khi từ quá dài */
		word-break: break-word;    /* Hỗ trợ tương thích cho các trình duyệt cũ */
	}
	.game-description h3 {
	  font-style: normal;
	  font-weight: 700;
	  font-size: 1rem !important;
	}
	.game-description p {
	  font-style: normal;
	  font-weight: 400;
	  font-size: 0.875em;
	  
	}
	
	.game-description table {
		width: 100%;
	}

	.game-description table td {
		padding: 8px;
		border: 1px solid var(--color-table-border);
		vertical-align: middle;
	}

	.game-description table td img {
		max-width: 100%;
		margin: 0 auto 0;
	}

	.game-description table thead,
	.game-description table thead tr {
		background: var(--color-table-head-bg);
		color: var(--color-table-head-content);
		font-weight: bold;
	}

	.game-description table thead th,
	.game-description table thead th span {
		color: #5f3416 !important;
	}

	.game-description table thead tr th {
		padding: 12px;
		text-align: center;
		vertical-align: middle;
		border: 1px solid var(--color-table-border);
	}

	.game-description table tbody {
	}

	.game-description table tfoot {
		background: var(--color-table-foot-bg);
		color: var(--color-table-foot-content);
	}
	/* end game content bài viết*/
	
}

@media (max-width: 435px) {

    .bg-detail .menu-tab li a,
    .content-tintuc a {
        font-size: 9px;
    }

    body {
        background-size: contain;
    }

    .daily-content-text a {
        font-size: 8px;
    }

    .daily-seemore a {
        font-size: 9px;
    }

    .content-daily .menu-tab li a {
        font-size: 10px;
    }

    .nhanvat .slick-dots li button {

        padding: 0 0.5vw;
    }

    .nhanvat .slick-dots {
        margin-top: -10vw;
        margin-bottom: 16vw;
    }

    .product-table {
        font-size: 9px;
        color: #FFF2CE;
    }

    .social-link {
        font-size: 10px;
    }

    .footer .social-link {
        font-size: 10px;
    }
    .tintuc .search-btn img {
        width: 8vw;
        height: 8vw;
    }
}