/**************************************/
/*-------------------------------------------
 * sightseeing swiper
-------------------------------------------*/
.common-swiper__inner {
  position: relative;
  width: min(90%, 1300px);
  margin-inline: auto;
}

.common-swiper {
  overflow: hidden;
}
@media (max-width: 834px) {
  .common-swiper {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
}
.common-swiper .swiper {
  overflow: visible;
}
.common-swiper .swiper-slide {
  max-width: 55.6rem;
  width: 100%;
  position: relative;
}
@media (max-width: 834px) {
  .common-swiper .swiper-slide {
    width: 80%;
  }
}
.common-swiper .swiper-label {
  position: absolute;
  left: 3.5%;
  bottom: 5%;
  font-size: var(--f18);
  font-family: var(--ff-shippori);
  color: var(--cream);
  font-weight: 400;
  letter-spacing: -0.05em;
  line-height: 1.2;
}
.common-swiper .swiper-option {
  width: 100%;
  position: relative;
  height: 1.4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 3rem;
}
@media (max-width: 834px) {
  .common-swiper .swiper-option {
    margin-top: 2.5rem;
    height: 2.8rem;
  }
}
.common-swiper .swiper-button-prev,
.common-swiper .swiper-button-next {
  position: relative;
  top: unset;
  left: unset;
  right: unset;
  width: 2rem;
  height: auto;
  aspect-ratio: 20/14;
  border-radius: 20px;
  margin-block: 0;
  -webkit-transition: 0.3s ease-in;
  transition: 0.3s ease-in;
  overflow: hidden;
  background: #2c3645;
}
@media (max-width: 834px) {
  .common-swiper .swiper-button-prev,
  .common-swiper .swiper-button-next {
    width: 4rem;
  }
}
.common-swiper .swiper-button-prev::before, .common-swiper .swiper-button-prev::after,
.common-swiper .swiper-button-next::before,
.common-swiper .swiper-button-next::after {
  content: "";
  background-color: #fff;
  -webkit-mask-image: url(../img/common/link-arrow.svg);
          mask-image: url(../img/common/link-arrow.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  position: absolute;
  left: 0;
  right: 0;
  width: 0.7rem;
  height: auto;
  aspect-ratio: 7/5;
  -webkit-transition: left 0.3s ease-in, -webkit-transform 0.3s ease-in;
  transition: left 0.3s ease-in, -webkit-transform 0.3s ease-in;
  transition: transform 0.3s ease-in, left 0.3s ease-in;
  transition: transform 0.3s ease-in, left 0.3s ease-in, -webkit-transform 0.3s ease-in;
}
@media (max-width: 834px) {
  .common-swiper .swiper-button-prev::before, .common-swiper .swiper-button-prev::after,
  .common-swiper .swiper-button-next::before,
  .common-swiper .swiper-button-next::after {
    width: 1.4rem;
    top: calc(50% - 0.5rem);
  }
}
.common-swiper .swiper-button-prev::before,
.common-swiper .swiper-button-next::before {
  left: -120%;
}
.common-swiper .swiper-button-prev:hover::after,
.common-swiper .swiper-button-next:hover::after {
  left: 150%;
}
.common-swiper .swiper-button-prev:hover::before,
.common-swiper .swiper-button-next:hover::before {
  left: 30%;
}
.common-swiper .swiper-button-prev {
  margin-right: 1rem;
}
.common-swiper .swiper-button-prev::after, .common-swiper .swiper-button-prev::before {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.common-swiper .swiper-button-prev::before {
  left: 120%;
}
.common-swiper .swiper-button-prev::after {
  left: 30%;
}
.common-swiper .swiper-button-prev:hover::before {
  left: 30%;
}
.common-swiper .swiper-button-prev:hover::after {
  left: -120%;
}
.common-swiper .swiper-button-next::after {
  content: "";
  background-color: #fff;
  -webkit-mask-image: url(../img/common/link-arrow.svg);
          mask-image: url(../img/common/link-arrow.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  width: 0.7rem;
  height: auto;
  aspect-ratio: 7/5;
}
@media (max-width: 834px) {
  .common-swiper .swiper-button-next::after {
    width: 1.4rem;
  }
}
.common-swiper .swiper-scrollbar {
  background: #f1f1f1;
  width: calc(100% - 5.1rem);
  left: 0;
  bottom: calc(50% - 1px);
  height: 4px;
  overflow: hidden;
  margin-left: 2rem;
}
.common-swiper .swiper-scrollbar span {
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #3d4658;
  border-radius: 100vmax;
}/*# sourceMappingURL=common-slider.css.map */