/*
 * このサイトで足したもの。SWELL 2.19.0 の元 CSS と、旧 DB の生成 CSS（settings/）は書き換えず、このファイルを最後に読む。
 * 足すのは、元テーマに無い部品の見た目と、読みやすさ・使いやすさの手当て（コントラスト・折り返し・字の大きさ・フォーカスの枠）だけ（理由は docs/swell-skin.md）。
 */

/* 1. 業務フローのメニューで、いま開いている頁を示す（元テーマのウィジェットのメニューには現在地の印が無い） */
.c-listMenu a[aria-current="page"] {
  background-color: var(--color_main_thin);
  font-weight: 700;
}

/* 2. 囲み枠（キャプションボックス）の色。SWELL の既定（橙 #f59b5f・青 #5fb9f5・緑 #2fcd90）は白い題の字とのコントラストが
 *    約 2.1 で基準（4.5）に届かない。SWELL の設定で変える同じ変数を、同じ色味で濃くした値にする（白とのコントラスト 4.9〜5.3。
 *    淡い地の色はそのまま）。測る道具は manage の contrast.sh */
.cap_box[data-colset="col1"] { --capbox-color: #b4561c; }
.cap_box[data-colset="col2"] { --capbox-color: #1f6fb2; }
.cap_box[data-colset="col3"] { --capbox-color: #1c7a54; }

/* リンクの色（SWELL の設定「リンクカラー」と同じ変数）。親サイトの旧設定の #1176d4 は、囲み枠の淡い地の上で 4.2 前後になり
 * 基準に届かない。同じ色味で濃くした #0f6bc2（白で 5.4、囲み枠の淡い地で 4.9〜5.1）にする */
:root { --color_link: #0f6bc2; }

/* 3. 本文の表で、行の見出し（th scope="row"。短い名前）を途中で折り返さない
 *    （元 CSS は和文の折り返しで「e-logp 法」を「e-log／p 法」のように切るため） */
.post_content tbody th[scope="row"] {
  white-space: nowrap;
}

/* 4. 文字のロゴ（サイト名）を、スマホでも1行に収める。元 CSS は 959px 以下で 5vw（390px で約 20px）で、
 *    サイト名が長いため2行に割れる。16px〜24px（PC と同じ）の範囲で幅に合わせる */
@media (max-width: 959px) {
  .-txt .c-headLogo__link { font-size: clamp(16px, 4.2vw, 24px); }
}

/* 5. 字の大きさの下限：読む字 16px 以上、添え書き 14px 以上。
 *    親サイト（宅地造成の地盤技術）の「シニアにも優しいサイト」と同じ下限（同じ読者を想定するため）。
 *    形・色・余白は SWELL のまま、font-size だけを上げる。検査は tools/measure-text.mjs */

/* 字の基準。SWELL は 599px 以下で 3.6vw（幅 390px で約 14px）、サイドバーは 14px。どの幅でも 16px にする */
:root {
  --swl-fz--root: 16px;
  --swl-fz--side: 16px;
}

/* 読む字（16px） */
.p-breadcrumb__list { font-size: 16px; }
.c-gnav > .menu-item > a .ttl { font-size: 16px; }
.c-gnav .sub-menu .ttl { font-size: 16px; }
.p-mainVisual__slideText,
.c-mvBtn__btn { font-size: 16px; }
.c-listMenu .children a,
.c-listMenu .sub-menu a { font-size: 1em; }
.p-toc__list [data-level="3"] { font-size: 1em; }
.c-widget__title { font-size: 16px; }
.l-footer__nav a { font-size: 16px; }
.p-pnLinks__item { font-size: 16px; }
.p-profileBox__text,
.p-profileBox__btn .p-profileBox__btnLink { font-size: 16px; }
.p-blogCard__title,
.p-blogCard__excerpt { font-size: 16px; }
.is-style-small_ttl .cap_box_ttl { font-size: 16px; }
/* 記事の部品（2026-10-13 に業務フローの頁を記事の形にして足した。親サイトの SWELL の表示の
 * takuzou-jiban の additions/takuzou-jiban.css の 2-2 と同じ下限）。元テーマは日付・著者を 12px、
 * 「この記事を書いた人」の紹介文を .9em、関連記事の題を 3.6vw などにする */
.p-articleMetas__times,
.p-articleMetas__author { font-size: 16px; }
.c-postTitle__date .__y { font-size: 16px; }
.p-authorBox__desc { font-size: 16px; }
.p-authorBox__name { font-size: 16px; }
#body_wrap .p-postList .p-postList__title,
#body_wrap .p-postList .p-postList__excerpt { font-size: 16px; }
.c-shareBtns__message { font-size: 16px; }
/* 記事が入って出てくる部品（2026-10-14、最初の技術解説で measure-text.mjs が拾った）：目次を開くボタン「もっと見る」と、
 * トップの記事一覧の下の「技術解説をすべて見る」。元テーマは前者が 14px（data-omit=nest の目次は 13px）、後者が .9em（14.4px） */
.p-toc .p-toc__expandBtn,
.p-toc[data-omit="nest"] .p-toc__expandBtn { font-size: 16px; }
.is-style-more_btn a { font-size: 16px; }
/* 本文の中の短いコード（cookie の名前など）。元テーマは .9em で、スマホの本文 17px では 15.3px になる */
.post_content :not(pre) > code { font-size: max(.9em, 16px); }
@media not all and (min-width: 600px) {
  .c-postTitle__date .__md { font-size: max(4.2vw, 16px); }
  .c-secTitle { font-size: max(4.5vw, 16px); }
}

/* 添え書き（14px） */
/* ヘッダーの細い帯の一文は、元テーマが帯の幅の半分（width:50%）で切る。サイト名が長いと終わりが字の途中で切れるので、
 * 幅の上限を外す（右のアイコンの手前までは使う。親サイトの SWELL の表示の takuzou-jiban の additions/takuzou-jiban.css の 2-3 と同じ） */
.l-header__bar .c-catchphrase { font-size: 14px; line-height: 1.4; width: auto; }
.c-smallNavTitle { font-size: 14px; }
.l-footer .copyright { font-size: 14px; }
.p-profileBox__job { font-size: 14px; }
.p-blogCard__caption { font-size: 14px; }
.swell-block-step__number .__label,
.is-style-small .swell-block-step__number .__label { font-size: 14px; }
/* 記事の部品（上と同じく親サイトの 2-3 と同じ下限）：分類の札・肩書き・URL をコピーの字・コピーしたときの吹き出し・右下のボタンの字・一覧の日付 */
.p-articleMetas .p-articleMetas__termList,
.p-articleMetas.-top .p-articleMetas__termList { font-size: 14px; }
.p-authorBox__position.u-fz-s { font-size: max(var(--swl-fz--small), 14px) !important; }
.c-big-urlcopy .c-urlcopy__text { font-size: max(.8em, 14px); }
.c-copyedPoppup { font-size: 14px; }
.c-fixBtn__label { font-size: 14px; }
.p-postList .p-postList__meta { font-size: 14px; }
.c-postThumb .c-postThumb__cat { font-size: 14px; }
/* 分類・タグの一覧の記事数「(1)」（記事が入るとサイドバーの分類の一覧に出る。2026-10-14）。元テーマは 13px、599px 以下は 3vw（幅 390px で 11.7px） */
.cat-post-count,
.post_count,
.tag-link-count { font-size: 14px; }

/* 6. 一覧メニューのフォーカスの枠を内側に描く。元 CSS の .c-listMenu .sub-menu は開閉のために overflow:hidden を持ち、
 *    ブラウザ既定の枠（要素の外側に描く）が上と左右で切れて、キーボードで選んだ項目が分かりにくい */
.c-listMenu a:focus-visible { outline-offset: -2px; }

/* 7. ヘッダーの下に開くメニュー（関連サイト）。元 CSS は、マウスを載せたときだけ開き（.c-gnav>.menu-item:hover）、
 *    親の項目の真ん中に合わせて 15em 幅で開く。キーボードで選んだときにも開き、右端の項目から開くときは右にそろえて
 *    画面の外へ出ないようにする。幅は、サイト名（土とコンクリートの設計計算ツール集）が 16px で1行に収まる大きさ */
.c-gnav > .menu-item:focus-within > .sub-menu { opacity: 1; visibility: visible; }
.c-gnav > .menu-item:last-child > .sub-menu { left: auto; right: 0; transform: none; }
.c-gnav .sub-menu { width: 320px; }

/* 8. トップのメインビジュアル。写真（柱状改良の施工）は、オーガーが地盤に入って土を混ぜている下の方を見せる
 *    （PC は高さ 30vw で写真の高さの 4 割ほどしか見えず、真ん中だと空と機械の上の方だけになる）。
 *    重ね色は親サイトの旧設定の 0.2 だと、明るい空や土の上で白い字が読みにくいので濃くする */
.p-mainVisual__img { object-position: 50% 100%; }
.p-mainVisual .c-filterLayer::before { opacity: .5; }

/* 9. 計算ツールのサイトのバナー（目次の下・サイドバーの先頭）と記事内広告の枠。元テーマに無い部品なので、間隔は宅造地盤の
 *    style.css の .c-belowToc・.c-ad に合わせる。バナーの画像は表示の 2 倍の大きさなので、入れ物の幅を超えないよう縮める。
 *    手元（本番のホスト以外）では、記事内広告の位置に代わりの枠を描く（app/inc/ads.php の ad_unit()） */
.c-belowToc { margin: 1.5em 0 2em; text-align: center; }
.c-belowToc img,
.widget_swell_ad_widget img { height: auto; max-width: 100%; }
.post_content .c-ad { margin: 2em 0; }
.c-ad__placeholder { align-items: center; border: 1px dashed #999; color: #555; display: flex; font-size: 16px; justify-content: center; min-height: 250px; }