/* Swiperの基本スタイル読み込み（CDN経由で直接入れる場合は不要ですが、必要に応じて） */
.swiper {
  width: 100%;
  padding: 0 0 20px;
}

.swiper-slide {
  text-align: center;
  background: #fff;
  /* カードに少し丸みを持たせる場合 */
  border-radius: 8px; 
  overflow: hidden;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* 矢印ボタンの色や配置のカスタマイズ */
.swiper-button-next,
.swiper-button-prev {
  color: #00a0e9; /* 画像のような水色にする場合 */
}

/* 「すべてのセール商品を見る」ボタンのスタイル */
.more-btn-container {
  text-align: center;
  margin-top: 20px;
}
.more-btn {
  display: inline-block;
  padding: 15px 40px;
  background-color: #ff5a71; /* ピンク系の色 */
  color: #fff;
  text-decoration: none;
  border-radius: 10px;
  font-weight: bold;
}