/* =========================================================
   共通スタイル（デザイン確認用サンプル）
   部品の出どころ：
   ・ヘッダー／ヒーロー／見出し／製品カード／CTA／フッター … 既存サイトA（SET-002・hd8・SEC-070・SEC-156・SEC-047）
   ・ヒーローに重なる「お探しの情報はこちら」／ABOUT帯 … 既存サイトB（purposeNav・historyMinimal）
   色は紺＋ティール、アクセント色は点のみ
   ========================================================= */
:root{
  --c-navy:#0B1F33;
  --c-ink:#081827;
  --c-brand:#0A7A8C;
  --c-brand-dk:#075E6C;
  --c-brand-lt:#9FD3DA;
  --c-sun:#E39A2D;
  --c-bg:#FFFFFF;
  --c-tint:#F3F6F8;
  --c-text:#24313D;
  --c-text-sub:#4E5B67;
  --c-text-mute:#7D8A96;
  --c-line:#D9E1E7;
  --c-line-weak:#E8EDF1;
  --ff-base:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  --ff-mincho:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --ff-en:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --w-max:1120px;
  --sec-y:110px;
  /* 見出しの比率（既存サイトAと同じ：大字 : 小字 ≒ 4.2） */
  --hd-en:clamp(50px,6.6vw,88px);
  --hd-ja:clamp(17px,1.55vw,21px);
}
@media (max-width:767px){:root{--sec-y:64px}}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
@media (max-width:767px){html{scroll-padding-top:64px}}
body{margin:0;font-family:var(--ff-base);color:var(--c-text);background:var(--c-bg);font-size:16px;line-height:1.9;letter-spacing:.04em;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
.wrap{width:min(90%,var(--w-max));margin:0 auto}
.nw{display:inline-block}
.sec{padding:var(--sec-y) 0}
.sec--tint{background:var(--c-tint)}
.sec:not(.sec--tint)+.sec:not(.sec--tint){padding-top:0}
a:focus-visible,button:focus-visible{outline:3px solid var(--c-brand);outline-offset:3px}

/* ---------- ヘッダー（既存サイトA SET-002） ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:9990;height:96px;line-height:1;background:#fff;border-bottom:1px solid var(--c-line-weak)}
.hdr__inner{display:flex;align-items:center;justify-content:space-between;height:100%;padding:0 80px}
.hdr__logo{display:flex;align-items:center;gap:14px;flex-shrink:0}
.hdr__logo img{width:165px;height:40px}
.logo-ph{display:flex;align-items:center;justify-content:center;width:165px;height:40px;border:1.5px dashed var(--c-brand);font:700 15px/1 var(--ff-en);letter-spacing:.3em;text-indent:.3em;color:var(--c-brand)}
.hdr__logo small{font-size:11px;line-height:1.5;letter-spacing:.08em;color:var(--c-text-mute);padding-left:14px;border-left:1px solid var(--c-line)}
.gnav{display:flex;align-items:center;justify-content:flex-end;height:100%;flex:1;padding-left:40px}
.gnav__menu{display:flex;align-items:center;height:100%;font-size:15px;font-weight:700}
.gnav__menu>li{height:100%}
.gnav__link{position:relative;display:flex;align-items:center;height:100%;padding:0 22px;letter-spacing:.1em;color:var(--c-navy);transition:color .4s ease-out}
.gnav__link:hover,.gnav__menu li.is-current>.gnav__link{color:var(--c-brand)}
.gnav__menu li.is-current>.gnav__link::after{content:"";position:absolute;bottom:0;left:22px;right:22px;height:2px;background:var(--c-brand)}
.gnav__cta{margin-left:8px}
.gnav__cta a{display:inline-block;min-width:200px;padding:20px 32px;color:#fff;font-weight:700;font-size:15px;letter-spacing:.1em;text-align:center;line-height:1;background:var(--c-brand);transition:background .4s ease-out}
.gnav__cta a:hover{background:var(--c-brand-dk)}
.gnav__tel{display:none}
.burger{display:none;position:fixed;top:0;right:0;width:64px;height:64px;align-items:center;justify-content:center;background:var(--c-navy);border:0;z-index:9999;cursor:pointer}
.burger__lines{position:relative;width:28px;height:20px}
.burger__lines span{position:absolute;left:0;width:100%;height:1px;background:#fff;transition:all .4s}
.burger__lines span:nth-of-type(1){top:0}
.burger__lines span:nth-of-type(2){top:50%}
.burger__lines span:nth-of-type(3){bottom:0}
@media (max-width:1366px){.hdr__inner{padding:0 24px}}
@media (max-width:1250px){.gnav__link{padding:0 14px}.gnav__menu li.is-current>.gnav__link::after{left:14px;right:14px}.gnav__cta a{min-width:auto}}
@media (max-width:1440px){.hdr__logo small{display:none}}
@media (max-width:767px){
  .hdr{height:64px}
  .hdr__inner{padding-left:12px;padding-right:0}
  .hdr__logo img,.logo-ph{width:132px;height:32px}
  .burger{display:flex}
  .gnav{position:fixed;top:64px;left:0;right:0;width:100%;height:calc(100dvh - 64px);display:block;padding:24px 7%;overflow:auto;overscroll-behavior:contain;background:var(--c-navy);transform:translateX(100%);opacity:0;pointer-events:none;transition:all .4s ease-out;z-index:9998}
  .gnav.is-open{transform:none;opacity:1;pointer-events:auto}
  .gnav__menu{display:block;height:auto;font-size:16px}
  .gnav__menu>li{height:auto}
  .gnav__menu>li:not(:last-child){border-bottom:1px solid rgba(255,255,255,.18)}
  .gnav__link{display:flex;min-height:56px;height:auto;padding:16px 4px;color:#fff}
  .gnav__link:hover,.gnav__menu li.is-current>.gnav__link{color:var(--c-brand-lt)}
  .gnav__menu li.is-current>.gnav__link::after{display:none}
  .gnav__cta{margin:24px 0 0}
  .gnav__cta a{display:block;width:100%;padding:20px}
  .gnav__tel{display:block;margin-top:12px;padding:18px;border:1px solid rgba(255,255,255,.4);color:#fff;text-align:center;font-weight:700;letter-spacing:.08em}
  .burger.is-open .burger__lines span:nth-of-type(1){top:50%;transform:rotate(45deg)}
  .burger.is-open .burger__lines span:nth-of-type(2){opacity:0}
  .burger.is-open .burger__lines span:nth-of-type(3){bottom:auto;top:50%;transform:rotate(-45deg)}
}
html.is-menu-open,body.is-menu-open{overflow:hidden}

/* ---------- ヒーロー（既存サイトA SET-002：自動切替＋ゆるやかなズーム） ---------- */
.hero{position:relative;height:920px;overflow:hidden;background:var(--c-navy)}
.hero__slides{position:absolute;inset:0;z-index:0}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease-out}
.hero__slide.is-active{opacity:1}
.hero__ph{position:relative;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat}
.hero__ph::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,24,39,.62) 0%,rgba(8,24,39,.36) 38%,rgba(8,24,39,.44) 68%,rgba(8,24,39,.80) 100%)}
.hero__catch{position:relative;top:50%;z-index:1;margin:0;transform:translateY(-50%) translateY(-1em);font-family:var(--ff-mincho);font-size:56px;font-weight:500;line-height:1.5;letter-spacing:.2em;text-align:center;color:#fff;text-shadow:0 2px 26px rgba(6,10,16,.7),0 1px 5px rgba(6,10,16,.6)}
.hero__line{display:block}
.hero__lead{display:block;margin-top:28px;font-family:var(--ff-base);font-size:15px;font-weight:500;letter-spacing:.12em;line-height:2;color:rgba(255,255,255,.9)}
.hero__dots{position:absolute;left:0;right:0;bottom:128px;z-index:2;display:flex;justify-content:center;gap:10px}
.hero__dots li{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.45);cursor:pointer;transition:background .3s,transform .3s}
.hero__dots li.is-active{background:var(--c-sun);transform:scale(1.15)}
.hero__note{position:absolute;right:24px;bottom:124px;z-index:2;font-size:11px;letter-spacing:.08em;color:rgba(255,255,255,.7)}
@media (max-width:1250px){.hero__catch{font-size:46px}}
@media (max-width:767px){
  .hero{height:88svh;min-height:600px}
  .hero__catch{font-size:clamp(24px,7.4vw,30px);letter-spacing:.12em;padding:0 12px;transform:translateY(-50%) translateY(-1.5em)}
  .hero__lead{margin-top:20px;font-size:13px;letter-spacing:.06em}
  .hero__dots{bottom:104px}
  .hero__note{right:16px;bottom:84px;font-size:10px}
}
@media (prefers-reduced-motion:no-preference){
  .hero__ph{transform:scale(1.005);transition:transform 7.5s ease-out}
  .hero__slide.is-active .hero__ph{transform:scale(1.075)}
  .hero__catch{animation:heroFade 1.5s .2s ease-out both}
  @keyframes heroFade{from{opacity:0}to{opacity:1}}
}

