@charset "UTF-8";

/* Media Query */
@media(max-width:1024px) { 
	/* General */
	.rps-xl--visible { display: block; }
	.rps-xl--hidden { display: none; }
	.rps-xl--w-100 { width: 100%; }
	.ckeditor { overflow-x: auto; }
	.ckeditor:after { content: ''; clear: both; display: block; }
	.ckeditor *:not(iframe) { max-width: 100% !important; height: auto !important; }
	.ckeditor iframe { max-width: 100% !important; } 

	/* ? MenuDesk */
	.menu-desk { width: 0px; opacity: 0; position: fixed; top: 0; left: -100%; bottom: 0; background: transparent; -webkit-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out; z-index: 999; }
	.menu-desk.show {opacity: 1;left: 0;width: 480px;max-width: 85%;-webkit-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;z-index: 300;}
	.menu-desk__inner { opacity: 0; position: fixed; top: 0; left: -300px; bottom: 0; width: 290px; text-align: left; -webkit-box-shadow: -2px 0px 5px 0px #2222224d; -moz-box-shadow: -2px 0px 5px 0px #2222224d; box-shadow: -2px 0px 5px 0px #2222224d; background: #fff; -webkit-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out; cursor: pointer; z-index: 1000; }
	.menu-desk.show .menu-desk__inner { opacity: 1; left: 0; }
	.menu-desk__btn-exit { -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out; cursor: pointer; }
	.menu-desk__btn-exit i { font-size: 20px; color: var(--clr-tone); }
	.menu-desk.show .menu-desk__btn-exit i { -webkit-transform: rotateZ(-90deg); -moz-transform: rotateZ(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotateZ(-90deg); transform: rotateZ(-90deg); -webkit-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out; }
	.menu-desk__logo { display: table; margin: auto; zoom: .76; }
	.menu-desk__list { padding: 15px; position: relative; }
	.menu-desk-center ul { list-style: none; padding: 0; margin: 0 }
	.menu-desk-center ul li.li-tim { display: none }
	.menu-desk-center ul li h2 { font-size: 17px; margin-bottom: 0 }
	.menu-desk-center ul li b { display: inline-block; vertical-align: top; margin-right: 8px }
	.menu-desk-center ul li b img { display: inline-block; vertical-align: top }
	.menu-desk-center ul li a { color: #191919; display: block; border: 1px solid rgb(132 132 132 / 20%); padding: 10px 40px 10px 10px; position: relative; font-size: 15px; margin-bottom: 12px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition: .5s !important; -o-transition: .5s !important; -moz-transition: .5s !important; transition: .5s !important; font-weight: 500 }
	.menu-desk-center ul li a.active2 { color: #fff; -webkit-box-shadow: 0 0 0 25px var(--clr-tone) inset; -moz-box-shadow: 0 0 0 25px var(--clr-tone) inset; box-shadow: 0 0 0 25px var(--clr-tone) inset; }
	.menu-desk-center ul li a i { position: absolute; right: 10px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); width: 25px; height: 25px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 12px; background: var(--clr-tone); color: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; top: 10px }
	.menu-desk-center ul li a.active2 i { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); border-left: 1px solid rgba(255, 255, 255, .2); background: #fff; color: var(--clr-tone); }
	.menu-desk-center ul ul { display: none; padding-left: 15px; margin: 5px 0 10px 0 }
	.menu-desk-center ul li ul li a { padding-left: 20px; color: #6f6f6f }
	.menu-desk-center ul li ul li ul li a { padding-left: 20px }
	.menu-desk-center ul li:last-child a { margin-bottom: 0 }
	.menu-desk__social-title { font-family: var(--font-bold); font-size: 20px; color: #fff; text-align: left; margin-bottom: 10px; }
	.menu-desk__social ul { list-style: none; padding: 0px; margin: 0px; }
	.menu-desk__social ul li { margin-right: 15px; }
	.menu-desk__social ul li:last-child { margin-right: 0; }
	.menu-desk__social ul li a { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; width: 40px; height: 40px; border: 1px solid #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background: transparent; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
	.menu-desk__social ul li a:hover { -webkit-box-shadow: 0px 0px 4px 0px #fff, 0px 0px 4px 0px #fff inset; -moz-box-shadow: 0px 0px 4px 0px #fff, 0px 0px 4px 0px #fff inset; box-shadow: 0px 0px 4px 0px #fff, 0px 0px 4px 0px #fff inset; }
	.menu-btn {color: var(--clr-tone);font-size: 35px;text-decoration: none;width: 20px;display: block;cursor: pointer;margin: 0;text-align: center;}
	.menu-desk--top { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -moz-box-orient: horizontal; -moz-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 5px 15px; border-bottom: 1px solid var(--clr-tone); }
	.menu-desk--bottom { padding: 15px; margin-top: auto; border-top: 1px solid var(--clr-tone); max-height: 180px; overflow:auto; }
	.menu-desk__inner { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; top: 0; bottom: 0; height: 100%; width: 100%; }
	.menu-desk-center { overflow-y: scroll; height: 100%; -webkit-overflow-scrolling: touch; -ms-scroll-chaining: none; overscroll-behavior: none; }
	
	/* TODO: Search Toggle */
.search__toggle {
    --height: 40px;
    position: relative;
    bottom: -5px;
}
	.search__toggle .search__icon {display: grid;place-items: center;width: 40px;height: var(--height);font-size: 17px;color: var(--clr-tone);cursor: pointer;background: var(--clr-btn);border-radius: 50%;}
	.search__toggle .search__icon.active { color: var(--clr-active); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: var(--clr-white); }
	.search__toggle .search__grid {opacity: 1;width: 230px;overflow: hidden;position: absolute;top: 50px;right: 0px;display: -webkit-box;display: -webkit-flex;display: -moz-box;display: -ms-flexbox;display: flex;height: var(--height);border: 1px solid var(--clr-active);-webkit-border-radius: 999px;-moz-border-radius: 999px;border-radius: 999px;background: var(--clr-white);padding: 0rem 0.25rem;}
	.search__toggle .search__grid .search__button { display: grid; place-items: center; width: 35px; font-size: 17px; color: var(--clr-active); background: none; }
	.search__toggle .search__grid .search__input {-webkit-box-flex: 1;-webkit-flex: 1;-moz-box-flex: 1;-ms-flex: 1;flex: 1;color: var(--clr-active);text-indent: 10px;width: 100%;}
	.search__toggle .search__grid input:focus {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}
	.search__toggle .search__grid input::-webkit-input-placeholder { /* autoprefixer: off */ color: var(--clr-silver); }
	.search__toggle .search__grid input:-moz-placeholder { /* autoprefixer: off */ color: var(--clr-silver); }
	.search__toggle .search__grid input::-moz-placeholder { /* autoprefixer: off */ color: var(--clr-silver); }
	.search__toggle .search__grid input:-ms-input-placeholder { /* autoprefixer: off */ color: var(--clr-silver); }
	 
	/* Mmenu */
	/* nav:where(#menu, #mm-menu) { font-family: var(--font-bold); --mm-color-background: #fff; --mm-color-text: #000; --mm-color-text-dimmed: #000; --mm-color-button: #000; }
	nav:where(#menu, #mm-menu) .mm-navbar__title { font-size: 18px; }
	.mm-listitem__btn span { display: none; } */
	.header-botom {display: none;}
	.cart-fixed {display: -webkit-box;display: -webkit-flex;display: -moz-box;display: -ms-flexbox;display: flex;}
	.btn-cancel-banner {display: none;}
	.pt-\[35px\] {display: none;}
	.productFeatured__main .product__list.flex-list, .productListTab__main .product__list.flex-list { --columns: 3; --space-horizontal: 0.625rem; --space-vertical: 1.25rem; }
/* 
	.productList__info {width: 100%; height: -webkit-max-content; height: -moz-max-content; height: max-content; background: transparent; padding: 15px 5px; display: block; text-align: center;top: auto;right: auto; bottom: 0; left: 0;}
	.productList__name {color: #000;} */
	.productList__info {display: block;position: relative;margin-top: -125px;z-index: 2;text-align: center;height: auto;padding: 90px 5px 10px;}
	.navigation__open-nav{width:31px;}
	.scale-img:hover > img { -moz-transform: scale(1, 1); -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); }
	.productList__item:hover img {transform: scale(1); transition: all 300ms ease;}
	.wrap-criteria:before {content: none;}
	.criteria__goto {display: none;}
	.hvr-flash-shape:before {content: none;}

 }
@media (min-width:851px) and (max-width:1023px) { }
@media(max-width:850px) {
	
	/* General */
	.rps-lg--visible { display: block; }
	.rps-lg--hidden { display: none; }
	.rps-lg--w-100 { width: 100%; }
	
	/* Product */
	.productList__list.flex-list,
	.album__list.flex-list,
	.product__list.flex-list { --columns: 3; --space-horizontal: 0.625rem; --space-vertical: 1.25rem; }
	.news__list.flex-list { --columns: 2; --space-horizontal: 0.625rem; --space-vertical: 1.25rem; }
	
	/* Footer */
	.footer-article__inner>[class^="footer-article--"] { width: 100%; }
	.footer-article__inner>[class^="footer-article--"]:not(:last-child) { margin-bottom: 1.5rem; }

	.newsPromotion__main {-webkit-box-orient: vertical;-webkit-box-direction: normal;-webkit-flex-direction: column;-moz-box-orient: vertical;-moz-box-direction: normal;-ms-flex-direction: column;flex-direction: column; gap: 30px;}
	.newsPromotion-left,
	.newsPromotion-right {width: 100%;}
	.slideshow.rps-lg--visible .slideshow__item img{
		height: 100vh!important;
		/* object-fit: cover; */
	}

}

@media(max-width:769px) {
	.footer-powered:has(.footer-statistic) .footer-copyright, .footer-powered:has(.footer-statistic) .footer-statistic { text-align: center; }
	.footer-powered:has(.footer-statistic) .footer-copyright { margin-bottom: 0.25rem; } 
	.feedback__info:before {content: none;}
	.slideshow{aspect-ratio: 375 / 742;}
	.album-product:not(.slick-initialized) > .product-photo {
        flex-basis: calc(100% / 3);
    }
	.left-pro-detail{padding: 0;}
	 .slide-tag .swiper:not(.swiper-initialized) {
        --tag-columns: 5;
    }

	
}
@media(max-width:576px) {
	 .slide-tag .swiper:not(.swiper-initialized) {
        --tag-columns: 4;
    }
	.category-toggle{
		margin-bottom: 20px;
	}
	#hotline.btn-phone span{
		display: none !important;
	}
	/* General */
	.rps-md--visible { display: block; }
	.rps-md--hidden { display: none; }
	.rps-md--w-100 { width: 100%; }
	.header {display: none;}
	/* Product */
	.productList__list.flex-list,
	.product__list.flex-list, .productListTab__main .product__list.flex-list, .producKhuyenmai__main .product__list.flex-list { --columns: 2; --space-horizontal: 0.5rem; --space-vertical: 1.25rem; } 
	.product__info {padding: 0 7px 7px;}
	
	/* News */
	.news .news__photo { margin-bottom: 1rem; } 
	.productFeatured__main .product__list.flex-list, 
	.productListTab__main .product__list.flex-list { --columns: 2; --space-horizontal: 0.5rem; --space-vertical: 1.25rem; }
	.product__properties {-webkit-box-orient: vertical;-webkit-box-direction: normal;-webkit-flex-direction: column;-moz-box-orient: vertical;-moz-box-direction: normal;-ms-flex-direction: column;flex-direction: column;gap: 10px;-webkit-box-pack: start;-webkit-justify-content: start;-moz-box-pack: start;-ms-flex-pack: start;justify-content: start;-webkit-box-align: start;-webkit-align-items: start;-moz-box-align: start;-ms-flex-align: start;align-items: start;}
	.select-color {width: 20px; height: 20px;}	
	.material__main {grid-template-columns: repeat(2, 1fr);}
	.wrap-product .swiper-button-next,
	.wrap-product .swiper-button-prev {display: none;}
.navigation__logo {
    zoom: .67;
    position: relative;
    right: -40px;
}
	.material__main {gap: 30px 20px;}

	.addcart_combo {
    position: relative;
    top: unset;
    right: unset;
    box-shadow: unset;
    margin: 20px auto 0px auto;
    display: INLINE-BLOCK;
}

#footer-primary .cart-fixed{
    display: none;
}
.navigation__inner .cart-fixed {
    position: fixed;
    right: unset;
    bottom: unset;
    width: 50px;
    height: 50px;
    position: relative;
    z-index: 999;
    transform: scale(0.66);
    /* margin-right: -59px; */
}
.navigation__search.rps-xl--visible{
	transform: scale(0.85);
	transform-origin: right;
}
.custom-social-proof {
	bottom:230px;
}



}
@media(max-width:420px) { }
@media(max-width:370px) {
	.slide-tag .swiper:not(.swiper-initialized) {
        --tag-columns: 3;
    }
	/* Cart */
	.cart-pro-detail a { width: 100%; }
	.cart-pro-detail a:first-child { margin: 0 0 0.5rem 0; }
	.cart-pro-detail a i { display: none; }
}