/* ============================================================
   fami-con.co.jp  ── 現行デザインを可変幅にし、寸法を整えるCSS
   2026-09-08

   ■ このファイルの立ち位置
   テーマ（TCD law_tcd031）のCSSの後ろに読み込んで上書きする。
   デザインそのものは変えない。色も写真の使い方もレイアウトも現行のまま。
   直すのは「幅」と「寸法（文字・余白・ボタン）」だけ。

   ■ 基準にするサイト（本人が指定・2026-09-08 実測）

     マネーフォワード  https://corp.moneyforward.com/aboutus/message/
       本文 15px / 行間2.27 / 幅840px（56文字）
       H2 50px / 1.40
       ボタン 高さ50px / 15px / 角丸25px（ピル）
       セクション余白 50〜70px  コンテナ 1000〜1100px
       書体 Noto Sans Japanese

     freee            https://corp.freee.co.jp/company/
       本文 14px / 行間1.80
       H1 44px / 1.00   H2 40px / 1.80   小見出し 17px / 1.80
       セクション余白 42〜80px  コンテナ 1000px（35回・明確）

   ■ 2社から読み取れたこと（ここが「今風」の中身）
   ・見出しと本文の比が大きい。freeeは 44px 対 14px で 3.1倍
   ・本文はむしろ小さめ（14〜15px）で、行間を広く取る（1.8〜2.3）
   ・コンテナは1000px前後。1200pxより狭い
   ・ボタンは高さ50px前後・文字15px・角丸はピル型
   ・セクションの上下は50〜80px

   ■ 採用する基準値。以後この表の外の数字を使わない

     コンテナ      1000px
     本文          15px / 行間2.0 / 段落下28px
     本文幅        840px（約56文字）
     小見出し      17px / 行間1.8 / 上40px 下14px
     節見出し      30px / 行間1.5 / 上64px 下24px
     ページ見出し   44px / 行間1.2
     トップ大見出し 40px / 行間1.5
     補助・表      13px / 行間1.8
     ボタン        高さ52px / 文字15px / 角丸26px
     セクション    上下80px（画面が狭いときは48px）
     フッター      リンク14px

   ■ 変更するときの約束
   ここに無い数字を新しく足さない。足すときはこの表を先に直す。
   ============================================================ */

:root{
  --fc-max:1000px;      /* 全体の最大幅。2社とも1000px */
  --fc-text:840px;      /* 本文の幅。約56文字。マネーフォワードと同じ */
  --fc-gap:80px;        /* セクションの上下 */
  --fc-gap-sp:48px;
  --fc-radius:26px;     /* ボタンの角丸。ピル型 */
  --fc-navy:#282c45;
  --fc-blue:#1c68b4;
}


/* ------------------------------------------------------------
   0. clearfix の擬似要素を止める

   テーマは `.clearfix:after { content:"." }` で回り込みを解除している。
   float のときは見えないが、**その要素を flex / grid に変えると
   擬似要素が1つのマスとして数えられる。**

   実際、お知らせ（ol.clearfix）を3列グリッドにしたところ、
   1マス目が空になり、記事が1つずつ後ろへずれた（2026-09-08 の指摘）。
   grid / flex に変える要素では、必ず先に止めること。
   ------------------------------------------------------------ */
#index_news ol.clearfix::before,
#index_news ol.clearfix::after,
#index_content1_top.clearfix::before,
#index_content1_top.clearfix::after,
#index_news li.clearfix::before,
#index_news li.clearfix::after,
#archive_post_list.clearfix::before,
#archive_post_list.clearfix::after,
#archive_post_list .post_item.clearfix::before,
#archive_post_list .post_item.clearfix::after,
#previous_next_post.clearfix::before,
#previous_next_post.clearfix::after{
  content:none !important;
  display:none !important;
}


/* ------------------------------------------------------------
   1. 固定幅をやめる

   style-pc.css は body 自体に min-width:1200px を掛けている。
   これを外さない限り、他を何度直しても横スクロールは消えない。
   ------------------------------------------------------------ */
html, body,
#header, #footer_top, #index_staff, #main_image_headline { min-width:0 !important; }
html, body { overflow-x:hidden; }

#header_inner,
#index_content1_top,
#index_content1_bottom,
#index_news,
#footer_top_inner,
#footer_bottom,
#main_contents,
#main_image_headline span {
  width:100% !important;
  max-width:var(--fc-max) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box;
  padding-left:32px;
  padding-right:32px;
}


/* ------------------------------------------------------------
   2. ヘッダー
   ------------------------------------------------------------ */
@media (min-width:961px){
  #header_inner{
    height:auto !important;
    display:flex; align-items:center; flex-wrap:wrap; gap:0 32px;
    padding-top:22px; padding-bottom:0;
  }
  #logo_image{ position:static !important; flex:0 0 auto; }
  #header_tel_contact{
    position:static !important; margin-left:auto !important;
    display:flex; align-items:center; gap:26px;
  }
  #header_tel_contact li{ float:none !important; margin:0 !important; }
  .global_menu{ position:static !important; flex:1 1 100%; margin-top:18px; }
  .global_menu > ul{ display:flex; flex-wrap:wrap; justify-content:flex-end; }
  .global_menu > ul > li{ float:none !important; }
}
#header_tel span.label  { font-size:13px !important; line-height:1.6 !important; }
#header_tel span.number { font-size:clamp(22px, 1.9vw, 28px) !important; line-height:1.3 !important; }


