/* Toolbar */

.toolbar {
	display: none;
	background: var(--bgmain);
	width: 100%;
	padding: 2vw;
	bottom: 0px;
	position: fixed;
	z-index: 500;
	height: auto;
	left: 0px;
	border-top: 1px solid #fff;
}



.toolbar ul {

	list-style: none;

	display: flex;

	align-items: center;

	justify-content: space-between;

	padding: 0px;

	margin: 0px;

}



.toolbar ul li {

	text-align: center;

	width: 25%;

}



.toolbar ul li a {

	display: block;

	width: 100%;

	cursor: pointer;

}



.toolbar ul li a img {

	height: 6vw;

	width: auto;

	-webkit-filter: brightness(0) invert(1);

}



.toolbar ul li a span {

	font-weight: 400;

	color: #ffffff;

	font-size: 3.5vw;

	display: none;

}



.search-res {

	display: none;

}



.grid-advertise {

	display: grid;

	grid-template-columns: repeat(2, 1fr);

	grid-gap: 20px;

}



.items-newsnb .img {

	width: 185px;

}



.items-newsnb .info {

	width: calc(100% - 200px);

}



.product-order-res {

	display: none;

}



.head-bar {

	display: flex;

	justify-content: space-between;

	color: #55557b;

	padding: 15px 0px;

	background: #fff;

	font-size: 16px;

	text-transform: uppercase;

	font-weight: 700;

}



.menu-bar-filter {

	background-color: #fff;

	padding: 10px;

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

	z-index: 2;

	height: 110px;

	overflow: hidden;

}



.item-filter {

	background: #eee;

	border: 1px solid #d7d8d9;

	box-sizing: border-box;

	border-radius: 0;

	padding: 8px 0 !important;

	text-align: center;

}



.menu-bar-filter .col-filter {

	padding: 0;

}



.menu-bar-filter .filter-brand {

	display: flex;

	flex-wrap: wrap;

	justify-content: start;

}



.menu-bar-filter .filter-brand .title-filter {

	width: 100%;

}



.menu-bar-filter .filter-brand .container {

	width: 40%;

	margin: 10px;

}



.filter-price .container {

	margin: 10px;

}



.menu-bar-filter {
	display: none;
}



.mm-navbar__title {

	color: #000 !important;

}



.mm-listitem__text {

	color: #4d4545 !important;

}



