@charset "utf-8";
/* /blog（コラムの一覧）。2026-11-01 本部が ChatGPT で作って承認したデザインを移したもの。中身は元のまま、見た目だけ。
 * ⚠ 真ん中（「デモのCSS」）は zip の blog/page-fragment.html の <style> を **1文字も変えずに** 写したもの。
 * ⚠ すべて #kid-blog の中だけに効く。読むのはコラムの一覧だけ（src/web/blog/column-design.ts）。記事のページ・制度ガイド・支援のことには効かない。
 */
/* ---------- Tailwind（app.css）と本体HPのCSS（hp-chrome.css）の打ち消し ----------
 * このページは React／Tailwind で組んだサーバー描画のページで、デモは Tailwind 無しのまっさらなページで作られている。
 * 中の要素についている Tailwind の class（px-6・text-[30px] など）が効いたままだと、デモと余白や文字がずれる。
 * いったん全部をブラウザの初期値に戻し（all: revert）、そのうえにデモのCSSを重ねる。
 * ⚠ Tailwind も hp-chrome.css もレイヤーの中、ここはレイヤーの外なので、詳細度に関係なくこちらが勝つ。
 * ⚠ ただし common.css の img{height:auto !important} だけはレイヤー内の !important なので勝てない（写真の高さは下の min/max-height で決める）。
 * ⚠ デモのCSSより**前**に置くこと（同じ強さなら後ろが勝つ）。 */
#kid-blog, #kid-blog *, #kid-blog *::before, #kid-blog *::after { all: revert; }
#kid-blog { letter-spacing: normal; }

/* ---------- サイト共通CSSの打ち消し（デモはまっさらなページで作られている） ----------
 * common.css は body に font-size 1.3〜1.4rem・line-height 2・word-break: break-all を敷き、
 * a / small / img を display:block にしている。デモと同じ表示にするため、#kid-blog の中だけ元に戻す。 */
#kid-blog { font-size: 16px; line-height: normal; }
/* hp-own.css の body * { overflow-wrap: anywhere }・見出しの word-break: auto-phrase・text-wrap: balance / pretty も、デモには無い（改行位置が変わる） */
#kid-blog, #kid-blog * { word-break: normal; overflow-wrap: normal; text-wrap: wrap; }
/* reset.min.css の text-rendering: optimizeSpeed は英字の詰め（カーニング）を切るので、ブラウザの初期値に戻す */
#kid-blog { text-rendering: auto; }
#kid-blog a, #kid-blog small { display: inline; }
#kid-blog ul, #kid-blog ol { list-style: none; margin: 0; padding: 0; }
#kid-blog em { font-style: normal; }
#kid-blog strong, #kid-blog b { font-weight: bold; }

/* ---------- デモのCSS（page-fragment.html の <style> そのまま） ---------- */