/* ------------------------------------------------------------
   3. ボタンとメニュー ── 高さ52px / 文字15px / 角丸26px

   マネーフォワードが 50px / 15px / 角丸25px（ピル型）。
   角を丸めるかどうかで印象がいちばん変わるので、ここは寄せる。
   ------------------------------------------------------------ */
.global_menu > ul > li > a{
  font-size:15px !important;
  height:52px !important;
  line-height:52px !important;
  padding:0 clamp(14px, 1.5vw, 26px) !important;
}
.global_menu > ul{ height:52px !important; }
.global_menu ul ul a{
  font-size:14px !important; height:auto !important;
  line-height:1.7 !important; padding:13px 18px !important;
}
#header_contact a{
  font-size:15px !important;
  height:52px !important; line-height:52px !important;
  padding:0 30px 0 60px !important;
  background-position:26px 18px !important;
  border-radius:var(--fc-radius) !important;
}


#index_news .link_button{
  float:none !important; display:block;
  width:auto !important; max-width:240px;
  margin:40px auto 0 !important;
  height:52px !important; line-height:52px !important;
  font-size:15px !important;
  background:var(--fc-navy) !important;
  border-radius:var(--fc-radius) !important;
}
#index_news .link_button:hover{ background:var(--fc-blue) !important; }


/* ------------------------------------------------------------
   4. 見出し
   ------------------------------------------------------------ */
/* freee の H1 44px 対 本文14px（3.1倍）に倣い、比を大きく取る */
#main_image_headline{
  font-size:clamp(24px, 3.2vw, 44px) !important;
  height:auto !important; line-height:1.2 !important;
  padding-top:22px !important; padding-bottom:22px !important;
}
#index_content1_bottom .headline{
  font-size:clamp(26px, 3vw, 40px) !important;
  line-height:1.5 !important;
}
#index_news .headline{ font-size:30px !important; line-height:1.5 !important; margin-bottom:36px !important; }
#index_content1_top .headline{ font-size:18px !important; line-height:1.6 !important; }


/* ------------------------------------------------------------
   5. 本文
   ------------------------------------------------------------ */
.post_content > p,
.post_content > ul,
.post_content > ol,
.post_content > h2,
.post_content > h3,
.post_content > blockquote,
.post_content > hr { max-width:var(--fc-text); }
.post_content > table{ max-width:960px; }

.post_content p,
.post_content li{ font-size:15px !important; line-height:2.0 !important; }
.post_content p{ margin:0 0 28px !important; }
.post_content li{ margin-bottom:10px !important; }
.post_content ul{ padding-left:1.4em; margin:0 0 24px; }

.post_content h2{
  font-size:30px !important; line-height:1.35 !important;
  /* 見出しの文字と下の罫線のあいだが空きすぎだという指摘（2026-09-09）。
     行間1.5と下余白16pxで、文字の下に24px近い空白ができていた。 */
  margin:64px 0 16px !important;
  padding-bottom:8px !important;
  border-bottom:1px solid #ddd;
}
.post_content h3{
  font-size:17px !important; line-height:1.8 !important;
  margin:40px 0 14px !important;
}
/* 段落の頭の太字は、小見出しとして1行に立てる。
   商品ページの「**投下した資金を回収できないことがあります。**」などが対象。

   `:first-child` はテキストを数えないため、文の途中の太字まで拾ってしまう。
   ビルド側（mark_lead_bold）で、本当に段落の先頭から始まる太字にだけ
   `fc-lead` を付け、こちらを見る（2026-09-09 の指摘）。 */
.post_content p.fc-lead > strong:first-child{ display:block; margin-bottom:6px; }
/* 現行のまま移したページには当てない。
   FD宣言のように「・太字のリンク<br>・太字のリンク」と並べている箇所で、
   1行目のあとだけ余分に空いてしまう。 */
body.fc-keep .post_content p.fc-lead > strong:first-child{ display:inline; margin-bottom:0; }

/* 表。項目名の欄は幅を決め、残りを本文に回す。
   自動配分だと項目名の欄が半分近くを占め、右側の文章が細く折り返して
   読みにくかった（2026-09-09 の指摘・募集要項）。 */
