@media (max-width: 1440px) {

   /*-------- Contact Page ------ */

   /*-------- Knowlegde Page ------*/

   /*-------- Post Detail ---------*/

   /*-------- Service Detail ---------*/

}

@media (max-width: 1400px) {

   /* danh sach san pham */
   .product-detail img {
      height: 160px;
   }


}


@media (max-width: 1367px) {
   /* .header-hotline span{
        display: none;
    } */

   .header-hotline>a:first-child {
      display: none;
   }

   .product-detail img {
      height: 230px;
   }

   .benefit-body {
      margin-top: 28px;
   }

   .benefits .benefit-detail {
      padding: 8px;
   }

}


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


@media (max-width: 1200px) {
   .header .nav #header-menu>li {
      margin: 0 8px;
   }

   .process .item-process .process-detail:last-child img {
      width: 114px;
   }

   .reviews .heading h2 {
      margin-top: 50px;
   }

   .reviews .reviews-wraper .review-text {
      padding: 20px;
      height: 212px;
   }

   .process .item-process .process-detail p {
      font-size: 13px;
   }

   .process .item-process i {
      margin-left: 10px;
      margin-bottom: 12px;
      margin-right: 10px;
   }

   /* danh sach san pham */
   .list-categories .heading::before,
   .list-categories .heading::after {
      display: none;
   }

   .list-categories .heading h3 {
      margin-bottom: 20px;
   }

   /* chi tiet san pham */
   .product-infomation .product-info .main-img .slick-slide {
      height: 400px;
   }

   .list-product-related .slick-slide {
      margin: 0px 20px;
   }

   /* danh sach tin tuc */
   .news .news-detail img {
      height: 200px;
   }
}


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


@media (max-width: 992px) {
   .header .header-hotline {
      display: none;
   }

   .header .nav {
      display: none;
   }

   .menu-mobile {
      display: none;
   }

   .header .mobile-btn {
      display: block;
      font-size: 24px;
      border-radius: 50%;
      background-color: var(--secondary-color);
      width: 48px;
      height: 48px;
      text-align: center;
      line-height: 48px;
      transition: all .4s linear;
      /* position: relative;
        z-index: 200; */
      -webkit-box-shadow: 0 1rem 3rem rgba(var(--color-black-a), 0.1);
      box-shadow: 0 1rem 3rem rgba(var(--color-black-a), 0.1);
   }

   .header .menu-mobile .close-btn {
      position: absolute;
      top: 70px;
      right: 70px;
      font-size: 30px;
      color: var(--secondary-color);
      background: #fff;
      border-radius: 50%;
      width: 48px;
      height: 48px;
      text-align: center;
      line-height: 47px;
      transition: opacity .35s;
      visibility: hidden;
      transition: visibility .8s cubic-bezier(0.86, 0, 0.07, 1);
   }

   /* .close-toggle {
        visibility: visible;
    } */

   .header .menu-mobile .close-btn:hover {
      opacity: .5;
   }

   .header .mobile-btn:hover {
      background-color: #fff;
   }

   .header .mobile-btn i {
      transition: all .4s linear;
      color: #fff;
   }

   .header .mobile-btn:hover i {
      color: var(--secondary-color);

   }

   .mobile-menu-bg {
      position: fixed;
      top: 117px;
      right: 117px;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background-color: var(--secondary-color);
      z-index: 100;
      -webkit-transition: -webkit-transform .8s cubic-bezier(0.86, 0, 0.07, 1);
      transition: -webkit-transform 0.8s cubic-bezier(0.86, 0, 0.07, 1);
      transition: transform 8s cubic-bezier(0.86, 0, 0.07, 1);
      transition: transform 8s cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 0.8s cubic-bezier(0.86, 0, 0.07, 1), opacity 0.8s cubic-bezier(0.86, 0, 0.07, 1);
      opacity: 0;
   }

   .toggle {
      transform: scale(60);
      opacity: 1;
   }

   /* .btn-toggle {
        position: fixed !important;
        top: 112.5px;
        right: 138.1px;
    } */

   .menu-toggle {
      width: 100% !important;
      opacity: 1 !important;
   }

   .header .menu-mobile {
      position: fixed;
      top: 0;
      right: -30px;
      height: 100vh;
      z-index: 150;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 0;
      opacity: 0;
      -webkit-transition: opacity 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), width 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55);
      transition: opacity 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), width 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55);
   }

   .menu-mobile ul#header-menu {
      list-style: none;
      color: white;
      font-size: 20px;
      width: 369px;
   }

   #header-menu>li.menu-item {
      padding-bottom: 10px;
      border-bottom: 1px solid #ebebeb;
      margin-bottom: 10px;
   }

   .menu-item>.sub-menu>li:first-child {
      margin-top: 10px;
   }

   .menu-item>.sub-menu>li+li {
      margin-top: 10px;
      border-top: 1px solid #ebebeb;
      padding-top: 10px;
   }

   .menu-mobile ul.sub-menu {
      display: block;
      list-style: none;
      margin-left: 24px;
   }


   .process .list-process {
      flex-direction: column;
   }

   .process .item-process {
      flex-direction: column;
   }

   .process .item-process .arrow-right {
      display: none;
   }

   .process .item-process .arrow-down {
      display: block;
   }

   .reviews .heading h2 {
      margin-top: 330px;
   }

   .posts .main-post .post-thumb {
      width: 100%;
      height: auto;
   }

   .posts .main-post .post-thumb img {
      width: 100%;
      height: auto;
   }

   .posts .main-post .post-wrap {
      margin-bottom: 24px;
   }

   .footer-top .about-us,
   .footer-top .footer-category,
   .footer-top .footer-links {
      margin-bottom: 20px;
   }

   /* danh sach san pham */
   .list-categories,
   .sidebar {
      margin-top: 40px;
   }

   .list-categories .heading::before,
   .list-categories .heading::after {
      display: block;
   }

   /* chi tiet san pham */
   .product-infomation .product-info .main-img .slick-slide {
      height: 500px;
   }

   /* contact */
   .contact-brand {
      margin-top: 50px;
   }
}


