:root {
    --color1: #127948;
    --color2: #d36600;
    --color3: #d61b14;
    --color-border: #e5e7eb;
    --colorBg: #f4f5ec;
    --color-line: #e5e6e9;
}

html{}
body{ float:left; padding-top:0px; font-family: "Momo Trust Sans", sans-serif;  font-weight: 400; font-style: normal; width:100%; font-size:16px; color:rgba(0,0,0,.8); margin:initial!important; overflow-x:hidden; overflow-y:auto;}

#wrapper-page{position:relative; display:flex; flex-direction:column; padding: 0 60px; width:100%; overflow:hidden}

@media (max-width:767px) {
    body{padding-bottom:65px;}
    #wrapper-page{padding: 0 0px}
}

@media (min-width:768px) and (max-width:991px) {
    #wrapper-page{padding: 0 0px}
}

@media (min-width:992px) and (max-width:1199px) {
    #wrapper-page{padding: 0 20px}
}

@media (min-width: 1440px) {
    .container { max-width: 1420px}
}

/*****************************************************************/
/*                             Header                            */
/****************************************************************/


header{width:100%; float:left;  padding: 0; position:absolute; top:0; left:0; z-index:30; background:#fff;}
header .col-header{height:90px; position:relative;}
header .col-header .nav-logo{position: absolute;top: 15px; left: 50%; width: 160px; margin-left: -80px;}
header .col-header .nav-logo:before{content: ''; width: 320px;margin-left: -160px; height: 70px; position: absolute;left: 50%;bottom: -20px;background: url(LP-bg-logo.svg) no-repeat center bottom; background-size: 100% auto;}
header .col-header .nav-logo img{width:100%; position:relative; z-index:2;}
header .top-hotline{float:right; position:relative; color:#000; font-weight:400; margin-top:25px; height:40px; padding: 0 20px 0 0; display:none;}
header .top-hotline span{display:block; clear:left; text-align:left;  font-size:15px;}
header .top-hotline b{font-size:20px; font-weight:600; margin-top:-5px;  float:left; } 
header .top-hotline:hover{color:var(--color1)}

@media (max-width:767px){
    header{display:none; pointer-events:none} 
}

@media (min-width: 768px) and (max-width:991px){
    header .col-header .nav-logo{width:120px; margin:0; left:15px; top:20px;}
    header .col-header .nav-logo:before{display:none;}

}

@media (min-width: 992px) and (max-width:1199px){
     header .container{max-width:100%}
}

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

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



header .wrap-mainmeu{float:left; position:relative; z-index:3;}
header .wrap-mainmeu>ul{margin:25px 0 0 0; padding:0; list-style:none;}
header .wrap-mainmeu>ul>li{float:left; margin-right:20px; position:relative; height:51px;}
header .wrap-mainmeu>ul>li>a{text-decoration:none; font-weight:600; color:rgba(0,0,0,.8); font-size:15px; transition:.3s; height:40px; line-height:40px; text-transform:uppercase; }
header .wrap-mainmeu>ul>li:hover>a{color:var(--color1)}
header .wrap-mainmeu>ul>li>a.sub:after{font-family: "Font Awesome 5"; font-weight:900; content: "\f0d7"; font-size:10px; padding-left:5px; display:none;}
header .wrap-mainmeu>ul>li>ul{display:block; position:absolute; top:100%; left:0;width:240px; background:#fff; box-shadow: 0 0 60px 0 rgb(53 57 69 / 15%); margin:10px 0 0 0; padding:15px 0; list-style:none; opacity:0; visibility:hidden; transition:.3s; pointer-events:none; border-radius:15px 15px; }
header .wrap-mainmeu>ul>li>ul>li{width:100%; float:left; position:relative;}
header .wrap-mainmeu>ul>li>ul>li>a{color:rgba(0,0,0,1); padding: 10px 20px; font-size:16px; display:block; font-weight:400; width:100%; float:left; transition:.3s; position:relative; text-decoration:none;}
header .wrap-mainmeu>ul>li>ul>li>a:before{content:''; height:2px; margin-top:-1px; width:0px; background:var(--color1); position:absolute; top:50%; left:20px; transition:.3s;}
header .wrap-mainmeu>ul>li>ul>li:hover>a{padding-left:40px; color:var(--color1) }
header .wrap-mainmeu>ul>li>ul>li:hover>a:before{width:13px;}
header .wrap-mainmeu>ul>li:hover>ul{margin-top:0px; opacity:1; visibility:initial; pointer-events:initial}
header .wrap-mainmeu>ul>li>ul>li>ul{width:220px; padding:15px 0; min-height:100%; position:absolute; top:-15px; left:100%; opacity:0; visibility:hidden; pointer-events:none; transition:.3s; background:#fff; list-style:none; box-shadow: 0 0 60px 0 rgb(53 57 69 / 15%); border-radius:15px 15px;}
header .wrap-mainmeu>ul>li>ul>li>ul>li{width:100%; float:left;}
header .wrap-mainmeu>ul>li>ul>li>ul>li>a{color:rgba(0,0,0,1); font-family: "Signika", sans-serif;  padding: 10px 20px; font-size:16px; display:block; font-weight:400; width:100%; float:left; transition:.3s;position:relative; text-decoration:none!important}
header .wrap-mainmeu>ul>li>ul>li>ul>li>a:before{content:''; height:2px; margin-top:-1px; width:0px; background:var(--color1); position:absolute; top:50%; left:20px; transition:.3s;}
header .wrap-mainmeu>ul>li>ul>li>ul>li>a:hover{padding-left:40px; color:var(--color1) }
header .wrap-mainmeu>ul>li>ul>li>ul>li>a:hover:before{width:13px;}
header .wrap-mainmeu>ul>li>ul>li:hover>ul{opacity:1; visibility:initial; pointer-events:initial}

@media (max-width:767px){
    header .wrap-mainmeu{display:none!important;}
}

@media (min-width: 768px) and (max-width:991px){
    header .wrap-mainmeu{float:right; clear:right; margin-right:-20px;}
    header .wrap-mainmeu>ul{margin-top:20px;}
}

@media (max-width:1439px){
}

@media (min-width:1440px) and (max-width:1599px){
}
@media (min-width:1600px){
    
}

/* Tài khoản */
.act-account{position:relative; float:right; padding-left:35px; margin-top:25px; margin-right:20px; font-size:14px; padding-right:20px; }
.act-account:after{content:''; width:1px; height:30px; background:#000; position:absolute; top:2px; right:0; opacity:.15}
.act-account i{font-size:25px; font-weight:300; position:absolute; top:6px; left:0; transition:.3s;}
.act-account .nav-login{text-decoration:none!important; color:#000; font-weight:500; position:relative; padding-top:16px; display:block; float:left;}
.act-account .nav-login:before{content:'Tài khoản'; font-size:12px; white-space:nowrap; font-weight:400; opacity:.7; display:block; position:absolute; top:0; left:0; color:#000}
.act-account .nav-register{display:none!important}

@media (min-width: 768px) and (max-width:991px) {
    .act-account{margin-top:15px;}    
}


/* Hotline */
header .hotline{position:relative; margin-top:25px; text-decoration:none!important; color:#000; float:right; padding-left:37px; margin-right:20px; padding-right:20px;}
header .hotline:after{content:''; width:1px; height:30px; background:#000; position:absolute; top:2px; right:0; opacity:.15}
header .hotline:before{content:'Hotline'; font-size:12px; white-space:nowrap; font-weight:400; opacity:.7}
header .hotline i{font-size:24px; font-weight:300; position:absolute; top:7px; left:0; transition:.3s;}
header .hotline b{font-size:14px; margin-top:-2px; display:block; font-weight:600}

@media (min-width: 768px) and (max-width:991px) {
    header .hotline{margin-top:15px;}   
}

/* Cart */
header .nav-cart{position:relative; margin-top:25px; text-decoration:none!important; color:#000; float:right; padding-left:40px;}
header .nav-cart:before{content:'Giỏ hàng'; font-size:12px; white-space:nowrap; font-weight:400; opacity:.7}
header .nav-cart i{font-size:25px; font-weight:300; position:absolute; top:6px; left:0; transition:.3s;}
header .nav-cart b{font-size:14px; margin-top:-2px; display:block; font-weight:600}
header .nav-cart b:after{content:'Sản phẩm'; white-space:nowrap; font-weight:500; padding-left:5px;}
header .nav-cart:hover i{color:var(--color2);}

@media (min-width: 768px) and (max-width:991px) {
    header .nav-cart{margin-top:15px;}
}



/* Search */
.swap-search{display:none;}

@media (max-width:767px) {
    .swap-search{ position:absolute; width:calc(100% - 30px); height:44px; z-index:15; transition:.3s; float:right; margin: 0 0 0 0px; background:#fff; border-radius:20px; bottom:20px; left:15px;}
    .swap-search .search-bnt{width:38px; height:38px; color:var(--color1); font-size:18px; text-align:center; line-height:38px; border-radius:0; display:block; text-decoration:none; transition:.3s;position:absolute; top:3px; right:3px; z-index:5; font-weight:400; transition:.3s; pointer-events:none;}
    .swap-search .textbox{position:absolute; float:left; width:100%; padding:0 46px 0 15px; color:#000; background:var(--colorBg); border:none; font-weight:500; transition:.3s; height:44px; transition:.3s; z-index:1;  border-radius:23px; color:rgba(0,0,0,.75); top:0; right:0; font-size:14px;}
    .swap-search .textbox:focus{outline:none; box-shadow: 0 0 0 2px var(--color1); background:#fff;}

    header.fixed .swap-search{width:calc(100% - 130px); position:fixed; top:10px; left:65px; z-index:92}
 }

@media (min-width:768px) {
    .swap-search{ position:relative; width:400px; height:46px; z-index:15; transition:.3s; float:right; margin: 22px 0 0 0px; background:#fff; border-radius:23px; margin-right:70px;}
    .swap-search .search-bnt{width:40px; height:40px; color:var(--color1); font-size:18px; text-align:center; line-height:40px; border-radius:0; display:block; text-decoration:none; transition:.3s;position:absolute; top:3px; right:3px; z-index:5; font-weight:400; transition:.3s; pointer-events:none;}
    .swap-search .textbox{position:absolute; float:left; width:100%; padding:0 46px 0 15px; color:#000; background:var(--colorBg); border:none; font-weight:500; transition:.3s; height:46px; transition:.3s; z-index:1;  border-radius:23px; color:rgba(0,0,0,.75); top:0; right:0; font-size:14px;}
    .swap-search .textbox:focus{outline:none; box-shadow: 0 0 0 2px var(--color1); background:#fff;}
    .mainsearch-open{z-index:20; position:relative;}
        
}
@media (min-width: 768px) and (max-width:991px){
    .swap-search{float:left; margin-right:0; width:250px }
}
@media (min-width: 992px) and (max-width:1199px){
    .swap-search{float:left; margin-right:0; width:350px }
}
@media (min-width: 1200px) and (max-width:1439px){
    .swap-search{float:left; margin-right:0; }
}
@media (min-width:1440px) and (max-width:1599px){
     .swap-search{ width:320px;}
}

.ui-autocomplete,
.ui-helper-hidden-accessible{display:none!important}
.searchResult-panel{width:400px; float:left; position:absolute; top:51px; right:0; background:#fff;  box-shadow: 0 0 60px 0 rgb(53 57 69 / 15%); display:none; padding: 0 15px; border-radius:15px;}
.searchResult-panel.is-open{display:block;}
.searchResult-panel .lab-key{width:100%; float:left; position:relative; padding:10px; margin-bottom:10px; font-weight:500; background:rgba(0,0,0,.03); border-radius:7px; box-shadow:inset 0 0 0 1px rgba(0,0,0,.02); display:none;}
.searchResult-panel .lab-key b{color:var(--color3); font-weight:bold; font-size:16px;}


.searchSuggest-panel{width:100%; float:left; position:relative; display:none; padding-bottom:20px;}
.searchSuggest-panel.is-open{display:block;}
.searchSuggest-panel .groupSuggest{width:100%; float:left; position:relative; margin-top:10px;}
.searchSuggest-panel .groupSuggest .title-group{width:100%; float:left; position:relative; display:block; border-bottom:1px solid rgba(0,0,0,.1); padding: 7px 0; }
.searchSuggest-panel .groupSuggest .title-group:before{content:''; width:30px; height:1px; background:var(--color1); position:absolute; left:0; bottom:-1px;}
.searchSuggest-panel .groupSuggest .title-group span{text-transform:uppercase; font-size:13px; font-weight:500; float:left;}
.searchSuggest-panel .groupSuggest .title-group a{display:block; position:absolute; top:5px; right:0; font-size:14px; color:#000; transition:.3s;}
.searchSuggest-panel .groupSuggest .title-group a:hover{color:#ec1f26}
.searchSuggest-panel ul.link{width:calc(100% + 10px); margin:0; padding:5px 0 0 0; list-style:none; float:left; }
.searchSuggest-panel ul.link li{float:left; padding:0; margin: 10px 10px 0 0;}
.searchSuggest-panel ul.link li a{white-space:nowrap; background:var(--colorBg); line-height:21px; height:22px; border-radius:11px; padding: 0 10px; display:block; float:left; color:#000; transition:.3s;}
.searchSuggest-panel ul.link li a:hover{background:var(--color1); color:#fff;}

.autocomplete-panel{width:100%; float:left; position:relative; display:none;}
.autocomplete-panel.is-open{display:block;}
.autocomplete-panel .nav-viewAll{width:100%; float:left; position:relative; padding:0 0; line-height:50px; text-align:left;  border-radius:0px; color:#000; font-weight:400; transition:.3s; border-top:1px solid rgba(0,0,0,.07); margin-bottom:0; display:none; }
.autocomplete-panel .nav-viewAll.is-open{display:block;}
.autocomplete-panel .nav-viewAll:after{font-family: "Font Awesome 5"; font-weight:400; content: "\f178"; float:right; font-size:16px;}
.autocomplete-panel .nav-viewAll:hover{color:var(--color1)}

.swap-search ul.listProduct-search{margin:0; padding:0; list-style:none; width:100%; float:left; position:relative; overflow-y:auto;}
.swap-search ul.listProduct-search li{width:100%; float:left; position:relative; min-height:90px; padding: 10px 0 3px 75px; display:flex; align-items:center; border-top:1px solid rgba(0,0,0,.07); }
.swap-search ul.listProduct-search li:first-child{border:none;}
.swap-search ul.listProduct-search li a{width:100%; height:100%; float:left; display:block; position:absolute; top:0; left:0; z-index:3; }
.swap-search ul.listProduct-search li .inner{display:block; width:100%; float:left;}
.swap-search ul.listProduct-search li .wrap-img{width:60px; height:60px; position:absolute; top:15px; left:0; overflow:hidden; border-radius:5px;}
.swap-search ul.listProduct-search li .wrap-img img{width:inherit; height:inherit; object-fit:cover;}
.swap-search ul.listProduct-search li h4{display:block; width:100%; font-family: "Signika", sans-serif;  margin:-5px 0 0 0; padding:0; font-size:17px; font-weight:500; transition:.3s; color:rgba(0,0,0,.8)}
.swap-search ul.listProduct-search li:hover h4{color:var(--color1)}
.swap-search ul.listProduct-search li .wrap-price{width:100%; float:left; position:relative; padding-top:2px;}
.swap-search ul.listProduct-search li .wrap-price:before{content:'Giá:'; opacity:.5}
.swap-search ul.listProduct-search li .wrap-price b{font-weight:bold; color:var(--color3); font-weight:bold; font-size:15px; position:relative; padding-right:12px; margin-left:10px;}
.swap-search ul.listProduct-search li .wrap-price b:after{content:'₫'; position:absolute; top:-3px; right:0; font-size:13px; }
.swap-search ul.listProduct-search li .wrap-price .compare{font-size:15px; font-weight:normal; color:rgba(0,0,0,.75); padding-right:10px;}
.swap-search ul.listProduct-search li .wrap-price .compare:after{font-size:13px;}
.swap-search ul.listProduct-search li .wrap-price .compare:before{content:''; width:100%; height:1px; background:#7c7c7c; top:50%; left:0; position:absolute; margin-top:-1px; z-index:3;}
.swap-search ul.listProduct-search li:nth-child(n+6){display:none;}
.swap-search ul.listProduct-search li.no-result{padding:15px 0 ; display:block; min-height:initial; color:var(--color3); font-size:15px; text-align:center;}




.wrap-page{width:100%; float:left; position:relative;}



/*****************************************************************/
/*                             Footer                            */
/****************************************************************/

footer{width:100%; float:left; position:relative; background:url(../../Data/photo/footer.jpg) no-repeat center bottom; background-size:cover; margin-top:90px; margin-bottom:40px; border-radius:20px; overflow:hidden;}
footer:before{ background: rgba(0,0,0,.5) url(../../js/other/vegas-slider/overlays/0.png) repeat center; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; opacity:1; content:'';}
footer .inner{width:100%; float:left; position:relative; display:table;}
footer .container{position:relative; z-index:3;}
footer .caption{width:320px; position:relative; background:var(--color1); float:left; z-index:13; border-radius: 0 0 15px 15px; display:table-cell;}
footer .caption a.nav-link{width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:3;}
footer .caption h4{font-size:13px; margin:0; padding: 10px 20px; color:#fff; background:rgba(0,0,0,.1); text-align:center; box-shadow: inset 0 -1px rgba(0,0,0,.03); font-weight:400;}
footer .caption .logo{width:160px; display:block; display:flex; align-items:center; padding:25px 30px; float:left; position:relative;}
footer .caption .logo:before{content: ''; height: calc(100% - 60px); width: 1px;background: #000; box-shadow:1px 0 #fff; position: absolute; right: 0px; top: 30px; opacity: .3;}
footer .caption .logo svg{fill:#fff;}
footer .caption .qr-code{width:160px;  float:left; padding:23px 40px 0 40px;}
footer .caption .qr-code svg{width:100%; fill:#fff; }
footer .foot-nav{position:relative; min-width:650px; display:table-cell; text-align:left; vertical-align:top; padding: 10px 30px 0 30px }
footer .foot-nav ul.nav-row{margin:0; padding:0; list-style:none; display:flex; width:100%; border-bottom:1px solid rgba(255,255,255,.07)}
footer .foot-nav ul.nav-row li{position:relative; margin-right:25px; padding-right:25px;}
footer .foot-nav ul.nav-row li:before{content:''; width:6px; height:6px; background:#fff; border-radius:50%; right:-3px; top:50%; margin-top:-3px; display:block;  position:absolute; opacity:.5}
footer .foot-nav ul.nav-row li:last-child{padding-right:0; margin-right:0;}
footer .foot-nav ul.nav-row li:last-child:before{display:none;}
footer .foot-nav ul.nav-row li a{color:#fff; text-decoration:none!important; line-height:60px; font-weight:500; font-size:15px; transition:.3s; text-transform:uppercase}
footer .foot-nav ul.nav-row li a:hover{color:var(--color2)}
footer .foot-nav ul.nav-col{width:100%; margin:20px 0 0 0; padding:0 0; list-style:none; float:left;}
footer .foot-nav ul.nav-col li{width:calc(33.3333333% - 20px); margin-right:20px; float:left;}
footer .foot-nav ul.nav-col li.title{width:100%; position:relative; font-size:18px; font-weight:600; color:#fff; padding-bottom:10px; }
footer .foot-nav ul.nav-col li a{color:#fff; text-decoration:none!important; font-size:15px; line-height:30px; transition:.3s;}
footer .foot-nav ul.nav-col li a:hover{color:var(--color2)}
footer .foot-office{display:table-cell; position:relative; width:100%; text-align:left; vertical-align:top; padding-top:30px;} 
footer .foot-office ul{margin:0; padding:0; list-style:none; width:100%; float:left; color:#fff;}
footer .foot-office ul li{width:100%; float:left; font-size:15px; margin-top:15px; }
footer .foot-office ul li:first-child{text-transform:uppercase; font-weight:600; font-size:18px;}
footer .foot-office ul li span{width:95px; display:inline-block; font-weight:600; }
footer .foot-office ul li span:after{content:':'; float:right; padding-right:10px;}
footer .foot-office ul li a{color:#fff; text-decoration:none; transition:.3s;}
footer .foot-office ul li a:hover{color:var(--color2)}
footer .wrap-copyright{display:table; width:100%; float:left; padding:15px 0; font-size:14px; border-top:1px solid rgba(0,0,0,.07); margin-top:20px; }
footer .wrap-copyright .col-left{display:table-cell; text-align:left; vertical-align:middle; color:#fff;}
footer .wrap-copyright .col-left a{color:var(--color1); color:#fff}
footer .wrap-copyright .col-right{display:table-cell; text-align:right;}
footer .wrap-copyright .col-right ul{margin:0px 0 0 0; padding:0; list-style:none; float:right; display:flex}
footer .wrap-copyright .col-right ul li{margin-left:10px;}
footer .wrap-copyright .col-right ul li:first-child{margin-left:0;}
footer .wrap-copyright .col-right ul li a{width:30px; height:30px; border-radius:7px; border: 1px dashed rgba(255,255,255,.5); color:#fff; display:flex; align-items:center; justify-content:center; position:relative;font-size:16px; display:flex; float:left;transition:.3s; text-decoration:none!important}
footer .wrap-copyright .col-right ul li a:hover{ background:var(--color2); border-color:var(--color2); color:#fff}



@media (max-width:767px) {
    footer{margin-top:50px; margin-bottom:0; border-radius:20px 20px 0 0; background:var(--color1); padding-bottom:20px;}
    footer:before{display:none;}
    footer .inner{display:block; width:100%;}
    footer .caption{display:block; left:50%; margin-left:-160px; background:rgba(0,0,0,.15)}
    footer .foot-nav{min-width:initial; width:100%; padding:0; display:block;}
    footer .foot-nav ul.nav-row{border-bottom:1px solid rgba(255,255,255,.15); margin-top:15px; width:100%; float:left;}
    footer .foot-nav ul.nav-col{width:calc(100% + 20px); margin-left:-10px; border-bottom:1px solid rgba(255,255,255,.15); padding-bottom:15px;}
    footer .foot-nav ul.nav-col li{width:calc(50% - 20px); margin: 0 10px;}
    footer .foot-office{display:block; padding-top:15px; width:100%; float:left;}
    footer .foot-office ul li{margin-top:10px;}
    footer .wrap-copyright{border-top:1px solid rgba(255,255,255,.15);}
    footer .wrap-copyright .col-left{width:50%;}
}

@media (min-width:768px) and (max-width:1199px){
    footer{width:calc(100% - 30px); margin: 50px 0 15px 15px}
    footer .inner{min-height:370px;}
    footer .caption{display:block; float:left;}
    footer .foot-nav{min-width:initial; display:block; width:calc(100% - 330px); float:right ; padding-right:0;}
    footer .foot-nav ul.nav-col{width:calc(100% + 20px); margin-left:-10px;}
    footer .foot-nav ul.nav-col li{width:calc(50% - 20px); margin: 8px 10px 0 10px;}
    footer .foot-office{display:block; clear:both; width:330px; position:absolute; top:150px;}
    footer .foot-office ul li{margin-top:10px;}
    footer .foot-office ul li:first-child{font-size:16px;}
    footer .wrap-copyright{border-color:rgba(255,255,255,.5)}
}

@media (min-width:991px) and (max-width:1199px){
    footer:before{ background: rgba(0,0,0,.5)}
}

@media (min-width:1200px) and (max-width:1439px){
    footer{background-position: -1400px bottom;}
    footer .inner{display:block;}
    footer .foot-nav ul.nav-row{border-color:rgba(255,255,255,.3)}
    footer .foot-nav ul.nav-col{border-bottom:1px solid rgba(255,255,255,.3); padding-bottom:25px;}
    footer .foot-nav ul.nav-col li{width:25%; margin:5px 0 0 0;}
    footer .foot-office{display:block; width:100%; padding-left:350px; float:left; padding-top:10px;}
    footer .foot-office ul li{width:33.3333333%;}
    footer .foot-office ul li:first-child,
    footer .foot-office ul li:nth-child(2){width:100%;}
    footer .foot-office ul li span{width:initial}
}

/* sitemap */
.wrap-sitemap{width:100%; position:relative; float:left; margin-top:90px; overflow:hidden;}
.wrap-sitemap .inner{width:100%; float:left; position:relative; background-image: linear-gradient(to bottom, rgba(183,160,127,.15), rgba(0,0,0,0)); border-radius:0px; display:table; }
.wrap-sitemap .inner:before{content:''; width:200px; height:100%; display:block; position:absolute; top:0; left:0; background-image: linear-gradient(to right, rgba(255,255,255,1) , rgba(255,255,255,0));}
.wrap-sitemap .inner:after{content:''; width:200px; height:100%; display:block; position:absolute; top:0; right:0; background-image: linear-gradient(to left, rgba(255,255,255,1) , rgba(255,255,255,0));}
.wrap-sitemap .col-sitemap{position:relative; border-radius:14px; padding:30px 30px; display:table-cell; vertical-align:middle; z-index:2; }
.wrap-sitemap ul{list-style:none; margin:0; padding:5px 0 0 0; position:relative; float:left; z-index:3; opacity:.7 }
.wrap-sitemap ul li{float:left; position:relative; padding-right:20px; margin-right:15px;}
.wrap-sitemap ul li:after{font-family: "Font Awesome 5"; font-weight:900; content: "\f0da"; font-size:12px; padding:0; position:absolute; top:5px; right:0;}
.wrap-sitemap ul li:last-child{padding-right:0; margin-right:0;}
.wrap-sitemap ul li:last-child:after{display:none;}
.wrap-sitemap ul li a{text-decoration:none; color:#000; font-size:14px; margin:0; padding:0;  font-weight:normal;}
.wrap-sitemap ul li span{color:#000; font-size:14px; margin:0 0 -2px 0; padding:0; font-weight:500; float:left; display:block; }
.wrap-sitemap .title-page{ font-size:22px; font-weight:600; margin:0; position:relative;z-index:3; color:var(--color2); white-space:nowrap }
.wrap-sitemap .wrap-search{float:right; position:relative; max-width:400px; width:100%; z-index:2;}
.wrap-sitemap .wrap-search input[type="text"]{width:100%; border:none; height:46px; border-radius:7px; padding: 0 60px 0 20px; outline:none; background:#fff; font-size:16px; font-weight:500; box-shadow: 0 0 0 1px rgba(0,0,0,.07) }
.wrap-sitemap .wrap-search .navSearch{font-weight: 900;width:50px; line-height:46px; font-size:16px; color:#000; opacity:.75; text-align:center; position:absolute; right:0; top:0; text-decoration:none!important}
.wrap-sitemap .wrap-search .navSearch:hover{color:var(--color2)}



@media (max-width:767px){
    .wrap-sitemap{margin-top:0;box-shadow: 0 1px rgba(0, 0, 0, .03), 0 2px 5px rgba(0, 0, 0, .05); }
    .wrap-sitemap .inner{background:none;}
    .wrap-sitemap .col-sitemap{padding:0;}
    .wrap-sitemap ul{display:none;}
    .wrap-sitemap .title-page{color:#000; line-height:60px; font-size:19px; font-weight:600; padding-right:20px;}
    .wrap-sitemap .wrap-search input[type="text"]{background:rgba(0,0,0,.05); box-shadow:none; }
}

@media (min-width:768px) and (max-width:991px) {
    .wrap-sitemap{margin-top:130px;}
}

@media (min-width:992px) and (max-width:1199px){
    .wrap-sitemap{width:calc(100% + 40px); margin-left:-20px;}
    .wrap-sitemap .container{max-width:100%}
    .wrap-sitemap .wrap-search{max-width:320px;}
}
@media (min-width:1200px) and (max-width:1439px){
    .wrap-sitemap .wrap-search{max-width:350px;}
}

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


/*****************************************************************/
/*                            Element                            */
/****************************************************************/
/* owl.carousel */
.owl-theme .owl-controls .owl-buttons div{width:50px; height:50px; margin:0; padding:0; background:#fff!important; opacity:1!important; font-size:0!important; padding:0!important; position:relative; color:#404144!important; transition:.3s;}
.owl-theme .owl-controls .owl-buttons div:before{font-family:"Font Awesome 5"; font-weight:400; font-size:16px; width:100%; height:100%; position:absolute; top:0; left:0; display:flex; align-items:center; justify-content:center; transition:.3s;}
.owl-theme .owl-controls .owl-buttons div:hover{color:var(--color3)!important; }
.owl-theme .owl-controls .owl-buttons .owl-prev:before{content: "\f053"; padding-right:2px;}
.owl-theme .owl-controls .owl-buttons .owl-next:before{content:"\f054"; padding-left:2px;}

.owl-theme .owl-controls .owl-page span{opacity:1!important; width:20px!important; height:20px!important; margin:0 2px!important; background:none!important; position:relative; }
.owl-theme .owl-controls .owl-page span:before{content:''; width:10px; height:10px; margin: -5px 0 0 -5px; position:absolute; top:50%; left:50%; background:rgba(0,0,0,.5); border-radius:50%; z-index:2;}
.owl-theme .owl-controls .owl-page span:after{content:''; width:20px; height:20px; border-radius:50%; position:absolute; top:0; left:0; z-index:1; opacity:0; transition:.3s; box-shadow: 0 0 0 1px var(--color1);}
.owl-theme .owl-controls .owl-page.active span:before{background:var(--color1); box-shadow: 0 0 0 1px rgba(255,255,255,.5)}
.owl-theme .owl-controls .owl-page.active span:after{opacity:1;}

/* */
.myModal{box-shadow:none;}
.myModal .modal-content{background:none; box-shadow:none; z-index:2;}
.myModal .modal-content:before{content:''; width:calc(100% - 80px); height:100%; background:#fff; border-radius:16px 0 0 16px; position:absolute; top:0; left:0;}
.myModal .modal-content:after{content:''; width:80px; height:calc(100% - 80px); background:#fff; border-radius: 0 0 16px 0; position:absolute; right:0; bottom:0;}
.myModal .modal-content .modal-header{padding-left:25px;}
.myModal .modal-content .modal-header:after{content:''; width:80px; height:80px;background:url(LP-clip-modalBg-rt.svg) no-repeat right 0; background-size: auto 81px; position:absolute; top:0; right:0; }
.myModal .modal-content .modal-header .nav-close{width:40px; height:40px; border-radius:50%; background:#fff; position:absolute; top:0; right:0; color:#e41727; transition:.3s; }
.myModal .modal-content .modal-header .nav-close:hover{background:#e41727; color:#fff;}
.myModal .modal-content .modal-header .title-modal{font-family:"Signika", sans-serif; font-size:22px; font-weight:600}
.myModal .modal-content .modal-body{padding: 0 25px 25px 25px; position:relative; z-index:3;}


/* Modal notifyAddToCart */
#myModal-notifyAddToCart .product-ele{width:100%; float:left; position:relative; min-height:150px; display:flex; margin-top:0px; padding-left:170px; margin-bottom:10px; align-items:center;}
#myModal-notifyAddToCart .product-ele .wrap-img{width:150px; height:150px; position:absolute; top:0; left:0; border-radius:10px; overflow:hidden; }
#myModal-notifyAddToCart .product-ele .wrap-img img{width:inherit; height:inherit; object-fit:cover}
#myModal-notifyAddToCart .product-ele .info{width:100%; float:left; position:relative;}
#myModal-notifyAddToCart .product-ele .info h4{margin:0; padding:0 0; display:block; font-size:18px; font-weight:500; color:#000; font-family:"Signika", sans-serif;}
#myModal-notifyAddToCart .product-ele .info .quantity{width:100%; float:left; margin: 8px 0}
#myModal-notifyAddToCart .product-ele .info .quantity b{float:left; position:relative; font-size:17px; font-weight:bold }
#myModal-notifyAddToCart .product-ele .info .quantity b:after{content:'x'; padding: 0 10px; font-weight:400; opacity:.7}
#myModal-notifyAddToCart .product-ele .info .quantity .price{font-family:"Signika", sans-serif; float:left; position:relative; text-align:left;z-index:4; color:#f44336; font-weight:600; font-size:18px;}
#myModal-notifyAddToCart .product-ele .info .quantity .price:after{content:'đ'; font-size:16px; padding-left:3px; font-weight:600;}
#myModal-notifyAddToCart .product-ele .info .quantity .price span{display:none;}
#myModal-notifyAddToCart .product-ele .info .nav-goCart{display:block; clear:left; float:left; line-height:41px; height:40px; background:var(--color1); padding: 0 20px; border-radius:5px; font-weight:500; color:#fff; box-shadow: inset 0 0 rgba(0,0,0,0); transition:.3s;}
#myModal-notifyAddToCart .product-ele .info .nav-goCart:after{font-family: "Font Awesome 5"; font-weight: 900; content: "\f061"; font-size:15px; margin-left:10px;} 
#myModal-notifyAddToCart .product-ele .info .nav-goCart:hover{box-shadow:inset 0 40px rgba(0,0,0,.15)}



/* Modal */
.myModal-bootrap{}
.myModal-bootrap .modal-content{border-radius:7px; border:none; padding: 0 0px;}
.myModal-bootrap .modal-content .modal-header{border:none; padding: 0 30px;}
.myModal-bootrap .modal-content .modal-header .modal-title{text-transform:uppercase; font-weight:bold; font-size:17px; line-height:60px; height:60px;  color:var(--color1)}
.myModal-bootrap .modal-content .modal-header .nav-close{width:30px; height:26px; line-height:26px; text-align:center; color:#fff; background:#ec1f26; font-size:25px; text-decoration:none; position:absolute; top:-1px; right:30px; box-shadow: 0 2px 10px rgba(0,0,0,.15)}
.myModal-bootrap .modal-content .modal-header .nav-close:before{content:''; border-top:4px solid #ec1f26; border-left: 15px solid transparent; border-right: 15px solid transparent; position:absolute; top:100%; left:0;}
.myModal-bootrap .modal-content .modal-body{padding: 0 30px;}
.myModal-bootrap .modal-content .modal-footer{border:none; padding: 15px 25px; }
.myModal-bootrap .modal-content .modal-footer .nav-modal{display:inline-block; line-height:36px; height:36px; white-space:nowrap; font-size:14px; text-decoration:none; color:#fff; border-radius:3px; padding: 0 15px 0 35px; position:relative; margin: 0 5px; opacity:1; transition:.3s; box-shadow: inset 0 0 rgba(0,0,0,0); }
.myModal-bootrap .modal-content .modal-footer .nav-modal:hover{box-shadow: inset 0 36px rgba(0,0,0,.15)}
.myModal-bootrap .modal-content .modal-footer .nav-modal i{font-size:16px; position:absolute; top:0; line-height:36px; left:12px;}
.myModal-bootrap .modal-content .modal-footer .bg-red{background:var(--danger)}
.myModal-bootrap .modal-content .modal-footer .bg-green{background:var(--green)}
.myModal-bootrap .modal-content .modal-footer .bg-orange{background:var(--orange)}

.popover{border:none; box-shadow: 0 0 0 1px rgba(0,0,0,.07), 0 0 10px rgba(0,0,0,.05); border-radius:7px; padding: 0 15px; text-align:left;}
.popover-header{background:none; padding: 15px 0 10px 0; font-family:Roboto; font-size:15px; color:#000; }
.popover-body{padding: 10px 0 15px 0; text-align:left; font-size:14px; font-family:Roboto;}

#myModal-sendMail{}
#myModal-sendMail .modal-content{border-radius:5px; border:none; box-shadow: 0 1px 3px rgba(0,0,0,.1)}
#myModal-sendMail .modal-content .modal-header{padding:13px 15px; border-bottom:1px solid rgba(0,0,0,.07); box-shadow: 0 1px rgba(0,0,0,.015)}
#myModal-sendMail .modal-content .modal-header .modal-title{font-size:15px; font-weight:bold; font-family:Roboto; color:var(--color1)}
#myModal-sendMail .modal-content .modal-body{padding: 0px 20px 20px 20px}
#myModal-sendMail .modal-content .modal-body ul{margin:0 -10px; padding:0; list-style:none; position:relative;}
#myModal-sendMail .modal-content .modal-body ul li{position:relative; margin-top:15px; padding: 0 10px; }
#myModal-sendMail .modal-content .modal-body ul li label{font-size:13px; color:rgba(0,0,0,.5);  margin-bottom:5px;}
#myModal-sendMail .modal-content .modal-body ul li .title-sendMail{color:rgba(0,0,0,.85); font-size:18px; margin:0; padding:0 0 5px 0; clear:both; display:block; }
#myModal-sendMail .modal-content .modal-body ul li input[type='text'],
#myModal-sendMail .modal-content .modal-body ul li textarea{width:100%; background:rgba(0,0,0,.02); border:1px solid rgba(0,0,0,.07); border-radius:4px; padding: 0 5px; height:36px; transition:.3s;}
#myModal-sendMail .modal-content .modal-body ul li input[type='text']:focus,
#myModal-sendMail .modal-content .modal-body ul li textarea:focus{outline:none; border-color:rgba(0,0,0,.2); background:#fff;}
#myModal-sendMail .modal-content .modal-body ul li textarea{height:100px; resize:none; padding:5px;}
#myModal-sendMail .modal-content .modal-body ul li .sendMail{line-height:34px; padding: 0 15px; text-decoration:none; background:rgba(0,0,0,.7); color:#fff; transition:.3s; display:inline-block; border-radius:4px; font-weight:bold;}
#myModal-sendMail .modal-content .modal-body ul li .sendMail:hover{background:var(--color1)}

.modalSend{position:fixed; top:0; left:0; width:100%; height:100%; padding:20px; z-index:999; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; }
.modalSend.is-open{opacity:1; visibility:initial}
.modalSend .inner{display:inline-block;background:#fff; border-radius:15px; position:relative; padding:20px; }
.modalSend .inner .row01{width:100%; float:left; position:relative; text-align:center;}
.modalSend .inner .row01 .icon{width:60px; height:60px; display:block; margin: 0 auto}
.modalSend .inner .row01 .icon svg{height:100%;}
.modalSend .inner .row01 span{display:block; padding-top:20px;}
.modalSend .inner .row02{ width:300px; float:left; text-align:center; padding:150px 20px 15px 20px;} 
.modalSend .inner .row02 img,
.modalSend .inner .row02 svg{height:100px; margin-left:-50px; display:block; position:absolute; top:40px; left:50%;}
.modalSend .inner .row02 span{display:block; line-height:24px; width:100%; float:left; font-size:16px;}
.modalSend .inner .row02 .nav-close{line-height:43px; display:inline-block; height:42px; padding: 0 50px; color:#fff; background:var(--color1); border-radius:7px; margin-top:25px; text-decoration:none; box-shadow:inset 0 0 rgba(0,0,0,0); transition:.3s; text-transform:uppercase; font-weight:500;}
.modalSend .inner .row02 .nav-close:hover{box-shadow: inset 0 42px rgba(0,0,0,.1); }



ul.form{margin: -15px -10px 0 -10px; padding:0; list-style:none; clear:both;}
ul.form li{padding: 0 10px; position:relative;}
ul.form li .titleForm{display:block; margin:15px 0 5px 0; color:#000;}
ul.form li .titleForm.req:after{content:'*'; color:red; font-weight:bold; padding-left:3px;}
ul.form li .formGroup{width:100%; margin-top:30px; border:1px solid rgba(0,0,0,.1); padding: 20px 25px 25px 25px; position:relative; border-radius:7px;}
ul.form li .formGroup .titleGroup{ background:#fff; position:absolute; top:-12px; left:20px; padding: 0 5px; }
ul.form li .formGroup .titleGroup label{margin:0; padding:0; float:left;font-weight:bold; color:var(--color2); text-transform:uppercase}
ul.form li .formGroup .titleGroup span{padding-left:10px;}
ul.form li input[type='text'],
ul.form li input[type='password'],
ul.form li select,
ul.form li textarea{width:100%; height:42px; padding: 0 8px; border-radius:7px; transition:.3s; border:1px solid rgba(0,0,0,.1);}
ul.form li textarea{height:80px;resize:none; padding-top:7px;}
ul.form li input[type='text']:focus,
ul.form li input[type='password']:focus,
ul.form li select:focus,
ul.form li textarea:focus{outline:none;}
ul.form li.col-btn{padding-top:0px!important;}
ul.form li.col-btn a{line-height:42px; height:42px; display:inline-block; position:relative; border-radius:7px; box-shadow: inset 0 0 0 rgba(0,0,0,.0), 0 2px rgba(0,0,0,.03); padding: 0 20px 0 42px; color:#fff; font-weight:500; text-decoration:none; position:relative; transition:.3s;}
ul.form li.col-btn a i{font-size:16px; position:absolute; top:0; left:15px; line-height:42px;}
ul.form li.col-btn a:hover{box-shadow: inset 0 38px rgba(0,0,0,.1),0 2px rgba(0,0,0,.03)}
ul.form li.col-btn a.green{background:#4CAF50}
ul.form li.col-btn a.red{background:#F44336}
ul.form li.col-btn a.orange{background:#FF9800}
ul.form li.col-btn a.blue{background:#2196F3}

ul.form.inside li{margin-top:20px; position:relative;}
ul.form.inside li.req:before{content:'';border-top:8px solid #ec1f26; border-left:8px solid transparent; position:absolute; top:2px; right:12px;}
ul.form.inside li .formGroup{margin-top:15px; padding-top:30px}

/* Checkbox */
.checkbox {padding-left: 3px; display:inline-block; margin:0;  white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.checkbox label { display: inline-block; vertical-align: middle; position: relative;  padding-left: 5px; padding-right:0; white-space:initial; margin-bottom:0;  }
.checkbox label::before { content: ""; display: inline-block; position: absolute; width: 15px; height: 15px; left: 0; margin:2px 0 0 -16px; border: 1px solid rgba(0,0,0,.2);  border-radius: 3px;  background-color: #fff; -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;  transition: border 0.15s ease-in-out, color 0.15s ease-in-out; }
.checkbox label::after {display: inline-block;position: absolute; line-height:14px; width: 14px; height: 14px; left: 1px;top: 1px; margin-left: -17px; padding-left: 3px; padding-top: 1px;  font-size: 10px;  color: #000; }
.checkbox input[type="checkbox"]{ opacity: 0;  z-index: 1; }
.checkbox input[type="checkbox"]:focus + label::before{ outline: none;}
.checkbox input[type="checkbox"]:checked + label::after{font-family: "Font Awesome 5";content: "\f00c"; font-weight:900;}
.checkbox input[type="checkbox"]:indeterminate + label::after{ display: block; content: ""; width: 10px; height: 3px; background-color: #555555; border-radius: 2px; margin-left: -16.5px; margin-top: 7px;}
.checkbox input[type="checkbox"]:disabled + label{   opacity: 0.65; }
.checkbox input[type="checkbox"]:disabled + label::before { background-color: #eeeeee; cursor: not-allowed; }

/* radio */
.radio{ padding-left: 3px; display:inline-block; margin:0 10px 0 0; }
.radio label { display: inline-block; vertical-align: middle; position: relative; padding-left: 5px; margin-bottom:0; }
.radio label::before { content: ""; display: inline-block; position: absolute; width: 16px; height: 16px; left: 0; margin:1px 0 0 -16px; border: 1px solid rgba(0,0,0,.2); border-radius: 50%; background-color: #fff; -webkit-transition: border 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out; transition: border 0.15s ease-in-out; }
.radio label::after {display: inline-block; position: absolute; content: " "; width: 6px; height: 6px;left: 5px;top: 6px;margin-left: -16px; border-radius: 50%; background-color: #000; -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); -o-transform: scale(0, 0);transform: scale(0, 0); -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); }
.radio input[type="radio"] {opacity: 0; z-index: 1; }
.radio input[type="radio"]:focus + label::before {outline:none;}
.radio input[type="radio"]:checked + label::after {-webkit-transform: scale(1, 1);-ms-transform: scale(1, 1);-o-transform: scale(1, 1); transform: scale(1, 1); }
.radio input[type="radio"]:disabled + label { opacity: 0.65; }
.radio input[type="radio"]:disabled + label::before {cursor: not-allowed; }


.icon-contact{position:fixed; right:10px; bottom:10px; z-index:30; margin:0; padding:0; list-style:none;}
.icon-contact li{width:140px; float:left; position:relative; margin-bottom:10px; clear:both;}
.icon-contact a{width:100%; height:45px; padding-left:45px; position:relative; text-decoration:none; display:block; border-radius:5px; border: 1px solid rgba(0,0,0,.15); box-shadow: 0 0.2rem 0.35rem rgba(0, 0, 0, 0.1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:#fff; transition:.3s;}
.icon-contact a .icon{width:26px; height:26px; margin-top:-13px; position:absolute; top:50%; left:10px; display:flex; align-items:center; justify-content:center}
.icon-contact a .icon svg{height:26px; width:26px;}
.icon-contact a .icon img{max-width:100%; max-height:100%}
.icon-contact a .icon.tel i{font-size:15px; color:var(--color1)}
.icon-contact a .icon.mess{padding:3px;}
.icon-contact a span{display:block; width:100%; display:block; float:left; clear:both; padding-top:7px; font-size:11px; font-weight:bold; color:#000;}
.icon-contact a span:after{content:'(8h00 - 22h:00)'; width:100%; float:left; clear:both; opacity:.7; font-weight:normal; font-size:10px; margin-top:-2px;} 
.icon-contact a .zaloOA img{margin-top:-8px;}
.icon-contact a .zaloOA:after{content:'OA'; font-weight:900; font-size:10px; width:100%; text-align:center; position:absolute; text-align:center; left:0; bottom:-3px; color:var(--color3)}
.icon-contact a:hover{border-color:var(--color2)}
.icon-contact a:hover b{color:var(--color2)}

@media (max-width: 767px) {
    .icon-contact{display:none;}
}


/* Drop Account */
.drop-account{float:left; position:relative;}
.drop-account .nav-drop{padding-left:36px; position:relative; padding-right:15px;}
.drop-account .nav-drop .avatar{width:26px; height:26px; margin-top:-13px; position:absolute; top:50%; left:0; display:flex; border-radius:50%; overflow:hidden;}
.drop-account .nav-drop .avatar img{max-width:inherit!important; max-height:inherit; object-fit:cover;}
.drop-account .nav-drop:after{font-family:"Font Awesome 5"; font-weight:900; content:"\f0d7"; font-size:10px; position:absolute; right:0px;}
.drop-account .dropdown-menu{left:initial!important; right:0; width:220px; display:block; transform:initial!important; margin:0; padding:15px 25px; top:100%!important; max-width:initial!important; list-style:none; border:none; border-radius:15px; transition:.3s; opacity:0; visibility:hidden; pointer-events:none; box-shadow: 0 0 60px 0 rgb(53 57 69 / 15%);}
.drop-account .dropdown-menu li{width:100%; float:left; position:relative;}
.drop-account .dropdown-menu li a{color:#000; font-size:14px; line-height:initial; height:initial; padding: 10px 0px 10px 27px; display:block; float:left; margin:0; white-space:nowrap; transition:.3s; position:relative; }
.drop-account .dropdown-menu li a i{float:left; height:initial; font-size:16px; position:absolute; top:10px; left:0px; transition:.3s; color:var(--color1) }
.drop-account .dropdown-menu li a i:before{font-weight:300; transition:.3s;}
.drop-account .dropdown-menu li a:hover{color:var(--color1)}
.drop-account .dropdown-menu li a:hover i:before{font-weight:900;}
.drop-account .dropdown-menu li:last-child{border-top:1px solid rgba(0,0,0,.07); padding-top:10px; margin-top:10px;}
.drop-account.show .dropdown-menu{margin-top:5px; pointer-events:initial; opacity:1; visibility:initial;}

.scrollToTop{width:45px; height:45px; display:none; padding-top:22px; text-align:center; font-size:16px; color:#fff!important; background:var(--color3); border-radius:5px; box-shadow: 0 0 0 1px rgba(0,0,0,.07); z-index:50; position:fixed; right:10px;bottom:240px; text-decoration:none; transition:.3s; text-align:center; font-size:10px; white-space:nowrap; text-transform:uppercase; font-weight:bold; box-shadow: 0 0.2rem 0.35rem rgba(0, 0, 0, 0.1); }
.scrollToTop:before{font-family: "Font Awesome 5";font-weight: 900; content: "\f077"; font-size:14px; width:100%; text-align:center; position:absolute; top:6px; left:0; line-height:initial}
@media (max-width:767px){
    .scrollToTop{display:none!important;}
}

/*****************************************************************/
/*                            Mobile                            */
/****************************************************************/
.bar-mobile{height:65px; width:100%; position:fixed; background:#fff; left:0; bottom:0; z-index:50;display:flex; transition:.3s; opacity:1; box-shadow: 0 -1px rgba(0,0,0,.02), 0 -5px 15px 5px rgba(0,0,0,.05) }
.bar-mobile>.ele-col{display:flex; flex:1; align-items:center; justify-content:center; position:relative;}
.bar-mobile>.ele-col a.nav-bar{color:#000; text-decoration:none!important; font-size:13px; display:block; text-align:center; padding-top:3px; position:relative;} 
.bar-mobile>.ele-col a.nav-bar span{display:block; width:100%; float:left; padding-top:3px; } 
.bar-mobile>.ele-col a.nav-bar i{font-size:20px;}
.bar-mobile>.ele-col a.nav-cart b{width:16px; height:16px; line-height:16px; background:var(--color2); color:#fff; display:block; position:absolute; top:10px; left:50%; border-radius:50%; font-size:11px; font-weight:600; display:block; text-align:center; margin-left:5px;}
.bar-mobile>.ele-col a.nav-home{height:65px; width:100%; padding-top:35px;}
.bar-mobile>.ele-col a.nav-home img{position:absolute; width:60px; margin-left:-30px; top:-30px; left:50%; border-radius:50%; background:rgba(255,255,255,1); box-shadow:0 0 0 5px #fff, 0 -6px rgba(0,0,0,.05), 0 -10px 25px rgba(0,0,0,.15) }
.is-viewMenuLeft .bar-mobile{bottom:-65px; opacity:0;}

.drop-bar{position:relative;}
.drop-bar .dropdown-menu{display:block; top:initial!important; left:initial!important; bottom:100%!important; right:0!important; transform:initial!important; border:none; border-radius:7px; max-width:200px; box-shadow: 0 0 0 1px rgba(0,0,0,.05), 0 5px 20px rgba(0,0,0,.07); opacity:0; visibility:hidden; transition:.3s; position:absolute; margin-bottom:0px; margin-right:5px; padding:0;}
.drop-bar.show .dropdown-menu{opacity:1; visibility:initial; margin-bottom:10px;}
.drop-bar.show .nav-bar i{color:var(--color2)}
.drop-bar ul.account{width:100%; float:left; position:relative; list-style:none; margin:0; padding:10px 0; list-style:none;}
.drop-bar ul.account li{width:100%; float:left; position:relative;}
.drop-bar ul.account li a{color:#000; text-decoration:none!important; font-size:15px; line-height:35px; padding: 0 20px; }
.drop-bar ul.support{position:relative; margin:0; padding:10px 15px; list-style:none; width:100%; float:left}
.drop-bar ul.support li{width:100%; float:left; position:relative;clear:both; border-top:1px solid rgba(0,0,0,.07)}
.drop-bar ul.support li:first-child{border:none;}
.drop-bar ul.support a{width:100%; height:45px; padding-left:45px; position:relative; text-decoration:none; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:#fff; transition:.3s;}
.drop-bar ul.support a .icon{width:26px; height:26px; margin-top:-13px; position:absolute; top:50%; left:10px; display:flex; align-items:center; justify-content:center}
.drop-bar ul.support a .icon svg{height:26px; width:26px;}
.drop-bar ul.support a .icon img{max-width:100%; max-height:100%}
.drop-bar ul.support a .icon.tel i{font-size:15px; color:var(--color1)}
.drop-bar ul.support a .icon.mess{padding:3px;}
.drop-bar ul.support a span{display:block; width:100%; display:block; float:left; clear:both; padding-top:7px; font-size:11px; font-weight:bold; color:#000;}
.drop-bar ul.support a span:after{content:'(8h00 - 22h:00)'; width:100%; float:left; clear:both; opacity:.7; font-weight:normal; font-size:10px; margin-top:-2px;} 
.drop-bar ul.support a .zaloOA img{margin-top:-8px;}
.drop-bar ul.support a .zaloOA:after{content:'OA'; font-weight:900; font-size:10px; width:100%; text-align:center; position:absolute; text-align:center; left:0; bottom:-3px; color:var(--color3)}
.drop-bar ul.support a:hover{border-color:var(--color2)}
.drop-bar ul.support a:hover b{color:var(--color2)}



.panelLeft-mainMenu{position:fixed; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:200; transition:.3s; opacity:0; visibility:initial; pointer-events:none;}
.panelLeft-mainMenu .inner{max-width:300px; width:100%; background:#fff; position:absolute; top:0; left:0; height:100%; padding-top:55px; transition:.3s; left:-300px;}
.panelLeft-mainMenu .inner .head-panel{position:absolute; top:0; left:0px; line-height:55px; width:100%; padding: 0 30px; box-shadow: 0 1px rgba(0,0,0,.02), 0 5px 10px rgba(0,0,0,.05); z-index:2;}
.panelLeft-mainMenu .inner .head-panel label{margin:0; text-transform:uppercase; font-weight:600; color:#000; color:var(--color2); font-size:17px;}
.panelLeft-mainMenu .inner .head-panel .nav-panleClose{color:#000; text-decoration:none!important; width:32px; height:32px; margin-top:-17px; position:absolute; top:50%; right:15px; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.03); color:var(--color3); border-radius:7px; transition:.3s;}
.panelLeft-mainMenu .inner .head-panel .nav-panleClose:hover{background:var(--color3); color:#fff;}
.panelLeft-mainMenu .inner .body-panel{width: 100%; height:calc(100% - 55px); padding: 10px 0px 10px 0; position:absolute; left:0; bottom:0; overflow:hidden; overflow-y:auto}
.panelLeft-mainMenu .inner .body-panel ul{width:100%; margin:0; padding:0 30px; list-style:none;}
.panelLeft-mainMenu .inner .body-panel ul li{width:100%; position:relative; border-top:1px solid rgba(0,0,0,.07); padding: 5px 0}
.panelLeft-mainMenu .inner .body-panel ul li:first-child{border:none;}
.panelLeft-mainMenu .inner .body-panel ul li a{line-height:45px; padding: 0 0px; text-decoration:none!important; color:#000; font-size:17px; font-weight:600; display:block;}
.panelLeft-mainMenu .inner .body-panel ul li a:after{font-family: "Font Awesome 5";font-weight: 400; content: "\f105"; position:absolute; top:1px; right:0;}
.panelLeft-mainMenu .inner .body-panel ul li ul{padding: 0 0 0 20px;} 
.panelLeft-mainMenu .inner .body-panel ul li ul li{background:none; border:none; margin:0; padding:0;}
.panelLeft-mainMenu .inner .body-panel ul li ul li a{line-height:35px; color:rgba(0,0,0,.75); font-weight:400; font-size:15px; transition:.3s;}
.panelLeft-mainMenu .inner .body-panel ul li ul li a:before{font-family: "Font Awesome 5"; font-size:14px; font-weight: 900; content: "\f0da"; position:absolute; right:100%; margin-right:10px;}
.panelLeft-mainMenu .inner .body-panel ul li ul li a:after{display:none;}
.panelLeft-mainMenu .inner .body-panel ul li ul li a:hover{color:var(--color2); font-weight:600;}
.panelLeft-mainMenu .inner .body-panel ul li.nav-aboutProduct a:after{content: "\f107";}

.is-viewMenuLeft .panelLeft-mainMenu{opacity:1; visibility:initial; pointer-events:initial}
.is-viewMenuLeft .panelLeft-mainMenu .inner{left:0;}