#kid-blog{--ks-red:#ac3038;--ks-ink:#292823;--ks-muted:#6d6962;--ks-soft:#f6f4f0;--ks-line:#e4e0d8;background:#fff;color:var(--ks-ink);font-family:"Noto Sans JP",sans-serif;max-width:1150px;margin:auto;container-type:inline-size;text-align:left}#kid-blog *{box-sizing:border-box}#kid-blog a{color:inherit;text-decoration:none}#kid-blog img{display:block;max-width:100%}#kid-blog ul,#kid-blog ol{list-style:none;padding:0;margin:0}#kid-blog h1,#kid-blog h2,#kid-blog h3{color:inherit;margin:0;font-weight:500;letter-spacing:.04em;line-height:1.7}#kid-blog p{font-size:13px;line-height:2.2;letter-spacing:.03em;color:var(--ks-muted)}#kid-blog button{font:inherit}#kid-blog .ks-header{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:24px 5%;border-bottom:1px solid var(--ks-line)}#kid-blog .ks-logo{width:215px;height:auto}#kid-blog .ks-nav{display:flex;align-items:center;gap:25px;font-size:11px}#kid-blog .ks-nav .active{color:var(--ks-red)}#kid-blog .ks-pill{display:inline-flex;gap:30px;align-items:center;justify-content:space-between;background:var(--ks-ink);color:#fff;padding:15px 24px;border-radius:40px;font-size:12px;border:1px solid var(--ks-ink)}#kid-blog .ks-pill:hover{background:var(--ks-red);border-color:var(--ks-red)}#kid-blog .ks-pill.light{background:#fff;color:var(--ks-ink);border-color:var(--ks-line)}#kid-blog .ks-crumb{padding:20px 5%;font-size:10px;color:var(--ks-muted)}#kid-blog #biz-index{padding:30px 7% 65px}#kid-blog .ttl-sec{display:grid;grid-template-columns:1fr 1.05fr;gap:60px;align-items:center;margin:0 0 55px;padding:5px 0 30px}#kid-blog .ttl-sec .sub-ttl{font-family:"Noto Serif JP",serif;font-size:40px;letter-spacing:.08em}#kid-blog .ttl-sec .sub-ttl span{display:block;font:italic 64px Georgia,serif;color:var(--ks-red);letter-spacing:-.03em;margin:18px 0 30px}#kid-blog .ttl-sec p{font-size:13px;line-height:2.3;max-width:390px;margin:0}#kid-blog .ks-hero-photo{height:350px;width:100%;object-fit:cover;border-radius:180px 180px 8px 8px}#kid-blog .ks-index{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ks-line);border-bottom:1px solid var(--ks-line);margin-bottom:65px}#kid-blog .ks-index a{padding:22px 12px;display:flex;align-items:center;gap:12px;font-size:12px;min-width:0}#kid-blog .ks-index a+a{border-left:1px solid var(--ks-line)}#kid-blog .ks-index a:hover{background:var(--ks-soft)}#kid-blog .ks-index span{font:italic 23px Georgia,serif;color:var(--ks-red)}#kid-blog .biz-index>.biz-index-ttl{font-family:"Noto Serif JP",serif;font-size:29px;margin:0 0 32px;padding-top:20px;display:flex;gap:18px;align-items:baseline;scroll-margin-top:25px}#kid-blog .biz-index>.biz-index-ttl:before{font:italic 33px Georgia,serif;color:var(--ks-red)}#kid-blog .biz-index>.biz-index-ttl:nth-of-type(1):before{content:"01"}#kid-blog .biz-index>.biz-index-ttl:nth-of-type(2):before{content:"02"}#kid-blog .biz-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 27px;margin-bottom:70px}#kid-blog .biz-list>li{min-width:0}#kid-blog .biz-list>li>a{display:flex;flex-direction:column;height:100%;border-bottom:1px solid var(--ks-line);padding-bottom:25px;position:relative}#kid-blog .thumb{overflow:hidden;border-radius:7px 7px 55px 7px;margin-bottom:20px;background:var(--ks-soft)}#kid-blog .thumb img{width:100%;height:180px;object-fit:cover;transition:transform .3s}#kid-blog .biz-list a:hover .thumb img{transform:scale(1.025)}#kid-blog .summary{flex:1;display:flex;flex-direction:column;min-width:0}#kid-blog .summary h3{font-size:12px;line-height:1.8;margin:0 0 16px;color:var(--ks-muted)}#kid-blog .summary>img{width:auto;height:48px;max-width:94%;object-fit:contain;object-position:left center;margin-bottom:19px}#kid-blog .summary p{font-size:12px;line-height:2.05;margin:0 0 22px}#kid-blog .school-age{font-size:11px;line-height:1.9;color:var(--ks-muted);margin-top:auto;padding:14px 27px 0 0;border-top:1px solid var(--ks-line);position:relative}#kid-blog .school-age>div{display:inline;color:var(--ks-ink)}#kid-blog .school-age:after{content:"↗";position:absolute;right:0;top:11px;color:var(--ks-red);font-size:20px}#kid-blog .biz-list:last-child{grid-template-columns:1fr 1fr;gap:45px;margin-bottom:0;padding:45px 35px;background:var(--ks-soft);border-radius:70px 0 8px 8px}#kid-blog .biz-list:last-child .biz-index-ttl{font-family:"Noto Serif JP",serif;font-size:27px;line-height:1.8;margin-bottom:25px;scroll-margin-top:25px}#kid-blog .biz-list:last-child .biz-index-ttl:before{font:italic 30px Georgia,serif;color:var(--ks-red);margin-right:15px}#kid-blog .nursery .biz-index-ttl:before{content:"03"}#kid-blog .unique .biz-index-ttl:before{content:"04"}#kid-blog .biz-list:last-child .thumb img{height:225px}#kid-blog .ks-footer{padding:45px 7% 25px;border-top:1px solid var(--ks-line)}#kid-blog .ks-footer-top{display:grid;grid-template-columns:1fr 1fr;gap:45px}#kid-blog .ks-address{font-size:11px;line-height:2.1;color:var(--ks-muted);margin-top:22px}#kid-blog .ks-footer-contact p{font-size:13px;margin:0 0 20px}#kid-blog .ks-footer-buttons{display:flex;gap:12px;flex-wrap:wrap}#kid-blog .ks-footer-contact .ks-tel{font-size:20px;margin-top:20px}#kid-blog .ks-tel small{font-size:11px;margin-left:13px;color:var(--ks-muted)}#kid-blog .ks-footer-nav{display:flex;flex-wrap:wrap;gap:20px 30px;border-top:1px solid var(--ks-line);margin-top:35px;padding-top:25px;font-size:11px}#kid-blog .ks-business-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:25px;font-size:11px;border-top:1px solid var(--ks-line);margin-top:30px;padding-top:25px}#kid-blog .ks-business-nav h3{font-size:12px;margin-bottom:16px}#kid-blog .ks-business-nav a{display:block;font-size:10px;line-height:1.9;margin-top:8px}#kid-blog .ks-business-title{font-size:13px;margin-top:30px}#kid-blog .ks-copy{display:block;text-align:center;margin-top:40px;font-size:9px;color:var(--ks-muted)}#kid-blog .ks-mobile-toggle{display:none;padding:10px;border:1px solid var(--ks-line);border-radius:25px;background:#fff;font-size:11px}#kid-blog .ks-mobile-nav{padding:5px 7% 20px;font-size:12px;display:flex;flex-wrap:wrap;gap:20px}#kid-blog [hidden]{display:none!important}
@container(max-width:700px){#kid-blog .ks-header{padding:20px 6%}#kid-blog .ks-logo{width:190px}#kid-blog .ks-nav{display:none}#kid-blog .ks-mobile-toggle{display:block}#kid-blog .ks-crumb{padding:18px 7%}#kid-blog #biz-index{padding:25px 7% 45px}#kid-blog .ttl-sec{grid-template-columns:1fr;gap:30px;margin-bottom:25px}#kid-blog .ttl-sec .sub-ttl{font-size:32px}#kid-blog .ttl-sec .sub-ttl span{font-size:50px;margin:12px 0 25px}#kid-blog .ks-hero-photo{height:270px}#kid-blog .ks-index{grid-template-columns:1fr 1fr;margin-bottom:40px}#kid-blog .ks-index a{padding:18px 10px;font-size:11px}#kid-blog .ks-index a:nth-child(3){border-left:0;border-top:1px solid var(--ks-line)}#kid-blog .ks-index a:nth-child(4){border-top:1px solid var(--ks-line)}#kid-blog .biz-index>.biz-index-ttl{font-size:25px;gap:15px;margin-bottom:25px}#kid-blog .biz-index>.biz-index-ttl:before{font-size:28px}#kid-blog .biz-list{grid-template-columns:1fr;gap:30px;margin-bottom:45px}#kid-blog .thumb img{height:230px}#kid-blog .summary h3{font-size:12px;margin-bottom:14px}#kid-blog .summary>img{height:50px;margin-bottom:18px}#kid-blog .summary p{font-size:13px}#kid-blog .school-age{font-size:12px}#kid-blog .biz-list:last-child{grid-template-columns:1fr;padding:30px 20px;gap:40px;border-radius:45px 0 8px 8px}#kid-blog .biz-list:last-child .biz-index-ttl{font-size:25px}#kid-blog .biz-list:last-child .thumb img{height:200px}#kid-blog .ks-footer{padding:35px 7% 25px}#kid-blog .ks-footer-top{grid-template-columns:1fr;gap:30px}#kid-blog .ks-footer-buttons{flex-direction:column}#kid-blog .ks-business-nav{grid-template-columns:1fr 1fr;gap:25px 15px}#kid-blog .ks-tel small{display:block;margin-left:0;margin-top:8px}}
@media(prefers-reduced-motion:reduce){#kid-blog .thumb img{transition:none}#kid-blog .biz-list a:hover .thumb img{transform:none}}
#kid-blog .ks-business-nav>ul{display:contents}#kid-blog .ks-business-nav>ul>li>div{font-size:12px;margin-bottom:15px}#kid-blog .ks-business-nav>ul>li{min-width:0}
#kid-blog{--kb-red:#ac3038;--kb-ink:#292823;--kb-muted:#6d6962;--kb-soft:#f6f4f0;--kb-line:#e4e0d8;max-width:1150px;margin:auto;container-type:inline-size;background:#fff;color:var(--kb-ink);font-family:"Noto Sans JP",sans-serif}#kid-blog #kb-content{padding:40px 8% 75px;line-break:strict}#kid-blog #kb-content>div>p.ka-eyebrow{font:italic 75px Georgia,serif;letter-spacing:-.035em;color:var(--kb-red);margin:0 0 15px}#kid-blog #kb-content h1{font-family:"Noto Serif JP",serif;font-weight:500;font-size:34px;letter-spacing:.08em;margin:0 0 25px;line-height:1.8}#kid-blog #kb-content>div>p:not(.ka-eyebrow){font-size:13px;line-height:2.3;max-width:580px;color:var(--kb-muted);margin:0 0 45px;text-wrap:pretty}#kid-blog #kb-content>div>div:first-of-type{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 28px}#kid-blog #kb-content>div>div:first-of-type>a{display:flex;flex-direction:column;min-width:0;border-bottom:1px solid var(--kb-line);padding-bottom:24px;transition:color .2s}#kid-blog #kb-content>div>div:first-of-type>a:hover h2{color:var(--kb-red)}#kid-blog #kb-content>div>div:first-of-type>a>img,#kid-blog #kb-content>div>div:first-of-type>a>div:empty{width:100%;height:170px;object-fit:cover;background:var(--kb-soft);border-radius:7px 7px 45px 7px;margin-bottom:23px}#kid-blog #kb-content>div>div:first-of-type>a>div:empty{position:relative;overflow:hidden;background:linear-gradient(140deg,#f5f1ea,#ece6dc)}#kid-blog #kb-content>div>div:first-of-type>a>div:empty:after{content:"";position:absolute;width:130px;height:160px;border:1px solid #ddd2c3;border-radius:85px 85px 0 0;bottom:-45px;right:28px;transform:rotate(-15deg)}#kid-blog #kb-content>div>div:first-of-type>a>div:not(:empty){display:flex;flex-direction:column;flex:1;min-width:0}#kid-blog #kb-content>div>div:first-of-type>a>div:not(:empty)>div{display:flex;align-items:center;flex-wrap:wrap;gap:10px 15px;font-size:10px;color:var(--kb-muted);letter-spacing:.04em;line-height:1.8}#kid-blog #kb-content>div>div:first-of-type>a>div:not(:empty)>div>span:first-child{color:var(--kb-red);padding:4px 9px;background:var(--kb-soft);border-radius:25px}#kid-blog #kb-content h2{font-family:"Noto Serif JP",serif;font-weight:500;font-size:18px;line-height:1.9;letter-spacing:.03em;margin:16px 0 15px;text-wrap:pretty}#kid-blog #kb-content>div>div:first-of-type>a>div>p{font-size:12px;line-height:2.05;color:var(--kb-muted);margin:0;text-wrap:pretty}#kid-blog #kb-content>div>div:first-of-type>a:first-child{grid-column:1/-1;display:grid;grid-template-columns:.9fr 1.1fr;gap:45px;padding:30px;background:var(--kb-soft);border:0;border-radius:8px 75px 8px 8px;margin-bottom:5px;align-items:center}#kid-blog #kb-content>div>div:first-of-type>a:first-child>div:empty{height:260px;border-radius:120px 120px 8px 8px;margin:0;background:#ebe4d9}#kid-blog #kb-content>div>div:first-of-type>a:first-child>div:empty:after{width:150px;height:220px;right:45px;bottom:-30px;border-color:#d8cbb9}#kid-blog #kb-content>div>div:first-of-type>a:first-child h2{font-size:28px;line-height:1.85;margin-top:22px}#kid-blog #kb-content>div>div:first-of-type>a:first-child>div>p{font-size:13px;line-height:2.2}#kid-blog #kb-content>div>div:last-of-type:not(:first-of-type){margin-top:55px;border-top:1px solid var(--kb-line);padding-top:30px}#kid-blog #kb-content>div>div:last-of-type>p{font-size:13px;line-height:2.1;color:var(--kb-muted);margin:0}#kid-blog #kb-content>div>div:last-of-type>p>a{color:var(--kb-red);border-bottom:1px solid var(--kb-red);margin:0 5px;padding-bottom:3px}#kid-blog .ks-footer{background:var(--kb-soft);border-top:0;border-radius:90px 90px 0 0;padding-top:55px}
@container(max-width:700px){#kid-blog #kb-content{padding:25px 7% 50px}#kid-blog #kb-content>div>p.ka-eyebrow{font-size:58px}#kid-blog #kb-content h1{font-size:28px;margin-bottom:20px}#kid-blog #kb-content>div>p:not(.ka-eyebrow){font-size:12px;margin-bottom:30px}#kid-blog #kb-content>div>div:first-of-type{grid-template-columns:1fr;gap:30px}#kid-blog #kb-content>div>div:first-of-type>a:first-child{grid-template-columns:1fr;gap:23px;padding:23px;border-radius:8px 45px 8px 8px}#kid-blog #kb-content>div>div:first-of-type>a:first-child>div:empty{height:180px}#kid-blog #kb-content>div>div:first-of-type>a:first-child h2{font-size:23px}#kid-blog #kb-content>div>div:first-of-type>a>img,#kid-blog #kb-content>div>div:first-of-type>a>div:empty{height:200px}#kid-blog #kb-content h2{font-size:21px}#kid-blog .ks-footer{border-radius:45px 45px 0 0;padding-top:35px}}
@media(prefers-reduced-motion:reduce){#kid-blog #kb-content>div>div:first-of-type>a{transition:none}}

/* ---------- 写真の高さ ----------
 * このページは common.css が layer(hp-theme) に入っていて、その img{height:auto !important} にレイヤー外からは勝てない。
 * デモと同じ高さを min-height と max-height で書き直す（スマホ幅の値も）。 */
#kid-blog .ks-logo {  }
#kid-blog .thumb img { min-height: 180px !important; max-height: 180px !important; }
#kid-blog .summary>img { min-height: 48px !important; max-height: 48px !important; }
#kid-blog .biz-list:last-child .thumb img { min-height: 225px !important; max-height: 225px !important; }
#kid-blog #kb-content>div>div:first-of-type>a>img { min-height: 170px !important; max-height: 170px !important; }
@container(max-width:700px) {
	#kid-blog .thumb img { min-height: 230px !important; max-height: 230px !important; }
	#kid-blog .summary>img { min-height: 50px !important; max-height: 50px !important; }
	#kid-blog .biz-list:last-child .thumb img { min-height: 200px !important; max-height: 200px !important; }
}
@container(max-width:700px) {
	#kid-blog #kb-content>div>div:first-of-type>a>img { min-height: 200px !important; max-height: 200px !important; }
}

/* ---------- ページ内リンクで飛んだ先が、固定ヘッダー（スマホ65px・PC100px）の下に隠れないように ---------- */
#kid-blog [id] { scroll-margin-top: 80px; }
@media (min-width: 1025px) { #kid-blog [id] { scroll-margin-top: 115px; } }

/* ---------- スマホで見たときの改行（2026-10-31 本部指摘「改行が微妙」。ほかの新デザインのページと同じ） ----------
 *  ・行の頭に小さい「っ」「ょ」や「ー」を置かない（line-break: strict）
 *  ・見出しは「、」や空白や <wbr> の所で折り返す。1つのまとまりが1行に入りきらないときだけ途中で折る（keep-all ＋ break-word）
 *    ⚠ anywhere にしないこと。行を埋めようとしてまとまりの途中で折り、「ひら／く。」になる
 *  ・本文は最後の行が1〜2文字だけにならないように整える（text-wrap: pretty。未対応のブラウザでは今までどおり） */
#kid-blog { line-break: strict; }
/* ⚠ 中の <em>・<span> にも書く（上の「#kid-blog *」の打ち消しが直接効いて、親の keep-all を受け継がないため） */
#kid-blog h1, #kid-blog h2, #kid-blog h3, #kid-blog h1 *, #kid-blog h2 *, #kid-blog h3 * { word-break: keep-all; overflow-wrap: break-word; }
#kid-blog p, #kid-blog li { text-wrap: pretty; }

/* 記事カードの題名は CMS の文字で、「、」が無い長い題も多い。keep-all にすると折れる所が無く、
 * 1行に入りきらない所で途中から折れて「新しくしま／した」になる。題名だけは句の切れ目で折る（auto-phrase。
 * 未対応のブラウザでは普通の折り返し）＋行の長さを揃える（balance） */
#kid-blog #kb-content a h2, #kid-blog #kb-content a h2 * { word-break: normal; word-break: auto-phrase; overflow-wrap: anywhere; text-wrap: balance; }
