/* 発達障害チェック ―― 共通スタイル（静的サイト雛形） */
:root{
  --bg:#f7f8fa; --card:#fff; --ink:#1f2733; --sub:#5b6675;
  --line:#e3e7ee; --accent:#3a7afe; --accent-soft:#eef3ff;
  --warn-bg:#fff8e6; --warn-line:#f0d98a;
  --hi:#e8554e; --mid:#e6952f; --lo:#3a9a5a;
  --maxw:760px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;
  line-height:1.8;}
a{color:var(--accent);}
img{max-width:100%;height:auto;}

/* header / footer */
.site-header{background:var(--card);border-bottom:1px solid var(--line);}
.site-header .inner,.site-footer .inner,.wrap{max-width:var(--maxw);margin:0 auto;padding:0 16px;}
.site-header .inner{display:flex;align-items:center;justify-content:space-between;height:56px;}
.brand{font-weight:800;color:var(--ink);text-decoration:none;font-size:1.05rem;}
.brand span{color:var(--accent);}
.brand-logo{height:42px;width:auto;max-width:62vw;display:block;}
.nav a{margin-left:16px;font-size:.9rem;text-decoration:none;color:var(--sub);}
.nav a:hover{color:var(--accent);}
.site-footer{background:var(--card);border-top:1px solid var(--line);margin-top:48px;color:var(--sub);font-size:.85rem;}
.site-footer .inner{padding-top:20px;padding-bottom:32px;}

/* main */
main{padding:24px 0 8px;}
.wrap{padding-top:8px;padding-bottom:8px;}
h1{font-size:1.5rem;line-height:1.4;margin:.2em 0 .4em;}
h2{font-size:1.2rem;margin:1.6em 0 .4em;border-left:5px solid var(--accent);padding-left:10px;}
h3{font-size:1.05rem;margin:1.2em 0 .3em;}
p,li{font-size:1rem;}
.lead{color:var(--sub);}

/* hero */
.hero{background:linear-gradient(180deg,var(--accent-soft),#fff);border:1px solid var(--line);border-radius:16px;padding:28px 20px;margin:8px 0 8px;text-align:center;}
.hero p{color:var(--sub);}
.cta{display:inline-block;background:var(--accent);color:#fff;text-decoration:none;font-weight:700;padding:14px 28px;border-radius:12px;margin-top:8px;}
.cta.secondary{background:#fff;color:var(--accent);border:1px solid var(--accent);}

/* cards / lists */
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 18px;margin:14px 0;}
.card a.title{font-weight:700;text-decoration:none;color:var(--ink);font-size:1.05rem;}
.card a.title:hover{color:var(--accent);}
.note{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:12px;padding:14px 16px;font-size:.9rem;color:#6b5a1f;margin:16px 0;}
.answer{background:var(--accent-soft);border-radius:12px;padding:14px 16px;margin:8px 0 16px;font-weight:600;}

/* table */
table{border-collapse:collapse;width:100%;margin:12px 0;font-size:.95rem;}
th,td{border:1px solid var(--line);padding:8px 10px;text-align:left;}
th{background:var(--accent-soft);}

/* faq */
.faq dt{font-weight:700;margin-top:14px;}
.faq dd{margin:4px 0 0;color:var(--ink);}
.small{font-size:.83rem;color:var(--sub);}
.breadcrumb{font-size:.82rem;color:var(--sub);margin:8px 0;}
.breadcrumb a{color:var(--sub);}

/* ナビ（PC：横並び） */
.nav{display:flex;align-items:center;}
.nav-toggle{position:absolute;left:-9999px;}
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;padding:9px;cursor:pointer;}
.nav-burger span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:.2s;}

/* スマホ最適化 */
@media (max-width:600px){
  .site-header .inner{position:relative;height:52px;}
  .brand-logo{height:32px;max-width:70vw;}
  .nav-burger{display:flex;}
  .nav{position:absolute;top:52px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);
       box-shadow:0 8px 16px rgba(0,0,0,.07);flex-direction:column;display:none;z-index:30;}
  .nav a{display:block;margin:0;padding:14px 16px;border-top:1px solid var(--line);font-size:1rem;}
  .nav-toggle:checked ~ .nav{display:flex;}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0;}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  h1{font-size:1.3rem;}
  h2{font-size:1.1rem;}
  .hero{padding:22px 16px;}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .wrap,.site-header .inner,.site-footer .inner{padding-left:14px;padding-right:14px;}
}