/* ---------- ヒーローに重なる案内カード（既存サイトB purposeNav × 既存サイトA お知らせ枠） ---------- */
.purpose{position:relative;z-index:3;width:min(90%,1130px);margin:-96px auto 0;padding:36px 48px;background:#fff;border-top:3px solid var(--c-brand);box-shadow:0 14px 44px 4px rgba(11,31,51,.10)}
.purpose h2{margin-bottom:20px;font-size:17px;font-weight:700;letter-spacing:.14em;color:var(--c-navy);text-align:center}
.purpose__links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.purpose__links a{position:relative;display:flex;flex-direction:column;gap:4px;padding:8px 40px 8px 28px;border-left:1px solid var(--c-line)}
.purpose__links a:first-child{border-left:0}
.purpose__num{font:700 11px/1.6 var(--ff-en);letter-spacing:.14em;color:var(--c-brand)}
.purpose__links strong{font-size:16px;line-height:1.7;color:var(--c-navy);transition:color .3s}
.purpose__links small{font-size:12px;line-height:1.7;color:var(--c-text-mute)}
.purpose__links b{position:absolute;right:12px;top:42%;color:var(--c-brand);font-weight:400;transition:transform .3s}
.purpose__links a:hover strong{color:var(--c-brand)}
.purpose__links a:hover b{transform:translateX(4px)}
@media (max-width:767px){
  .purpose{margin-top:-64px;padding:24px 20px 12px}
  .purpose h2{margin-bottom:8px}
  .purpose__links{grid-template-columns:1fr}
  .purpose__links a{border-left:0;border-top:1px solid var(--c-line);padding:16px 32px 16px 4px}
  .purpose__links a:first-child{border-top:0}
  .purpose__links b{right:4px}
}

/* ---------- 会社の定義（既存サイトA スローガン枠） ---------- */
.slg{position:relative;margin-top:-72px;padding:168px 0 104px;text-align:center;background:var(--c-tint);isolation:isolate;overflow:hidden}
/* 既存サイトBのお問い合わせ帯と同じ手法：実写を12%以下の濃さで敷いて質感だけ出す */
.slg::before{content:"";position:absolute;inset:0;z-index:-1;background:url('hero-1.jpg') center 70%/cover no-repeat;opacity:.08}
.slg::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:56px;background:var(--c-brand)}
.slg__ja{margin:0 0 14px;font-family:var(--ff-mincho);font-size:22px;font-weight:600;letter-spacing:.1em;line-height:1.9;color:var(--c-text)}
.slg__main{margin:0 auto 28px;max-width:960px;font-family:var(--ff-mincho);font-size:31px;font-weight:700;letter-spacing:.08em;line-height:1.8;color:var(--c-navy)}
.slg__sub{max-width:760px;margin:0 auto;font-size:15px;line-height:2.05;color:var(--c-text-sub)}
@media (max-width:767px){
  .slg{margin-top:-40px;padding:96px 0 64px;text-align:left}
  .slg::after{display:none}
  .slg__ja{font-size:16px}
  .slg__main{font-size:21px;letter-spacing:.05em}
  .slg__sub{font-size:14px}
  .slg .nw{display:inline}
  .slg__ja,.slg__main{word-break:auto-phrase}
}

