.swiper {
  width: 100%;
  padding: 20px 0 60px;
  overflow: hidden;
}

.swiper-wrapper {
  /* wrapperのサイズを調整 */
  width: 100%;
  height: auto;
  @media (min-width: 768px) {
    width:100%;
  }
  @media (min-width: 940px) {
    width:630px;
  }


}

.swiper-slide {
  /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  color: #ffffff;
  width: 300px;
  height: 100%;
  text-align: center;
  line-height: 0;
  max-width: 300px;
}

.swiper-slide img {
  width: 100%;
}

.swiper-button-next, .swiper-button-prev {
  transition: 0.2s;
}

@media (max-width: 663px) {
   .swiper-button-next, .swiper-button-prev { color: #ffffff; }
}

@media (min-width: 940px) {
   .swiper-button-next:hover {
    transform: scale(1.2);
  }
  .swiper-button-prev:hover {
    transform: scale(1.2);
  }
}