:root {
  --black: #222328;
  --white: #fff;
  --accent: #7981ad;
  --secondary: #da9c86;
  --new-white: #fafcfc;
  --hyper-light: #f8f8fa;
  --gradient-light: linear-gradient(
    8deg,
    #dee3fb 0%,
    rgba(222, 227, 251, 0) 100%
  );
  --gradient-dark: linear-gradient(359deg, #777faa 0%, #a3ade5 100%);
}

@media screen and (max-width: -1px) {
  .hidden-xs-down {
    display: none !important;
  }
}
.hidden-xs-up {
  display: none !important;
}

@media screen and (max-width: 779px) {
  .hidden-sm-down {
    display: none !important;
  }
}
@media screen and (min-width: 780px) {
  .hidden-sm-up {
    display: none !important;
  }
}
@media screen and (max-width: 991px) {
  .hidden-md-down {
    display: none !important;
  }
}
@media screen and (min-width: 992px) {
  .hidden-md-up {
    display: none !important;
  }
}
@media screen and (max-width: 1279px) {
  .hidden-lg-down {
    display: none !important;
  }
}
@media screen and (min-width: 1280px) {
  .hidden-lg-up {
    display: none !important;
  }
}
.promotion-swiper__wrap {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  display: none !important;
}
.promotion-swiper__wrap.swiper-initialized {
  display: block !important;
}
.promotion-swiper__wrap .swiper-slide {
  max-width: 670px;
  overflow: hidden;
  box-shadow: 0px 9px 25px 0px rgba(4, 35, 69, 0.07),
    0px 3.76px 9.755px 0px rgba(4, 35, 69, 0.05),
    0px 2.01px 4.502px 0px rgba(4, 35, 69, 0.03),
    0px 1.127px 2.006px 0px rgba(4, 35, 69, 0.02),
    0px 0.599px 0.742px 0px rgba(4, 35, 69, 0.01),
    0px 0.249px 0.159px 0px rgba(4, 35, 69, 0);
  margin-bottom: 32px;
}
@media screen and (min-width: 780px) {
  .promotion-swiper__wrap .swiper-slide {
    border-radius: 60px 120px 80px 180px;
  }
}
.promotion-swiper__wrap .swiper-slide.swiper-slide-active {
  animation: amorphous-promotion 10s infinite alternate;
}
@media screen and (max-width: 780px) {
  .promotion-swiper__wrap .swiper-slide {
    border-radius: 24px;
  }
  .promotion-swiper__wrap .swiper-slide.swiper-slide-active {
    animation: none;
  }
}
.promotion-swiper__wrap .pr-content {
  position: relative;
  display: block;
}
.promotion-swiper__wrap .pr-content .text {
  position: absolute;
  padding: 60px 30px;
  font-weight: 300;
  line-height: 1;
  width: 50%;
}
.promotion-swiper__wrap .pr-content .text .title {
  color: #222328;
  font-size: 28px;
  margin-bottom: 12px;
}
.promotion-swiper__wrap .pr-content .text .after-title {
  font-size: 20px;
}
.promotion-swiper__wrap .pr-content .text .btn {
  margin-top: 24px;
  z-index: 1;
  position: relative;
  padding: 14px 16px;
  border: 1px solid var(--light, #f2f6fd);
  background: var(--white, #fff);
}
.promotion-swiper__wrap .pr-content .text .btn:hover {
  border: 1px solid var(--accent, #f2f6fd);
  background: var(--accent, #f2f6fd);
  color: #fff;
}
.promotion-swiper__wrap .pr-content .image {
  background-size: auto 100%;
  background-position: right;
  border-radius: 12px;
  overflow: hidden;
}
.promotion-swiper__wrap .pr-content .image img {
  position: absolute;
  height: 100%;
  right: 0;
}
.promotion-swiper__wrap .pr-content .image.right img {
  right: 0;
}
.promotion-swiper__wrap .pr-content .image::after {
  content: "";
  display: block;
  padding-bottom: 52%;
  mix-blend-mode: soft-light;
  background: #fff;
}
@media screen and (max-width: 780px) {
  .promotion-swiper__wrap .pr-content .text {
    padding: 20px 10px !important;
  }
  .promotion-swiper__wrap .pr-content .text .title {
    font-size: 18px;
    margin-bottom: 8px;
  }
  .promotion-swiper__wrap .pr-content .text .after-title {
    font-size: 14px;
  }
  .promotion-swiper__wrap .pr-content .text .btn {
    width: -moz-fit-content;
    width: fit-content;
  }
  .promotion-swiper__wrap .pr-content .image {
    background-position: -20px top;
  }
}
.promotion-swiper__wrap .g-buttons-slider__wrap {
  display: flex;
  justify-content: center;
  padding-top: 40px;
  gap: 16px;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.promotion-swiper__wrap .g-buttons-slider__wrap .each {
  height: 40px;
  width: 40px;
  border: 1px solid var(--accent);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--accent);
  flex: none;
}
.promotion-swiper__wrap .g-buttons-slider__wrap .each svg {
  fill: #fff;
}
.promotion-swiper__wrap .g-buttons-slider__wrap .each:hover {
  background-color: var(--accent);
  opacity: 0.88;
}
.promotion-swiper__wrap .g-buttons-slider__wrap .each:hover svg {
  fill: #fff;
}
.promotion-swiper__wrap .g-buttons-slider__wrap .each.swiper-button-disabled {
  background-color: transparent;
}
.promotion-swiper__wrap
  .g-buttons-slider__wrap
  .each.swiper-button-disabled
  svg {
  fill: var(--accent);
}
.promotion-swiper__wrap .g-buttons-slider__wrap .g-swiper-pagination {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
  font-size: 20px;
}
@media screen and (max-width: 779px) {
  .promotion-swiper__wrap .g-buttons-slider__wrap {
    display: none;
  }
}

@keyframes amorphous-promotion {
  0%,
  100% {
    border-radius: 55px 120px 55px 120px;
  }
  50% {
    border-radius: 120px 55px 120px 55px;
  }
}