body {
  font-family: "Noto sans thai", "Arial Thai", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.under-line-title {
  width: 53.4px;
  height: 2.8px;
  margin: 0 2.8px 0 0;
  border-radius: 1.4px;
  background-color: #015cb7;
}
.under-line-title-2 {
  width: 53.4px;
  height: 2.8px;
  margin: 0 0 0 2.8px;
  border-radius: 1.4px;
  background-color: #d2e6fb;
}
.navbar-toggler:focus {
  box-shadow: none;
}
.content-wrapper img {
  max-width: 100%;
  height: auto !important;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  line-height: 1.1;
}

.arrow {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-top: 2px solid #499bee;
  border-right: 2px solid #499bee;
}
.arrow-right {
  transform: rotate(45deg);
}
.footer-menu a:hover,
.navbar .nav-item a.nav-link:hover {
  color: #4a9cf8
}
.bounce-up img,
.bounce-up div {
  opacity: 0;
  -moz-transition: all 700ms ease-out;
  -webkit-transition: all 700ms ease-out;
  -o-transition: all 700ms ease-out;
  transition: all 700ms ease-out;
  -moz-transform: translate3d(0px, 200px, 0px);
  -webkit-transform: translate3d(0px, 200px, 0px);
  -o-transform: translate(0px, 200px);
  -ms-transform: translate(0px, 200px);
  transform: translate3d(0px, 200px, 0px);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}
.bounce-up.in-view img,
.bounce-up.in-view div {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}
.footer-menu a,
.navbar-nav .nav-link {
  position: relative;
}
.footer-menu a::before,
.navbar-nav .nav-link::before {
  transition: 300ms;
  height: 2px;
  content: "";
  position: absolute;
  background-color: #fff;
  width: 0;
  bottom: 5px;
}
.footer-menu a::before {
  bottom: 2px;
}
.navbar-nav .nav-item.active .nav-link::before,
.navbar-nav .nav-link:hover::before {
  width: calc(100% - 16px);
}
.footer-menu a:hover::before {
  width: 100%;
}
.social-links a:hover img,
.line-header:hover img {
  transform: scale(1.2);
  transition: all 300ms ease-out;
}

/* Banner */
.swiper-slide {
  background-size: 100%;
  background-position: top left;
  background-repeat: no-repeat;
}

.swiper-slide {
  min-height: calc(100vw* 0.7);
}

.product-detail .swiper-slide {
  min-height: calc(100vw* 0.781);
}

.slider-container {
  padding-top: 30px;
}

@media (min-width: 531px) {
  .swiper-slide {
    min-height: calc(100vw* 0.7);
  }

  .product-detail .swiper-slide {
    min-height: calc(100vw* 0.781);
  }
}

@media(min-width: 992px) {
  .swiper-slide {
    min-height: calc(100vw* 0.2635);
  }

  .swiper-slide {
    background-size: 100%;
    background-position: top left;
    background-repeat: no-repeat;
  }

  .product-detail .swiper-slide {
    min-height: calc(100vw* 0.351);
  }
}

@media(min-width: 1200px) {
  .swiper-slide {
    min-height: calc(100vw* 0.2635);
  }

  .slider-container {
    padding-top: 50px;
  }

  .swiper-slide {
    background-size: 100%;
    background-position: top left;
    background-repeat: no-repeat;
  }

  .product-detail .swiper-slide {
    min-height: calc(100vw* 0.351);
  }
}
@media (min-width: 1440px) {
  .product-carousel .swiper-slide {
    min-height: calc(100vw* 0.1635);
  }
}
@media (max-width: 991px) {
  .breadcrumb {
    font-size: 12px;
  }
}

.slider-sub-title {
  font-size: 20px;
}

.slider-title {
  font-size: 40px;
}
@media (min-width: 768px) {
  .slider-sub-title {
    font-size: 30px !important;
  }
  .slider-title {
    font-size: 70px !important;
  }

  .text-md-12 {
    font-size: 12px !important;
  }
  .text-md-14 {
    font-size: 14px !important;
  }
  .text-md-16 {
    font-size: 16px !important;
  }
  .text-md-18 {
    font-size: 18px !important;
  }
  .text-md-20 {
    font-size: 20px !important;
  }
  .text-md-24 {
    font-size: 24px !important;
  }
  .text-md-28 {
    font-size: 28px !important;
  }
  .text-md-30 {
    font-size: 30px !important;
  }
  .text-md-34 {
    font-size: 34px !important;
  }
  .text-md-50 {
    font-size: 50px !important;
  }
  .text-md-70 {
    font-size: 70px !important;
  }
  .text-md-nowrap {
    white-space: nowrap !important;
  }
}
.banner-editor {
  background-color: #005eb8;
}