/* ============================================================
   ヤマハミュージック秋田店｜Trombone & Violin Collection LP
   SITE PUBLIS 安全版 外部CSS（head登録）。単一スコープ .collection-lp / 器ID #collection-root。
   構成: [1]基盤フレーム(旧.akita-collection-lp→.collection-lpへ集約) [2]新ヒーロー/イベント/ビルダー差分 [3]店舗テンプレ対策(末尾)
   更新時: このファイルを上書き＋head参照の ?v= を繰上げ＋「公開ページ反映」。
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800;900&display=swap');

/* ===== [1] 基盤フレーム ===== */
/* 秋田Collection LP v1 — .collection-lp スコープ。更新時はファイル上書き＋head登録の?v=を上げる */

  .collection-lp{
    --ink:#191D1F;          /* 本文：ダークグレー */
    --black:#000000;
    --sub:#8C8C8C;          /* 注釈：ライトグレー */
    --line:#E6E5E9;
    --paper:#FFFFFF;        /* ページ：ホワイト主体 */
    --paper-2:#F6F5F8;      /* 補助サーフェス：ごく薄いグレー */
    --brand:#4B1E78;        /* ヤマハバイオレット（CTA・重要見出し・区切り） */
    --brand-br:#7B47D2;     /* ブライトバイオレット（hover・アクセント） */
    --gold:#7B47D2;         /* 旧goldアクセント→バイオレット系へ集約 */
    --tb:#008AD8;           /* トロンボーン＝ブルー（吹奏楽・情報） */
    --tb-d:#0A6FA8;
    --tb-bg:#E6F3FB;
    --vn:#55A51C;           /* バイオリン＝グリーン（初心者・成長） */
    --vn-d:#3E7A12;
    --vn-bg:#EAF4E0;
    --red:#C5003E;          /* 限定・重要告知（残席など） */
    --orange:#FF7500;       /* 楽しさ・イベント（開催前ステータス） */
    --violet-lt:#D6A4EA;
    --serif:"Noto Sans JP",system-ui,sans-serif;
    --sans:"Noto Sans JP",system-ui,sans-serif;
    --lat:"Noto Sans JP",system-ui,sans-serif;
    --shadow:0 18px 50px -28px rgba(20,20,30,.22);
  }
  .collection-lp *{box-sizing:border-box}
  .collection-lp{margin:0;padding:0}
  .collection-lp{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.8;-webkit-font-smoothing:antialiased;padding-bottom:84px}
  .collection-lp .wrap{max-width:920px;margin:0 auto;padding:0 20px}
  .collection-lp img{max-width:100%;display:block}
  .collection-lp a{color:inherit}


  /* ===== ヘッダー ===== */
  .collection-lp .top{background:var(--paper-2);border-bottom:1px solid var(--line)}
  .collection-lp .top .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 20px}
  .collection-lp .top .store{font-weight:700;letter-spacing:.02em;line-height:1.4}
  .collection-lp .top .store small{display:block;color:var(--sub);font-weight:500;font-size:11px;font-family:var(--lat);letter-spacing:.18em}
  .collection-lp .top .tel{font-size:11px;color:var(--sub);text-align:right;line-height:1.5}
  .collection-lp .top .tel a{font-family:var(--lat);color:var(--ink);font-size:18px;font-weight:600;text-decoration:none;letter-spacing:.04em}

  /* ===== ヒーロー（全面写真＋左スクリム） ===== */
  .collection-lp .hero{position:relative;background:#fff;border-bottom:1px solid var(--line);overflow:hidden}
  .collection-lp .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:80% center;transition:opacity .4s ease}
  .collection-lp .hero-scrim{position:absolute;inset:0;background:linear-gradient(100deg,#fff 0%,#fff 30%,rgba(255,255,255,.85) 46%,rgba(255,255,255,0) 66%)}
  .collection-lp .hero-copy{position:relative;z-index:1;min-height:440px;display:flex;flex-direction:column;justify-content:center;padding:44px 20px}
  .collection-lp .eyebrow{font-family:var(--lat);font-size:14px;letter-spacing:.18em;color:var(--brand-br);margin:0 0 12px;font-weight:500}
  .collection-lp .rule{width:46px;height:1px;background:var(--brand);margin:0 0 18px}
  .collection-lp .hero h1{font-family:var(--serif);font-size:34px;line-height:1.42;margin:0 0 6px;font-weight:800;letter-spacing:.01em;color:var(--black)}
  .collection-lp .tagline{font-family:var(--lat);font-size:16px;color:var(--brand);margin:0 0 16px;letter-spacing:.04em;font-weight:700}
  .collection-lp .hero p.lead-h{margin:0;color:#3f3f46;font-size:14.5px;max-width:26em}
  .collection-lp .heroCta{display:inline-flex;align-items:center;gap:10px;margin-top:24px;align-self:flex-start;background:var(--brand);color:#fff;text-decoration:none;font-weight:700;padding:14px 26px;border-radius:999px;font-size:15px;box-shadow:0 14px 30px -14px rgba(75,30,120,.55);transition:transform .15s,background .15s}
  .collection-lp .heroCta:hover{transform:translateY(-2px);background:var(--brand-br)}
  .collection-lp .heroCta span{font-size:11px;font-weight:500;color:var(--violet-lt,#D6A4EA)}

  .collection-lp .fu{opacity:0;transform:translateY(14px);animation:fu .7s cubic-bezier(.2,.7,.2,1) forwards}
  .collection-lp .fu.d1{animation-delay:.05s}.fu.d2{animation-delay:.14s}.fu.d3{animation-delay:.24s}.fu.d4{animation-delay:.34s}
  @keyframes fu{to{opacity:1;transform:none}}

  /* ===== 楽器選択（上部） ===== */
  .collection-lp .choose{margin:26px 0 0;text-align:center}
  .collection-lp .choose-lab{font-family:var(--serif);font-size:14px;font-weight:700;margin:0 0 10px;color:var(--ink)}
  .collection-lp .choose .tabs{margin-top:0}

  /* ===== 安心バッジ＋手ぶら ===== */
  .collection-lp .badges{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:26px 0 0}
  .collection-lp .badge-i{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:14px 8px;text-align:center}
  .collection-lp .badge-i .ic{font-size:19px;line-height:1}
  .collection-lp .badge-i .ic img{width:36px;height:36px;object-fit:contain;display:block;margin:0 auto}
  .collection-lp .badge-i b{display:block;font-size:14px;margin-top:6px}
  .collection-lp .badge-i small{display:block;color:var(--sub);font-size:11px}

  .collection-lp .handsfree{display:flex;align-items:center;gap:16px;background:var(--paper-2);border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin:12px 0 0}
  .collection-lp .handsfree img{width:120px;height:78px;object-fit:cover;border-radius:10px;flex-shrink:0;transition:opacity .4s ease}
  .collection-lp .handsfree .t b{font-size:14px}
  .collection-lp .handsfree .t p{margin:2px 0 0;font-size:12.5px;color:var(--sub);line-height:1.6}

  .collection-lp .sizecallout{background:var(--vn-bg);border-radius:12px;padding:12px;margin:18px 0 0}
  .collection-lp .sizecallout img{width:100%;border-radius:8px;background:#fff;display:block;margin-bottom:9px}
  .collection-lp .sizecallout .t{font-size:12.5px;color:var(--vn-d);line-height:1.6}
  .collection-lp .sizecallout .t b{color:var(--vn-d)}
  .collection-lp .tbfeature{background:var(--tb-bg);border-radius:12px;padding:12px;margin:18px 0 0}
  .collection-lp .tbfeature img{width:100%;border-radius:8px;background:#fff;display:block;margin-bottom:9px}
  .collection-lp .tbfeature .t{font-size:12.5px;color:var(--tb-d);line-height:1.6}
  .collection-lp .tbfeature .t b{color:var(--tb-d)}

  /* ===== タブ ===== */
  .collection-lp .tabs{display:flex;gap:12px;margin:30px 0 0}
  .collection-lp .tab{flex:1;text-align:center;cursor:pointer;user-select:none;background:var(--paper-2);border:1.5px solid var(--line);border-radius:16px;padding:15px 10px;transition:.18s}
  .collection-lp .tab .tab-ic{width:30px;height:28px;object-fit:contain;display:block;margin:0 auto 6px;opacity:.92}
  .collection-lp .tab .lat{display:block;font-family:var(--lat);font-size:11px;color:var(--sub);letter-spacing:.14em;font-weight:700}
  .collection-lp .tab span{font-family:var(--serif);font-weight:700;font-size:17px}
  .collection-lp .tab .date{display:block;font-size:11px;color:var(--sub);margin-top:3px;font-weight:600;font-family:var(--lat);letter-spacing:.05em}
  .collection-lp .tab[data-ev="tb"].active{border-color:var(--tb);background:var(--tb-bg)}
  .collection-lp .tab[data-ev="tb"].active span{color:var(--tb-d)}
  .collection-lp .tab[data-ev="vn"].active{border-color:var(--vn);background:var(--vn-bg)}
  .collection-lp .tab[data-ev="vn"].active span{color:var(--vn-d)}

  /* ===== イベントカード ===== */
  .collection-lp .card{background:#fff;border:1px solid var(--line);border-radius:20px;margin:20px 0 0;overflow:hidden;box-shadow:var(--shadow)}
  .collection-lp .card.hide{display:none}
  .collection-lp .card .head{position:relative;padding:22px 24px;color:var(--ink);background:#fff;border-bottom:1px solid var(--line)}
  .collection-lp .card[data-ev="tb"] .head{border-top:3px solid var(--tb)}
  .collection-lp .card[data-ev="vn"] .head{border-top:3px solid var(--vn)}
  .collection-lp .card .head .lat{font-family:var(--lat);font-size:12px;letter-spacing:.16em;font-weight:700}
  .collection-lp .card[data-ev="tb"] .head .lat{color:var(--tb-d)}
  .collection-lp .card[data-ev="vn"] .head .lat{color:var(--vn-d)}
  .collection-lp .card .head h2{font-family:var(--serif);margin:2px 0 0;font-size:24px;font-weight:800;color:var(--black)}
  .collection-lp .card .head .when{margin:8px 0 0;font-size:13px;color:var(--sub);font-family:var(--lat);letter-spacing:.03em}
  .collection-lp .status{display:inline-flex;align-items:center;gap:6px;margin-top:12px;border-radius:999px;padding:5px 13px;font-size:12px;font-weight:700;background:var(--paper-2);border:1px solid var(--line);color:var(--ink)}
  .collection-lp .status .dot{width:7px;height:7px;border-radius:50%;background:var(--sub)}
  .collection-lp .status.soon{background:#FFF1E0;border-color:#FFD8A8;color:#9A4A00}
  .collection-lp .status.soon .dot{background:var(--orange,#FF7500);animation:pulse 1.6s infinite}
  .collection-lp .status.live{background:#EAF4E0;border-color:#BFE39A;color:var(--vn-d)}
  .collection-lp .status.live .dot{background:var(--vn);animation:pulse 1.6s infinite}
  .collection-lp .status.done{color:var(--sub)}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(120,120,120,.4)}70%{box-shadow:0 0 0 7px rgba(120,120,120,0)}100%{box-shadow:0 0 0 0 rgba(120,120,120,0)}}

  .collection-lp .card .body{padding:0 0 26px}
  .collection-lp .card .photo{width:100%;height:200px;object-fit:cover;object-position:center 42%}
  .collection-lp .card .photo-ph{width:100%;height:200px;background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--sub);font-size:12.5px;border-bottom:1px solid var(--line)}
  .collection-lp .card .inner{padding:20px 24px 0}
  .collection-lp .lead{font-size:14.5px;color:#3a3a3f;margin:0 0 18px}
  .collection-lp .meta{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 8px}
  .collection-lp .meta th{text-align:left;width:92px;color:var(--sub);font-weight:500;padding:9px 0;vertical-align:top;font-size:13px}
  .collection-lp .meta td{padding:9px 0;border-bottom:1px solid var(--line)}
  .collection-lp .meta tr:last-child td, .collection-lp .meta tr:last-child th{border-bottom:0}
  .collection-lp .ph{background:#fff4d2;color:#7a5b00;border-radius:4px;padding:0 6px;font-size:12px;font-weight:700}

  /* ラインナップ */
  .collection-lp .lineup{margin:20px 0 0}
  .collection-lp .lineup .lab{font-size:13px;font-weight:700;margin:0 0 10px}
  .collection-lp .lineup .row{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x mandatory}
  .collection-lp .lineup .row::-webkit-scrollbar{height:5px}
  .collection-lp .lineup .row::-webkit-scrollbar-thumb{background:var(--line);border-radius:9px}
  .collection-lp .mc{width:110px;flex-shrink:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;scroll-snap-align:start}
  .collection-lp .mc .img{position:relative;height:92px;background:#fff;display:flex;align-items:center;justify-content:center;color:#c4c2cc;border-bottom:1px solid var(--line);padding:6px}
  .collection-lp .mc .img img{max-width:100%;max-height:100%;object-fit:contain}
  .collection-lp .mc .tag{position:absolute;top:5px;left:5px;background:var(--brand);color:#fff;font-size:10px;padding:1px 7px;border-radius:999px}
  .collection-lp .mc .txt{padding:7px 9px}
  .collection-lp .mc .txt b{font-size:12px;display:block}
  .collection-lp .mc .txt small{font-size:11px;color:var(--sub)}
  .collection-lp .lineup .hint{font-size:11px;color:var(--sub);margin:8px 0 0}

  .collection-lp .cta-block{margin-top:22px;text-align:center}
  .collection-lp .seats{font-size:12px;color:var(--sub);margin:0 0 10px}
  .collection-lp .seats b{color:var(--red)}
  .collection-lp .cta{display:block;text-decoration:none;color:#fff;font-weight:800;border-radius:14px;padding:17px;font-size:17px;background:var(--brand);box-shadow:0 14px 32px -16px rgba(75,30,120,.6);transition:transform .15s,background .15s}
  .collection-lp .cta:hover{transform:translateY(-2px);background:var(--brand-br)}
  .collection-lp .cta small{display:block;font-weight:500;font-size:12px;opacity:.92;margin-top:3px}
  .collection-lp .cta-sub{margin:12px 0 0;font-size:13px;color:var(--sub)}
  .collection-lp .cta-sub a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line);font-family:var(--lat);font-size:15px;font-weight:600}

  /* ===== セクション ===== */
  .collection-lp .sec{margin:34px 0 0}
  .collection-lp .sec-h{font-family:var(--serif);font-size:19px;font-weight:700;margin:0 0 16px;display:flex;align-items:baseline;gap:10px;color:var(--black)}
  .collection-lp .sec-h .lat{font-family:var(--lat);font-size:12px;color:var(--brand-br);letter-spacing:.12em;font-weight:700}
  .collection-lp .who-banner{width:100%;height:200px;object-fit:cover;object-position:center 30%;border-radius:16px;margin:0 0 14px;box-shadow:var(--shadow);transition:opacity .4s ease}
  .collection-lp .who{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .collection-lp .who div{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;padding:13px 15px;font-size:13.5px;display:flex;gap:9px;align-items:flex-start}
  .collection-lp .who div::before{content:"♪";color:var(--brand-br);font-weight:700;line-height:1.6}

  .collection-lp .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;counter-reset:s}
  .collection-lp .step{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:16px 14px;text-align:center;position:relative}
  .collection-lp .step::before{counter-increment:s;content:counter(s);position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:26px;height:26px;border-radius:50%;background:var(--brand);color:#fff;font-family:var(--lat);font-weight:600;display:grid;place-items:center;font-size:14px}
  .collection-lp .step .step-ic{width:38px;height:38px;object-fit:contain;display:block;margin:4px auto 0}
  .collection-lp .step b{display:block;font-size:14px;margin-top:6px}
  .collection-lp .step small{display:block;color:var(--sub);font-size:12px;margin-top:4px}

  .collection-lp details{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;margin:0 0 10px;overflow:hidden}
  .collection-lp details summary{cursor:pointer;list-style:none;padding:14px 18px;font-weight:700;font-size:14px;display:flex;justify-content:space-between;align-items:center}
  .collection-lp details summary::-webkit-details-marker{display:none}
  .collection-lp details summary::after{content:"＋";color:var(--brand);font-weight:700}
  .collection-lp details[open] summary::after{content:"−"}
  .collection-lp details .ans{padding:0 18px 16px;font-size:13.5px;color:#3a3a3f}

  .collection-lp .endnote{background:var(--paper-2);border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:8px;padding:16px 20px;margin:20px 0 0;font-size:13.5px;color:#55555c}
  .collection-lp .endnote.hide{display:none}
  .collection-lp .endnote b{color:var(--black)}

  .collection-lp .access{background:var(--paper-2);border:1px solid var(--line);border-radius:20px;margin:34px 0 0;padding:22px 24px;font-size:14px}
  .collection-lp .access h3{font-family:var(--serif);margin:0 0 14px;font-size:17px}
  .collection-lp .access dl{margin:0;display:grid;grid-template-columns:72px 1fr;gap:8px 12px;font-size:13.5px}
  .collection-lp .access dt{color:var(--sub)}.access dd{margin:0}
  .collection-lp .access .map-cta{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:13px;text-decoration:none;color:var(--brand);border:1px solid var(--brand);border-radius:999px;padding:8px 18px;font-weight:700}
  .collection-lp .access .map-cta img{width:15px;height:15px;object-fit:contain}
  .collection-lp footer{color:var(--sub);font-size:12px;text-align:center;padding:30px 20px 50px;line-height:1.8}

  /* ===== 追従CTA ===== */
  .collection-lp .sticky{position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-top:1px solid var(--line);box-shadow:0 -8px 30px -18px rgba(20,20,30,.4);padding:10px 16px calc(10px + env(safe-area-inset-bottom));transform:translateY(120%);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
  .collection-lp .sticky.show{transform:none}
  .collection-lp .sticky .inner{max-width:920px;margin:0 auto;display:flex;align-items:center;gap:12px}
  .collection-lp .sticky .txt{flex:1;min-width:0;line-height:1.35}
  .collection-lp .sticky .txt b{display:block;font-size:14px;font-family:var(--serif)}
  .collection-lp .sticky .txt small{color:var(--sub);font-size:11px}
  .collection-lp .sticky .sbtn{flex-shrink:0;text-decoration:none;color:#fff;font-weight:800;border-radius:999px;padding:13px 22px;font-size:15px;white-space:nowrap;background:var(--brand)}
  .collection-lp .sticky.tb .sbtn, .collection-lp .sticky.vn .sbtn, .collection-lp .sticky.ended .sbtn{background:var(--brand)}

  @media(max-width:640px){
    .collection-lp .hero-copy{min-height:390px;padding:30px 20px}
    .collection-lp .hero-scrim{background:linear-gradient(100deg,#fff 0%,#fff 24%,rgba(255,255,255,.9) 44%,rgba(255,255,255,.25) 74%,rgba(255,255,255,0) 100%)}
    .collection-lp .hero-img{object-position:74% center}
    .collection-lp .hero h1{font-size:26px}
    .collection-lp .who{grid-template-columns:1fr}
    .collection-lp .steps{grid-template-columns:1fr;gap:18px}
    .collection-lp .meta th{width:74px}
    .collection-lp .sticky .sbtn{padding:12px 18px;font-size:14px}
  }

/* ===== [2] 新ヒーロー / イベント / 申込ビルダー 差分 ===== */
.collection-lp .nh{position:relative;background:#fff;overflow:hidden;border-bottom:1px solid #E6E5E9}
.collection-lp .nh-orb{position:absolute;left:-180px;bottom:-220px;width:560px;height:560px;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,rgba(123,71,210,.10),rgba(123,71,210,.04) 45%,rgba(255,255,255,0) 70%)}
.collection-lp .nh-wrap{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;max-width:1080px;margin:0 auto;padding:0 24px;min-height:460px;align-items:center}
.collection-lp .nh-copy{display:flex;flex-direction:column;justify-content:center;padding-right:16px}
.collection-lp .nh-eyebrow{font-size:13px;letter-spacing:.22em;color:#7B47D2;font-weight:600;margin:0 0 14px}
.collection-lp .nh-rule{width:46px;height:2px;background:#4B1E78;margin:0 0 20px}
.collection-lp .nh-h1{font-family:"Noto Sans JP","Yu Gothic",sans-serif;font-size:34px;line-height:1.42;font-weight:800;color:#111;margin:0 0 14px}
.collection-lp .nh-tag{font-size:17px;color:#4B1E78;font-weight:700;margin:0 0 14px}
.collection-lp .nh-lead{font-size:14px;color:#3f3f46;line-height:1.9;max-width:24em;margin:0 0 24px}
.collection-lp .nh-cta{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;background:#4B1E78;color:#fff;text-decoration:none;font-weight:700;padding:14px 28px;border-radius:999px;font-size:15px;box-shadow:0 16px 34px -16px rgba(75,30,120,.6)}
.collection-lp .nh-cta span{font-size:11px;color:#D6A4EA}
.collection-lp .nh-chips{display:flex;gap:8px;margin-top:16px}
.collection-lp .nh-chip{font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:999px}
.collection-lp .nh-chip.tb{color:#008AD8;background:#E6F3FB}
.collection-lp .nh-chip.vn{color:#55A51C;background:#EAF4E0}
.collection-lp .nh-visual{position:relative;height:100%}
.collection-lp .nh-inst{position:absolute;filter:drop-shadow(0 22px 30px rgba(20,20,40,.20))}
.collection-lp .nh-inst.tb{width:min(98%,700px);right:-30px;top:66px;transform:rotate(-6deg)}
.collection-lp .nh-inst.vn{width:120px;right:48px;bottom:18px;transform:rotate(5deg)}
@media(max-width:820px){
.collection-lp .nh-wrap{grid-template-columns:1fr;min-height:auto;padding:24px}
.collection-lp .nh-visual{height:280px;margin-top:6px}
.collection-lp .nh-inst.tb{top:24px}
.collection-lp .nh-h1{font-size:26px}
}
.collection-lp .evbox{margin:18px 0 0;background:#F6F5F8;border:1px solid #E6E5E9;border-radius:14px;padding:16px}
.collection-lp .evbox-h{font-size:14px;font-weight:800;margin:0 0 12px;color:#191D1F;display:flex;align-items:center;gap:8px}
.collection-lp .evbox-h::before{content:"";width:6px;height:16px;background:#4B1E78;border-radius:3px}
.collection-lp .evcard{background:#fff;border:1px solid #E6E5E9;border-radius:12px;padding:14px 16px;margin-bottom:10px}
.collection-lp .evcard:last-child{margin-bottom:0}
.collection-lp .evc-when{font-size:12px;font-weight:700;color:#4B1E78;letter-spacing:.02em}
.collection-lp .evc-t{display:block;font-size:16px;margin:3px 0 6px;font-weight:800}
.collection-lp .evc-d{font-size:12.5px;color:#3f3f46;line-height:1.75;margin:0 0 12px}
.collection-lp .evc-cta{display:inline-flex;align-items:center;gap:6px;background:#4B1E78;color:#fff;text-decoration:none;font-weight:700;font-size:13px;padding:10px 18px;border-radius:999px}
.collection-lp .evc-cta small{font-weight:500;opacity:.8;font-size:10.5px}
.collection-lp .pricelist{list-style:none;padding:0;margin:0 0 8px}
.collection-lp .pricelist li{font-size:12.5px;color:#191D1F;padding:6px 0;border-bottom:1px dashed #E6E5E9;line-height:1.7}
.collection-lp .pricelist li b{display:inline-block;min-width:6.5em;color:#4B1E78}
.collection-lp .nh-cta{color:#fff}
.collection-lp .nh-cta span{color:#D6A4EA}
.collection-lp .evc-cta{color:#fff}
.collection-lp .evc-cta small{color:#fff}
.collection-lp .evc-koshi{display:flex;gap:14px;margin:2px 0 12px}
.collection-lp .evc-koshi figure{margin:0;text-align:center;width:84px}
.collection-lp .evc-koshi img{width:84px;height:84px;object-fit:cover;object-position:50% 20%;border-radius:10px;border:1px solid #E6E5E9;background:#fff}
.collection-lp .evc-koshi figcaption{font-size:11px;font-weight:700;margin-top:5px;color:#191D1F;line-height:1.35}
.collection-lp .evc-koshi figcaption small{display:block;font-weight:500;color:#8C8C8C;font-size:10px}
.collection-lp .evc-d b{color:#4B1E78;font-weight:700}
.collection-lp .evc-d br + b{display:inline-block;min-width:5.2em}
.collection-lp .tab:hover{border-color:#7B47D2;background:#F2ECFA;transform:translateY(-1px)}
.collection-lp .tab{box-shadow:0 2px 0 rgba(75,30,120,.04)}
.collection-lp .builder{margin-top:14px;background:#fff;border:1px solid #E6E5E9;border-radius:14px;padding:16px}
.collection-lp .bld-h{font-size:14px;font-weight:800;margin:0 0 12px;color:#191D1F;display:flex;align-items:center;gap:8px}
.collection-lp .bld-h::before{content:"";width:6px;height:16px;background:#4B1E78;border-radius:3px}
.collection-lp .bq{margin:0 0 14px}
.collection-lp .bq-l{font-size:12.5px;font-weight:700;color:#4B1E78;margin:0 0 8px}
.collection-lp .bq-opts{display:flex;flex-direction:column;gap:8px}
.collection-lp .bq-opts.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.collection-lp .bq-opts label{font-size:12.5px;color:#191D1F;display:flex;align-items:center;gap:8px;cursor:pointer;background:#F6F5F8;border:1px solid #E6E5E9;border-radius:9px;padding:9px 11px;transition:.15s}
.collection-lp .bq-opts label:hover{border-color:#7B47D2;background:#F2ECFA}
.collection-lp .bq-opts input{accent-color:#4B1E78;width:15px;height:15px;flex:none}
.collection-lp .builder .bld-cta{display:block;text-align:center;margin-top:6px}
.collection-lp .builder .cta-sub{text-align:center;margin-top:12px}
.collection-lp .bld-preview{font-size:11.5px;color:#8C8C8C;margin:0 0 10px;min-height:1.3em;line-height:1.5}
.collection-lp .bld-preview b{color:#4B1E78;font-weight:700}

/* ============================================================
   [3] ★店舗テンプレ対策（札幌 gakufu.css 末尾を手本に collection 用へ読み替え）
   SITE PUBLIS 店舗ページ＝左サイドバー必須＝メインカラム約740px固定。
   画面幅@mediaは「画面は広いがカラムは740px」で発動しないため、#collection-root + !important で常時上書きする。
   ============================================================ */

/* ===== 【css-tabs】タブ切替の純CSS化（JSイベント非依存・最重要） =====
   店舗テンプレJSがタップ(click/pointer/touch)の伝播を上流で握り潰すため、JSタブは本番で全滅する。
   隠しradio(#col-tb/#col-vn)＋label.tab＋:checked だけで トロンボーン(Wind)/バイオリン(Strings) を切替える。
   radioは .collection-lp 直下・header/hero/main より前に配置＝兄弟結合子(~)でタブ・カード全部に届く。
   JSから初期選択したい時は radio.checked=true（イベント伝播と無関係に効く）。 */
.collection-lp .col-radio{position:absolute;width:1px;height:1px;margin:0;padding:0;border:0;opacity:0;clip:rect(0 0 0 0);overflow:hidden}
/* アクティブタブ配色（tb=ブルー／vn=グリーン。旧 .tab.active を :checked へ移植） */
.collection-lp #col-tb:checked~main .tab[data-ev="tb"]{border-color:var(--tb);background:var(--tb-bg)}
.collection-lp #col-tb:checked~main .tab[data-ev="tb"] span{color:var(--tb-d)}
.collection-lp #col-vn:checked~main .tab[data-ev="vn"]{border-color:var(--vn);background:var(--vn-bg)}
.collection-lp #col-vn:checked~main .tab[data-ev="vn"] span{color:var(--vn-d)}
/* カード出し分け：どちらも未選択＝両カード表示、選択で片方に絞る */
.collection-lp #col-tb:checked~main #card-vn{display:none}
.collection-lp #col-vn:checked~main #card-tb{display:none}
/* キーボード操作（radioネイティブ：Tab到達＋矢印切替）のフォーカスを可視化 */
.collection-lp #col-tb:focus-visible~main .tab[data-ev="tb"],
.collection-lp #col-vn:focus-visible~main .tab[data-ev="vn"]{outline:2px solid var(--brand);outline-offset:2px}

/* ===== 新ヒーロー(nh)を常時1カラム縦積み（カラム740px前提・@media画面幅非依存で常時適用） ===== */
#collection-root .nh-wrap{grid-template-columns:1fr !important;min-height:auto !important;padding:24px !important}
#collection-root .nh-visual{height:300px !important;margin-top:8px !important}
#collection-root .nh-inst.tb{top:24px !important}
#collection-root .nh-h1{font-size:26px !important}

/* ===== 画像巨大化対策：CMSテンプレの高詳細度 img幅指定に #collection-root + !important で勝つ =====
   KVのtb_cut/vn_cut、講師写真koshi_*、各セクション画像・アイコンを実寸で固定する。 */
#collection-root .nh-inst.tb{width:min(98%,680px) !important}
#collection-root .nh-inst.vn{width:120px !important;max-width:120px !important}
#collection-root .tab .tab-ic{width:30px !important;height:28px !important;max-width:30px !important}
#collection-root .card .photo{width:100% !important;height:200px !important}
#collection-root .tbfeature img,#collection-root .sizecallout img{width:100% !important}
#collection-root .evc-koshi img{width:84px !important;height:84px !important;max-width:84px !important}
#collection-root .badge-i .ic img{width:36px !important;height:36px !important;max-width:36px !important}
#collection-root .handsfree img{width:120px !important;height:78px !important;max-width:120px !important}
#collection-root .who-banner{width:100% !important;height:200px !important}
#collection-root .step .step-ic{width:38px !important;height:38px !important;max-width:38px !important}
#collection-root .access .map-cta img{width:15px !important;height:15px !important;max-width:15px !important}

/* ===== タブのタップ確保（appearance解除・最前面・pointer-events再有効化） ===== */
#collection-root .tab{-webkit-appearance:none;appearance:none;font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;display:block}
#collection-root .choose,#collection-root .tabs,#collection-root .tab{position:relative;z-index:30}
/* 店舗テンプレがラッパー/bodyで pointer-events:none を掛ける疑いへ、子孫側で auto を明示して勝たせる */
#collection-root,#collection-root *{pointer-events:auto !important}
/* ★タブ内の楽器アイコン(img)はタップ透過にする（札幌タブ＝文字のみでlabel直タップ＝動作実績あり。
   秋田はlabel内にimgがあり、店舗テンプレJSがimgへのタップを握り潰すとlabelのネイティブ発火が死ぬ。
   pointer-events:noneでタップを必ずlabel本体に落とす＝札幌とヒット判定を同一化。
   ※上の pointer-events:auto !important より詳細度が高い(1,2,0)ので必ず勝つ。 */
#collection-root .tab .tab-ic,.collection-lp .tab .tab-ic{pointer-events:none !important;-webkit-user-drag:none;user-select:none}
/* labelの全面をタップ面に（子要素の隙間でも反応） */
#collection-root .tab,.collection-lp .tab{-webkit-tap-highlight-color:rgba(75,30,120,.12)}

/* ===== CMSテンプレのリンク色(青)に勝つ：CTA/ボタンの文字は白で固定 ===== */
#collection-root .nh-cta,#collection-root .evc-cta,#collection-root .cta,#collection-root .bld-cta{color:#fff !important}
#collection-root .nh-cta span{color:var(--violet-lt) !important}
#collection-root .cta small,#collection-root .evc-cta small{color:#fff !important}
