/* 授業・学習への活用ガイド（learn/teach/）だけで使う部品 */
.t-stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.t-stats li{display:flex;align-items:baseline;gap:8px;padding:8px 16px;border:1px solid var(--line);border-radius:99px;background:var(--card);font-size:13px;font-weight:700}
.t-stats b{font:400 28px/1 var(--disp);color:var(--hot)}

.t-page h3{scroll-margin-top:124px}
.t-page h4{font-size:15.5px;font-weight:900;margin:22px 0 8px}
.t-page .tip,.t-page .note{margin-top:14px}
.t-sup{font-size:.68em;line-height:0;margin-left:1px;white-space:nowrap}
.t-sup a{text-decoration:none!important;font-weight:700;padding:0 1px}
.t-more a{font-weight:700}
.t-scroll{margin:6px 0 14px}
.t-table{width:100%;border-collapse:collapse;font-size:14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.t-table th,.t-table td{padding:11px 13px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;line-height:1.65}
.t-table thead th{background:var(--card2);font-size:12.5px;color:var(--tx2);white-space:nowrap}
.t-table tbody th{white-space:nowrap;font-weight:900}
.t-table tbody th small{display:block;font-weight:700;color:var(--gold);font-size:11.5px}
.t-table tr:last-child>*{border-bottom:0}
.t-rub tbody th{background:var(--card2)}
kbd{display:inline-block;min-width:1.7em;padding:1px 7px;border:1px solid var(--line);border-bottom-width:3px;border-radius:6px;background:var(--card);font:700 12.5px/1.6 ui-monospace,Consolas,monospace;text-align:center;color:var(--tx)}
.t-page code{background:var(--card2);padding:1px 6px;border-radius:5px;font-size:.92em}

/* クイックスタート */
.t-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;counter-reset:q;margin:18px 0 22px}
.t-quick li{counter-increment:q;position:relative;padding:44px 20px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);display:flex;flex-direction:column;gap:8px;font-size:14px}
.t-quick li::before{content:"STEP " counter(q);position:absolute;top:14px;left:20px;font:400 20px/1 var(--disp);letter-spacing:.12em;color:var(--hot)}
.t-quick li b{font-size:17px;background:none!important}
.t-quick li span{color:var(--tx2);flex:1}
.t-quick li>a{font-weight:700;font-size:13px}
.t-quick li>a::after{content:" →"}

