/* works-catalogue：スマホ幅（599px 以下）で商品を2列に並べる（2026-10-09 tkc 依頼）
   - パソコンで4列を揃えるための空の穴埋め枠（.cat-filler）はスマホでは出さない
     （N-S01 の段では、この空枠が隣に並んで N-S01 が左に押し出されていた）
   - 各段（.cat-row）の中で左から2列、左右の余白 16px・列の間 12px
   パソコン幅の見え方は変えない */
@media screen and (max-width: 599px) {
  .cat-row {
    justify-content: flex-start !important;
    align-items: flex-start !important;   /* ひとことの有無で写真の位置がずれないよう上揃え */
    column-gap: 12px;
    row-gap: 20px;
    padding: 0 16px 20px !important;      /* 段の境目も行の間隔（20px）と同じに */
    box-sizing: border-box;
  }
  .cat-row > .cat-filler {
    display: none;
  }
  .cat-row > .cat-cell {
    width: calc((100% - 12px) / 2);
    margin: 0 !important;   /* 元の上下左右 5px の余白（左右にあると2つ並ばない） */
  }
  .cat-row > .cat-cell > div,
  .cat-row > .cat-cell .ewfx-row {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    flex-basis: 100% !important;
  }
  .cat-row > .cat-cell img {
    width: 100%;
    height: auto;
  }
  /* 品番・ひとことの段落の上下余白（12px）を詰める */
  .cat-row .ewfb-image-desc p {
    margin: 4px 0 !important;
  }
  /* ひとことの無い商品の空段落（全角スペース・ゼロ幅文字だけ）を出さない → 段の間隔をそろえる */
  .cat-row .ewfb-image-desc p.cat-empty {
    display: none;
  }
}