.post_content table{
  border-collapse:collapse; width:100%; margin:0 0 28px;
  background:#fff; table-layout:fixed;
}
.post_content th, .post_content td{
  border:1px solid #ddd; padding:16px 20px;
  text-align:left; vertical-align:top;
  font-size:15px !important; line-height:1.9 !important;
  word-break:normal; overflow-wrap:anywhere;
}
.post_content td:first-child,
.post_content th:first-child{
  width:200px; background:#f7f8fa; font-weight:700;
}
.post_content thead th{ background:#f4f6f9; }

@media (max-width:600px){
  .post_content table{ table-layout:auto; }
  .post_content td:first-child,
  .post_content th:first-child{ width:auto; white-space:nowrap; }
  .post_content th, .post_content td{ padding:12px 14px; font-size:14px !important; }
}

.post_content blockquote{
  margin:0 0 28px; padding:24px 28px;
  background:#f4f6f9; border-left:3px solid var(--fc-blue);
}
.post_content blockquote p{ font-size:14px !important; line-height:1.9 !important; margin:0 0 12px !important; }
.post_content blockquote p:last-child{ margin:0 !important; }
.post_content hr{ border:0; border-top:1px solid #ddd; margin:56px 0; }

#page_post{ padding-top:8px; padding-bottom:var(--fc-gap); }


/* ------------------------------------------------------------
   6. トップ ── 3つのブロック

   もとの箱は320px固定。アイコンの帯が98pxあり、
   アイコン自体は50px弱で残りは空白だった。
   ------------------------------------------------------------ */
#index_content1_top{ display:flex; gap:0; }
#index_content1_top .box{
  width:auto !important; flex:1 1 0; float:none !important;
  height:auto !important; min-height:0 !important; padding-bottom:0 !important;
}
#index_content1_top .box .link{
  display:block; height:100% !important;
  padding:32px 30px !important; margin-top:0 !important;
  box-sizing:border-box;
}
#index_content1_top .headline{ margin:0 0 18px !important; }
#index_content1_top .image{
  height:56px !important;
  background-size:auto 48px !important;
  background-position:center !important;
}
#index_content1_top .desc{
  font-size:14px !important; line-height:2.0 !important;
  margin:18px 0 0 !important; max-height:none !important;
}

#index_content1_bottom{ margin-bottom:var(--fc-gap) !important; padding-top:var(--fc-gap) !important; }
#index_content1_bottom .desc{
  font-size:15px !important; line-height:2.0 !important;
  max-width:var(--fc-text); margin-left:auto !important; margin-right:auto !important;
}


/* ------------------------------------------------------------
   7. 一覧ページの商品カード
   ------------------------------------------------------------ */
.post_content .wp-block-columns{
  display:flex !important; flex-wrap:wrap !important;
  gap:36px !important; margin:0 0 36px !important; max-width:none;
}
.post_content .wp-block-column{
  flex:1 1 260px !important; min-width:0 !important; margin:0 !important;
}
.post_content .wp-block-column:empty{ display:none !important; }
.post_content .wp-block-column figure{ margin:0 0 16px !important; }
.post_content .wp-block-column figure img{
  width:100%; height:200px; object-fit:cover; display:block;
}
.post_content .wp-block-column h3{
  font-size:17px !important; margin:0 0 10px !important; line-height:1.8 !important;
}
.post_content .wp-block-column h3 a{ text-decoration:none; }
.post_content .wp-block-column h3 a:hover{ text-decoration:underline; }
.post_content .wp-block-column p{
  font-size:14px !important; line-height:1.9 !important; margin:0 !important; color:#555;
}


/* ------------------------------------------------------------
   8. お知らせ ── 2列だと3件目が取り残されるので3列に
   ------------------------------------------------------------ */
#index_news{ padding-top:0 !important; padding-bottom:var(--fc-gap) !important; }
#index_news ol{
  display:grid !important; grid-template-columns:repeat(3, 1fr) !important;
  gap:36px !important; margin:0 !important; width:auto !important;
}
#index_news li{
  width:auto !important; float:none !important; margin:0 !important;
  display:flex !important; flex-direction:column; gap:12px;
}
/* サムネイルは切り抜かない。
   元画像が帯（737x163）・ロゴ（211x50）・書影（466x835）と縦横比がばらばらで、
   cover で 288x170 に切り抜くと文字が拡大されて潰れていた（2026-09-09 の指摘）。
   scale-down は「枠に収める、ただし元の大きさは超えない」。小さい画像を
   引き伸ばさないので、ロゴがぼやけない。 */
#index_news li a.image{
  width:100% !important; height:140px !important;
  float:none !important; margin:0 !important;
  display:flex !important; align-items:center; justify-content:center;
  overflow:hidden; background:#fff; border:1px solid #e8eaee;
  box-sizing:border-box; padding:10px;
}
#index_news li a.image img{
  width:auto !important; height:auto !important;
  max-width:100% !important; max-height:100% !important;
  object-fit:scale-down !important; display:block !important;
}
#index_news li .date{ margin:0 !important; font-size:13px !important; color:#666; }
#index_news li .title{ font-size:15px !important; line-height:1.8 !important; display:block; }


/* ------------------------------------------------------------
   9. フッター
   ------------------------------------------------------------ */
#footer_top_inner{ padding:var(--fc-gap) 32px !important; }
#footer_menu .footer_menu > ul > li:first-child{ font-size:15px !important; font-weight:700; }
#footer_top a{ font-size:14px !important; line-height:2.1 !important; }
#footer_bottom, #copyright, #footer_address{ font-size:13px !important; line-height:1.9 !important; }
#bread_crumb, #bread_crumb li, #bread_crumb a{ font-size:13px !important; line-height:1.8 !important; }
#bread_crumb{ padding-top:20px !important; padding-bottom:4px !important; }


/* ------------------------------------------------------------
   10. 画面が狭いとき
   ------------------------------------------------------------ */
