@charset "UTF-8";
/* =========================================================
   WEBCAST theme — site.css
   モックアップ4種（トップ／下層／記事／フォーム）を1本に統合
   ========================================================= */

/* ---------- 1. トークン ---------- */
:root{
  /* 色：ロゴのベクターデータ実測値をもとに定義 */
  --red:#ED1C24;        /* ブランド赤（面・大きい文字・ロゴ） */
  --red-web:#D01018;    /* UI用（ボタン・リンク）白文字とのコントラスト 5.57:1 */
  --red-deep:#AA0D13;   /* 小さい赤文字・ホバー */
  --tint:#FDECED;       /* 淡色 */
  --ink:#231F20;        /* 基調（ロゴの墨色） */
  --body:#4A4E54;       /* 本文 */
  --muted:#7C818A;      /* 注記・日付 */
  --rule:#EAE6E6;       /* 罫線 */
  --bg:#FFFFFF;
  --bg-alt:#F8F7F7;
  --line-input:#CFD2D6;

  --gothic:"M PLUS 2",-apple-system,BlinkMacSystemFont,
           "Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;

  --pad:clamp(20px,5vw,64px);
  --max:1280px;
  --max-narrow:900px;
  --max-article:780px;
}

/* ---------- 2. ベース ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--bg);color:var(--body);
  font-family:var(--gothic);font-size:16.5px;line-height:1.95;font-weight:400;
  -webkit-font-smoothing:antialiased;
  /* 日本語の折り返しを文節単位にする（Chrome系のみ。非対応環境では従来どおり） */
  word-break:auto-phrase;
  /* 禁則処理を厳格に */
  line-break:strict;
  overflow-wrap:anywhere;
}
/* 見出しは行長を均す。1行目だけ極端に長くなるのを防ぐ */
h1,h2,h3,.worry h3,.svc-item h3,.scope-item h3,.plan h3,.pillar h3,.case h3,.faq summary{
  text-wrap:balance;
}
/* 段落は最終行が1語だけになるのを避ける */
p,dd,li,.pillar p,.worry p{
  text-wrap:pretty;
}
img,svg,video{display:block;max-width:100%;}
img{height:auto;}
a{color:inherit;}
a:focus-visible,button:focus-visible,summary:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--red-web);outline-offset:3px;
}
.screen-reader-text{
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  clip-path:inset(50%);white-space:nowrap;
}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:100;background:var(--ink);color:#fff;
  padding:.8em 1.4em;text-decoration:none;
}
.skip-link:focus{left:0;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{transition:none!important;animation:none!important;}
}

/* ---------- 3. レイアウト ---------- */
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);}
.narrow{max-width:var(--max-narrow);}
section{padding-block:clamp(52px,7vw,84px);}
.alt{background:var(--bg-alt);}
.rule{border:0;border-top:1px solid var(--rule);margin:0;}

/* ---------- 4. 見出しとラベル ---------- */
h1{
  font-weight:800;color:var(--ink);font-size:clamp(1.9rem,4.4vw,2.95rem);
  line-height:1.5;letter-spacing:-.015em;margin:0 0 1.5rem;
}
h2{
  font-weight:800;color:var(--ink);font-size:clamp(1.42rem,2.9vw,2rem);
  line-height:1.6;letter-spacing:-.012em;margin:0 0 1.1rem;
}
/* 赤い点のセクションラベル（ロゴの終点がモチーフ） */
.mark{
  display:flex;align-items:center;gap:.8em;
  font-size:.95rem;font-weight:700;color:var(--ink);
  letter-spacing:.04em;margin:0 0 1.2rem;
}
.mark::before{
  content:"";width:26px;height:2px;background:var(--red);flex:none;
}
.sec-lead{max-width:50em;margin:0 0 2.6rem;}

