/* sản phẩm list */

.box-main-product-list {
  position: relative;
}

.title-main-product-list {
  margin-bottom: 20px;

  border-bottom: 1px solid #d9d9d9;
}

.title-main-product-list h3 {
  color: #333333;

  font-size: 24px;

  font-family: "Gilroy-Bold";

  text-transform: uppercase;

  background: url(../images/icon-grid.png) no-repeat left;

  padding-left: 20px;

  width: fit-content;

  margin-bottom: 18px;

  position: relative;
}

.title-main-product-list h3::before {
  position: absolute;

  content: "";

  width: 100%;

  height: 3px;

  bottom: -20px;

  left: 0px;

  right: 0px;

  background: #f7921d;
}

.product-list-item {
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 5px 0px;

  margin: 15px 0px;

  padding: 24px;

  border-radius: 5px;
}

.product-item-img {
  margin-bottom: 20px;
}

.product-item-img .scale-img {
  margin: auto;

  width: fit-content;
}

.product-item-info {
  text-align: center;
}

.product-list-cout {
  color: #898989;

  margin: 0px;

  font-family: "Gilroy-SemiBold";
}

.product-list-name {
  color: #333333;

  font-size: 16px;

  margin-bottom: 10px;

  text-transform: uppercase;

  line-height: 20px;

  font-family: "Gilroy-Bold";
}

.slick_product_list .slick-slide {
  margin: 15px;
}

/* banner */

.banner-item .scale-img {
  border-radius: 10px;
}

/* product all*/

.title-product {
  margin-top: 20px;

  margin-bottom: 20px;

  display: flex;

  justify-content: space-between;

  border-bottom: 1px solid #d9d9d9;
}

.left-title {
  display: flex;

  align-items: center;

  gap: 10px;

  color: #333333;

  width: fit-content;

  position: relative;

  margin-bottom: 20px;
}

.left-title::before {
  position: absolute;

  content: "";

  background: url(../images/muiten.png);

  width: 8px;

  height: 8px;

  right: -18px;

  bottom: 0px;
}

.left-title::after {
  position: absolute;

  content: "";

  background: #f7921d;

  width: 100%;

  height: 3px;

  bottom: -21px;

  right: 0px;

  left: 0px;
}

.left-title h3 {
  margin: 0px;

  font-size: 24px;

  text-transform: uppercase;

  font-family: "Gilroy-Bold";

  line-height: 24px;
}

.right-title {
  display: flex;

  align-items: center;

  gap: 20px;
}

.right-title p {
  margin: 0px;
}

.item-cat {
  border: 1px solid #d9d9d9;

  border-radius: 5px;

  padding: 10px 20px;

  cursor: pointer;
}

.item-cat.choosed,
.item-cat:hover {
  background: #0e6837;

  color: white;
}

.box-main-product {
  margin-bottom: 30px;
}

.grid-product {
  display: grid;

  grid-template-columns: repeat(6, 1fr);

  gap: 20px;
}

/* giới thiệu */

.wrap-gioithieu {
  position: relative;
}

.wrap-group-gioithieu {
  display: flex;

  gap: 90px;
}

.right-gioithieu {
  width: calc(100% - 90px - 690px);
}

.title-main-gioithieu p {
  font-size: 14px;

  color: #f7921d;

  text-transform: uppercase;

  padding-left: 25px;

  position: relative;

  font-family: "Gilroy-Bold";
}

.title-main-gioithieu h3 {
  font-size: 32px;

  text-transform: uppercase;

  font-family: "Gilroy-Bold";

  margin-bottom: 20px;
}

.title-main-gioithieu p::before {
  background: url(../images/icon-grid2.png) no-repeat left;

  background-size: 100% 100%;

  position: absolute;

  content: "";

  left: 0px;

  top: 50%;

  transform: translateY(-50%);

  width: 17px;

  height: 8px;
}

.line-gioithieu {
  width: 100%;

  height: 1px;

  background: #d9d9d9;

  margin: 37px 0px;
}

.left-gioithieu {
  width: 690px;

  position: relative;
}

.main-img {
  float: right;
}

.main-img.scale-img {
  border-radius: 10px;
}

.desc-gioithieu {
  font-family: "Gilroy-Medium";

  letter-spacing: 0.5px;

  line-height: 24px;

  color: #898989;
}

.group-btn {
  display: flex;

  gap: 40px;
}

