:root{--urlwp-accent:#446084;--urlwp-shell:1450px;--urlwp-header-main:80px;--urlwp-header-nav:39px;--urlwp-header-mobile:72px}body{background:#fff}.urlwp-site{max-width:none;margin-inline:auto;background:#fff}.urlwp-header-main{min-height:var(--urlwp-header-main);display:flex;align-items:center;background:color-mix(in srgb,var(--urlwp-accent) 8%,#fff)}.urlwp-header-row{min-height:var(--urlwp-header-main)}.urlwp-header-bottom{min-height:var(--urlwp-header-nav);display:flex;align-items:center;background:#f1f1f1}.urlwp-header-nav-row{width:min(100% - 32px,var(--urlwp-shell));margin-inline:auto}.urlwp-primary-nav{margin:0}.urlwp-menu{justify-content:center}.urlwp-header-actions{margin-left:auto;display:flex;align-items:center;gap:14px}.urlwp-header-action{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 18px;border:2px solid #fff;border-radius:999px;background:linear-gradient(90deg,color-mix(in srgb,var(--urlwp-accent) 72%,#19c7ff),var(--urlwp-accent));color:#fff;text-decoration:none;font-size:12px;font-weight:800;text-transform:uppercase;box-shadow:0 3px 8px rgba(0,0,0,.2)}.urlwp-menu>li{position:relative}.urlwp-menu .sub-menu{position:absolute;display:none;z-index:20;top:100%;left:0;min-width:220px;margin:0;padding:10px;background:#fff;list-style:none;box-shadow:0 12px 28px rgba(0,0,0,.16)}.urlwp-menu li:hover>.sub-menu,.urlwp-menu li:focus-within>.sub-menu{display:block}@media(max-width:849px){.urlwp-menu .sub-menu{position:static;display:block;box-shadow:none;padding:0 0 0 16px}}:root {--primary-color: #446084;--fs-color-primary: #446084;--fs-color-secondary: #d26e4b;--fs-color-success: #7a9c59;--fs-color-alert: #b20000;--fs-experimental-link-color: #334862;--fs-experimental-link-color-hover: #111;}.tooltipster-base {--tooltip-color: #fff;--tooltip-bg-color: #000;}.off-canvas-right .mfp-content, .off-canvas-left .mfp-content {--drawer-width: 300px;}.container-width, .full-width .ubermenu-nav, .container, .row{max-width: 1450px}.row.row-collapse{max-width: 1420px}.row.row-small{max-width: 1442.5px}.row.row-large{max-width: 1480px}.header-main{height: 80px}#logo img{max-height: 80px}#logo{width:198px;}.header-bottom{min-height: 39px}.header-top{min-height: 53px}.transparent .header-main{height: 90px}.transparent #logo img{max-height: 90px}.has-transparent + .page-title:first-of-type,.has-transparent + #main > .page-title,.has-transparent + #main > div > .page-title,.has-transparent + #main .page-header-wrapper:first-of-type .page-title{padding-top: 140px;}.header.show-on-scroll,.stuck .header-main{height:70px!important}.stuck #logo img{max-height: 70px!important}.header-bg-color {background-color: #0097d3}.header-bottom {background-color: #ffffff}.top-bar-nav > li > a{line-height: 22px }.header-main .nav > li > a{line-height: 16px }.header-bottom-nav > li > a{line-height: 34px }@media (max-width: 549px) {.header-main{height: 88px}#logo img{max-height: 88px}}.header-top{background-color:#ffffff!important;}body{color: #0a0a0a}h1,h2,h3,h4,h5,h6,.heading-font{color: #0a0a0a;}body{font-size: 100%;}@media screen and (max-width: 549px){body{font-size: 100%;}}body{font-family: "Roboto Slab", sans-serif;}body {font-weight: 400;font-style: normal;}.nav > li > a {font-family: "Roboto Slab", sans-serif;}.mobile-sidebar-levels-2 .nav > li > ul > li > a {font-family: "Roboto Slab", sans-serif;}.nav > li > a,.mobile-sidebar-levels-2 .nav > li > ul > li > a {font-weight: 700;font-style: normal;}h1,h2,h3,h4,h5,h6,.heading-font, .off-canvas-center .nav-sidebar.nav-vertical > li > a{font-family: "Roboto Slab", sans-serif;}h1,h2,h3,h4,h5,h6,.heading-font,.banner h1,.banner h2 {font-weight: 700;font-style: normal;}.alt-font{font-family: "Roboto Slab", sans-serif;}.alt-font {font-weight: 400!important;font-style: normal!important;}.header:not(.transparent) .top-bar-nav > li > a {color: #ffffff;}.header:not(.transparent) .top-bar-nav.nav > li > a:hover,.header:not(.transparent) .top-bar-nav.nav > li.active > a,.header:not(.transparent) .top-bar-nav.nav > li.current > a,.header:not(.transparent) .top-bar-nav.nav > li > a.active,.header:not(.transparent) .top-bar-nav.nav > li > a.current{color: #ffffff;}.top-bar-nav.nav-line-bottom > li > a:before,.top-bar-nav.nav-line-grow > li > a:before,.top-bar-nav.nav-line > li > a:before,.top-bar-nav.nav-box > li > a:hover,.top-bar-nav.nav-box > li.active > a,.top-bar-nav.nav-pills > li > a:hover,.top-bar-nav.nav-pills > li.active > a{color:#FFF!important;background-color: #ffffff;}.header:not(.transparent) .header-nav-main.nav > li > a {color: #0a0a0a;}.header:not(.transparent) .header-bottom-nav.nav > li > a{color: #0a0a0a;}.absolute-footer, html{background-color: #ffffff}.nav-vertical-fly-out > li + li {border-top-width: 1px; border-top-style: solid;}/* Custom CSS */.header-button-1::before {content: "";position: absolute;top: -10px;left: -10px;right: -10px;bottom: -10px;border: 2px solid #ff009d;transition: all .5s;animation: clippath 3s infinite linear;border-radius: 7px;}@keyframes clippath {0%, 100% {clip-path: inset(0 0 98% 0);}25% {clip-path: inset(0 98% 0 0);}50% {clip-path: inset(98% 0 0 0);}75% {clip-path: inset(0 0 0 98%);}}.header-button-1::after {content: "";position: absolute;top: -10px;left: -10px;right: -10px;bottom: -10px;border: 2px solid #ffffff;transition: all .5s;animation: clippath 3s infinite -1.5s linear;border-radius: 7px;}.header-button-2::before {content: "";position: absolute;top: -10px;left: -10px;right: -10px;bottom: -10px;border: 2px solid #1ceb00;transition: all .5s;animation: clippath 3s infinite linear;border-radius: 7px;}.header-button-2::after {content: "";position: absolute;top: -10px;left: -10px;right: -10px;bottom: -10px;border: 2px solid #d75c08;transition: all .5s;animation: clippath 3s infinite -1.5s linear;border-radius: 7px;}.alert {background-color: #12a7ff;}.nav>li.html {font-size: .75em;}.label-new.menu-item > a:after{content:"Mới";}.label-hot.menu-item > a:after{content:"Nổi bật";}.label-sale.menu-item > a:after{content:"Giảm giá";}.label-popular.menu-item > a:after{content:"Phổ biến";}

.tieude {
    font-size: 24px;
    line-height: 48px;
    font-weight: bold;
    color: #00c3e3;
    margin-bottom: 0;
    background-color: #4ea0d270;
    border: 4px solid #00c7ff;
    border-radius: 4px;
    padding: 0 16px;
    border-top: 0;
    border-bottom: 0;
    margin-bottom: -20px;
}


.banner2{
  position:fixed;
    bottom:165px;
  right:4%;
  z-index:999;
  width:100px
}

.banner1{
  position:fixed;
 bottom:100px;
  left:4%;
  z-index:999;
  width:100px;
}


.nav>li>a>i.icon-menu {
    font-size: 1.9em;
    color: #fff;
}




.banner-bottom, .banner-top {
        z-index: 2;
         max-width: 1000px;
        width: 90%;
       justify-content: center;
        text-align: center;
        align-items: center;
        line-height: 1;
    }

    .banner-bottom{
        position: fixed;
        bottom: 00px;
     margin-left: 30px
    }
    .banner-apc{
        display: inline-block;
        position: relative;
        max-width: 70%!important;
        width: 250px!important;
        cursor: pointer;
        z-index: auto;
    }

    .banner-apc img{
        max-width: 100%!important;
        width: 300px;
        min-height: 50px;
    }
    .close-apc {
        position: absolute;
        top: 0px;
        z-index: 999;
        right: -10px;
        font-size: 10px;
        line-height:1.8;
        background: #0000;
        padding: 0px 10px;
        display: block;
    }
    .banner-mobile{
        display: none;
    }
    @media screen and (max-width: 550px){


    }
 @media (max-width: 549px) {
                .banner-bottom {
                    flex-direction: column;
                }
            }











/* === BẢN NÂNG CẤP FAQ VỚI HIỆU ỨNG === */

/* 1. Tạo kiểu cho dòng câu hỏi (Accordion Title) */
.accordion-title {
  display: flex;
  align-items: center;
  background-color: #ffffff; /* Đổi nền thành trắng cho sạch sẽ */
  padding: 10px 40px;
  border: 1px solid #e0e0e0;
  border-radius: 8px; /* Bo tròn nhiều hơn một chút */
  margin-top: 12px;
  cursor: pointer;
  font-weight: bold;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* HIỆU ỨNG: Thêm bóng đổ nhẹ */

  /* HIỆU ỨNG MỚI: Chuyển động mượt mà cho mọi thay đổi */
  transition: all 0.3s ease-in-out;
}

/* HIỆU ỨNG MỚI: Hiệu ứng "nâng lên" khi di chuột */
.accordion-title:hover {
  background-color: #f8f9fa;
  transform: translateY(-3px); /* Nhấc nhẹ lên */
  box-shadow: 0 6px 12px rgba(0,0,0,0.08); /* Bóng đổ đậm hơn */
}

/* 2. Tạo kiểu cho phần nội dung trả lời (Accordion Content) */
.accordion-content {
  padding: 25px;
  border: 1px solid #e0e0e0;
  border-top: none;
  border-radius: 0 0 8px 8px;
  background-color: #fff;
  line-height: 1.7;
  /* HIỆU ỨNG MỚI: Ẩn/hiện nội dung mượt hơn (thay vì max-height) */
  /* Lưu ý: Để hiệu ứng này hoạt động tốt nhất, cần có JavaScript hỗ trợ */
}

/*
-------------------------------------------------
   3. HIỆU ỨNG CHO ICON VÀ TRẠNG THÁI MỞ (ACTIVE)
-------------------------------------------------
*/

/* Áp dụng cho icon ở cả trạng thái ĐÓNG và MỞ */
.accordion-title i,
.accordion-title svg {
  color: #28a745;
  margin-right: 12px;
  flex-shrink: 0;

  /* HIỆU ỨNG MỚI: Hiệu ứng xoay icon mượt mà */
  transition: transform 0.3s ease-in-out;
}

/* Định dạng cho câu hỏi khi ĐANG MỞ (active) */
.accordion-title.active {
    background-color: #fff;
    border-bottom-left-radius: 0; /* Làm cho cạnh dưới phẳng để nối với câu trả lời */
    border-bottom-right-radius: 0;
    border-color: #007bff; /* HIỆU ỨNG: Đổi màu viền khi mở */
}

/* HIỆU ỨNG MỚI: Xoay icon 180 độ khi câu hỏi được mở */
.accordion-title.active i,
.accordion-title.active svg {
    transform: rotate(180deg);
}

/* Cải thiện khả năng truy cập: Thêm viền khi focus bằng bàn phím */
.accordion-title:focus-visible {
    outline: 2px solid #007bff;
    outline-offset: 2px;
}



h2 {
    background: linear-gradient(180deg, #00b4ff, #03deff, #01c1ff, #00dafd, #0ba5faad);
    color: #fff !important;
    text-align: center;
    border-radius: 6px;
    padding: 8px;
}
@media(max-width:849px){.urlwp-header-main,.urlwp-header-row{min-height:var(--urlwp-header-mobile)}.urlwp-header-row{position:relative;justify-content:center}.urlwp-menu-toggle{position:absolute;left:0;margin:0}.urlwp-brand{margin-inline:auto}.urlwp-header-actions{display:none}.urlwp-header-bottom{min-height:auto;display:block;position:relative}.urlwp-header-nav-row{width:100%}.urlwp-primary-nav{inset:100% 0 auto}.urlwp-mobile-ctas{border-top:1px solid rgba(0,0,0,.08)}}