/* 理由・カードの並び */
.t-why{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:12px 0 14px}
.t-why.t3{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.t-why>div{padding:18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.t-why>div>b{font:400 30px/1 var(--disp);color:var(--gold);background:none!important}
.t-why h3{font-size:15.5px!important;margin:4px 0 6px!important;line-height:1.45}
.t-why p{font-size:13.5px;color:var(--tx2);line-height:1.75;margin:0}

/* ねらい別レシピ */
.t-aimnav,.t-actnav{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.t-aimnav button,.t-actnav button{padding:8px 15px;border:1px solid var(--line);border-radius:99px;background:var(--card);font-size:13px;font-weight:700}
.t-aimnav button:hover,.t-actnav button:hover{border-color:var(--gold)}
.t-aimnav button[aria-pressed=true],.t-actnav button[aria-pressed=true]{background:var(--tx);color:#fff;border-color:var(--tx)}
.t-aims{display:grid;gap:16px}
.t-aim{border:1px solid var(--line);border-radius:16px;background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--sun) 16%,transparent) 0 80px,transparent 81px),var(--card);padding:22px clamp(16px,3vw,28px)}
.t-aim:nth-child(2){border-top-color:var(--cy)}.t-aim:nth-child(3){border-top-color:var(--hot)}.t-aim:nth-child(4){border-top-color:#2bb673}.t-aim:nth-child(5){border-top-color:#7a5cff}.t-aim:nth-child(6){border-top-color:var(--gold)}
.t-aim header small{font:400 14px/1 var(--disp);letter-spacing:.2em;color:var(--mut)}
.t-aim header h3{font-size:21px!important;margin:4px 0 12px!important}
.t-aim-d{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.t-aim-d dt{font-size:12px;font-weight:900;color:var(--gold);margin-bottom:2px}
.t-aim-d dd{margin:0;font-size:13.5px;color:var(--tx2);line-height:1.7}
.t-rec{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.t-rec>div{background:var(--bg2);border-radius:10px;padding:14px 16px}
.t-rec .t-rec-t{font:400 26px/1 var(--disp);color:var(--hot);margin:0!important}
.t-rec h4{margin:4px 0 6px!important;font-size:15px!important}
.t-rec p{font-size:13.5px;line-height:1.75;color:var(--tx2);margin:0}
.t-aim-s{font-size:12px;font-weight:900;color:var(--mut);margin:16px 0 6px!important}

/* 曲のチップ */
.t-sc{display:flex;flex-wrap:wrap;gap:6px}
.prose .t-sc a{display:block;padding:6px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);text-decoration:none;color:var(--tx);line-height:1.35}
.prose .t-sc a:hover{border-color:var(--gold)}
.t-sc b{display:block;font-size:13.5px;background:none!important}
.t-sc small{display:block;font-size:11px;color:var(--mut)}

/* 時間配分のバー */
.t-bar{display:flex;gap:3px;margin:8px 0 18px;border-radius:10px;overflow:hidden}
.t-bar span{min-width:0;padding:10px 8px;background:var(--sun2);display:flex;flex-direction:column;justify-content:center;line-height:1.3}
.t-bar span.b{background:#bfe6f6}.t-bar span.c{background:#ffd3de}.t-bar span.d{background:#cfeedd}
.t-bar b{font-size:12.5px;background:none!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.t-bar small{font:400 15px/1 var(--disp);color:var(--tx2)}

/* 5分メニュー・年間カレンダー */
.t-menu{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;counter-reset:m;margin:10px 0 8px}
.t-menu li{counter-increment:m;padding:12px 14px 12px 44px!important;margin:0!important;position:relative;border:1px solid var(--line);border-radius:10px;background:var(--card);font-size:12.5px;color:var(--tx2);line-height:1.5}
.t-menu li::before{content:counter(m)!important;position:absolute;left:12px!important;top:12px!important;width:auto!important;height:auto!important;background:none!important;border-radius:0!important;font:400 24px/1 var(--disp);color:var(--hot)}
.t-menu b{display:block;font-size:14px;color:var(--tx);background:none!important}
.t-cal{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:10px 0}
.prose .t-cal a{display:flex;flex-direction:column;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--card);text-decoration:none;color:var(--tx);line-height:1.4}
.prose .t-cal a:hover{border-color:var(--gold)}
.t-cal b{font:400 28px/1 var(--disp);color:var(--gold);background:none!important}
.t-cal small{font-size:11.5px;color:var(--mut);margin-bottom:6px}
.t-cal span{font-weight:900;font-size:14px}
.t-cal em{font-style:normal;font-size:11.5px;color:var(--mut);margin-top:2px}

/* 学習指導案 */
.lp-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:16px 0 24px}
.prose .lp-nav a{display:flex;flex-direction:column;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--card);text-decoration:none;color:var(--tx);line-height:1.4}
.prose .lp-nav a:hover{border-color:var(--gold)}
.lp-nav b{font:400 30px/1 var(--disp);color:var(--hot);background:none!important}
.lp-nav span{font-size:12.5px;font-weight:900}
.lp-nav small{font-size:11.5px;color:var(--mut)}
.lp{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:clamp(18px,3vw,30px);margin:0 0 22px;scroll-margin-top:124px;box-shadow:0 10px 30px rgba(60,45,20,.05)}
.lp-h{border-bottom:2px solid var(--tx);padding-bottom:12px;margin-bottom:16px}
.lp-l{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 4px!important}
.lp-l b{background:var(--hot)!important;color:#fff!important;padding:3px 11px;border-radius:6px;font-size:13px}
.lp-l span{font-size:13px;font-weight:700;color:var(--tx2)}
.lp-h h3{font-size:clamp(18px,2.2vw,22px)!important;margin:0!important;line-height:1.45}
.lp-meta{display:grid;gap:0;margin:0 0 14px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.lp-meta>div{display:grid;grid-template-columns:120px 1fr;border-bottom:1px solid var(--line)}
.lp-meta>div:last-child{border-bottom:0}
.lp-meta dt{background:var(--card2);padding:10px 12px;font-size:12.5px;font-weight:900}
.lp-meta dd{margin:0;padding:10px 14px;font-size:14px;line-height:1.7}
.lp-crit{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.lp-crit>div{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--bg)}
.lp-crit b{display:block;font-size:12.5px;color:var(--gold);background:none!important;margin-bottom:4px}
.lp-crit p{font-size:13.5px;line-height:1.7;margin:0}
.lp-flow{width:100%;min-width:720px;border-collapse:collapse;font-size:13.5px}
.lp-flow th,.lp-flow td{border:1px solid var(--line);padding:10px 12px;vertical-align:top;text-align:left;line-height:1.7}
.lp-flow thead th{background:var(--tx);color:#fff;font-size:12.5px;white-space:nowrap}
.lp-flow tbody th{white-space:nowrap;background:var(--card2);font-size:13px}
.lp-flow tbody th small{display:block;color:var(--hot);font-size:11.5px}
.lp-flow td:nth-child(2){width:36%}.lp-flow td:nth-child(3){width:38%}
.lp-flow td:last-child{font-size:12.5px;color:var(--tx2)}
.lp-board{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:3px;background:#2d5a3d;padding:10px;border-radius:10px;color:#f4f4ea;font-size:13.5px;line-height:1.8}
.lp-board>div{padding:12px 14px;border:1px dashed rgba(255,255,255,.3);border-radius:6px}
.lp-board small{display:block;font-size:10.5px;opacity:.7}
.lp-board b{background:none!important;color:#ffe08a!important;font-size:15px}
.lp-note{position:relative;margin-top:22px!important;font-size:14px;padding:16px 16px 12px;background:color-mix(in srgb,var(--sun) 9%,var(--card));border:1px solid var(--line);border-radius:12px}.lp-note::before{content:"";position:absolute;top:-9px;left:18px;width:76px;height:18px;border-radius:2px;background:color-mix(in srgb,var(--sun) 60%,transparent);transform:rotate(2deg);box-shadow:0 1px 2px rgba(60,45,20,.12)}
.lp-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;padding-top:14px;border-top:1px dashed var(--line)}
.lp-btns .btn svg{font-size:15px}

/* 活動アイデア */
.t-acts{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.t-act{padding:18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);display:flex;flex-direction:column}
.t-act[hidden]{display:none}
.t-act-n{font:400 30px/1 var(--disp);color:var(--hot);margin:0!important}
.t-act h3{font-size:16px!important;margin:2px 0 6px!important;line-height:1.4}
.t-act-m{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin:0 0 8px!important}
.t-act-m span{font-size:11.5px;font-weight:900;color:var(--gold);margin-right:4px}
.t-act-m em{font-style:normal;font-size:10.5px;font-weight:700;padding:1px 8px;border-radius:99px;background:var(--card2);color:var(--tx2)}
.t-act-p{font-size:12.5px;color:var(--tx2);margin:0 0 6px!important;line-height:1.6}
.t-act-p b{background:none!important;font-size:11px;padding:1px 6px;border:1px solid var(--line);border-radius:4px;margin-right:6px}
.t-act ol{counter-reset:s;margin:0 0 8px}
.t-act ol li{counter-increment:s;position:relative;padding-left:22px!important;margin:4px 0!important;font-size:13px;line-height:1.6}
.t-act ol li::before{content:counter(s)!important;position:absolute;left:0!important;top:1px!important;width:16px!important;height:16px!important;border-radius:50%!important;background:var(--tx)!important;color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center;line-height:1}
.t-act-tip{margin-top:auto!important;font-size:12.5px;color:var(--tx2);background:var(--bg2);padding:9px 11px;border-radius:8px;line-height:1.65}
.t-aim[hidden]{display:none}

/* 曲えらびの7チェック・研究のルール */
.t-check7,.t-rules{counter-reset:c;display:grid;gap:8px;margin:12px 0 18px}
.t-check7 li,.t-rules li{counter-increment:c;position:relative;padding:14px 16px 14px 58px!important;margin:0!important;border:1px solid var(--line);border-radius:12px;background:var(--card);font-size:14px;line-height:1.7}
.t-check7 li::before,.t-rules li::before{content:counter(c)!important;position:absolute;left:16px!important;top:12px!important;width:30px!important;height:30px!important;border-radius:50%!important;background:var(--sun)!important;color:#111;display:grid;place-items:center;font:400 19px/1 var(--disp);padding-top:2px}
.t-check7 b{display:block;font-size:15px}
.t-check7 span{color:var(--tx2);font-size:13.5px}

/* チェックリスト */
.t-chk{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px;border:2px solid var(--tx);border-radius:16px;background:var(--card)}
.t-chk h4{margin:0 0 8px!important;font-size:14px!important}
.t-chk label{display:flex;gap:10px;align-items:flex-start;padding:8px 4px;border-bottom:1px dashed var(--line);font-size:14px;cursor:pointer;line-height:1.5}
.t-chk input{width:18px;height:18px;margin-top:2px;accent-color:var(--hot);flex:none}
.t-chk label:has(input:checked){color:var(--mut);text-decoration:line-through}
.t-chk-f{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;margin:0!important}
.t-chk-f span{font:400 24px/1 var(--disp);color:var(--hot)}

/* プレイリスト見本 */
.t-pl{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-top:12px}
.t-pl>div{padding:18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);display:flex;flex-direction:column;gap:8px}
.t-pl h4{margin:0!important}
.t-pl p{font-size:13px;color:var(--tx2);margin:0!important}
.t-pl .t-sc{flex:1;align-content:flex-start}
.t-pl .btn{align-self:flex-start;margin-top:6px;text-decoration:none!important;color:#111!important}

/* 研究 */
.t-res{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin:10px 0 22px}
.t-res>div{padding:18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);font-size:13.5px;line-height:1.75}
.t-res-h::before{content:"+";display:inline-grid;place-items:center;width:20px;height:20px;margin-right:8px;border-radius:50%;background:var(--cy);color:#fff;font:400 16px/1 var(--disp);vertical-align:2px}
.t-res>div.minus{background:color-mix(in srgb,var(--hot) 4%,var(--card))}.minus .t-res-h::before{content:"−";background:var(--hot)}
.t-res p{margin:0 0 8px!important}
.t-res-h{font-weight:900;font-size:14.5px;color:var(--tx)}
.t-res-k{font-size:12.5px;color:var(--tx2);background:var(--bg2);padding:8px 10px;border-radius:8px;margin:0!important}
.t-refs{counter-reset:r;font-size:12.5px;line-height:1.7}
.t-refs li{counter-increment:r;position:relative;padding-left:34px!important;margin:6px 0!important;color:var(--tx2);scroll-margin-top:130px;word-break:break-word}
.t-refs li::before{content:"[" counter(r) "]"!important;position:absolute;left:0!important;top:0!important;width:auto!important;height:auto!important;background:none!important;border-radius:0!important;font-weight:700;color:var(--gold)}
.t-refs li:target{background:rgba(245,184,46,.18);border-radius:6px}

@media(max-width:860px){
  .t-quick,.t-aim-d,.t-rec,.lp-crit{grid-template-columns:1fr}
  .lp-nav{grid-template-columns:repeat(2,1fr)}
  .lp-board{grid-template-columns:1fr}
  .t-chk{grid-template-columns:1fr}
}
@media(max-width:600px){
  .lp-meta>div{grid-template-columns:1fr}
  .lp-meta dt{padding:6px 12px}
  .t-bar b{font-size:11px}
  .t-stats li{padding:6px 12px}
}

/* 指導案を1本だけ印刷する */
@media print{
  body.print-one>*:not(#t-print){display:none!important}
  body.print-one::before{display:none}
  #t-print .lp{margin:0;padding:12mm 14mm;border:0;box-shadow:none;border-radius:0}
  #t-print .lp-btns{display:none}
  body.print-one .lp-flow{min-width:0;font-size:9.5pt}
  body.print-one .t-scroll{overflow:visible}
  body.print-one .lp-flow thead th{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body.print-one .lp-board{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ページ分割：切りかえバー・ガイドの地図・前後のページ */
.t-subnav a[aria-current=page]{background:var(--tx);color:#fff;border-color:var(--tx)}
.t-body>section{margin-bottom:54px}
.t-body>section>h2{scroll-margin-top:124px}
.t-map{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.prose .t-map a{position:relative;display:flex;flex-direction:column;gap:2px;padding:16px 16px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-decoration:none;color:var(--tx);transition:.2s}
.prose .t-map a:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 10px 24px rgba(60,45,20,.08)}
.t-map b{font:400 30px/1 var(--disp);color:var(--hot);background:none!important}
.t-map small{font:400 12px/1 var(--disp);letter-spacing:.18em;color:var(--mut)}
.t-map strong{font-size:16px;font-weight:900;margin:2px 0 4px}
.t-map span{font-size:12.5px;color:var(--tx2);line-height:1.6}
.t-pager{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 0;padding-top:24px;border-top:1px solid var(--line)}
.prose .t-pager a{display:flex;flex-direction:column;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-decoration:none;color:var(--tx);font-weight:900;font-size:16px}
.prose .t-pager a:hover{border-color:var(--gold)}
.t-pager a.next{text-align:right;grid-column:2}
.t-pager small{font-size:12px;font-weight:700;color:var(--gold)}
.lp-nav a[aria-current=true]{border-color:var(--hot)!important;background:#fff0f4!important;box-shadow:inset 0 -3px var(--hot)}
.lp[hidden]{display:none}
@media(max-width:600px){.t-pager{grid-template-columns:1fr}.t-pager a.next{grid-column:1}}