.pepper-main-slider {
  position: relative; }

.pepper-index-slider {
  --text-slide: #ffffff;
  --btnbg-slide: #ffffff;
  --btntext-slide: #ffffff;
  --btnbg-slide-hover: #cb0310;
  --btntext-slide-hover: #ffffff;
  --swiper-pagination-bullet-inactive-color: #ffffff;
  --swiper-pagination-color: #ffffff;
  padding-top: 5px;
  padding-bottom: 0px;
  position: relative;
  overflow: hidden;
  margin-bottom: 0px;
  background: var(--bg-slide); }
  .pepper-index-slider img {
    border-radius: 8px; }
  @media (max-width: 992px) {
    .pepper-index-slider {
      padding-top: 0px; } }
  .pepper-index-slider .pepper-slide--content {
    position: absolute;
    text-align: left;
    left: 5%;
    top: 50%;
    width: max-content;
    transform: translate(0%, -50%);
    max-width: 550px; }
    .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-subtitle, .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-subtitle .pepper-icon-svg, .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-title, .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-action, .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-desc {
      opacity: 1; }
    .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-subtitle {
      transform: translateY(0); }
      .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-subtitle .pepper-icon-svg {
        transform: translate3d(0, 0, 0); }
    .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-title {
      transform: translate(0, 0); }
    .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-action, .pepper-index-slider .pepper-slide--content.pepper-showall .pepper-desc {
      transform: translateY(0); }
    .pepper-index-slider .pepper-slide--content .pepper-subtitle {
      display: flex;
      align-items: center;
      gap: 10px;
      color: var(--text-slide);
      justify-content: start;
      margin-bottom: 15px;
      opacity: 0;
      transition: .3s all;
      transform: translateY(-25px);
      font-size: 20px;
      font-weight: 500;
      line-height: 26px; }
      @media (max-width: 992px) {
        .pepper-index-slider .pepper-slide--content .pepper-subtitle {
          margin-bottom: 7px;
          font-size: 14px;
          gap: 4px; } }
      .pepper-index-slider .pepper-slide--content .pepper-subtitle .pepper-icon-svg {
        --icon-width: 40px;
        --icon-height: 41px;
        transform: translate3d(-15px, 15px, 20px);
        transition: .3s all;
        opacity: 0; }
        @media (max-width: 992px) {
          .pepper-index-slider .pepper-slide--content .pepper-subtitle .pepper-icon-svg {
            --icon-width: 25px;
            --icon-height: 26px; } }
    .pepper-index-slider .pepper-slide--content .pepper-title {
      font-size: 54px;
      line-height: 1.3;
      font-weight: bold;
      color: var(--text-slide);
      margin-left: -4px;
      transform: translate(25px, -25px);
      transition: .3s all;
      opacity: 0; }
      @media (max-width: 992px) {
        .pepper-index-slider .pepper-slide--content .pepper-title {
          font-size: 28px;
          letter-spacing: 1px; } }
    .pepper-index-slider .pepper-slide--content .pepper-desc {
      color: var(--text-slide);
      margin-top: 30px;
      opacity: 0;
      transform: translateY(25px);
      transition: .3s all; }
    .pepper-index-slider .pepper-slide--content .pepper-action {
      margin-top: 30px;
      opacity: 0;
      transform: translateY(25px);
      transition: .3s all; }
      @media (max-width: 992px) {
        .pepper-index-slider .pepper-slide--content .pepper-action {
          margin-top: 10px; } }
      .pepper-index-slider .pepper-slide--content .pepper-action .button {
        font-size: 16px;
        padding: 25px 30px;
        background-color: var(--btnbg-slide);
        border: 1px solid var(--btnbg-slide);
        color: var(--btntext-slide); }
        @media (max-width: 992px) {
          .pepper-index-slider .pepper-slide--content .pepper-action .button {
            padding: 16px 25px; } }
        .pepper-index-slider .pepper-slide--content .pepper-action .button:hover {
          background-color: var(--btnbg-slide-hover);
          border: 1px solid var(--btnbg-slide-hover);
          color: var(--btntext-slide-hover); }
        @media (max-width: 992px) {
          .pepper-index-slider .pepper-slide--content .pepper-action .button {
            padding: 8px 16px;
            font-size: 12px; } }
  @media (max-width: 991px) {
    .pepper-index-slider .pepper-slide--content {
      right: 0;
      left: 0;
      max-width: 100%;
      padding: 0 15px; } }
  @media (max-width: 767px) {
    .pepper-index-slider .slide--content.showall .action {
      margin-bottom: 15px; } }
  .pepper-index-slider .swiper-button-next,
  .pepper-index-slider .swiper-button-prev {
    background-color: var(--btntext-slide);
    border-radius: 100%;
    width: 60px;
    height: 60px;
    transition: .3s all;
    border: 1px solid var(--btnbg-slide); }
    @media (max-width: 992px) {
      .pepper-index-slider .swiper-button-next,
      .pepper-index-slider .swiper-button-prev {
        display: none; } }
    .pepper-index-slider .swiper-button-next svg,
    .pepper-index-slider .swiper-button-prev svg {
      width: 25px;
      height: 25px; }
      @media (max-width: 992px) {
        .pepper-index-slider .swiper-button-next svg,
        .pepper-index-slider .swiper-button-prev svg {
          width: 18px;
          height: 18px; } }
    @media (max-width: 992px) {
      .pepper-index-slider .swiper-button-next,
      .pepper-index-slider .swiper-button-prev {
        width: 30px;
        height: 30px; } }
    .pepper-index-slider .swiper-button-next:after,
    .pepper-index-slider .swiper-button-prev:after {
      content: none; }
    .pepper-index-slider .swiper-button-next:hover,
    .pepper-index-slider .swiper-button-prev:hover {
      background-color: var(--btnbg-slide);
      transition: .3s all;
      border-color: var(--btnbg-slide); }
      .pepper-index-slider .swiper-button-next:hover svg,
      .pepper-index-slider .swiper-button-prev:hover svg {
        color: var(--btntext-slide); }
  @media (min-width: 992px) {
    .pepper-index-slider .swiper-button-next {
      right: 30px; }
    .pepper-index-slider .swiper-button-prev {
      left: 30px; } }
  @media (max-width: 992px) {
    .pepper-index-slider .swiper-pagination {
      bottom: 4px; } }

.pepper-index-slider img.lazyloaded:not(.noreset) {
  width: 100%; }