.mm-panels>.mm-panel {background: #ffffff !important;}



@media(max-width:1200px) {

	.control-owl button.owl-next {

		right: 10px !important;

	}



	.control-owl button.owl-prev {

		left: 10px !important;

	}

}



@media (min-width:1200px) {

	.container-custom {

		max-width: 100%;

	}

}



@media (min-width:992px) and (max-width:1199px) {

	.container-custom {

		/* max-width: 980px; */

	}

}



@media (min-width:768px) and (max-width:991px) {

	.container-custom {

		/* max-width: 760px; */

	}

}



@media(max-width:1200px) {

	.banner-header h1 {

		font-size: 36px;

	}



	.banner-header {

		width: 23%;

	}



	.header-contact {

		width: 55%;

	}



	.logo-header {

		width: 195px;

	}



	.slide-2,

	.slide-4,

	.slide-news,

	.slick-partner,

	.slick-brand {

		margin: 0;

	}



}



@media(max-width:1100px) {

	.logo-header {

		width: 147px;

		height: 100px;

	}



	.logo-header img {

		max-height: 60px;

	}



	.menu {

		width: 100%;

	}



	.social-header {

		display: none;

	}



	.banner-header h1 {

		font-size: 28px;

	}



	.header-contact {

		width: 60%;

	}



	.h-content {

		padding-left: 5px;

	}



	.h-content span {

		font-size: 18px;

	}



	.dm-right ul {

		width: 100%;

	}

}



@media(max-width:1024px) {

	#hamburger {

		display: block;

	}



	.wrap-main {

		padding: 0 10px;

	}



	.btn-zalo,

	.btn-phone,

	#messages-facebook {}



	.header,

	.menu {

		display: none
	}



	.menu-res {

		display: block;

	}



	.btn-zalo,

	.hotline-phone-ring-wrap {

		display: none
	}



	.toolbar {

		display: block;

	}



	.btn-zalo,

	.btn-phone {}



	.cart-fixed {

		bottom: 180px;

	}



	.scrollToTop {
		/* bottom: 140px; */
		right: 16px;
	}



	.header-hidden {

		display: block;

		text-align: center;

	}



	.mm-navbar {background: #018cde;color: #fff;border-bottom: 1px solid #f4f1f1;}



	.logo-hidden img {

		zoom: 0.6;

	}



	.logo-hidden img.lazy {

		zoom: 1
	}



	.box-slide {

		width: 100%;

	}



	.tc-items {

		padding: 10px 12px;

	}



	.wrap-tc {

		padding: 20px 10px;

		margin: 20px 0;

	}



	.wrap-banner {

		padding: 10px;

		margin: 10px 0;

	}



	.wrap-form,

	.box-form,

	.wrap-fb,

	.wrap-spnb {

		padding: 20px 10px;

	}



	.title-box span,

	.click-sp {

		font-size: 26px;

		line-height: 40px;

	}



	.title-list span {

		font-size: 22px;

	}



	.brand-index {

		margin-top: 20px;

		padding: 20px 10px 10px;

		margin-bottom: 0;

	}



	.title-main span {

		font-size: 30px;

	}



	.fb-items {

		/* padding: 15px; */

	}



	.fb-photo img {

		zoom: 0.7;

	}



	.desc-fb {

		padding-left: 10px;

	}



	.khung-fb {

		justify-content: space-between;

	}



	.wrap-news {

		padding: 20px 10px;

		margin-bottom: 10px;

	}



	.box2 {

		padding: 30px;

	}



	.mm-navbar__title {color: #ffffff !important;}



	.footer-news:nth-child(1) {

		width: 40%;

	}



	.footer-news:nth-child(2) {

		width: 30%;

	}



	.footer-news:nth-child(3) {

		width: 25%;

	}



	.footer-news:nth-child(4) {

		width: 100%;

	}



	span.img-list img {

		display: none;

	}



	.list-cat ul li {

		margin-bottom: 10px;

	}



	.menu-bar-filter {

		display: block;

	}



	.col-filter.fix {

		display: none;

	}

}



@media(max-width:992px) {

	.review-preview {

		display: none;

	}



	.comment-item {

		display: block;

	}



	.comment-item-poster {

		width: auto;

		margin-right: 0px;

		margin-bottom: 0.5rem;

		display: flex;

		align-items: center;

		justify-content: flex-start;

	}



	.comment-item-letter {

		width: 40px;

		height: 40px;

		line-height: 40px;

		font-size: 13px;

		margin-bottom: 0;

	}



	.comment-item-name {

		margin-bottom: 0px;

		margin-left: 10px;

		margin-right: 10px;

	}



	.comment-item-information {

		width: 100%;

	}



	.news {

		width: 100%;

		float: none !important;

	}



	.footer-news:nth-child(1) {

		width: 100%;

		margin-bottom: 20px;

	}



	.footer-news:nth-child(2) {

		width: 48%;

		text-align: left;

	}



	.footer-news:nth-child(3) {

		width: 48%;

		text-align: left;

	}



	.footer-powered .wrap-content {

		display: block !important;

		text-align: center;

	}



	.footer-powered {

		font-size: 13px;

	}



	.statistic span {

		padding: 5px 5px 0px;

	}



	.slideshow-info span {

		display: block;

		color: #fff;

		font-size: 30px;

		font-weight: 700;

		margin-bottom: 15px;

		line-height: 40px;

	}



	.slideshow-info p {

		display: block;

		color: #fff;

		font-size: 20px;

		margin-bottom: 20px;

	}



	.slideshow-info a {

		width: 170px;

		line-height: 40px;

		font-size: 16px;

	}



	.wrap-about .wrap-content {

		flex-direction: column;

	}



	.left-about {

		width: 100%;

		margin-bottom: 20px;

	}



	.right-about {

		width: 100%;

	}



	.footer-article {

		padding: 30px 0px;

	}



	.footer-title {

		margin-bottom: 15px;

		padding-bottom: 10px;

	}



	.frm-contact-footer .contact-input {

		margin-bottom: 15px;

	}



	.footer-statistic {

		margin: 5px 0px;

	}



	.wrap-intro .content-main {

		flex-direction: column;

	}



	.left-intro {

		width: 100%;

		margin-bottom: 20px;

	}



	.right-intro {

		width: 100%;

	}



	.box-title .btn-tablist span {

		font-size: 17px;

	}



	.box-title .title-sp {

		width: 120px;

	}



	.box-title .btn-tablist {

		width: calc(100% - 120px);

	}



	.box-product .item-product .left-img {

		width: 180px;

	}



	.box-banner .text-content-pro span {

		font-size: 24px;

	}



	.box-banner .text-content-pro p {

		font-size: 16px;

	}



	.footer-news:nth-child(4) {

		width: 100%;

		margin-top: 10px;

	}



	.footer-article .wrap-content {
		/* text-align: center; */
	}



	.box-contact img {

		max-width: 40px;

		max-height: 40px;

	}



	.search-res .icon-search img {

		max-width: 40px;

		max-height: 40px;

	}



	.box-title .btn-tablist span {

		width: 100%;

	}



	.list-cat ul {

		margin-bottom: 20px !important;

	}



	.title-pagein span {

		font-size: 26px;

	}



	.grid-product-page {

		grid-template-columns: repeat(3, 1fr);

	}



	.table-product {

		margin-left: 0;

		width: 100%;

	}



	.flex-custom {

		flex-direction: column;

	}



	.col-list-sub {

		width: 100%;

		display: flex;

		flex-wrap: wrap;

		order: 2;

		justify-content: space-around;

	}



	.name-items-sub {

		font-size: 14px;

	}



	.border-cat img {

		zoom: 0.8;

	}



	.col-list-sub .col-filter {

		width: 48%;

	}



	.advertisepro {

		width: 48%;

	}



	.prolist-orther {

		width: 48%;

		margin-bottom: 0;

	}



	.box-fb-flex {

		flex-direction: column;

	}



	.wrap-fb {

		width: 100%;

	}



	.box-form {

		width: 100%;

	}



	.box-info__comment {

		display: block;

	}



	span#comment {

		margin-left: 0;

		margin-top: 4px;

	}



	.title-custom .title-spcat {

		display: none;

	}



	.title-custom .it .show-time {

		justify-content: center;

		margin: 10px 0;

		width: 100%;

	}



	.title-custom>a {

		position: absolute;

		top: 14px;

		right: 10px;

		z-index: 5;

	}

}



@media(max-width:768px) {
	.product-new-badge {
    top: 1px;
    right: 1px;
    min-width: 32px;
    height: 14px;
    padding: 0 7px 0 8px;
    clip-path: polygon(5px 0%, 100% 0%, calc(100% - 5px) 100%, 0% 100%);
}

	.product-new-badge span{
		font-size: 8px;
        line-height: 1;
        letter-spacing: 0.2px;
	}
	.btn-contact-pro a:last-child {

		margin-right: 0
	}



	.cart-pro-detail {

		display: block;

		width: 100%;

		min-width: 100% !important;

		flex: 1 !important;

		flex-wrap: wrap;

	}



	.cart-pro-detail a {

		padding: 8px !important;

		width: 100%;

		word-break: break-word;

		margin: 5px 0 !important;

	}

	.load-product-slick {
		/* padding: 0 5px; */
	}

	.wrap-content {
		padding: 0 10px
	}

	.top-contact {

		flex-wrap: wrap;

	}

	.catalog-action-btn,
	.catalog-nav-btn {
		display: none;
	}

	.catalog-book-search-btn {
		display: block;
	}

	.catalog-book-toolbar {
		flex-wrap: wrap;
	}

	.catalog-book-status {
		width: 100%;
	}

	.catalog-book-search {
		width: 100%;
		justify-content: center;
	}


	.left-pro-detail,

	.right-pro-detail,

	.top-contact .form-contact,

	.top-contact .article-contact {

		width: 100%;

		margin: 0px;

	}



	.left-pro-detail,

	.top-contact .article-contact {

		margin-bottom: 30px;

	}



	.title-main {

		margin-bottom: 5px;

	}



	.title-main span {

		font-size: 22px;

		line-height: 30px;

	}



	.title-main p {

		font-size: 14px;

	}



	.product-moi {

		padding: 20px 0px;

		margin-bottom: 20px;

	}



	.wrap-product {

		margin-bottom: 20px;

	}



	.video-index {

		padding: 25px 0px;

		margin-bottom: 20px;

	}



	.album-index {

		margin-bottom: 20px;

	}



	.news-index {

		padding: 20px 0px;

	}



	#my_call {

		display: block;

	}



	.footer-article {

		padding: 30px 0px;

	}



	.wrap-main {

		margin-top: 20px;

	}



	.header-history p {

		font-size: 14px;

	}



	.slideshow-info {

		display: none;

	}



	.slideshow {

		/* margin-bottom: 25px; */

		margin-top: 0;

	}



	.wrap-list {

		margin-bottom: 25px;

	}



	.wrap-about {

		margin-bottom: 25px;

	}



	.title-about {

		margin-bottom: 10px;

	}



	.title-about p {

		font-size: 16px;

	}



	.title-about h2 {

		font-size: 22px;

	}



	.desc-about {

		margin-bottom: 15px;

	}



	.readmore-about {

		width: 150px;

		line-height: 35px;

		font-size: 14px;

	}



	.right-banner-contact span {

		font-size: 22px;

		line-height: 30px;

	}



	.right-banner-contact p {

		font-size: 16px;

	}



	.contact-now {

		width: 170px;

		line-height: 40px;

		font-size: 16px;

	}



	.frm-contact-footer button {

		width: 180px;

		height: 38px;

		font-size: 14px;

	}



	.title-main {

		padding-bottom: 15px;

		margin-bottom: 20px;

	}



	.wrap-intro {

		padding: 0;

		margin-bottom: 0;

	}



	.title-form h2 {

		font-size: 24px;

	}



	.form-ct .box-form img {

		display: none;

	}



	.form-ct .form-lh {

		width: 100%;

	}



	.title-form {

		padding-bottom: 20px;

	}



	.logo-header {

		padding: 0;

	}



	.box-product {

		margin-bottom: 0;

	}



	.box-title .btn-tablist {

		width: 100%;

	}



	#hamburger {

		display: block;

	}



	.box-product .item-product {

		padding-bottom: 20px;

	}



	.box-slide {

		flex-direction: column;

	}



	.slideshow {

		width: 100%;

	}



	.img-bannershow {

		flex-direction: unset;

		justify-content: space-between;

	}



	.slidefix {

		width: 48%;

		margin-bottom: 0;

	}



	.box-video-nav {

		width: 100%;

		margin-left: 0;

		margin-top: 10px;

	}



	.big-v {

		width: 50%;

		margin-bottom: 0;

	}



	.fanpage-fb {

		width: 45%;

	}



	.banner-list {

		margin-bottom: 20px;

	}



	.fb-items {

		padding: 10px 10px 35px 10px;

	}



	.fb-photo {

		display: none;

	}



	.desc-fb {

		width: 100%;

	}



	.desc-fb span {

		font-size: 15px;

	}



	.infor-fb {

		zoom: 0.8;

	}



	.box-form-flex {

		flex-direction: column;

	}



	.form-index {

		width: 100%;

	}



	.form-sub {

		width: 100%;

	}



	.form-index .contact-input {

		margin-bottom: 10px;

	}



	.title-pagein span,

	.title-box span,

	.title-list span,

	.click-sp {

		font-size: 22px;

	}



	.title-sub-cat {

		font-size: 16px;

		margin-bottom: 15px;

	}



	.list-brand ul {

		margin-bottom: 30px !important;

	}



	.info-newshome-normal span {

		-webkit-line-clamp: 2;

		/* height: unset; */

		/* display: none; */

	}



	.info-newshome-normal h3 a {

		-webkit-line-clamp: 2;

	}



	.slide-brand {

		display: grid;

		grid-template-columns: repeat(3, 1fr);

		gap: 10px;

	}
	#phongvt-contact-footer-outer{
		display: block;
	}