@media (max-width:960px){
  :root{ --fc-gap:var(--fc-gap-sp); }
  #header_inner, #index_content1_top, #index_content1_bottom, #index_news,
  #footer_top_inner, #footer_bottom,
  #main_contents, #main_image_headline span{ padding-left:20px; padding-right:20px; }

  #index_content1_top{ top:0 !important; flex-wrap:wrap; }
  #index_content1_top .box{ flex:1 1 100%; }
  #index_content1_top .box .link{ padding:24px 20px !important; }
  #index_content1_top .image{ height:46px !important; background-size:auto 40px !important; }
  #index_content1_top .headline{ margin-bottom:12px !important; }
  #index_content1_top .desc{ margin-top:12px !important; }

  #header_inner{ height:auto !important; padding-top:16px; padding-bottom:16px; text-align:center; }
  #logo_image{ position:static !important; display:inline-block; }
  #logo_image img{ max-width:240px; height:auto; }
  #header_tel_contact{
    position:static !important; margin-top:14px !important;
    display:flex; justify-content:center; gap:18px; flex-wrap:wrap;
  }
  #header_tel_contact li{ float:none !important; margin:0 !important; }
  .global_menu{ position:static !important; margin-top:14px; }
  .global_menu > ul{ display:flex; flex-wrap:wrap; justify-content:center; height:auto !important; }
  .global_menu > ul > li{ float:none !important; }
  .global_menu > ul > li > a{ height:46px !important; line-height:46px !important; padding:0 14px !important; }
  .global_menu ul ul{ display:none !important; }

  #index_news ol{ grid-template-columns:repeat(2, 1fr) !important; gap:28px !important; }
  #main_image img{ height:200px; object-fit:cover; }
}

@media (max-width:600px){
  .post_content p, .post_content li{ font-size:15px !important; line-height:1.9 !important; }
  .post_content h2{ font-size:24px !important; margin-top:44px !important; }
  .post_content h3{ font-size:17px !important; margin-top:28px !important; }
  .post_content > p, .post_content > ul, .post_content > ol,
  .post_content > h2, .post_content > h3, .post_content > blockquote{ max-width:none; }
  .post_content table{ display:block; overflow-x:auto; }

  #index_content1_top .image{ height:44px !important; }
  #index_news ol{ grid-template-columns:1fr !important; gap:24px !important; }
  #index_news li{ flex-direction:row !important; gap:14px; }
  #index_news li a.image{ width:100px !important; height:100px !important; flex:none; }
  #main_image img{ height:150px; }
}


/* ------------------------------------------------------------
   12. 会社概要の写真

   代表挨拶の写真、署名、コンサルタント4名。
   一度これを落として文章だけにしてしまい、指摘を受けた（2026-09-08）。
   ------------------------------------------------------------ */
.fc-greeting-photo{
  float:right; width:240px; margin:0 0 24px 32px;
}
.fc-greeting-photo img{ width:100%; height:auto; display:block; }
/* 署名。180pxだと本文15pxに対して署名の文字が小さく見えた（2026-09-09 の指摘）。
   現行サイトは299px幅で置いている。その手前まで大きくする。 */
.fc-sign{ display:block; width:250px; height:auto; margin:12px 0 0; }

/* 会社情報 ── 枠線と地の色をやめ、現行サイトと同じ定義リストの並びに戻す。
   現行は dt 209px・dd との間隔20px・行間2.2（2026-09-09 の指摘）。
   罫線は行の区切りに薄いものを1本だけ引く。表組みには見せない。 */
