/* Responsive */
@media (max-width: 1024px) {
  .wrap-menu {
    position: relative;
    bottom: unset;
    left: unset;
    transform: none;
    background: var(--color-main);
    padding: 0;
  }

  .thuVienAnh-desktop {
    display: none;
  }

  .thuVienAnh-contain {
    margin: 0;
  }

  .feedback-info {
    padding-left: 10px;
    width: 70%;
  }

  .feedback-pic {
    width: 30%;
  }

  .feedback-pic:after {
    display: none;
  }

  .feedback-pic:before {
    display: none;
  }

  .descThuVienAnh {
    position: relative;
    left: unset;
    bottom: unset;
    max-width: 75%;
    margin: 0 auto 10px;
  }

  .thuVienAnh {
    position: relative !important;
  }

  .thuVienAnh-mobile {
    display: block;
  }

  .title-main--thuvienanh {
    position: relative;
    top: unset;
    left: unset;
    max-width: 100%;
    text-align: center;
  }

  .thuVienAnh-contain:after,
  .dec-thuvienanh--img,
  .thuVienAnh--index:before,
  .thuVienAnh--index:after,
  .thuVienAnh-slogan,
  .thuVienAnh-contain:before {
    display: none;
  }

  .product .pic-product {
    width: 45%;
  }

  .product .info-product {
    width: 55%;
    padding-left: 10px;
  }

  .gioiThieu-left h2 {
    font-size: 43px;
  }

  .tieuChi-left p:nth-child(2) {
    font-size: 60px;
  }

  .tieuChi-left p:first-child {
    font-size: 75px;
  }

  .tieuChi-left span:first-child {
    font-size: 90px;
  }

  .search-menu input {
    border: 1px solid #333;
  }

  .product-tool {
    opacity: 1;
    visibility: visible;
    position: initial;
  }
  .product-tool a span {
    display: none;
  }
  .row-20-cus {
    margin-left: -5px;
    margin-right: -5px;
  }
  .col-20-cus {
    padding-left: 5px;
    padding-right: 5px;
  }
  #hamburger {
    display: block;
  }
  .menu-head {
    display: none;
  }
  .flex-mmenu {
    padding: 8px 0;
  }
  .cart-head {
    padding: 5px;
    font-size: 12px;
  }
  .header {
    display: none;
  }
  .flex-product-main {
    display: block;
  }
  .flex-product-main .left-product {
    position: fixed;
    z-index: 999;
    top: 0px;
    left: 0px;
    transform: translateX(-250px);
    bottom: 0px;
    overflow-x: hidden;
    background: #fff;
    box-shadow: 0px 0px 5px #000;
    transition: all 0.5s;
  }
  .flex-product-main .left-product.show {
    transform: translateX(0px);
  }

  .flex-product-main .right-product {
    width: 100%;
  }

  .grid-product {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
  .filter {
    display: block;
  }
}
@media (max-width: 850px) {
  .news-left {
    width: 100%;
  }
  .news-right {
    width: 100%;
    margin-top: 30px;
    padding: 10px;
  }
}
@media (max-width: 768px) {
  .gioiThieu-left {
    width: 100%;
    margin-bottom: 30px;
  }

  .gioiThieu-right {
    width: 100%;
  }

  .tieuChi-left {
    width: 100%;
    margin-bottom: 30px;
  }

  .tieuChi-right {
    width: 100%;
  }
  .ul-chinh-sach {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
  .flex-powered {
    flex-direction: column;

    text-align: center;
  }
  .gutter-x-20 {
    --bs-gutter-x: 10px;
  }
  .flex-about {
    flex-wrap: wrap;
  }
  .content-about {
    width: 100%;
  }

  .photo-about {
    margin-top: 20px;
    width: 100%;
    text-align: center;
  }
  .flex-video {
    flex-wrap: wrap;
  }
  .wr-video {
    width: 100%;
  }
  .wr-form {
    width: 100%;
    margin-top: 20px;
  }
  .ds-news h3 {
    font-size: 14px;
  }
  .text-cart {
    display: none;
  }
  .grid-pro-detail {
    display: block;
  }
  .grid-pro-detail .left-pro-detail {
    width: 100%;
    padding: 0px;
    border-right: none;
  }
  .slick_photo1 {
    text-align: center;
  }
  .grid-pro-detail .right-pro-detail {
    width: 100%;
  }
  .grid-product,
  .grid-news {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .info-footer .flex-footer {
    display: block;
  }
  .box-footer:first-child {
    margin-top: 0;
  }
  .box-footer {
    width: 100% !important;
    margin-top: 20px;
  }
  .div-fanpage {
    width: 300px;
    overflow: hidden;
    margin: auto;
  }
  .title-detail h1 {
    font-size: 1.4rem;
  }

  .title-main--menuHot {
    margin-bottom: 12px;
  }

  .feedback-contain {
    width: 100%;
    margin-bottom: 30px;
  }

  .video-contain {
    width: 100%;
  }

  .box-footer {
    margin-top: 0 !important;
  }

  .map-footer {
    border-radius: 50px;
  }

  .info-footer {
    background: url(../images/bg_footer_mb.png);
    padding: 50px 0;
  }
}
@media (max-width: 576px) {
  .grid-product,
  .grid-news {
    grid-template-columns: repeat(1, 1fr);
  }

  .grid-photo {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .gioiThieu-left p {
    font-size: 20px;
  }

  .gioiThieu-left h2 {
    font-size: 25px;
    margin-bottom: 8px;
  }

  .gioiThieu-desc span {
    padding: 0;
  }

  .gioiThieu-desc::after {
    display: none;
  }

  .see-detail--gioiThieu {
    margin-top: 8px;
    font-size: 13px;
    line-height: 35px;
  }

  .gioiThieu-desc {
    margin-bottom: 12px;
  }

  .gioiThieu-left {
    margin-bottom: 12px;
  }

  .gioiThieu-right p {
    font-size: 18px;
    margin-top: 8px;
  }

  .tieuChi-index {
    background: url(../images/bg_tieuchi_mb.png);
    padding: 50px 0;
  }

  .tieuChi-left p:first-child {
    font-size: 40px;
    display: inline;
    margin-bottom: 5px;
  }

  .tieuChi-left p:nth-child(2) {
    font-size: 30px;
    display: inline-block;
    margin-left: 8px;
    margin-bottom: 5px;
  }

  .tieuChi-left span:first-child {
    font-size: 50px;
  }

  .tieuChi-left span:last-child {
    max-width: unset;
    font-size: 20px;
  }

  .grid-tieuChi {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .title-main--menuHot h2 {
    font-size: 30px;
    --width: 1px;
    margin-bottom: 5px;
  }

  .title-main--menuHot img {
    display: none;
  }

  .menuHot--index:after {
    display: none;
  }

  .menuHot-contain {
    padding: 0;
  }

  .title-main--feedback {
    font-size: 25px;
    margin-bottom: 8px;
  }

  .feedback-outside {
    margin-top: 0;
  }

  .feedback-info span {
    -webkit-line-clamp: 5;
  }

  .feedback-pic {
    padding: 5px;
    background: #fff;
    margin: 0;
  }

  .title-main--video {
    font-size: 25px;
  }

  .video:after {
    width: 50px;
    height: 50px;
    background-size: cover;
  }

  .video-box {
    padding: 5px;
  }

  .descThuVienAnh {
    max-width: 100%;
  }

  .title-main--thuvienanh {
    font-size: 25px;
    line-height: 45px;
  }

  .title-main h1,
  .title-main h2 {
    font-size: 25px;
  }

  .title-main {
    margin-bottom: 15px;
  }

  .tieuchi-pic {
    width: 65px;
    height: 65px;
    background-size: cover;
  }

  .tieuchi-pic img {
    max-height: 25px;
  }

  .tieuchi-info {
    width: calc(100% - 70px);
  }

  .tieuchi-info h3 {
    font-size: 14px;
    margin-bottom: 4px;
  }

  .tieuchi-info span {
    font-size: 12px;
    -webkit-line-clamp: 2;
    line-height: 20px;
  }

  .info-footer .flex-footer .box-footer:nth-child(1) {
    text-align: center;
  }

  .social-footer {
    justify-content: center;
    margin-bottom: 10px !important;
  }
}
@media (max-width: 440px) {
}
@media (max-width: 369px) {
}