:root {
     --main: #E32027;
     --sub: #EC5F23;
}
@font-face {
     font-family: 'Inter';
     src: url('../fonts/Inter_24pt-Regular.woff2') format('woff2'),
          url('../fonts/Inter_24pt-Regular.woff') format('woff');
     font-weight: 400;
     font-style: normal;
 }
 @font-face {
     font-family: 'Inter';
     src: url('../fonts/Inter_24pt-Medium.woff2') format('woff2'),
          url('../fonts/Inter_24pt-Medium.woff') format('woff');
     font-weight: 500;
     font-style: normal;
 }
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter_24pt-SemiBold.woff2') format('woff2'),
         url('../fonts/Inter_24pt-SemiBold.woff') format('woff');
    font-weight:600;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter24pt-Bold.woff2') format('woff2'),
         url('../fonts/Inter24pt-Bold.woff') format('woff');
    font-weight:700;
    font-style: normal;
}
body {font-family: 'Inter', sans-serif;max-width: 1920px;overflow-x: hidden;margin: auto;font-size: 16px;}
html{scroll-behavior: smooth;}
html::-webkit-scrollbar { width:6px; }
html::-webkit-scrollbar-track { background:#f1f1f1; }
html::-webkit-scrollbar-thumb { background:var(--main); border-radius:4px; }
html::-webkit-scrollbar-thumb:hover { background:#555; }
/* Default */
a {color: #000;text-decoration: none;}
.fs-14{font-size: 14px;}
.fs-18{font-size: 18px;}
.fs-20{font-size: 20px;}
.fs-24{font-size: 24px;}
.fs-26{font-size: 26px;}
.fs-32{font-size: 32px;}
.fs-36{font-size: 36px;}
.fs-45{font-size: 45px;}
.fs-55{font-size: 55px;}
.text-line {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.text-2line {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;height: 50px;line-height: 24px;}
.text-3line {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;height: 70px;}
.text-4line {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;text-overflow: ellipsis;height: 90px;}
.text-6line {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6;overflow: hidden;text-overflow: ellipsis;height: 150px;}
.bg-sub {background-color: var(--sub);}
.bg-main {background-color: var(--main);}
.bg-gradient-main {background: linear-gradient(90deg,var(--sub) 0%, var(--main) 100%);}
.bg-gradient-to-top {background: linear-gradient(to top,var(--sub) 0%, var(--main) 100%);}
.bg-gradient-op{background: linear-gradient(to top,rgba(175,7,0,.38),rgba(236,95,35,.38) );}
.bg-gradient-sub{background: linear-gradient(to right, var(--sub),#EFD5CE,var(--sub));}
.bg-gray{background-color: #F9F9F9;}
.bg-FFF9F6{background-color: #FFF9F6;}
.bg-E8E8E8{background-color: #E8E8E8;}
.bg-D84465{background-color: #D84465;}
.text-red{color: #E31515;}
.text-main {color: var(--main);}
.text-sub{color: var(--sub);}
.hv-text-sub:hover {color: var(--sub)!important;}
.hv-text-main:hover {color: var(--main)!important;}
.hv-bg-main:hover{background-color: var(--main);}
.hv-bg-sub:hover{background-color: var(--sub);}
.hv-bg-gradient-main:hover {background: linear-gradient(90deg,var(--sub) 0%, var(--main) 100%);}
.cursor-pointer{cursor: pointer;}
.list-none {list-style: none;}
.text-justify{text-align: justify;}
.bsd{box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.1);}
.container {max-width: min(1560px, calc(100% - 10vw));}
.p-left{padding-left: calc(5vw + (1.5rem * .5))}
.p-right{padding-right: calc(5vw + (1.5rem * .5))}
.border-color-main{border-color: var(--main)!important;}
.border-color-sub{border-color: var(--sub)!important;}
.border-color-CF8553{border-color: #CF8553!important;}
.text-gradient{background: linear-gradient(to top, var(--sub), var(--main));-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;color: transparent;}
/* Header*/
.logo img{transition: all 0.6s ease;}
.menu::before{position: absolute;content: '';width:70px;height: 100%;top: 0;background: url('../images/ic-logo.png')no-repeat;left: 0;background-size: 100% 100%;}
.dropdown-lang{ min-width: 170px; padding: 6px; border: 0; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.15); -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; }
.dropdown-lang .dropdown-item{ display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; transition: .25s; -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; }
.dropdown-lang .dropdown-item:hover{color: var(--main)!important;}
.dropdown-lang img,#currentLang img{width: 28px;height: 28px;border-radius: 50%;object-fit: cover;flex-shrink: 0;}
.dropdown-lang li + li{margin-top: 4px;}
.dropdown-lang .dropdown-item::before{display: none;}
.dropdown-toggle::after{color: #fff;}
.header-top {overflow: hidden;transition: height .3s ease, opacity .3s ease;}
.header.fixed .header-top{height: 0;opacity: 0;}
.logo { transition: width .3s ease, height .3s ease; overflow: visible; transform:translateX(20px) ; -webkit-transform:translateX(20px) ; -moz-transform:translateX(20px) ; -ms-transform:translateX(20px) ; -o-transform:translateX(20px) ; }
.logo canvas {transition: width .3s ease, height .3s ease;}
.header.fixed .logo{ width: 70px!important; height: auto!important; transform:translateX(0) ; -webkit-transform:translateX(0) ; -moz-transform:translateX(0) ; -ms-transform:translateX(0) ; -o-transform:translateX(0) ; }
.header.fixed .logo canvas{width: 70px!important;}
.overlay-search {position: fixed;inset: 0;display: none;z-index: 99999;}
.overlay-search.show {display: block;}
.overlay-search .over {position: absolute;inset: 0;background: rgba(0,0,0,0.7);}
.form-search-menu input,
.form-search-menu input:focus {outline: none !important;box-shadow: none !important;border-color: transparent !important;-webkit-appearance: none;}
.header.fixed .btn-search{display: block!important;}
.header::before{position: absolute;content: '';width: 100%;height: 100%;background: linear-gradient(90deg,rgba(236,95,35,.8) 0%, rgba(227,32,39,.8) 100%);}
.header.fixed::before{background: linear-gradient(90deg,var(--sub) 0%, var(--main) 100%);}
.col-logo{z-index: 999;}
/* Menu */
.menu{ z-index:10; transition: all 0.6s ease; padding-left: 70px; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; }
.fixed{ position: fixed!important; z-index: 9999; top: 0px; left: 0px; right: 0px;}
.menu ul.menu-pc{padding:0px;margin-bottom:0;list-style:none;}
.menu ul.menu-pc li a{ display:block; white-space: nowrap; transition:all .6s ease ; -webkit-transition:all .6s ease ; -moz-transition:all .6s ease ; -ms-transition:all .6s ease ; -o-transition:all .6s ease ; position: relative;}
.menu ul.menu-pc li ul{ position:absolute; min-width:250px; background:linear-gradient(90deg,var(--sub) 0%, var(--main) 100%); border-radius:0.25rem; -webkit-transform:perspective(600px) rotateX(-90deg); transform:perspective(600px) rotateX(-90deg); -webkit-transform-origin:0 0 0; transform-origin:0 0 0; opacity:0; visibility:hidden; transition:all .5s; list-style: none; margin: auto; padding: 0; box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1); -webkit-border-radius:0.25rem; -moz-border-radius:0.25rem; -ms-border-radius:0.25rem; -o-border-radius:0.25rem; }
.menu ul.menu-pc li:hover > ul{ -webkit-transform:perspective(600px) rotateX(0); transform:perspective(600px) rotateX(0); -webkit-transform-origin:0 0 0; opacity:1; visibility:visible; transition:all .7s; -moz-transform:perspective(600px) rotateX(0); -ms-transform:perspective(600px) rotateX(0); -o-transform:perspective(600px) rotateX(0); }
.menu ul.menu-pc li ul li a{border-bottom:1px solid #eee;}
.menu ul.menu-pc li ul li:last-child > a{border-bottom:0;}
.menu ul.menu-pc li ul li a.has-child{margin-right:0px;}
.menu ul.menu-pc li ul li a.has-child:after{-moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);}
.menu ul.menu-pc > li > a.active,.menu ul > li > a:hover{color: #FFC426!important;}
.menu ul.menu-pc li ul li ul{position: absolute;top: 0;left: 100%;}

.menu-pc > li.nav-item > a.nav-link span {
  display: inline-block;
}

/* Đường thẳng — co giãn theo độ dài chữ, dừng lại trước vùng cong 8px cuối (= pe-2) */
.nav-sparkle-bar {
  position: absolute;
  left: 0;
  right: 8px; /* đúng bằng padding-right (pe-2 = 8px) */
  bottom: 0;
  height: 2px;
  background: #FDD203;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
  pointer-events: none;
}

/* Đoạn cong — kích thước CỐ ĐỊNH, luôn neo đúng vùng padding cuối, không bị kéo giãn theo chữ */
.nav-sparkle-curve {
  position: absolute;
  right: -5px;
  bottom: -7.5px;
  width: 16px;
  height: 35px;
  overflow: visible;
  pointer-events: none;
}
.nav-sparkle-curve path {
  fill: none;
  stroke: #FDD203;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 60;
  stroke-dashoffset: 60;
  transition: stroke-dashoffset 0.3s ease;
}
.menu-pc > li.nav-item > a.nav-link:hover .nav-sparkle-curve path {
  stroke-dashoffset: 0;
  transition: stroke-dashoffset 0.4s ease 0.25s; /* chạy sau đoạn thẳng 1 chút cho liền mạch */
}

.menu-pc > li.nav-item > a.nav-link:hover .nav-sparkle-bar {
  transform: scaleX(1);
  transition: transform 0.35s ease;
}

/* Ngôi sao — neo cố định ở đúng đỉnh đoạn cong */
.nav-sparkle-star {
  position: absolute;
  right: -13px;
  bottom: 20px;
  width: 15px;
  height: 19px;
  transform: scale(0.2);
  transform-origin: left bottom;
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}
.menu-pc > li.nav-item > a.nav-link:hover .nav-sparkle-star {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.25s ease 0.5s,
              transform 0.4s cubic-bezier(.34,1.56,.64,1) 0.5s;
}
.owl-app .owl-stage{display: flex;}
/*Menu Mobile*/
.sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}
.navbar-toggle {position: relative;padding: 5px 5px;background-color: transparent;background-image: none;border: 1px solid transparent;border-radius: 4px;}
.navbar-toggle .icon-bar {display: block;width: 20px;height: 3px;border-radius: 1px;background-color: #fff;}
.navbar-toggle .icon-bar+.icon-bar {margin-top: 5px;}
.navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
/*Body*/
.img-filter-black { filter: brightness(0); -webkit-filter: brightness(0); }
.img-filter{filter: brightness(0) invert(1);}
.scrollToTop{width:41px;height:41px;text-align:center;color:#fff;text-decoration:none;position:fixed;bottom:15px;right:15px;display:none;z-index:10;cursor:pointer;background: var(--main);line-height: 41px;border-radius: 10px;}
.svg {position: absolute;width: 0;height: 0;}
.clipped-top {-webkit-clip-path: url(#clip-path-top);clip-path: url(#clip-path-top);}
.list-items{ height: 445px; width: 12.5%; transition:.5s ease ; -webkit-transition:.5s ease ; -moz-transition:.5s ease ; -ms-transition:.5s ease ; -o-transition:.5s ease ; }
.list-items.active{width: 50%;}
.content-list{ left: 0; top: 0; width: 100%; height: 100%; justify-content: end; padding: .5rem; transition:all .5s ease ; -webkit-transition:all .5s ease ; -moz-transition:all .5s ease ; -ms-transition:all .5s ease ; -o-transition:all .5s ease ; }
.content-list::before{ content: ""; position: absolute; inset: 0; background:url('../images/bg-list.png')no-repeat; transform: translateY(100%);z-index:0; background-size: 100% 100%; width: 100%; height: 100%;transition:transform .55s cubic-bezier(.22,.61,.36,1);}
.list-items .name{ transform:rotate(-90deg) ; -webkit-transform:rotate(-90deg) ; -moz-transform:rotate(-90deg) ; -ms-transform:rotate(-90deg) ; -o-transform:rotate(-90deg) ;transform-origin: 0 0;white-space:nowrap;color: #fff;margin-bottom: -2.5rem;transition:
transform .45s ease,color .35s ease,margin .45s ease; transition-delay:0s;}
.list-items .content-ckeditor{ opacity: 0; max-height: 0; transition:opacity .45s ease,max-height .45s ease; -webkit-transition:opacity .45s ease,max-height .45s ease; -moz-transition:opacity .45s ease,max-height .45s ease; -ms-transition:opacity .45s ease,max-height .45s ease; -o-transition:opacity .45s ease,max-height .45s ease; transition-delay:0s; }
.list-items.active .content-list{justify-content:center;padding: 1rem;}
.list-items.active .name{ transform:rotate(0) ; -webkit-transform:rotate(0) ; -moz-transform:rotate(0) ; -ms-transform:rotate(0) ; -o-transform:rotate(0) ;margin-bottom: 1rem;color: #000;transition-delay:.20s;}
.list-items.active .content-ckeditor{opacity: 1;max-height: 300px;transition-delay:.7s;}
.list-items.active .content-list::before{transform: translateY(0);transition-delay:.15s; }
.line-why{display: block;width: 60px;height: 1px;background-color: #C9A84C;}
.why-items .images{max-width: 62px;width: 100%;}
.why-items:hover{background-color: rgba(236,95,35,.11);}
.owl-new .owl-item{padding: .1rem;padding-bottom: .3rem;}
.news-items-home{box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .4);}
.owl-partner .owl-item{padding: .1rem;}
#newsletter-form{background-color: rgba(255,255,255,.1);backdrop-filter: blur(16px);-webkit-backdrop-filter: blur(16px);border: 2px solid rgba(255, 255, 255, 0.2);}
#newsletter-form input,#newsletter-form input::placeholder{color: #fff;}
.news-item,.data-items,.nav-items,.application-items{padding: .1rem;}
.vision-items-1::before{position: absolute;content: '';width: 85px;height: 100%;background-color: var(--sub);top: 0;right: -42.5px; clip-path: polygon(98% 0, 100% 0%, 2% 100%, 0% 100%);}
.vision-items-1::after{ position: absolute; content: ''; width: 73px; height: 250px; background: url('../images/ic-vec.png')no-repeat; top: 50%; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ;right: -37px; }
.swiper-certica .swiper-wrapper{align-items: center;}
.swiper-certica .swiper-slide{ transition:.6s ease ; -webkit-transition:.6s ease ; -moz-transition:.6s ease ; -ms-transition:.6s ease ; -o-transition:.6s ease ;opacity: 0;}
.swiper-certica .swiper-slide.swiper-slide-prev,.swiper-certica .swiper-slide.swiper-slide-next{width: calc(20% - 16px) !important;opacity: 1;}
.swiper-certica .swiper-slide.prev-2,.swiper-certica .swiper-slide.next-2{ width: calc(15% - 16px)!important;opacity: 1;}
.swiper-certica .swiper-slide.swiper-slide-active{width: calc(30% - 16px) !important;opacity: 1;}
.swiper-certica .swiper-slide {transform-origin: center center;}
.swiper-certica-prev,.swiper-certica-next{ width: 48px; height: 48px; background-color: #fff; border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ; display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ;box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.1); z-index: 9;}
.swiper-certica-prev{left: -24px;}
.swiper-certica-next{ right: -24px;}
.swiper-certica-next img{ transform:rotate(180deg) ; -webkit-transform:rotate(180deg) ; -moz-transform:rotate(180deg) ; -ms-transform:rotate(180deg) ; -o-transform:rotate(180deg) ; }
.clipped-list{-webkit-clip-path: url(#clip-path-list);clip-path: url(#clip-path-list);}
.images-product{width: 100%;max-width: 270px;}
.images-product .image{background-color: #EFEFEF;}
.images-product::after{ position: absolute; content: ''; width: 100%; height: 100%; background-color: var(--main); border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ;top: 0;right: -3px; }
.sub-product{ width:100%; height:100%; aspect-ratio:1; background:conic-gradient(rgba(32,41,134,.45) 0 120deg,rgba(25,87,29,.45) 120deg 240deg,rgba(227,32,39,.45) 240deg 360deg); top: 0; --r:68px; opacity: 0; transition:.5s ease ; -webkit-transition:.5s ease ; -moz-transition:.5s ease ; -ms-transition:.5s ease ; -o-transition:.5s ease ;position: relative; }
.sub-product .item{ position: absolute; width: 56px; height: 56px; left: 50%; top: 50%; margin-left: -28px; margin-top: -28px; transform: rotate(var(--angle)) translateY(calc(var(--r) * -1)) rotate(calc(var(--angle) * -1)); display: flex; justify-content: center; align-items: center; -webkit-transform: rotate(var(--angle)) translateY(calc(var(--r) * -1)) rotate(calc(var(--angle) * -1)); -moz-transform: rotate(var(--angle)) translateY(calc(var(--r) * -1)) rotate(calc(var(--angle) * -1)); -ms-transform: rotate(var(--angle)) translateY(calc(var(--r) * -1)) rotate(calc(var(--angle) * -1)); -o-transform: rotate(var(--angle)) translateY(calc(var(--r) * -1)) rotate(calc(var(--angle) * -1)); }
.sub-product .item.item-center{ transform: none; z-index: 2; background-color: rgba(255, 255, 255, .78); border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ;-webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none;width: 76px;height: 76px;margin-left: -38px;margin-top: -38px; }
.items-list:hover .ratio::after{position: absolute;content: '';width: 100%;height: 100%;background-color: rgba(255, 255, 255, .5);top: 0;left: 0;}
.items-list:hover .sub-product{opacity: 1;}
.click-app.active{background: linear-gradient(to right, var(--sub),var(--main));color: #fff;}
.sub-product .slice-glow{position: absolute;inset: 0;opacity: 0;pointer-events: none;transition: opacity .3s ease;background: conic-gradient(transparent 0deg var(--start),var(--color) var(--start) var(--end),transparent var(--end) 360deg);}
.sub-product .slice-glow:has(+ .item.active){opacity: 1;}
.sub-product .slice-glow-center{position: absolute;inset: auto;left: 50%;top: 50%;width: 55px;height: 55px;margin-left: -27.5px;margin-top: -27.5px;border-radius: 50%;background: linear-gradient(to right, var(--sub),var(--main));}
.sub-product .item.item-center{z-index: 2;}
.sub-product .item.item-center.active {background: transparent;}
.sub-product .item.item-center.active img{filter: brightness(0) invert(1);}
.sub-product .slice-divider{ position: absolute; left: 50%; top: 0; width: 1px; height: 50%; margin-left: -1px; background: #fff; transform-origin: bottom center; transform: rotate(var(--deg)); z-index: 1; pointer-events: none; -webkit-transform: rotate(var(--deg)); -moz-transform: rotate(var(--deg)); -ms-transform: rotate(var(--deg)); -o-transform: rotate(var(--deg));}
/*Product*/
.thumb-pro-detail{display:block!important;border:1px solid #eee;padding:5px;border-radius:3px;cursor:pointer;background-color:#ffffff;}
.thumb-pro-detail.mz-thumb.mz-thumb-selected{border-color:#cecfd2;}
.thumb-pro-detail img{ box-shadow:none!important; filter:brightness(100%)!important; border-bottom:0px!important; padding-bottom:0px!important; -webkit-filter:brightness(100%)!important; }
/*Footer*/
footer{background-color: #E7A172;}
.map_footer iframe{ width: 100%; display: block; }
.swal2-container{z-index: 9999;}
.fancybox-thumbs {top: auto !important;bottom: 0 !important;left: 0 !important;right: 0 !important;width: 100% !important;height: 95px !important;padding: 10px 10px 5px 10px;box-sizing: border-box;background-color: inherit;}
.fancybox-thumbs__list {display: flex !important;flex-direction: row !important;overflow-x: auto;overflow-y: hidden;margin: auto;}
.fancybox-show-thumbs .fancybox-inner { right: 0 !important; bottom: 95px !important;}
/*Ckeditor*/
.content-ckeditor{overflow-wrap: break-word;word-break: break-word;}
.content-ckeditor * {max-width: 100%;box-sizing: border-box;}
.content-ckeditor img{max-width: 100%;height: auto!important;}
.content-ckeditor table{max-width: 100%;border-collapse: collapse;overflow-x: auto;}
.content-ckeditor table td,
.content-ckeditor table th {word-wrap: break-word;}
.content-ckeditor iframe, .content-ckeditor video {max-width: 100% !important;}
.content-ckeditor p:last-child{margin-bottom: 0;}
/*Breadcrumb*/
.banner {height: 381px;}
.banner h2{line-height: 55px;}
.breadcrumb{margin-bottom: 0;}
.breadcrumb li a{text-transform: capitalize;}
.breadcrumb-item{position: relative;}
.breadcrumb-item.active a{font-weight: 700;}
.breadcrumb-item + .breadcrumb-item::before {
    content: "\f105";
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    position: absolute;
    left: 7px;
    top: 50%;
    transform: translateY(-50%);
    padding-right: 0;
    float: none;
    width: auto;
    height: auto;
}
.breadcrumb-item+.breadcrumb-item{padding-left: 1.5rem;}
.btn-thanhtoan.active{background-color: var(--main);color: white;}
.container-maintenance{position: relative;overflow-x: auto;}
/*swiper*/
.swiper-wrapper{height: auto!important;}
.swiper-button-next, .swiper-button-prev {background-color: #fff;border-radius: 50%;color: #878787;width:58px;height: 58px;}
.swiper-button-next:after, .swiper-button-prev:after{font-size: 30px;}
.item-slide img {transition: transform 8s ease;transform: scale(1.1);}
.swiper-slide-active .item-slide img {transform: scale(1);}
.Swiper_spct2 .swiper-button-next, .Swiper_spct2 .swiper-button-prev{width: 30px;height: 30px;}
.Swiper_spct2 .swiper-button-next:after, .Swiper_spct2 .swiper-button-prev:after{font-size: 14px;}
.content-slider .name,
.content-slider .content-ckeditor,
.content-slider .button-slider{opacity: 0;transform: translateY(50px);transition: all .6s ease;}
.content-slider .content-ckeditor{transition-delay: .3s;}
.content-slider .button-slider{transition-delay: .6s;}
.swiper-slide-active .content-slider .name,
.swiper-slide-active .content-slider .content-ckeditor,
.swiper-slide-active .content-slider .button-slider{opacity: 1;transform: translateY(0);}
.swiper-slider .swiper-pagination-bullet{height: 15px;width: 15px;background-color: rgba(255,255,255,.57);}
.swiper-slider .swiper-pagination-bullet.swiper-pagination-bullet-active{ background-color: #fff; width: 40px; border-radius:1rem ; -webkit-border-radius:1rem ; -moz-border-radius:1rem ; -ms-border-radius:1rem ; -o-border-radius:1rem ; }
/*owl*/
.owl-prev,.owl-next{position: absolute;top: 50%;left: 0;transform: translate(0,-50%);}
.owl-next{left: inherit;right: 0;}
.owl-dots {display: flex;justify-content: center;align-items: center;margin-top: 20px;}
.owl-dots button span {display: block;width: 12px;height: 12px;border-radius: 50%;background-color: rgba(236, 95, 35, .57);margin: 0 3px;}
.owl-dots button.active span { background-color: var(--sub); width: 35px; border-radius:1rem ; -webkit-border-radius:1rem ; -moz-border-radius:1rem ; -ms-border-radius:1rem ; -o-border-radius:1rem ; }
/*error*/
#newsletter-form label.error{display: none!important;}
label.error {display: block;color: #ff4d4f;font-size: 0.875rem;margin-top: 0.25rem;position: relative;padding-left: 15px;}
label.error::before {content: "\f071";position: absolute;left: 0; font-family: "Font Awesome 6 Pro";}
.grecaptcha-badge{display: none;}
/*Paging*/
.pagination-page ul{flex-wrap: wrap;gap: .5rem;}
.pagination-page ul li{ width: 35px; height: 35px; border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ;background:linear-gradient(to right,var(--sub),#EFD5CE,var(--sub));padding: .1rem; }
.page-link{ color: var(--sub); width: 100%; font-size: 17px; height: 100%; border-radius: .3rem; background-color: #fff; font-weight: 600; text-align: center; border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ;margin: 0!important; }
.active>.page-link, .page-link.active,.page-link:hover{background-color: var(--main);border-color: var(--main);color: #fff;}
.page-item:first-child .page-link{border-top-left-radius: 50%;border-bottom-left-radius: 50%;}
.page-item:last-child .page-link{border-top-right-radius: 50%;border-bottom-right-radius: 50%;}
/*Comment*/
a.star {font-size: 24px;color: #d1d1d4;cursor: pointer;line-height: 1;transition: all 0.1s ease;}
a.star.vote-hover {color: #ffc120;}
a.star.vote-active {color: #ffc120;}
.rating-medium{text-align: center;padding-top: 0;}
.title-medium-score{font-size: 14px;}
.score-rating{font-size: 54px;font-weight: 500;color: #fe302e;line-height: 60px;}
.quantity-star i{color: #B3BCC5;}
.quantity-star i.active{color: #ffc120;}
.quantity-star i:last-child{margin-right: 0!important;}
.item-progress{margin-bottom: 10px;}
.item-progress .rating-num{float: left;font-size: 15px;width: 45px;text-align: right;padding-right: 5px;color: #6f6969;}
.item-progress .box-progress{float: left;width: calc(100% - 90px);vertical-align: middle;margin-top: 5px;}
.item-progress .box-progress .progress{height: 10px;margin-bottom: 0px;box-shadow: none;background-color: #e6e6e6;}
.item-progress .box-progress .progress-bar{background-color: var(--main);}
.item-progress .rating-num-total{width: 45px;text-align: left;display: inline-block;float: left;padding-left: 10px;color: #565656;font-size: 15px;}
.content-nhanxet{display: none;}
.content-nhanxet .h3{margin-top: 10px;font-size: 18px;font-weight: 700;margin-bottom: 20px;}
.item-binhluan .img_user{display: block;width: 80px;height: 80px;margin: 0px auto;border-radius: 50%;overflow: hidden;}
.item-binhluan .img_user img{width: 100%;height: 100%;}
.item-binhluan .name-user{text-align: center;font-weight: 600;margin-top: 10px;color: #626262;margin-bottom: 5px;}
.item-binhluan .ngaydang{display: block;text-align: center;color: #a2a1a1;font-size: 12px;}
.chitiet-bl .titlede-bl{font-weight: 600;color: #00a85a;}
.chitiet-bl p{color: #6f6c6c;}
.panel-traloi{margin-top: 10px;}
.list-traloi{margin-top: 10px;border-top: 1px dashed #e8e5e5;padding-top: 10px;}
.list-traloi span{display: inline-block;margin-left: 14px;font-size: 13px;color: #757575;}
.list-traloi p{color: #6f6c6c;margin-top: 7px;}
.item-traloi{border-bottom: 1px dotted #e2e2e2;margin-bottom: 10px;}
/*widget mobile*/
.toolbar ul li > svg,.toolbar ul li a > svg{width:35px;height:35px;fill:white;margin:0 auto;}
.list-phone{position:absolute;width:50px;height:50px;display:flex;align-items:center;justify-content:center;padding-left:0px;background:var(--main);z-index:2;border-radius:50%;left:30px;bottom:35px;}
.toolbar{width:100%;bottom:-1px;position:fixed;z-index:500;height:auto;left:0px}
.toolbar ul{padding:3vw;list-style:none;display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;align-items:center;justify-content:space-between;margin:0px;--size:33px;-webkit-mask:radial-gradient(var(--size) at 55px 0px,#0000 99%,#fff 101%) 100%;background:var(--main)}
.toolbar ul li{text-align:center}
.toolbar ul li a{display:block;width:100%;cursor:pointer;}
.toolbar ul li a img{height:6vw;width:auto}
.toolbar ul li a span{font-weight:400;color:#ffffff;font-size:3.5vw;display:none}
.toolbar ul li:nth-child(3) a svg{ border:2px solid #fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; }
.list-phone a svg{width:28px;height:28px;fill:white}
/*widget*/
.widget-desktop-list {display: flex;flex-direction: column;}
.widget-desktop-list {display: none;}
.widget-desktop.active .widget-desktop-list {display: flex;}
.widget-desktop {position: fixed; right: 10px; bottom: 120px; z-index: 9999; }
.widget-desktop-items { margin-bottom: 20px; border-radius: 50%; position: relative; text-decoration: none;}
.widget-desktop-items:last-child { margin-bottom: 0; }
.widget-desktop-items:before,.widget-desktop-items:after { position: absolute; content: ""; width: 100%; height: 100%;border-radius: 50%; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation: scaleIn1 1s; animation: scaleIn1 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;background: rgba(227, 32, 39, .5); }
.widget-desktop-items:after { -webkit-animation: scaleIn 1.2s; animation: scaleIn 1.2s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(227, 32, 39, .5)), to(rgba(227, 32, 39, .5))); background: linear-gradient(90deg, rgba(227, 32, 39, .5) 0, rgba(227, 32, 39, .5) 100%) }
.widget-desktop-items__icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 40px; height: 40px; background: var(--main); border-radius: 50%; position: relative; z-index: 999; padding: 8px;}
.widget-items-zalo .widget-desktop-items__icon{padding: 2px;}
.widget-desktop-toggle .widget-desktop-items__icon{padding: 0;}
.widget-cart{color: #fff;font-size: 20px;}
.widget-desktop-items__call .widget-desktop-items__content { position: absolute; right: 0; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); padding: 5px 60px 5px 20px; background: -webkit-gradient(linear, left top, right top, color-stop(0, #ED5228), to(#ED5228)); background: linear-gradient(90deg, #ED5228 0, #ED5228 100%); border-radius: 20px; color: #fff; white-space: nowrap;z-index: -1; }
.widget-desktop-items img,.widget-cart i,.widget-desktop-toggle i{animation: vibrate 1s ease-in-out infinite;}
@-webkit-keyframes scaleIn { from { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); }
  60% { -webkit-transform: translate(-50%, -50%) scale(1.2); transform: translate(-50%, -50%) scale(1.2); } }

@keyframes scaleIn { from { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); }
  60% { -webkit-transform: translate(-50%, -50%) scale(1.2); transform: translate(-50%, -50%) scale(1.2); } }
@-webkit-keyframes scaleIn1 { from { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); }
  60% { -webkit-transform: translate(-50%, -50%) scale(1.4); transform: translate(-50%, -50%) scale(1.4); } }
@keyframes scaleIn1 { from { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); }
  60% { -webkit-transform: translate(-50%, -50%) scale(1.4); transform: translate(-50%, -50%) scale(1.4); } }
@keyframes rotate {
     from { transform: translate(-50%,-50%) rotate(0deg); }
     to { transform: translate(-50%,-50%) rotate(360deg); }
}
@keyframes vibrate {
     0% {-webkit-transform: rotate(0) scale(1) skew(1deg);  }
     10% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
     20% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
     30% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
     40% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
     50% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
     100% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
}
/*Loading*/
.loading-overlay {position: fixed;top: 0; left: 0;width: 100%; height: 100%;background: rgba(0,0,0,0.7); z-index: 9999;justify-content: center;align-items: center;}
.loading-content {display: flex;flex-direction: column;align-items: center;gap: 20px;height: 100%;justify-content: center;}
.loading-content img{max-width: 100px;}
.dots-loading {display: flex;gap: 8px;}
.dots-loading span {width: 12px;height: 12px;background: var(--main);border-radius: 50%;display: inline-block;animation: bounce 1.2s infinite;}
.dots-loading span:nth-child(2) {animation-delay: 0.2s;}
.dots-loading span:nth-child(3) {animation-delay: 0.4s;}
.dots-loading span:nth-child(4) {animation-delay: 0.6s;}
.dots-loading span:nth-child(5) {animation-delay: 0.8s;}
@keyframes bounce {
    0%, 80%, 100% { transform: scale(0); }
    40% { transform: scale(1); }
}