/* =========================================================
   賛助会員一覧（sponsors.php）ページ固有スタイル — 2026-11-01
   土台（ヒーロー・区画・CTA）は members.css、ここはカードと区画の手直しだけ。
   V0 の案 1「名刺カード」（2026-11-01 17:34・v0_20261101_173424.json）の指定値:
     カード 白・枠 1px #d9e2ec・角丸 12px・影なし／ホバーは枠を濃紺に（動かさない）
     モノグラム 72px 角丸 12px 背景 #e3edf7 明朝 太字 32px 濃紺（スマホ 48px）
     会社名 明朝 太字 20px（スマホ 18px）／紹介文 15px #4a5a6c／日付 14px #5f6f80／リンク 15px 太字
     PC 2 列・隙間 20px・内側余白 24px／スマホ 1 列・ボタン高さ 44px
   ========================================================= */

/* ヒーロー: 文を 1 つにして高さを詰める */
.sp-hero{padding:40px 0}
.sp-hero h1{margin:6px 0 12px}
.sp-hero .members-lead{font-size:16px;color:#e3edf7;max-width:640px}

/* 一覧の見出し: 英字小見出しは出さない（ヒーローと重複）・社数は枠なしの文字・免責は見出しの直下 */
.sp-list-head{margin-bottom:22px}
.sp-list-head h2{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;font-size:clamp(22px,2.6vw,30px);letter-spacing:.04em;margin:0 0 10px;color:var(--navy-900)}
.sp-list-head .ad-label{vertical-align:middle}
.sp-total{font-family:"Noto Sans JP","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;font-size:14px;font-weight:700;color:#4a5a6c;letter-spacing:.02em}
.sp-disclaimer{margin:0;font-size:14px;color:#4a5a6c;line-height:1.7}

/* カードの並び */
.sp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
.sp-nowrap{display:inline-block}   /* 「賛助会員10社です。」「確認・編集する」を開く」を途中で折らない（V0 2 回目） */

/* 1 社のカード（V0 2 回目の判定で手直し）
   PC: 左にモノグラム、右に 会社名 → 紹介文 → ご案内（ある社だけ）→ 公式サイト を本文と同じ左端で縦に
   区切り線は無し。モノグラムは濃紺のベタ（薄い水色は白地で見えなかった）。会社名 22px */
.sp-card{display:grid;grid-template-columns:72px minmax(0,1fr);grid-template-areas:"mono name" "mono gyomu" "mono notice" "mono act";column-gap:18px;row-gap:0;align-content:start;background:#fff;border:1px solid #d9e2ec;border-radius:12px;padding:24px;box-shadow:none;transition:border-color .2s}
.sp-card:hover{border-color:#0b2a4a}
.sp-mono{grid-area:mono;width:72px;height:72px;display:grid;place-items:center;border-radius:12px;background:#0b2a4a;color:#fff;font-family:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif;font-weight:700;font-size:32px;line-height:1;letter-spacing:0}
.sp-name{grid-area:name;margin:0;font-family:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif;font-weight:700;font-size:22px;line-height:1.4;color:#0b2a4a;letter-spacing:.02em}
.sp-gyomu{grid-area:gyomu;margin:8px 0 0;font-size:15px;line-height:1.7;color:#4a5a6c;word-break:auto-phrase}
.sp-gyomu.is-empty{color:#5f6f80}
.sp-notice{grid-area:notice;margin:12px 0 0;min-width:0;display:flex;align-items:center;gap:8px;font-size:15px;line-height:1.6}
.sp-notice-tag{flex:0 0 auto;padding:2px 8px;border-radius:4px;background:#e3edf7;color:#0b2a4a;font-size:14px;font-weight:700;line-height:1.5}
.sp-notice-date{flex:0 0 auto;font-size:14px;color:#5f6f80}
.sp-notice a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#0b2a4a;text-decoration:underline;text-underline-offset:3px}
.sp-notice a:hover{color:var(--blue-600)}
.sp-act{grid-area:act;margin:6px 0 0}
.sp-site{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;font-size:15px;font-weight:700;color:#0b2a4a;text-decoration:none;white-space:nowrap}
.sp-site:hover{text-decoration:underline;text-underline-offset:3px}

.sp-cta{padding:56px 0}
.sp-cta .sec-head h2{font-size:26px}

@media (max-width:900px){
  .sp-grid{grid-template-columns:1fr;gap:12px}
  /* スマホ: 1 段目「モノグラム＋会社名」、2 段目から紹介文・ご案内・公式サイトを全幅で */
  .sp-card{padding:20px;grid-template-columns:48px minmax(0,1fr);grid-template-areas:"mono name" "gyomu gyomu" "notice notice" "act act";column-gap:14px;align-items:center}
  .sp-mono{width:48px;height:48px;border-radius:8px;font-size:24px}
  .sp-name{font-size:18px}
  .sp-gyomu{margin-top:12px}
  .sp-notice{flex-wrap:wrap;row-gap:4px}
  .sp-notice a{flex:1 1 100%;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .sp-act{margin-top:12px}
  .sp-site{min-width:132px;justify-content:center;padding:0 16px;border:1px solid #b8c7d8;border-radius:8px}
  .sp-cta{padding:40px 0}
  .sp-hero{padding:32px 0 28px}
}