@charset "utf-8";
/* フランチャイズ加盟募集（/fc）。2026-10-06 新設。
 * ⚠ 見た目はトップページに合わせる。.top-ttl-area と曲線の区切りは top.css と同じ値を写した
 *   （/fc では top.css を読まない＝トップ専用の規則が大量に付いてくるため）。
 *   トップ側を変えたら、ここも見ること。
 * ⚠ 色は common.css の決まりのまま。赤 #B6232A・罫線 #E8E8E8・薄い背景 #FAFAFA・暗い帯 #313131。 */

/* ---- トップと同じ見出し（top.css の .top-ttl-area を写した） ---- */
#fc .top-ttl-area{margin-bottom:20px}
#fc .top-ttl-area h2{font-size:2.5rem;font-weight:600;line-height:1.5}
#fc .top-ttl-area .ttl-en{display:flex;align-items:center;font-size:1.2rem}
#fc .top-ttl-area .ttl-en::before{content:"";display:block;width:30px;height:1px;margin-right:8px;background:#2B2B2B}
@media (min-width:1025px){
	#fc .top-ttl-area{margin-bottom:30px}
	#fc .top-ttl-area h2{font-size:3rem}
	#fc .top-ttl-area .ttl-en{font-size:1.3rem}
}

/* ---- MV ---- */
#fc .fc-mv{position:relative}
/* ⚠ height で高さを決めない。common.css の img{height:auto !important} に負ける
   （レイヤーの外の !important なので打ち消せない）。aspect-ratio なら効く。 */