.catalog-book-stage{
    padding: 0 10px
}
}



@media(max-width:600px) {

	.logo-hidden .cart-header {

		display: none
	}



	.box-banner .text-content-pro span {

		font-size: 16px;

	}



	.box-banner .text-content-pro p {

		font-size: 13px;

		margin-bottom: 0;

	}



	.box-criteria span {

		font-size: 16px;

		line-height: 16px;

	}



	.desc-newshome {

		font-size: 15px;

	}



	.search {

		width: unset;

		min-width: inherit;

	}



	.click-sp {

		font-size: 20px;

	}



	.title-cat a {

		font-size: 15px;

		padding: 4px;

	}



	.box2 {

		padding: 10px;

	}



	.title-box {

		background: unset;

		transform: translateX(-50%);

		position: relative;

		text-align: center;

		margin-bottom: 10px;

	}



	.fanpage-fb {

		max-height: 117px;

	}



	.search-res {
		display: flex;
		flex-wrap: wrap;
		align-content: center;
		justify-content: flex-end;
		align-items: center;
	}



	.search.fix2 {

		display: none;

	}



	.prolist-orther {

		width: 100%;

		margin-bottom: 10px;

	}



	.advertisepro {

		width: 100%;

	}



	.box-flex-news {

		flex-direction: column;

	}



	.box-news-slide {

		width: 100%;

	}



	.box-cauhoi {

		width: 100%;

	}



	.box-banner-fix {

		flex-direction: column;

	}



	.box-slide-video {

		width: 100%;

		margin-bottom: 10px;

	}



	.box-slide-banner {

		width: 100%;

	}



	.title-list {

		margin-bottom: 5px;

	}



	.wrap-tc {

		margin: 10px 0;

	}



	.title-list span {

		font-size: 18px;

		line-height: 26px;

	}

}



