@charset "utf-8";
/* =========================================================================
   SUWA CHRISTY — Brand Top Stylesheet
   長野・諏訪のフレキシブルヒーターブランド。ライトトーン×精密感。
   namespace: .sc / sc-*（他ページと隔離）／ JSは <script> 内（仕様準拠）
   ========================================================================= */
:root{
  --c-base:#FFFFFF;
  --c-sub:#F5F5F3;
  --c-dark:#1A1A1A;
  --c-green:#2E7D32;
  --c-green-d:#1f5a23;
  --c-orange:#E8621A;
  --c-text:#1A1A1A;
  --c-muted:#888888;
  --c-line:#E4E4E0;
  --c-line-d:#333333;
  --ease:cubic-bezier(.22,.61,.36,1);
  --maxw:1200px;
  --pad-sec:clamp(88px,11vw,140px);
  --ff-jp:"Noto Sans JP",-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --ff-en:"Inter","Noto Sans JP",sans-serif;
}
*,*::before,*::after{ box-sizing:border-box; }
.sc{ margin:0; background:var(--c-base); color:var(--c-text); font-family:var(--ff-jp);
  font-size:16px; line-height:1.9; letter-spacing:.02em; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
.sc img{ max-width:100%; height:auto; display:block; }
.sc a{ color:inherit; text-decoration:none; }
.sc ul,.sc ol{ list-style:none; margin:0; padding:0; }
.sc h1,.sc h2,.sc h3,.sc p{ margin:0; }
.sc ::selection{ background:var(--c-green); color:#fff; }
.sc p,.sc li,.sc dd,.sc dt,.sc td,.sc th,.sc summary,.sc label{ font-size:1rem; }
.sc small{ font-size:14px; }
.sc__inner{ width:min(100% - 48px, var(--maxw)); margin-inline:auto; }

/* labels / headings */
.sc-label{ display:inline-block; font-family:var(--ff-en); font-size:.875rem; letter-spacing:.32em;
  text-transform:uppercase; color:var(--c-green); font-weight:600; position:relative; padding-left:42px; margin-bottom:24px; }
.sc-label::before{ content:""; position:absolute; left:0; top:50%; width:30px; height:1px; background:var(--c-green); }
.sc-label--orange{ color:var(--c-orange); } .sc-label--orange::before{ background:var(--c-orange); }
.sc-label--light{ color:var(--c-orange); }
.sc-h2{ font-family:var(--ff-jp); font-weight:300; font-size:clamp(1.7rem,3.6vw,2.8rem); line-height:1.45; letter-spacing:.02em; }
.sc-h2 b{ font-weight:600; }
.sc-h2--light{ color:#fff; }

/* reveal */
.reveal{ opacity:0; transform:translateY(34px); transition:opacity .9s var(--ease),transform .9s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.1s } .reveal.d2{ transition-delay:.2s } .reveal.d3{ transition-delay:.3s } .reveal.d4{ transition-delay:.4s }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1!important; transform:none!important; transition:none } }

/* placeholder */
.ph{ position:relative; background:var(--c-sub); overflow:hidden; }
.ph img{ width:100%; height:100%; object-fit:cover; }
.ph img.img-missing{ display:none; }
.ph.is-empty::after{ content:"IMAGE"; position:absolute; inset:0; display:grid; place-items:center;
  font-family:var(--ff-en); letter-spacing:.4em; font-size:.875rem; color:#b9b9b3;
  background:repeating-linear-gradient(45deg,#efefec 0 14px,#f5f5f3 14px 28px); }

/* =========================================================================
   HEADER
   ========================================================================= */
.sc-header{ position:fixed; inset:0 0 auto 0; z-index:60; display:flex; align-items:center; justify-content:space-between;
  padding:10px clamp(20px,4vw,48px); transition:background .4s var(--ease),box-shadow .4s var(--ease),padding .4s var(--ease); }
.sc-header.is-stuck{ background:rgba(255,255,255,.92); backdrop-filter:blur(10px); box-shadow:0 1px 0 var(--c-line); padding-top:15px; padding-bottom:15px; }
.sc-logo{ font-family:var(--ff-en); font-weight:600; letter-spacing:.22em; font-size:1.05rem; color:var(--c-green); }
.sc-gnav{ display:flex; align-items:center; gap:30px; }
.sc-gnav a{ font-size:.9375rem; color:var(--c-text); position:relative; transition:color .3s; }
.sc-gnav a::after{ content:""; position:absolute; left:0; bottom:-6px; width:0; height:1px; background:#E8621A; transition:width .3s var(--ease); }
.sc-gnav a:hover::after{ width:100%; }
.sc-gnav a.is-mysaon{ color:var(--c-orange); font-weight:600; } .sc-gnav a.is-mysaon::after{ background:var(--c-orange); }
.sc-burger{ display:none; width:30px; height:22px; position:relative; background:none; border:none; cursor:pointer; padding:0; z-index:61; }
.sc-burger span{ position:absolute; left:0; width:100%; height:2px; background:var(--c-text); transition:transform .35s var(--ease),opacity .25s; }
.sc-burger span:nth-child(1){ top:0 } .sc-burger span:nth-child(2){ top:10px } .sc-burger span:nth-child(3){ top:20px }
.sc-burger.is-open span:nth-child(1){ top:10px; transform:rotate(45deg) } .sc-burger.is-open span:nth-child(2){ opacity:0 } .sc-burger.is-open span:nth-child(3){ top:10px; transform:rotate(-45deg) }
@media (max-width:900px){
  .sc-burger{ display:block; }
  .sc-gnav{ position:fixed; inset:0; flex-direction:column; justify-content:center; gap:26px; background:rgba(255,255,255,.98);
    transform:translateY(-100%); transition:transform .5s var(--ease); }
  .sc-gnav.is-open{ transform:none; }
  .sc-gnav a{ font-size:1.2rem; }
}

/* =========================================================================
   HERO
   ========================================================================= */
.sc-hero{ position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:center; padding:140px 0 100px; overflow:hidden; }
.sc-hero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:50px; align-items:center; width:min(100% - 48px,var(--maxw)); margin-inline:auto; }
.sc-hero__title{ font-family:var(--ff-en); font-weight:400; font-size:clamp(2.6rem,7vw,6rem); line-height:1.02; letter-spacing:.03em; text-transform:uppercase; }
.sc-hero__title .g{ color:var(--c-green); }
.sc-hero__line{ width:0; height:3px; margin:30px 0; background:linear-gradient(90deg,var(--c-green),var(--c-orange)); }
.sc-hero.is-in .sc-hero__line{ width:120px; transition:width 1.1s var(--ease) .3s; }
.sc-hero__catch{ font-size:clamp(1.2rem,2.6vw,1.9rem); font-weight:500; letter-spacing:.1em; }
.sc-hero__sub{ font-family:var(--ff-en); font-size:clamp(.875rem,1.4vw,1.02rem); letter-spacing:.22em; text-transform:uppercase; color:var(--c-muted); margin-top:16px; }
/* 右側テック演出（CSS/SVG） */
.sc-hero__visual{ position:relative; aspect-ratio:1/1; }
.sc-hero__visual svg{ width:100%; height:100%; overflow:visible; }
.sc-circ{ fill:none; stroke:var(--c-line); stroke-width:1; }
.sc-circ--g{ stroke:var(--c-green); stroke-dasharray:6 8; animation:scDash 14s linear infinite; }
.sc-circ--o{ stroke:var(--c-orange); stroke-opacity:.8; }
@keyframes scDash{ to{ stroke-dashoffset:-280; } }
.sc-ring{ fill:none; stroke:var(--c-orange); transform-origin:center; opacity:0; animation:scPulse 3.6s var(--ease) infinite; }
.sc-ring:nth-child(2){ animation-delay:1.2s } .sc-ring:nth-child(3){ animation-delay:2.4s }
@keyframes scPulse{ 0%{ transform:scale(.4); opacity:.55 } 80%{ opacity:0 } 100%{ transform:scale(1.25); opacity:0 } }
.sc-node{ fill:var(--c-green); } .sc-node--o{ fill:var(--c-orange); }
.sc-flow{ stroke:var(--c-green); stroke-width:2; fill:none; stroke-dasharray:5 7; animation:scFlow 2.4s linear infinite; }
@keyframes scFlow{ to{ stroke-dashoffset:-48 } }
.sc-hero__scroll{ position:absolute; left:clamp(24px,4vw,48px); bottom:34px; display:flex; align-items:center; gap:14px;
  font-family:var(--ff-en); font-size:.875rem; letter-spacing:.28em; text-transform:uppercase; color:var(--c-muted); }
.sc-hero__scroll .bar{ position:relative; width:54px; height:1px; background:var(--c-line); overflow:hidden; }
.sc-hero__scroll .bar::after{ content:""; position:absolute; top:0; left:-40%; width:40%; height:100%; background:var(--c-green); animation:scScroll 2s var(--ease) infinite; }
@keyframes scScroll{ 0%{ left:-45% } 100%{ left:100% } }
@media (max-width:900px){
  .sc-hero__grid{ grid-template-columns:1fr; gap:30px; }
  .sc-hero__visual{ max-width:360px; order:-1; }
}

/* breadcrumb */
.sc-bc{ border-bottom:1px solid var(--c-line); }
.sc-bc ol{ display:flex; flex-wrap:wrap; gap:8px; padding:16px 0; font-size:.875rem; color:var(--c-muted); }
.sc-bc li::after{ content:"/"; margin-left:8px; color:#c4c4c0; } .sc-bc li:last-child::after{ content:none; }
.sc-bc a{ color:var(--c-muted); transition:color .3s; } .sc-bc a:hover{ color:#E8621A; }
.sc-bc li[aria-current]{ color:var(--c-text); }

/* =========================================================================
   CONCEPT
   ========================================================================= */
.sc-concept{ background:var(--c-sub); padding:var(--pad-sec) 0; }
.sc-concept__grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:center; }
.sc-concept__body{ color:#555; font-size:1.02rem; line-height:1.95; margin-top:8px; }
.sc-stats{ display:grid; gap:26px; }
.sc-stat{ border-top:1px solid var(--c-line); padding-top:18px; }
.sc-stat__num{ font-family:var(--ff-en); font-weight:200; font-size:clamp(2.6rem,5vw,4rem); line-height:1; color:var(--c-green); }
.sc-stat__num.o{ color:var(--c-orange); }
.sc-stat__txt{ font-size:.9375rem; color:var(--c-muted); margin-top:6px; letter-spacing:.04em; }
.sc-concept__media{ margin-top:54px; border-radius:6px; aspect-ratio:16/6; }
@media (max-width:900px){ .sc-concept__grid{ grid-template-columns:1fr; gap:40px; } }

/* =========================================================================
   PRODUCTS（左大カード＋右2×2）
   ========================================================================= */
.sc-products{ padding:var(--pad-sec) 0; background:var(--c-base); }
.sc-products__head{ margin-bottom:60px; }
.sc-products__grid{ display:grid; grid-template-columns:40% 1fr; gap:24px; align-items:stretch; }
.sc-products__right{ display:grid; grid-template-columns:repeat(2,1fr); grid-template-rows:repeat(2,1fr); gap:24px; }
/* 左：MYSAON */
.sc-pmys{ display:flex; flex-direction:column; justify-content:space-between; gap:24px; background:var(--c-dark); color:#fff;
  border:1px solid var(--c-dark); border-radius:8px; padding:40px 34px; transition:border-color .45s var(--ease),box-shadow .45s var(--ease),transform .45s var(--ease); }
.sc-pmys:hover{ border-color:var(--c-orange); box-shadow:0 0 0 1px var(--c-orange),0 30px 60px -34px rgba(232,98,26,.5); transform:translateY(-4px); }
.sc-badge{ display:inline-block; align-self:flex-start; font-family:var(--ff-en); font-size:.875rem; letter-spacing:.16em; font-weight:600;
  color:#fff; background:var(--c-orange); padding:7px 14px; border-radius:4px; }
.sc-pmys__name{ font-family:var(--ff-en); font-weight:200; font-size:clamp(2.6rem,4.4vw,3.6rem); line-height:1; letter-spacing:.04em; }
.sc-pmys__jp{ font-size:1rem; color:#cfcfcf; margin-top:8px; letter-spacing:.06em; }
.sc-pmys__catch{ font-size:1.15rem; font-weight:500; margin-top:18px; }
.sc-pmys__desc{ color:#c7c7c7; font-size:.9375rem; line-height:1.9; margin-top:12px; }
.sc-pmys__media{ aspect-ratio:16/10; border-radius:6px; margin-top:6px; background:#222; }
.sc-btn-o{ display:inline-flex; align-items:center; gap:10px; align-self:flex-start; background:var(--c-orange); color:#fff;
  font-weight:600; font-size:.9375rem; padding:14px 28px; border-radius:999px; transition:gap .3s var(--ease),background .3s; }
.sc-btn-o:hover{ background:#cf5212; gap:16px; }
/* 右：4カード共通 */
.sc-pcard{ display:flex; flex-direction:column; background:var(--c-sub); border:1px solid var(--c-sub); border-radius:8px; padding:32px 28px; transition:border-color .4s var(--ease),transform .4s var(--ease),box-shadow .4s; }
.sc-pcard__label{ font-family:var(--ff-en); font-size:.875rem; letter-spacing:.18em; text-transform:uppercase; color:var(--c-green); font-weight:600; }
.sc-pcard__label.soon{ color:var(--c-muted); }
.sc-pcard__title{ font-size:1.25rem; font-weight:600; margin:14px 0 10px; }
.sc-pcard__desc{ color:#666; font-size:.9375rem; line-height:1.85; flex:1; }
.sc-link-g{ display:inline-flex; align-items:center; gap:8px; color:var(--c-green); font-weight:600; font-size:.9375rem; margin-top:18px; transition:gap .3s var(--ease); }
.sc-link-g:hover{ gap:14px; }
.sc-pcard--about:hover{ border-color:var(--c-green); transform:translateY(-4px); box-shadow:0 24px 48px -30px rgba(46,125,50,.4); }
.sc-pcard--soon{ opacity:.6; }
.sc-link-disabled{ display:inline-flex; align-items:center; gap:8px; color:var(--c-muted); font-weight:600; font-size:.9375rem; margin-top:18px; cursor:default; }
@media (max-width:768px){
  .sc-products__grid{ grid-template-columns:1fr; }
  .sc-products__right{ grid-template-columns:repeat(2,1fr); grid-template-rows:auto; }
}
@media (max-width:480px){ .sc-products__right{ grid-template-columns:1fr; } }

/* =========================================================================
   TECHNOLOGY（ダーク）
   ========================================================================= */
.sc-tech{ background:var(--c-dark); color:#fff; padding:var(--pad-sec) 0; }
.sc-tech__head{ margin-bottom:60px; }
.sc-tech__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.sc-tcard{ border:1px solid var(--c-line-d); border-radius:8px; padding:34px 26px; border-left:3px solid var(--c-line-d);
  transition:border-left-color .4s var(--ease),background .4s var(--ease),transform .4s; }
.sc-tcard:hover{ border-left-color:var(--c-green); background:rgba(46,125,50,.1); transform:translateY(-4px); }
.sc-tcard__no{ font-family:var(--ff-en); font-weight:200; font-size:2.4rem; line-height:1; color:var(--c-green); }
.sc-tcard__title{ font-size:1.1rem; font-weight:600; margin:16px 0 12px; line-height:1.5; }
.sc-tcard__desc{ color:#bdbdbd; font-size:.9375rem; line-height:1.85; }
.sc-tcard__pro{ margin-top:16px; font-size:.875rem; color:var(--c-orange); letter-spacing:.04em; }
@media (max-width:1024px){ .sc-tech__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .sc-tech__grid{ grid-template-columns:1fr; } }

/* =========================================================================
   FAQ
   ========================================================================= */
.sc-faq{ background:var(--c-base); padding:var(--pad-sec) 0; }
.sc-faq__head{ margin-bottom:40px; }
.sc-faq__list{ max-width:860px; }
.sc-faq-item{ border-bottom:1px solid var(--c-line); }
.sc-faq-item__q{ list-style:none; cursor:pointer; padding:24px 48px 24px 0; position:relative; font-weight:600; font-size:1.05rem; }
.sc-faq-item__q::-webkit-details-marker{ display:none; }
.sc-faq-item__q::after{ content:""; position:absolute; right:6px; top:30px; width:10px; height:10px; border-right:2px solid var(--c-green); border-bottom:2px solid var(--c-green); transform:rotate(45deg); transition:transform .35s var(--ease); }
.sc-faq-item[open] .sc-faq-item__q::after{ transform:rotate(-135deg); }
.sc-faq-item__a{ padding:0 0 24px; color:#666; font-size:.9375rem; line-height:1.9; }

/* =========================================================================
   CTA
   ========================================================================= */
.sc-cta{ background:var(--c-sub); padding:clamp(80px,11vw,130px) 0; text-align:center; }
.sc-cta__title{ font-weight:300; font-size:clamp(1.6rem,3.6vw,2.5rem); line-height:1.5; margin:6px 0 20px; }
.sc-cta__sub{ color:#666; font-size:1rem; line-height:1.9; max-width:640px; margin:0 auto 36px; }
.sc-btn-g{ display:inline-flex; align-items:center; gap:12px; background:var(--c-green); color:#fff; font-weight:600; font-size:1.02rem; padding:18px 46px; border-radius:999px; transition:background .35s var(--ease),gap .3s; }
.sc-btn-g:hover{ background:var(--c-green-d); gap:18px; }
/* 2026-06-17 法人導線：CTA2ボタン横並び＋ネイビーボタン＋ナビ active */
.sc-cta__btns{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.sc-btn-n{ display:inline-flex; align-items:center; gap:12px; background:#1A3A5C; font-weight:600; font-size:1.02rem; padding:18px 46px; border-radius:999px; transition:background .35s var(--ease),gap .3s; }
.sc .sc-btn-n{ color:#fff; }
.sc-btn-n:hover{ background:#0D2440; gap:18px; }
.sc-gnav a.is-active{ color:var(--c-orange); font-weight:600; }
.sc-gnav a.is-active::after{ width:100%; }

/* =========================================================================
   FOOTER
   ========================================================================= */
.sc-footer{ background:#0A0A0A; color:#fff; padding:40px 0; }
.sc-footer__row{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.sc-footer__logo{ font-family:var(--ff-en); font-weight:600; letter-spacing:.22em; color:#fff; }
.sc-footer__nav{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.sc-footer__nav a{ color:#fff; font-size:.9375rem; opacity:.85; transition:opacity .3s; padding:0 4px; }
.sc-footer__nav a:hover{ opacity:1; color:var(--c-orange); }
.sc-footer__nav .sep{ color:#444; }
.sc-footer__cr{ color:#888; font-family:var(--ff-en); font-size:.875rem; letter-spacing:.06em; }
@media (max-width:768px){ .sc-footer__row{ flex-direction:column; text-align:center; gap:18px; } }

@media (max-width:768px){ :root{ --pad-sec:clamp(70px,15vw,104px); } .sc__inner{ width:min(100% - 36px,var(--maxw)); } }

/* ===== 2026-06-15 修正：Hero背景画像／暖の強調／下向きスクロール／ロゴ画像／トップへ戻る ===== */
.sc-hero__bg{ position:absolute; inset:0; z-index:0; }
.sc-hero__bg img{ width:100%; height:100%; object-fit:cover; opacity:.45; }
.sc-hero__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(95deg, rgb(255 255 255) 0%, rgb(255 255 255 / 0%) 40%, rgb(255 255 255 / 0%) 100%); }
.sc-hero__grid{ position:relative; z-index:1; }
.sc-hero__scroll{ z-index:2; flex-direction:column; align-items:center; gap:10px; }
.sc-hero__catch .em{ display:inline-block; color:var(--c-orange); font-weight:700; font-size:2em; line-height:.9; vertical-align:-.12em; margin:0 .04em; }
.sc-hero__scroll .bar{ width:1px; height:56px; }
.sc-hero__scroll .bar::after{ top:-40%; left:0; width:100%; height:40%; animation:scScrollDown 2s var(--ease) infinite; }
@keyframes scScrollDown{ 0%{ top:-45% } 100%{ top:100% } }
.sc-hero__chev{ color:var(--c-green); font-size:.875rem; animation:scChev 2s var(--ease) infinite; }
@keyframes scChev{ 0%,100%{ transform:translateY(0); opacity:.5 } 50%{ transform:translateY(4px); opacity:1 } }
.sc-logo img{ height:60px; width:auto; display:block; }
@media (max-width:768px){ .sc-logo img{ height:34px; } }
.to-top{ position:fixed; right:24px; bottom:24px; z-index:55; width:48px; height:48px; border-radius:50%; cursor:pointer; background:#fff; color:#9a9ab6; border:1px solid #d6d6e2; font-size:1.05rem; display:grid; place-items:center; opacity:0; visibility:hidden; transform:translateY(12px); transition:opacity .35s var(--ease),transform .35s var(--ease),background .3s,color .3s,border-color .3s,box-shadow .3s; box-shadow:0 8px 22px -10px rgba(0,0,0,.25); }
.to-top.is-show{ opacity:1; visibility:visible; transform:none; }
.to-top:hover{ background:var(--c-green); color:#fff; border-color:var(--c-green); transform:translateY(-3px); box-shadow:0 14px 28px -10px rgba(46,125,50,.45); }
@media (max-width:768px){ .to-top{ right:16px; bottom:16px; width:44px; height:44px; } }

/* ===== 2026-06-15(2) suwa-christy：製品セクション再構成／techホバー高速化／ボタン文字白／CONTACT中央・SP左 ===== */
.sc-pmys__lead{ font-size:1.4rem; font-weight:600; line-height:1.5; }
.sc-pmys__txt{ color:#c7c7c7; font-size:.9375rem; line-height:1.9; margin-top:14px; }
.sc-pmys__illust{ flex:1; min-height:180px; border-radius:6px; margin-top:24px; background:#1f1f1f; }
.sc-pmys__illust.is-empty::after{ background:repeating-linear-gradient(45deg,#262626 0 14px,#1f1f1f 14px 28px); color:#555; }
.sc-products__right{ grid-template-rows:1fr; }
.sc-link-o{ display:inline-flex; align-items:center; gap:8px; color:var(--c-orange); font-weight:600; font-size:.9375rem; margin-top:18px; transition:gap .3s var(--ease); }
.sc-link-o:hover{ gap:14px; }
.sc-pcard--mysaon-link:hover{ border-color:var(--c-orange); transform:translateY(-4px); box-shadow:0 24px 48px -30px rgba(232,98,26,.4); }
.sc-tech .sc-tcard{ transition:opacity .7s var(--ease), transform .2s var(--ease), border-left-color .2s var(--ease), background .2s var(--ease); transition-delay:0s; }
.sc .sc-btn-g, .sc .sc-btn-o{ color:#fff; }
.sc-cta__sub{ max-width:560px; margin-left:auto; margin-right:auto; }
@media (max-width:768px){
  .sc-cta{ text-align:left; }
  .sc-cta__sub{ max-width:none; margin-left:0; margin-right:0; }
  .sc-cta .sc-label{ text-align:left; }
}

/* ===== 2026-06-15(3) ②カードリンク化／③CONTACT中央／④ナビ日本語＋ドロップダウン ===== */
.sc-products__right a.sc-pcard{ text-decoration:none; cursor:pointer; }
.sc-pcard:hover .sc-link-g, .sc-pcard:hover .sc-link-o{ gap:14px; }
.sc-cta .sc__inner{ display:flex; flex-direction:column; align-items:center; }
@media (max-width:768px){ .sc-cta .sc__inner{ align-items:flex-start; } }
/* 製品情報ドロップダウン（CSSのみ） */
.sc-nav-item{ position:relative; }
.sc-dd{ position:absolute; top:100%; left:0; min-width:208px; background:#FFFFFF; border:1px solid #E0E0E0; box-shadow:0 14px 30px -12px rgba(0,0,0,.28); border-radius:6px; padding:6px; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .22s var(--ease), transform .22s var(--ease), visibility .22s; z-index:70; }
.sc-nav-item:hover .sc-dd{ opacity:1; visibility:visible; transform:translateY(0); }
.sc-gnav .sc-dd__item{ display:block; padding:10px 14px; border-radius:4px; font-size:.9375rem; font-weight:600; white-space:nowrap; color:#E8621A; transition:background .2s; }
.sc-gnav .sc-dd__item::after{ display:none; }
.sc-gnav .sc-dd__item:hover{ background:#F5F5F3; }
@media (max-width:900px){
  .sc-nav-item{ display:flex; flex-direction:column; align-items:center; gap:18px; }
  .sc-dd{ position:static; opacity:1; visibility:visible; transform:none; border:none; box-shadow:none; background:transparent; padding:0; min-width:auto; }
  .sc-gnav .sc-dd__item{ font-size:1rem; padding:0; }
}

/* ===== 2026-06-15(4) ③CONTACT sub padding／④フッターロゴ画像／⑤フッター製品情報ドロップダウン ===== */
.sc-cta__sub{ padding:20px 0; }
.sc-footer__logo img{ height:48px; width:auto; display:block; }
@media (max-width:768px){ .sc-footer__logo img{ height:40px; } }
.sc-footer__nav .sc-nav-item{ position:relative; display:inline-flex; align-items:center; }
.sc-footer .sc-dd{ top:auto; bottom:100%; }
@media (max-width:900px){ .sc-footer .sc-dd{ display:block; max-height:none; overflow:visible; position:static; opacity:1; visibility:visible; transform:none; } }

/* ===== 2026-06-16 ①sc-pcardの「詳しく見る」を黒／②フッター製品情報ドロップダウンをヘッダーと同スタイルに ===== */
/* ① 製品カード（SUWAクリスティについて）の「詳しく見る」リンクを黒に */
.sc-pcard .sc-link-g{ color:var(--c-text); }
/* ② フッターのドロップダウン項目をヘッダー（白背景×オレンジ文字×hover薄グレー）に合わせる */
.sc-footer .sc-dd__item{ display:block; padding:10px 14px; border-radius:4px; font-size:.9375rem; font-weight:600; white-space:nowrap; color:#E8621A; opacity:1; transition:background .2s; }
.sc-footer .sc-dd__item:hover{ background:#F5F5F3; color:#E8621A; opacity:1; }

/* ===== 2026-06-16(2) 製品カードのdesc下に画像（ロゴ/MYSAON）／to-topシェブロン ===== */
.sc-pcard--about .sc-pcard__desc, .sc-pcard--mysaon-link .sc-pcard__desc{ flex:0 0 auto; }
.sc-pcard__media{ flex:1; display:flex; align-items:center; justify-content:center; margin:16px 0 4px; min-height:120px; }
.sc-pcard__media img{ max-width:100%; max-height:200px; width:auto; object-fit:contain; }
.sc-pcard--about .sc-pcard__media img{ max-height:170px; }

/* ===== 2026-06-16(3) ヘッダー/フッターに電話ボタン ===== */
.sc-header{ gap:18px; }
.sc-logo{ margin-right:auto; }
.sc .site-tel{ display:inline-flex; align-items:center; gap:8px; background:var(--c-orange); color:#fff; font-weight:700; font-size:.95rem; letter-spacing:.02em; padding:9px 18px; border-radius:999px; white-space:nowrap; transition:background .3s var(--ease), transform .3s var(--ease); }
.sc .site-tel:hover{ background:#cf5212; color:#fff; transform:translateY(-2px); }
.sc .site-tel i{ font-size:.9em; }
.sc-footer__brand{ display:inline-flex; align-items:center; gap:16px; flex-wrap:wrap; }
@media (max-width:768px){ .sc .site-tel{ font-size:.85rem; padding:8px 14px; } }

/* ===== 2026-06-16(4) スマホ：ハンバーガー修正/電話をメニュー内/ロゴ拡大/ヒーロー全画面・重なり解消 ===== */
/* ロゴが flex で潰れて比率が崩れるのを防止 */
.sc-logo, .sc-footer__logo{ flex-shrink:0; }
.sc-logo img, .sc-footer__logo img{ max-width:none; }
/* メニュー内の電話ボタン（既定=PCは非表示／.sc .site-tel より高詳細度で確実に隠す） */
.sc .sc-gnav__tel{ display:none; }
@media (max-width:900px){
  /* is-stuck の backdrop-filter が position:fixed のオーバーレイの基準を壊し、スクロール後にメニューが崩れるため無効化 */
  .sc-header.is-stuck{ backdrop-filter:none; -webkit-backdrop-filter:none; }
  /* ヘッダー右の電話ピルはメニュー内へ移すので隠す */
  .sc-header > .site-tel{ display:none; }
  /* ハンバーガーメニュー内に電話ボタンを表示 */
  .sc .sc-gnav__tel{ display:inline-flex; margin-top:8px; }
}
/* スマホ：ロゴを少し大きく */
@media (max-width:768px){ .sc-logo img{ height:42px; } }
/* ヒーロー：スマホは全画面に収め、テキストとScrollの重なりを解消 */
@media (max-width:900px){
  .sc-hero{ min-height:100svh; padding:88px 0 72px; }
  .sc-hero__grid{ gap:24px; }
  .sc-hero__visual{ max-width:250px; margin:auto; }
}
@media (max-width:768px){
  .sc-hero__scroll{ left:50%; right:auto; transform:translateX(-50%); bottom:12px; gap:6px; }
  .sc-hero__scroll span{ display:none; }
  .sc-hero__scroll .bar{ height:26px; }
}

/* ===========================================================================
   2026-06-16(5) スマホ専用：ロゴ70px+小電話 / ハンバーガー刷新（緑・左寄せ・ロゴ上・会社情報下・製品情報アコーディオン）/ ホバー色を既定化 / フッターにMYSAON
   （すべて @media 内・PCには影響させない）
   =========================================================================== */
/* C1: ヘッダーロゴ 70px */
@media (max-width:768px){ .sc-logo img{ height:70px; } }
/* C2: ロゴの右に小さめ電話（pillをやめてシンプルなテキストに）/ バーガー右端 */
@media (max-width:900px){
  .sc-logo{ order:0; margin-right:12px; }
  .sc-header > .site-tel{ display:inline-flex; order:1; background:none; color:#555; padding:2px 4px; font-size:.76rem; font-weight:600; }
  .sc-header > .site-tel:hover{ background:none; color:var(--c-green); transform:none; }
  .sc-header > .site-tel i{ color:var(--c-green); }
  .sc-burger{ order:2; margin-left:auto; }
}
/* B4: PCホバーで枠線/色が変わる箇所を、スマホは最初から着色 */
@media (max-width:900px){
  .sc-pmys{ border-color:var(--c-orange); }
  .sc-pcard--about{ border-color:var(--c-green); }
  .sc-pcard--mysaon-link{ border-color:var(--c-orange); }
  .sc-tcard{ border-left-color:var(--c-green); background:rgba(46,125,50,.10); }
}
/* C3 / D1: ハンバーガーメニュー刷新 */
.sc-gnav__head, .sc-gnav__foot{ display:none; }
@media (max-width:900px){
  .sc-gnav{ justify-content:flex-start; align-items:stretch; gap:0; background:#2E7D32; padding:80px 26px 32px; overflow-y:auto; }
  .sc-gnav__head{ display:block; margin-bottom:12px; }
  .sc-gnav__head img{ height:54px; width:auto; display:block; }
  /* リスト項目（左寄せ・区切り線・白文字） */
  .sc-gnav > a:not(.sc-gnav__tel), .sc-nav-item > a{ display:block; width:100%; text-align:left; color:#fff; font-size:1.05rem; font-weight:600; padding:16px 2px; border-bottom:1px solid rgba(255,255,255,.28); letter-spacing:.04em; }
  .sc-gnav a::after{ left:auto; bottom:auto; background:none; width:auto; height:auto; } /* 下線アニメ無効化 */
  .sc-nav-item{ display:block; gap:0; border-bottom:1px solid rgba(255,255,255,.28); position:relative; }
  .sc-nav-item > a{ border-bottom:none; }
  /* 製品情報アコーディオン（既定は閉） */
  .sc-nav-item > a::after{ content:""; display:block; position:absolute; right:6px; top:24px; width:9px; height:9px; left:auto; bottom:auto; background:none; border-right:2px solid rgba(255,255,255,.85); border-bottom:2px solid rgba(255,255,255,.85); transform:rotate(45deg); transition:transform .3s var(--ease); }
  .sc-nav-item.is-open > a::after{ transform:rotate(-135deg); }
  .sc-dd{ position:static; opacity:1; visibility:visible; transform:none; border:none; box-shadow:none; background:transparent; padding:0; margin:0; min-width:0; max-height:0; overflow:hidden; transition:max-height .35s var(--ease); }
  .sc-nav-item.is-open .sc-dd{ max-height:320px; }
  .sc-gnav .sc-dd__item{ display:block; color:#fff; font-size:.98rem; font-weight:500; padding:12px 2px 12px 16px; }
  .sc-gnav .sc-dd__item:hover{ background:transparent; }
  /* メニュー内 電話（白pill・緑文字） */
  .sc-gnav .sc-gnav__tel{ display:inline-flex; align-self:flex-start; margin-top:18px; background:#fff; color:var(--c-green); }
  .sc-gnav .sc-gnav__tel:hover{ background:#fff; color:var(--c-green); transform:none; }
  /* 会社情報（下部） */
  .sc-gnav__foot{ display:block; margin-top:22px; color:rgba(255,255,255,.92); font-size:.85rem; line-height:1.8; }
  .sc-gnav__foot a{ color:#fff; font-weight:600; }
  .sc-gnav__foot small{ display:block; margin-top:8px; color:rgba(255,255,255,.7); font-size:.78rem; }
}
/* D2: フッターの製品情報ドロップダウン（MYSAONリンク）をスマホでは展開表示 */
@media (max-width:900px){
  .sc-footer .sc-dd{ display:block; position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; background:transparent; padding:0; margin-top:4px; }
  .sc-footer .sc-dd__item{ color:#fff; opacity:.85; padding:4px 0; }
}

/* ===== 2026-06-16(6) スマホ：メニュー白背景＋オレンジ統一・電話1rem・ロゴ55px・フッター製品情報を常時展開 ===== */
@media (max-width:900px){
  /* ヘッダー電話 1rem・アイコン橙 */
  .sc-header > .site-tel{ font-size:1rem; }
  .sc-header > .site-tel i{ color:var(--c-orange); }
  /* メニュー：白背景・濃色テキスト・オレンジ差し色 */
  .sc-gnav{ background:#fff; }
  .sc-gnav > a:not(.sc-gnav__tel), .sc-nav-item > a{ color:#1A1A1A; border-bottom-color:#E4E4E0; }
  .sc-nav-item{ border-bottom-color:#E4E4E0; }
  .sc-nav-item > a::after{ border-right-color:var(--c-orange); border-bottom-color:var(--c-orange); }
  .sc-gnav .sc-dd__item{ color:#333; position:relative; padding-left:24px; }
  .sc-gnav .sc-dd__item::before{ content:""; position:absolute; left:6px; top:50%; transform:translateY(-50%); width:8px; height:8px; border-radius:50%; background:var(--c-orange); }
  .sc-gnav .sc-gnav__tel{ background:var(--c-orange); color:#fff; }
  .sc-gnav .sc-gnav__tel:hover{ background:#cf5212; color:#fff; }
  .sc-gnav__foot{ color:#666; }
  .sc-gnav__foot a{ color:var(--c-orange); }
  .sc-gnav__foot small{ color:#999; }
  /* フッター：縦並び＋製品情報の下に商品名を常時表示（オレンジ印） */
  .sc-footer__nav{ flex-direction:column; align-items:center; gap:8px; }
  .sc-footer__nav .sep{ display:none; }
  .sc-footer__nav .sc-nav-item{ display:flex; flex-direction:column; align-items:center; }
  .sc-footer .sc-dd__item{ position:relative; padding-left:16px; }
  .sc-footer .sc-dd__item::before{ content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:7px; height:7px; border-radius:50%; background:var(--c-orange); }
}
@media (max-width:768px){ .sc-logo img{ height:55px; } }

/* ===== 2026-06-16(7) スマホ：製品情報シェブロン不具合修正＋フッター製品情報を白文字に ===== */
@media (max-width:900px){
  /* 下線アニメ::afterを無効化（タップ後hoverで斜めの長い線が出る不具合対策） */
  .sc-gnav a::after{ content:none; }
  /* 製品情報のシェブロンを明示再定義（hoverより後勝ち・固定サイズ） */
  .sc-gnav .sc-nav-item > a::after{ content:""; position:absolute; right:8px; top:22px; left:auto; bottom:auto; width:9px; height:9px; border:0; border-right:2px solid var(--c-orange); border-bottom:2px solid var(--c-orange); background:none; transform:rotate(45deg); transition:transform .3s var(--ease); }
  .sc-gnav .sc-nav-item.is-open > a::after{ transform:rotate(-135deg); }
  /* フッター：製品情報は黒背景なので白文字・ヘッダー用の装飾を打ち消し */
  .sc-footer .sc-nav-item > a, .sc-footer__nav a{ color:#fff; }
  .sc-footer .sc-nav-item > a{ padding:0; border-bottom:none; }
  .sc-footer .sc-nav-item > a::after{ content:none; }
}
/* フッターの「製品情報」はリンクではなくラベル（PC/SP共通・白文字） */
.sc-footer__nav .sc-foot-cat{ display:inline-block; color:#fff; font-size:.9375rem; opacity:.85; padding:0 4px; }

/* ===== 後勝ち最終上書き：フッターの製品情報を常時表示 ===== */
@media (max-width:900px){
  .sc-footer .sc-dd{ display:block; position:static; opacity:1; visibility:visible; transform:none; }
  .sc-footer .sc-dd__item{ color:#fff; }
}
/* スマホ：.sc-nav-item の gap を 0 に */
@media (max-width:900px){ .sc-nav-item{ gap:0; } }

/* ===== 2026-06-16 ヒーロー文言刷新（緑タグライン＋日本語H1）＋中央ロゴふわふわ ===== */
.sc-hero__eyebrow{ font-family:var(--ff-en); color:var(--c-green); font-weight:700; font-size:clamp(1.5rem,3.6vw,2.4rem); letter-spacing:.01em; line-height:1.4; }
/* サブコピーは原文どおり（小文字は小文字に） */
.sc-hero__sub{ text-transform:none; }
.sc-hero__title{ font-family:var(--ff-jp); font-weight:500; font-size:clamp(1.9rem,5vw,3.4rem); line-height:1.5; letter-spacing:.05em; text-transform:none; color:var(--c-text); }
.sc-hero__title .em{ display:inline-block; color:var(--c-orange); font-weight:700; font-size:1.9em; line-height:.9; vertical-align:-.14em; margin:0 .04em; }
.sc-hero__visual{ position:relative; }
.sc-hero__logo-float{ position:absolute; top:50%; left:50%; width:38%; max-width:170px; height:auto; transform:translate(-50%,-50%); animation:scFloat 4.5s ease-in-out infinite; }
@keyframes scFloat{ 0%,100%{ transform:translate(-50%,-50%) translateY(0); } 50%{ transform:translate(-50%,-50%) translateY(-12px); } }
@media (prefers-reduced-motion:reduce){ .sc-hero__logo-float{ animation:none; } }

/* ===== 2026-06-16 sc-stat__txt 強調＋製品ラインアップ3カードの下端を揃える ===== */
.sc-stat__txt{ font-size:1.2rem; font-weight:600; }
.sc-pmys{ height:100%; }
.sc-products__right{ height:100%; }
.sc-products__right > .sc-pcard{ height:100%; }

/* ===== 2026-06-18 PC nav spacing/divider(E-1), contact button(E-4), footer logo 80px(E-2) ===== */
@media (min-width:769px){
  .sc-gnav{ gap:0; }
  .sc-gnav > a:not(.site-tel):not(.sc-gnav__tel):not(.sc-nav-cta),
  .sc-gnav > .sc-nav-item{ padding:0 20px; border-right:1px solid #E0E0E0; }
  .sc-gnav a.sc-nav-cta{ margin-left:18px; padding:9px 22px; border:1px solid #E8621A; border-radius:999px; color:#E8621A; font-weight:600; transition:all .3s var(--ease); }
  .sc-gnav a.sc-nav-cta::after{ display:none; }
  .sc-gnav a.sc-nav-cta:hover{ background:#E8621A; color:#fff; }
  .sc-header.is-stuck .sc-gnav a.sc-nav-cta{ color:#E8621A; }
  .sc-header.is-stuck .sc-gnav a.sc-nav-cta:hover{ color:#fff; }
  .sc-footer__logo img{ height:80px; }
}
/* F-2: PC scroll arrow centered on bar */
@media (min-width:769px){
  .sc-hero__scroll .bar::after{ left:50%; transform:translateX(-50%); }
}