.swiper {
  width: 50%;
  height: 650px;
  margin: 2rem auto;
  /*overflow: visible;*/
  position: relative;
}

.swiper-slide {
  width: 100%;
  height: 550px;
  position: relative;
}

.slide-bg {
  width: 100%;
  height: 100%;
  border-radius: 15px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transform: scale(0.88);
  filter: blur(3px) brightness(0.8);
  opacity: 0.5;
  transition:
    transform 0.45s ease,
    filter 0.45s ease,
    opacity 0.45s ease;
  will-change: transform, filter, opacity;
}

/* アクティブ */
.swiper-slide-active .slide-bg {
  transform: scale(1);
  filter: blur(0) brightness(1);
  opacity: 1;
}

/* 前後スライドを少しだけ見せたい場合 
.swiper-slide-prev .slide-bg,
.swiper-slide-next .slide-bg {
  transform: scale(0.93);
  filter: blur(1.5px) brightness(0.9);
  opacity: 0.75;
}
*/
.swiper-slide > p {
  position: absolute;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  bottom: -7%;
  left: 0;
  font-weight: bold;
  font-size: 16px;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.swiper-slide-active > p {
  opacity: 1;
}

/* 背景画像 */
.slide1 { background-image: url(../img/open1.jpg); }
.slide2 { background-image: url(../img/open2.jpg); }
.slide3 { background-image: url(../img/open3.jpg); }
.slide4 { background-image: url(../img/open4.jpg); }
.slide5 { background-image: url(../img/open5.jpg); }
.slide6 { background-image: url(../img/open6.jpg); }

/* ナンバー */
.swiper-number {
  position: absolute;
  width: 100%;
  bottom: 4%;
  left: 0;
  z-index: 10;
  text-align: center;
  margin: 0 auto;
  font-size: 12px;
}

#slide-current {
  transition: all 0.3s ease;
}

#slide-current.active {
  color: #ff0000;
  font-size: 14px;
  font-weight: bold;
}

@media screen and (max-width:768px) {
.swiper {
  width: 94%;
}
}