/* v2.4: equipment photography, editorial pages, careers and contextual enquiries */
body{font-size:16px}
:focus-visible{outline:2px solid #b83d1f;outline-offset:5px}
.sec-idx,.eyebrow,.prod .cat,.status,.ft h5,.copy,.hero-cap{font-size:12px}
.btn,.nav,.related a,.ft li.sub,.ft .addr,.note,.crumb,.sec-lead{font-size:14px}
.pillar p,.prod p,.feat3 p,.hub-lead,.ptop p.lead,.prose p,.rec p{font-size:16px}
.btn{min-height:44px;align-items:center}
.crumb{padding:20px var(--gut) 0;overflow-wrap:anywhere}
.wrap>*,.ptop-in>*,.co>*,.rec-grid>*{min-width:0}
.logo small{font-size:10px;letter-spacing:.1em}
.table-scroll{overflow-x:auto;max-width:100%;margin:20px 0}
.table-scroll table{min-width:640px}
.table-scroll:focus-visible{outline-offset:2px}
.product-hero{background:#0b1d32}
.product-hero .ptop-in{grid-template-columns:1fr 1.08fr;gap:clamp(24px,4vw,64px);padding-block:64px}
.product-hero h1{font-family:var(--sans);font-size:clamp(30px,3.7vw,46px);font-weight:700;letter-spacing:.015em;line-height:1.5;text-wrap:balance}
.product-hero .product-name{font-size:16px;color:#d6e0ec;margin:0 0 18px}
.product-hero .lead{max-width:30em;line-height:2}
.product-hero .btn-solid{margin-top:4px;background:#fff;color:#0b1d32;padding:16px 22px;border:1px solid #fff}
.product-hero .btn-solid:hover{background:#e1e7ef}
.equipment-figure{margin:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative}
.ptop .equipment-figure img{width:100%;max-height:550px;aspect-ratio:4/5;object-fit:contain;background:transparent;position:relative;z-index:1;filter:drop-shadow(0 18px 10px rgba(0,0,0,.15))}
.equipment-figure figcaption{font-size:12px;color:#becddd;text-align:center;max-width:32em;margin:18px 0 0}
.equipment-card{background:#0b1d32;display:flex;align-items:center;justify-content:center;padding:20px}
.prod .equipment-card img{object-fit:contain;height:100%;width:100%;background:transparent}
.prod .im.equipment-card{aspect-ratio:4/3}
.plasma-photo{margin:0;background:#0b1d32}
.plasma-photo img,.ptop .plasma-photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#0b1d32}
.plasma-photo figcaption{font-size:12px;color:#c5cfdb;padding:12px 18px}
.editorial-head{padding:clamp(52px,7vw,96px) 0 48px;background:#0b1d32;color:#fff}
.editorial-head .eyebrow{color:#adbed0}
.editorial-head h1{font-family:var(--sans);font-size:clamp(30px,4.3vw,54px);line-height:1.55;max-width:19em;margin:0 0 24px;text-wrap:balance}
.editorial-head p{max-width:40em;color:#c5cfdb;margin:0;line-height:2}
.editorial-head .btn{color:#fff;border-color:#adbed0}
.editorial-layout{display:grid;grid-template-columns:minmax(180px,.6fr) minmax(0,1.5fr);gap:clamp(30px,6vw,100px)}
.editorial-aside{border-top:2px solid #173c62;padding-top:22px;color:var(--ink-2)}
.editorial-aside strong{display:block;font-size:21px;color:var(--navy);margin-top:6px}
.editorial-body{max-width:44em}
.editorial-body h2{font-family:var(--sans);font-size:clamp(23px,2.4vw,30px);line-height:1.6;margin:0 0 22px}
.editorial-body p{line-height:2.2;margin:0 0 30px;color:var(--ink-2)}
.signature{padding-top:20px;border-top:1px solid var(--rule);text-align:right}
.signature strong{display:block;font-size:23px;color:var(--navy)}
.career-intro{max-width:50em}
.career-intro h2{font-family:var(--sans);font-size:clamp(25px,3vw,36px);line-height:1.7}
.career-roles{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.career-role{padding-top:24px;border-top:2px solid #1b3c5d}
.career-role h3{font-size:27px;color:var(--navy);margin:8px 0 16px;font-family:var(--sans)}
.career-role p{color:var(--ink-2);line-height:2}
.career-role ul{padding-left:1.2em;color:var(--ink-2)}
.career-role li{padding:5px 0}
.work-sequence{list-style:none;margin:0;padding:0}
.work-sequence li{display:grid;grid-template-columns:70px 1fr;gap:28px;padding:30px 0;border-top:1px solid var(--rule)}
.work-sequence .sequence-no{font-family:var(--mono);font-size:26px;color:#355a7c}
.work-sequence h3{font-family:var(--sans);font-size:23px;margin:0 0 12px;color:var(--navy)}
.work-sequence p{color:var(--ink-2);margin:0;max-width:44em}
.career-link{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:28px 0}
.career-link h3{font-family:var(--sans);font-size:24px;margin:0 0 8px;color:var(--navy)}
.career-link p{color:var(--ink-2);margin:0}
.review-note{background:#fff3dd;color:#563800;padding:14px 20px;font-size:14px;border-bottom:1px solid #d6b77c}
.contact-layout{display:grid;grid-template-columns:.72fr 1.4fr;gap:clamp(28px,6vw,84px);align-items:start}
.contact-intro h2{font-family:var(--sans);font-size:27px;margin:0 0 20px}
.contact-intro p{color:var(--ink-2)}
.contact-form{background:#fff;padding:clamp(22px,4vw,48px)}
.contact-form fieldset{border:0;margin:0 0 32px;padding:0;min-width:0}
.contact-form legend{font-size:22px;font-weight:700;color:var(--navy);margin-bottom:22px}
.field{margin-bottom:24px}
.field label{display:block;font-size:15px;margin-bottom:8px;font-weight:500}
.field label small{font-size:12px;color:var(--ink-2);font-weight:400;margin-left:10px}
.field input,.field select,.field textarea{width:100%;border:1px solid #8292a5;background:#fff;border-radius:2px;padding:12px;font-family:var(--sans);font-size:16px;color:var(--ink);min-height:48px}
.field textarea{resize:vertical;min-height:170px;line-height:1.9}
.field input::placeholder,.field textarea::placeholder{color:#66778a}
.field .hint{font-size:13px;color:var(--ink-2);margin:6px 0 0}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.context-summary{padding:16px 18px;border-left:3px solid #234c72;background:#edf2f7;color:#294964;margin-bottom:26px;font-size:14px}
.form-error{color:#86221b;background:#fff0ed;padding:14px 18px;margin-bottom:24px}
.contact-form button{font:inherit;min-height:48px;cursor:pointer;border:1px solid var(--navy);padding:12px 24px}
.contact-form button.primary{background:var(--navy);color:#fff}
.contact-form button.secondary{background:#fff;color:var(--navy)}
.form-actions{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.confirmation{margin:0 0 28px}
.confirmation div{padding:15px 0;border-bottom:1px solid var(--rule)}
.confirmation dt{color:var(--ink-2);font-size:14px;margin-bottom:6px}
.confirmation dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.news-list{list-style:none;margin:0;padding:0}
.news-list li{border-bottom:1px solid var(--rule)}
.news-list li:first-child{border-top:1px solid var(--rule)}
.news-list a{display:grid;grid-template-columns:110px 84px 1fr 24px;gap:20px;align-items:start;padding:28px 0}
.news-list time{font-family:var(--mono);font-size:14px;color:var(--ink-2)}
.news-category{font-size:12px;color:#365776;border:1px solid #b9c8d5;text-align:center;padding:2px 6px}
.news-list a:hover .news-title{color:var(--orange-d);text-decoration:underline}
.news-article{max-width:780px;margin:0 auto;overflow-wrap:anywhere}
.news-article h1{font-family:var(--sans);font-size:clamp(27px,3.4vw,40px);line-height:1.6;margin:20px 0 36px}
.article-body{font-size:16px;line-height:2.1}
.article-body img,.article-body video,.article-body iframe{max-width:100%;height:auto}
.article-body figure{max-width:100%;margin:24px 0}
.article-body a{text-decoration:underline;text-underline-offset:4px;color:#225d8a}
.article-body table{width:100%;border-collapse:collapse}
.article-body th,.article-body td{padding:10px;border:1px solid var(--rule)}
.article-body pre{white-space:pre-wrap;overflow-wrap:anywhere}
.pagination{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;margin-top:30px}
.pagination a{padding:10px 18px;border:1px solid var(--rule);background:#fff}
[hidden]{display:none!important}
@media(max-width:860px){
 .product-hero .ptop-in{grid-template-columns:1fr;padding-block:40px;gap:24px}
 .product-hero .equipment-figure{grid-row:2}
 .ptop .equipment-figure img{max-height:420px;aspect-ratio:1/1}
 .editorial-layout,.contact-layout,.career-roles{grid-template-columns:1fr}
 .editorial-aside{max-width:24em}
 .career-roles{gap:32px}
 .career-link{grid-template-columns:1fr}
}
@media(max-width:540px){
 .field-grid{grid-template-columns:1fr}
 .work-sequence li{grid-template-columns:36px 1fr;gap:16px}
 .news-list a{grid-template-columns:110px 1fr;gap:10px 16px}
 .news-list .news-category{justify-self:start}
 .news-list .news-title{grid-column:1/-1}
 .news-list .news-arrow{display:none}
 .contact-form{padding:22px 18px}
 .dl div{grid-template-columns:1fr;gap:4px}
 .product-hero h1{font-size:30px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}


/* ===== v2.5 (2026-09-08) ===== */
/* ロゴ画像 */
.logo img{height:26px;width:auto;display:block}
.logo small{margin-top:4px}
.ft .logo img,.logo-ft img{height:24px;filter:brightness(0) invert(1)}
@media(max-width:600px){.logo img{height:21px}}

/* 署名・肩書きを明朝に */
.editorial-aside strong,.signature strong{font-family:var(--serif);font-weight:700;letter-spacing:.14em}
.editorial-aside,.signature{font-family:var(--serif);letter-spacing:.06em}
.signature strong{margin-top:8px}

/* 冒頭ブロックの背景画像フック
   画像を差し替えるときは --bg の url() を変えるだけ。
   写真が用意できるまでは暗いグラデーションで代替する。 */
.editorial-head.has-bg,.ptop.has-bg{position:relative;overflow:hidden;background-color:transparent}
.editorial-head.has-bg:before,.ptop.has-bg:before{
  content:"";position:absolute;inset:0;z-index:0;
  background-image:var(--bg,none);background-size:cover;background-position:center;
}
.editorial-head.has-bg:after,.ptop.has-bg:after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(11,29,50,.93) 0%,rgba(11,29,50,.80) 44%,rgba(11,29,50,.42) 100%);
}
/* 背景未設定時のフォールバック（無地に少しだけ奥行きを付ける） */
.editorial-head.has-bg:before,.ptop.has-bg:before{
  background-color:#0b1d32;filter:saturate(.85);
  background-image:var(--bg,radial-gradient(120% 90% at 78% 25%,#16324f 0%,#0b1d32 62%));
}
/* ↓ 写真が決まったら url() を差し替える */
.bg-story{--bg:url("../images/plasma-focus.webp")}
/* .bg-message{--bg:url("/images/bg-message.webp")} */

.editorial-head.has-bg>*,.ptop.has-bg>*{position:relative;z-index:2}


/* ===== Photo treatment / 2026-09-08 =====
   White catalogue photographs are framed illustrations on the existing navy.
   scale-down never enlarges the actual bitmap beyond its intrinsic pixel size.
   Add catalog-figure to a product figure or catalog-frame to a card's .im.
   Keep white originals; do not use blend/mask/filter on machine photographs. */
.ptop .catalog-figure img{
  width:100%;height:auto;max-width:440px;max-height:440px;aspect-ratio:1/1;
  object-fit:scale-down;object-position:center;
  background:#fff;border:8px solid var(--paper);padding:18px;
  box-shadow:0 0 0 1px rgba(201,210,221,.45);filter:none;
}
.catalog-figure figcaption{margin-top:16px}
.prod .im.catalog-frame{
  background:#fff;padding:16px;border-bottom:1px solid var(--rule);
}
.prod .im.catalog-frame img{
  width:100%;height:100%;object-fit:scale-down;object-position:center;
  background:#fff;padding:0;filter:none;
}
/* Photo detail is already composed as 4:3; cards retain their 16:10 slots. */
.prod .im:has(.plasma-focus){background:var(--navy)}
.prod .im img.plasma-focus{object-fit:contain;object-position:center}
.ptop img.plasma-focus{aspect-ratio:4/3;object-fit:contain}


/* ===== v2.6 ヒーロー統一（全幅写真＋左グラデーション）2026-09-08 =====
   参考: sentech.com の製品ページ。高さは約16:4、写真は右寄せ、文字は左。
   写真は --bg の url() を差し替えるだけ。装置写真は「部分拡大」を使う。 */
html{--head:"Shippori Mincho B1","Yu Mincho","Hiragino Mincho ProN",serif}  /* 2026-09-08 下野判断：見出しは現行の明朝で確定 */
.hero h1,.product-hero h1,.editorial-head h1,.sec-title,.pillar h3,.rec h2.big{font-family:var(--head)}

/* トップ：高さ16:5、見出し1行・白1色 */
.hero{min-height:clamp(360px,25vw,480px);display:flex;align-items:center}
.hero .wrap{width:100%}
.hero-img{object-position:center right;opacity:.7}
.hero-shade{background:linear-gradient(90deg,rgba(10,26,51,.97) 0%,rgba(10,26,51,.86) 40%,rgba(10,26,51,.30) 75%,rgba(10,26,51,.20) 100%)}
.hero-in{padding:40px 0 24px;max-width:none}
.hero h1{font-size:clamp(26px,3.6vw,50px);line-height:1.35;letter-spacing:.02em;margin:0 0 22px;font-weight:700}
.hero h1 br{display:none}
.hero h1 .em{color:inherit}
.hero .eyebrow.light{color:#adbed0}
.hero p{font-size:15px;margin:0 0 24px;max-width:38em}
.hero-cap{padding-bottom:0}
@media(max-width:700px){.hero h1 br{display:inline}}

/* 製品ページ・装置開発の仕事：写真を背景化 */
.hero-photo{min-height:clamp(340px,25vw,480px);display:flex;align-items:center}
.hero-photo .wrap{width:100%}
.product-hero.hero-photo .ptop-in{grid-template-columns:1fr;padding-block:40px}
.product-hero.hero-photo .equipment-figure{display:none}
.editorial-head.hero-photo{padding-block:40px}
.has-bg.hero-photo:before{background-position:right center}
.has-bg.hero-photo:after{background:linear-gradient(90deg,rgba(11,29,50,.97) 0%,rgba(11,29,50,.88) 34%,rgba(11,29,50,.40) 66%,rgba(11,29,50,.28) 88%,rgba(11,29,50,.60) 100%)}
.bg-hltsa{--bg:url("../images/hltsa-hero.webp")}
.bg-hmr{--bg:url("../images/hmr-hero.webp")}
/* HMRは元写真252×466pxしかないため、縦いっぱいで右寄せ表示（横には引き伸ばさない） */
.bg-hmr.has-bg:before{background-size:auto 100%;background-repeat:no-repeat}
@media(max-width:860px){
  .has-bg.hero-photo:after{background:linear-gradient(180deg,rgba(11,29,50,.94) 0%,rgba(11,29,50,.86) 55%,rgba(11,29,50,.55) 100%)}
  .hero-photo{min-height:0}
}

/* 1行固定テキスト：--n は全角換算の文字数。コンテナ幅に収まるよう自動で縮小し、上限はfont-sizeの通常値 */
.wrap{container-type:inline-size}
.oneline{white-space:nowrap;max-width:none}
.hero p.oneline{font-size:min(15px,calc(100cqw / var(--n)))}
.hero h1.oneline,.product-hero h1.oneline,.editorial-head h1.oneline{font-size:min(50px,calc(100cqw / var(--n)))}
.product-hero h1.oneline{font-size:min(46px,calc(100cqw / var(--n)))}
.editorial-head h1.oneline{max-width:none;margin-bottom:0}
.product-hero.hero-photo h1{margin-bottom:24px}
/* 帯（SEMICON帯と共通の配色）：高さを詰める（20px→12px、27インチで約5mm）。製品ページではリード文を載せる */
.strip-in{padding:12px var(--gut)}  /* 帯テキストの左端もヒーロー見出しに揃える */
.strip-lead .txt{margin:0;font-size:min(14.5px,calc(100cqw / var(--n)));color:#e1e7ef}
.strip-lead .strip-in{justify-content:flex-start}
@media(max-width:860px){.oneline{white-space:normal}.hero p.oneline{font-size:15px}.strip-lead .txt{font-size:14px}.hero h1.oneline,.product-hero h1.oneline,.editorial-head h1.oneline{font-size:28px}}

/* 見出しの高さ位置を全ページで揃える（2026-09-08）
   ヒーロー上端から 52px の余白 → 104px の前置き枠（eyebrow・型式・ステータス）→ h1。
   h1 の上端はどのページでも同じ高さになる。前置きが少ないページは枠の下に寄せる。 */
.hero,.hero-photo{align-items:flex-start}
.hero .hero-in{padding:52px 0 24px}
.product-hero.hero-photo .ptop-in{padding:52px var(--gut) 40px}  /* 左右余白を維持（ヒーロー見出しと左端を揃える） */
.editorial-head.hero-photo{padding:52px 0 40px}
.hero-pre{height:104px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:10px}
.hero-pre>*{margin:0}
.hero-pre .status{display:inline-block}
.hero h1,.product-hero h1,.editorial-head h1{margin:0 0 22px;line-height:1.35;letter-spacing:.02em}
.product-hero h1.oneline{font-size:min(50px,calc(100cqw / var(--n)))}
.hero-post{margin-top:0}
.hero-post .hero-cta{margin-top:0}
.hero-cap{margin-top:8px}
@media(max-width:860px){.hero-pre{height:auto}.hero,.hero-photo{align-items:center}}

/* ===== PRODUCTS ハブ（半導体／リーク検査）：トップカテゴリとして一段大きく（高さ16:5・見出し60px） ===== */
.hub-hero{min-height:clamp(440px,31vw,600px)}
.hub-hero h1.oneline{font-size:min(60px,calc(100cqw / var(--n)))}
.bg-hub-semi{--bg:url("../images/chamber.webp")}
.bg-hub-semi.has-bg:before{background-position:center 45%}
.bg-hub-leak{--bg:url("../images/hltsa-hero.webp")}

/* ===== COMPANY 群（会社概要・NEWS・代表メッセージ）：紙色のページヘッド。製品ページ（紺＋写真）と区別する ===== */
.page-head{position:relative;overflow:hidden;background:var(--paper-2);color:var(--navy);border-bottom:1px solid var(--rule);
  min-height:clamp(220px,17vw,320px);display:flex;align-items:flex-start;padding:52px 0 36px}
.page-head .wrap{width:100%;position:relative}
.page-head .eyebrow{color:var(--orange-d)}
.page-head h1{font-family:var(--head);color:var(--navy);margin:0 0 16px;line-height:1.35;letter-spacing:.02em}
.page-head h1.oneline{font-size:min(44px,calc(100cqw / var(--n)))}
.page-head p{color:var(--ink-2);margin:0;font-size:15px}
.page-head .wm{position:absolute;right:0;bottom:-.22em;font:700 clamp(72px,11vw,190px)/1 var(--mono);letter-spacing:.02em;color:rgba(10,26,51,.055);pointer-events:none;user-select:none}
@media(max-width:860px){.page-head{min-height:0;padding:36px 0 28px}.page-head .wm{display:none}}

/* ===== アクセスページ（access.php） ===== */
.access{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.access-map{background:var(--paper-2);border:1px solid var(--rule)}
.access-map iframe{display:block}
.access .dl div{grid-template-columns:96px 1fr}
.access .note{grid-column:1 / -1;margin:0}
@media(max-width:860px){.access{grid-template-columns:1fr}.access-map iframe{height:300px}}

/* ICP詳細：他ページと同じヒーロー構造。背景はICP開発機のレンダリング待ち（暫定 chamber.webp） */
.bg-icp{--bg:url("../images/chamber.webp")}
.bg-icp.has-bg:before{background-position:center 60%}
.product-hero .hero-post .btn{color:#fff;border-color:rgba(255,255,255,.6)}
.sys.wide{grid-template-columns:repeat(3,1fr)}
.sys.wide div:first-child{grid-column:span 3}
@media(max-width:860px){.sys.wide{grid-template-columns:1fr}.sys.wide div:first-child{grid-column:span 1}}

/* お問い合わせ：ロボット用の隠し欄（画面には出さないが display:none は避ける） */
.hp-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.contact-form .form-actions{display:flex;gap:14px;flex-wrap:wrap}
.contact-form button.secondary{background:transparent;color:var(--navy)}

/* 規約・ポリシー等の本文（プライバシーポリシー・サイトのご利用について）2026-09-09 */
.legal{max-width:74ch}
.legal h2{font-family:var(--head);font-size:17px;color:var(--navy);margin:2.2em 0 .6em;padding-bottom:8px;border-bottom:1px solid var(--rule)}
.legal h2:first-of-type{margin-top:0}
.legal p{margin:1em 0;color:var(--ink-2)}
.legal ul{margin:1em 0;padding-left:1.4em;color:var(--ink-2)}
.legal li{margin:.4em 0}
.legal a{color:var(--orange-d);border-bottom:1px solid var(--rule)}
.legal a:hover{border-color:var(--orange-d)}
.legal .dl{margin-top:1em}
.legal .note{margin-top:2.4em;color:var(--ink-3)}

/* お問い合わせ：入力エラーの表示（2026-09-09） */
.contact-form .hint[data-error]{color:#c0272d;font-weight:700}
.contact-form input[data-error]{border-color:#c0272d;background:#fff6f5}
.contact-form input:user-invalid{border-color:#c0272d;background:#fff6f5}
.form-error{border-left:4px solid #c0272d;font-weight:500}
.form-error strong{display:block;margin-bottom:6px}
.form-error ul{margin:6px 0 0;padding-left:1.3em}
.form-error li{margin:.3em 0}

/* スマホで英語（等幅・大文字）の行が見切れる対策（2026-09-11 大槻氏指摘②）
   長い英字列は語中でも折り返し、字間を縮める。width:max-content のステータスラベルも幅に収める。 */
@media(max-width:860px){
  .eyebrow,.ptop .sub,.logo small,.copy,.prod .cat,.sys b,.status,.ft h5,.hero-cap,.strip .tag,.dd-col>a small,.feat3 .n{letter-spacing:.08em;overflow-wrap:anywhere}
  .sec-idx{white-space:nowrap;flex:0 0 auto}  /* 連番「01」が縦に割れないように（2026-09-11 スマホ実機で発生） */
  .status{width:auto;max-width:100%;white-space:normal;line-height:1.5}
  .ptop h1,.hero h1,.prose h2{overflow-wrap:anywhere}
  .copy{gap:8px 14px}
}
