/* index（作品の一覧）。実測は measured/index.md（本番 1230 幅・390 幅）
 *   お知らせの段（Group A）: margin-top 126（固定ヘッダーの高さ）・下 20・max 1080 中央・padding 20
 *     レモン 35x25、文 12px/1.4 黒・左 30（幅 500 未満は 15）・最小幅 300
 *   PC の一覧（RepeatingGroup A）: max 1080・セルの最小 200x220 → 1080 なら 5 列（1列 216）。行の高さ 220
 *     絵 190x190 をセルの中央。ホバーで 170x170 の白 0.8 の札（取引先・空行・作品名を 13px/1.4 で中央）
 *   スマホの一覧（RepeatingGroup B・幅 500 未満）: 左 20・右 10・セルの最小 120 → 390 幅で 3 列。絵 110 を左上
 */
.ix-msg { width: 100%; max-width: 1080px; margin: 126px auto 20px; }
.ix-msg-in { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 20px; min-height: 40px; }
/* 本番の行は折り返す: 幅 < 390（20+35+15+300+20）でレモンの下に文が回る（375 で実測 x35 y171 幅320。2026-10-06 本物の幅で読み込み） */
.ix-lemon { flex: 0 0 35px; width: 35px; height: 24.93px; }   /* 73x52 の比 */
.ix-note { flex: 1 1 300px; min-width: 300px; margin-left: 30px; font-size: 12px; line-height: 1.4; }

.ix-list { width: 100%; max-width: 1080px; margin: 0 auto; }
.ix-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); grid-auto-rows: 220px; }
.ix-cell { display: flex; align-items: center; justify-content: center; }
.ix-card { position: relative; display: block; width: 190px; cursor: pointer; }
.ix-card img { width: 190px; height: 190px; object-fit: contain; }   /* 本番も 1:1 の箱に contain */
.ix-ovl {
  position: absolute; left: 10px; top: 10px; width: 170px; height: 170px; display: none;
  align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.8);
  font-size: 13px; line-height: 1.4; color: var(--c-primary); text-align: center; white-space: pre-wrap;
}
.ix-card:hover .ix-ovl { display: flex; }

.ix-grid-sp { display: none; list-style: none; margin: 0 10px 0 20px; padding: 0; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); grid-auto-rows: minmax(120px, auto); }
.ix-cell-sp a { display: block; width: 110px; }   /* 押せるのは絵だけ（本番の当たりは 110x110） */
.ix-cell-sp img { display: block; width: 110px; height: 110px; object-fit: contain; }

@media (max-width: 499.98px) {
  .ix-note { margin-left: 15px; }
  .ix-grid { display: none; }
  .ix-grid-sp { display: grid; }
}