/* ---------- 見出し（既存サイトA hd8：小さい日本語＋大きい英字） ---------- */
.hd8{margin:0 0 44px}
.hd8__ja{display:flex;align-items:center;gap:18px;margin:0 0 6px;font-size:var(--hd-ja);font-weight:700;letter-spacing:.16em;line-height:1.5;color:var(--c-navy)}
.hd8__ja::before,.hd8__ja::after{content:none;flex:none;display:block;width:56px;height:1px;background:var(--c-brand)}
.hd8__en{margin:0;font-family:var(--ff-en);font-size:var(--hd-en);font-weight:700;line-height:.98;letter-spacing:.005em;color:var(--c-brand)}
.hd8--center{text-align:center}
.hd8--center .hd8__ja{justify-content:center}
.hd8--center .hd8__ja::before,.hd8--center .hd8__ja::after{content:""}
.hd8--left .hd8__ja::after{content:""}
.hd8--right{text-align:right}
.hd8--right .hd8__ja{justify-content:flex-end}
.hd8--right .hd8__ja::before{content:""}
.hd8-block--right{margin-bottom:56px}
.hd8-block--right .hd8{margin-bottom:24px}
.hd8__lead{max-width:640px;margin:0 0 0 auto;text-align:right;font-size:15px;line-height:1.95;color:var(--c-text-sub)}
@media (max-width:767px){
  .hd8{margin-bottom:30px}
  .hd8__ja{gap:12px}
  .hd8__ja::before,.hd8__ja::after{width:34px}
  .hd8__lead{font-size:14px}
}

