.product-page{padding-bottom:0px; width:100%; float:left; overflow-x:hidden }
@media (max-width: 767px){
    .product-page{padding-bottom:0px;  }
}

/* Slider */
#Slider-products{opacity:0; transition:.3s;  overflow:hidden; }
#Slider-products .owl-item:before{content:''; display:block; padding-bottom:100%; position:relative;}
#Slider-products .owl-item a{width:100%; height:100%; position:absolute; top:0; left:0; overflow:hidden; border-radius:30px 30px 0 30px;   }
#Slider-products .owl-item a:before{font-family: "Font Awesome 5"; font-weight: 900; content: "\f002"; position:absolute; right:0; bottom:0; z-index:3; font-size:18px; background:#fff; color:var(--color1); width:55px; height:55px; text-align:center; line-height:55px; display:block; border-radius:50%; transition:.3s}
#Slider-products .owl-item a:after{content: ''; width: 110px; height: 110px; right: -4px; bottom: -4px; background: url(../Default/LP-clip-angle-rb-bg.svg) no-repeat 0 0; background-size: 100% auto; position: absolute; z-index: 1;}
#Slider-products .owl-item:hover a:before{background:var(--color1); color:#fff;}
#Slider-products .owl-item a .clip-img{width:100%; height:100%; float:left; position:relative;}
#Slider-products .owl-item a img{width:inherit; height:inherit; object-fit:cover; max-width:100%; max-height:100%; }
#Slider-products .owl-controls{margin:0; position:absolute; left:0; bottom:40px; width:100%; height:0;}
#Slider-products .owl-controls .owl-pagination{height:0;}

@media (min-width:1440px){
    
}

.product-page .col-left{width:calc(100% - 290px); float:left; position:relative; padding-right:40px; }
.product-page .col-right{width:290px; float:right; position:relative; }
.product-page .col-right .pay{width:100%; float:left; margin-top:30px;}
.product-page .col-right .pay span{font-weight:bold; font-size:16px; display:block; text-align:center;}
.product-page .col-right .pay img{width:100%;}

.main-product{width:100%; position:relative; padding:100px 0 80px 0;float:left;  background:var(--colorBg)}

