@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@100..900&display=swap');

:root {
  --primary-color: #89cfec;
  --secondary-color: rgb(17, 20, 29);
  --text-white: #fff;
  --text-black: #000;
  --text-primary: #1A1A1A;
  --text-nav: #CCCCCC;
  --primary: #D39B32;
  --primary-hover: #AE7C1F;
  --black-bg: #0B0D0C;
  --text-black-1: #0B0F0E;
  --text-black4: #444444;
  --text-black5: #555555;
  --text-heading: #1A1A1A;
  --text-heading-contact: #111827;
  --text-outline: #E69C00;
  --text-swiper: #374151;
  --text-subtitle: #6B7280;
  --text-footer: #9CA3AF;
  --bg-outline-btn: #F3C462;
  --bg-ready: #181A19;
  --bg-pay-btn: #E8AA30;
  --border-btn-swiper: #D1D5DB;
  --border-pay: #E5E7EB;
  --contact-border: #D7DADE;
  --fz-60down36: clamp(36px, 4.17vw, 60px);
  --fz-48down24: clamp(24px, 3.34vw, 48px);
  --fz-42down32: clamp(32px, 2.92vw, 42px);
  --fz-28down20: clamp(20px, 1.95vw, 28px);
  --fz-18down16: clamp(16px, 1.25vw, 18px);
  --fz-16down14: clamp(14px, 1.12vw, 16px);
  --fz-12: 12px;
  --fz-13: 13px;
  --fz-14: 14px;
  --fz-15: 15px;
  --fz-16: 16px;
  --fz-18: 18px;
  --fz-20: 20px;
  --fz-24: 24px;
  --fz-26: 26px;
  --fz-32: 32px;
  --fz-36: 36px;
  --fz-40: 40px;
  --fz-48: 48px;
  --fz-75: 75px;
  --lh-32-fz-24: 1.33;
  --lh-20-fz-14: 1.43;
  --lh-16-fz-12: 1.33;
  --alex-font: "Alexandria", sans-serif;
}

html {
  scroll-behaviour: smooth;
}

.mfp-close {
  width: 24px !important;
  height: 24px !important;
  background: url("../../img/close-icon.svg") center / contain no-repeat !important;
  font-size: 0 !important;
  opacity: 1 !important;
  transition: all .3s ease !important;
}

.mfp-close svg {
  display: none !important;
}

.mfp-content {
  background-color: var(--black-bg) !important;
}

:is(h1, h2, h3, h4, h5, h6) {
  line-height: normal;
  letter-spacing: 0;
  margin: 0 !important;
}

.row::after {
  display: none !important;
}

.hide-pc {
  display: none !important;
}

.btn-prev,
.btn-next {
  width: 52px;
  height: 52px;
  min-width: 52px;
  padding: 0;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px 22px !important;
  border-radius: 99px;
  border: 1px solid var(--border-btn-swiper) !important;
  margin: 0 !important;
  position: relative;
}

.btn-prev,
.btn-next {
  background-image: none !important;
}

.btn-prev::before,
.btn-next::before {
  content: "";
  display: block;
  width: 18px;
  height: 22px;
  margin: auto;
  background-color: #000;
  -webkit-mask: center / contain no-repeat;
  mask: center / contain no-repeat;
  transition: background-color 0.2s ease;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.btn-prev::before {
  -webkit-mask-image: url("../../img/arrow-left.svg");
  mask-image: url("../../img/arrow-left.svg");
}

.btn-next::before {
  -webkit-mask-image: url("../../img/arrow-right.svg");
  mask-image: url("../../img/arrow-right.svg");
}

.tes-right .btn-prev:hover::before,
.tes-right .btn-next:hover::before {
  background-color: #fff;
}

.tes-right .button:hover {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.btn-prev span,
.btn-next span {
  display: none;
}

.back-to-top {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.back-to-top:hover {
  background-color: var(--primary-hover) !important;
  border-color: var(--primary-hover) !important;
}

.back-to-top i::before {
  color: var(--text-white);
}

ul li,
ol li {
  list-style: none;
}

body p {
  margin-bottom: 0px;
  font-size: var(--fz-16);
  font-weight: 400;
  line-height: 1.6;
  color: var(--text-white);
  letter-spacing: 0;
}

body a {
  color: var(--text-white);
}

.title-48 {
  font-size: var(--fz-48);
  font-weight: 700;
  line-height: 1.5;
  color: var(--text-heading);
}

.title-40 {
  font-size: var(--fz-40);
  color: var(--text-white);
  line-height: 54px;
  font-weight: 500;
}

.title-36 {
  font-size: var(--fz-36);
  font-weight: 700;
  line-height: 1.5;
}

.title-24 {
  font-size: var(--fz-24);
  font-weight: 700;
  line-height: 1.5;
}

.title-20 {
  font-size: var(--fz-20);
  font-weight: 600;
  line-height: 1.5;
}

.title-18 {
  font-size: var(--fz-18);
  font-weight: 700;
  line-height: 1.5;
}

.title-16 {
  font-size: var(--fz-16);
  font-weight: 400;
  line-height: 45px;
}

.section-no {
  padding: 0px !important;
}

.section-large {
  padding: 100px 0px !important;
}

.section-medium {
  padding: 50px 0px !important;
}

@media (max-width: 1024px) {
  .section-large {
    padding: 50px 0px !important;
  }

  .section-medium {
    padding: 25px 0px !important;
  }
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media screen and (max-width: 767px) {
  .hide-pc {
    display: block !important;
  }

  .hide-sm {
    display: none !important;
  }
}