.main_station{
    width: 100%;
    /* height: 100%; */
    max-height: 100vh;
    aspect-ratio: 16/9;
    /* background: #888; */
    overflow: visible;
    position: relative;
}
.main_station video{
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50% , -50%);
    width: 100%;
    /* height: 100%; */
    aspect-ratio: 16/9;
}
.main_station .pc{display: block;}
.main_station .mo{display: none;}

/* banner swiper */
.main_station .swiper-pagination{
  margin-bottom: 2rem;
}
.main_station .swiper-pagination-bullet {
  width: var(
  --swiper-pagination-bullet-width,
  var(--swiper-pagination-bullet-size, 10px)
  );
  height: var(
  --swiper-pagination-bullet-height,
  var(--swiper-pagination-bullet-size, 10px)
  );
}
.main_station .swiper-pagination-bullet{
  background: #dadada;
}
.main_station .swiper-pagination-bullet-active {
  /* opacity: var(--swiper-pagination-bullet-opacity, 1); */
  background: var(--swiper-pagination-color, #000000);
}

/* tour */
.gallery-slider {
  position: relative;
  margin: 0 auto;
}

.gallery-single {
  display: flex;
  overflow: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.gallery-single::-webkit-scrollbar {
  display: none;
}

.gallery-single > div {
  scroll-snap-align: center;
  transition: transform 0.5s ease;
  max-width: 700px;
  margin-left: auto;
  border-radius: 20px;
}

.gallery-single img {
  display: block;
  margin-left: auto;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 20px;
}

.gallery-nav {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 30px;
  gap: 0px;
}

.gallery-nav > div {
  overflow: hidden;
  cursor: pointer;
  border-radius: 10px;
  transition: transform 0.3s ease;
}

.gallery-nav > div:hover {
  transform: scale(1.05);
}

.gallery-nav img {
  width: 220px;
  height: 130px;
  object-fit: cover;
  border-radius: 20px;
  transition: opacity 0.3s ease;
  border: 3px solid transparent;
  position: relative;
  z-index: 1;
}

.gallery-nav .slick-slide img.active-thumb {
  border: 3px solid #0591F2;
}
.place_arrow_wrap{
  display: flex;
  gap: 20px;
}

.tour_prev.active-thumb::before,
.tour_next.active-thumb::before, .equ_prev.active-thumb::before,
.equ_next.active-thumb::before {
  content: "";
  position: absolute;
  top: -4px;
  left: -4px;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  border-radius: 50%;
  background: conic-gradient(white 0deg, #0591F2 360deg);
  mask: radial-gradient(farthest-side, transparent calc(100% - 7px), black 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 7px), black 100%);
  z-index: 0;
  box-sizing: border-box;
  animation: spinCircle 0.5s linear forwards;
  z-index: 0;
}

@keyframes spinCircle {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.tour_prev, .tour_next {
  position: relative;
  width: 67px;
  height: 67px;
  padding: 0;
  border-radius: 50%;
  border: 1px solid #B0B0B0;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  z-index: 1;
  overflow: visible; 
  cursor: pointer;
}
.tour_prev:hover, .tour_next:hover{
  animation: bounceImage 0.4s ease-in-out;
}
.gallery-arrow_img_wrap{
  display: flex;
  flex-direction: row-reverse;
  gap: 20px;
  align-items: flex-end;
}

@media screen and (max-width: 1080px) {

}
@media screen and (max-width: 900px) {
  /* .main_station .img_box .bn_pc {
    display: none;
  }
  .main_station .img_box .bn_m {
    display: block;
  }
  .main_station video.mo {
    display: none;
  }
  .main_station video.pc {
    display: block;
  }
  .main_station {
    aspect-ratio: 5/6;
    max-height: 800px;
  } */
}
@media screen and (max-width: 550px) {
  .place_arrow_wrap, .equ_arrow_wrap{
    gap: 10px;
  }
  .gallery-nav img{
    height: 90px;
  }
  .tour_prev, .tour_next, .equ_prev, .equ_next{
    width: 40px;
    height: 40px;
  }
  .tour_prev img, .tour_next img, .equ_prev img, .equ_next img{
    width: 50%;
  }
}