.main-product .container{position:relative; z-index:2;}
.main-product .col-slider{width:calc(50% - 40px); float:left; position:relative;}
.main-product .col-info{width:calc(50% - 40px); float:right; position:relative;}
.main-product .col-info .head-info{width:100%; float:left; position:relative; border-bottom:1px dashed rgba(0,0,0,.1); padding-bottom:20px;}
.main-product .col-info .head-info h3{margin:0; padding:0 0 0px 0; font-family: "Signika", sans-serif; font-size:32px; font-weight:500; color:#000; display:block; float:left; width:100%;}
.main-product .col-info .head-info .product-rating{width:100%; float:left; position:relative; margin-top:25px; margin-bottom:5px;}
.main-product .col-info .head-info .product-rating #productdetail-rating{float:left; }
.main-product .col-info .head-info .product-rating b{display:block; float:left; border:1px solid rgba(0,0,0,.15); line-height:24px; padding: 0 7px; border-radius:4px; margin:-3px 0 0 5px; margin-right:5px;}
.main-product .col-info .head-info .product-rating span{}
.main-product .col-info .head-info .product-rating span label{margin:0; font-weight:bold}
.main-product .col-info .head-info .item{display:block; float:left; position:relative; margin-right:20px; font-size:14px; margin-top:10px;}
.main-product .col-info .head-info .item span{display:block; float:left;}
.main-product .col-info .head-info .item span:after{content:':'; padding-left:2px; padding-right:5px;}
.main-product .col-info .head-info .item a{color:var(--color1); font-weight:500;}
.main-product .col-info .head-info .item b{color:var(--color1); font-weight:500;}
.main-product .col-info .head-info .item:last-child{margin-right:0;}

.main-product .col-info .body-info{width:100%; float:left; position:relative;}
.main-product .col-info .body-info .brief{width:100%; float:left; line-height:25px; margin-top:25px; font-size:16px;}
.main-product .col-info .body-info .box-price{width:100%; float:right; margin-top:25px; position:relative; padding-top:20px;}
.main-product .col-info .body-info .box-price:before{content:'Giá bán'; position:absolute; top:0; left:0;  font-family: "Signika", sans-serif; text-transform:uppercase; font-size:18px; font-weight:500; }
.main-product .col-info .body-info .box-price .price{color:#ec1f26; font-size:35px; font-family: "Signika", sans-serif; font-weight:700; position:relative; float:left; padding-right:20px; margin-right:5px; }
.main-product .col-info .body-info .box-price .price:after{content:'đ'; position:absolute; top:6px; right:0; font-size:28px; font-weight:600;}
.main-product .col-info .body-info .box-price .unit{color:#ec1f26; font-size:22px; font-weight:bold; margin-top:12px;}
.main-product .col-info .body-info .box-price .unit:before{content:'/'; font-weight:normal; padding-right:5px;}
.main-product .col-info .body-info .box-price .wrap-slae{width:100%; float:left; position:relative; margin-top:-10px;}
.main-product .col-info .body-info .box-price .price-compare{display:block;  font-weight:500; margin: 5px 0 0 0; color:#8f8f8f; font-size:25px; position:relative; padding-right:13px; float:left; }
.main-product .col-info .body-info .box-price .price-compare:before{content:''; width:100%; height:2px; float:left; position:absolute; top:50%; left:0; background:#8f8f8f; margin-top:-2px; }
.main-product .col-info .body-info .box-price .price-compare:after{content:'₫'; position:absolute; right:0; top:4px; font-size:18px;}
.main-product .col-info .body-info .box-price .percent{position:relative; margin:15px 0 0 15px; font-size:16px; z-index:5; padding:0 10px 10px 0; font-weight:bold;float:left;  }
.main-product .col-info .body-info .box-price .percent:before{content:'Tiết kiệm:'; float:left; margin-right:5px; font-weight:normal; font-size:15px;}
.main-product .col-info .body-info .box-price .percent:after{content:'₫'; position:absolute; top:0; right:0; font-size:13px;}

.main-product .col-info .body-info .status-product{width:100%; float:left; position:relative;}
.main-product .col-info .body-info .status-product .wrap-status{width:100%; float:left; position:relative; margin-top:20px;}
.main-product .col-info .body-info .status-product .status{height:46px; background:#fff; position:relative; top:0;  border-radius:7px; padding: 5px 5px 5px 15px; float:left; margin-right:20px; display:flex;}
.main-product .col-info .body-info .status-product .status:before{content:'Trang thái'; font-weight:500; padding-right:15px; line-height:36px; color:#000; opacity:.75; }
.main-product .col-info .body-info .status-product .status span{height:36px; line-height:36px; border-radius:5px; display:block; font-weight:900;padding: 0 10px; text-transform:uppercase }
.main-product .col-info .body-info .status-product .note-form{width:100%; float:left; position:relative;}
.main-product .col-info .body-info .status-product .note-form label{margin:25px 0 0 0; width:100%; float:left; position:relative}
.main-product .col-info .body-info .status-product .note-form .wrap-input{width:100%; float:left; position:relative; margin: 15px 0 10px 0;}
.main-product .col-info .body-info .status-product .note-form .wrap-input:before{font-family: "Font Awesome 5"; font-weight: 900; font-size:22px; content: "\f3cd"; line-height:48px; position:absolute; top:0; left:15px; color:#000;}
.main-product .col-info .body-info .status-product .note-form .wrap-input input[type="text"]{width:100%; float:left; position:relative; height:48px; padding: 0 60px 0 45px; border-radius:5px; background:rgba(0,0,0,.03); border:none; outline:none; font-weight:bold; box-shadow: inset 0 0 0 1px rgba(0,0,0,.07); transition:.3s; }
.main-product .col-info .body-info .status-product .note-form .wrap-input input[type="text"]:focus{box-shadow:inset 0 0 0 1px var(--color2)}
.main-product .col-info .body-info .status-product .note-form .wrap-input .nav-send{position:absolute; top:5px; right:5px; line-height:38px; height:38px; padding: 0 10px; z-index:2; background:var(--color2); border-radius:5px; width:50px; text-align:center; font-weight:bold; color:#fff;}
.main-product .col-info .body-info .status-product .wrap-btn{width:100%; float:left; position:relative;}
.main-product .col-info .body-info .status-product .wrap-btn a{width:calc(50% - 5px); background:#e41727; float:left; line-height:51px; height:50px; border-radius:7px;  font-size:16px; color:#fff; display:block; text-align:center; margin-top:30px; text-decoration:none; text-transform:uppercase; font-weight:bold; display:block!important; box-shadow: inset 0 0 rgba(0,0,0,0); transition:.3s;  }
.main-product .col-info .body-info .status-product .wrap-btn a:hover{box-shadow:inset 0 50px rgba(0,0,0,.2)}
.main-product .col-info .body-info .status-product .wrap-btn a:last-child{float:right; background:var(--color1); }
.main-product .col-info .body-info .status-product .note{display:block; text-align:center; clear:both; padding-top:10px; }
.main-product .col-info .body-info .status-product .note b{color:#ec1f26; font-size:15px;}
.main-product .col-info .body-info.stocking .status-product .status span{color:#1fa663; background:#e2f7ec;}

@media (max-width:767px){
    .main-product{padding-top:15px; padding-bottom:30px;}
    .main-product .col-slider{width:100%;  padding-right:0; position:relative;}
    .main-product .col-info{width:100%; padding-top:30px;}
    .main-product .col-info .head-info h3{font-size:22px; padding-bottom:10px; line-height:30px;}
    .main-product .col-info .head-info .item{margin-top:5px;}
    .main-product .col-info .body-info .box-price {margin-top:10px;}
    .main-product .col-info .body-info .box-price .wrap-slae{margin-top:-10px;}
    .main-product .col-info .body-info .status-product .wrap-status{display:block}
    .main-product .col-info .body-info .status-product .status{padding-left:7px; margin-right:0;}
    .main-product .col-info .body-info .status-product .status:before{padding-right:7px; white-space:nowrap}
    .wrap-minusPlus{padding-left:7px!important; float:right!important;}
    .wrap-minusPlus .minusPlus{margin-left:5px!important}
    .wrap-minusPlus .minusPlus{margin-left:5px!important}
}

@media (min-width:768px) and (max-width:991px){
    .main-product{padding-top:60px; padding-bottom:60px;}
    .main-product .col-slider{width:100%; padding-left:0; padding-right:0; position:relative;}
    .main-product .col-info{width:100%; padding-top:30px;}
    .main-product .col-info .head-info h3{font-size:25px;}
}

@media (min-width:992px) and (max-width:1199px){
    .main-product{padding-top:60px; padding-bottom:60px;}
    .main-product .col-slider{width:50%;  padding-right:40px;}
    .main-product .col-info{width:50%; position:initial}
    
}
@media (min-width:1200px) and (max-width:1439px){
    .main-product{padding-top:60px; padding-bottom:60px;}
    .main-product .col-slider,
    .main-product .col-info{width:calc(50% - 20px)}
}

/* Ngừng Kinh Doanh */
.main-product .col-info .body-info.stop .status-product .status{color:#d56e00; background:#ffe5d1; margin-top:20px;}
.main-product .col-info .body-info.stop .box-price,
.main-product .col-info .body-info.stop .wrap-minusPlus,
.main-product .col-info .body-info.stop .nav-addCart,
.main-product .col-info .body-info .status-product .note{display:none!important;} 

/* Hết hàng */
.main-product .col-info .body-info.outofstock .status-product .status{color:#c7190c; background:#ffe4e4; margin-top:20px;}
.main-product .col-info .body-info.outofstock .box-price,
.main-product .col-info .body-info.outofstock .wrap-minusPlus,
.main-product .col-info .body-info.outofstock .nav-addCart{display:none!important;} 
.main-product .col-info .body-info.outofstock .status-product .note-outofstock{display:block; }

/* Liên hệ Đặt hàng */
.main-product .col-info .body-info.contact .status-product .status{color:#a9028b; background:#f1deed; margin-top:20px;}
.main-product .col-info .body-info.contact .box-price,
.main-product .col-info .body-info.contact .wrap-minusPlus,
.main-product .col-info .body-info.contact .nav-addCart{display:none!important;} 
.main-product .col-info .body-info.contact .status-product .note-contact{display:block; }

/* Cháy hàng */
.main-product .col-info .body-info.soldout .status-product .status{color:#c7190c; background:#ffe4e4; padding-left:32px;}
.main-product .col-info .body-info.soldout .status-product .status:before{font-family: "Font Awesome 5";font-weight: 900; content: "\f06d"; font-size:20px; position:absolute; left:10px; bottom:0px;}

.main-product .col-info .foot-info{width:100%; float:left; padding-top:30px; }
.main-product .col-info .foot-info .barcode{position:relative; background:#fff; float:left; border-radius:7px; width:235px; overflow:hidden; display:none;}
.main-product .col-info .foot-info .barcode svg{margin-left:-5px;}
.main-product .col-info .foot-info .barcode svg g:nth-child(1){transform:translate(20px, 10px)}
.main-product .col-info .foot-info .barcode svg g:nth-child(3) text,
.main-product .col-info .foot-info .barcode svg g:nth-child(5) text{letter-spacing:3px;  }
.main-product .col-info .foot-info .share-product{float:right; position:relative; margin:12px 0 0 0}
.main-product .col-info .foot-info .share-product span{float:left; line-height:36px; font-size:15px; padding-right:15px; font-weight:500;}
.main-product .col-info .foot-info .share-product a{width:36px; height:36px; line-height:36px; text-align:center; font-size:16px; color:#fff; float:left; margin-right:10px; text-decoration:none; border-radius:5px; box-shadow:inset 0 0 rgba(0,0,0,0); transition:.3s; }
.main-product .col-info .foot-info .share-product a:hover{box-shadow:inset 0 36px rgba(0,0,0,.2) } 
.main-product .col-info .foot-info .share-product .nav-facebook{background:#3d568c}
.main-product .col-info .foot-info .share-product .nav-twitter{background:#219ee7}
.main-product .col-info .foot-info .share-product .nav-pinterest{background:#e41727}

@media (max-width:767px){
    .main-product .col-info .foot-info .share-product{margin-top:20px;}
    .main-product .col-info .foot-info .share-product span{position:absolute; left:0; bottom:100%; line-height:initial; padding-bottom:3px;}  
}

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


/*******************************************************************************/ 
/*                         Trạng thái khuyến mãi                               */
/*******************************************************************************/
.promotion-status{width:100%; float:left; position:relative; margin-bottom:5px; box-shadow: inset 0 0 0 1px #f3d1d9, 0 0 0 5px #fff; border-radius:7px; padding:14px 20px; background:#fff4f7; }
.promotion-status .col-title{display:block; float:left; position:relative;}
.promotion-status .col-title h4{font-weight:bold; font-size:18px; color:var(--color3); margin:0;}
.promotion-status .col-title .time-limit{display:block; font-size:14px; padding-top:2px;}
.promotion-status .col-title .time-limit:before{content:'Thời gian:'; padding-right:3px; font-weight:normal; opacity:.8}
.promotion-status .col-title .time-limit b{font-weight:500;}
.promotion-status .wrap-progress{width:100%; float:left; position:relative; margin-top:15px;}
.promotion-status .wrap-progress .progress{height:8px; margin-top:2px; background:rgba(0,0,0,.1)}
.promotion-status .wrap-progress .progress .progress-bar{background-image: linear-gradient(to right, var(--color3) , #ffc107); border-radius:5px;}
.promotion-status .wrap-progress .total{width:100%; float:left; position:relative; color:rgba(0,0,0,.85); margin-top:5px;}
.promotion-status .wrap-progress .total b{color:#000; font-weight:900; font-size:18px; padding-left:5px;}
.promotion-status .wrap-progress .total b:after{content:'/'; font-weight:normal; color:rgba(0,0,0,.7); font-size:15px;padding: 0 2px}
.promotion-status .wrap-progress .total i{font-style:normal; font-weight:500; color:rgba(0,0,0,.7)}

.wrap-countdown{position:absolute; float:left; top:15px; right:20px;}
.wrap-countdown label{text-transform:uppercase; color:#000; font-size:14px; font-weight:900; float:left; line-height:41px; padding-right:10px; margin:0;}
.wrap-countdown ul.countdown {list-style: none;margin:  0;padding: 0;display: block;text-align: center; float:left; }
.wrap-countdown ul.countdown li {display:block; float:left; position:relative; background:var(--color3); padding: 2px 0 0 0; height:40px; margin-right:11px; border-radius:5px; width:40px; font-weight:900; color:#fff; font-size:17px;}
.wrap-countdown ul.countdown li:after{content:':'; line-height:40px; position:absolute; top:0; right:-8px; display:block; color:#000; font-size:15px;}
.wrap-countdown ul.countdown li:before{content:''; width:100%; text-transform:uppercase; color:rgba(255,255,255,.85); font-size:10px; text-align:center; position:absolute; left:0; bottom:4px; font-weight:500; line-height:initial;}
.wrap-countdown ul.countdown li.days:before{content:'Ngày'}
.wrap-countdown ul.countdown li.hours:before{content:'Giờ'}
.wrap-countdown ul.countdown li.minutes:before{content:'Phút'}
.wrap-countdown ul.countdown li.seconds{margin-right:0;}
.wrap-countdown ul.countdown li.seconds:before{content:'Giây'}
.wrap-countdown ul.countdown li.seconds:after{display:none;}

.waiting-status{ box-shadow: inset 0 0 0 1px #eddca9; background:#fff9e8; margin:50px 0 0 0; }
.waiting-status:before{content:'Sắp diễn ra'; font-size:14px; text-transform:uppercase; font-weight:bold; position:absolute; left:0; bottom:100%; padding-bottom:4px; }
.waiting-status ul.countdown li{background:#ffc107; color:#000;}
.waiting-status ul.countdown li:before{color:rgba(0,0,0,.8)}
.waiting-status .info{width:100%; float:left; position:relative; border-top:1px solid #eddca9; margin-top:15px; padding-top:12px;  }
.waiting-status .info .price-promotion{float:left; position:relative;}
.waiting-status .info .price-promotion b{color:var(--color2); font-weight:900; font-size:20px; position:relative; padding-right:11px;}
.waiting-status .info .price-promotion b:before{content:'Giá khuyến mãi:'; font-size:15px; font-weight:normal; color:#000; padding-right:5px;}
.waiting-status .info .price-promotion b:after{content: '₫'; position: absolute; top: -1px; right: 0;font-size: 16px; font-weight:bold;}
.waiting-status .info .price-promotion span{font-weight:500;}
.waiting-status .info .price-promotion span:before{content:'/'; font-weight:normal;padding-left:3px;}
.waiting-status .info .number{float:left; margin: 0 0 0 20px; position:relative; padding-left:20px; }
.waiting-status .info .number:before{content:''; width:1px; height:16px; background:#eddca9; position:absolute; top:9px; left:0;}
.waiting-status .info .number b{font-weight:900; font-size:20px;padding: 0 3px;color:var(--color2) }



.wrap-minusPlus{position:relative; float:left; margin-top:0px; padding: 0 0 0 0px; background:#fff; height:46px; border-radius:7px; padding-left:15px; }
.wrap-minusPlus span{float:left; line-height:47px; font-weight:500; position:relative; top:0; left:0px; opacity:.75}
.wrap-minusPlus .minusPlus{float:right; position:relative; height: 50px; padding: 0 40px;border-radius:5px; margin-left:10px;}
.wrap-minusPlus .minusPlus a{width:36px; height:36px; line-height:37px; background:var(--color2); color:#000; text-align:center; font-size:16px; font-weight:normal; position:absolute; top:5px; text-decoration:none; border-radius:5px; transition:.3s; box-shadow:inset 0 0 rgba(0,0,0,0) }
.wrap-minusPlus .minusPlus a:hover{box-shadow: inset 0 36px rgba(0,0,0,.15)}
.wrap-minusPlus .minusPlus a.nav-minus{left:5px;}
.wrap-minusPlus .minusPlus a.nav-plus{right:5px;}
.wrap-minusPlus .minusPlus input[type=text]{width:35px; height:46px; text-align:center; border:none; outline:none; font-weight:bold; font-size:16px; background:none;}

/* Detail */
.detail-product{width:100%; float:left; position:relative; }
.detail-product .nav-fontSize{position:absolute; left:100%; height:115px; width:45px; top:0; text-align:right; z-index:5; margin-top:15px; border:1px solid var(--color-border); border-left:none; border-radius:0 7px 7px 0; padding:0 5px 5px 5px; transform:initial!important }
.detail-product .nav-fontSize:before{content: "\f894"; font-family: "Font Awesome 5";font-weight: 900; width:100%; line-height:40px; text-align:center; display:block; font-size:16px; color:var(--color2)  }
.detail-product .nav-fontSize a{line-height:34px; height:34px; width:34px; text-align:center; display:inline-block; font-size:18px; color:#000; font-weight:bold; background:var(--color-bg); }
.detail-product .nav-fontSize a.active{background:var(--color-border); }
.detail-product .nav-fontSize a:first-child{border-radius: 5px 5px 0 0}
.detail-product .nav-fontSize a:last-child{border-radius:0 0 5px 5px}
.detail-product .title-detail{width:100%; float:left; position:relative; border-bottom:1px solid var(--color-border); margin-bottom:25px; padding-bottom:10px; display:none; }
.detail-product .title-detail h4{font-size:22px; font-weight:900;}
.detail-product .content-detail{width:100%; float:left; position:relative; line-height:30px; font-size:16px; overflow:hidden; transition:.3s; padding-top:40px;}
.detail-product .content-detail img{max-width:100%!important; height:auto!important; display:block; margin: 15px auto;  }
.detail-product .content-detail .wrap-btn-show-more{position:absolute; left:0; bottom:0; padding:20px 0 5px 0 ; width:100%; text-align:center; z-index:2;background-image: linear-gradient(rgba(255,255,255,0), #fff 65%); }
.detail-product .content-detail .wrap-btn-show-more a{line-height:40px; min-width: 250px; padding: 0 30px; box-shadow: 0 0 0 1px var(--color2), 0 0 5px rgba(0,0,0,.3); display:inline-block; background:#fff; border-radius:5px; font-weight:500;}
.detail-product .content-detail .wrap-btn-show-more a:after{font-family: "Font Awesome 5"; font-weight: 900; content: "\f0d7"; font-size:16px; margin-left:10px;}
.detail-product .content-detail .youtube-wrapper { position: relative; padding-bottom: 56.25%;height: 0; overflow: hidden;border-radius: 7px; }
.detail-product .content-detail .youtube-wrapper iframe { position: absolute!important;top: 0!important; left: 0!important; width: 100%;height: 100%;}
.detail-product .content-detail h4{font-size:18px; font-weight:bold;}
.detail-product .content-detail h3{font-size:20px; font-weight:bold;}
.detail-product .content-detail h2{font-size:22px; font-weight:bold;}
.detail-product .content-detail h1{font-size:25px; font-weight:bold;}
.detail-product .content-detail ul{margin-bottom:0!important}
.detail-product .content-detail .barcode{display:none;}

.nav-jumpto{width:220px; float:left; position:relative; }
.nav-jumpto ul{margin:0; padding:0; list-style:none; width:100%; float:left;}
.nav-jumpto ul li{width:100%; float:left; position:relative; padding: 0 20px; line-height:55px; font-size:16px; font-weight:500; border-top:1px solid var(--color-border); cursor:pointer; z-index:1; transition:.3s; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.nav-jumpto ul li:first-child{border:none;}
.nav-jumpto ul li.active{background:#edf4fc; z-index:5; box-shadow: 0 0 0 5px #fff; border-radius:5px; border-color:#edf4fc; color:var(--color2); padding-left:20px;}
.content-jumpto{width:calc(100% - 250px); float:right; position:relative;}
.content-jumpto .block-jumpto{width:100%; float:left ;  margin-top:30px;}
.content-jumpto .block-jumpto:first-of-type{margin-top:0;}

@media(max-width:767px){
    .detail-product{width:calc(100% + 30px); margin-left:-15px; box-shadow:none; border-radius:0; padding:0; background:#fff;}
    .detail-product .content-detail{ padding:50px 15px 0 15px;}
    .nav-jumpto{width:70px; margin-left:-5px;}
    .nav-jumpto ul{box-shadow:inset 0 0 0 1px var(--color-border); border-radius:7px;}
    .nav-jumpto ul li{line-height:initial; font-size:13px; border:none; border-radius:0!important; padding:0; white-space:normal;overflow:inherit; padding: 8px; text-align:center; border-bottom:1px solid var(--color-border)!important; line-height:normal;}
    .nav-jumpto ul li.active{background:var(--color2); color:#fff; box-shadow:none!important; padding-left:8px;}
    .nav-jumpto ul li:first-child{border-radius:7px 7px 0 0!important; }
    .nav-jumpto ul li:last-child{border:none!important; border-radius: 0 0 7px 7px!important}
    .content-jumpto{width:calc(100% - 80px);}
}

@media (min-width:768px) and (max-width:991px){
    .detail-product{padding:20px;}
    .nav-jumpto{width:100px;}
    .nav-jumpto ul{box-shadow:inset 0 0 0 1px var(--color-border); border-radius:7px;}
    .nav-jumpto ul li{line-height:initial; font-size:14px; border:none; border-radius:0!important; padding:0; white-space:normal;overflow:inherit; padding: 10px 15px; text-align:center; border-bottom:1px solid var(--color-border)!important; line-height:22px;}
    .nav-jumpto ul li.active{background:var(--color2); color:#fff; box-shadow:none!important; padding-left:15px;}
    .nav-jumpto ul li:first-child{border-radius:7px 7px 0 0!important; }
    .nav-jumpto ul li:last-child{border:none!important; border-radius: 0 0 7px 7px!important}
    .content-jumpto{width:calc(100% - 120px);}
}

.tbl-ingredients{max-width:100%; border-collapse: separate; border-spacing: 2px; margin-top:15px; margin-bottom:15px;}
.tbl-ingredients thead th{background:var(--color-border); padding: 6px 15px; }
.tbl-ingredients thead th:first-child{border-radius: 7px 0 0 7px;}
.tbl-ingredients thead th:last-child{border-radius: 0 7px 7px 0; text-align:right; white-space:nowrap; min-width:100px;}
.tbl-ingredients tbody td{background:var(--color-bg); padding: 6px 15px; }
.tbl-ingredients tbody td:first-child{border-radius: 7px 0 0 7px;}
.tbl-ingredients tbody td:last-child{border-radius: 0 7px 7px 0; text-align:right;}

@media(max-width:767px){
    .tbl-ingredients{width:100%;}
}
@media (min-width:768px){
    .tbl-ingredients{min-width:500px;}
}

.tbl-info{max-width:100%; border-collapse: separate; border-spacing: 2px; margin-top:15px; margin-bottom:15px}
.tbl-info thead th{background:var(--color-border); padding: 6px 15px; text-align:center; }
.tbl-info thead th:first-child{border-radius: 7px 0 0 7px; text-align:left;}
.tbl-info thead th:last-child{border-radius: 0 7px 7px 0; }
.tbl-info tbody td{background:var(--color-bg); padding: 6px 15px; text-align:center; }
.tbl-info tbody td:first-child{border-radius: 7px 0 0 7px; text-align:left;}
.tbl-info tbody td:last-child{border-radius: 0 7px 7px 0; }
.tbl-info.left-2 thead th:nth-child(2),
.tbl-info.left-2 tbody td:nth-child(2),
.tbl-info.left-3 thead th:nth-child(3),
.tbl-info.left-3 tbody td:nth-child(3),
.tbl-info.left-4 thead th:nth-child(4),
.tbl-info.left-4 tbody td:nth-child(4),
.tbl-info.left-5 thead th:nth-child(5),
.tbl-info.left-5 tbody td:nth-child(5){text-align:left;}

.tbl-info.right-2 thead th:nth-child(2),
.tbl-info.right-2 tbody td:nth-child(2),
.tbl-info.right-3 thead th:nth-child(3),
.tbl-info.right-3 tbody td:nth-child(3),
.tbl-info.right-4 thead th:nth-child(4),
.tbl-info.right-4 tbody td:nth-child(4),
.tbl-info.right-5 thead th:nth-child(5),
.tbl-info.right-5 tbody td:nth-child(5){text-align:right;}

@media(max-width:767px){
    .tbl-info{width:100%;}
}
@media (min-width:768px){
    .tbl-info{min-width:500px;}
}


/* Tag */
.wrap-tags{width:100%; float:left; position:relative; margin-top:25px; background:var(--color-bg); border-radius:10px; padding:15px 20px 20px 100px; min-height:72px; }
.wrap-tags .title-tags{font-weight:900; color:var(--color1); position:absolute; top:25px; left:20px;}
.wrap-tags .title-tags:before{font-family: "Font Awesome 5"; font-weight: 900; font-size:16px; margin-right:10px; content: "\f02c";}
.wrap-tags a{line-height:32px; height:32px;padding: 0 15px; display:inline-block; margin: 5px 5px 0 0; border-radius:5px; transition:.3s; background:#fff}
.wrap-tags a:hover{color:var(--color2)}
@media (max-width:767px){
    .wrap-tags{width:calc(100% + 30px); margin-left:-15px; border-radius:0; padding-right:15px; background:var(--color-bg); margin-top:30px; box-shadow: 0 -30px #fff;}
}


.wrap-product-more{width:100%; float:left; position:relative; margin-top:50px;}
.wrap-product-more .title{width:100%; float:left; position:relative; margin-bottom:10px; }
.wrap-product-more .title h4{ text-transform:uppercase; font-size:18px; font-weight:900;}
.wrap-product-more ul{width:100%; margin:0; padding:0; list-style:none; float:left; border:1px solid #ececec; border-radius:7px; }
.wrap-product-more ul li{width:100%; margin:0;padding:15px; list-style:none; float:left; border-top:1px solid #ececec}
.wrap-product-more ul li:first-child{border:none;}
.wrap-product-more ul li .wrap-img{width:90px; float:left; position:relative; margin: 0 0 0; border-radius:5px; }
.wrap-product-more ul li .wrap-img:before{content:''; padding-top:100%; display:block;}
.wrap-product-more ul li .wrap-img a{width:100%; height:100%; float:left; position:absolute; top:0; left:0; overflow:hidden; border-radius:5px;}
.wrap-product-more ul li .wrap-img a img{width:inherit; height:inherit; object-fit:cover}
.wrap-product-more ul li .wrap-info{width:calc(100% - 90px); float:right; position:relative; padding-left:15px;}
.wrap-product-more ul li .wrap-info a{text-decoration:none; font-size:15px; font-weight:500; color:#000; transition:.3s; width:100%; float:left; margin-top:-3px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;}
.wrap-product-more ul li .wrap-info a:hover{color:var(--color2)} 
.wrap-product-more ul li .wrap-info .price-box{float:left; padding-top:5px; width:100%;}
.wrap-product-more ul li .wrap-info .price-box .price{font-weight:bold; font-size:15px; color:#ec1f26; margin-right:5px; float:left; clear:both; position:relative; padding-right:10px;}
.wrap-product-more ul li .wrap-info .price-box .price:after{content:'₫'; position:absolute; right:0; top:0; font-size:13px; font-weight:500}
.wrap-product-more ul li .wrap-info .price-box .price-compare{display:block;  font-weight:500; margin: 2px 0 0 0px; color:#8f8f8f; font-size:14px; position:relative; padding-right:10px; float:left; }
.wrap-product-more ul li .wrap-info .price-box .price-compare:before{content:''; width:100%; height:1px; float:left; position:absolute; top:50%; left:0; background:#8f8f8f; margin-top:-1px; }
.wrap-product-more ul li .wrap-info .price-box .price-compare:after{content:'₫'; position:absolute; right:0; top:1px; font-size:13px;}




.wrap-product-bottom{width:100%; float:left; position:relative; margin-top:70px; padding:50px 0 70px 0; background:var(--color-bg); overflow:hidden;}
.wrap-product-bottom .title{width:100%; float:left; position:relative;}
.wrap-product-bottom .title span{font-size:16px; font-weight:normal; padding-bottom:3px; display:block; color:rgba(0,0,0,.85)}
.wrap-product-bottom .title label{text-transform:uppercase; font-size:18px; font-weight:900; margin:0;  color:#000; clear:left; display:block;}
ul.list-product{width:calc(100% + 20px); margin:20px 0 0 -10px; padding:0; box-shadow:none; border:none;}
ul.list-product li{margin:0; padding: 0 10px; position:relative;}
ul.list-product li .product-item .nav-catalog{display:none;}
ul.list-product li .product-item .name{margin-top:20px;}
ul.list-product li .product-item .price{padding: 0 25px}

@media (max-width:767px) {
    .wrap-product-bottom{padding-top:60px; margin-top:0; box-shadow: inset 0 30px #fff; padding-bottom:0; }
    ul.list-product{margin-top:0px;}
    ul.list-product li{-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-top:15px;}
}

@media (min-width:768px) and (max-width:991px) {
    ul.list-product{margin-top:0px;}
    ul.list-product li{-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-top:15px;}
}

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

@media (min-width:1200px) and (max-width:1439px) {

}
@media (min-width:1440px) {
    .wrap-product-bottom ul.list-product li{-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
    .wrap-product-bottom ul.list-product li:nth-child(n+5){display:none;}
}


/* Câu hỏi thường gặp */

.wrap-questions{width:100%; float:left; position:relative; background:#fff; border-radius:10px; margin-top:25px; padding:25px 25px 10px 25px; box-shadow: 0 0 0 1px var(--color-border); }
.wrap-questions .title{width:100%; float:left; position:relative; font-weight:bold; font-size:20px; color:#000}
.wrap-questions ul{margin:0; padding:5px 0 0 0; list-style:none; width:100%; float:left;}
.wrap-questions ul li{width:100%; float:left; position:relative; font-size:16px; color:#000; padding: 15px 0 15px 30px; border-top:1px solid var(--color-border); line-height:24px; transition:.3s;}
.wrap-questions ul li:first-child{border:none;}
.wrap-questions ul li b{width:100%; float:left; position:relative; font-weight:500; margin:0; cursor:pointer; padding-bottom: 0px; padding-right:20px; }
.wrap-questions ul li b:after{font-family: "Font Awesome 5";font-weight: 900;content: "\f078"; font-size:14px; position:absolute; top:0; right:0; opacity:.5; transition:.3s;}
.wrap-questions ul li.is-open label:after{content:"\f077"; opacity:1;}
.wrap-questions ul li i{width:100%; transition:.3s; float:left; display:none; opacity:.9; font-style:normal;}
.wrap-questions ul li.is-open i{}
.wrap-questions ul li.is-open i,
.wrap-questions ul li.is-open em{display:block; padding-top:5px;}
.wrap-questions ul li:before{content:'1'; width:20px; height:20px; line-height:21px; border-radius:4px; font-weight:bold; font-size:13px; color:#fff; background:var(--color2); text-align:center; position:absolute; top:16px; left:0; }
.wrap-questions ul li:nth-child(2):before{content:'2'}
.wrap-questions ul li:nth-child(3):before{content:'3'}
.wrap-questions ul li:nth-child(4):before{content:'4'}
.wrap-questions ul li:nth-child(5):before{content:'5'}
.wrap-questions ul li:nth-child(n+6){display:none!important}

@media (max-width:767px){
    .wrap-questions{width:calc(100% + 30px); background:#fff; box-shadow:none; border-radius:0; margin-left:-15px;padding: 0px 15px 0 15px; margin-top:30px; box-shadow: 0 -30px #fff; }
}
.view-more{text-decoration:none; width:100%; max-width:400px; border:1px solid rgba(0,0,0,.1); line-height:38px; border-radius:5px; text-align:center; display:block; margin: 0 auto; clear:both; font-weight:500; color:var(--color1); text-decoration:none; background:rgba(0,0,0,.02); }
.view-more:hover{text-decoration:none; background:#fff;}

#myModal-buyWholesale .modal-dialog{max-width:450px}
#myModal-buyWholesale .modal-dialog .note{width:100%; float:left; padding-top:20px;}
#myModal-buyWholesale .modal-dialog a.nav-send{width:100%; float:left; line-height:44px; height:44px; background:var(--color1); text-align:center; border-radius:5px; margin-top:20px; color:#fff; text-transform:uppercase; font-weight:500; box-shadow:inset 0 0 rgba(0}