@charset "UTF-8";

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

body {
    line-height: 1.5;
    word-break: normal;
    overflow-wrap: break-word;
    -webkit-text-size-adjust: 100%;
}

img,
svg,
video,
iframe,
embed,
object {
    max-width: 100%;
}

img,
video {
    height: auto;
}

iframe {
    border: 0;
}

table {
    max-width: 100%;
}

a,
button,
input,
select,
textarea,
.btn,
[role="button"] {
    touch-action: manipulation;
}

button,
.btn,
input[type="button"],
input[type="submit"],
input[type="reset"],
.cart-pro-detail a,
.chitiet_sp a,
.xemtatca,
.slide-btn a,
.pagination-ajax a,
.search-res .icon-search,
.cart-top,
#hamburger {
}

input,
select,
textarea,
.form-control,
.custom-select {
    max-width: 100%;
}

textarea.form-control {
    min-height: 120px;
    height: auto;
}

.wrap-content,
.wrap-main,
.content-main,
.box_content_slider {
    width: min(100%, 1220px);
    max-width: 100%;
}

.content-main {
    padding-left: 10px;
    padding-right: 10px;
}

.entry-content,
.mota_detail,
.box_pro_mota_list,
.mota_chungnhan1,
.noidung_sm,
.footer-info,
.desc-pro-detail,
.tab-content {
    overflow-wrap: anywhere;
}

.entry-content img,
.tab-content img,
.mota_detail img,
.box_pro_mota_list img,
.footer-info img {
    height: auto !important;
}