/* ---------- 5. ボタン ---------- */
.btn{
  display:inline-block;text-decoration:none;font-weight:700;
  padding:.85em 1.6em;border-radius:2px;font-size:.94rem;line-height:1.4;
  border:2px solid transparent;text-align:center;cursor:pointer;
  font-family:inherit;transition:background-color .15s ease,color .15s ease;
}
.btn-primary,
.gnav a.btn-primary,
.fnav a.btn-primary{background:var(--red-web);color:#fff;border-color:transparent;}
.btn-primary:hover,
.gnav a.btn-primary:hover{background:var(--red-deep);color:#fff;border-bottom-color:transparent;}
.btn-ghost{border-color:var(--ink);color:var(--ink);}
.btn-ghost:hover{background:var(--ink);color:#fff;}
/* ナビ内のボタンは、リンク用の下線指定に負けないよう個別に指定する */
.gnav a.btn{border:2px solid transparent;}
.gnav a.btn-quiet{background:#fff;color:var(--body);border-color:var(--rule);}
.gnav a.btn-quiet:hover{background:#fff;border-color:var(--ink);color:var(--ink);}
.btn-sm{padding:.62em 1.15em;font-size:.86rem;}
.on-dark .btn-ghost,.cta .btn-ghost,.a-cta .btn-ghost{border-color:#fff;color:#fff;}
.on-dark .btn-ghost:hover,.cta .btn-ghost:hover,.a-cta .btn-ghost:hover{background:#fff;color:var(--ink);}

/* ---------- 6. ヘッダー ---------- */
.site-header{
  position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--rule);
}
.hbar{display:flex;align-items:center;gap:2rem;height:74px;}
.logo{color:var(--ink);width:132px;flex:none;}
.logo svg{width:100%;height:auto;}
.gnav{
  margin-left:auto;display:flex;align-items:center;gap:1.6rem;
  list-style:none;margin-block:0;padding-left:0;
}
.gnav li{list-style:none;margin:0;}
.gnav li::marker{content:"";}
.gnav a{
  text-decoration:none;font-size:1rem;font-weight:500;color:var(--ink);
  padding-block:.35rem;border-bottom:2px solid transparent;white-space:nowrap;
}
.gnav a:hover,.gnav .current-menu-item>a,.gnav a[aria-current]{border-bottom-color:var(--red);}
/* フォームページなど、導線を絞るヘッダー */
.hback{margin-left:auto;font-size:.86rem;color:var(--muted);text-decoration:none;}
.hback:hover{color:var(--ink);text-decoration:underline;}
/* モバイルメニュー */
.nav-toggle{
  display:none;margin-left:auto;background:none;border:0;padding:.5rem;
  cursor:pointer;color:var(--ink);font-family:inherit;font-size:.85rem;font-weight:700;
}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--ink);margin:4px 0;}
/* メニューを開いている間は、ヘッダーのすりガラス効果を切る。
   backdrop-filter があると、その中の position:fixed が画面ではなく
   ヘッダーを基準に配置され、メニューの高さが0になるため。 */
.nav-open .site-header{
  backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff;
}
.nav-open{overflow:hidden;}
.nav-open .gnav{
  display:flex;position:fixed;inset:74px 0 0;z-index:50;
  background:#fff;flex-direction:column;
  align-items:stretch;gap:0;padding:1rem var(--pad) 3rem;overflow-y:auto;
  padding-bottom:calc(3rem + env(safe-area-inset-bottom,0px));
}
/* 開いている間は下部の固定ボタンを隠す */
.nav-open .sticky{display:none;}
.nav-open .gnav li{width:100%;}
.nav-open .gnav li a{
  display:block;width:100%;
  border-bottom:1px solid var(--rule);
  padding:1.05rem 0;font-size:1.05rem;font-weight:700;
}
.nav-open .gnav li a:hover{border-bottom-color:var(--red);}
/* メニュー内ではボタンを縦に並べる */
.nav-open .gnav .btn{
  display:block;width:100%;margin-top:1rem;border-bottom:2px solid transparent;
}
.nav-open .gnav .btn-quiet{display:block;margin-top:1.6rem;}
.nav-open .gnav .btn-quiet + .btn-primary{margin-top:.8rem;}
.nav-open .gnav .btn{margin-top:1.4rem;border-bottom:0;}

/* ---------- 6b. 顧客ログイン導線 ---------- */
/* ボタンと同じ部品にして高さを揃える。.btn-quiet は控えめな第3のボタン */
.btn-quiet{background:#fff;color:var(--body);border-color:var(--rule);}
.btn-quiet:hover{border-color:var(--ink);color:var(--ink);}
/* 外部サイト（別ドメイン）へ開くリンクに小さな印を付ける */
.btn.is-external::after{
  content:"";display:inline-block;width:.62em;height:.62em;margin-left:.5em;
  vertical-align:-.02em;
  border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;
  border-top-right-radius:1px;
  transform:rotate(45deg) skew(-8deg,-8deg);
  opacity:.65;
}
.fportal{display:flex;flex-wrap:wrap;gap:.8rem;align-self:center;}
.site-footer .fportal .btn-ghost{border-color:#5A5A58;color:#C9CCD0;}
.site-footer .fportal .btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff;}

/* ---------- 28. リモートサポート ---------- */
.dl-row{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2vw,24px);margin-top:2rem;}
.dl-card{
  border:1px solid var(--rule);background:#fff;padding:2rem 1.8rem;text-align:center;
  display:flex;flex-direction:column;align-items:center;text-decoration:none;
}
.dl-card h3{font-size:1.15rem;font-weight:800;color:var(--ink);margin:0 0 .4rem;}
.dl-card p{margin:0 0 1.4rem;font-size:.86rem;color:var(--muted);}
.dl-card .btn{width:100%;font-size:1rem;padding:1em;}
.warn{
  border:1px solid var(--rule);background:var(--bg-alt);padding:1.5rem 1.8rem;margin-top:2.4rem;
}
.warn h3{font-size:1rem;font-weight:700;color:var(--ink);margin:0 0 .9rem;}
.warn ul{margin:0;padding:0;list-style:none;display:grid;gap:.7rem;}
.warn li{font-size:.92rem;padding-left:1.5rem;position:relative;line-height:1.85;}
.warn li::before{content:"";position:absolute;left:0;top:.75em;width:8px;height:8px;border-radius:50%;border:2px solid var(--red);}
.callnow{
  border:2px solid var(--ink);padding:1.8rem;margin-top:2.4rem;text-align:center;
}
.callnow .lbl{font-size:.84rem;color:var(--muted);margin:0 0 .5rem;}
.callnow .no{font-weight:800;font-size:2rem;color:var(--ink);letter-spacing:-.02em;line-height:1.3;}
.callnow .no a{text-decoration:none;}
.callnow .hrs{font-size:.84rem;color:var(--muted);margin:.3rem 0 0;}

/* ---------- 7. パンくず・ページ見出し ---------- */
.crumb{font-size:.78rem;color:var(--muted);padding-block:1.1rem;}
.crumb a{text-decoration:none;}
.crumb a:hover{text-decoration:underline;}
.page-head{padding-block:clamp(30px,4vw,52px) clamp(44px,6vw,72px);border-top:1px solid var(--rule);}
.page-lead{font-size:1.02rem;line-height:2.05;max-width:44em;margin:0 0 2.2rem;}
.head-cta{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;}
.head-note{font-size:.8rem;color:var(--muted);margin:1rem 0 0;}

/* ---------- 8. ヒーロー（トップ） ---------- */
.hero{padding-block:clamp(48px,7vw,84px) clamp(40px,6vw,72px);}
.hero-grid{
  display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);
  gap:clamp(32px,5vw,68px);align-items:start;
}
.hero-lead{font-size:1.02rem;line-height:2.05;margin:0 0 2.2rem;max-width:40em;}
.hero-cta{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;}
.hero-note{font-size:.8rem;color:var(--muted);margin:1rem 0 0;}
.facts{border-top:2px solid var(--ink);padding-top:1.3rem;margin-top:.9rem;}
.facts dl{margin:0;display:grid;gap:1.1rem;}
.facts div{
  display:flex;align-items:baseline;gap:1rem;
  border-bottom:1px solid var(--rule);padding-bottom:1.05rem;
}
.facts div:last-child{border-bottom:0;padding-bottom:0;}
.facts dt{font-size:.82rem;color:var(--muted);flex:none;width:6.5em;margin:0;}
.facts dd{
  margin:0;font-weight:700;color:var(--ink);font-size:1.24rem;
  line-height:1.45;letter-spacing:-.01em;
}
.facts dd small{
  display:block;font-weight:500;font-size:.78rem;color:var(--body);letter-spacing:.02em;
}

/* ---------- 8b. 写真を敷いたヒーロー ---------- */
.hero-photo{
  position:relative;
  min-height:clamp(420px,44vw,560px);
  display:flex;align-items:center;
  background:var(--ink) center/cover no-repeat;
  color:#fff;
  isolation:isolate;
}
/* 写真の上に暗い層を重ね、文字の読みやすさを確保する */
.hero-photo::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,
    rgba(18,16,16,.72) 0%,
    rgba(18,16,16,.60) 34%,
    rgba(18,16,16,.26) 62%,
    rgba(18,16,16,.06) 88%,
    rgba(18,16,16,.02) 100%);
}
.hero-photo .wrap{width:100%;padding-block:clamp(48px,6vw,72px);}
/* 下層ページ用は少し低め */
.hero-photo--page{min-height:clamp(300px,30vw,400px);}
.hero-photo--page h1{margin-bottom:1.2rem;}
.hero-photo .page-lead{color:#EFEDEC;text-shadow:0 1px 10px rgba(0,0,0,.4);}
.hero-photo .head-note{color:#CFCBC8;text-shadow:0 1px 8px rgba(0,0,0,.45);}
.hero-photo h1{color:#fff;text-shadow:0 1px 14px rgba(0,0,0,.42);}
.hero-photo .hero-lead{color:#EFEDEC;text-shadow:0 1px 10px rgba(0,0,0,.4);}
.hero-photo .hero-note{color:#CFCBC8;text-shadow:0 1px 8px rgba(0,0,0,.45);}
.hero-photo .btn-ghost{border-color:#fff;color:#fff;}
.hero-photo .btn-ghost:hover{background:#fff;color:var(--ink);}

/* ---------- 8c. トップのヒーロー（写真を全面に） ----------
   暗幕は画面全体に敷かず、文字のある場所（ヘッダー帯・左側・下端）にだけかける。
   文字の読みやすさは、暗幕よりも文字自体の影で確保する。 */
.hero-top{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:min(88vh,780px);display:flex;align-items:flex-end;
  background:#100E0E;color:#fff;
}
.hero-top__photo{
  position:absolute;inset:0;z-index:-2;width:100%;height:100%;
  object-fit:cover;object-position:center 55%;
}
.hero-top::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(to bottom,rgba(10,9,9,.52) 0%,rgba(10,9,9,.30) 7%,rgba(10,9,9,.10) 13%,rgba(10,9,9,0) 19%),
    linear-gradient(to top,rgba(10,9,9,.82) 0%,rgba(10,9,9,.66) 11%,rgba(10,9,9,.42) 22%,
      rgba(10,9,9,.20) 34%,rgba(10,9,9,.05) 48%,rgba(10,9,9,0) 60%,rgba(10,9,9,.18) 100%),
    linear-gradient(to right,rgba(10,9,9,.48) 0%,rgba(10,9,9,.26) 28%,rgba(10,9,9,.06) 48%,rgba(10,9,9,0) 66%);
}
.hero-top > .wrap{
  width:100%;
  padding-top:clamp(150px,19vw,230px);padding-bottom:clamp(28px,4vw,44px);
}
.hero-top h1{
  margin:0 0 1.3rem;color:#fff;
  font-size:clamp(2.3rem,5.6vw,4.3rem);line-height:1.3;letter-spacing:-.04em;
  text-shadow:0 2px 30px rgba(8,7,7,.62),0 1px 3px rgba(8,7,7,.3);
}
.hero-top .hero-lead{
  margin:0 0 2.2rem;max-width:30em;color:#fff;font-size:1.04rem;line-height:1.95;
  text-shadow:0 1px 16px rgba(8,7,7,.72);
}
.hero-top .hero-lead br{display:none;}
.hero-top .hero-note{
  color:rgba(255,255,255,.8);font-size:.84rem;
  text-shadow:0 1px 12px rgba(8,7,7,.7);
}
.hero-top .btn-primary{box-shadow:0 2px 18px rgba(0,0,0,.22);}
.hero-top .btn-ghost{border-color:rgba(255,255,255,.8);color:#fff;background:rgba(18,16,16,.18);}
.hero-top .btn-ghost:hover{background:#fff;border-color:#fff;color:var(--ink);}

/* ヒーロー下端の実績 */
.hero-facts{
  margin:clamp(44px,6vw,72px) 0 0;
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.3);
}
.hero-facts div{padding-top:22px;}
.hero-facts div + div{
  border-left:1px solid rgba(255,255,255,.3);
  padding-left:clamp(24px,3vw,44px);margin-left:clamp(24px,3vw,44px);
}
.hero-facts dt{
  font-size:.74rem;font-weight:700;color:rgba(255,255,255,.9);letter-spacing:.1em;
  margin:0 0 .45rem;text-shadow:0 1px 10px rgba(8,7,7,.75);
}
.hero-facts dd{
  margin:0;font-weight:800;color:#fff;line-height:1.4;
  font-size:clamp(1.2rem,1.9vw,1.6rem);letter-spacing:-.03em;
  text-shadow:0 1px 14px rgba(8,7,7,.7);
}
.hero-facts .u{font-size:.52em;letter-spacing:0;margin-inline:.08em;}
.hero-facts .tax{
  font-size:.46em;font-weight:500;letter-spacing:.04em;margin-left:.7em;
  color:rgba(255,255,255,.82);vertical-align:.1em;
}

/* トップだけ、ヘッダーを写真の上に重ねる。ヒーローを過ぎたら白に戻す（site.js） */
.site-header.is-overlay{
  position:fixed;top:var(--wp-admin--admin-bar--height,0px);left:0;right:0;
  background:transparent;border-bottom-color:transparent;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  transition:background-color .25s ease,border-color .25s ease;
}
.is-overlay .logo{color:#fff;}
.is-overlay .gnav a:not(.btn){color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.45);}
.is-overlay .gnav a.btn-quiet{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.55);}
.is-overlay .gnav a.btn-quiet:hover{background:#fff;color:var(--ink);border-color:#fff;}
.is-overlay .nav-toggle span{background:#fff;}
.is-overlay.is-scrolled,
.nav-open .is-overlay{
  background:rgba(255,255,255,.94);border-bottom-color:var(--rule);
  backdrop-filter:saturate(1.4) blur(8px);-webkit-backdrop-filter:saturate(1.4) blur(8px);
}
.nav-open .is-overlay{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff;}
.is-overlay.is-scrolled .logo,.nav-open .is-overlay .logo{color:var(--ink);}
.is-overlay.is-scrolled .gnav a:not(.btn),.nav-open .is-overlay .gnav a:not(.btn){color:var(--ink);text-shadow:none;}
.is-overlay.is-scrolled .gnav a.btn-quiet,.nav-open .is-overlay .gnav a.btn-quiet{background:#fff;color:var(--body);border-color:var(--rule);}
.is-overlay.is-scrolled .nav-toggle span,.nav-open .is-overlay .nav-toggle span{background:var(--ink);}

/* ---------- 9. 悩み3カラム ---------- */
.worries{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px);}
.worry{border-top:1px solid var(--ink);padding-top:1.3rem;}
.worry h3{font-size:1.02rem;font-weight:700;color:var(--ink);margin:0 0 .6rem;line-height:1.7;}
.worry p{margin:0;font-size:.94rem;}

/* ---------- 10. サービス／対応範囲 ---------- */
.svc,.scope{display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(28px,4vw,60px);}
.svc-item,.scope-item{padding:1.7rem 0;border-bottom:1px solid var(--rule);}
.svc-item:nth-last-child(-n+2){border-bottom:0;}
.svc-item h3,.scope-item h3{
  font-size:1.05rem;font-weight:700;color:var(--ink);margin:0 0 .5rem;
  display:flex;align-items:center;gap:.6em;line-height:1.6;
}
.svc-item h3::before,.scope-item h3::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--red);flex:none;
}
.svc-item p,.scope-item p{margin:0;font-size:.94rem;}
.plan-note{
  display:inline-block;margin-top:.6rem;font-size:.75rem;color:var(--red-deep);
  border:1px solid #F0C2C4;border-radius:2px;padding:.1em .6em;
}

/* ---------- 11. 対応できない範囲 ---------- */
.cannot{margin-top:3rem;border:1px solid var(--rule);padding:clamp(20px,3vw,32px);background:#fff;}
.cannot h3{font-size:1.02rem;font-weight:700;color:var(--ink);margin:0 0 1.2rem;}
.cannot ul{margin:0;padding:0;list-style:none;display:grid;gap:.9rem;}
.cannot li{font-size:.94rem;padding-left:1.5rem;position:relative;line-height:1.85;}
.cannot li::before{
  content:"";position:absolute;left:0;top:.85em;width:11px;height:1px;background:var(--muted);
}
.cannot b{color:var(--ink);}

/* ---------- 12. 引用囲み ---------- */
.pull{border-left:3px solid var(--red);background:var(--tint);padding:1.5rem 1.8rem;margin-top:2rem;}
.pull p{margin:0;color:var(--ink);font-weight:500;}

/* ---------- 13. ステップ（順序があるものだけ連番） ---------- */
.steps{display:grid;counter-reset:step;}
.step{
  display:grid;grid-template-columns:56px 1fr;gap:1.6rem;
  padding:1.8rem 0;border-bottom:1px solid var(--rule);
}
.step:last-child{border-bottom:0;}
.step-n{
  counter-increment:step;font-weight:800;font-size:1.6rem;color:var(--red);
  line-height:1.2;letter-spacing:-.03em;
}
.step-n::before{content:counter(step);}
.step h3{font-size:1.05rem;font-weight:700;color:var(--ink);margin:0 0 .4rem;line-height:1.6;}
.step p{margin:0;font-size:.95rem;}

/* ---------- 14. 料金：カード（トップ） ---------- */
.plans-card{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);align-items:stretch;}
.plan{border:1px solid var(--rule);padding:1.9rem 1.6rem;background:#fff;display:flex;flex-direction:column;}
.plan.pick{border-color:var(--red);background:var(--tint);position:relative;}
.plan .tag{
  position:absolute;top:-11px;left:1.6rem;background:var(--red);color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.08em;padding:.2em .8em;border-radius:2px;
}
.plan h3{font-size:1.02rem;font-weight:700;color:var(--ink);margin:0 0 .7rem;}
.plan .fee{font-weight:800;color:var(--ink);font-size:1.8rem;line-height:1.35;letter-spacing:-.025em;}
.plan .fee span{font-size:.85rem;font-weight:500;letter-spacing:0;}
.plan .tax{font-size:.76rem;color:var(--muted);margin:.15rem 0 1.1rem;}
.plan p.for{margin:0;font-size:.92rem;border-top:1px solid var(--rule);padding-top:1rem;}
.plan.pick p.for{border-top-color:#F2C9CB;}
.after-plans{display:flex;flex-wrap:wrap;gap:1.4rem;align-items:center;margin-top:2.2rem;}
.after-plans p{margin:0;font-size:.9rem;}

/* ---------- 15. 料金：比較表（下層） ---------- */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
table.plans{width:100%;border-collapse:collapse;min-width:660px;font-size:.9rem;}
table.plans th,table.plans td{
  border-bottom:1px solid var(--rule);padding:.95rem .9rem;
  text-align:center;vertical-align:middle;line-height:1.65;
}
table.plans thead th{border-bottom:2px solid var(--ink);padding-bottom:1.2rem;vertical-align:bottom;}
table.plans th.row{text-align:left;font-weight:400;color:var(--body);width:11.5rem;}
table.plans col.pick{background:var(--tint);}
.pname{display:block;font-weight:700;color:var(--ink);font-size:1rem;}
.pfee{
  display:block;font-weight:800;color:var(--ink);font-size:1.5rem;
  letter-spacing:-.025em;margin-top:.3rem;line-height:1.3;
}
.pfee span{font-size:.8rem;font-weight:500;letter-spacing:0;}
.ptax{display:block;font-size:.74rem;color:var(--muted);}
.tag{
  display:inline-block;background:var(--red);color:#fff;font-size:.68rem;font-weight:700;
  letter-spacing:.08em;padding:.15em .7em;border-radius:2px;margin-bottom:.5rem;
}
.yes{color:var(--ink);font-weight:700;}
.no{color:#C7CBD0;}
.notes{font-size:.84rem;color:var(--muted);margin-top:1.6rem;display:grid;gap:.4rem;}

/* ---------- 15b. オプション表 ---------- */
table.opt{width:100%;border-collapse:collapse;min-width:560px;font-size:.92rem;}
table.opt th,table.opt td{border-bottom:1px solid var(--rule);padding:.95rem .8rem;text-align:left;line-height:1.7;vertical-align:top;}
table.opt thead th{border-bottom:2px solid var(--ink);font-size:.85rem;color:var(--body);font-weight:700;}
table.opt td.fee{white-space:nowrap;font-weight:700;color:var(--ink);width:12rem;}
table.opt b{color:var(--ink);}

/* ---------- 15c. 料金ページ（2026年11月版） ---------- */
/* ページ内リンク */
.pnav{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;margin-top:1.8rem;padding-top:1.4rem;border-top:1px solid var(--rule);}
.pnav a{font-size:.9rem;font-weight:700;color:var(--ink);text-decoration:none;border-bottom:2px solid transparent;padding-bottom:.15rem;}
.pnav a:hover{border-bottom-color:var(--red);}
html{scroll-padding-top:96px;}

/* プランのカード */
.pcards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px);align-items:stretch;margin-top:2.4rem;}
.pcard{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--rule);border-top:3px solid var(--ink);
  /* 各カードの段（価格・キャッチ・含む時間…）の高さを横でそろえる */
  display:grid;grid-template-rows:subgrid;grid-row:span 9;row-gap:0;align-content:start;
  padding:clamp(24px,2.6vw,34px) clamp(20px,2.2vw,30px) clamp(24px,2.6vw,30px);
}
.pcard.is-pick{border-color:var(--red);border-top-color:var(--red);box-shadow:0 10px 32px rgba(35,31,32,.07);}
.pcard-tag{
  position:absolute;top:-1px;right:clamp(20px,2.2vw,30px);transform:translateY(-100%);
  background:var(--red);color:#fff;font-size:.74rem;font-weight:700;letter-spacing:.08em;
  padding:.3em .9em;
}
.pcard-en{margin:0;font-size:.86rem;font-weight:700;color:var(--red-deep);letter-spacing:.06em;}
.pcard-en span{margin-left:.8em;font-size:.76rem;font-weight:700;color:inherit;letter-spacing:.04em;opacity:.8;}
.pcard-ja{margin:.15rem 0 .9rem;font-size:1.32rem;font-weight:800;color:var(--ink);letter-spacing:-.01em;line-height:1.5;}
.pcard-fee{margin:0;font-weight:800;color:var(--ink);font-size:clamp(2rem,3vw,2.5rem);line-height:1.2;letter-spacing:-.035em;}
.pcard-fee .u{font-size:.42em;font-weight:700;letter-spacing:0;margin-left:.08em;}
.pcard-fee .per{font-size:.36em;font-weight:500;letter-spacing:0;color:var(--muted);margin-left:.2em;}
.pcard-catch{margin:1rem 0 0;font-size:.98rem;font-weight:700;color:var(--ink);line-height:1.75;}
.pcard-hours{margin:.9rem 0 0;font-size:.88rem;background:var(--bg-alt);padding:.55rem .8rem;}
.pcard.is-pick .pcard-hours{background:var(--tint);}
.pcard-hours b{color:var(--ink);}
.pcard-target{margin:1rem 0 0;font-size:.88rem;line-height:1.85;}
.pcard-items{margin:1.4rem 0 0;border-top:1px solid var(--rule);}
.pcard-items div{padding:.9rem 0;border-bottom:1px solid var(--rule);}
.pcard-items dt{font-size:.8rem;color:var(--muted);line-height:1.7;margin:0 0 .25rem;}
.pcard-items dt::before{content:"「";}
.pcard-items dt::after{content:"」";}
.pcard-items dd{margin:0;font-size:.9rem;color:var(--ink);font-weight:500;line-height:1.75;}
.pcard-compare{margin:1.2rem 0 0;font-size:.82rem;line-height:1.8;color:var(--body);}
.pcard-compare span{display:block;font-size:.74rem;font-weight:700;color:var(--muted);letter-spacing:.06em;margin-bottom:.15rem;}
.pcard-diff{margin:0;padding-top:1.2rem;align-self:end;font-size:.84rem;line-height:1.8;color:var(--ink);}
.pcard-compare + .pcard-diff{margin-top:1rem;}

/* トップ・IT顧問ページ用の簡易カード */
.pcards--compact .pcard{grid-row:span 5;}
.pcards--compact .pcard-catch{margin-top:.8rem;}
.pcards--compact .pcard-target{margin-top:auto;padding-top:1rem;border-top:1px solid var(--rule);margin-top:1.1rem;}
.pcards-exec{
  margin:1.4rem 0 0;padding:1rem 1.2rem;border:1px solid var(--rule);background:#fff;
  font-size:.92rem;line-height:1.85;
}
.pcards-exec b{color:var(--ink);margin-right:.6em;}
.pcards-note{margin:.9rem 0 0;font-size:.82rem;color:var(--muted);}

/* Executive（個別契約） */
.pexec{
  margin-top:clamp(20px,2.4vw,28px);background:var(--ink);color:#C9CCD0;
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(24px,4vw,56px);padding:clamp(28px,3.4vw,44px);
}
.pexec .pcard-en{color:#FF8A8F;}
.pexec .pcard-ja{color:#fff;}
.pexec .pcard-fee{color:#fff;margin-top:1.2rem;}
.pexec .pcard-fee .per{color:#9AA0A6;}
.pexec-catch{margin:0;font-size:1.02rem;font-weight:700;color:#fff;line-height:1.75;}
.pexec-body p{margin:0 0 1rem;font-size:.94rem;}
.pexec-table{width:100%;border-collapse:collapse;font-size:.9rem;margin-bottom:1.2rem;}
.pexec-table th,.pexec-table td{padding:.75rem 0;border-bottom:1px solid #3A3637;text-align:left;font-weight:400;line-height:1.7;vertical-align:top;}
.pexec-table td{text-align:right;white-space:nowrap;color:#fff;font-weight:700;padding-left:1.2rem;}
.pexec-table .sum th,.pexec-table .sum td{border-bottom:0;color:#fff;font-weight:800;}
.pexec-notes{margin:0 0 1.6rem;padding:0;list-style:none;display:grid;gap:.5rem;}
.pexec-notes li{font-size:.86rem;line-height:1.8;padding-left:1.1rem;position:relative;}
.pexec-notes li::before{content:"";position:absolute;left:0;top:.8em;width:5px;height:5px;background:var(--red);}

/* 提供範囲の表 */
table.pscope{width:100%;border-collapse:collapse;min-width:680px;font-size:.9rem;table-layout:fixed;}
table.pscope col.row{width:16rem;}
table.pscope col.pick{background:var(--tint);}
table.pscope th,table.pscope td{border-bottom:1px solid var(--rule);padding:.9rem .9rem;text-align:center;vertical-align:middle;line-height:1.65;}
table.pscope thead th{border-bottom:2px solid var(--ink);padding-bottom:1.1rem;vertical-align:bottom;}
table.pscope th.row{text-align:left;font-weight:500;color:var(--ink);}
table.pscope td{color:var(--body);}
.pja{display:block;font-size:.8rem;color:var(--body);font-weight:500;margin-top:.1rem;}

/* 料金の表（オプション・スポット・単価） */
table.ptable{width:100%;border-collapse:collapse;min-width:560px;font-size:.92rem;background:transparent;}
table.ptable th,table.ptable td{border-bottom:1px solid var(--rule);padding:.9rem .8rem;text-align:left;line-height:1.7;vertical-align:top;}
table.ptable thead th{border-bottom:2px solid var(--ink);font-size:.82rem;color:var(--muted);font-weight:700;letter-spacing:.04em;padding-top:0;}
table.ptable tbody th{font-weight:700;color:var(--ink);}
table.ptable td.fee,table.ptable th.fee{white-space:nowrap;width:11rem;}
table.ptable td.fee{font-weight:700;color:var(--ink);}
.alt table.ptable{background:transparent;}

.psub{margin-top:clamp(40px,5vw,60px);}
.psub h3,.pcol-h{font-size:1.08rem;font-weight:800;color:var(--ink);margin:0 0 .6rem;}
.psub > p{margin:0 0 1.2rem;font-size:.92rem;max-width:46em;}
.pcols{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(28px,4vw,56px);margin-top:2rem;}
.pcols table.ptable{min-width:0;}
.pcol-h{margin-bottom:1rem;}

.prules{margin-top:2rem;border:1px solid var(--rule);padding:clamp(20px,3vw,28px);}
.prules h3{font-size:1rem;font-weight:700;color:var(--ink);margin:0 0 .9rem;}
.prules ul{margin:0;padding:0;list-style:none;display:grid;gap:.6rem;}
.prules li{font-size:.92rem;line-height:1.85;padding-left:1.2rem;position:relative;}
.prules li::before{content:"";position:absolute;left:0;top:.85em;width:5px;height:5px;background:var(--red);}
.prules b{color:var(--ink);}

@media (max-width:900px){
  .pcards{grid-template-columns:1fr;gap:28px;}
  .pcard.is-pick{order:-1;}
  .pexec{grid-template-columns:1fr;}
  .pcols{grid-template-columns:1fr;}
  table.ptable{min-width:0;font-size:.88rem;}
  table.ptable thead{display:none;}
  table.ptable tr{display:grid;grid-template-columns:1fr auto;gap:.15rem 1rem;padding:.9rem 0;border-bottom:1px solid var(--rule);}
  table.ptable th,table.ptable td{border:0;padding:0;}
  table.ptable tbody th{grid-column:1;}
  table.ptable td.fee{grid-column:2;grid-row:1;text-align:right;width:auto;}
  table.ptable td:not(.fee){grid-column:1 / -1;font-size:.84rem;color:var(--body);}
  table.ptable td:empty{display:none;}
  .ptable--wide td:not(.fee)::before{content:attr(data-label) "　";color:var(--muted);font-size:.78rem;}
}

/* 講演・研修ページ */
.psub-h{font-size:1.08rem;font-weight:800;color:var(--ink);margin:clamp(40px,5vw,56px) 0 1rem;}

/* ---------- 16. 数字 ---------- */
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);margin-bottom:2.8rem;}
.num{border-left:2px solid var(--red);padding-left:1.2rem;}
.num b{
  display:block;font-weight:800;color:var(--ink);
  font-size:clamp(2rem,4.4vw,2.85rem);line-height:1.25;letter-spacing:-.03em;
}
.num span{font-size:.87rem;color:var(--body);}
.reason p{max-width:52em;font-size:.98rem;}

/* ---------- 17. その他サービス3カラム ---------- */
.other{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);}
.other div{border-top:1px solid var(--rule);padding-top:1.2rem;}
.other h3{font-size:1rem;font-weight:700;color:var(--ink);margin:0 0 .45rem;}
.other p{margin:0;font-size:.92rem;}

/* ---------- 17b. 3つの事業（柱） ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);align-items:stretch;}
.pillar{
  border:1px solid var(--rule);background:#fff;padding:1.9rem 1.7rem;
  display:flex;flex-direction:column;text-decoration:none;position:relative;
  transition:border-color .15s ease;
}
.pillar:hover{border-color:var(--ink);}
.pillar.lead-pillar{border-color:var(--red);background:var(--tint);}
.pillar-tag{
  position:absolute;top:-11px;left:1.7rem;background:var(--red);color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.08em;padding:.2em .8em;border-radius:2px;
}
.pillar h3{font-size:1.18rem;font-weight:800;color:var(--ink);margin:0 0 .35rem;letter-spacing:-.01em;line-height:1.5;}
.pillar .pillar-sub{margin:0 0 1rem;font-size:.84rem;color:var(--red-deep);font-weight:500;line-height:1.7;}
.pillar p{margin:0;font-size:.93rem;color:var(--body);}
.pillar-more{
  margin-top:auto;padding-top:1.2rem;font-size:.86rem;font-weight:700;color:var(--ink);
  display:flex;align-items:center;gap:.5em;
}
.pillar-more::after{
  content:"";width:7px;height:7px;border-right:2px solid var(--red);border-bottom:2px solid var(--red);
  transform:rotate(-45deg);
}
.pillar:hover .pillar-more{color:var(--red-deep);}

/* ---------- 18. 事例 ---------- */
.cases{display:grid;gap:2.4rem;}
.case{border-top:2px solid var(--ink);padding-top:1.4rem;}
.case h3{font-size:1.02rem;font-weight:700;color:var(--ink);margin:0 0 .3rem;}
.case .meta{font-size:.82rem;color:var(--muted);margin:0 0 1.1rem;}
.case dl{margin:0;display:grid;gap:.55rem;font-size:.94rem;}
.case dt{float:left;clear:left;width:3.2rem;color:var(--red-deep);font-weight:700;font-size:.82rem;line-height:1.95;}
.case dd{margin:0 0 0 3.9rem;line-height:1.9;}

/* ---------- 19. FAQ ---------- */
.faq{border-top:1px solid var(--rule);}
.faq details{border-bottom:1px solid var(--rule);}
.faq summary{
  cursor:pointer;list-style:none;padding:1.25rem 2.5rem 1.25rem 0;position:relative;
  font-weight:700;color:var(--ink);font-size:1rem;line-height:1.75;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:"";position:absolute;right:.4rem;top:1.85rem;width:11px;height:11px;
  border-right:2px solid var(--red);border-bottom:2px solid var(--red);
  transform:rotate(45deg);transition:transform .18s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg);top:1.95rem;}
.faq details p{margin:0 0 1.4rem;font-size:.95rem;max-width:52em;}

/* ---------- 20. 更新情報の一覧 ---------- */
.posts{border-top:1px solid var(--rule);}
.post{
  display:grid;grid-template-columns:6.5em 6.5em 1fr;gap:1.2rem;align-items:baseline;
  padding:1.15rem 0;border-bottom:1px solid var(--rule);text-decoration:none;
}
.post:hover .post-title{color:var(--red-deep);text-decoration:underline;text-underline-offset:3px;}
.post time{font-size:.82rem;color:var(--muted);font-variant-numeric:tabular-nums;}
.cat{font-size:.74rem;font-weight:700;letter-spacing:.05em;padding:.15em 0;color:var(--red-deep);}
.cat.news{color:var(--muted);}
.post-title{color:var(--ink);font-size:.98rem;font-weight:500;line-height:1.7;}

/* ---------- 20b. カテゴリ切り替えと一覧の追加 ---------- */
.cat-nav{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.8rem;}
.cat-nav a{
  text-decoration:none;font-size:.88rem;font-weight:500;color:var(--body);
  border:1px solid var(--rule);border-radius:2px;padding:.5em 1em;white-space:nowrap;
}
.cat-nav a:hover{border-color:var(--ink);color:var(--ink);}
.cat-nav a.is-current{background:var(--ink);border-color:var(--ink);color:#fff;}

/* お知らせは日付とタイトルの2列 */
.post--news{grid-template-columns:6.5em 1fr;}

/* ページ送り */
.pagination,.nav-links{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;}
.pagination .screen-reader-text{display:none;}
.page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:2.6em;height:2.6em;padding:0 .7em;
  border:1px solid var(--rule);border-radius:2px;
  text-decoration:none;font-size:.9rem;font-weight:700;color:var(--body);
}
.page-numbers:hover{border-color:var(--ink);color:var(--ink);}
.page-numbers.current{background:var(--ink);border-color:var(--ink);color:#fff;}
.page-numbers.dots{border-color:transparent;}

/* ---------- 21. 記事 ---------- */
.article{
  max-width:var(--max-article);margin-inline:auto;
  padding-inline:var(--pad);
  /* 関連記事が無い場合でもフッターと接しないようにする */
  padding-bottom:clamp(48px,6vw,80px);
}
.a-head{border-top:1px solid var(--rule);padding-block:clamp(28px,4vw,44px) clamp(24px,3vw,36px);}
.a-meta{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;font-size:.82rem;color:var(--muted);margin-bottom:1.2rem;}
.a-head h1{font-size:clamp(1.55rem,3.4vw,2.2rem);line-height:1.6;}
.a-lead{font-size:1rem;color:var(--body);margin:0;}
/* 目次 */
.a-toc{background:var(--bg-alt);padding:1.5rem 1.8rem;margin-bottom:3rem;}
.a-toc h2{font-size:.9rem;font-weight:700;color:var(--ink);margin:0 0 .9rem;letter-spacing:0;}
.a-toc ol{margin:0;padding-left:1.4rem;display:grid;gap:.45rem;}
.a-toc li{font-size:.92rem;line-height:1.75;}
.a-toc a{color:var(--body);text-decoration:none;}
.a-toc a:hover{color:var(--red-deep);text-decoration:underline;text-underline-offset:3px;}
/* 本文の組版（ブロックエディタの出力もここで受ける） */
.body h2{
  font-weight:800;color:var(--ink);font-size:1.42rem;line-height:1.65;letter-spacing:-.01em;
  margin:3.2rem 0 1.2rem;padding-top:1.6rem;border-top:1px solid var(--rule);
}
.body h2:first-child{margin-top:0;padding-top:0;border-top:0;}
.body h3{
  font-weight:700;color:var(--ink);font-size:1.1rem;line-height:1.7;margin:2.4rem 0 .8rem;
  display:flex;align-items:baseline;gap:.6em;
}
.body h3::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--red);flex:none;
  transform:translateY(-.2em);
}
.body p{margin:0 0 1.5rem;}
.body strong{color:var(--ink);font-weight:700;}
.body a{color:var(--red-deep);text-underline-offset:3px;}
.body ul,.body ol{margin:0 0 1.6rem;padding-left:1.4rem;}
.body li{margin-bottom:.7rem;line-height:1.9;}
.body table{width:100%;border-collapse:collapse;font-size:.92rem;margin:0 0 1.8rem;}
.body th,.body td{border-bottom:1px solid var(--rule);padding:.8rem .7rem;text-align:left;line-height:1.7;}
.body thead th{border-bottom:2px solid var(--ink);font-size:.85rem;color:var(--body);font-weight:700;}
.body figure{margin:0 0 1.8rem;}
.body figcaption{font-size:.82rem;color:var(--muted);margin-top:.6rem;}
.body blockquote{margin:0 0 1.8rem;padding:1.2rem 1.5rem;background:var(--bg-alt);border-left:3px solid var(--red);}
.body blockquote p:last-child{margin-bottom:0;}
.callout{border:1px solid var(--rule);padding:1.4rem 1.6rem;margin:0 0 1.8rem;background:#fff;}
.callout p:last-child{margin-bottom:0;}
.callout b{color:var(--ink);}
.disclaimer{
  font-size:.85rem;color:var(--muted);border-top:1px solid var(--rule);
  padding-top:1.4rem;margin-top:2.8rem;line-height:1.85;
}
/* 署名 */
.author{
  display:flex;gap:1.3rem;align-items:flex-start;border-top:2px solid var(--ink);
  padding-top:1.6rem;margin-top:2.4rem;
}
.author-img{width:64px;height:64px;border-radius:50%;background:var(--bg-alt);flex:none;object-fit:cover;}
.author b{display:block;color:var(--ink);font-size:1rem;margin-bottom:.3rem;}
.author p{margin:0;font-size:.88rem;line-height:1.85;}
/* 記事末CTA・関連記事 */
.a-cta{background:var(--ink);color:#fff;padding:clamp(28px,4vw,40px);margin-top:3.2rem;}
.a-cta h2{color:#fff;font-size:1.15rem;font-weight:700;margin:0 0 .7rem;letter-spacing:0;}
.a-cta p{color:#C9CCD0;font-size:.94rem;margin:0 0 1.6rem;}
.related{border-top:1px solid var(--rule);margin-top:clamp(48px,6vw,72px);padding-top:clamp(36px,4vw,52px);}
.rel-list{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,3vw,36px);margin-top:1.6rem;}
.rel{border-top:1px solid var(--ink);padding-top:1rem;text-decoration:none;display:block;}
.rel time{font-size:.78rem;color:var(--muted);}
.rel span{display:block;color:var(--ink);font-weight:700;font-size:.98rem;line-height:1.7;margin-top:.3rem;}
.rel:hover span{color:var(--red-deep);text-decoration:underline;text-underline-offset:3px;}

/* ---------- 22. フォーム ---------- */
.form-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(32px,5vw,72px);align-items:start;}
.doc-toc{border-top:2px solid var(--ink);padding-top:1.4rem;}
.doc-toc h2{font-size:1rem;font-weight:700;color:var(--ink);margin:0 0 1rem;letter-spacing:0;}
.doc-toc ol{margin:0;padding:0;list-style:none;counter-reset:t;display:grid;gap:.7rem;}
.doc-toc li{counter-increment:t;font-size:.94rem;padding-left:2.2rem;position:relative;line-height:1.8;}
.doc-toc li::before{
  content:counter(t,decimal-leading-zero);position:absolute;left:0;top:0;
  font-size:.78rem;font-weight:700;color:var(--red);letter-spacing:.02em;
}
.spec{margin-top:2rem;font-size:.86rem;color:var(--muted);display:grid;gap:.35rem;}
.formcard{border:1px solid var(--rule);background:#fff;padding:clamp(24px,3.5vw,36px);}
.formcard h2{font-size:1.12rem;font-weight:700;color:var(--ink);margin:0 0 .4rem;letter-spacing:0;}
.formcard .sub{font-size:.86rem;color:var(--muted);margin:0 0 1.8rem;}
.field{margin-bottom:1.4rem;}
.field label{display:flex;align-items:center;gap:.6em;font-size:.9rem;font-weight:700;color:var(--ink);margin-bottom:.5rem;}
.req{background:var(--red-web);color:#fff;font-size:.66rem;font-weight:700;padding:.1em .5em;border-radius:2px;letter-spacing:.06em;}
.opt{background:#EFEFF1;color:var(--muted);font-size:.66rem;font-weight:700;padding:.1em .5em;border-radius:2px;letter-spacing:.06em;}
.field input,.field select,.field textarea{
  width:100%;font-family:inherit;font-size:16px;line-height:1.7;color:var(--ink);
  padding:.75em .9em;border:1px solid var(--line-input);border-radius:2px;background:#fff;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--red-web);box-shadow:0 0 0 3px rgba(208,16,24,.14);
}
.field textarea{min-height:7em;resize:vertical;}
.field .help{font-size:.78rem;color:var(--muted);margin:.45rem 0 0;line-height:1.7;}
.field .err{font-size:.82rem;color:var(--red-deep);font-weight:700;margin:.45rem 0 0;}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--red-web);}
.consent{
  display:flex;gap:.7rem;align-items:flex-start;font-size:.86rem;
  background:var(--bg-alt);padding:1rem 1.1rem;margin-bottom:1.5rem;line-height:1.8;
}
.consent input{margin-top:.45em;width:18px;height:18px;flex:none;accent-color:var(--red-web);}
.consent a{color:var(--red-deep);}
.submit{width:100%;font-size:1rem;padding:1em;}
.submit[disabled]{opacity:.55;cursor:not-allowed;}
.after{font-size:.8rem;color:var(--muted);text-align:center;margin:1rem 0 0;line-height:1.8;}
.assure{border-top:1px solid var(--rule);margin-top:1.8rem;padding-top:1.4rem;display:grid;gap:.75rem;}
.assure p{margin:0;font-size:.84rem;padding-left:1.5rem;position:relative;line-height:1.8;}
.assure p::before{
  content:"";position:absolute;left:0;top:.58em;width:8px;height:8px;
  border-radius:50%;border:2px solid var(--red);
}

/* ---------- 22b. プラグインが出力するフォームの体裁を揃える ---------- */
.formcard form p{margin:0 0 1.4rem;}
.formcard label{display:block;font-size:.9rem;font-weight:700;color:var(--ink);margin-bottom:.5rem;}
.formcard input[type="text"],.formcard input[type="email"],.formcard input[type="tel"],
.formcard input[type="url"],.formcard input[type="number"],.formcard input[type="date"],
.formcard select,.formcard textarea{
  width:100%;font-family:inherit;font-size:16px;line-height:1.7;color:var(--ink);
  padding:.75em .9em;border:1px solid var(--line-input);border-radius:2px;background:#fff;
  margin-top:.1rem;
}
.formcard textarea{min-height:7em;resize:vertical;}
.formcard input:focus,.formcard select:focus,.formcard textarea:focus{
  outline:none;border-color:var(--red-web);box-shadow:0 0 0 3px rgba(208,16,24,.14);
}
.formcard input[type="checkbox"],.formcard input[type="radio"]{
  width:18px;height:18px;accent-color:var(--red-web);margin-right:.5em;vertical-align:-.2em;
}
.formcard input[type="submit"],.formcard button[type="submit"],.formcard .wpcf7-submit{
  width:100%;background:var(--red-web);color:#fff;border:0;border-radius:2px;
  font-family:inherit;font-size:1rem;font-weight:700;padding:1em;cursor:pointer;
}
.formcard input[type="submit"]:hover,.formcard button[type="submit"]:hover{background:var(--red-deep);}
.formcard input[type="submit"][disabled],.formcard button[disabled]{opacity:.55;cursor:not-allowed;}
/* 必須・任意の印（プラグイン側で <span class="req"> を使う想定） */
.formcard .required{color:var(--red-deep);font-weight:700;font-size:.8rem;margin-left:.4em;}
/* エラーと完了メッセージ */
.formcard .wpcf7-not-valid-tip,.formcard .smf-error-content{
  font-size:.82rem;color:var(--red-deep);font-weight:700;margin-top:.45rem;
}
.formcard .wpcf7-response-output{
  border:1px solid var(--rule)!important;background:var(--bg-alt);
  padding:1rem 1.2rem!important;margin:1.4rem 0 0!important;font-size:.92rem;border-radius:2px;
}
.form-placeholder{
  border:1px dashed var(--line-input);background:var(--bg-alt);padding:1.4rem 1.6rem;
  font-size:.92rem;line-height:1.8;
}
.form-placeholder p{margin:0 0 .6rem;}
.form-placeholder p:last-child{margin:0;}

/* ---------- 22d. Snow Monkey Forms の体裁 ---------- */
.formcard .smf-item{margin-bottom:1.4rem;}
.formcard .smf-item__label{margin-bottom:.5rem;}
.formcard .smf-item__label__text{
  font-size:.9rem;font-weight:700;color:var(--ink);
  display:inline-flex;align-items:center;gap:.6em;
}
/* 必須・任意のマーク。ラベル内に <span class="smf-required">必須</span> を書いて使う */
.formcard .smf-required,
.formcard .smf-optional{
  font-size:.66rem;font-weight:700;letter-spacing:.06em;
  padding:.15em .55em;border-radius:2px;line-height:1.6;
}
.formcard .smf-required{background:var(--red-web);color:#fff;}
.formcard .smf-optional{background:#EFEFF1;color:var(--muted);}

/* 確認・送信ボタン */
.formcard .smf-action{
  display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem;
}
.formcard .smf-action .smf-button-control__control,
.formcard .smf-button-control__control{
  flex:1 1 auto;background:var(--red-web);color:#fff;border:0;border-radius:2px;
  font-family:inherit;font-size:1rem;font-weight:700;padding:1em 1.4em;cursor:pointer;
  transition:background-color .15s ease;
}
.formcard .smf-button-control__control:hover{background:var(--red-deep);}
/* 「戻る」は控えめに（JSが .is-back を付ける） */
.formcard button.is-back,
.formcard input.is-back{
  background:#fff!important;color:var(--body)!important;border:2px solid var(--rule)!important;
  flex:0 0 auto;
}
.formcard button.is-back:hover{border-color:var(--ink)!important;color:var(--ink)!important;}
/* エラー表示 */
.formcard .smf-error-messages{
  font-size:.82rem;color:var(--red-deep);font-weight:700;margin-top:.45rem;
}
.formcard .smf-item--error .smf-text-control__control,
.formcard .smf-item--error .smf-textarea-control__control,
.formcard .smf-item--error .smf-select-control__control{border-color:var(--red-web);}
/* 確認画面 */

/* 完了画面 */
.formcard .smf-complete-content{font-size:.95rem;line-height:1.95;}

/* ---------- 22e. 入力／確認／完了で見え方を変える ---------- */
.formcard .form-title{font-size:1.12rem;font-weight:700;color:var(--ink);margin:0 0 .4rem;letter-spacing:0;}
.formcard .form-sub{font-size:.86rem;color:var(--muted);margin:0 0 1.8rem;line-height:1.8;}

/* --- 確認画面 --- */
.formcard.is-confirm .form-title{font-size:0;line-height:0;}
.formcard.is-confirm .form-title::after{
  content:"入力内容のご確認";font-size:1.12rem;line-height:1.6;display:block;
}
.formcard.is-confirm .form-sub{font-size:0;line-height:0;margin-bottom:1.4rem;}
.formcard.is-confirm .form-sub::after{
  content:"まだ送信は完了していません。内容をご確認のうえ、送信してください。";
  font-size:.86rem;line-height:1.8;display:block;
  background:var(--tint);color:var(--red-deep);font-weight:700;
  padding:.8em 1em;border-radius:2px;
}
/* --- 確認画面の中身 ---
   実際の構造:
   .smf-item__controls > .smf-placeholder > div > テキスト + input[type=hidden]
   ソース上の改行とインデントが空白として出るため pre-wrap は使わない */
.formcard.is-confirm .smf-item{
  display:block!important;
  gap:0!important;row-gap:0!important;column-gap:0!important;
  margin:0 0 .9rem!important;padding:0 0 .9rem!important;
  border-bottom:1px solid var(--rule);
}
.formcard.is-confirm .smf-item:last-of-type{border-bottom:0;}

.formcard.is-confirm .smf-item__label__text{
  color:var(--muted);font-weight:500;font-size:.84rem;
}
.formcard.is-confirm .smf-required{display:none;}

/* 値そのもの */
.formcard.is-confirm .smf-item__col,
.formcard.is-confirm .smf-item__col--label,
.formcard.is-confirm .smf-item__col--controls,
.formcard.is-confirm .smf-item__label,
.formcard.is-confirm .smf-item__controls,
.formcard.is-confirm .smf-placeholder,
.formcard.is-confirm .smf-placeholder > div{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  flex:none!important;
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  height:auto!important;
  gap:0!important;
  text-align:left!important;
  color:var(--ink);
  font-weight:700;
  font-size:1rem;
  line-height:1.85;
  /* 要素の間にあるソース上の改行を、空行として描画させない */
  white-space:normal!important;
}
/* 値が入る要素だけ、入力時の改行を活かす
   （テキスト入力は .smf-placeholder 直下、セレクトはその中の div に値が入る） */
.formcard.is-confirm .smf-placeholder,
.formcard.is-confirm .smf-placeholder > div{
  white-space:pre-line!important;
  font-size:1rem!important;
}
/* ラベルと値の間だけ、わずかに空ける */
.formcard.is-confirm .smf-item__col--label{margin-bottom:.15rem!important;}

/* ラベルは値より控えめに。
   ラベル列に値と同じ行送りが効くと、下に余分な空きができるため個別に指定する */
.formcard.is-confirm .smf-item__col--label,
.formcard.is-confirm .smf-item__label{
  font-size:.84rem!important;line-height:1.5!important;font-weight:500!important;
}
.formcard.is-confirm .smf-item__label__text{
  color:var(--muted)!important;font-weight:500!important;
  font-size:.84rem!important;line-height:1.5!important;
}

/* --- 完了画面 --- */
.formcard.is-complete .form-title{font-size:0;line-height:0;}
.formcard.is-complete .form-title::after{
  content:"送信が完了しました";font-size:1.25rem;line-height:1.6;display:block;color:var(--ink);
}
.formcard.is-complete .form-sub{display:none;}

.formcard.is-complete .smf-form::before{
  content:"";display:block;width:52px;height:52px;border-radius:50%;
  background:var(--red-web);margin:0 0 1.4rem;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='11' fill='black'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='11' fill='black'/></svg>") center/contain no-repeat;
  position:relative;
}
.formcard.is-complete .smf-form{position:relative;}
.formcard.is-complete .smf-form::after{
  content:"";position:absolute;left:17px;top:19px;width:17px;height:9px;
  border-left:3px solid #fff;border-bottom:3px solid #fff;
  transform:rotate(-45deg);
}
.formcard.is-complete .smf-form p{margin:0 0 1.2rem;font-size:.95rem;line-height:1.95;color:var(--body);}
.formcard.is-complete .smf-form p:first-of-type{
  font-size:1rem;font-weight:700;color:var(--ink);
}

/* ---------- 22f. 進行状況のステップ表示 ---------- */
/* フォームが設置されていないときは出さない */
.formcard.is-none .steps-bar{display:none;}
.formcard.is-none .form-sub{display:none;}
.steps-bar{
  display:flex;list-style:none;margin:0 0 1.8rem;padding:0;
  border:1px solid var(--rule);border-radius:2px;overflow:hidden;
}
.steps-bar li{
  flex:1;text-align:center;font-size:.84rem;font-weight:700;color:var(--muted);
  padding:.7em .4em;background:var(--bg-alt);position:relative;line-height:1.6;
}
.steps-bar li + li{border-left:1px solid var(--rule);}
.formcard.is-input  .steps-bar li[data-step="input"],
.formcard.is-confirm .steps-bar li[data-step="confirm"],
.formcard.is-complete .steps-bar li[data-step="complete"]{
  background:var(--red-web);color:#fff;
}
/* 通過済みの段階は黒で示す */
.formcard.is-confirm .steps-bar li[data-step="input"],
.formcard.is-complete .steps-bar li[data-step="input"],
.formcard.is-complete .steps-bar li[data-step="confirm"]{
  background:var(--ink);color:#fff;
}

/* ---------- 22c. 会社情報の表 ---------- */
table.corp{width:100%;border-collapse:collapse;font-size:.95rem;}
table.corp th,table.corp td{
  border-bottom:1px solid var(--rule);padding:1rem .2rem;text-align:left;
  vertical-align:top;line-height:1.85;
}
table.corp th{width:9rem;font-weight:500;color:var(--muted);font-size:.9rem;}

/* ---------- 23. CTA ---------- */
.cta{background:var(--ink);color:#fff;}
.cta h2{color:#fff;}
.cta .mark{color:#fff;}
.cta p{color:#C9CCD0;max-width:48em;}
.cta-row{display:flex;flex-wrap:wrap;gap:1.1rem;align-items:center;margin-top:2rem;}
.tel{font-weight:800;font-size:1.45rem;color:#fff;line-height:1.3;letter-spacing:-.02em;}
.tel small{display:block;font-size:.76rem;font-weight:400;color:#9AA0A6;letter-spacing:0;}

/* ---------- 24. フッター ---------- */
.site-footer{background:var(--ink);color:#9AA0A6;padding-block:44px;font-size:.86rem;}
.fbar{display:flex;flex-wrap:wrap;gap:2rem;align-items:flex-start;justify-content:space-between;}
.site-footer .logo{color:#fff;width:120px;}
.site-footer .fnav{display:flex;flex-wrap:wrap;gap:1.2rem;list-style:none;margin:0;padding-left:0;}
.site-footer .fnav li{list-style:none;margin:0;}
.site-footer .fnav a{color:#C9CCD0;font-size:.85rem;font-weight:400;text-decoration:none;}
.site-footer .fnav a:hover{text-decoration:underline;}
.copy{width:100%;border-top:1px solid #3A3A38;padding-top:1.5rem;margin-top:.5rem;font-size:.78rem;}

/* ---------- 25. モバイル固定CTA ---------- */
.sticky{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:40;
  background:rgba(255,255,255,.96);border-top:1px solid var(--rule);
  padding:10px 14px;backdrop-filter:blur(8px);
  padding-bottom:calc(10px + env(safe-area-inset-bottom,0px));
}
.sticky .btn{width:100%;}

/* ---------- 29. 会社情報 ---------- */
.greeting{display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start;}
.greeting--nophoto{grid-template-columns:1fr;}
/* 地図。画面幅に合わせて高さを保つ */
.mapwrap{margin-top:1.8rem;border:1px solid var(--rule);line-height:0;}
.mapwrap iframe{display:block;width:100%;height:clamp(280px,42vw,420px);}
.greeting-photo img{width:100%;height:auto;border-radius:2px;}
.greeting-photo figcaption{font-size:.84rem;color:var(--muted);margin-top:.7rem;line-height:1.7;}
.greeting-photo .ph{
  aspect-ratio:3/4;background:var(--bg-alt);border:1px dashed var(--line-input);
  display:flex;align-items:center;justify-content:center;font-size:.82rem;color:var(--muted);
}
.greeting-body p{font-size:1rem;}
.greeting-body p:last-child{margin-bottom:0;}
.sign{margin-top:1.8rem;font-size:.9rem;color:var(--body);}
.sign b{display:block;font-size:1.15rem;font-weight:800;color:var(--ink);margin-top:.3rem;letter-spacing:.02em;}

/* 沿革 */
table.history{width:100%;border-collapse:collapse;font-size:.95rem;}
table.history th,table.history td{
  border-bottom:1px solid var(--rule);padding:.95rem .2rem;text-align:left;
  vertical-align:top;line-height:1.85;
}
table.history th{
  width:9.5rem;font-weight:700;color:var(--ink);font-size:.88rem;
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
table.history tr.is-mark th{color:var(--red-deep);}
table.history tr.is-mark td{font-weight:700;color:var(--ink);}

/* 考え方 */
.values{display:grid;gap:0;}
.value-item{padding:1.8rem 0;border-bottom:1px solid var(--rule);}
.value-item:last-child{border-bottom:0;}
.value-item h3{
  font-size:1.08rem;font-weight:700;color:var(--ink);margin:0 0 .5rem;line-height:1.6;
  display:flex;align-items:center;gap:.6em;
}
.value-item h3::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red);flex:none;}
.value-item p{margin:0;font-size:.96rem;max-width:52em;}

/* ---------- 30. ページ上部の写真帯 ---------- */
.pagehero{margin:0;line-height:0;background:var(--bg-alt);}
.pagehero img{width:100%;height:auto;display:block;}
/* トップは横長に切って帯として見せる */
.pagehero--wide img{aspect-ratio:2.6/1;object-fit:cover;}
.pagehero--page img{aspect-ratio:1.9/1;object-fit:cover;}

/* 本文の横に写真を置くレイアウト */
.with-photo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);gap:clamp(28px,4vw,56px);align-items:start;}
.with-photo figure{margin:0;line-height:0;}
.with-photo img{width:100%;height:auto;border-radius:2px;}
.with-photo figcaption{font-size:.82rem;color:var(--muted);margin-top:.7rem;line-height:1.7;}

/* ---------- 31. 実績 ---------- */
.works{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3vw,44px);}
.work{border-top:2px solid var(--ink);padding-top:1.4rem;}
.work-thumb{margin:0 0 1.2rem;line-height:0;background:var(--bg-alt);}
.work-thumb img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;}
.work-meta{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;font-size:.8rem;color:var(--muted);margin:0 0 .5rem;}
.work-meta .tagline{color:var(--red-deep);font-weight:700;}
.work h3{font-size:1.08rem;font-weight:700;color:var(--ink);margin:0 0 .5rem;line-height:1.7;}
.work h3 a{text-decoration:none;}
.work h3 a:hover{color:var(--red-deep);text-decoration:underline;text-underline-offset:3px;}
.work p{margin:0;font-size:.94rem;}
.work-link{margin-top:.9rem;font-size:.84rem;font-weight:700;color:var(--ink);display:inline-flex;align-items:center;gap:.5em;text-decoration:none;}
.work-link::after{content:"";width:7px;height:7px;border-right:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(-45deg);}
.work-link:hover{color:var(--red-deep);}

/* ---------- 26. レスポンシブ ---------- */
@media (max-width:900px){
  .gnav{display:none;}
  .nav-toggle{display:block;}
  .sticky{display:block;}
  body{padding-bottom:64px;}
  .hero-photo{min-height:0;}
  .hero-top{min-height:0;}
  .hero-top > .wrap{padding-top:clamp(120px,30vw,170px);}
  .hero-top h1{font-size:clamp(1.8rem,8.2vw,2.6rem);}
  .hero-top::after{
    background:
      linear-gradient(to bottom,rgba(10,9,9,.50) 0%,rgba(10,9,9,.12) 14%,rgba(10,9,9,.30) 34%,
        rgba(10,9,9,.62) 62%,rgba(10,9,9,.84) 100%);
  }
  .hero-facts{grid-template-columns:1fr;}
  .hero-facts div{padding-block:14px;}
  .hero-facts div + div{border-left:0;margin-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.3);}
  .hero-photo::before{background:linear-gradient(180deg,rgba(18,16,16,.74) 0%,rgba(18,16,16,.62) 55%,rgba(18,16,16,.5) 100%);}
  .hero-grid,.worries,.nums,.other,.plans-card,.pillars,.svc,.scope,.form-cols,.rel-list,.dl-row{grid-template-columns:1fr;}
  .gnav .btn-quiet{display:none;}
  .svc-item:nth-last-child(-n+2){border-bottom:1px solid var(--rule);}
  .svc-item:last-child,.scope-item:last-child{border-bottom:0;}
  .plan.pick{order:-1;}
  .formcard{order:-1;}
  .post,.post--news{grid-template-columns:1fr;gap:.25rem;padding:1rem 0;}
  .post time{order:-1;}
  .step{grid-template-columns:40px 1fr;gap:1rem;}
  .case dt{float:none;width:auto;}
  .case dd{margin-left:0;}
  .author{gap:1rem;}
  .greeting,.with-photo,.works{grid-template-columns:1fr;}
  .greeting-photo{max-width:220px;}
  table.history th,table.history td{display:block;width:auto;}
  table.history th{border-bottom:0;padding-bottom:.1rem;}
  table.history td{padding-top:0;}
  table.corp th,table.corp td{display:block;width:auto;}
  table.corp th{border-bottom:0;padding-bottom:.2rem;}
  table.corp td{padding-top:0;}
}

/* ---------- 27. 印刷 ---------- */
@media print{
  .site-header,.sticky,.gnav,.nav-toggle,.a-cta,.related,.cta{display:none!important;}
  body{font-size:10.5pt;padding-bottom:0;}
  a{text-decoration:none;color:#000;}
  .site-footer{background:none;color:#000;border-top:1px solid #999;}
}