/* ---------- 事業内容（既存サイトA SEC-152：淡色パネルに白い枠3つ） ---------- */
.svc__lead{max-width:760px;margin:-20px auto 0;text-align:center;font-size:15px;color:var(--c-text-sub)}
.svc__cont{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:48px;padding:56px 60px 50px;background:var(--c-tint);counter-reset:step}
.svc__item{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--c-line);text-align:center}
.svc__head{padding:26px 16px 24px;background:var(--c-navy)}
.svc__item:nth-child(2) .svc__head{background:#0C3D55}
.svc__item:nth-child(3) .svc__head{background:var(--c-brand)}
.svc__no{font-family:var(--ff-en);font-size:13px;letter-spacing:.2em;color:var(--c-brand-lt)}
.svc__item:nth-child(3) .svc__no{color:#DDF1F3}
.svc__no::after{content:"";display:block;width:28px;height:1px;background:rgba(255,255,255,.35);margin:10px auto 12px}
.svc__ttl{font-size:22px;font-weight:900;letter-spacing:.1em;line-height:1.5;color:#fff}
.svc__body{display:flex;flex-direction:column;flex:1;padding:24px 24px 28px}
/* 工程の流れを示す矢印（PCは右向き、SPは下向き） */
.svc__item+.svc__item::before{content:"";position:absolute;z-index:2;top:46px;left:-14px;width:10px;height:10px;border-top:2px solid var(--c-brand);border-right:2px solid var(--c-brand);transform:rotate(45deg)}
.svc__close{margin-top:auto;padding:16px 18px;background:var(--c-tint);font-size:13.5px;line-height:1.85;color:var(--c-navy);text-align:left}
.svc__steps+.svc__close{margin-top:24px}
.svc__txt{font-size:14px;line-height:1.85;color:var(--c-text-sub);text-align:left}
.svc__steps{width:100%;margin-top:20px;border-top:1px solid var(--c-line-weak);text-align:left}
.svc__steps li{counter-increment:step;display:flex;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid var(--c-line-weak);font-size:14.5px;font-weight:500;color:var(--c-navy)}
.svc__steps li::before{content:counter(step,decimal-leading-zero);flex:none;width:22px;font:700 11px/1 var(--ff-en);letter-spacing:.08em;color:var(--c-brand)}
@media (max-width:1250px){.svc__cont{gap:14px;padding:48px 40px 40px}}
@media (max-width:900px){.svc__cont{grid-template-columns:1fr;padding:24px 20px 20px;gap:28px}.svc__lead{text-align:left}.svc__item+.svc__item::before{top:-20px;left:calc(50% - 6px);transform:rotate(135deg)}}

/* ---------- 技術・製品（既存サイトA SEC-070：分野タグ付きカード） ---------- */
.works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.work__media{border:1px solid var(--c-line-weak);background:#fff;overflow:hidden}
.work__media img{width:100%;height:220px;object-fit:contain;padding:12px;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.work:hover .work__media img{transform:scale(1.03)}
.work__media--fig{display:flex;align-items:center;justify-content:center;height:222px;background:#fff}
.ems-fig{width:100%;height:100%}
.ems-fig text{font-family:var(--ff-base);text-anchor:middle}
.ef-rack rect{fill:#F3F6F8;stroke:var(--c-navy);stroke-width:1.6}
.ef-rack path,.ef-wire{fill:none;stroke:var(--c-navy);stroke-width:1.6}
.ef-box{fill:#fff;stroke:var(--c-navy);stroke-width:1.6}
.ef-box--ems{fill:var(--c-navy)}
.ef-box--grid{stroke:var(--c-brand);stroke-width:2}
.ef-in{font-size:17px;font-weight:700;fill:var(--c-navy);letter-spacing:.06em}
.ef-in--w{fill:#fff}
.ef-in--b{fill:var(--c-brand-dk)}
.ef-lb{font-size:15px;fill:var(--c-text-sub)}
.ems-fig .ef-cap{font-size:14px;fill:var(--c-text-mute);text-anchor:start}
.work__tags{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 12px}
.tag{font-size:12px;letter-spacing:.06em;padding:3px 10px;border:1px solid var(--c-brand-lt);color:var(--c-brand-dk);background:#F1F8F9}
.work__ttl{margin:0 0 10px;font-size:17px;font-weight:700;line-height:1.6;color:var(--c-navy)}
.work__txt{font-size:14px;line-height:1.85;color:var(--c-text-sub)}
.card-link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:6px 0;font-size:14px;font-weight:700;color:var(--c-brand);border-bottom:1px solid var(--c-brand-lt)}
.card-link:hover{color:var(--c-brand-dk);border-color:currentColor}
.center-btn{text-align:center;margin-top:56px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 40px;border:1px solid var(--c-navy);font-size:15px;font-weight:700;letter-spacing:.08em;color:var(--c-navy);transition:background .3s,color .3s,border-color .3s}
.btn:hover{background:var(--c-brand);border-color:var(--c-brand);color:#fff}
@media (max-width:900px){.works{grid-template-columns:1fr;gap:40px}.work__media img,.work__media--fig{height:56vw;max-height:300px}}

/* ---------- 実績・提携（既存サイトA お知らせ枠の行組み） ---------- */
.rec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.rec__box{padding:36px 40px 28px;background:#fff;border-top:3px solid var(--c-brand)}
.rec__ttl{margin-bottom:12px;font-size:19px;font-weight:700;letter-spacing:.12em;line-height:1.4;color:var(--c-navy)}
.rec__list li{display:flex;align-items:baseline;gap:20px;padding:14px 0}
.rec__list li+li{border-top:1px solid var(--c-line-weak)}
.rec__lead{max-width:44em;margin:-16px 0 40px;font-size:15px;color:var(--c-text-sub)}
.rec__date em{display:block;width:fit-content;margin-top:8px;padding:1px 8px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--c-brand-dk);border:1px solid var(--c-brand-lt);background:#F1F8F9}
.rec__date{flex:none;width:84px;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--c-brand-dk);font-variant-numeric:tabular-nums}
.rec__txt{flex:1;font-size:15px;line-height:1.75;color:var(--c-text)}
.rec__txt b{display:block;font-weight:700;color:var(--c-navy)}
.rec__txt small{display:block;font-size:13.5px;color:var(--c-text-sub)}
@media (max-width:900px){
  .rec{grid-template-columns:1fr;gap:20px}
  .rec__box{padding:24px 20px 12px}
  .rec__list li{flex-wrap:wrap;gap:2px 12px;padding:12px 0}
  .rec__date{width:auto;display:flex;align-items:center;gap:10px}
  .rec__date em{margin-top:0}
  .rec__lead{margin:-8px 0 28px;font-size:14px}
  .rec__txt{flex:1 1 100%;font-size:14.5px}
}

/* ---------- ABOUT（既存サイトB historyMinimal） ---------- */
.about{padding:var(--sec-y) 0}
.about__layout{position:relative;display:grid;grid-template-columns:.88fr 1.12fr;gap:88px;align-items:start;padding:62px 0 10px;border-top:1px solid var(--c-line)}
.about__layout::before{content:"";position:absolute;left:calc(44% - 1px);top:62px;bottom:10px;width:1px;background:var(--c-line)}
.about__eyebrow{display:flex;align-items:center;gap:14px;font:700 12px/1.6 var(--ff-en);letter-spacing:.18em;color:var(--c-brand)}
.about__eyebrow::before{content:"";width:34px;height:1px;background:var(--c-brand)}
.about__intro h2{margin-top:24px;font-family:var(--ff-mincho);font-size:clamp(30px,3.35vw,42px);font-weight:600;line-height:1.72;letter-spacing:.075em;color:var(--c-navy)}
.about__story{padding-top:8px}
.about__story p{font-size:15px;line-height:2.2;color:var(--c-text-sub)}
.about__facts{display:flex;flex-wrap:wrap;gap:20px 56px;margin:28px 0 8px;padding:20px 0;border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.about__facts div{display:flex;flex-direction:column;gap:5px}
.about__facts span{font-size:12px;color:var(--c-text-mute)}
.about__facts strong{font-size:18px;font-weight:600;color:var(--c-navy)}
.about__link{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:52px;padding:12px 0;border-bottom:1px solid var(--c-line);font-size:14px;font-weight:700;color:var(--c-brand)}
.about__link:hover{color:var(--c-navy)}
.about__link span{transition:transform .3s}
.about__link:hover span{transform:translateX(4px)}
@media (max-width:900px){
  .about__layout{grid-template-columns:1fr;gap:28px;padding-top:34px}
  .about__layout::before{display:none}
  .about__intro h2{font-size:27px;margin-top:16px}
  .about__facts{gap:16px 36px}
  .about__facts strong{font-size:16px}
}

/* ---------- お問い合わせ（既存サイトA SEC-156） ---------- */
.cta{position:relative;padding:96px 0;background:var(--c-navy);color:#fff;text-align:center}
.cta__inner{width:min(90%,960px);margin:0 auto}
.cta__txt{max-width:720px;margin-left:auto;margin-right:auto}
.cta__ttl{margin-bottom:24px;font-family:var(--ff-mincho);font-weight:400}
.cta__ttl-en{display:block;margin-bottom:12px;font-family:var(--ff-en);font-size:18px;font-weight:700;letter-spacing:.24em;text-indent:.24em;line-height:1;color:var(--c-brand-lt)}
.cta__ttl-jp{display:block;font-size:48px;line-height:1.25;letter-spacing:.15em}
.cta__txt{margin-bottom:40px;font-size:15px;line-height:2;color:#D5DEE5}
/* 既存サイトBの contactFrame（フォームは不要になったため電話の枠のみ） */
.cta__grid{display:grid;grid-template-columns:1fr;max-width:480px;margin:0 auto}
.cta__phone{display:flex;align-items:center;justify-content:center;min-height:150px;padding:26px 24px;flex-direction:column;gap:6px;background:#fff;color:var(--c-navy)}
.cta__phone span{font-size:14px;font-weight:700}
.cta__phone strong{font-family:var(--ff-en);font-size:34px;font-weight:700;letter-spacing:.04em;line-height:1.3;font-variant-numeric:tabular-nums}
.cta__phone small{display:none;font-size:12px;color:var(--c-text-mute)}
@media (max-width:767px){
  .cta{padding:56px 0;text-align:left}
  .cta__ttl-en{font-size:15px;text-indent:0}
  .cta__ttl-jp{font-size:34px}
  .cta__txt{margin-bottom:28px;font-size:14px}
  .cta__phone{min-height:120px}
  .cta__phone strong{font-size:30px}
  .cta__phone small{display:block}
}

/* ---------- フッター（既存サイトA SEC-047） ---------- */
.ftr{padding-top:72px;background:var(--c-ink);color:#B7C4CF;border-top:5px solid var(--c-brand)}
.ftr__top{display:flex;gap:56px;align-items:flex-start}
.ftr__brand{width:320px;flex:none}
.ftr__name{font-size:16px;font-weight:700;line-height:1.6;color:#fff}
.ftr__name span{display:block;font-size:12px;font-weight:400;letter-spacing:.06em;color:#8FA0AE}
.ftr__addr{margin-top:18px;font-size:13px;line-height:1.95;color:#A6B4C0}
.ftr__addr a{color:#fff}
.ftr__navs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;flex:1}
.ftr__ttl{margin:0 0 14px;font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--c-brand-lt)}
.ftr__list li{padding:5px 0;font-size:14px}
.ftr__list a{color:#C9D3DB}
.ftr__list a:hover{color:#fff}
.ftr__bar{margin-top:56px;border-top:1px solid rgba(183,196,207,.16);color:#8FA0AE}
.ftr__bar-inner{display:flex;justify-content:space-between;align-items:center;min-height:56px;font-size:12px}
.ftr__bar a{margin-left:20px;color:#A6B4C0}
.ftr__bar a:hover{color:#fff}
@media (max-width:840px){
  .ftr{padding-top:48px}
  .ftr__top{flex-direction:column;gap:36px}
  .ftr__brand{width:100%}
  .ftr__navs{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .ftr__bar{margin-top:40px}
  .ftr__bar-inner{flex-direction:column-reverse;align-items:flex-start;gap:8px;padding:16px 0 96px}
  .ftr__bar a{margin:0 16px 0 0}
}

/* ---------- スマホ下部の固定バー ---------- */
.sp-bar{display:none}
@media (max-width:767px){
  .sp-bar{position:fixed;left:0;right:0;bottom:0;z-index:9000;display:grid;grid-template-columns:1fr;padding:8px 16px calc(8px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--c-line)}
  .sp-bar a{display:flex;align-items:center;justify-content:center;min-height:52px;font-size:15px;font-weight:700;letter-spacing:.06em}
  .sp-bar .tel{border:1px solid var(--c-navy);color:var(--c-navy)}
}

/* ---------- スクロール連動の淡いフェードイン（既存サイトAと同じ） ---------- */
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(16px);transition:opacity .85s cubic-bezier(.2,.7,.3,1),transform .85s cubic-bezier(.2,.7,.3,1)}
  .rv.is-in{opacity:1;transform:none}
}

/* =========================================================
   多言語対応デモ
   ========================================================= */
:root{--ff-en-head:"Helvetica Neue",Helvetica,Arial,sans-serif}

/* 言語切替（ヘッダー内・PC） */
.lang{display:flex;align-items:center;margin-left:20px;border:1px solid var(--c-line);height:40px}
.lang button{position:relative;height:100%;padding:0 12px;border:0;background:none;font:700 12px/1 var(--ff-base);letter-spacing:.06em;color:var(--c-text-mute);cursor:pointer;transition:color .3s,background .3s}
.lang button+button{border-left:1px solid var(--c-line)}
.lang button:hover{color:var(--c-navy)}
.lang button[aria-pressed="true"]{background:var(--c-navy);color:#fff}
.lang button[aria-disabled="true"]{color:#B4BEC7;cursor:help}
.lang button[aria-disabled="true"]::after{content:"準備中";position:absolute;top:-9px;right:-6px;padding:1px 5px;font-size:9px;font-weight:700;letter-spacing:.04em;color:#fff;background:var(--c-sun);line-height:1.4}
html[lang="en"] .lang button[aria-disabled="true"]::after{content:"Soon"}
.lang__label-sp{display:none}
@media (max-width:1250px){.lang{margin-left:12px}.lang button{padding:0 9px}}
@media (max-width:767px){
  .lang{position:absolute;top:12px;right:76px;height:40px;margin:0;background:#fff}
  .lang button{padding:0 10px}
  .lang__label-pc{display:none}
  .lang__label-sp{display:inline}
  .lang button[aria-disabled="true"]::after{top:-7px;right:-4px;font-size:8px}
}

/* 英語表示：ヒーローと主要見出しは Helvetica */
html[lang="en"] .hero__catch{font-family:var(--ff-en-head);font-weight:300;letter-spacing:.01em;line-height:1.25}
html[lang="en"] .hero__lead{font-family:var(--ff-en-head);letter-spacing:.04em;margin-top:32px}
html[lang="en"] .hd8__ja,
html[lang="en"] .purpose h2,
html[lang="en"] .slg__ja,
html[lang="en"] .slg__main,
html[lang="en"] .svc__ttl,
html[lang="en"] .work__ttl,
html[lang="en"] .rec__ttl,
html[lang="en"] .about__intro h2,
html[lang="en"] .cta__ttl-jp,
html[lang="en"] .post-card__ttl,
html[lang="en"] .page-head__ttl,
html[lang="en"] .article__ttl{font-family:var(--ff-en-head);letter-spacing:.01em}
html[lang="en"] .hd8__ja{letter-spacing:.04em}
html[lang="en"] .slg__ja{font-weight:400}
html[lang="en"] .slg__main{font-weight:700;line-height:1.5}
html[lang="en"] .about__intro h2{font-weight:500;line-height:1.35}
html[lang="en"] .cta__ttl-jp{font-weight:300;letter-spacing:.02em}
html[lang="en"] .svc__ttl{font-weight:700}
html[lang="en"] .gnav__link,html[lang="en"] .gnav__cta a{letter-spacing:.04em}
html[lang="en"] body{letter-spacing:0}
@media (min-width:768px){
  html[lang="en"] .hero__catch{font-size:64px}
  html[lang="en"] .slg__main{font-size:30px}
}
@media (max-width:767px){html[lang="en"] .hero__catch{font-size:clamp(30px,9vw,38px)}}

/* デモ案内ボタン */
.demo-pill{position:fixed;right:20px;bottom:20px;z-index:8000;display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;background:#fff;border:1px solid var(--c-brand);color:var(--c-brand-dk);font-size:13px;font-weight:700;letter-spacing:.06em;box-shadow:0 8px 24px rgba(11,31,51,.14);transition:background .3s,color .3s}
.demo-pill b{padding:2px 6px;font:700 10px/1.4 var(--ff-en);letter-spacing:.12em;color:#fff;background:var(--c-brand)}
.demo-pill:hover{background:var(--c-brand);color:#fff}
.demo-pill:hover b{background:#fff;color:var(--c-brand)}
@media (max-width:767px){.demo-pill{right:12px;bottom:84px;min-height:40px;padding:0 14px;font-size:12px}}

/* トースト */
.toast{position:fixed;left:50%;bottom:32px;z-index:9995;max-width:min(90vw,560px);padding:14px 22px;background:var(--c-navy);color:#fff;font-size:14px;line-height:1.7;box-shadow:0 12px 32px rgba(0,0,0,.25);transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.toast.is-show{opacity:1;transform:translate(-50%,0)}
@media (max-width:767px){.toast{bottom:92px}}

/* =========================================================
   お知らせ・ブログ（管理画面デモと連動）
   ========================================================= */
.sec+.about{padding-top:0}
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.post-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--c-line-weak);transition:box-shadow .3s,transform .3s}
.post-card:hover{box-shadow:0 12px 30px rgba(11,31,51,.10);transform:translateY(-2px)}
.post-card__img{aspect-ratio:16/10;overflow:hidden;background:var(--c-tint)}
.post-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.post-card:hover .post-card__img img{transform:scale(1.04)}
.post-card__noimg{display:flex;align-items:center;justify-content:center;height:100%;font:700 13px/1 var(--ff-en);letter-spacing:.3em;color:var(--c-brand-lt);background:var(--c-navy)}
.post-card__body{display:flex;flex-direction:column;gap:10px;padding:20px 22px 24px}
.post-card__meta{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--c-text-mute);font-variant-numeric:tabular-nums}
.post-card__cat{padding:2px 10px;font-size:11.5px;font-weight:700;letter-spacing:.06em;color:var(--c-brand-dk);border:1px solid var(--c-brand-lt);background:#F1F8F9}
.post-card__ttl{font-size:16.5px;font-weight:700;line-height:1.65;color:var(--c-navy)}
.posts__empty{grid-column:1/-1;padding:48px 24px;text-align:center;color:var(--c-text-mute);background:var(--c-tint)}
@media (max-width:900px){.posts{grid-template-columns:1fr;gap:20px}}

/* 下層ページ（ブログ一覧・記事） */
.page-head{position:relative;margin-top:96px;padding:72px 0 64px;background:var(--c-navy);color:#fff;overflow:hidden;isolation:isolate}
.page-head::before{content:"";position:absolute;inset:0;z-index:-1;background:url('hero-1.jpg') center 70%/cover no-repeat;opacity:.22}
.page-head__en{font:700 13px/1 var(--ff-en);letter-spacing:.24em;color:var(--c-brand-lt)}
.page-head__ttl{margin-top:14px;font-family:var(--ff-mincho);font-size:clamp(28px,3.4vw,40px);font-weight:500;letter-spacing:.1em;line-height:1.4;color:#fff}
.crumb{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;font-size:12.5px;color:#B7C4CF}
.crumb a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.4)}
@media (max-width:767px){.page-head{margin-top:64px;padding:48px 0 44px}}
.cats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:36px}
.cats button{min-height:40px;padding:0 18px;border:1px solid var(--c-line);background:#fff;font:700 13px/1 var(--ff-base);letter-spacing:.06em;color:var(--c-text-sub);cursor:pointer}
.cats button[aria-pressed="true"]{background:var(--c-navy);border-color:var(--c-navy);color:#fff}

.article{max-width:800px;margin:0 auto}
.article__meta{display:flex;align-items:center;gap:12px;font-size:13.5px;color:var(--c-text-mute)}
.article__ttl{margin:16px 0 32px;font-size:clamp(24px,3vw,34px);font-weight:700;line-height:1.55;color:var(--c-navy);letter-spacing:.04em}
.article__eye{margin-bottom:40px}
.article__eye img{width:100%;aspect-ratio:16/9;object-fit:cover}
.article__back{display:inline-flex;align-items:center;gap:10px;margin-top:64px;min-height:52px;padding:0 28px;border:1px solid var(--c-navy);font-size:14px;font-weight:700;color:var(--c-navy)}
.article__back:hover{background:var(--c-brand);border-color:var(--c-brand);color:#fff}

/* 記事本文（管理画面のエディタと同じ組版） */
.prose{font-size:16px;line-height:2;color:var(--c-text)}
.prose>*+*{margin-top:1.4em}
.prose h2{margin-top:2.4em;padding-bottom:10px;border-bottom:2px solid var(--c-navy);font-size:22px;font-weight:700;line-height:1.6;color:var(--c-navy)}
.prose h3{margin-top:2em;padding-left:14px;border-left:4px solid var(--c-brand);font-size:18px;font-weight:700;line-height:1.6;color:var(--c-navy)}
.prose ul,.prose ol{padding-left:1.4em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose li+li{margin-top:.4em}
.prose blockquote{margin-left:0;margin-right:0;padding:18px 22px;background:var(--c-tint);color:var(--c-text-sub)}
.prose a{color:var(--c-brand-dk);text-decoration:underline;text-underline-offset:3px}
.prose figure{margin-left:0;margin-right:0}
.prose figure img{width:100%;height:auto}
.prose figcaption{margin-top:8px;font-size:13px;color:var(--c-text-mute);text-align:center}
.prose strong,.prose b{font-weight:700;color:var(--c-navy)}
/* 英語は語の区切りに空白が要るため、改行用の区切り（.nw）同士に間を空ける */
html[lang="en"] .nw+.nw{margin-left:.28em}
