/* =========================================================
   組合企業紹介（sub.css の後に読む）
   ========================================================= */
:root{--page-hero-img:var(--img-members-hero);}

/* ---------- MEMBERS INFO（数字） ---------- */
/* 左に文章、右に数字。About の MISSION と同じ組み方に揃えてある */
.minfo__inner{display:grid;grid-template-columns:.78fr 1fr;gap:64px;align-items:center;}
.minfo h2{font-size:26px;font-weight:700;line-height:1.6;color:var(--ink);margin:10px 0 18px;}
.minfo .lead{font-size:14px;line-height:2;color:var(--muted);}

.stat-band{display:grid;grid-template-columns:repeat(3,1fr);}
.stat-band li{padding:0 26px;text-align:center;border-left:1px solid var(--line);}
.stat-band li:first-child{border-left:0;}
.stat-band b{display:block;font-family:var(--font-en);font-size:52px;font-weight:800;
             line-height:1;letter-spacing:var(--track-num);color:var(--stat-ink,var(--ac-blue));
             transform:scaleX(var(--cond-x));}
.stat-band b i{font-style:normal;font-family:var(--font-jp);font-size:20px;margin-left:4px;}
.stat-band em{display:block;margin-top:12px;font-style:normal;font-family:var(--font-en);
              font-size:11px;font-weight:700;letter-spacing:var(--track-label);color:var(--muted);}
.stat-band span{display:block;margin-top:6px;font-size:12.5px;font-weight:700;color:var(--ink);}
.stat-band li:nth-child(2){--stat-ink:var(--ac-green);}
.stat-band li:nth-child(3){--stat-ink:var(--ac-cyan);}
/* 3つ全体に対する注記なので、真ん中の列にぶら下がって見えないよう右へ寄せる */
.stat-note{margin-top:26px;text-align:right;font-size:11.5px;color:var(--muted);}

/* ---------- MEMBERS LIST（組合員一覧） ---------- */
/* ロゴは白地に薄い罫線で囲うだけ。外側にもカードを重ねると白が三重になる */
.logo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.logo-tile{display:flex;flex-direction:column;gap:11px;}
.logo-tile__mark{display:grid;place-items:center;min-height:116px;padding:16px;
                 background:#fff;border:1px solid var(--line);border-radius:12px;
                 font-size:12.5px;font-weight:700;line-height:1.6;color:var(--blue-700);
                 text-align:center;transition:.28s;}
.logo-tile:hover .logo-tile__mark{transform:translateY(-3px);box-shadow:var(--shadow-lift);
                                  border-color:var(--blue-300);}
.logo-tile__mark img{max-width:100%;max-height:60px;object-fit:contain;mix-blend-mode:multiply;}
.logo-tile__city{padding-left:2px;font-size:11.5px;color:var(--muted);}

/* ---------- 名称順で探す ---------- */
.kana-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:34px;}
.kana-nav a{padding:7px 16px;border-radius:var(--r-pill);background:#fff;
            border:1px solid var(--line);font-size:12.5px;font-weight:700;color:var(--blue-600);
            transition:.2s;}
.kana-nav a:hover{background:var(--blue-600);border-color:var(--blue-600);color:#fff;}

.name-groups{display:grid;gap:34px;}
.name-group h3{display:flex;align-items:center;gap:12px;margin-bottom:12px;
               font-family:var(--font-en);font-size:15px;font-weight:800;
               letter-spacing:var(--track-label);color:var(--ac-blue);}
.name-group h3::after{content:"";flex:1;height:1px;background:var(--line);}
.name-group ul{display:grid;grid-template-columns:repeat(3,1fr);gap:2px 26px;}
.name-group li{display:flex;align-items:baseline;justify-content:space-between;gap:14px;
               padding:11px 4px;border-bottom:1px solid var(--line);}
.name-group li a{font-size:13.5px;font-weight:700;color:var(--ink);}
.name-group li a:hover{color:var(--blue-600);}
.name-group li span{flex:none;font-size:11.5px;color:var(--muted);}

@media (max-width:1000px){
  .minfo__inner{grid-template-columns:1fr;gap:34px;}
  .stat-band li{padding:0 16px;}
  .stat-band b{font-size:40px;}
  .logo-grid{grid-template-columns:repeat(3,1fr);gap:16px;}
  .logo-tile__mark{min-height:96px;}
  .name-group ul{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
  .minfo h2{font-size:21px;}
  .stat-band li{padding:0 7px;}
  .stat-band b{font-size:30px;}
  .stat-band b i{font-size:14px;}
  .stat-band em{margin-top:9px;font-size:9px;}
  .stat-band span{margin-top:4px;font-size:10.5px;}
  .logo-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .logo-tile__mark{min-height:76px;padding:12px;font-size:11.5px;}
  .name-group ul{grid-template-columns:1fr;}
}
