/* 自動生成：PC・スマホの読みやすさ調整（konoha.css のあとに読み込む） */

/* ================= 共通 ================= */
rt{font-size:max(12px,.56em);letter-spacing:0}
body.konoha-ruby{line-height:2.15}
body.konoha-ruby ruby{margin-inline:.05em}

/* ================= スマホ・タブレット（〜1179px） ================= */
@media (max-width:1179px){
  .k110,.k112,.k113,.k162,.k322,.k338,.k339,.k340,.k341,.k342,.k397,.k405,.k419,.k421,.k453,.k548,.k551,.k553,.k603,.k7,.k8{font-size:13px}
  .k127,.k154,.k166,.k203,.k204,.k211,.k224,.k25,.k264,.k273,.k305,.k366,.k386,.k411,.k413,.k414,.k444,.k446,.k469,.k474,.k55,.k585,.k590,.k613{font-size:14px}
  /* 本文の読みやすさ */
  main p,main li,main dd{line-height:1.95}
  main h2{line-height:1.45}
  /* 指で押しやすい大きさに（JSが小さいリンクに konoha-tap を付けます） */
  .konoha-tap{min-height:44px;display:inline-flex;align-items:center;gap:4px}
  .k4{min-height:44px}
  /* 見出しの改行位置をなるべく自然に */
  main h1,main h2,main h3{text-wrap:balance}
}

@media (max-width:768px){
  /* スマホの最初の画面：まず「何のサイトか」を見せる（見出し→写真の順） */
  .k26{order:1}
}

@media (max-width:600px){
  /* 縦に長くなりすぎないように、区切りの余白を少し詰める */
  .k149,.k228,.k253,.k29,.k352,.k388,.k391,.k415,.k570,.k591,.k88{padding:44px 20px}
}

@media (max-width:420px){
  /* 小さい画面では見出しを少しだけ小さく（単語の途中で折り返さないように） */
  .k16{font-size:27px}
}

