/* Copy: Downloads/MIKAILab_徳島集客_ページ構成・文章案.md §2 (2026-09-09 第4稿); FAQ: work/content/faq.json
   教員向け生成AI研修: responsive layout on fluid.css. The FAQ uses the shared accordion classes (.faq-*) defined in school.css. */

.tt-hero-lead{font:400 clamp(17px,.8rem + .6vw,23px)/1.6 "Noto Serif JP",serif;color:var(--navy)}
.tt-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 20px;margin-top:4px}

#tt-themes{scroll-margin-top:88px}
.tt-themes-inner{display:grid;gap:clamp(28px,3.2vw,44px)}
.tt-themes-inner>.f-stack .f-body{max-width:44em}
.tt-theme-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,28px)}
.tt-theme-card{display:flex;flex-direction:column;gap:12px;background:#fff;border-radius:8px;padding:clamp(22px,2.4vw,32px)}
/* 段階と所要時間を先に見せる。どこから始めるかで選ばれるため。 */
.tt-theme-meta{display:flex;align-items:center;gap:10px}
.tt-theme-level{display:inline-flex;align-items:center;min-height:24px;padding:0 12px;border-radius:999px;background:var(--navy);color:#fff;font:700 var(--fs-xs)/1 "Noto Sans JP",sans-serif}
.tt-theme-time{font:400 var(--fs-xs)/1.6 "Noto Sans JP",sans-serif;color:var(--muted)}
.tt-themes-lead{max-width:52em}
.tt-theme-card img{width:36px;height:36px}
.tt-theme-card h3{font:400 var(--fs-h3)/1.5 "Noto Serif JP",serif;color:var(--navy)}
.tt-theme-card .f-body{font-size:var(--fs-sm);font-family:"Noto Sans JP",sans-serif;color:var(--ink);max-width:none}
.tt-theme-goal{display:flex;flex-direction:column;gap:4px;margin-top:auto;padding-top:12px;border-top:1px solid var(--border);font:400 var(--fs-sm)/1.6 "Noto Sans JP",sans-serif;color:var(--ink)}
.tt-theme-goal-label{font:700 var(--fs-xs)/1.6 "Noto Sans JP",sans-serif;color:var(--terracotta);letter-spacing:.04em}

.tt-program-head{margin-bottom:clamp(24px,2.8vw,32px)}
.tt-program-sub{font:700 var(--fs-sm)/1.6 "Noto Sans JP",sans-serif;color:var(--muted)}
.tt-schedule{width:100%;border-collapse:collapse}
.tt-schedule th,.tt-schedule td{text-align:left;padding:14px 16px;border-top:1px solid var(--border);font:400 var(--fs-sm)/1.8 "Noto Sans JP",sans-serif;color:var(--ink);vertical-align:top}
.tt-schedule thead th{border-top:0;padding-top:0;padding-bottom:8px;font:700 var(--fs-xs)/1.6 "Noto Sans JP",sans-serif;color:var(--muted)}
.tt-schedule tbody th{width:5.4em;white-space:nowrap;font:700 var(--fs-sm)/1.8 "Noto Sans JP",sans-serif;color:var(--navy)}
.tt-schedule-note{margin-top:14px;font:400 13px/1.7 "Noto Sans JP",sans-serif;color:var(--muted)}

.tt-purpose-photo{aspect-ratio:4/3}
.tt-purpose-break{display:none}
@media(max-width:767px){.tt-purpose-break{display:inline}}

.tt-faq-note{max-width:26em}
.tt-faq-break{display:none}
@media(min-width:1024px){.tt-faq-break{display:inline}}

@media(max-width:1023px){
 .tt-theme-list{grid-template-columns:1fr}
}
@media(max-width:959px){
 #tt-themes{scroll-margin-top:76px}
}
@media(max-width:767px){
 .tt-schedule th,.tt-schedule td{padding:12px 10px}
 .tt-schedule tbody th{width:4.2em}
}
