.swiper {
    padding: 16px 0; /*上下のbox-shadowが見切れるための余白*/
}
.swiper-wrapper {
    max-width: 0;
}
.swiper-slide {
    height: auto; /* 画像＋テキストのスライドでテキストの高さ揃える */
    display: flex; /* 〃 */
    opacity: 0.4;
    transition: 0.3s;
}
.swiper-slide-active {
    opacity: 1;
}
.swiper-item {
    width: 100%;
    background-color: #f7f7f7;
    border-radius: 0 0 4px 4px / 0 0 4px 4px;
    box-shadow: 0 0 4px rgba(0,0,0,0.2);
    margin: 0 0 16px;
    display: flex; /* テキストの高さ揃えるために */
    flex-direction: column; /* 〃 */
}
.swiper-item p {
    padding: 16px 16px 0;
    display: flex; /* テキストの高さ揃えるために */
    flex-direction: column; /* 〃 */
}
.swiper-item h3 {
    font-weight: bold;
    padding: 0 16px 16px;
    flex: 1; /* 高さを埋めるように引き伸ばす */
    display: flex;  /* テキストの高さ揃えるために */
    flex-direction: column;  /* 〃 */
}
.swiper-button-prev svg,
.swiper-button-next svg {
    display: none;
}
.swiper-button-prev::after,
.swiper-button-next::after {
    content: "";
}
.swiper-arrow {
    color: #fff;
    font-size: 20px;
    background: rgba(0,0,0,0.4);
    border-radius: 4px;
    height: 48px;
    width: 48px;
    top: calc(50% - 10px);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 10;
}
.prev-arrow {
	left: 16px;
}
.next-arrow {
	right: 16px;
}
@media only screen and (max-width: 959px) {
  .prev-arrow {
  	left: 0;
    border-radius: 0 4px 4px 0 / 0 4px 4px 0;
  }
  .next-arrow {
  	right: 0;
    border-radius: 4px 0 0 4px / 4px 0 0 4px;
  }
}
@media only screen and (max-width: 599px) {
  .swiper-arrow {
    font-size: 18px;
    height: 44px;
    width: 44px;
    top: calc(50% - 8px);
  }
}