/* ================= PC（1180px〜） ================= */
@media (min-width:1180px){
  body{font-size:18px}
  .k110,.k112,.k113,.k162,.k322,.k338,.k339,.k340,.k341,.k342,.k397,.k405,.k419,.k421,.k453,.k548,.k551,.k553,.k603{font-size:14px}
  .k109,.k11,.k125,.k127,.k148,.k154,.k158,.k161,.k163,.k166,.k175,.k203,.k204,.k207,.k211,.k221,.k224,.k227,.k236,.k25,.k264,.k273,.k287,.k290,.k293,.k305,.k308,.k31,.k320,.k366,.k386,.k411,.k413,.k414,.k422,.k444,.k446,.k469,.k474,.k499,.k505,.k506,.k507,.k55,.k554,.k566,.k585,.k590,.k61,.k613,.k614,.k618,.k622,.k76,.p155,.p39{font-size:15px}
  .k103,.k118,.k119,.k129,.k133,.k141,.k142,.k147,.k183,.k188,.k206,.k208,.k217,.k241,.k288,.k316,.k332,.k333,.k345,.k358,.k368,.k369,.k373,.k380,.k402,.k409,.k426,.k427,.k43,.k437,.k44,.k443,.k445,.k452,.k455,.k458,.k465,.k502,.k529,.k540,.k547,.k560,.k569,.k574,.k588,.k589,.k596,.k600,.k615,.k630,.k633,.k640,.k644,.k648,.k655,.k67,.k83,.k86,.p93,.p94,.p95,.p96,.p97{font-size:16px}
  .k134,.k135,.k190,.k231,.k242,.k244,.k269,.k296,.k300,.k303,.k482,.k557,.k586,.k598,.k621,.k638{font-size:17px}
  .k160,.k20,.k330,.k337,.k516,.k522,.k53,.k628,.p23{font-size:18px}
  .k222,.k298,.k299,.k379,.k385,.k451,.k464,.k480,.k512,.k568,.k606,.k635,.k82{font-size:19px}
  .k233,.k24,.k280,.k304,.k387,.k461,.k491,.k525,.k530,.k617{font-size:20px}
  .k140,.k185,.k205,.k268,.k283,.k294,.k302,.k350,.k42,.k433,.k45,.k486,.k81,.k85,.k94,.k98,.p29{font-size:22px}
  .k278,.k365,.k393,.k408{font-size:23px}
  .k189,.k198,.k286,.k377,.k381,.k484,.k584,.k632,.p32{font-size:24px}
  .k117,.k157,.k216,.k260,.k310,.k546,.p92{font-size:26px}
  .k144,.k247,.k475,.p124,.p161,.p84,.p87{font-size:28px}
  .k232,.k32,.k355,.k47,.k541,.k543{font-size:32px}
  .p74{font-size:34px}
  .k418{font-size:36px}
  .k126,.p123{font-size:38px}
  .p139,.p140,.p99{font-size:40px}
  /* 1行を長くしすぎない（日本語は40字前後が読みやすい） */
  main p,main dd,main li{max-width:42em}
  .k143 p,.k143 dd,.k143 li,.k147 p,.k147 dd,.k147 li,.k148 p,.k148 dd,.k148 li,.k149 p,.k149 dd,.k149 li,.k322 p,.k322 dd,.k322 li,.k338 p,.k338 dd,.k338 li,.k339 p,.k339 dd,.k339 li,.k34 p,.k34 dd,.k34 li,.k340 p,.k340 dd,.k340 li,.k341 p,.k341 dd,.k341 li,.k342 p,.k342 dd,.k342 li,.k352 p,.k352 dd,.k352 li,.k469 p,.k469 dd,.k469 li,.k539 p,.k539 dd,.k539 li,.k542 p,.k542 dd,.k542 li,.k570 p,.k570 dd,.k570 li,.p144 p,.p144 dd,.p144 li,.p51 p,.p51 dd,.p51 li,.p93 p,.p93 dd,.p93 li,.p94 p,.p94 dd,.p94 li,.p95 p,.p95 dd,.p95 li,.p96 p,.p96 dd,.p96 li,.p97 p,.p97 dd,.p97 li,.p98 p,.p98 dd,.p98 li{margin-left:auto;margin-right:auto}
  main p,main li,main dd{line-height:1.9}
  /* 見出しのまわりに余裕を */
  main h2{line-height:1.4;letter-spacing:.01em}
  main h3{line-height:1.5}
  main h1,main h2,main h3{text-wrap:balance}
  /* ヘッダーが重ならないように（横幅が足りないときは折り返す） */
  header nav[aria-label]{flex-wrap:wrap;row-gap:2px;min-width:0}
  header nav[aria-label] a{white-space:nowrap}
  header a,header time,header span{overflow-wrap:normal}
  .k16{font-size:clamp(34px,4.60vw,54px)}
  .k180{font-size:clamp(34px,4.60vw,49px)}
  .k181{font-size:clamp(20px,2.30vw,27px)}
  .k212{font-size:clamp(20px,2.30vw,27px)}
  .k359{font-size:clamp(31px,4.14vw,49px)}
  .k439{font-size:clamp(19px,2.30vw,24px)}
  .k519{font-size:clamp(31px,4.60vw,49px)}
  .k520{font-size:clamp(21px,2.53vw,29px)}
  .k572{font-size:clamp(29px,4.14vw,44px)}
  .k579{font-size:clamp(29px,3.91vw,46px)}
  .k607{font-size:clamp(19px,2.30vw,24px)}
  .k649{font-size:clamp(27px,3.91vw,41px)}
  .p129{font-size:clamp(31px,4.60vw,49px)}
  .p61{font-size:clamp(34px,4.60vw,49px)}
}

/* ================= 横幅が足りないPC（1180〜1439px）のヘッダー ================= */
@media (min-width:1180px) and (max-width:1439px){
  header nav[aria-label]{column-gap:16px}
}