@media (max-width: 768px) {
   .benefit-body {
      margin-top: 80px;
   }

   .reviews .heading h2 {
      margin-top: 380px;
   }

   .posts .list-post .post-item img {
      height: 154px;
   }

   /* danh sach bai viet */
   .news .post-title::after {
      display: none;
   }

   .header .header-bottom .breadcrum {
      align-items: flex-start;
   }

   .header .header-bottom .breadcrum p>a {
      width: 96px;
      display: inline-block;
   }
}


@media (max-width: 576px) {
   #main {
      overflow: hidden;
   }

   .categories .category-detail .category-img img,
   .product-detail img {
      height: 320px;
   }

   .process .item-process .process-detail p {
      font-size: 18px;
   }

   .reviews .heading h2 {
      margin-top: 976px;
   }

   .about .about-content {
      margin: 0 auto;
      margin-bottom: 40px;
   }

   .header .menu-mobile {
      justify-content: flex-start;
   }

   .header .menu-mobile .close-btn {
      top: 50px;
      right: 50px;
   }

   /* danh sach san pham */
   .products {
      overflow: hidden;
   }

   /* chi tiet san pham */
   .product-infomation {
      overflow: hidden;
   }

   /* chi tiet bai viet */
   .header .header-bottom .breadcrum {
      align-items: flex-start;
   }

   .header .header-bottom .breadcrum p>a {
      width: 96px;
      display: inline-block;
   }

   .post-detail .post-detail-content {
      padding: 40px 16px 30px;
   }

   /* gioi thieu */
   .about-us-content {
      padding: 16px;
   }

}

@media (max-width: 480px) {
   #main {
      padding: 0 12px;
   }

   .menu-mobile ul#header-menu {
      list-style: none;
      color: white;
      font-size: 18px;
      width: 325px;
   }

   .footer .footer-top {
      padding-left: 12px;
      padding-right: 12px;
   }

   .benefit-body {
      margin-top: 124px;
   }

   .benefits .benefits-body {

      margin: 0 -12px 0 -12px;
   }

   .benefit-body {
      margin-top: 124px;
      margin-left: -12px;
      margin-right: -12px;
   }

   .heading h2 {
      font-size: 20px;
   }

   .btn-outline-custom {
      margin-bottom: 10px;
   }

   .categories .heading h2 span::after {
      right: -35px;
      border: 18px solid var(--secondary-color);
      border-top-color: transparent;
      border-right-color: transparent;
   }

   .new-product .heading h2 span::after {
      border: 18px solid var(--secondary-color);
      border-top-color: transparent;
      border-left-color: transparent;
      left: -35px;
   }

   .heading h2 span::after {
      content: "";
      position: absolute;
      top: 0;
      right: -35px;
      height: 0;
      width: 0;
      border: 18px solid var(--secondary-color);
      border-top-color: transparent;
      border-right-color: transparent;
   }

   .about .heading h2 span::after {
      left: -35px;
      border-top-color: transparent;
      border-left-color: transparent;
      border-right-color: var(--secondary-color);
   }

   .reviews .heading h2 {
      margin-top: 1020px;
   }

   .posts .main-post .post-title {
      font-size: 18px;
      height: 30%;
   }

   .posts .list-post .post-item .post-title {
      font-size: 15px;
      height: 64%;
   }


   .heading h2 span::after {
      top: -0.4px;
   }

}

@media (max-width: 425px) {
   .about .about-content {
      padding: 12px;
   }

   .reviews .heading h2 {
      margin-top: 1110px;
   }

   .header .menu-mobile .close-btn {
      top: 15px;
      right: 42px;
   }

   .contact-us .item-info span {
      width: 200px;
   }
}

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

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