/* ===== 配色トークン（navy/orange/gray）＋テーマ変数再マッピング（サイト全体） ===== */
:root{
  --navy:#17294A; --navy-light:#24395E;
  --orange:#D75D27; --orange-deep:#C9531F;
  --white:#FFFFFF; --bg:#F5F6F8; --border:#E3E6EB;
  --gray-sub:#6B7480; --text:#333A44;
  --gray-dark:#3A4149; --gray-dark2:#4C555F;
  --lt-gray:#DCE1E7; --lt-gray2:#C7CDD5;
}
/* 強みカード：白地・黒文字・黒い細枠で囲う */
.strongths_item{background:#fff!important;background-image:none!important;border:1px solid #1a1a1a!important}
/* 強みカード見出し：文言が長くなり2行目が更に折り返す（孤立文字）のを防ぐため少し縮小 */
.strongths_item .txtarea .ttl-04{font-size:1.7rem;line-height:1.34}
.strongths_item .num-txt{color:#1a1a1a!important}
.strongths_item .txtarea .ttl-04,.strongths_item .txtarea p,.strongths_item .clr-text-light,.strongths_item .clr-wht{color:#1a1a1a!important}
/* ③FVの下部色ぼかしを紺(navy)に */
.sec-slant-slider-fv::after{background:linear-gradient(to top,rgba(23,41,74,0.9) 0%,rgba(36,57,94,0.55) 42%,rgba(36,57,94,0) 100%)!important}
/* フッター背景：格子柄はそのまま・ベース色をスウォッチのグレーに（parallax_box-bodyはfixedでフッターにのみ露出） */
.parallax_box--bg{background-color:#14233F!important;background-image:radial-gradient(rgba(255,255,255,0.05) 1px,transparent 1.3px)!important;background-size:22px 22px!important;background-position:left top!important}
.bg-lattice{display:none!important}
/* フッターお問い合わせCTA：矢印円 rest=紺円+白矢印／hover=白円+紺矢印 */
.footer_cta .contact a .arrow-circle{background-color:var(--navy)!important;border-color:var(--navy)!important}
.footer_cta .contact a .arrow-circle::after{background-color:#fff!important}
.footer_cta .contact a:hover .arrow-circle{background-color:#fff!important;border-color:#fff!important}
.footer_cta .contact a:hover .arrow-circle::after{background-color:var(--navy)!important}
/* ホバーでボタンbgが紺（=フッター同色）になり消えるので白枠 */
.footer_cta .contact a:hover{border-color:#fff!important}
/* フッターサイトポリシーCTA：矢印円 rest=白円+紺矢印／hover=紺円+白矢印 */
.footer_cta .entry a .arrow-circle{background-color:#fff!important;border-color:#fff!important}
.footer_cta .entry a .arrow-circle::after{background-color:var(--navy)!important}
.footer_cta .entry a:hover .arrow-circle{background-color:var(--navy)!important;border-color:var(--navy)!important}
.footer_cta .entry a:hover .arrow-circle::after{background-color:#fff!important}
/* ②カードナビ画像に薄い黒フィルター（テキスト・矢印はz-index:2で上に残る） */
.sec-imgcard-nav-ogushi-0719 .imgcardnav figure:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,0.25);z-index:1;pointer-events:none}
/* ③製品実績のRead More CTAを矢印だけに（テキスト非表示・円形化・矢印中央） */
.koto-pn .ts-product .all_button{width:60px;height:60px;padding:0;justify-content:center;transition:transform .35s cubic-bezier(.2,.7,.3,1),box-shadow .35s ease,background .4s,color .4s}
.koto-pn .ts-product .all_button span{display:none}
.koto-pn .ts-product .all_button:after{position:static;right:auto;top:auto;transform:none}
/* 製品実績CTA：ホバーで浮くアニメ */
.koto-pn .ts-product .all_button:hover{transform:translateY(-8px);box-shadow:0 10px 22px rgba(0,0,0,.3)}
/* Our Strengths 見出し本文の横幅を少しだけ詰める（フォントを微縮小） */
.home_out_strengths .ttl .ttl-03{font-size:calc(var(--font-size-heading3) * 0.75)}
/* フッター背景のざらざら（ノイズテクスチャ）を除去。格子線は残す */
.parallax_box-body .bg-noise{display:none!important}
/* ④会社概要セクションの一番大きい外枠を薄グレー→黒に（内側の仕切り線はそのまま） */
.home_about_us,.home_about_us--lists{border-color:#1a1a1a!important}
/* フッターは紺地に戻したので、ナビ・著作権テキストを白に */
.fnav--link,footer .fnav--link{color:#fff!important}
footer small{color:#fff!important}
/* フッターナビ（サイトマップ）を少し大きく（親・子の大小関係は維持） */
.fnav--menu>li>.fnav--link{font-size:calc(var(--font-size-heading6) * 1.2)!important}
.fnav--menu li li a.fnav--link{font-size:calc(var(--font-size-txt-sm) * 1.2)!important}
/* ヘッダーロゴ（左上・固定）をナビバーと同じ高さに（上へ引き上げ） */
.header--logo{padding-top:0!important;transform:translateY(-1.4rem)!important}
/* 紺フッターで紺地の「サイトポリシー」ボタンが埋もれるため、白い枠線で視認できるように */
.footer_cta .entry a{border-color:rgba(255,255,255,.5)!important}
/* 事業紹介タイトルの下げ量（本番はGSAPでカードが縦中央寄せ・transformでレイアウトを崩さず移動）。テキストとカードを少し離すため控えめに */
.home_out_business .koto-title{transform:translateY(10vh)}
/* 事業紹介カード：ホバー時のグラデをオレンジに */
.business_card::after{background:linear-gradient(180deg, rgba(215,93,39,0) 0%, rgba(215,93,39,0.82) 60%, #D75D27 100%)!important}
/* CTAの円形ボタンの矢印アイコンをオレンジに（rest/hover全状態） */
.arrow-circle::after{background-color:var(--orange)!important}
/* About（会社概要/沿革/工場）のCTA円形ボタン：rest=白地+オレンジ矢印、hover=オレンジ地+白矢印 */
.arrow-circle.bg-blk{background-color:#fff!important;border-color:var(--orange)!important}
.arrow-circle.bg-blk::after{background-color:var(--orange)!important}
.hover_area:has(a:hover) .arrow-circle.bg-blk{background-color:var(--orange)!important;border-color:var(--orange)!important}
.hover_area:has(a:hover) .arrow-circle.bg-blk::after{background-color:#fff!important}
:root{
  --clr-primary-default:var(--navy); --clr-primary-dark:var(--navy); --clr-primary-light:var(--navy-light);
  --clr-secondary-default:var(--orange); --clr-secondary-dark:var(--orange-deep); --clr-secondary-light:var(--orange);
  --clr-text-primary:var(--text); --clr-text-secondary:var(--gray-sub); --clr-text-light:var(--white); --clr-text-placeholder:var(--gray-sub);
  --clr-bg-01:var(--bg); --clr-bg-02:var(--border); --clr-wht:var(--white); --clr-blk:var(--navy);
  --clr-mono-01:var(--border); --clr-mono-02:var(--border); --clr-mono-03:var(--gray-sub); --clr-mono-04:var(--gray-sub);
  --clr-mono-05:var(--gray-sub); --clr-mono-06:var(--navy-light); --clr-mono-07:var(--text);
  --bg-gradient-static:linear-gradient(90deg, var(--navy-light) 0%, var(--navy) 100%);
  --bg-gradient-animation:linear-gradient(-90deg, rgba(23,41,74,0) 15%, #17294A 51%, #24395E 67%, #35507F 83%, #4A6698 100%);
  --box-shadow-default:0px 0px 12px 0px color-mix(in srgb, var(--navy) 8%, transparent);
}
/* 役割別オーバーライド */
body{background-color:var(--bg);color:var(--text)}
.btn.type01.gnav--contact a::before{background-image:linear-gradient(90deg,#1a1a1a 0%,#1a1a1a 100%)}
.btn.type01.gnav--contact a:hover::before{opacity:1;background-image:linear-gradient(90deg,#333,#333)}
.btn.type01.gnav--contact a,.btn.type01.gnav--contact a:hover{color:var(--white)}
/* ⑥ヘッダーお問い合わせCTA：矢印を黒に（白丸＋黒矢印） */
.gnav--contact .arrow-circle::after{background-color:#1a1a1a!important}
/* ③上ナビを少し大きく */
.gnav--menu .gnav--link{font-size:1.18rem;letter-spacing:.04em}
.btn.type01.gnav--contact a{font-size:1.12rem}
.cta_contact a{background-color:var(--orange);color:var(--white)}
.cta_contact a:hover{background-color:var(--orange-deep)}
.form_contact .wpcf7-submit{background-color:var(--orange);color:var(--white)}
.form_contact .wpcf7-submit:hover{background-color:var(--orange-deep)}
.ttl-02.font-en,.ttl-03.font-en,.ez-toc-title{color:var(--navy)}
.related_page--list,.related_page--list li,.home_about_us,.home_about_us--lists,.mce-table01 td,.lps_parts--faq.faq-toggle .faq_item,.lps_parts--faq.faq-toggle .faq_item:first-child,.lps_parts--timeline .timeline_item,.lps_parts--timeline .timeline_item::before,.lps_parts--accordion .accordion_item,.lps_parts--accordion .accordion_item:first-child{border-color:var(--border)}
.news--archive{background-color:var(--navy)}
/* ===== ここまで配色適用ヘッダー ===== */
/* コートー 製品紹介×お知らせ 移植セクション（COSOK系デザイン流用・.koto-pn にスコープ） */
.koto-pn *{box-sizing:border-box;margin:0;padding:0}
.koto-pn{font-family:"游ゴシック体",YuGothic,"Yu Gothic","メイリオ","Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif;font-weight:500;pointer-events:auto}
.koto-pn,.koto-pn *{pointer-events:auto}
.koto-pn img{vertical-align:bottom;max-width:100%}
.koto-pn a{text-decoration:none}
.koto-pn li{list-style:none}
.koto-pn .all_font_poppins{font-weight:400;font-family:"Poppins",sans-serif}
.koto-pn .content{width:89.6%;max-width:1230px;margin:0 auto}
.koto-pn .content1480{max-width:1480px}
.koto-pn .all_text{letter-spacing:.05em;line-height:2;font-size:16px}
.koto-pn .all_text_smaller{line-height:2;font-size:14px}

/* border title */
.koto-pn .all_border_title ._container{overflow:hidden}
.koto-pn .all_border_title ._wrapper{position:relative;display:inline-block}
.koto-pn .all_border_title ._head{letter-spacing:.05em;font-weight:700;font-size:16px;color:var(--navy)}
.koto-pn .all_border_title ._main{line-height:1;letter-spacing:-.06em;font-weight:600;font-size:80px;color:var(--navy);white-space:nowrap;padding-right:.1em}
.koto-pn .all_border_title._white ._head,.koto-pn .all_border_title._white ._main{color:#fff}
.koto-pn .all_square_anime{position:relative;display:inline-block;transform:none}
.koto-pn .all_square_anime:after{content:"";background:var(--navy);width:100%;height:100%;position:absolute;right:0;top:0;display:block;transform:scaleX(0);transform-origin:right center}
.koto-pn .ts-product .all_square_anime:after{background:#fff}
.koto-pn .all_border_title._anime .all_square_anime{transform:translateX(0);transition:all .4s .7s ease}
.koto-pn .all_border_title._anime .all_square_anime:after{transform:scale(0,1);transition:all .4s 1.1s ease}

/* buttons */
.koto-pn .all_button{width:200px;height:60px;padding:0 50px 0 30px;position:relative;display:flex;align-items:center;border:1px var(--navy) solid;border-radius:30px;font-weight:700;font-size:16px;color:var(--navy);transition:background .4s,color .4s}
.koto-pn .all_button span{width:100%;display:block;font-weight:inherit}
.koto-pn .all_button:after{content:"";background:url(img/arrow-red.svg) no-repeat center/16px 12px;width:16px;height:12px;position:absolute;right:22px;top:50%;transform:translateY(-50%);display:block}
.koto-pn .all_button._white{border:1px #fff solid;color:#fff}
.koto-pn .all_button._white:after{background-image:url(img/arrow-white.svg)}
.koto-pn a:hover .all_button._white{background:var(--white);color:var(--navy)}
.koto-pn a:hover .all_button._white:after{background-image:url(img/arrow-red.svg)}

/* product slide */
.koto-pn .ts-section-bg{background:var(--bg)}
.koto-pn .ts-product{background-color:var(--navy);background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.3px);background-size:22px 22px;background-position:left top;padding:140px 0 200px;position:relative}
.koto-pn .ts-product ._head{display:flex;justify-content:space-between;align-items:flex-end}
.koto-pn .ts-product ._head .all_text{width:calc(100% - 490px);padding:0 6.9%;color:#fff}
.koto-pn .ts-product ._head ._link{width:200px}
.koto-pn .ts-product ._slide{width:calc(615px + 50vw);margin:90px 0 0;overflow:hidden}
.koto-pn .ts-product ._slide .swiper-slide{width:460px}
.koto-pn .ts-product ._slide ._img{overflow:hidden}
.koto-pn .ts-product ._slide ._img img{width:100%;transition:transform .4s ease}
.koto-pn .ts-product ._slide a:hover ._img img{transform:scale(1.05)}
.koto-pn .ts-product ._slide ._name{margin:15px 0 0;display:flex;align-items:flex-end;line-height:1.65;letter-spacing:.05em;font-weight:700;font-size:20px;color:#fff}
.koto-pn .ts-product ._slide .all_text_smaller{margin:8px 0 0;color:#fff}
.koto-pn .ts-product-controls{margin:60px 0 0;position:relative;text-align:right}
.koto-pn .ts-product-controls ._bar{background:rgba(255,255,255,.22);width:calc(100% - 250px);height:1px;position:absolute;left:0;top:50%}
.koto-pn .ts-product-controls ._bar .swiper-pagination-progressbar-fill{background:var(--white);height:2px}
.koto-pn .ts-product-controls ._button{width:60px;height:60px;display:inline-flex;justify-content:center;align-items:center;vertical-align:top;border:1px #fff solid;border-radius:50%;background:#fff;transition:background .4s ease,border-color .4s ease;cursor:pointer}
.koto-pn .ts-product-controls ._button:hover{background:var(--orange);border-color:var(--orange)}
.koto-pn .ts-product-controls ._prev{margin-right:12px}
/* 矢印：白矢印SVGをマスク化して塗り分け（rest=オレンジ / hover=白）。円はrest=白 / hover=オレンジ */
.koto-pn .ts-product-controls ._button img{display:none}
.koto-pn .ts-product-controls ._button::after{content:"";display:block;width:14px;height:12px;background-color:var(--orange);-webkit-mask:url(img/slide-arrow.svg) no-repeat center/contain;mask:url(img/slide-arrow.svg) no-repeat center/contain;transition:background-color .4s ease}
.koto-pn .ts-product-controls ._prev::after{transform:rotate(180deg)}
.koto-pn .ts-product-controls ._button:hover::after{background-color:#fff}

/* news */
.koto-pn .ts-news{margin-top:-120px;position:relative;z-index:2}
.koto-pn .ts-news .content{background:#fff;padding:120px 0 140px}
.koto-pn .ts-news ._inner{width:90%;max-width:1230px;margin:0 auto;display:flex;justify-content:space-between}
.koto-pn .ts-news ._left{width:205px}
.koto-pn .ts-news ._right{width:calc(100% - 285px);max-width:855px}
.koto-pn .ts-news ._link{margin:80px 0 0}
.koto-pn .ts-news-cats{margin:40px 0 0}
.koto-pn .ts-news-cats li:nth-child(n+2){margin:15px 0 0}
.koto-pn .ts-news-cats a{padding:0 20px;display:inline-block;border:1px var(--border) solid;border-radius:24px;line-height:26px;font-size:12px;color:var(--text)}
.koto-pn .ts-news-cats a._on{background:var(--navy);border-color:var(--navy);color:var(--white)}
.koto-pn .all_news_list a{padding:30px 0;position:relative;display:flex;align-items:center;border-bottom:1px var(--border) solid;color:var(--text)}
.koto-pn .all_news_list a:after{content:"";background:var(--orange);width:100%;height:2px;position:absolute;left:0;bottom:-1px;transform:scale(0,1);display:block;transition:transform .4s ease;transform-origin:left center}
.koto-pn .all_news_list a:hover:after{transform:scale(1,1)}
.koto-pn .all_news_list time{width:110px;display:flex;align-items:center;letter-spacing:.05em;font-size:14px}
.koto-pn .all_news_list ._category{width:130px;display:block}
.koto-pn .all_news_list ._category ._block{padding:0 15px;display:inline-block;border:1px var(--border) solid;border-radius:24px;line-height:26px;letter-spacing:.05em;font-size:12px}
.koto-pn .all_news_list ._title{width:calc(100% - 300px);font-weight:700;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.koto-pn .all_news_list ._arrow{width:16px;position:absolute;right:15px;top:50%;transform:translateY(-50%)}
.koto-pn .all_news_list:not(.active){display:none}

/* swiper core (min) */
.koto-pn .swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}
.koto-pn .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}
.koto-pn .swiper-slide{flex-shrink:0;height:auto;position:relative;transition-property:transform}
.koto-pn .ts-product ._slide.swiper-container{height:auto!important}
.koto-pn .ts-product ._slide .swiper-wrapper{height:auto!important;align-items:stretch}
.koto-pn .ts-product ._slide .swiper-slide{height:auto!important}
.koto-pn .swiper-pagination-progressbar{position:relative}
.koto-pn .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}

/* responsive */
@media (max-width:1024px){
  .koto-pn .ts-product ._head{display:block}
  .koto-pn .ts-product ._head .all_text{width:100%;padding:0;margin-top:30px}
  .koto-pn .ts-product ._head ._link{margin-top:40px}
  .koto-pn .ts-news ._inner{display:block}
  .koto-pn .ts-news ._left{width:100%}
  .koto-pn .ts-news ._right{width:100%;margin-top:40px;border-top:1px var(--border) solid}
}
@media (max-width:600px){
  .koto-pn .all_border_title ._main{font-size:48px}
  .koto-pn .ts-product{padding:90px 0 140px}
  .koto-pn .ts-product ._slide{margin-top:40px}
  .koto-pn .ts-product ._slide .swiper-slide{width:260px}
  .koto-pn .ts-news .content{padding:80px 0 90px}
  .koto-pn .all_news_list a{flex-wrap:wrap;padding:22px 0}
  .koto-pn .all_news_list ._title{width:100%;margin-top:10px}
  .koto-pn .all_news_list ._arrow{display:none}
  .koto-pn .ts-product-controls ._bar{width:calc(100% - 110px)}
  .koto-pn .ts-product-controls ._button{width:40px;height:40px}
}

/* ===== Contact 帯（2枚目デザイン移植・中央Contact＋Tel/Mail 2カラム） ===== */
.koto-contact{pointer-events:auto;padding:110px 5% 100px;text-align:center;position:relative;z-index:2}
.koto-contact a{text-decoration:none}
.koto-contact,.koto-contact *{pointer-events:auto;box-sizing:border-box}
.koto-contact ._label{font-size:15px;letter-spacing:.08em;color:#e6e6e6;margin:0 0 14px}
.koto-contact ._en{font-family:"Zen Maru Gothic","Poppins","Hiragino Sans",sans-serif;font-weight:700;font-size:56px;line-height:1.1;color:#fff;letter-spacing:.02em;margin:0 0 64px}
.koto-contact ._cols{max-width:900px;margin:0 auto;display:flex;align-items:center;justify-content:center}
.koto-contact ._col{flex:1;padding:0 40px;display:flex;flex-direction:column;align-items:center}
.koto-contact ._divider{width:1px;align-self:stretch;background:rgba(255,255,255,.35);min-height:120px}
.koto-contact ._col ._ttl{font-size:15px;letter-spacing:.06em;color:#dcdcdc;margin:0 0 26px}
.koto-contact ._tel{display:inline-block;font-weight:700;font-size:40px;letter-spacing:.02em;color:#fff;line-height:1.1;white-space:nowrap}
.koto-contact ._tel small{font-size:26px;font-weight:700;margin-right:2px}
.koto-contact ._mailbtn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:330px;height:66px;padding:0 24px;border:1px solid var(--orange);border-radius:33px;background:var(--orange);color:var(--white);font-weight:700;font-size:16px;transition:background .35s ease,color .35s ease}
.koto-contact ._mailbtn svg{width:20px;height:16px;flex:0 0 auto}
.koto-contact ._mailbtn:hover{background:var(--orange-deep);color:var(--white)}
.koto-contact ._mailbtn:hover svg path{stroke:var(--white)}
@media (max-width:768px){
  .koto-contact{padding:70px 6% 60px}
  .koto-contact ._en{font-size:40px;margin-bottom:44px}
  .koto-contact ._cols{display:block;max-width:420px}
  .koto-contact ._divider{width:100%;height:1px;min-height:0;margin:36px 0}
  .koto-contact ._col{padding:0}
  .koto-contact ._tel{font-size:32px}
  .koto-contact ._mailbtn{min-width:0;width:100%;max-width:300px}
}


/* フッターmarquee停止：親幅0に依存せず高さ基準で1行フル表示（静止） */
footer .koto-tick-stop{display:flex;justify-content:center;align-items:center;width:100vw;position:relative;left:50%;transform:translateX(-50%);overflow:hidden}
footer .koto-tick-stop>div{display:block}
footer .koto-tick-stop .js-tick-item{display:block!important;transform:none!important}
footer .koto-tick-stop .js-tick-item:nth-child(n+2){display:none!important}
footer .koto-tick-stop .js-tick-item img{display:block!important;width:min(1400px,90vw)!important;height:auto!important;max-width:90vw!important}

/* 背景parallax_boxのマウス追従を停止（フッター等の背景が動かないよう固定） */
.parallax_box-body .parallax_box--item{transform:none!important}

/* ===== 共通タイトル仕様（製品実績/Productsと同じ：小ラベル＋大英字）明色背景用・濃色文字 ===== */
.koto-title{margin:0 0 60px}
.koto-title ._label{display:block;font-size:16px;font-weight:700;letter-spacing:.05em;color:var(--navy);margin:0 0 10px;line-height:1.4}
.koto-title ._en{display:block;font-family:"Poppins","Zen Maru Gothic","Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif;font-weight:600;font-size:80px;line-height:1;letter-spacing:-.03em;color:var(--navy);white-space:nowrap}
@media (max-width:600px){.koto-title{margin-bottom:36px}.koto-title ._en{font-size:48px}}

/* ===================== 新FV（斜めスライダー slant-slider-fv） ===================== */
.sec-slant-slider-fv *,.sec-slant-slider-fv *::before,.sec-slant-slider-fv *::after{box-sizing:border-box;pointer-events:auto}
.sec-slant-slider-fv :where(h1,h2,h3,h4,h5,h6,p,ul,ol,li){margin:0;padding:0}
.sec-slant-slider-fv :where(ul,ol,li){list-style:none}
.sec-slant-slider-fv img{max-width:none;border:0;vertical-align:top}
.sec-slant-slider-fv a{color:inherit;text-decoration:none;pointer-events:auto}
.sec-slant-slider-fv{position:relative;width:100%;height:112vh;overflow:hidden;background:var(--white);color:var(--text);font-family:"Montserrat","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;pointer-events:auto}
.sec-slant-slider-fv ._hero_bg{position:absolute;inset:0;z-index:0}
.sec-slant-slider-fv ._hero_bg img{width:100%;height:100%;object-fit:cover;object-position:left center}
.sec-slant-slider-fv .swiper_container{position:absolute;inset:0;width:100%;height:100%;z-index:1;-webkit-clip-path:url(#pw-slantfv);clip-path:url(#pw-slantfv)}
.sec-slant-slider-fv .swiper_container .swiper{height:100%}
.sec-slant-slider-fv .swiper_container .swiper-slide{width:100%!important}
.sec-slant-slider-fv .swiper_container img{width:100%;height:100%;object-fit:cover;object-position:center}
.sec-slant-slider-fv .arch{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
/* FV画像の下側に青系の色グラデ（isomurass風の色ぼかし） */
.sec-slant-slider-fv::after{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;background:linear-gradient(to top,rgba(23,41,74,0.9) 0%,rgba(36,57,94,0.55) 42%,rgba(36,57,94,0) 100%);z-index:3;pointer-events:none}
.sec-slant-slider-fv ._logo{position:absolute;top:5%;left:5%;z-index:4;width:210px;max-width:38%}
.sec-slant-slider-fv ._logo img{width:100%;height:auto}
.sec-slant-slider-fv ._title{position:absolute;top:auto;bottom:18vh;left:auto;right:5%;transform:none;z-index:4;width:auto;max-width:66%;color:#fff;text-align:right}
.sec-slant-slider-fv ._title ._t1{display:block;font-weight:800;font-size:clamp(30px,4.7vw,66px);line-height:1.12;letter-spacing:.02em;text-shadow:0 2px 22px rgba(0,0,0,.45)}
.sec-slant-slider-fv ._title ._t2{display:block;margin-top:19px;font-weight:600;font-size:clamp(14px,1.45vw,20px);letter-spacing:.06em;text-shadow:0 2px 14px rgba(0,0,0,.5);white-space:nowrap}
/* 本文の末尾に文字が孤立する折り返しを防ぐ（行を均等化） */
.txt-lg,.koto-stickybase ._lead,.koto-stickybase ._body p,.business_card p,.strongths_item .txtarea p,.koto-pn .all_text{text-wrap:balance}
/* フッターのキャッチ「「ワンストップ」で、短納期に応える。」をPCで1行に。max-width制限を外しnowrapで1行固定／狭い画面でもはみ出さないよう可変フォント／SPは元のbrで2行維持。フォント指定はキャッチ直下だけに限定（.clr-wht等の汎用クラスを巻き込まない） */
footer .footer_info .ttl.txt-ctr{white-space:nowrap!important;max-width:none!important}
footer .footer_info .ttl.txt-ctr>.ttl-sub{white-space:normal!important}
footer .footer_info .ttl.txt-ctr>.catch_copy-style,footer .footer_info .ttl.txt-ctr>.catch_copy-style .ttl-deco-grade-child{font-size:min(81px,6vw)!important}
footer .footer_info .ttl.txt-ctr>.clr-wht{font-size:min(48px,3.55vw)!important}
.sec-slant-slider-fv ._menu{position:absolute;left:5%;bottom:0;padding-left:34px;padding-bottom:16%;border-left:1px solid rgba(255,255,255,.35);z-index:4}
.sec-slant-slider-fv ._menu::before{content:"";height:26px;width:1px;background:#fff;position:absolute;top:0;left:0}
.sec-slant-slider-fv ._menu li{margin-bottom:46px;line-height:1}
.sec-slant-slider-fv ._menu li:last-child{margin-bottom:0}
.sec-slant-slider-fv ._menu a{font-size:15px;font-weight:700;letter-spacing:.04em;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.5);transition:opacity .3s ease}
.sec-slant-slider-fv ._menu li:hover a{opacity:.6}
/* 上ナビ hover：ネイビーに変えず、現色のまま少し半透明にするだけ */
.gnav--menu>li:hover>a.gnav--link{color:var(--clr-text-light)!important;opacity:.62;transition:opacity .3s ease}
html.koto-nav-light .gnav--menu>li:hover>a.gnav--link{color:var(--navy)!important}
@media (max-width:767px){
  .sec-slant-slider-fv ._title{max-width:90%;top:auto;bottom:12vh;left:auto;right:5%;transform:none;text-align:right}
  .sec-slant-slider-fv ._title ._t1{font-size:clamp(26px,7.4vw,40px)}
  .sec-slant-slider-fv ._title ._t2{white-space:normal;text-wrap:balance}
  .sec-slant-slider-fv ._menu{display:none}
}
@media screen and (max-width:650px){.sec-slant-slider-fv{height:667px}}
/* scoped swiper */
.sec-slant-slider-fv .swiper{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}
.sec-slant-slider-fv .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}
.sec-slant-slider-fv .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}
.sec-slant-slider-fv .swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity}
.sec-slant-slider-fv .swiper-container-fade .swiper-slide-active{pointer-events:auto}

/* ===== ナビ色を背景の明暗に連動して反転（白背景→黒文字／暗背景→白文字） ===== */
html.koto-nav-light .gnav--link,
html.koto-nav-light .gnav--link span,
html.koto-nav-light .head_sub_nav--link{color:var(--navy) !important;-webkit-text-fill-color:var(--navy) !important}
html.koto-nav-light .header--logo img{filter:brightness(0) !important}

/* isomurass 100%再現：FVをstickyで固定。本文がせり上がって画面中央に来たら is-show でFVを一段ぼかし（blur20px / all .4s ease-out）。テキストは載せない */
/* z-index:1でCKI背景テクスチャ(parallax_boxのノイズ/格子・blend-mode)がFV上に被さって上端に黒帯が出るのを解消 */
.koto-hero-stage{position:relative;z-index:1;min-height:180vh;background:var(--navy)}
.koto-hero-stage .sec-slant-slider-fv{position:sticky!important;top:-12vh;filter:blur(0);transition:filter .4s ease-out;will-change:transform,filter}
html.koto-fv-blur .koto-hero-stage .sec-slant-slider-fv{filter:blur(20px)}
/* FVとOur CommitmentのフォントをZen Kaku Gothic Newに */
.koto-hero-stage .sec-slant-slider-fv,.koto-hero-stage .sec-slant-slider-fv *,
.koto-stickybase,.koto-stickybase *{font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif!important}
/* FVタイトル・サブタイトルは游ゴシック体700 */
.koto-hero-stage .sec-slant-slider-fv ._title,.koto-hero-stage .sec-slant-slider-fv ._title *{font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif!important;font-weight:700!important}
/* ①上の黒帯（CKI標準header--bgのスクロール連動が壊れ常時黒）を撤去 */
.header--bg{display:none!important}
/* ②FV表示中は上ナビを隠す（FVは左ナビを使う）。FVを過ぎたら上ナビが出る */
.header{transition:opacity .35s ease,transform .35s ease}
html.koto-hero-lock .header{opacity:0!important;pointer-events:none!important;transform:translateY(-16px)!important}
html:not(.koto-hero-lock) .header{opacity:1!important;transform:none!important}
/* 事業紹介の背景に製品実績と同じ細かいドット（背景色は現状のまま） */
.home_out_business{background-image:radial-gradient(rgba(23,41,74,0.13) 1px,transparent 1.3px)!important;background-size:22px 22px!important;background-position:left top!important;background-repeat:repeat!important}
/* 強み装飾背景2枚：画像の枠を四辺フェザー（ぼかして）背景に馴染ませる */
.home_out_strengths--bg img{
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
/* ぼけたFVの上にせり上がる本文（stickywrap--base相当）。背景は透過でぼけたFVが透ける・文字は鮮明 */
.koto-hero-stage .sec-slant-slider-fv ._title,.koto-hero-stage .sec-slant-slider-fv ._menu{will-change:transform,opacity}
.koto-stickybase{position:relative;z-index:2;min-height:120vh;display:flex;align-items:flex-start;justify-content:center;padding:40vh 6% 18vh;pointer-events:none}
.koto-stickybase ._inner{max-width:960px;margin:0 auto;text-align:center;color:#fff}
.koto-stickybase ._en{display:block;font-family:"Montserrat","Helvetica Neue",Arial,sans-serif;font-weight:800;font-size:clamp(13px,1.5vw,19px);letter-spacing:.34em;color:#fff;margin-bottom:34px;text-shadow:0 2px 18px rgba(0,0,0,.65)}
.koto-stickybase ._catch{margin:0;font-weight:800;font-size:clamp(15px,4.1vw,54px);line-height:1.34;letter-spacing:.04em;text-shadow:0 6px 36px rgba(0,0,0,.7);white-space:nowrap}
.koto-stickybase ._catch b{color:#fff;font-weight:800}
.koto-stickybase ._lead{margin:24px 0 0;font-weight:700;font-size:clamp(15px,2.1vw,28px);letter-spacing:.06em;color:#eef4ff;text-shadow:0 4px 26px rgba(0,0,0,.7)}
.koto-stickybase ._body{margin:46px auto 0;max-width:920px}
.koto-stickybase ._body p{margin:0 0 22px;font-weight:600;font-size:clamp(14px,1.5vw,19px);line-height:1.95;letter-spacing:.03em;color:#e6edf9;text-shadow:0 3px 20px rgba(0,0,0,.75)}
.koto-stickybase ._body p:last-child{margin-bottom:0}
/* 本文はヒーロー側に集約したので元の詳細節は非表示 */
.home_our_commitment{display:none}
@media screen and (max-width:650px){
  .koto-hero-stage{min-height:150vh}
  .koto-stickybase{min-height:120vh;padding:40vh 7% 18vh}
  .koto-stickybase ._body p{font-size:14px;line-height:1.9}
}