@media(max-width: 550px) {

	.name-product {

		font-size: 17px;

	}



	.name-product a {

		font-size: 14px;

	}



	.dungtich {

		font-size: 14px;

	}



	.price-new {

		font-size: 14px;

	}



	.price-old {

		font-size: 13px;

	}



	.row-news {

		margin: 0px -7px;

	}



	.col-news {

		padding: 0px 7px;

	}



	.box-news {

		margin-bottom: 15px;

	}



	.left-album {

		width: 100%;

		margin-bottom: 3.5%;

	}



	.right-album {

		width: 100%;

	}



	.row-product {

		margin: 0px -7px;

	}



	.col-product {

		padding: 0px 7px;

	}



	.box-product {

		margin-bottom: 15px;

	}



	.name-product {

		margin-top: 10px;

	}



	.info-list {

		padding: 10px;

	}



	.info-list h2 {

		font-size: 18px;

	}



	.info-list h2 a {

		font-size: 16px;

	}



	.right-about {

		padding: 20px 20px 0px 0px;

	}



	.box-thongso span {

		font-size: 32px;

		line-height: 38px;

	}



	.box-thongso p {

		font-size: 15px;

	}



	.wrap-banner-contact {

		padding: 30px 0px;

	}



	.left-banner-contact {

		display: none;

	}



	.right-banner-contact {

		width: 100%;

		text-align: center;

	}



	.info-customer {

		padding: 65px 15px 50px;

		background: url(../images/say.png) center 15px no-repeat, #FFFFFF;

		background-size: 40px;

	}



	.box-customer:hover .info-customer {

		background: url(../images/say_active.png) center 15px no-repeat, #01904E;

		background-size: 40px;

	}



	.name-customer h3 {

		font-size: 15px;

	}



	.img-news {

		margin-bottom: 10px;

	}



	.img-video-main:before {

		width: 70px;

		height: 50px;

		top: calc(50% - 70px/2);

		left: calc(50% - 50px/2);

	}



	.box-video::after {

		width: 40px;

		height: 30px;

		top: calc(50% - 40px/2);

		left: calc(50% - 30px/2);

	}



	.slick-news {

		margin: 0px -7px;

	}



	.newshome-normal {

		flex-direction: column;

		margin: 10px 7px;

	}



	.pic-newshome-normal {

		width: 100%;

		margin-bottom: 10px;

	}



	.info-newshome-normal {

		width: 100%;

	}



	.content-newsletter {

		background-size: auto;

		padding: 35px 20px;

	}



	.footer-news:nth-child(2) {

		width: 100%;

		margin-bottom: 20px;

	}



	.footer-news:nth-child(3) {

		width: 100%;

	}



	.footer-company {

		font-size: 25px;

	}



	.box-title .btn-tablist span {

		font-size: 14px;

	}



	.box-banner .text-content-pro {

		width: 80%;

	}



	.f-fix {

		flex-direction: column;

	}



	.f-fix p {

		width: 100%;

		margin-bottom: 10px;

	}



	.box-video-nav {

		flex-direction: column;

	}



	.big-v {

		width: 100%;

		margin-bottom: 10px;

	}



	.fanpage-fb {

		width: 100%;

		min-height: 200px;

	}



	.sp-tab::after {

		display: none;

	}



	.sp-tab {

		flex-direction: column;

	}



	.click-sp {

		width: 100%;

		text-align: center !important;

	}



	.click-sp.fix {

		text-align: left !important;

	}



	.title-cat a {

		padding: 4px 4px;

	}



	.box-mt {
		margin-top: 3px;
	}

	.wrap-feedback {
		padding: 50px 0 60px;
	}

	.feedback-layout {
		flex-direction: column;
		gap: 0px 0;
	}

	.feedback-item-image,
	.feedback-item-content {
		width: 100%;
	}

	.feedback-item-content {
		margin-left: 0;
	}

	.feedback-image-frame img {
		height: 320px;
	}

	.feedback-card {
		min-height: unset;
		padding: 28px 24px;
	}

	.slide-feedback .slick-dots {
		padding-left: 0;
		text-align: center;
	}

	.section.session-footer {
		padding-bottom: 40px;
	}

	.session-spmoibanchay {
		padding: 40px 0;
	}
}