.post_content .fc-info{ max-width:var(--fc-text); margin:0 0 8px; }
.post_content .fc-info dl{
  display:flex; align-items:baseline; gap:20px;
  margin:0; padding:14px 0;
  border-bottom:1px solid #eee;
}
.post_content .fc-info dl:first-child{ border-top:1px solid #eee; }
.post_content .fc-info dt{
  width:200px; flex:none; margin:0;
  font-weight:700; line-height:1.9;
}
.post_content .fc-info dd{ margin:0; flex:1; line-height:1.9; }

/* 一覧のカード。
   ・テーマは写真の高さを200pxに決め打ちしていて、幅は元画像の比で決まる。
     個人向けは元画像が509x339と小さく、写真300pxに対して文章450pxとなり、
     文字が写真からはみ出して見えていた（2026-09-09 の指摘）。
   ・列は flex で、中身の無い列が潰れる。2件のときと4件のときで幅が変わる。
   3列の格子に固定し、写真は列いっぱいに、比は3:2で揃える。 */
.post_content .wp-block-columns{
  display:grid !important;
  grid-template-columns:repeat(3, 1fr) !important;
  gap:36px 28px !important;
  max-width:none !important;
}
.post_content .wp-block-column{ width:auto !important; flex:none !important; }
.post_content .wp-block-column figure{ margin:0 0 12px !important; }
.post_content .wp-block-column img{
  width:100% !important; height:auto !important;
  aspect-ratio:3/2; object-fit:cover; display:block;
}
.post_content .wp-block-column h3{ margin:0 0 6px !important; }
.post_content .wp-block-column p{ margin:0 !important; font-size:14px !important; line-height:1.9 !important; }

@media (max-width:820px){
  .post_content .wp-block-columns{ grid-template-columns:repeat(2, 1fr) !important; }
}
@media (max-width:520px){
  .post_content .wp-block-columns{ grid-template-columns:1fr !important; }
}

/* 相談への導入は、本文と続けて読ませない。
   税務上の取扱いの節から数行ぶん間を空ける（2026-09-09 の指示）。 */
.post_content p.fc-offer{ margin-top:80px !important; }

/* 商品ページの相談ボタン。
   ヘッダー・フッターのボタンと同じ高さ52px・15px・角丸26pxに揃える。 */
.post_content a.fc-cta{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:300px; height:52px; padding:0 32px;
  background:var(--fc-navy); color:#fff;
  font-size:15px; font-weight:700; line-height:1;
  border-radius:var(--fc-radius); text-decoration:none;
}
.post_content a.fc-cta:hover{ background:var(--fc-blue); }
.post_content p:has(> a.fc-cta:only-child){ margin:20px 0 8px; }

@media (max-width:600px){
  .post_content a.fc-cta{ min-width:0; width:100%; padding:0 16px; }
}

/* メディア掲載 ── 写真の枠を揃えた一覧
   現行は画像幅32%の決め打ちで、書影・新聞・横長キャプチャが混在して
   行ごとに高さがばらばらだった（2026-09-09 の指摘）。
   枠を 200x140 に固定し、その中に全体を収める（拡大はしない）。 */
.post_content .fc-press{ max-width:var(--fc-text); margin:0; }
.post_content .fc-press-item{
  display:grid; grid-template-columns:200px 1fr; gap:28px;
  align-items:start; padding:26px 0;
  border-bottom:1px solid #eee;
}
.post_content .fc-press-item:first-child{ border-top:1px solid #eee; }
.post_content .fc-press-img{
  width:200px; height:140px; box-sizing:border-box; padding:8px;
  display:flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid #e8eaee;
}
.post_content .fc-press-img img{
  width:auto; height:auto; max-width:100%; max-height:100%;
  object-fit:scale-down; display:block;
}
/* 写真の無い行も、文章の左端を他の行に揃える */
.post_content .fc-press-item.no-img .fc-press-txt{ grid-column:2; }
.post_content .fc-press-txt p{ margin:0; font-size:14px; line-height:1.9; color:#666; }
.post_content .fc-press-txt strong{
  display:block; margin:2px 0 6px;
  font-size:16px; font-weight:700; line-height:1.75; color:#222;
}
.post_content .fc-press-txt a{ font-size:13px; word-break:break-all; }

@media (max-width:700px){
  .post_content .fc-press-item,
  .post_content .fc-press-item.no-img{ grid-template-columns:1fr; gap:14px; }
  .post_content .fc-press-item.no-img .fc-press-txt{ grid-column:1; }
  .post_content .fc-press-img{ width:160px; height:110px; }
}

/* お問い合わせフォーム
   スグフォーム（外部サービス）の埋め込みを自前に移した。
   項目名を上、入力欄を下に置く。横に並べると幅が足りず、
   スマホでの見え方も揃わない。 */
.post_content .fc-contact{ max-width:var(--fc-text); margin:0 0 8px; }
.post_content .fc-field{ margin:0 0 26px !important; }
.post_content .fc-label{
  display:block; margin-bottom:8px;
  font-size:15px; font-weight:700; line-height:1.8;
}
.post_content .fc-label .req,
.post_content .fc-agree .req{
  display:inline-block; margin-left:10px; padding:2px 8px;
  font-size:11px; font-weight:700; line-height:1.6;
  color:#fff; background:#c0392b; border-radius:3px; vertical-align:2px;
}
.post_content .fc-label .any{
  display:inline-block; margin-left:10px; padding:2px 8px;
  font-size:11px; line-height:1.6; color:#666;
  background:#eef0f3; border-radius:3px; vertical-align:2px;
}
.post_content .fc-contact input[type=text],
.post_content .fc-contact input[type=email],
.post_content .fc-contact input[type=tel],
.post_content .fc-contact select,
.post_content .fc-contact textarea{
  width:100%; box-sizing:border-box;
  padding:12px 14px; font-size:15px; line-height:1.7;
  font-family:inherit; color:#222;
  background:#fff; border:1px solid #ccd1d9; border-radius:4px;
}
.post_content .fc-contact textarea{ resize:vertical; min-height:160px; }
.post_content .fc-contact select{ max-width:280px; height:48px; }
.post_content .fc-contact input:focus,
.post_content .fc-contact select:focus,
.post_content .fc-contact textarea:focus{
  outline:none; border-color:var(--fc-blue);
  box-shadow:0 0 0 3px rgba(28,104,180,.12);
}
.post_content .fc-choices{ display:block; }
.post_content .fc-choices label{
  display:block; margin-bottom:8px; font-size:15px; line-height:1.9; cursor:pointer;
}
.post_content .fc-choices input{ margin-right:8px; }
.post_content .fc-agree{
  margin:0 0 26px !important; padding:16px 18px;
  background:#f7f8fa; border:1px solid #e8eaee;
}
.post_content .fc-agree label{ font-size:15px; line-height:1.9; cursor:pointer; }
.post_content .fc-agree input{ margin-right:8px; }
.post_content .fc-submit{ margin:0 0 20px !important; }
.post_content .fc-contact button{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:300px; height:52px; padding:0 32px;
  font-size:15px; font-weight:700; font-family:inherit; line-height:1;
  color:#fff; background:var(--fc-navy);
  border:0; border-radius:var(--fc-radius); cursor:pointer;
}
.post_content .fc-contact button:hover{ background:var(--fc-blue); }
.post_content .fc-contact button[disabled]{ background:#9aa1ad; cursor:default; }
/* 機械よけの欄。人には見せない */
.post_content .fc-honey{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.post_content .fc-note{ font-size:13px !important; line-height:1.9 !important; color:#666; }
.post_content .fc-error{
  margin:0 0 24px !important; padding:14px 18px;
  font-size:14px !important; color:#8c2b20;
  background:#fdf1ef; border-left:3px solid #c0392b;
}

@media (max-width:600px){
  .post_content .fc-contact button{ min-width:0; width:100%; }
}

/* お知らせの個別ページ
   タイトルが32pxで、しかも中身が長い一文なので5行の塊になっていた。
   写真・本文・リンクの間隔もばらばらだった（2026-09-09 の指摘）。 */
#single_post{ max-width:var(--fc-text); }
#post_title{
  font-size:24px !important; line-height:1.7 !important; font-weight:700;
  margin:0 0 14px !important; padding:0 !important; border:0 !important;
}
#single_post .post_meta{
  margin:0 0 28px !important; padding:0 0 18px !important;
  list-style:none; border-bottom:1px solid #eee;
}
#single_post .post_meta li{ margin:0 !important; padding:0 !important; }
#single_post .entry-date{ font-size:13px !important; color:#666; }
#single_post .post_content p{ margin:0 0 18px !important; }
/* 写真は元の比のまま。ただし書影のように縦長のものは高さを抑える
   （記事本文が2〜3行なのに写真だけ835px、という状態を避ける） */
#single_post .post_content img{
  width:auto !important; height:auto !important;
  max-width:100%; max-height:340px;
  display:block; margin:0 0 24px;
}
#single_post .post_content a{ word-break:break-all; }

/* 掲載先へのリンク。掲載先の名前を小さく上に、リンクを下に置く */
#single_post .post_content p.fc-newslink{
  margin:0 0 12px !important; padding:14px 18px;
  background:#f7f8fa; border-left:3px solid #d8dce3;
}
#single_post .post_content p.fc-newslink .src{
  display:block; margin-bottom:4px;
  font-size:12px !important; line-height:1.6; color:#666;
}
#single_post .post_content p.fc-newslink a{
  font-size:14px !important; line-height:1.8;
}