/* ================= 大きな画面（1560px〜）では少しだけ広く ================= */
@media (min-width:1560px){
  .p1,.p106,.p112,.p117,.p121,.p122,.p146,.p21,.p26,.p42,.p48,.p51,.p54,.p60,.p64,.p66,.p79{max-width:1480px}
}

/* ================= 下層ページの共通パーツ ================= */
/* このページの内容（目次） */
.konoha-toc{max-width:1320px;margin:0 auto;padding:4px 20px 10px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.konoha-toc__title{font-size:14px;color:var(--text-sub)}
.konoha-toc ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.konoha-toc__link{display:inline-flex;align-items:center;min-height:42px;padding:0 15px;border:1px solid var(--border);
  border-radius:999px;background:var(--surface);color:var(--text);text-decoration:none;font-size:15px;line-height:1.3}
.konoha-toc__link:hover{border-color:var(--leaf-mid);background:var(--leaf-soft);color:var(--text)}

/* 次はこちらもどうぞ */
.konoha-next{max-width:1320px;margin:0 auto;padding:8px 20px 56px}
.konoha-next__title{font-family:var(--font-head);font-size:20px;line-height:1.5;margin:0 0 14px;color:var(--bark)}
.konoha-next__list{list-style:none;padding:0;margin:0;display:grid;gap:14px;grid-template-columns:1fr}
.konoha-next__card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;background:var(--surface);
  border:1px solid var(--border);border-radius:16px;padding:16px 18px;text-decoration:none;color:var(--text);box-shadow:var(--shadow)}
.konoha-next__card:hover{border-color:var(--leaf-mid);background:#F6FAF4;color:var(--text)}
.konoha-next__name{grid-column:1;font-weight:700;font-size:17px;line-height:1.5}
.konoha-next__note{grid-column:1;font-size:14px;color:var(--text-sub);line-height:1.7}
.konoha-next__arrow{grid-column:2;grid-row:1 / span 2;color:var(--leaf);font-size:20px}

/* 前後の記事 */
.konoha-postnav{max-width:900px;margin:0 auto;padding:0 20px 24px;display:grid;gap:12px;grid-template-columns:1fr}
.konoha-postnav__item{display:block;border:1px solid var(--border);border-radius:14px;background:var(--surface);
  padding:14px 16px;text-decoration:none;color:var(--text)}
.konoha-postnav__item:hover{border-color:var(--leaf-mid);color:var(--text)}
.konoha-postnav__label{display:block;font-size:13px;color:var(--leaf);margin-bottom:4px}
.konoha-postnav__title{display:block;font-weight:700;line-height:1.6}

/* ページを探す（404・検索） */
.konoha-search{max-width:600px;margin:0 auto;padding:0 20px 40px}
.konoha-search label{display:block;font-weight:700;margin-bottom:8px}
.konoha-search__row{display:flex;gap:8px}
.konoha-search input{flex:1;min-width:0;min-height:48px;padding:0 14px;border:1px solid var(--border);
  border-radius:12px;background:var(--surface);font-size:16px;font-family:inherit;color:var(--text)}
.konoha-search button{min-height:48px;padding:0 20px;border:0;border-radius:12px;background:var(--leaf);
  color:#fff;font-weight:700;font-family:inherit;font-size:16px;cursor:pointer}
.konoha-search button:hover{background:var(--leaf-deep)}

@media (min-width:1180px){
  .konoha-toc{padding:8px 32px 16px}
  .konoha-toc__title{font-size:15px}
  .konoha-toc__link{font-size:16px}
  .konoha-next{padding:16px 32px 88px}
  .konoha-next__title{font-size:22px}
  .konoha-next__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .konoha-next__name{font-size:18px}
  .konoha-postnav{grid-template-columns:1fr 1fr;padding-bottom:40px}
  .konoha-postnav__item--next{text-align:right}
}