@media(max-width:500px) {
	.feedback-image-frame img {
		height: 240px;
	}

	.feedback-name {
		font-size: 16px;
	}

	.feedback-position,
	.feedback-desc {
		font-size: 13px;
	}

	.col-list-sub .col-filter {
		width: 100%;
	}
}


@media(max-width:440px) {

	.news-shadow-image {

		width: 100%;

	}



	.news-shadow-info {

		width: 100%;

		border-left: 2px dashed #8C623C !important;

		border-right: 2px dashed #8C623C !important;

		border-top: none;

	}



	.top-contact .form-contact .button-contact .file-contact span b {

		max-width: 105px;

	}



	.name-history {

		width: 100%;

		padding-right: 0px;

		padding-bottom: 0px;

	}



	.hidden-mobile {

		display: none;

	}



	.amount-history {

		width: auto;

		font-size: 14px;

	}



	.amount-history span {

		display: inline-block;

		margin-right: 3px;

	}



	.price-history {

		width: auto;

		font-size: 14px;

	}



	.grid-product-page {

		grid-template-columns: repeat(2, 1fr);

	}

}



@media(max-width:991px) {
	#fp-nav {
		display: none !important;
	}

	.catalog-scene {
		padding-top: 32px;
		padding-bottom: 44px;
	}

	.catalog-page .title-main {
		font-size: 32px;
		letter-spacing: 0.12em;
	}

	.catalog-shelf-books {
		gap: 34px;
		padding-left: 18px;
		padding-right: 18px;
	}

	.catalog-shelf-row-bottom .catalog-shelf-books {
		gap: 24px;
	}

	.catalog-book-card {
		width: 150px;
	}

	.catalog-shelf {
		height: 62px;
	}

	.catalog-reader-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 0; 
		margin-bottom: 0;
	}

	.catalog-related-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.catalog-flip-shell {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media(max-width:400px) {
	.col-news {
		max-width: 100%;
		flex: 0 0 100%;
	}


	.header-history p {

		width: 100%;

	}



	.col-album {

		max-width: 100%;

		flex: 0 0 100%;

	}



	.col-video {
		max-width: 100%;
		flex: 0 0 100%;
	}

	.catalog-page,
	.catalog-reader-page {
		padding-top: 0;
	}

	.catalog-scene {
		min-height: auto;
		padding-top: 26px;
		padding-bottom: 36px;
	}

	.catalog-page .title-main {
		font-size: 24px;
		letter-spacing: 0.1em;
	}

	.catalog-shelf-books,
	.catalog-shelf-row-bottom .catalog-shelf-books {
		flex-wrap: wrap;
		gap: 20px;
		padding-left: 12px;
		padding-right: 12px;
	}

	.catalog-book-card {
		width: calc(50% - 10px);
		max-width: 156px;
	}

	.catalog-book-title {
		left: 10px;
		right: 10px;
		bottom: 12px;
		font-size: 15px;
	}

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

	.catalog-shelf {
		height: 44px;
	}

	.catalog-book {
		padding: 16px;
		border-radius: 24px;
	}

	.catalog-book-toolbar {
		flex-direction: column;
	}

	.catalog-book-search {
		width: 100%;
		justify-content: center;
	}

	.catalog-book-search-input {
		width: 100%;
		max-width: 220px;
	}

	.catalog-stage-hit {
		display: none;
	}

	.catalog-flip-shell {
		padding-left: 0;
		padding-right: 0;
	}
}

@media(max-width:370px) {
	.col-product {
		max-width: 100%;
		flex: 0 0 100%;
	}

}
@media (max-width: 991px) {
    .product-qr-box {
        margin-top: 15px;
        margin-bottom: 15px;
    }
}

@media (max-width: 576px) {
    .product-qr-box {
        padding: 8px;
        gap: 10px;
    }

    .product-qr-img,
    .product-qr-img img {
        width: 70px;
        height: 70px;
        flex-basis: 70px;
    }

    .product-qr-title {
        font-size: 13px;
    }

    .product-qr-desc {
        font-size: 12px;
    }
}

/* ===== B-GEM custom responsive fixes ===== */
@media (max-width: 768px) {
    .product-new-badge {
        top: 1px !important;
        right: 6px !important;
        min-width: 32px;
        height: 14px;
        padding: 0 8px 0 8px;
        clip-path: polygon(5px 0%, 100% 0%, calc(100% - 5px) 100%, 0% 100%);
    }
    .product-new-badge span {
        font-size: 8px;
        line-height: 1;
        letter-spacing: 0.2px;
    }
    .left-pro-detail .product-new-badge,
    .gallery-product .product-new-badge,
    .product-detail .product-new-badge,
    .product-image-detail .product-new-badge,
    .photo-pro-detail .product-new-badge,
    .left-pro-detail .pic-product .product-new-badge {
        top: 13px !important;
        right: 8px !important;
    }
    .product-qr-box {
        margin-top: 12px;
        padding: 8px;
        gap: 8px;
    }
    .product-qr-img,
    .product-qr-img img {
        width: 68px;
        height: 68px;
        flex-basis: 68px;
    }
    .product-qr-title {
        font-size: 13px;
    }
    .product-qr-desc {
        font-size: 12px;
    }
}

@media (min-width: 992px) {
    .grid-product-page {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}

/* FIX LOGO LOADING GIF RESPONSIVE */
@media (max-width: 768px) {
    #loader-wrapper .loader__border img,
    #loader-wrapper img.lazy,
    #loader-wrapper img.initial,
    #loader-wrapper img.loaded,
    #loader-wrapper img.error {
        max-width: min(320px, 85vw) !important;
        max-height: 180px !important;
    }
}

@media (max-width: 480px) {
    #loader-wrapper .loader__border img,
    #loader-wrapper img.lazy,
    #loader-wrapper img.initial,
    #loader-wrapper img.loaded,
    #loader-wrapper img.error {
        max-width: min(180px, 58vw) !important;
        max-height: 100px !important;
    }
}