#previous_next_post{
  max-width:var(--fc-text); margin:40px 0 0 !important;
  padding-top:20px; border-top:1px solid #eee;
  display:flex; justify-content:space-between; gap:16px;
}
#previous_next_post p{ margin:0 !important; font-size:14px !important; }
#previous_next_post #next_post{ text-align:right; }

/* お知らせ一覧 ── 実績・自社メディアと同じ組み方
   テーマは写真を390x195に決め打ちで伸ばしていて、211x50のロゴが
   縦4倍に、466x835の書影が横に潰れていた（2026-09-09 の指摘）。
   枠を240x150に固定し、中に全体を収める。引き伸ばさない。 */
#archive_post_list{ max-width:var(--fc-text); }
#archive_post_list .post_item{
  display:grid !important; grid-template-columns:240px 1fr; gap:28px;
  align-items:start; width:auto !important; float:none !important;
  margin:0 !important; padding:26px 0;
  border-bottom:1px solid #eee;
}
#archive_post_list .post_item:first-child{ border-top:1px solid #eee; }
#archive_post_list .post_item a.image{
  width:240px !important; height:150px !important;
  margin:0 !important; float:none !important;
  box-sizing:border-box; padding:8px; overflow:hidden;
  display:flex !important; align-items:center; justify-content:center;
  background:#fff; border:1px solid #e8eaee;
}
#archive_post_list .post_item a.image img{
  width:auto !important; height:auto !important;
  max-width:100%; max-height:100%;
  object-fit:scale-down; display:block;
}
#archive_post_list .right_content{ width:auto !important; float:none !important; }
#archive_post_list .meta{ margin:0 0 6px !important; padding:0 !important; list-style:none; }
#archive_post_list .entry-date{ font-size:13px !important; color:#666; }
#archive_post_list h3.title{
  font-size:16px !important; line-height:1.75 !important;
  margin:0 !important; padding:0 !important; border:0 !important;
}
#archive_post_list h3.title a{ color:#222; text-decoration:none; }
#archive_post_list h3.title a:hover{ color:var(--fc-blue); }
#archive_headline{ font-size:30px !important; line-height:1.35 !important; margin:0 0 24px !important; }

@media (max-width:700px){
  #archive_post_list .post_item{ grid-template-columns:1fr; gap:14px; }
  #archive_post_list .post_item a.image{ width:180px !important; height:120px !important; }
}

/* 自社メディア ── 写真とテキストを横に並べる
   3つの画像は 1024x282（バナー）・568x320・1024x574 と縦横比がばらばら。
   実績ページと同じ考え方で、枠を 320x180 に固定して中に収める
   （引き伸ばさない）。文章は右に置き、3つの行で左端をそろえる。 */
