#main-slider {
  position: relative;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  overflow: clip;
  .swiper-slide {
    max-width: 940px;
    & a {
      display: block;
      max-width: 940px;
      max-height: 475px;
      border-radius: 30px;
      overflow: hidden;

      & img {
        width: 100%;
        height: auto;
      }
    }
  }
  .swiper-button-prev,
  .swiper-button-next {
    width: 50px;
    height: 50px;
    z-index: 99;

    @media screen and (max-width: 640px) {
      width: 8vw;
      height: 8vw;
    }
  }

  .swiper-button-prev::after,
  .swiper-button-next::after {
    content: '';
    display: block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-image: url('./ionic-ios-arrow-dropleft-circle.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    @media screen and (max-width: 640px) {
      width: 8vw;
      height: 8vw;
    }
  }

  .swiper-horizontal {
    padding-bottom: 50px;
  }

  .swiper-button-prev {
    left: 25px;
    @media screen and (max-width: 640px) {
      left: 2vw;
    }
  }
  .swiper-button-prev::after {
    transform: rotate(180deg);
  }

  .swiper-button-next {
    right: 25px;
    @media screen and (max-width: 640px) {
      right: 2vw;
    }
  }
}