#fc .fc-mv-img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center 32%}
#fc .fc-mv-body{background:#FAFAFA;padding:30px 0 40px}
@media (min-width:1025px){
	#fc .fc-mv-img{aspect-ratio:24/7}
	#fc .fc-mv-body{padding:50px 0 60px}
}
#fc .fc-mv-body p{line-height:2}
#fc .fc-mv-body p+p{margin-top:12px}
#fc .fc-mv-body b{font-size:2.4rem;font-weight:600;color:#B6232A;padding:0 3px;font-variant-numeric:tabular-nums}
@media (min-width:1025px){#fc .fc-mv-body b{font-size:3rem}}
/* ⚠ common.css の .btn は margin:0（.btn-black / .btn-border）。
   真ん中に置くには auto を入れ直す（2026-10-06 本部指示）。 */
#fc .fc-mv-body .btn{margin:26px auto 0}

/* ---- セクション。曲線はトップと同じSVGを使う ---- */
#fc .fc-sec{position:relative;padding:40px 0}
@media (min-width:1025px){#fc .fc-sec{padding:70px 0}}
#fc .fc-sec-gray{background:#FAFAFA}
/* ⚠ 曲線は上の白地を切り取る形。帯の内側に重ねるので pointer-events を切る */
#fc .fc-curve{position:absolute;top:-1px;left:0;width:100%;height:40px;fill:#FFF;pointer-events:none}
@media (min-width:1025px){#fc .fc-curve{height:70px}}
#fc .fc-sec-gray>.inner{position:relative;padding-top:20px}
@media (min-width:1025px){#fc .fc-sec-gray>.inner{padding-top:40px}}

#fc .fc-sub{margin-bottom:24px}
#fc .fc-note{margin-top:20px;font-size:1.2rem;line-height:1.9;color:#777}
#fc .fc-cap{margin-top:8px;font-size:1.1rem;color:#777;text-align:right}

/* ---- 写真 ---- */
#fc .fc-photo-wide{margin:0 0 30px}
#fc .fc-photo-wide img{width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:4px}
#fc .fc-col2{display:grid;gap:24px;align-items:start}
@media (min-width:835px){#fc .fc-col2{grid-template-columns:1fr 1fr;gap:40px}}
#fc .fc-col2-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
#fc .fc-col2-body p{line-height:2}
#fc .fc-col2-body p+p{margin-top:14px}
#fc .fc-col2-body .btn{margin:24px auto 0}

/* ---- 3つ並び。⚠ 数を3に固定しない。列は中身の数で決まる ---- */
#fc .fc-point{display:grid;gap:16px}
@media (min-width:835px){#fc .fc-point{grid-template-columns:repeat(3,1fr);gap:20px}}
#fc .fc-point>li{border:1px solid #E8E8E8;background:#FFF;padding:24px;border-radius:4px}
#fc .fc-point h3{font-size:1.6rem;font-weight:600;margin-bottom:10px}
#fc .fc-point p{font-size:1.3rem;line-height:1.9}

#fc .fc-two{display:grid;gap:30px}
@media (min-width:835px){#fc .fc-two{grid-template-columns:1fr 1fr;gap:40px}}
#fc .fc-two h3{font-size:1.6rem;font-weight:600;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid #B6232A}
#fc .fc-list>li{position:relative;padding-left:16px;margin-bottom:10px;font-size:1.3rem;line-height:1.8}
#fc .fc-list>li:before{content:"";position:absolute;left:0;top:11px;width:7px;height:1px;background:#2B2B2B}

/* ---- 表 ---- */
#fc .fc-table{border:1px solid #E8E8E8;background:#FFF;min-width:420px}
#fc .fc-table th{background:#F2F2F2;text-align:left;font-weight:600;font-size:1.3rem;border-bottom:1px solid #E8E8E8}
#fc .fc-table td{border-bottom:1px solid #E8E8E8;font-size:1.4rem;vertical-align:middle}
#fc .fc-table .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
#fc .fc-table .sum td{background:#FAFAFA;font-weight:600}
#fc .fc-table .total td{background:#B6232A;color:#FFF;font-weight:600;font-size:1.6rem}
#fc .fc-table .warn{color:#B6232A;font-size:1.2rem}

/* ---- 流れ ---- */
#fc .fc-flow{display:grid;gap:14px}
@media (min-width:835px){#fc .fc-flow{grid-template-columns:repeat(3,1fr);gap:20px}}
#fc .fc-flow>li{display:flex;gap:14px;border:1px solid #E8E8E8;background:#FFF;padding:20px;border-radius:4px}
#fc .fc-flow .no{flex-shrink:0;font-family:"Times New Roman",serif;font-size:2rem;line-height:1;color:#B6232A}
#fc .fc-flow h3{font-size:1.5rem;font-weight:600;margin-bottom:6px}
#fc .fc-flow p{font-size:1.25rem;line-height:1.8}

/* ---- FAQ ---- */
#fc .fc-faq{border-top:1px solid #E8E8E8}
#fc .fc-faq dt{font-size:1.5rem;font-weight:600;padding:22px 0 8px;line-height:1.7}
#fc .fc-faq dd{padding-bottom:22px;border-bottom:1px solid #E8E8E8;font-size:1.3rem;line-height:1.95}
#fc .fc-faq dd a{display:inline;color:#B6232A;text-decoration:underline}

/* ---- 送り出し。トップの #top-recruit と同じ暗い帯 ---- */
#fc .fc-cta{background:#313131;color:#FFF;text-align:center;padding:40px 0}
@media (min-width:1025px){#fc .fc-cta{padding:70px 0}}
#fc .fc-cta .fc-cta-ttl{font-size:1.8rem;font-weight:600;margin-bottom:14px;line-height:1.6}
@media (min-width:1025px){#fc .fc-cta .fc-cta-ttl{font-size:2.4rem}}
#fc .fc-cta p{font-size:1.3rem;line-height:1.95;max-width:720px;margin:0 auto}
#fc .fc-cta .btn{margin:26px auto 0}
#fc .fc-cta .fc-note{color:#BBB}

/* ---- 数字の帯。トップの #top-stats と同じ見た目（値を写した） ----
 * ⚠ トップ側（top-own.css の #top-stats）を変えたら、ここも見ること。 */
#fc .fc-stats{background:#2B2B2B;color:#FFF;padding:44px 0 50px}
@media (min-width:1025px){#fc .fc-stats{padding:70px 0 80px}}
#fc .fc-stats .stats-hd{text-align:center;margin-bottom:28px}
@media (min-width:1025px){#fc .fc-stats .stats-hd{margin-bottom:40px}}
#fc .fc-stats .stats-hd .en{font-size:1.1rem;letter-spacing:.3em;color:#9A9A9A}
#fc .fc-stats .stats-hd h2{margin-top:8px;font-size:2.2rem;font-weight:600}
@media (min-width:1025px){#fc .fc-stats .stats-hd h2{font-size:2.8rem}}
#fc .fc-stats .stats-list{display:grid;grid-template-columns:1fr 1fr;gap:26px 0;max-width:960px;margin:0 auto}
@media (min-width:835px){#fc .fc-stats .stats-list{grid-template-columns:repeat(4,1fr);gap:0}}
#fc .fc-stats .stats-list li{text-align:center;padding:0 8px}
/* ⚠ 区切りは縦の細線。2列のときに左端へ線が出ないよう、4列のときだけ付ける */
@media (min-width:835px){#fc .fc-stats .stats-list li+li{border-left:1px solid #4A4A4A}}
#fc .fc-stats .num{display:flex;align-items:baseline;justify-content:center;gap:4px}
/* ⚠ 数字は折り返さない。body の word-break:break-all で「4,0／00」と割れる */
#fc .fc-stats .num .n{font-size:3.6rem;line-height:1;white-space:nowrap}
@media (min-width:1025px){#fc .fc-stats .num .n{font-size:5rem}}
#fc .fc-stats .num .u{font-size:1.2rem;color:#CFCFCF;white-space:nowrap}
#fc .fc-stats .lb{margin-top:10px;font-size:1.1rem;letter-spacing:.1em;color:#9A9A9A;line-height:1.5}

/* ---- スマホで見たときの手当て（2026-10-06 本部指示で点検） ----
 * ⚠ ① グリッドの子は既定が min-width:auto。中に min-width のある表が入ると
 *   縮めなくなって、.scroll-x があってもページごと横にはみ出す（375pxで71px出ていた）。
 *   /school-info で踏んだ min-w-0 と同じ話。 */
#fc .fc-col2>*{min-width:0}

/* ⚠ ② common.css の body{word-break:break-all} は本文にも効く。
 *   「借入1,0／00万円程度」のように**数字の途中で**折れていた（FAQで実際に出ていた）。
 *   hp-own.css は見出しだけ normal に戻している（本文は長いURL対策でそのまま）ので、
 *   このページの本文もここで戻す。長い英数字は overflow-wrap:anywhere で逃がす。 */
#fc p,#fc li,#fc dt,#fc dd,#fc td,#fc th,#fc .lb{
	word-break:normal;
	overflow-wrap:anywhere;
}

/* ⚠ ③ 表は横スクロールで逃がすが、はみ出す量は少ないほうがいい */
@media (max-width:560px){#fc .fc-table{min-width:340px}}

/* ---- 送り出しのボタン2つ（資料請求・お問い合わせ）2026-10-06 ---- */
#fc .fc-cta-btns{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:26px}
@media (min-width:561px){#fc .fc-cta-btns{flex-direction:row;justify-content:center;gap:16px}}
/* ⚠ 幅をそろえる。common.css の .btn / .btn-white / .btn-border は
   max-width がばらばら（280・280・270）で、縦に並べたときに端がずれる */
#fc .fc-cta-btns .btn{margin:0;width:100%;max-width:280px}
/* 暗い帯の上の「白枠」ボタン。common.css の .btn-border は赤文字・赤枠で、
   濃い地では読めないのでここで作る */
#fc .btn-border-w{color:#FFF;background:none;border:2px solid #FFF}
#fc .btn-border-w:hover{color:#2B2B2B;background:#FFF;border-color:#FFF}
#fc .fc-mail{margin-top:18px;font-size:1.2rem;color:#CFCFCF}
#fc .fc-mail a{display:inline;color:#FFF;text-decoration:underline}

/* ---- ヒーローの想いの一行（2026-10-06 本部指示） ----
 * ⚠ 見出し（h2 フランチャイズ加盟募集）より大きくする。ページの題名は小さく、
 *   伝えたいことを大きく。明朝にするのはトップの「数字で見る」と同じ考え方。 */
#fc .fc-msg{
	font-family:"Hiragino Mincho ProN W3","ヒラギノ明朝 ProN","Hiragino Mincho ProN","Noto Serif JP",serif;
	font-size:2.2rem;line-height:1.75;font-weight:600;margin:4px 0 18px;
	word-break:normal;overflow-wrap:anywhere;text-wrap:balance;
}
@media (min-width:1025px){#fc .fc-msg{font-size:3.4rem;margin:8px 0 24px}}
/* ⚠ 想いの一行は、意味のかたまりごとに折り返す。
   inline-block で中を折らせない。ただし入りきらないときは中でも折る（溢れさせない）。 */
#fc .fc-msg .l{display:inline-block;overflow-wrap:anywhere}

/* ⚠ 費用の表は写真を外して1段になった（2026-10-07）。
   幅いっぱいに伸ばすと1行が長すぎるので止める。 */
#fc .fc-table-wrap{max-width:680px}

/* ---- このページだけ、フッターの問い合わせ一式を隠す（2026-10-07 本部指示） ----
 * ⚠ このファイルは /fc でしか読み込まれない（pages.json）。ほかのページのフッターは変わらない。
 * ページの最後に「資料請求する／お問い合わせ」（送り先 prkidacademy@gmail.com）を置いたのに、
 * そのすぐ下にフッターの「パンフレット請求／お問い合わせ／代表電話」が続いていて、
 * 同じようなボタンが4つ並んでいた。しかもフッター側は**保護者向け**の窓口で、
 * 加盟を検討している人が押すと行き先が違う。
 * ⚠ 隠すのは .footer-cta だけ。ロゴ・住所・サイト内のナビ・事業一覧は残す。
 * ⚠ ヘッダーのパンフレット請求は残してある（ヘッダーは全ページ同じにしておく約束）。 */
footer .footer-cta { display: none; }

/* ---- 資料請求・お問い合わせフォーム（2026-10-07。mailto から差し替え） ----
 * ⚠ 濃い地（#313131）の上に置くので、欄は白地・文字は黒に戻す。
 *   common.css の input は白地・黒文字なのでほぼそのままだが、ラベルは白にする。 */
#fc .fc-form{max-width:760px;margin:26px auto 0;text-align:left}
#fc .fc-form-row{display:grid;gap:14px}
@media (min-width:681px){#fc .fc-form-row{grid-template-columns:1fr 1fr;gap:16px}}
#fc .fc-form-row+.fc-form-row{margin-top:14px}
@media (min-width:681px){#fc .fc-form-row+.fc-form-row{margin-top:16px}}
#fc .fc-form label{display:block}
#fc .fc-form label>span{display:block;font-size:1.2rem;font-weight:600;margin-bottom:6px;color:#FFF}
#fc .fc-form label>span em{font-style:normal;font-size:1.05rem;font-weight:400;margin-left:8px;color:#BBB}
#fc .fc-form label>span em.req{color:#FFF;background:#B6232A;padding:1px 6px;border-radius:3px}
#fc .fc-form input[type="text"],
#fc .fc-form input[type="tel"],
#fc .fc-form input[type="email"],
#fc .fc-form select,
#fc .fc-form textarea{width:100%;background:#FFF;color:#2B2B2B;border:1px solid #B4B4B4;border-radius:6px;padding:10px 14px;font-size:1.4rem}
#fc .fc-form select{height:44px}
#fc .fc-form textarea{min-height:110px;line-height:1.8}
#fc .fc-form-wide{margin-top:14px}
@media (min-width:681px){#fc .fc-form-wide{margin-top:16px}}
#fc .fc-agree{display:flex;align-items:center;gap:8px;margin-top:16px;font-size:1.2rem;color:#FFF}
#fc .fc-agree input{width:18px;height:18px;flex-shrink:0;accent-color:#B6232A}
#fc .fc-agree a{display:inline;color:#FFF;text-decoration:underline}
/* ⚠ 罠の欄。display:none だと機械に見抜かれるので画面の外へ出す */
#fc .fc-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
#fc .fc-form-err{margin-top:14px;font-size:1.3rem;color:#FFC9C9}
#fc .fc-form button[type="submit"]{margin:22px auto 0}
#fc .fc-done{max-width:680px;margin:26px auto 0}
#fc .fc-done-ttl{font-size:1.8rem;font-weight:600;margin-bottom:10px}