.post_content .fc-media-row{
  display:grid; grid-template-columns:320px 1fr; gap:28px;
  align-items:start; max-width:var(--fc-text); margin:0 0 8px;
}
.post_content .fc-media-img{
  width:320px; height:180px; box-sizing:border-box; padding:10px;
  display:flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid #e8eaee;
}
.post_content .fc-media-img img{
  width:auto; height:auto; max-width:100%; max-height:100%;
  object-fit:scale-down; display:block;
}
.post_content .fc-media-txt > p{ margin:0 0 14px !important; }
.post_content .fc-media-txt > p:last-child{ margin-bottom:0 !important; }
.post_content p.fc-media-num{
  font-size:14px !important; color:#555; font-weight:700;
  padding-top:12px; border-top:1px solid #eee;
}
.post_content .fc-media-txt a{ font-size:14px; }

@media (max-width:700px){
  .post_content .fc-media-row{ grid-template-columns:1fr; gap:16px; }
  .post_content .fc-media-img{ width:100%; height:160px; }
}

/* 地図 ── 現行サイトにあったものが移行時に落ちていた */
.post_content .fc-map{ max-width:var(--fc-text); margin:0 0 8px; }
.post_content .fc-map iframe{ display:block; width:100%; height:410px; border:0; }

@media (max-width:600px){
  .post_content .fc-info dl{ display:block; padding:12px 0; }
  .post_content .fc-info dt{ width:auto; margin-bottom:2px; }
  .post_content .fc-map iframe{ height:300px; }
}

.fc-staff{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:28px;
  margin:0 0 32px; max-width:none; clear:both;
}
.fc-staff a{
  display:flex; flex-direction:column; gap:8px;
  text-decoration:none; color:inherit;
}
/* 写真は4枚とも 328x468（縦長・比0.70）。
   正方形に切り抜くと頭が切れる。元の比のまま全身を出す。 */