/* ===== Home section responsive enhancement ===== */
@media (max-width: 1199px) {
    .home-title span,
    .home-section-bg .title-main.title-main-white span,
    .home-section-bg .title-main.title-main-feedback span {
        font-size: 44px;
    }

    .home-subtitle {
        font-size: 18px;
    }

    .home-feature-name a {
        font-size: 24px !important;
    }

    .home-benefit-item {
        width: calc(50% - 12px);
    }

    .home-benefit-item:nth-child(2)::after {
        display: none;
    }
}

@media (max-width: 991px) {
    .home-section-bg .wrap-banner,
    .home-section-bg .wrap-spmoibanchay,
    .home-section-bg .wrap-news,
    .home-section-bg .wrap-feedback {
        padding-top: 55px;
        padding-bottom: 55px;
    }

    .home-title span,
    .home-section-bg .title-main.title-main-white span,
    .home-section-bg .title-main.title-main-feedback span {
        font-size: 34px;
        line-height: 1.25;
    }

    .home-title::after,
    .home-section-bg .title-main.title-main-white::after,
    .home-section-bg .title-main.title-main-feedback::after {
        width: 120px;
    }

    .home-feature-image img {
        height: 240px;
    }

    .home-benefit-item {
        width: 100%;
        justify-content: flex-start;
        max-width: 520px;
    }

    .home-benefit-item::after {
        display: none;
    }

    .feedback-layout {
        flex-wrap: wrap;
        gap: 24px;
    }

    .feedback-item-image,
    .feedback-item-content {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .home-section-heading {
        margin-bottom: 26px;
    }

    .home-title span,
    .home-section-bg .title-main.title-main-white span,
    .home-section-bg .title-main.title-main-feedback span {
        font-size: 28px;
    }

    .home-subtitle {
        font-size: 16px;
        line-height: 1.6;
    }

    .home-feature-card {
        padding: 18px 18px 22px;
        border-radius: 22px;
    }

    .home-feature-image img {
        height: 210px;
    }

    .home-feature-name a {
        font-size: 21px !important;
    }

    .home-feature-button {
        min-width: 165px;
        min-height: 46px;
        font-size: 17px;
    }

    .session-spmoibanchay .click-sp-moibanchay-box {
        gap: 10px;
    }

    .session-spmoibanchay .click-sp-moibanchay {
        font-size: 14px;
        padding: 10px 14px;
    }

    .home-news-card {
        padding: 14px;
        border-radius: 20px;
    }

    .home-news-card .pic-newshome-normal img {
        height: 210px;
    }

    .home-news-card .name-newshome a {
        font-size: 19px;
    }

    .home-benefit-item {
        min-width: 100%;
        padding: 0;
    }

    .home-benefit-icon {
        width: 52px;
        height: 52px;
        font-size: 24px;
    }

    .home-benefit-text h3 {
        font-size: 20px;
    }
}


/* ===== One page home fit responsive override 2026-04-26 ===== */
@media (max-width: 1199px) {
    .home-section-bg,
    .session-2.home-section-bg,
    .session-3.home-section-bg,
    .session-4.home-section-bg,
    .session-feedback.home-section-bg {
        height: auto;
        min-height: 100vh;
        overflow: visible;
    }

    .home-section-wrap,
    .home-section-bg .wrap-banner,
    .home-section-bg .wrap-spmoibanchay,
    .home-section-bg .wrap-news,
    .home-section-bg .wrap-feedback {
        height: auto;
        min-height: 100vh;
        padding-top: 76px !important;
        padding-bottom: 40px !important;
    }

    .home-section-featured .slide-banner-danhmuc-box {
        padding: 0 !important;
    }

    .home-benefits {
        flex-wrap: wrap;
    }

    .home-benefit-item {
        flex: 0 0 calc(50% - 7px);
    }

    .home-benefit-item:nth-child(2)::after {
        display: none;
    }
}

@media (max-width: 991px) {
    .home-section-bg .fp-tableCell {
        height: auto !important;
    }

    .home-title span,
    .home-section-bg .title-main span,
    .home-section-bg .title-main.title-main-white span,
    .home-section-bg .title-main.title-main-feedback span {
        font-size: 32px !important;
    }

    .home-section-heading {
        margin-bottom: 20px !important;
    }

    .home-feature-image img {
        height: 205px !important;
    }

    .feedback-layout {
        flex-wrap: wrap;
        gap: 20px;
    }

    .feedback-item-image,
    .feedback-item-content {
        width: 100% !important;
    }
}

@media (max-width: 767px) {
    .home-section-bg,
    .session-2.home-section-bg,
    .session-3.home-section-bg,
    .session-4.home-section-bg,
    .session-feedback.home-section-bg {
        height: auto;
        min-height: auto;
    }

    .home-section-wrap,
    .home-section-bg .wrap-banner,
    .home-section-bg .wrap-spmoibanchay,
    .home-section-bg .wrap-news,
    .home-section-bg .wrap-feedback {
        height: auto;
        min-height: auto;
        padding-top: 45px !important;
        padding-bottom: 45px !important;
        display: block;
    }

    .home-title span,
    .home-section-bg .title-main span,
    .home-section-bg .title-main.title-main-white span,
    .home-section-bg .title-main.title-main-feedback span {
        font-size: 28px !important;
    }

    .home-subtitle {
        font-size: 15px !important;
    }

    .home-feature-card {
        padding: 14px !important;
        border-radius: 18px !important;
    }

    .home-feature-image img,
    .home-news-card .pic-newshome-normal img {
        height: 190px !important;
    }

    .home-benefits {
        display: block;
    }

    .home-benefit-item {
        width: 100%;
        justify-content: flex-start;
        padding: 10px 0;
    }

    .home-benefit-item::after {
        display: none !important;
    }
}