.entry-content table,
.tab-content table,
.mota_detail table,
.box_pro_mota_list table,
.footer-info table {
    display: block;
    width: 100% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.entry-content iframe,
.tab-content iframe,
.mota_detail iframe,
.box_pro_mota_list iframe {
    width: 100% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
}

.owl-carousel,
.owl-stage-outer,
.slideshow,
.product_img,
.box_giaiphap,
.box_duan,
.scale-img {
    max-width: 100%;
}

.owl-carousel .owl-item img {
    width: 100%;
}

.slideshow-image img,
.giaiphap_img img,
.duan_img img,
.box_tintuc img,
.product_img img {
    width: 100%;
    object-fit: cover;
}

.modal {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.modal-dialog {
    max-width: min(100%, 800px);
    margin-left: auto;
    margin-right: auto;
}

.modal-content {
    max-height: calc(100vh - 24px);
}

.modal-body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

#popup .modal-body img {
    width: 100%;
}

.filebaohanh {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.filebaohanh table {
    width: 100%;
    min-width: 520px;
}

.tabs-pro-detail .nav-tabs {
    flex-wrap: wrap;
    gap: 6px;
}

.tabs-pro-detail .nav-tabs .nav-item {
    margin-bottom: 0;
}

.tabs-pro-detail .nav-tabs .nav-link {
    min-height: 44px;
    display: flex;
    align-items: center;
}

.grid-pro-detail > .row {
    margin-left: 0;
    margin-right: 0;
}

.grid-pro-detail > .row > [class*="col-"] {
    min-width: 0;
}

.left-pro-detail .MagicZoom,
.left-pro-detail .mz-figure,
.left-pro-detail .mz-figure > img,
.left-pro-detail .MagicZoom > img {
    max-width: 100% !important;
}

.left-pro-detail .mz-figure > img,
.left-pro-detail .MagicZoom > img {
    height: auto !important;
}

.gallery-thumb-pro,
.owl-pro-detail,
.spmuakem {
    max-width: 100%;
    overflow: hidden;
}

.btn-frame,
.cart-fixed,
.js-facebook-messenger-box,
.scrollToTop {
    right: max(12px, env(safe-area-inset-right));
}

.btn-frame span {
    white-space: nowrap;
}

.contact-map iframe,
#footer-map iframe {
    width: 100% !important;
    height: 100% !important;
}

@media (min-width: 1200px) {
    .wrap-main,
    .wrap-content {
        padding-left: 10px;
        padding-right: 10px;
    }

    .grid_product {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 1199px) {
    .wrap-main,
    .wrap-content,
    .content-main {
        max-width: 100%;
    }

    .header-bottom .d-flex.align-items-center.justify-content-between {
        gap: 16px;
    }

    .img_top {
        width: 28%;
        min-width: 210px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .menu {
        width: 72%;
    }

    .top_menu {
        gap: 18px;
    }

    .menu ul li a {
        font-size: 13px;
        padding: 10px 8px;
    }

    .divsp_menu {
        width: min(650px, calc(100vw - 32px)) !important;
        left: auto !important;
        right: 0;
    }

    .box_content_slider {
        padding-left: 20px;
        padding-right: 20px;
    }

    .slide-light-text {
        max-width: 60%;
    }

    .grid_product,
    .grid_news {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px;
    }

    .grid_visao {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }

    .grid_visao::after {
        display: none;
    }

    .box_visao {
        display: flex;
        align-items: flex-start;
    }

    .visao_info span {
        max-width: none;
    }

    .wrap-khachhang-w50,
    .mota_spdm,
    .mota_lienhe {
        max-width: 80%;
    }

    .grid_giaiphap {
        column-gap: 30px;
    }
}

@media (max-width: 1023px) {
    .mota_sp{
        display: none !important;
    }
    body {
        font-size: 15px;
    }

    .header,
    .menu {
        display: none;
    }

    .title-main span,
    .title-main1 span {
        font-size: 28px;
    }

    .title-main-contact {
        font-size: 32px;
    }

    .wrap-product,
    .wrap-duan,
    .wrap-giaiphap,
    .wrap-visao,
    .wrap-lienhe,
    .wrap-cn {
        padding-top: 36px;
        padding-bottom: 36px;
    }

    .menu-res {
        display: block;
        padding: 8px 10px;
    }

    .menu-bar-res {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .menu-bar-res .banner-header {
        flex: 1 1 auto;
        min-width: 0;
    }

    .menu-bar-res .banner-header img {
        max-height: 44px;
        width: auto;
    }

    .menu-res .cart-top,
    .menu-res .search-res,
    .menu-res #hamburger {
        position: relative;
        inset: auto;
    }

    .menu-res .cart-top,
    .search-res .icon-search {
        width: 44px;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .menu-res .cart-top span {
        top: 2px;
        right: 0;
    }

    .search-res .search-grid {
        top: calc(100% + 8px);
        right: 0;
        max-width: calc(100vw - 20px);
    }

    #hamburger {
        height: 32px;
        width: 38px;
        flex: 0 0 38px;
    }

    #hamburger::before {
        top: 4px;
    }

    #hamburger span {
        top: 14px;
    }

    #hamburger::after {
        top: 24px;
    }

    .slideshow-item > a {
        display: block;
    }

    .slideshow-image img {
        min-height: 260px;
    }

    .box_content_slider {
        padding-bottom: 50px;
    }

    .slide-bold-text {
        font-size: 24px;
        line-height: 1.25;
    }

    .grid_sumenh,
    .grid_news,
    .grid_product {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grid_giaiphap,
    .grid_duan,
    .grid_chungnhan,
    .grid_contact {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
    }

    .box_camhung,
    .camhung_index:nth-child(even) .box_camhung,
    .chungnhan1,
    .wrap_contact {
        flex-direction: column;
    }

    .info_camhung,
    .img_camhung,
    .box_chungnhan1_l,
    .box_chungnhan1_r,
    .wrap_contact_l,
    .wrap_contact_r,
    .w50 {
        width: 100%;
    }

    .info_camhung,
    .wrap_contact_l {
        padding: 28px;
    }

    .box_chungnhan1_l,
    .box_chungnhan1_r {
        padding-left: 0;
        padding-right: 0;
    }

    .contact_video {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .grid_lienhe_index {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 18px;
    }

    .grid_lienhe_index .w25,
    .grid_lienhe_index .w50 {
        width: 100%;
    }

    .grid_lienhe_index .contact-input.w50 {
        grid-column: 1 / -1;
    }

    .footer_top .wrap-content {
        gap: 18px;
    }

    .footer_top .img_top {
        width: auto;
        min-width: 0;
    }

    .footer-news:nth-child(n) {
        width: 50%;
    }

    .footer-article .wrap-content > .d-flex {
        flex-wrap: wrap;
        gap: 24px 0;
    }

    .footer-copyright {
        text-align: center;
    }
}

@media (max-width: 850px) {

    .grid_product {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px;
    }
    .widget-mobile,.support-online{
        display: none;
    }
    .wcircle-menu-item i, .wcircle-icon i{
        display: none !important;
    }
    .wrap-main,
    .wrap-content,
    .content-main {
        padding-left: 12px;
        padding-right: 12px;
    }

    .wrap-main-full.wrap-contact {
        padding-left: 12px;
        padding-right: 12px;
    }

    .content-main.row.grid_news {
        margin-left: auto;
        margin-right: auto;
    }

    .title-main {
        margin-bottom: 1rem;
    }

    .mota_spdm,
    .mota_lienhe,
    .wrap-khachhang-w50 {
        max-width: 100%;
    }

    .list_sp {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        padding-bottom: 8px;
        -webkit-overflow-scrolling: touch;
    }

    .list_sp span {
        flex: 0 0 auto;
        margin-left: 0;
        margin-right: 0;
        white-space: nowrap;
    }

    .list_sp span::after {
        display: none;
    }

    .duan_info {
        position: static;
        width: 100%;
        left: auto;
        box-shadow: none;
        border: 1px solid #ddd;
        border-top: 0;
    }

    .box_duan {
        padding-bottom: 0;
    }

    .giaiphap_info,
    .giaiphap_info_name {
        position: static;
        transform: none;
        opacity: 1;
        background: #000;
    }

    .giaiphap_info_name {
        display: none;
    }

    .box_giaiphap:hover .giaiphap_info {
        transform: none;
    }

    .box_tieuchi b {
        font-size: 18px;
    }

    .box_tieuchi span,
    .visao_info span {
        font-size: 14px;
    }

    .box_chungnhan {
        align-items: flex-start;
    }

    .img_chungnhan {
        flex: 0 0 120px;
        width: 120px;
    }

    .info_chungnhan {
        width: auto;
        flex: 1 1 0;
        min-width: 0;
    }

    .cart-pro-detail {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .cart-pro-detail a {
        margin-right: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .sp-contact-box {
        display: block;
    }

    .sp-col1,
    .sp-col2 {
        width: 100% !important;
        max-width: 100%;
    }

    .sp-team-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
    }

    .sp-team-tab {
        white-space: nowrap;
    }

    .sp-staff-block {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    body {
        font-size: 14px;
        padding-bottom: env(safe-area-inset-bottom);
    }

    .title-main span,
    .title-main1 span {
        font-size: 24px;
        line-height: 1.25;
    }

    .title-main-contact {
        font-size: 28px;
        line-height: 1.25;
    }

    .wrap-product,
    .wrap-duan,
    .wrap-giaiphap,
    .wrap-visao,
    .wrap-lienhe,
    .wrap-cn {
        padding-top: 28px;
        padding-bottom: 28px;
    }

    .slideshow-image img {
        min-height: 220px;
    }

    .slide-content {
        min-height: 100%;
    }

    .box_content_slider {
        text-align: center;
        padding: 0 16px 34px;
    }

    .slide-bold-text {
        font-size: 20px;
        margin-bottom: 8px;
    }

    .slide-btn {
        float: none;
    }

    .slide-btn a {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .slideshow .owl-theme .owl-dots {
        bottom: 6px;
    }

    .control-owl button {
        width: 38px;
        height: 38px;
        min-height: 38px;
    }

    .grid_sumenh,
    .grid_news,
    .grid_product,
    .grid_visao {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }

    .grid_product {
        grid-gap: 14px;
    }

    .product {
        padding: 10px;
    }

    .product_img img {
        aspect-ratio: 1 / 1;
    }

    .mota_sp {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        background: #000;
        display: block;
        height: auto;
        max-height: 120px;
        overflow: auto;
        text-align: left;
    }

    .name-product {
        font-size: 15px;
    }

    .price-product,
    .chitiet_sp {
        text-align: left;
    }

    .chitiet_sp a {
        display: inline-flex;
        align-items: center;
    }

    .grid_lienhe_index {
        grid-template-columns: minmax(0, 1fr);
    }

    .contact-input,
    .input-cart,
    .input-user {
        margin-bottom: 12px;
    }

    .contact-form .form-row,
    .form-cart .form-row {
        margin-left: 0;
        margin-right: 0;
    }

    .contact-form .form-row > [class*="col-"],
    .form-cart .form-row > [class*="col-"] {
        padding-left: 0;
        padding-right: 0;
    }

    .contact-form .btn,
    .contact-form input[type="submit"],
    .contact-form input[type="reset"],
    .nut_index input,
    .btn-cart,
    .button-user .btn,
    .button-user input {
        width: 100%;
        margin: 0 0 10px 0 !important;
    }

    .wrap_contact_l,
    .info_camhung {
        padding: 22px 16px;
    }

    .contact-map {
        height: 320px;
    }

    .wrap-video {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .left-pro-detail,
    .right-pro-detail {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .left-pro-detail .MagicZoom {
        display: block;
    }

    .owl-pro-detail {
        padding-left: 22px;
        padding-right: 22px;
    }

    .price-new-pro-detail {
        font-size: 24px;
    }

    .price-old-pro-detail,
    .price-contact {
        font-size: 18px;
    }

    .attr-content-pro-detail {
        max-width: 100%;
    }

    .color-pro-detail {
        width: 74px;
        height: 44px;
    }

    .size-pro-detail,
    .chatlieu-pro-detail {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        margin-bottom: 6px;
    }

    .quantity-pro-detail {
        max-width: 132px;
    }

    .quantity-pro-detail span,
    .quantity-pro-detail input {
        height: 44px;
    }

    .quantity-pro-detail span {
        width: 44px;
        line-height: 40px;
    }

    .quantity-pro-detail input {
        width: calc(100% - 88px);
    }

    .tabs-pro-detail .nav-tabs {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border-bottom: 0;
        padding-bottom: 8px;
    }

    .tabs-pro-detail .nav-tabs .nav-item {
        flex: 0 0 auto;
    }

    .tabs-pro-detail .nav-tabs .nav-link {
        white-space: nowrap;
    }

    .tab-content {
        padding: 15px !important;
    }

    .box-readmore {
        padding: 10px;
    }

    .box-readmore ul li {
        display: block;
    }

    .box-readmore ul li::before {
        display: inline;
    }

    .chungnhan1,
    .camhung_index {
        margin-bottom: 24px;
    }

    .box_chungnhan {
        flex-direction: column;
    }

    .img_chungnhan,
    .info_chungnhan {
        width: 100%;
        flex-basis: auto;
    }

    .img_chungnhan {
        max-width: 160px;
    }

    .box_sumenh {
        padding: 18px;
    }

    .sumenh_info h3,
    .duan_info a h3,
    .giaiphap_info a h3,
    .giaiphap_info_name a h3,
    .name_camhung {
        font-size: 18px;
        line-height: 1.35;
    }

    .footer_top {
        padding: 18px 0;
    }

    .footer_top .wrap-content {
        flex-direction: column;
        align-items: flex-start;
    }

    .footer_top .img_top {
        display: flex;
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .social-footer {
        width: 100%;
    }

    .footer-news:nth-child(n) {
        width: 100%;
        margin-top: 0;
    }

    .footer-article .wrap-content > .d-flex {
        gap: 18px;
    }

    .footer-title {
        margin-bottom: 16px;
    }

    .footer-powered .wrap-content {
        padding-bottom: calc(15px + env(safe-area-inset-bottom));
    }

    .btn-frame,
    .cart-fixed,
    .js-facebook-messenger-box {
        width: 46px;
        height: 46px;
    }

    .btn-frame i {
        width: 46px;
        height: 46px;
    }

    .btn-frame .kenit-alo-circle {
        width: 56px;
        height: 56px;
    }

    .btn-frame .kenit-alo-circle-fill {
        width: 66px;
        height: 66px;
    }

    .btn-frame span {
        display: none;
    }

    .btn-zalo {
        bottom: 210px;
    }

    .btn-phone {
        bottom: 150px;
    }

    .cart-fixed {
        bottom: 270px;
    }

    .js-facebook-messenger-box {
        bottom: 90px;
    }

    .js-facebook-messenger-container {
        right: 10px;
        bottom: 150px;
        max-width: calc(100vw - 20px);
    }

    .toolbar,
    .fixbar,
    .plugbar,
    .support-online,
    .widget-mobile {
        max-width: 100vw;
    }

    .toolbar {
        padding: 10px 8px calc(10px + env(safe-area-inset-bottom));
    }

    .toolbar ul li a {
        min-height: 44px;
    }

    .fixbar {
        height: auto;
        min-height: 56px;
        padding-bottom: env(safe-area-inset-bottom);
    }

    .plugbar {
        padding-bottom: calc(10px + env(safe-area-inset-bottom));
    }

    .wrap-user {
        border-left: 0;
        border-right: 0;
    }

    .title-user,
    .button-user {
        flex-direction: column;
        align-items: stretch !important;
        gap: 10px;
    }

    .radio-user {
        display: inline-flex;
        min-height: 34px;
        align-items: center;
    }

    .procart {
        padding: 14px 0;
    }

    .procart .form-row {
        margin-left: 0;
        margin-right: 0;
    }

    .procart .form-row > [class*="col-"] {
        padding-left: 6px;
        padding-right: 6px;
    }

    .pic-procart img {
        max-height: 82px;
    }

    .quantity-counter-procart {
        min-width: 96px;
        height: 38px;
    }

    .counter-procart,
    .quantity-counter-procart .quantity-procart {
        min-height: 36px;
    }

    .total-procart {
        gap: 12px;
    }

    .sp-teammembers-container {
        max-width: 100%;
        overflow: hidden;
    }

    .sp-staff-maininfo {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 575px) {
    .wrap-main,
    .wrap-content,
    .content-main {
        padding-left: 10px;
        padding-right: 10px;
    }

    .menu-bar-res {
        gap: 8px;
    }

    .menu-bar-res .banner-header img {
        max-height: 38px;
    }

    .menu-res .cart-top,
    .search-res .icon-search {
        width: 40px;
        height: 40px;
        min-height: 40px;
        flex-basis: 40px;
    }

    #hamburger {
        width: 34px;
        flex-basis: 34px;
    }

    .search-res .search-grid {
        right: -42px;
        max-width: calc(100vw - 20px);
    }

    .title-main span,
    .title-main1 span {
        font-size: 22px;
    }

    .title-main1 {
        text-align: center;
    }

    .xemtatca {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
    }

    .slideshow-image img {
        min-height: 190px;
    }

    .slide-bold-text {
        font-size: 18px;
    }

    .grid_product {
        grid-template-columns: minmax(0, 1fr);
    }

    .product {
        max-width: 420px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .box_visao {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .visao_img {
        float: none;
        margin: 0 auto 10px;
    }

    .visao_info h3 {
        padding-top: 0;
    }

    .duan_info,
    .giaiphap_info {
        padding: 14px;
    }

    .footer_top .img_top a {
        max-width: calc(50% - 6px);
    }

    .footer_top .img_top img {
        max-height: 44px;
    }

    .social-footer span {
        display: block;
        margin-bottom: 10px;
    }

    .modal-dialog {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .modal-content {
        max-height: calc(100vh - 20px);
    }

    .cart-pro-detail a {
        width: 100%;
    }

    .procart-label {
        display: none;
    }

    .name-procart a {
        font-size: 13px;
    }

    .properties-procart p {
        display: block;
    }

    .empty-cart {
        padding: 22px 12px;
    }
}

@media (max-width: 414px) {
    .content-main {
        padding-top: 16px;
    }

    .title-main span,
    .title-main1 span {
        font-size: 20px;
    }

    .title-main-contact {
        font-size: 24px;
    }

    .slideshow-image img {
        min-height: 170px;
    }

    .box_content_slider {
        padding-bottom: 28px;
    }

    .slide-bold-text {
        font-size: 16px;
    }

    .slide-btn a {
        font-size: 13px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .info_tintuc,
    .box_sumenh,
    .info_camhung,
    .wrap_contact_l,
    .duan_info,
    .giaiphap_info,
    .tab-content {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .color-pro-detail {
        width: 64px;
    }

    .tabs-pro-detail .nav-tabs .nav-link {
        font-size: 13px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .pic-procart {
        flex: 0 0 30%;
        max-width: 30%;
    }

    .info-procart {
        flex: 0 0 42%;
        max-width: 42%;
    }

    .quantity-procart {
        flex: 0 0 28%;
        max-width: 28%;
    }
}

@media (max-width: 374px) {
    .wrap-main,
    .wrap-content,
    .content-main {
        padding-left: 8px;
        padding-right: 8px;
    }

    .menu-bar-res {
        gap: 6px;
    }

    .menu-res .cart-top,
    .search-res .icon-search {
        width: 38px;
        height: 38px;
        min-height: 38px;
        flex-basis: 38px;
    }

    #hamburger {
        width: 30px;
        flex-basis: 30px;
    }

    .menu-bar-res .banner-header img {
        max-height: 34px;
    }

    .search-res .search-grid {
        right: -38px;
    }

    .nut_index input,
    .contact-form .btn,
    .contact-form input[type="submit"],
    .contact-form input[type="reset"],
    .btn-cart {
        font-size: 14px;
    }

    .price-new-pro-detail {
        font-size: 21px;
    }

    .price-wrap {
        gap: 6px;
    }
}