.fc-staff img{
  width:100%; height:auto; display:block;
  aspect-ratio:328/468;
  object-fit:contain;
  background:#f2f4f7;
}
.fc-staff .nm{ font-size:17px; font-weight:700; line-height:1.6; }
.fc-staff .q{ font-size:13px; color:#666; line-height:1.8; }
.fc-staff a:hover .nm{ color:var(--fc-blue); }

@media (max-width:900px){
  .fc-staff{ grid-template-columns:repeat(2, 1fr); gap:24px; }
}
@media (max-width:600px){
  .fc-greeting-photo{ float:none; width:200px; margin:0 auto 24px; }
  .fc-staff{ gap:20px; }
  .fc-staff .nm{ font-size:15px; }
}


/* ------------------------------------------------------------
   13. コンサルタントの個別ページ ── 現行の見え方のまま

   現行は #staff_image（250px＋枠13px＝276px）と #staff_info（878px）の
   float 横並びで、1200pxのコンテナに収まる設計。
   コンテナを1000pxにしたら収まらず表が写真の下に落ちたので、
   このページだけコンテナを1200pxに戻す（2026-09-09 判断：現行の見え方に寄せる）。

   写真の幅・表の幅・名前の文字サイズ・表の文字サイズは、テーマの指定のまま。
   ここで上書きしない。狭い画面だけ縦に積む。
   ------------------------------------------------------------ */
/* 現行と同じ 1200px・パディングなし。
   §1 の左右32pxを外さないと、276 + 878 = 1154px の横並びが収まらない。
   縦に積むのは 1200px 未満だけ（現行なら横スクロールが出る幅）。
   以前 1300px を境にしていたが、Windowsの拡大表示（CSS上1280px前後）で
   写真だけが中央に出て表が下に落ちた（2026-09-09 の指摘）。 */
body.fc-staff-page #main_contents{
  max-width:1200px !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* 名前（#staff_name、下余白25px）の直後に来る「プロフィール」の見出し。
   §5 の .post_content h2 は上余白64pxで、名前と合わせて89px空いていた。
   半分以下にする（2026-09-09 の指摘）。名前の下余白25 + 10 = 35px。 */
body.fc-staff-page .post_content h2{ margin-top:40px !important; }
/* 名前の点線と「プロフィール」のあいだの空白は要らない（2026-09-09 の指摘）。
   名前の下余白25px＋見出しの上余白10pxで35px空いていたのを、ほぼ無くす。 */
/* 「プロフィール」の見出しを外したので、点線のすぐ下に表が来る。
   4pxだと点線と表の枠線がくっつくため、最低限だけ空ける。 */
body.fc-staff-page #staff_name{ margin-bottom:12px !important; }
body.fc-staff-page .post_content > h2:first-child{ margin-top:0 !important; }

@media (max-width:1199px){
  body.fc-staff-page #main_contents{ padding-left:20px !important; padding-right:20px !important; }
  body.fc-staff-page #staff_image{ float:none !important; margin:0 auto 32px !important; }
  body.fc-staff-page #staff_info{ float:none !important; width:auto !important; }
}

/* ------------------------------------------------------------
   11. 確認用の表示（本番では出さない）
   ------------------------------------------------------------ */
.fc-bar{
  background:#1a1f2b; color:#9fb0c8; font-size:12px; padding:8px 24px;
  display:flex; gap:16px; align-items:center; flex-wrap:wrap;
  font-family:"IBM Plex Mono", monospace;
}
.fc-bar .st{ color:#e0a96d; }
.fc-bar label{ margin-left:auto; cursor:pointer; display:flex; gap:6px; align-items:center; }
.fc-memo{
  background:#f3efe6; border:1px solid #dcd3c0; border-left:3px solid #8a5a2b;
  margin:56px 0 0; padding:28px 30px; color:#3a342a; max-width:960px;
}
.fc-memo h2{ font-size:18px !important; margin:0 0 16px !important; border:0 !important; padding:0 !important; }
.fc-memo p, .fc-memo li{ font-size:13px !important; line-height:1.9 !important; }
.fc-memo table{ font-size:12.5px !important; background:rgba(255,255,255,.5); }
.fc-memo th, .fc-memo td{ font-size:12.5px !important; padding:10px 12px !important; }
.fc-memo blockquote{ background:rgba(255,255,255,.55); border-left-color:#8a5a2b; }
.fc-memo blockquote p{ font-size:13px !important; }
body.hide-memo .fc-memo{ display:none; }


/* ------------------------------------------------------------
   14. 携帯でのヘッダー ── ボタン1つにまとめる

   現行のヘッダーは、狭い画面でも「ロゴ／電話番号／お問い合わせ／
   メニュー」を縦に積むため、高さが332pxあった。
   スクロールしないと本文が見えない（2026-09-09 の指摘）。

   900px以下では、ヘッダーを「ロゴ＋ボタン」だけの帯にして、
   残りはボタンを押したときに開く。
   ------------------------------------------------------------ */
#fc-nav-toggle{ display:none; }

@media (max-width:900px){
  #header_inner{ position:relative; padding:10px 64px 10px 16px !important; }

  /* ロゴは左に、小さめに */
  #logo_image{ float:none !important; margin:0 !important; text-align:left; }
  #logo_image img{ max-height:34px; width:auto; }

  /* 開閉ボタン。3本線 */
  #fc-nav-toggle{
    display:block; position:absolute; top:50%; right:12px;
    transform:translateY(-50%);
    width:44px; height:44px; padding:0;
    background:none; border:0; cursor:pointer;
  }
  #fc-nav-toggle span{
    display:block; width:24px; height:2px; margin:5px auto;
    background:#222; transition:transform .2s, opacity .2s;
  }
  body.fc-nav-open #fc-nav-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  body.fc-nav-open #fc-nav-toggle span:nth-child(2){ opacity:0; }
  body.fc-nav-open #fc-nav-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

  /* 閉じているあいだは、電話番号・お問い合わせ・メニューを隠す */
  #header_tel_contact,
  .global_menu{
    display:none !important;
    width:100% !important; float:none !important; margin:0 !important;
  }
  body.fc-nav-open #header_tel_contact,
  body.fc-nav-open .global_menu{ display:block !important; }

  #header_tel_contact{
    padding:14px 16px !important; border-top:1px solid #eee; background:#fff;
  }
  #header_tel_contact li{ float:none !important; width:auto !important; margin:0 0 10px !important; }
  #header_tel #header_tel .label{ display:block; }
  #header_tel .number{ font-size:22px !important; }
  #header_contact a{
    display:block; text-align:center; height:48px; line-height:48px;
    border-radius:24px; font-size:15px !important;
  }

  /* メニューは縦一列。子の階層はそのまま下にぶら下げる */
  .global_menu{ background:#fff; border-top:1px solid #eee; }
  #menu-header{ display:block !important; width:auto !important; }
  #menu-header > li{
    display:block !important; float:none !important; width:auto !important;
    border-bottom:1px solid #eee;
  }
  #menu-header a{
    display:block !important; width:auto !important;
    padding:14px 16px !important; height:auto !important; line-height:1.6 !important;
    font-size:15px !important; text-align:left !important;
  }
  /* 下の階層は、開いたときに常に見える形にする（マウスを乗せられないため）。
     テーマの下層メニューは「濃い背景の小さな吹き出し」なので、
     幅・背景・文字色をすべて上書きしないと、暗い箱に暗い文字で読めない。 */
  #menu-header .sub-menu,
  #menu-header .sub-menu li,
  #menu-header .sub-menu a{
    display:block !important; position:static !important;
    width:auto !important; max-width:none !important; min-width:0 !important;
    height:auto !important; left:auto !important; top:auto !important;
    opacity:1 !important; visibility:visible !important;
    background:transparent !important; box-shadow:none !important;
    border-left:0 !important; border-right:0 !important;
  }
  #menu-header .sub-menu{ background:#f7f8fa !important; }
  #menu-header .sub-menu li{ border-bottom:1px solid #e8eaee !important; }
  #menu-header .sub-menu li:last-child{ border-bottom:0 !important; }
  #menu-header .sub-menu a{
    padding:12px 16px 12px 32px !important;
    font-size:14px !important; color:#333 !important;
  }
  #menu-header .sub-menu .sub-menu{ background:#eef0f3 !important; }
  #menu-header .sub-menu .sub-menu a{ padding-left:48px !important; font-size:13px !important; }
  /* 親がリンクを持たない項目（事業内容・実績・採用・FD宣言）は見出しとして出す */
  #menu-header > li > a:not([href]){ color:#666 !important; font-weight:700; }
}