.mo_view {
  display: none;
}

@media (max-width: 1024px) {
  .pc_view {
    display: none;
  }
  .mo_view {
    display: block;
  }
}
#mainRolling {
  overflow-x: hidden;
  /* swiper prev, next */
  /* pagination */
}
#mainRolling .swiper {
  width: 100%;
  height: 100%;
  position: relative;
}
#mainRolling .swiper img {
  width: 100%;
}
#mainRolling .swiper-button-prev, #mainRolling .swiper-button-next {
  mix-blend-mode: luminosity;
}
@media (max-width: 1024px) {
  #mainRolling .swiper-button-prev, #mainRolling .swiper-button-next {
    display: none;
  }
}
#mainRolling .swiper-button-prev {
  left: 3%;
}
#mainRolling .swiper-button-next {
  right: 3%;
}
#mainRolling .swiper-pagination {
  bottom: 5%;
}
@media (max-width: 1024px) {
  #mainRolling .swiper-pagination {
    bottom: 4%;
  }
}
#mainRolling .swiper-pagination-bullet {
  position: relative;
  width: 100px;
  height: 5px;
  margin: 0 8px;
  border-radius: 0;
  background: rgba(0, 0, 0, 0.2);
  opacity: 1;
}
@media (max-width: 1024px) {
  #mainRolling .swiper-pagination-bullet {
    width: 60px;
  }
}
#mainRolling .swiper-pagination-bullet::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0%;
  height: 5px;
  background: #666666;
}
#mainRolling .swiper-pagination-bullet-active {
  background: rgba(0, 0, 0, 0.2);
}
#mainRolling .swiper-pagination-bullet-active::before {
  width: 100%;
  animation: in_width 6s ease-out;
}
@keyframes in_width {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}