@charset "UTF-8";
/* SEO製品ページ用 追加スタイル（独立ファイル・sassコンパイル対象外）
   既存製品ページ（本文13px・画像はコンテナ幅・見出しと本文を左揃え）に統一 */

/* スライド画像：元画像サイズに関わらず4:3枠いっぱいにcover表示（社長指示） */
.swiper_products .swiper-slide{ aspect-ratio:auto; position:relative; display:block; overflow:visible; }
.swiper_products .img_cap_wrap{ position:relative; display:block; width:100%; line-height:1.5; }
.swiper_products .swiper-slide img{ display:block; width:100%; height:auto; aspect-ratio:4 / 3; object-fit:cover; }
/* 画像キャプション：オーバーレイをやめ画像下に外出し＋センター寄せ（社長指示・CFS w_products_image_caption） */
.swiper_products .slide_caption{
  position:static; display:block; margin-top:.7em;
  background:none; color:#333; box-sizing:border-box;
  padding:0; font-size:.9rem; line-height:1.6; text-align:center; letter-spacing:.02em;
}
@media screen and (max-width:767px){
  .swiper_products .slide_caption{ font-size:.8rem; }
}

/* 本文サイズを既存(13px)に統一・見出しと頭を左揃え */
.list_products li > p{ font-size:16px; line-height:1.9; margin:0 0 .7em; }
.list_products .list_dot{ list-style:none; padding-left:0; margin:.6em 0; }
.list_products .list_dot li{ padding-left:1em; text-indent:-1em; font-size:16px; line-height:1.9; margin-bottom:.2em; }
.list_products .list_dot li::before{ content:"・"; }
.list_products .note{ font-size:13px; font-weight:300; color:#888; line-height:1.8; margin-top:.8em; }   /* #4667 12→13px・500→300 */

/* 仕様テーブル：添付見本の体裁（ラベル列＝コーポレートカラー#004677背景＋白文字／値セル＝白＋細罫線／偶数行ゼブラ）。現デザインの色・フォント踏襲 */
.list_products .spec_table{ width:100%; border-collapse:collapse; margin:1.1em 0 1.4em; border:1px solid #d3dde4; }
.list_products .spec_table th{
  width:34%; text-align:left; vertical-align:middle;
  background:#004677 !important; color:#fff !important; font-weight:700;
  padding:.95rem 1.2rem; border-bottom:2px solid #fff; border-right:2px solid #fff;
  font-size:13px; line-height:1.6; letter-spacing:.04em;
}
.list_products .spec_table td{
  vertical-align:middle; padding:.95rem 1.2rem; background:#fff;
  border-bottom:1px solid #e5e5e5; border-left:1px solid #edf1f4;
  font-size:13px; line-height:1.7;
}
.list_products .spec_table tr:nth-child(even) td{ background:#f4f8fb; }
/* 仕様表内のセクション見出し行（colspan＝電子銃/制御電源 等） */
.list_products .spec_table td[colspan]{ background:#fff !important; border:none !important; color:#004677; font-weight:700; text-align:left; letter-spacing:.04em; padding-top:1.1rem; }
@media screen and (max-width:767px){
  .list_products .spec_table th{ width:100%; display:block; padding:.7rem 1rem; border-right:none; }
  .list_products .spec_table td{ width:100%; display:block; padding:.8rem 1rem; border-left:none; }
  .list_products .spec_table tr:nth-child(even) td{ background:#fff; }
}

/* #3980 型番（型式）の表示：少し小さく・横並び（生成器側で " / " 区切り済み） */
.ttl_box .ttl_s{ font-size:.95rem; font-weight:normal; line-height:1.7; }
@media screen and (max-width:767px){ .ttl_box .ttl_s{ font-size:.8rem; } }

/* #3983 グローバルナビ：製品一覧カテゴリのドロップダウン */
#gnavi ul li.has_sub{ position:relative; }
/* 製品一覧はドロップダウンの親＝非遷移（社長指示 websupport #7843） */
#gnavi ul li.has_sub > a.no_link{ cursor:default; }
#gnavi ul li.has_sub > .sub_menu{
  position:absolute; left:50%; transform:translateX(-50%); top:100%;
  min-width:13em; background:#fff; box-shadow:0 8px 24px rgba(0,0,0,.12);
  padding:.6em 0; border-radius:4px; opacity:0; visibility:hidden;
  transition:opacity .2s, visibility .2s; z-index:50; text-align:left;
}
#gnavi ul li.has_sub:hover > .sub_menu{ opacity:1; visibility:visible; }
#gnavi ul li.has_sub > .sub_menu li{ margin:0; display:block; }
#gnavi ul li.has_sub > .sub_menu li > a{
  display:block; padding:.55em 1.4em; font-size:.9rem; color:#21201c; white-space:nowrap; line-height:1.5;
}
#gnavi ul li.has_sub > .sub_menu li > a:hover{ background:#f2f6fb; color:#004677; }
/* SP：ホバー不可のため常時展開のサブリスト */
@media screen and (max-width:767px){
  #gnavi ul li.has_sub > .sub_menu{
    position:static; transform:none; opacity:1; visibility:visible; box-shadow:none;
    padding:.2em 0 .4em; min-width:0; background:transparent;
  }
  #gnavi ul li.has_sub > .sub_menu li > a{ color:#fff; padding:.4em 0 .4em 1.5em; font-size:.95rem; }
  #gnavi ul li.has_sub > .sub_menu li > a:before{ content:"- "; }
}

/* 沿革タイムライン（会社案内・添付デザイン／色は既存ブルー #004677） */
.vp_history{ --yw:7.5rem; --gap:2.6rem; position:relative; max-width:880px; margin:3.5rem auto 0; padding:0; list-style:none; }
.vp_history::before{ content:""; position:absolute; top:.9em; bottom:.9em; left:calc(var(--yw) + var(--gap)/2); width:2px; background:#004677; transform:translateX(-1px); }
.vp_history__item{ position:relative; display:grid; grid-template-columns:var(--yw) 1fr; column-gap:var(--gap); padding-bottom:3.6rem; }
.vp_history__item:last-child{ padding-bottom:0; }
.vp_history__item::before{ content:""; position:absolute; left:calc(var(--yw) + var(--gap)/2); top:.5em; width:13px; height:13px; margin-left:-6.5px; border-radius:50%; background:#004677; box-shadow:0 0 0 4px #fff; }
.vp_history__year{ text-align:right; font-size:1.9rem; font-weight:700; line-height:1.2; color:rgba(0,70,119,.30); letter-spacing:.02em; }
.vp_history__body{ padding-top:.35em; font-size:1rem; font-weight:700; color:#21201c; line-height:1.9; }
@media screen and (max-width:767px){
  .vp_history{ --yw:3.6rem; --gap:1.1rem; margin-top:2rem; }
  .vp_history::before{ left:calc(var(--yw) + var(--gap)/2); }
  .vp_history__item{ padding-bottom:2.6rem; }
  .vp_history__year{ font-size:1.1rem; padding-top:.15em; }
  .vp_history__body{ font-size:.9rem; font-weight:700; line-height:1.8; }
  .vp_history__item::before{ width:11px; height:11px; margin-left:-5.5px; top:.35em; }
}

/* #4010 #4011 製品一覧/関連製品カードの型番(.ttl_s)を小さく（全ページ共通・タイトルの .ttl_box .ttl_s には不影響） */
.products_box .ttl_s{ font-size:12px; line-height:22px; }

/* 導入実績(works)のコンテンツ画像：2カラムグリッド＋一定サイズ枠（縦横混在でも統一・縦写真は左右余白） */
.single-works .works_gallery{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.single-works .works_gallery__item img{ width:100%; aspect-ratio:4 / 3; object-fit:contain; display:block; }
.single-works .works_gallery__item:only-child{ grid-column:1 / -1; }
@media screen and (max-width:767px){
  .single-works .works_gallery{ grid-template-columns:1fr; gap:1rem; }
}

/* === 追従ヘッダー(.header_scroll)：中身を垂直中央に・検索/お問い合わせも一緒に表示（社長指示・#4435） === */
/* 対称パディング＋min-height＋align-items:center でロゴ・ナビ・CTAを縦中央に揃える（従来は下寄り） */
.header_scroll{ padding-top:0 !important; padding-bottom:0 !important; }
.header_scroll .header_box{ padding-top:0 !important; padding-bottom:0 !important; min-height:78px; align-items:center; }
.header_scroll #overlay{ display:flex; align-items:center; }
.header_scroll .header_navi{ margin-bottom:0 !important; }
.header_scroll .header_ttl{ margin:0 !important; }
/* トップ用のロゴ上余白(#4511 .home #header_left padding-top:30px)は追従時に無効化 */
.header_scroll #header_left{ padding:0 !important; }
/* 以前のスリム化で検索/問い合わせを非表示にしていたが、追従ヘッダーにも表示する方針に変更 */
@media screen and (max-width:767px){
  .header_scroll{ padding-bottom:.4rem !important; }
  .header_scroll .header_box{ padding-top:.4rem !important; }
}

/* === 右下に固定追従する「お問い合わせ」フローティングボタン（スクロール時に表示） === */
.float_contact{
  display:none; position:fixed; right:22px; bottom:22px; z-index:9999;
  align-items:center; gap:.5em; padding:.95em 1.5em; border-radius:999px;
  background:#004677; color:#fff; font-weight:bold; font-size:.95rem; line-height:1;
  box-shadow:0 8px 22px rgba(0,40,80,.30); text-decoration:none;
  transition:transform .2s ease, background .2s ease;
}
.float_contact:hover{ background:#013a63; transform:translateY(-2px); color:#fff; }
.float_contact .ico{ width:1.15em; height:1.15em; flex:0 0 auto; }
/* 追従ヘッダー内に検索・問い合わせを表示する方針にしたため、右下フロートは無効化（#4435） */
/* body:has(header.header_scroll) .float_contact{ display:inline-flex; } */
@media screen and (max-width:767px){
  .float_contact{ right:14px; bottom:14px; padding:.85em 1.2em; font-size:.85rem; }
}

/* === 追従ヘッダーは白背景＋黒ナビ/CTA・フッターは黒背景に（社長指示） === */
.sub_header{ background-color:#004677 !important; }         /* 静止時サブヘッダーは従来どおり濃紺 */
.header_scroll{ background-color:#fff !important; }          /* 追従ヘッダーは白 */
footer{ background-color:#000 !important; }                  /* フッターは黒 */

/* 追従ヘッダー：白ロゴは白背景で消えるため公式の黒ロゴ(logo_b.svg)に差し替え */
.header_scroll #header_left .header_ttl img.logo{ content:url("../images/logo_b.svg"); }
/* 追従ヘッダー PC：ナビ/CTA/検索を黒に（視認性） */
@media screen and (min-width:768px){
  .header_scroll #gnavi > ul > li > a{ color:#000; }
  .header_scroll a.h_contact{ color:#000; border-color:#000; }
  .header_scroll .header_search{ border-color:#000 !important; }
  .header_scroll input.search_box{ color:#000; }
  .header_scroll input.search_box::placeholder{ color:#666; }
  .header_scroll .btn_search{ filter:brightness(0); }        /* 白い検索アイコン→黒 */
}
/* 追従ヘッダー SP：ハンバーガーは閉時のみ黒（開時=.activeは黒オーバーレイ上なので白のまま） */
@media screen and (max-width:767px){
  .header_scroll .menu-trigger:not(.active) span{ background:#000; }
  .header_scroll .menu-trigger:not(.active) p{ color:#000; }
}

/* フッター内CTAボタン：黒背景上でも白塗り＋濃紺文字で分離（従来踏襲） */
footer a.footer_btn_w{ background:#fff !important; color:#004677 !important; border-color:#fff !important; }
footer a.footer_btn_w::after{ border-left-color:#004677 !important; }
footer a.footer_btn_w:hover{ background:#e6edf3 !important; color:#013a63 !important; }
footer a.footer_btn_w:hover::after{ border-left-color:#013a63 !important; }
/* 右下フロート：どの背景でも分離するよう細い白縁を追加 */
.float_contact{ border:1px solid rgba(255,255,255,.85); }

/* === 全体の本文テキストを #000 に統一（社長指示）。白文字・濃紺背景・青アクセント(.txt_clr_blue)は維持。灰色本文のみ黒へ === */
.list_products li > p,
.list_products .list_dot li,
.list_products .note,
.list_products .spec_table td,
.vp_history__body{ color:#000; }

/* === 会社案内トップ：4カード（写真+タイトル→各ページ） === */
.section_company_cards{ padding:5rem 0; }
.section_company_cards .inner{ max-width:1000px; margin:0 auto; }
.company_cards{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:2.2rem; }
.company_cards > li{ margin:0; }
.company_cards a{ display:block; text-decoration:none; color:#000; }
.company_cards .img_wrap{ overflow:hidden; border-radius:4px; aspect-ratio:4 / 3; background:#f2f4f6; }
.company_cards .img_wrap img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
.company_cards a:hover .img_wrap img{ transform:scale(1.05); }
.company_cards .ttl{ margin:1.1rem 0 0; font-size:1.25rem; font-weight:700; line-height:1.4; display:flex; flex-direction:column; }
.company_cards .ttl .ttl_e{ font-size:.8rem; font-weight:500; letter-spacing:.08em; color:#004677; margin-top:.25em; }
@media screen and (max-width:767px){
  .section_company_cards{ padding:3rem 0; }
  .company_cards{ grid-template-columns:1fr; gap:1.6rem; }
  .company_cards .ttl{ font-size:1.1rem; }
}
/* 会社案内配下ページ末尾の他ページ動線：3列1行 */
.company_cards.cols3{ grid-template-columns:repeat(3,1fr); }
.section_company_cards.company_cards_sub{ padding:0 0 5rem; }
@media screen and (max-width:767px){ .company_cards.cols3{ grid-template-columns:1fr; } }

/* 会社概要：主要取引先を企業/大学/研究機関の3ブロックに。大学ブロックの前後に20px余白（社長指示） */
.table_company .clients-block{ display:block; }
.table_company .clients-univ{ margin:20px 0; }

/* === トップページ 余白微調整（websupport 要素調整・.home スコープ＝トップのみ） === */
.home .section_news{ padding:180px 0 128px 0; }           /* #4508 上余白 100→180 */
.home .list_about_1{ margin:0 0 80px 0; }                 /* #4509 下余白 0→80 */
.home .header_box{ padding:0; }                           /* #4510 上余白 40→0 */
.home #header_left{ padding:30px 0 0 0; }                 /* #4511 上余白 0→30 */

/* === ファーストビュー：動画を全幅に敷く・左側の余白を除去（社長指示） === */
.home .main_img .img_wrap{ width:100%; margin:0; }
/* ヒーローのタイトルを画面中央に配置（社長指示） */
.home .main_img .txt_wrap{ left:50%; right:auto; transform:translate(-50%,-50%); text-align:center; }

/* ヒーロー：動画要素(display:inline)が画像の下にフロー積みされスライド高が膨張→下にグレーの余白が出る問題を解消。
   スライドを100vhに固定し、画像はfill・動画は絶対配置でレイヤー化（どちらか一方の素材でも成立） */
.home .main_img{ overflow:hidden; }
.home .swiper_top .swiper-slide{ height:100vh; }
.home .slide-img{ position:relative; height:100vh; }
.home .slide-img img{ width:100%; height:100vh; object-fit:cover; display:block; }
.home .slide-img video{ position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; }

/* ヒーローの SCROLL 表示：ヘッダーロゴの左端に合わせて左寄せ＋100px上げる（社長指示） */
.home .top_scroll_wrap{ left:4.5%; bottom:170px; }

/* パンくずの上余白を 8px→20px に（#4649・全ページ共通） */
#list_breadcrumb{ padding-top:20px; }

/* アンカーリンク着地時に固定ヘッダー(約99px)へ潜らないよう余白（downloadsのカタログアンカー等） */
html{ scroll-padding-top:110px; }
.list_products > li{ scroll-margin-top:110px; margin-bottom:60px; }   /* #4665 本文ブロック間 120→60px */
/* #4666 ページネーション上余白 35.3px→60px */
.list_pagination{ margin-top:60px; }

/* 製品名の下のサブタイトル（和名＋測定モード）＝products-subtitle/products-modes meta があれば表示 */
.ttl_box .products_subttl{ margin-top:.7rem; line-height:1.55; }
.products_subttl__name{ display:block; font-size:1.1rem; font-weight:700; color:#004677; }
.products_subttl__modes{ display:block; font-size:.95rem; color:#555; letter-spacing:.04em; margin-top:.25em; }

/* === ヘッダー：ナビゲーションとCTA(検索＋お問い合わせ)を横並列に（追従ヘッダーも同一要素で自動適用・社長指示）=== */
@media screen and (min-width:768px){
  .header_box{ align-items:center; padding-top:1.25rem; }   /* 上余白を半分に（2.5rem→1.25rem・社長指示）。home(#4510で0)・追従(0!important)は不変 */
  #header_right{ display:flex; align-items:center; gap:2.5rem; }
  #header_right #gnavi{ order:1; }
  #header_right .header_navi{ order:2; margin-bottom:0; }
}

/* === 会社概要ページ：アクセスセクション（Googleマップ＋バス案内） === */
.section_access{ padding-top:0; padding-bottom:5rem; }
.access_map{ margin:2.5rem 0 0; }
.access_map iframe{ display:block; width:100%; height:450px; border:0; }
.access_info{ margin-top:2.5rem; }
.access_heading{ font-size:1.25rem; font-weight:700; margin:0 0 1.2rem; padding-left:.7em; border-left:4px solid #004677; }
.access_route{ margin-bottom:1.6rem; }
.access_route .route_ttl{ font-weight:700; font-size:1.05rem; margin:0 0 .4em; color:#004677; }
.access_route .route_body{ line-height:1.9; margin:0; }
@media screen and (max-width:767px){
  .access_map iframe{ height:300px; }
  .access_heading{ font-size:1.1rem; }
}

/* === 見積もり依頼・お問い合わせセクション：電話ボタン撤去で1ボタンになったため中央配置（社長指示・全ページ） === */
.section_contact .contact_box{ justify-content:center; }
/* お問い合わせ・見積もりボタン：高さ70px・ピル型（角丸60px）に（社長指示） */
a.contact_btn{ height:70px; border-radius:60px; }

/* === 光電子分光カテゴリ 専用レイアウト（PDF準拠・社長指示） === */
.pes_hero{ line-height:0; position:relative; }
.pes_hero img{ width:100%; height:auto; display:block; }
/* ヒーロー画像が未支給のカテゴリ用＝濃紺プレースホルダー背景（実画像が来たら .pes_hero に img を入れて --ph を外す） */
.pes_hero--ph{ min-height:380px; background:linear-gradient(120deg,#01274a 0%,#004677 55%,#0a5c96 100%); }
@media screen and (max-width:767px){ .pes_hero--ph{ min-height:210px; } }
/* 明るい写真ヒーローに白タイトルを載せる用＝左を暗くするグラデーションオーバーレイ */
.pes_hero--photo::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(0,18,38,.66) 0%,rgba(0,18,38,.42) 45%,rgba(0,18,38,.12) 100%); pointer-events:none; }
/* ヒーロー内の pc/sp 画像切替（.pes_hero img{display:block} が .sp{display:none} を上書きするため明示的に加重） */
.pes_hero img.sp{ display:none; }
@media screen and (max-width:767px){
  .pes_hero img.pc{ display:none; }
  .pes_hero img.sp{ display:block; }
}
/* ヒーロー写真の左に縦中央でページタイトル（.sub_ttl 流用・写真は暗転させず text-shadow で可読化） */
.pes_hero_ttl{ position:absolute; left:6%; top:50%; transform:translateY(-50%); z-index:5; }
.pes_hero_ttl .sub_ttl{ text-align:left; width:auto; text-shadow:0 2px 10px rgba(0,0,0,.4); margin:0; }
@media screen and (max-width:767px){
  /* SPはヒーローが214pxの狭い横帯＝英字サブは注釈と干渉するので隠し、和文1行のみ（縦中央は基底継承） */
  .pes_hero_ttl{ left:5%; }
  .pes_hero_ttl .sub_ttl{ font-size:1.05rem; padding-bottom:0; }
  .pes_hero_ttl .sub_ttl::before{ display:none; }
}
.section_pes_intro{ padding:4rem 0 1rem; }
/* コンテンツ幅は標準 .inner（66%）に統一＝他ページ・パンくずと両サイド余白を揃える（960px固定をやめる） */
.pes_lead.center{ max-width:760px; margin:0 auto 100px; }   /* #4632 下余白100px */
.pes_block{ margin-bottom:3rem; }
/* 私たちの強み下：2カラム（左=写真／右=Scienta社について＋光電子アナライザー・社長指示） */
.pes_2col{ display:flex; gap:3rem; align-items:flex-start; margin:3rem 0 100px; }  /* #4633 下余白100px */
.pes_2col__img{ flex:0 0 42%; max-width:42%; }
.pes_2col__img img{ width:100%; height:auto; display:block; border-radius:4px; }
/* 横長写真のダミーボックス（実写真は後日支給・#4631） */
.pes_dummy{ aspect-ratio:3 / 2; background:#eef1f4; border:1px dashed #c2ccd6; border-radius:4px; display:flex; align-items:center; justify-content:center; color:#9aa7b2; font-size:14px; letter-spacing:.12em; }
.pes_2col__body{ flex:1 1 auto; min-width:0; }
.pes_2col__body .pes_block{ margin-bottom:2.4rem; }
.pes_2col__body .pes_block:last-child{ margin-bottom:0; }
.pes_h2{ font-size:1.5rem; font-weight:700; color:#004677; margin:0 0 1.1rem; padding-left:.7em; border-left:5px solid #004677; line-height:1.4; }
.pes_lead{ font-size:15px; line-height:1.95; color:#000; margin:0; }
/* 200px 指定。グローバル img[src$=".svg"]{width:100%}（特異度0,1,1）に勝つよう親クラスで加重 */
.section_pes_intro .pes_scienta_logo{ width:200px; max-width:70%; height:auto; display:block; margin:0 0 1.4rem; }
.pes_h3{ font-size:1.15rem; font-weight:700; color:#004677; margin:0 0 .8rem; }
.pes_text{ font-size:15px; line-height:1.95; color:#000; margin:0; }
.section_pes_analyzer{ background:#004677; color:#fff; padding:2.6rem 0; margin:1rem 0 3.5rem; }
.section_pes_analyzer .inner{ max-width:960px; }
.pes_band_ttl{ font-size:1.5rem; font-weight:700; color:#fff; margin:0 0 1rem; line-height:1.4; }
.pes_band_text{ font-size:15px; line-height:1.95; color:#fff; margin:0; }
.section_pes_cards{ padding-bottom:5rem; }
/* 外枠なし・カード間隔100px（#4650／旧80px） */
.pes_card{ padding:0; margin-bottom:100px; }
.pes_card:last-child{ margin-bottom:0; }
/* 見出しを少し大きく＋下線（社長指示） */
.pes_card__head{ font-size:1.5rem; font-weight:700; color:#111; margin:0 0 1.5rem; padding-bottom:.8rem; border-bottom:1px solid #cbd3da; display:flex; align-items:center; line-height:1.4; }
.pes_card__head::before{ content:""; width:.7em; height:.7em; border-radius:50%; background:#e8820c; margin-right:.55em; flex:0 0 auto; }
/* 説明文は見出し直下（社長指示） */
.pes_card__desc{ font-size:15px; line-height:1.85; color:#000; margin:0 0 1.5rem; }
.pes_card__photos{ display:flex; flex-wrap:wrap; gap:1.5rem; margin:0; }
/* #4617 製品写真を通常の製品一覧カード（.products_box .img_wrap＝aspect 300/200・cover）と同サイズに。
   #4661 製品数だけ横並び（3製品→3列／2製品→2列・カラム落ち防止）＝等分割flex＋max340で上限 */
.pes_prod{ text-decoration:none; color:#000; display:block; flex:1 1 0; max-width:340px; }
.pes_prod__img{ display:block; aspect-ratio:300 / 200; background:#f5f7f9; border-radius:4px; overflow:hidden; }
.pes_prod__img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s; }
.pes_prod:hover .pes_prod__img img{ transform:scale(1.05); }
.pes_prod__name{ display:block; text-align:center; font-size:16px; font-weight:700; margin-top:15px; color:#004677; }
/* 主な研究対象：ラベルを吹き出し（右向き三角）にして、その右に対象テキスト。写真の下（社長指示） */
.pes_card__target{ display:flex; align-items:center; gap:1.4rem; margin-top:1.6rem; }
.pes_card__target-label{ position:relative; flex:0 0 auto; background:#004677; color:#fff; font-weight:700; font-size:14px; letter-spacing:.03em; padding:.6em 1.15em; border-radius:6px; white-space:nowrap; }
.pes_card__target-label::after{ content:""; position:absolute; right:-8px; top:50%; transform:translateY(-50%); border-top:6px solid transparent; border-bottom:6px solid transparent; border-left:8px solid #004677; }
.pes_card__target-text{ flex:1 1 auto; font-size:14px; line-height:1.75; color:#333; }
@media screen and (max-width:767px){
  .section_pes_intro{ padding:2.5rem 0 .5rem; }
  .pes_2col{ flex-direction:column; gap:1.8rem; }   /* 下余白100pxは基底継承(#4633 PC/SP両方) */
  .pes_2col__img{ flex:none; width:100%; max-width:100%; }   /* 縦積み時はダミー/写真を全幅に */
  .pes_h2, .pes_band_ttl{ font-size:1.25rem; }
  .pes_card{ padding:0; margin-bottom:100px; }   /* #4650 */
  .pes_card__head{ font-size:1.25rem; }
  .pes_prod{ flex:0 0 46%; max-width:46%; }   /* SPは狭いので2列維持（3列は極小になるため） */
  /* 主な研究対象：SPも「ラベル吹き出し→右にテキスト」の行を維持（gapのみ詰める） */
  .pes_card__target{ gap:1rem; }
}


/* === 仕様マトリクス表：型式×仕様が多数の製品（XYステージ等）＝横スクロール対応・SPで縦積みさせない === */
.list_products .spec_scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; margin:1.1em 0 1.4em; border:1px solid #d3dde4; }
.list_products .spec_scroll .spec_table{ margin:0; min-width:820px; border:none; }
.list_products .spec_matrix th,
.list_products .spec_matrix td{ padding:.72rem .7rem; font-size:12.5px; text-align:center; line-height:1.55; }
.list_products .spec_matrix th{ width:auto; white-space:nowrap; }
.list_products .spec_matrix td{ white-space:normal; }
.list_products .spec_matrix tr > th:first-child{ text-align:left; white-space:nowrap; }
@media screen and (max-width:767px){
  .list_products .spec_matrix th,
  .list_products .spec_matrix td{ display:table-cell; width:auto; }
  .list_products .spec_matrix tr:nth-child(even) td{ background:#f4f8fb; }
}

/* === 仕様マトリクス：横スクロールの可視化（ヒントチップ＋右端フェード＋一度だけナッジはbase.js） === */
.list_products .spec_scrollwrap{ position:relative; padding-top:2em; margin:1.1em 0 1.4em; }
.list_products .spec_scrollwrap .spec_scroll{ margin:0; }
.list_products .spec_scrollwrap::after{
  content:""; position:absolute; top:2em; bottom:0; right:0; width:42px; z-index:2;
  background:linear-gradient(to left, #ffffff, rgba(255,255,255,0));
  pointer-events:none; opacity:1; transition:opacity .35s ease;
}
.list_products .spec_scrollwrap.at-end::after{ opacity:0; }
.list_products .spec_scrollhint{
  position:absolute; top:0; right:2px; z-index:3;
  display:inline-flex; align-items:center; gap:.3em;
  font-size:11.5px; font-weight:700; color:#004677; letter-spacing:.05em; line-height:1;
  background:#eaf1f6; border:1px solid #c3d4e2; border-radius:999px; padding:.4em .85em;
  pointer-events:none; transition:opacity .4s ease;
}
.list_products .spec_scrollhint__arw{ display:inline-block; font-style:normal; animation:spec_nudge 1.25s ease-in-out infinite; }
@keyframes spec_nudge{ 0%,100%{ transform:translateX(0); } 50%{ transform:translateX(6px); } }
.list_products .spec_scrollwrap.is-scrolled .spec_scrollhint{ opacity:0; }
@media (prefers-reduced-motion:reduce){ .list_products .spec_scrollhint__arw{ animation:none; } }

/* === オプション欄に写真（181 Qruva 小型表示機 等）＝テキスト左・写真右、SPは縦積み === */
.list_products .option_media{ display:flex; flex-direction:column; align-items:flex-start; gap:1rem; }
.list_products .option_media > ul{ margin:0; }
.list_products .option_media__fig{ margin:0; width:220px; text-align:left; }
.list_products .option_media__fig img{ width:100%; height:auto; border:1px solid #e5e5e5; background:#fff; }
.list_products .option_media__fig figcaption{ font-size:12px; color:#004677; margin-top:.5em; letter-spacing:.03em; text-align:center; }
/* 画像キャプションは基本センター寄せ（社長指示・本文/添付図の説明文） */
.list_products figcaption, .list_products .wp-caption-text{ text-align:center; }
@media screen and (max-width:767px){ .list_products .option_media__fig{ width:180px; } }

/* === 仕様表内の注記行（精度注記等）＝白背景の注記体裁（セクション見出しcolspanと区別・#4723-4725）=== */
.list_products .spec_table td.spec_note{ background:#fff !important; color:#000 !important; font-weight:400; text-align:left; font-size:12.5px; line-height:1.7; }

/* === 外部リンク（別ドメイン）のURL右に外部リンクアイコン（mask＝リンク文字色に追従・自ドメイン/PDFは除外）=== */
.list_products a[href^="http"]:not([href*="vacuumproducts"]):not([href*="apricot-design"])::after{
  content:""; display:inline-block; width:0.82em; height:0.82em; margin-left:0.32em; vertical-align:-0.06em;
  background-color:currentColor;
  -webkit-mask:url("../images/ext-link.svg") no-repeat center / contain;
  mask:url("../images/ext-link.svg") no-repeat center / contain;
}

/* === 本文リスト内のリンク（製品ページへの相互リンク等）をリンク色に＝#000一括ルールで黒くなるのを回避 === */
.list_products .list_dot li a,
.list_products li > p a{ color:#004677; text-decoration:underline; text-underline-offset:2px; }
.list_products .list_dot li a:hover,
.list_products li > p a:hover{ opacity:.7; }

/* === マトリクス表のセクション見出し行（colspan＝動作仕様/スパッタ性能等）は白背景＋枠線なし（2列表の水色セクション見出しは維持）=== */
.list_products .spec_matrix td[colspan]{ background:#fff !important; border:none !important; color:#004677; font-weight:700; text-align:left; padding-top:1.1rem; }

/* === トップ section_top_about 下余白 284.8px→150px（#4789・PC/SP両方）=== */
.section_top_about{ padding-bottom:150px; }

/* === トップ h2.main_ttl 中央寄せ（社長指示）=== */
.home .main_ttl{ text-align:center; }

/* === トップ list_about_1：画像＋白カードのオーバーラップを左右交互（PC・添付レイアウト）=== */
@media screen and (min-width:768px){
  .section_top_about .inner{ overflow:visible; }
  .list_about_1 > li{ align-items:center; justify-content:flex-start; flex-wrap:nowrap; position:relative; margin-bottom:7rem; }
  /* 写真を画面端までフルブリード（外側マージンでビューポート端へ・幅は元58%＋外側の余白分）*/
  .list_about_1 > li .img_wrap{ flex:0 0 auto; width:calc(58% + 50vw - 50%); margin-left:calc(50% - 50vw); }
  /* 白カードを少し幅広（47%→53%）＋画像に重なる */
  .list_about_1 > li .txt_wrap{ flex:0 0 auto; width:53%; margin-left:-11%; box-sizing:border-box; background:#fff; padding:3rem 3rem; box-shadow:0 14px 40px rgba(0,0,0,.10); position:relative; z-index:2; }
  .list_about_1 > li:nth-child(even){ flex-direction:row-reverse; }
  .list_about_1 > li:nth-child(even) .img_wrap{ margin-left:0; margin-right:calc(50% - 50vw); }
  .list_about_1 > li:nth-child(even) .txt_wrap{ margin-left:0; margin-right:-11%; }
}

/* === 技術力セクション：背景動画＋黒30%オーバーレイ（社長指示・bg_black_decoration装飾は非表示）=== */
.section_about_2{ overflow:hidden; }
.section_about_2.bg_black_decoration::before,
.section_about_2.bg_black_decoration::after{ display:none !important; }
.section_about_2 .section_video_bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.section_about_2 .section_video_overlay{ position:absolute; inset:0; background:rgba(0,0,0,.30); z-index:1; pointer-events:none; }
.section_about_2 .inner_lv3{ position:relative; z-index:3; }

/* トップ About us の3枚（.list_about_1）：高さを約100px短く（自然比8:7→4:3にクロップ・PC・.homeスコープ・社長指示） */
.home .list_about_1 > li .img_wrap img{ aspect-ratio:4 / 3; object-fit:cover; }

/* ============================================================
   下層ページ：ヒーローの黒背景を除去＋ヘッダー白基調・黒ナビ（社長指示 2026-07-13）
   静止時ヘッダーにも既存の追従(.header_scroll)と同じ明色仕様を適用し、
   スクロール中(0-300px)でも黒帯無しで視認性を確保。トップ(.home)は不変。
   ============================================================ */
/* 1) ヒーロー上部の黒帯(::before)＋左右スペックル装飾(::after)を除去 */
body:not(.home) .main_img_bg::before,
body:not(.home) .main_img_bg::after{ content:none !important; display:none !important; }

/* 2) ヒーロー写真の濃い暗幕(0.6)を薄く＝写真を明るく。タイトルはtext-shadowで可読化（.pes_hero_ttl 踏襲） */
body:not(.home) .header_sub_wrap .img_wrap::after{
  background:linear-gradient(100deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.14) 40%, rgba(0,0,0,0) 66%);
}
body:not(.home) .header_sub_wrap .sub_ttl{ text-shadow:0 2px 12px rgba(0,0,0,.6), 0 0 5px rgba(0,0,0,.4); }
@media screen and (max-width:767px){
  /* SPはタイトル中央＝方向グラデが効きにくいので軽い均一veil */
  body:not(.home) .header_sub_wrap .img_wrap::after{ background:rgba(0,0,0,.24); }
}

/* 3) 下層ヘッダーを白基調に（静止時も＝スクロールしても常に白背景・黒ナビ） */
body:not(.home) header{ background-color:#fff; }

/* 4) 静止時ロゴを黒版(logo_b)に（白ロゴは白背景で消える）。追従時は既存で対応済 */
body:not(.home) #header_left .header_ttl img.logo{ content:url("../images/logo_b.svg"); }

/* 5) 静止時PC：ナビ/CTA/検索を黒に（追従時と対称） */
@media screen and (min-width:768px){
  body:not(.home) #gnavi > ul > li > a{ color:#000; }
  body:not(.home) a.h_contact{ color:#000; border-color:#000; }
  body:not(.home) .header_search{ border-color:#000 !important; }
  body:not(.home) input.search_box{ color:#000; }
  body:not(.home) input.search_box::placeholder{ color:#666; }
  body:not(.home) .btn_search{ filter:brightness(0); }
}

/* 6) 静止時SP：ハンバーガー閉時のみ黒（開時=.activeは黒ドロワー上なので白のまま） */
@media screen and (max-width:767px){
  body:not(.home) .menu-trigger:not(.active) span{ background:#000; }
  body:not(.home) .menu-trigger:not(.active) p{ color:#000; }
}

/* 下層ヒーロー：ヘッダーとの余白を約半分に（社長指示 2026-07-13・黒帯除去後の白余白が広すぎ）
   PC 190.8→148px（見える余白84→42px）・SP 89→77px。タイトルは画像中央基準(offset=padding÷2)を維持 */
body:not(.home) .header_sub_wrap{ padding-top:148px; }
body:not(.home) .header_sub_wrap .ttl_wrap{ top:calc(74px + 50%); }
@media screen and (max-width:767px){
  body:not(.home) .header_sub_wrap{ padding-top:77px; }
  body:not(.home) .header_sub_wrap .ttl_wrap{ top:calc(38.5px + 50%); }
}

/* === company/message(1327)：メッセージ本文セクションを白背景に（社長指示 2026-07-14） ===
   共有クラス(bg_blue/txt_clr_white/main_ttl_center_w_2)はページ限定で上書き。白文字→濃色に */
body.page-id-1327 .section_about_3.bg_blue{ background:#fff !important; }
body.page-id-1327 .main_ttl_center_w_2{ color:#808080; }              /* 「メッセージ」ラベル */
body.page-id-1327 .main_ttl_center_w_2::before{ color:#004677; }      /* 「Message」英字＝紺 */
body.page-id-1327 .message_box_1.txt_clr_white{ color:#333; }         /* 本文 */
body.page-id-1327 .message_box_1 .ttl_50px{ color:#004677; }          /* 大見出し「不変的な使命を全うする」＝紺 */

/* === ヘッダーのナビ＋CTAボタンを20px上へ（社長指示 2026-07-14） ===
   #header_right（検索・ナビ・お問い合わせCTAを内包）を下層の静止時PCで20px上げる。
   追従(.header_scroll＝スリム中央寄せ)・SP(ドロワー内)は不変 */
@media screen and (min-width:768px){
  body:not(.home) header:not(.header_scroll) #header_right{ transform:translateY(-20px); }
}

/* =========================================================
   製品詳細ページ：#sub 撤去に伴う1カラム化＋カタログDLをh1右へ（社長指示・2026-07-29）
   ========================================================= */
.single-products .main_sub_wrap{ display:block; }
.single-products #main{ width:100%; }
@media screen and (max-width:767px){
  .single-products #main{ margin-bottom:0; }
}

/* ttl_box：h1（左）とカタログDLボタン（右寄せ） */
.ttl_box__head{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; }
.ttl_box__head .ttl{ margin-bottom:0; }
.ttl_box__actions{ flex:0 0 auto; }
.ttl_box__actions .btn_catalog{ width:auto; max-width:none; height:44px; margin:0; padding:0 1.6em; white-space:nowrap; font-size:0.62rem; }
@media screen and (max-width:767px){
  .ttl_box__head{ gap:.9rem; }
  .ttl_box__actions{ flex-basis:100%; }
  .ttl_box__actions .btn_catalog{ width:100%; }
}

/* ソフトウェアDL（残置ボタン）は中央寄せで従来同様 */
.products_dl{ margin-top:2.5rem; }
.products_dl .btn{ margin-left:auto; margin-right:auto; }