/* JRMS Logo Swiper — Row-stable + Responsive Columns (SP: 3→4→5)
   目的：
   - 行（段）をPCと同じだけ必ず表示させる下支え（未初期化の行も潰れない）
   - モバイルは列数を幅に応じて調整して“正方形感”を解消
   - 影・高さをSP向けに軽量化（iOS安定）しつつPCは従来の見た目を維持
*/

/* ラッパー（行全体の上下余白・行間） */
.jrms-logo-swiper-wrap{
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding: 28px 0;
  display: flex;
  flex-direction: column;
  gap: 16px;  /* 行（=Swiperインスタンス）間の余白 */
}

/* 各行コンテナ（※未初期化時も高さが潰れないよう min-height を与える） */
.swiper.jrms-swiper-logo{
  width: 100%;
  overflow: hidden;
  padding: 10px 0;
  min-height: 100px;  /* SPの仮高さ。初期化前でも行が消えない */
}

/* 等速スクロールを強制 */
.swiper.jrms-swiper-logo .swiper-wrapper{
  transition-timing-function: linear !important;
}

/* カード（共通：PC基準） */
.jrms-swiper-logo .swiper-slide{
  height: 140px;
  display: flex; align-items: center; justify-content: center;
  background: #fff;
  border-radius: 16px;
  box-shadow:
    0 8px 18px rgba(0,0,0,.08),
    0 3px  8px rgba(0,0,0,.05);
  padding: 14px 16px;
  box-sizing: border-box;
  transition: transform .25s ease, box-shadow .25s ease;
}
.jrms-swiper-logo .swiper-slide:hover{
  transform: translateY(-3px);
  box-shadow:
    0 12px 25px rgba(0,0,0,.12),
    0  5px 12px rgba(0,0,0,.08);
}

/* ロゴ画像（共通） */
.jrms-swiper-logo .swiper-slide img{
  max-width: 88%;
  max-height: 68%;
  width: auto; height: auto; object-fit: contain;
}

/* --- モバイル最適化：“正方形感”の解消（高さを抑え、影を軽量化） --- */
@media (max-width: 959.98px){
  .jrms-swiper-logo .swiper-slide{
    height: 88px;   /* 低めにして横長印象へ */
    padding: 10px 12px;
    box-shadow:
      0 4px 10px rgba(0,0,0,.06),
      0 2px  4px rgba(0,0,0,.04);
    transition: none; /* 負荷低減。iOSで安定 */
  }
  .jrms-swiper-logo .swiper-slide:hover{
    transform: none;
    box-shadow:
      0 4px 10px rgba(0,0,0,.06),
      0 2px  4px rgba(0,0,0,.04);
  }
  .jrms-logo-swiper-wrap{ padding: 22px 0; gap: 12px; }
  .swiper.jrms-swiper-logo{ padding: 8px 0; min-height: 92px; } /* SP仮高さを合わせる */

  /* 縦長ロゴが目立ち過ぎる場合は最大高さを少し下げてバランス取り */
  .jrms-swiper-logo .swiper-slide img{
    max-height: 62%;
  }
}

/* --- PCのみ：全幅100vw＋中央寄せ（従来の広がり） --- */
@media (min-width: 960px){
  .jrms-logo-swiper-wrap{
    width: 100vw;
    margin-left: 50%;
    transform: translateX(-50%);
  }
}