.btn-gioithieu {
  background: #570200;

  width: fit-content;

  position: relative;

  height: 50px;

  line-height: 50px;

  padding: 0px 40px;

  color: white;

  border-radius: 200px;

  font-size: 16px;

  font-family: "Gilroy-Bold";
}
.btn-gioithieu:hover {
  color: #f7921d;
}

.btn-gioithieu div {
  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;
}

.btn-hotline {
  display: flex;

  gap: 10px;

  align-items: center;
}

.hotline-info p:first-child {
  color: #898989;

  font-size: 14px;

  margin: 0px;

  font-family: "Gilroy-SemiBold";
}

.hotline-info p:last-child {
  font-size: 24px;

  color: #570200;

  margin: 0px;

  line-height: 24px;

  font-family: "Gilroy-Bold";
}

.img-gioithieu-1 {
  position: absolute;

  top: -50px;

  left: 0px;
}

.img-gioithieu-2 {
  position: absolute;

  bottom: -50px;

  left: 0px;
}

.img-gioithieu-1 .scale-img {
  border: 5px solid white;

  border-radius: 10px;

  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.img-gioithieu-2 .scale-img {
  border: 5px solid white;

  border-radius: 10px;

  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

/* đội ngũ */

.wrap-team {
  background: url(../images/bgr_doingu.png) no-repeat;

  background-size: 100% 100%;
}

.wrap-team .wrap-content {
  display: flex;

  gap: 80px;
}

.title-main-team {
  width: calc(100% - 80px - 685px);
}

.box-main-team {
  width: 685px;

  position: relative;
}

.title-main-team p {
  font-size: 14px;

  color: #f7921d;

  font-family: "Gilroy-Bold";

  text-transform: uppercase;

  padding-left: 25px;

  position: relative;
}

.title-main-team p::before {
  background: url(../images/icon-grid2.png) no-repeat left;

  background-size: 100% 100%;

  position: absolute;

  content: "";

  left: 0px;

  top: 50%;

  transform: translateY(-50%);

  width: 17px;

  height: 8px;
}

.title-main-team h3 {
  font-size: 32px;

  font-family: "Gilroy-Bold";

  text-transform: uppercase;

  margin-bottom: 27px;
}

.title-main-team .desc-team {
  color: #898989;

  line-height: 25px;

  margin-bottom: 40px;

  font-family: "Gilroy-Medium";
}

.item-team {
  position: relative;

  margin-bottom: 35px;
}

.team-img .scale-img {
  border-radius: 10px;
}

.team-info {
  bottom: -35px;

  position: absolute;

  background: #0000008f;

  border-radius: 200px;

  color: white;

  margin: 0px 30px;

  padding: 15px 20px;

  text-align: center;

  left: 0px;

  right: 0px;
}

.team-info p {
  font-size: 12px;

  font-family: "Gilroy-Bold";

  text-transform: uppercase;

  margin-bottom: 5px;
}

.team-info h3 {
  font-size: 20px;

  text-transform: uppercase;

  margin: 0px;

  font-family: "Gilroy-Bold";

  line-height: 26px;
}

.control-team {
  position: relative;

  bottom: 0px;

  top: auto;

  margin-top: 40px;
}

.control-team::before {
  content: "";

  position: absolute;

  width: calc(100% - 100px);

  height: 1px;

  background: #d9d9d9;

  bottom: -10px;

  right: 0px;
}

.control-team::after {
  content: "";

  position: absolute;

  width: 11px;

  height: 11px;

  border-radius: 50%;

  background: #570200;

  bottom: -15px;

  right: 0px;
}

.control-team.control-owl button {
  height: 16px;
}

.control-team.control-owl button.owl-prev {
  left: 0px;

  bottom: 0px;

  position: absolute;

  background: none;
}

.control-team.control-owl button.owl-prev svg {
  display: none;
}

.control-team.control-owl button.owl-prev::before {
  position: absolute;

  content: "";

  background: url(../images/prev.png) no-repeat;

  width: 20px;

  height: 16px;

  top: 0px;
}

.control-team.control-owl button.owl-next {
  right: auto;

  left: 50px;

  bottom: 0px;

  position: absolute;

  background: none;
}

.control-team.control-owl button.owl-next svg {
  display: none;
}

.control-team.control-owl button.owl-next::before {
  position: absolute;

  content: "";

  background: url(../images/next.png) no-repeat;

  width: 20px;

  height: 16px;

  top: 0px;
}

/* thư viện ảnh */

.wrap-thuvien {
  background: url(../images/bgr_thuvien.png) no-repeat;

  background-size: 100% 100%;
}

.box-main-thuvien {
  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 15px;
}

.item-thuvien-1 {
  grid-column: 1/2;

  grid-row: 1/3;
}

.item-thuvien-2 {
  grid-column: 2/3;

  grid-row: 1/2;
}

.item-thuvien-3 {
  grid-column: 3/4;

  grid-row: 1/2;
}

.item-thuvien {
  position: relative;
}

.item-thuvien .scale-img {
  border-radius: 10px;
}

.thuvien-name {
  position: absolute;

  height: auto;

  padding: 10px;

  text-align: center;

  top: 50%;

  transform: translateY(-50%);

  color: #fff;

  background: #000000ab;

  font-size: 1.2rem;

  text-transform: uppercase;

  opacity: 0;

  transition: 0.2s all;

  width: 100%;
}

.item-thuvien:hover h3.thuvien-name {
  opacity: 1;
}

/* Tại sao */

.why-item {
  display: flex;

  gap: 15px;
}

.why-img {
  width: 50px;

  border-radius: 50%;

  transition: 0.7s;
}

.why-info {
  width: calc(100% - 15px - 50px);
}

.why-name {
  font-size: 16px;

  font-family: "Gilroy-Bold";

  text-transform: uppercase;
}

.why-desc {
  color: #898989;

  margin: 0px;

  font-family: "Gilroy-Medium";
}

.why-item:hover .why-img {
  transform: rotateY(180deg);
}

/* group feedback and newsletter */

.wrap-group-feedback-newsletter {
  background: url(../images/bgr_feedback_newsletter.png) no-repeat;

  background-size: 100% 100%;
}

.wrap-group-feedback-newsletter .wrap-content {
  display: flex;

  gap: 60px;
}

.title-main-feedback {
  display: flex;

  justify-content: space-between;

  align-items: center;
}

.title-main-feedback div.about-thuvien {
  border: 1px solid white;

  border-radius: 200px;

  padding: 0px 30px;

  font-size: 16px;

  font-family: "Gilroy-Bold";

  height: 60px;

  display: flex;

  align-items: center;

  justify-content: center;
}

.title-main-feedback div a {
  color: white;
}
.title-main-feedback div:hover a {
  color: #f7921d;
}
.title-main-feedback p {
  font-size: 14px;

  color: #f7921d;

  font-family: "Gilroy-Bold";

  text-transform: uppercase;

  padding-left: 25px;

  position: relative;
}

.title-main-feedback p::before {
  background: url(../images/icon-grid2.png) no-repeat left;

  background-size: 100% 100%;

  position: absolute;

  content: "";

  left: 0px;

  top: 50%;

  transform: translateY(-50%);

  width: 17px;

  height: 8px;
}

.title-main-feedback h3 {
  font-size: 32px;

  text-transform: uppercase;

  margin-bottom: 27px;

  font-family: "Gilroy-Bold";
}

.title-main-feedback h3.trang {
  color: white;
}

.left-feedback {
  width: calc(100% - 30px - 50%);
}

.item-feedback {
  background: url(../images/bgr_feedback.png) no-repeat;

  background-size: 100% 100%;

  padding: 35px 40px;

  position: relative;
}

.item-feedback::before {
  position: absolute;

  content: "";

  background: url(../images/phay.png) no-repeat;

  background-size: 100% 100%;

  width: 53px;

  height: 53px;

  top: 0px;

  right: 0px;
}
.feedback-star {
  display: flex;
  align-items: center;
  gap: 20px;
}
.feedback-star i {
  color: #f7921d;

  font-size: 16px;
}
.feedback-star span {
  color: #898989;
  font-size: 20px;
  font-family: "Gilroy-Bold";
}
.feedback-desc {
  color: #898989;

  font-size: 20px;

  line-height: 32px;

  margin: 40px 0px;

  font-family: "Gilroy-Medium";
}

.feedback-info {
  display: flex;

  gap: 35px;

  align-items: center;

  position: relative;

  width: fit-content;
}

.feedback-info::before {
  position: absolute;

  content: "";

  background: url(../images/sao.png) no-repeat;

  width: 31px;

  height: 50px;

  top: 50%;

  transform: translateY(-50%);

  left: 60px;
}

.feedback-name p {
  font-size: 16px;

  font-weight: bold;

  margin-bottom: 5px;

  color: #898989;
}

.feedback-name h3 {
  font-size: 20px;

  font-weight: bold;

  margin: 0px;
}

.right-newsletter {
  width: calc(100% - 30px - 50%);
}

/* đăng ký */

.title-main-index .title-dangky {
  text-align: justify;
}

.wrap-group-dangky .wrap-content {
  display: flex;

  position: relative;

  justify-content: flex-end;
}

.wrap-dangky {
  width: 55%;

  position: relative;

  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

  background: url(../images/bgr_form.png) no-repeat;

  background-size: 100% 100%;

  padding: 45px;
}

.title-main-dangky {
  margin-bottom: 20px;
}

.wrap-dangky .title-main span {
  color: black;
}

.title-dangky {
  text-transform: capitalize;

  color: #333333;

  font-family: "font4";

  font-size: 1.8rem;
}

.wrap-banner-dangky {
  position: absolute;

  top: -2.5rem;

  left: 0px;

  width: 55%;
}

.wrap-banner-dangky .scale-img {
  border-radius: 5px;
}

.group-newsletter {
  display: flex;

  flex-direction: column;

  gap: 30px;

  background: white;

  padding: 36px 32px;

  border: 1px solid #d9d9d9;

  border-radius: 10px;
}

.input-group {
  color: #898989;

  font-family: "Gilroy-Medium";

  font-size: 14px;
}

.col-input-group {
  display: flex;

  gap: 30px;

  width: 100%;

  position: relative;
}

.col-input-group p {
  margin: 0px;

  font-family: "Gilroy-SemiBold";

  position: absolute;

  top: -10px;

  padding-left: 25px;

  color: #898989;

  background: url(../images/check.png) no-repeat left;
}

.input-group label {
  position: absolute;

  top: -15px;

  left: 10px;

  background: white;

  padding: 5px 10px;

  font-family: "Gilroy-Medium";
}

.input-group input {
  width: 100%;

  border: 1px solid #d9d9d9;

  border-top-right-radius: 5px !important;

  border-top-left-radius: 5px !important;

  border-bottom-left-radius: 5px !important;

  border-bottom-right-radius: 5px !important;

  height: 50px;

  padding: 10px;

  background: white;
}

.input-group textarea {
  width: 100%;

  border: 1px solid #d9d9d9;

  border-top-right-radius: 5px !important;

  border-top-left-radius: 5px !important;

  border-bottom-left-radius: 5px !important;

  border-bottom-right-radius: 5px !important;

  padding: 10px;

  background: white;

  max-height: 130px;

  resize: none;

  overflow: hidden;
}

.input-group input[type="submit"] {
  background: #570200;

  color: white;

  font-size: 16px;

  text-transform: uppercase;

  border: none;

  font-family: "Gilroy-Bold";

  padding: 10px 20px;

  border-radius: 5px !important;

  letter-spacing: 1px;
}

.box-main-feedback .owl-dots {
  text-align: left;

  margin-top: 35px;
}

/* video */

.box-main-video {
  position: relative;
}

.slider-for-video {
  width: 35%;

  position: absolute;

  left: 10px;

  bottom: 20px;
}

.slider-for-video .slick-slide {
  margin: 0px 10px;
}

.box-video {
  position: relative;
}

.play-video {
  position: absolute;

  background: url(../images/play.png) no-repeat;

  background-size: 100% 100%;

  width: 105px;

  height: 105px;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);
}

.item-video .scale-img {
  border-radius: 5px;
}

/* nhận ký gửi */

.box-main-nhankygui {
  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 20px;
}

.name-nhankygui {
  font-size: 16px;

  font-family: "font5";

  color: #252525;

  margin: 8px 0px;

  line-height: normal;
}

.time-nhankygui {
  color: var(--color-gray);

  margin-bottom: 8px;
}

.desc-nhankygui {
  color: #252525;

  font-family: "font1";
}

.wrap-dangky .line-title {
  background: white;
}

.wrap-dangky .slogan {
  color: #bf1010;

  text-align: justify;
}

/* news */

.control-news.control-owl button.owl-prev {
  left: -50px;

  background: none;
}

.control-news.control-owl button.owl-next {
  right: -50px;

  background: none;
}
body > .skiptranslate {
  display: none !important;
}
body {
  top: 0px !important;
}
iframe.VIpgJd-ZVi9od-ORHb-OEVmcd {
  display: none !important;
}