:root{
    --navy-900:#0F2438;
    --navy-700:#1C3A57;
    --cyan-500:#2FB6C4;
    --cyan-100:#E3F6F8;
    --cream:#F7F5F1;
    --ink:#24313D;
    --muted:#64707A;
    --white:#FFFFFF;
    --radius:10px;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  body{
    font-family:'Noto Sans JP',sans-serif;
    color:var(--ink);
    background:var(--white);
    line-height:1.8;
    -webkit-font-smoothing:antialiased;
  }
  h2,h3{font-family:'Zen Kaku Gothic New',sans-serif;color:var(--navy-900);}
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1040px;margin:0 auto;padding:0 24px;}

  /* ===== Header ===== */
  .top-bar{background:var(--navy-900);color:#cfe3ea;font-size:13px;}
  .top-bar .wrap{display:flex;justify-content:space-between;align-items:center;padding:6px 24px;flex-wrap:wrap;gap:6px;}
  .top-bar a{opacity:.9;}
  header.site{border-bottom:1px solid #e7e3da;padding:14px 0;}
  .site-header-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
  .logo img{height:44px;}
  .tagline{font-size:12px;color:var(--muted);line-height:1.5;}
  .contact-line{font-size:14px;font-weight:700;color:var(--navy-900);}
  nav.main-nav{background:var(--cream);border-bottom:1px solid #e7e3da;}
  nav.main-nav ul{display:flex;gap:28px;list-style:none;padding:10px 24px;max-width:1040px;margin:0 auto;font-size:14px;flex-wrap:wrap;}
  nav.main-nav a:hover{color:var(--cyan-500);}
  .breadcrumb{font-size:12px;color:var(--muted);padding:14px 0;}
  .breadcrumb a{color:var(--cyan-500);}

  /* ===== Hero ===== */
  .hero{background:linear-gradient(135deg,var(--navy-900) 0%,var(--navy-700) 60%,#134a56 100%);color:#fff;padding:56px 0 64px;}
  .hero-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:40px;align-items:center;}
  .eyebrow{display:inline-block;font-size:12px;letter-spacing:.08em;color:var(--cyan-500);background:rgba(47,182,196,.12);border:1px solid rgba(47,182,196,.35);padding:5px 12px;border-radius:99px;margin-bottom:16px;}
  .hero h1{font-size:34px;line-height:1.35;font-weight:900;margin-bottom:14px;color:#fff;}
  .hero p.lead{font-size:15px;color:#c6d6de;max-width:44ch;margin-bottom:26px;}
  .cta-row{display:flex;gap:12px;flex-wrap:wrap;}
  .btn{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border-radius:8px;font-weight:700;font-size:15px;}
  .btn-primary{background:var(--cyan-500);color:var(--navy-900);}
  .btn-primary:hover{background:#3fcadb;}
  .btn-ghost{border:1px solid rgba(255,255,255,.4);color:#fff;}
  .btn-ghost:hover{border-color:var(--cyan-500);}
  .hero-photo{background:#fff;border-radius:8px;padding:8px;box-shadow:0 30px 60px rgba(0,0,0,.35);}
  .hero-photo img{border-radius:8px;}
  .hero-photo .cap{font-size:12px;color:var(--muted);text-align:center;padding-top:8px;}

  /* ===== Section shell ===== */
  section{padding:64px 0;}
  section.alt{background:var(--cream);}
  .section-head{max-width:640px;margin:0 auto 40px;text-align:center;}
  .section-head h2{font-size:26px;font-weight:700;margin-bottom:10px;}
  .section-head p{color:var(--muted);font-size:14px;}

  /* ===== Plate intro ===== */
  .plate-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;}
  .plate-grid img{border-radius:12px;border:1px solid #e7e3da;}
  .plate-copy p{margin-bottom:14px;font-size:15px;}
  .peltier-box{margin-top:20px;background:var(--cyan-100);border-left:4px solid var(--cyan-500);padding:16px 18px;border-radius:6px;font-size:14px;color:var(--navy-700);}

  /* ===== Layered cooling diagram (signature element) ===== */
  .rings-wrap{display:grid;grid-template-columns:340px 1fr;gap:48px;align-items:center;}
  .rings svg{width:100%;height:auto;}
  .effect-list{display:flex;flex-direction:column;gap:20px;}
  .effect{display:flex;gap:16px;align-items:flex-start;padding:18px;border-radius:10px;background:var(--white);border:1px solid #e7e3da;}
  .effect .num{font-family:'JetBrains Mono',monospace;font-weight:600;color:var(--cyan-500);font-size:13px;padding-top:2px;}
  .effect h3{font-size:16px;margin-bottom:6px;}
  .effect p{font-size:13.5px;color:var(--muted);}

  /* ===== Spec table ===== */
  .spec-flex{align-items:start;}
  .spec-flex img{border-radius:10px;border:1px solid #e7e3da;max-width:500px;}
  table.spec{width:100%;border-collapse:collapse;font-size:14px;}
  table.spec th,table.spec td{text-align:left;padding:12px 14px;border-bottom:1px solid #e7e3da;}
  table.spec th{width:38%;color:var(--muted);font-weight:500;background:var(--cream);}
  .note-fill{font-size:12px;color:var(--muted);margin-top:10px;}

  /* ===== Price ===== */
  .price-card{background:var(--navy-900);color:#fff;border-radius:14px;padding:36px;display:grid;grid-template-columns:1.3fr 0.7fr;gap:30px;align-items:center;}
  .price-card table{width:100%;border-collapse:collapse;font-size:14px;color:#dbe6ea;}
  .price-card th,.price-card td{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.15);text-align:left;}
  .price-num{font-family:'JetBrains Mono',monospace;font-size:34px;font-weight:600;color:var(--cyan-500);}
  .price-side{text-align:center;background:rgba(255,255,255,.06);border-radius:10px;padding:22px;}
  .price-note{font-size:12px;color:#a9bac3;margin-top:16px;line-height:1.7;}

  /* ===== Order ===== */
  .order-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
  .order-card{border:1px solid #e7e3da;border-radius:12px;padding:24px;text-align:center;}
  .order-card img.icon{height:40px;margin:0 auto 12px;}
  .order-card h3{font-size:15px;margin-bottom:8px;}
  .order-card a.btn{margin-top:10px;}

  /* ===== Chat-style testimonial ===== */
  .chat-wrap{display:flex;flex-direction:column;gap:18px;max-width:640px;margin:0 auto;}
  .chat-row{display:flex;gap:12px;align-items:flex-end;}
  .avatar{width:82px;height:82px;border-radius:50%;background:var(--navy-700);flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;}
  .avatar img{width:100%;height:100%;object-fit:cover;}
  .avatar svg{width:28px;height:28px;}
  .bubble-col{display:flex;flex-direction:column;gap:4px;}
  .bubble-name{font-size:12px;color:var(--muted);padding-left:4px;}
  .bubble{position:relative;background:var(--white);border:1px solid #e7e3da;border-radius:4px 16px 16px 16px;padding:16px 18px;font-size:14.5px;color:var(--ink);max-width:440px;box-shadow:0 2px 6px rgba(15,36,56,.05);}
  .bubble.accent{background:var(--cyan-100);border-color:#bfe6ea;}

  /* ===== Sticky mobile CTA ===== */
  .sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;background:var(--navy-900);padding:12px 16px;z-index:50;box-shadow:0 -6px 20px rgba(0,0,0,.25);}
  .sticky-cta a{display:block;text-align:center;background:var(--cyan-500);color:var(--navy-900);font-weight:700;padding:12px;border-radius:8px;font-size:14px;}

  /* ===== Footer ===== */
  footer{background:var(--navy-900);color:#c6d6de;padding:48px 0 24px;font-size:13px;}
  .foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px;margin-bottom:32px;}
  footer h4{color:#fff;font-size:14px;margin-bottom:14px;}
  footer ul{list-style:none;display:flex;flex-direction:column;gap:8px;}
  footer a:hover{color:var(--cyan-500);}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;font-size:12px;color:#8ea0aa;text-align:center;}

  @media (max-width:820px){
    .hero-grid,.plate-grid,.rings-wrap,.spec-flex,.price-card,.order-grid,.foot-grid{grid-template-columns:1fr;}
    .hero{padding:40px 0 48px;}
    .hero h1{font-size:26px;}
    section{padding:44px 0;}
    .sticky-cta{display:block;}
    body{padding-bottom:70px;}
    .price-side{order:-1;}
      }
  @media (min-width:820px){    
      .spec-flex01{
	display: flex;
    align-items: flex-end;
    justify-content: space-around;
}
}
  /* ===== Lightbox ===== */
  .zoomable{cursor:zoom-in;position:relative;}
  .zoomable::after{content:"🔍 クリックで拡大";position:absolute;bottom:8px;right:8px;background:rgba(15,36,56,.75);color:#fff;font-size:11px;padding:4px 8px;border-radius:6px;}
  .lightbox-overlay{display:none;position:fixed;inset:0;background:rgba(15,36,56,.85);z-index:100;align-items:center;justify-content:center;padding:24px;cursor:zoom-out;}
  .lightbox-overlay.open{display:flex;}
  .lightbox-overlay img{max-width:min(900px,92vw);max-height:90vh;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5);}
  .lightbox-close{position:absolute;top:20px;right:28px;color:#fff;font-size:32px;line-height:1;cursor:pointer;}
.lightbox-overlay{overflow:auto;}
.lightbox-overlay img{transition:transform .25s ease;cursor:zoom-in;}
.lightbox-overlay img.zoomed{transform:scale(1.4);cursor:zoom-out;max-width:none;max-height:none;width:auto;}