:root{
  --c-header:#162446;
  --c-footer:#273445;
  --c-text:#222;
  --c-muted:#666;
  --c-border:#e6e8ef;
  --c-btn-from:#0A1833;
  --c-btn-to:#1C3B70;
  --container-w:1280px; /* 1280px以上は固定幅 */
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;color:var(--c-text);
  font-family:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  line-height:1.8;background:#fff
}
img{display:block;max-width:100%}

/* コンテナ（1280px以上は固定） */
.container{width:min(var(--container-w),100%);margin-inline:auto;padding-inline:24px}

/* ---------------- Header ---------------- */
.site-header{position:sticky;top:0;z-index:1000;background:var(--c-header);backdrop-filter:saturate(120%) blur(4px);color:#fff}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.logo-mark{width:36px;height:36px;border-radius:8px;background:linear-gradient(180deg,#6fa7ff,#3755aa)}
.logo-text{font-size:12px;line-height:1.1;letter-spacing:.4px}
.gnav ul{display:flex;gap:20px;list-style:none;margin:0;padding:0}
.gnav a{color:#fff;text-decoration:none;font-size:13px;letter-spacing:.2px;padding:8px 4px;display:inline-block}
.gnav a:hover{opacity:.85}

/* Hamburger */
.hamburger{display:none;width:40px;height:40px;border:none;background:transparent;cursor:pointer}
.hamburger span{display:block;width:24px;height:2px;background:#fff;margin:6px auto;transition:transform .2s,opacity .2s}
.hamburger.is-active span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.hamburger.is-active span:nth-child(2){opacity:0}
.hamburger.is-active span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* SP Drawer */
.spnav{display:none;background:var(--c-header)}
.spnav.is-open{display:block}
.spnav ul{list-style:none;margin:0;padding:8px 24px 24px}
.spnav a{color:#fff;text-decoration:none;display:block;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.no-scroll{overflow:hidden}

/* ---------------- Hero ---------------- */
.hero{
  position:relative;color:#fff;
  background-image:url('assets/img/hero_pc.jpg');
  background-size:cover;background-position:center;
  padding:100px 0 40px;isolation:isolate
}
.hero::before{content:"";position:absolute;inset:0;z-index:-1}
.hero-title{
  font-weight:700;font-size:42px;line-height:1.35;letter-spacing:.04em;margin:0 0 16px;
  text-shadow:0 2px 10px rgba(28,59,112,.30);
  text-shadow: #000000 1px 0px 10px;
  
}
.hero-lead{max-width:760px;margin:0 0 80px;color:#fff;font-size:15px;  text-shadow: #000000 1px 0 10px;}

/* ---------------- Button（固定 212×50） ---------------- */
.btn{
  display:block;width:212px;height:50px;line-height:50px;margin:20px auto 0;text-align:center;border-radius:0;
  color:#fff;text-decoration:none;font-weight:600;font-size:16px;letter-spacing:.04em;
  background:linear-gradient(180deg,var(--c-btn-from),var(--c-btn-to));box-shadow:0 8px 16px rgba(10,24,51,.25);
  transition: transform .6s, filter .6s, background .1s ease, font-size .15s ease;
}
.btn:hover,
.btn:focus-visible{
  background: linear-gradient(180deg, var(--c-btn-to), var(--c-btn-from)); /* 反転 */
  font-size: 17px; /* 現在16px → +1px */
}
.btn:active{transform:translateY(1px)}
.btn--sm{width:212px;height:50px;line-height:50px;margin:20px auto 0}
.btn.btn--sm:hover,
.btn.btn--sm:focus-visible{
  font-size: 17px;
}
/* ---------------- News ---------------- */
.section-title{text-align:center;font-weight: 400;letter-spacing:.1em;font-size:24px;color:#02082A;margin:40px 0 20px}
/*.news{padding:28px 0 10px}*/
.news-list{list-style:none;padding:0;margin:0 auto 24px;max-width:880px;border-top:1px solid var(--c-border)}
.news-list li{display:grid;grid-template-columns:120px 1fr;align-items:center;gap: 16px;padding:14px 8px;border-bottom:1px solid var(--c-border)}
.news-list time{color:var(--c-muted);font-size:14px}
.news-list a{color: #222;text-decoration:none; font-size:14px;}
.news-list a:hover{text-decoration:underline}

/* ---------------- Feature ---------------- */
.feature{padding:64px 0}
.feature-inner{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.feature-image img{width:100%;height:420px!important;object-fit:cover;border-radius:0}
.feature-body{max-width:560px;margin:0 auto;text-align:left;padding:20px 0}
.feature-title{
  font-family: 'Inter';
  font-size: 32px;
  line-height: 1.35;
  letter-spacing: 0.06em;
  margin: 0 0 12px;
  color:#02082A;
  text-shadow: 0 2px 10px rgba(28,59,112,0.20);
  overflow-wrap:anywhere;
  word-break:break-word;
  hyphens:auto;
  text-align: center;
  font-weight: 400;
}
.feature-desc{color:#333;margin:0 0 24px;font-size:14px;line-height:1.9}

/* 右画像版（PCはテキスト→画像） */
.feature--image-right .feature-inner{grid-template-columns:1fr 1fr}
.feature--image-right .feature-inner>.feature-body{order:1}
.feature--image-right .feature-inner>.feature-image{order:2}

/* ---------------- CTA ---------------- */
.cta{padding:56px 0 80px;background:#f7f9ff}
.cta-inner{text-align:center}
.cta-text{margin:0 0 20px;font-size:14px;padding: 10px;}

/* ============== Footer ============== */
.site-footer{background:#273445;color:#cfd6e6}
.site-footer .footer-logo{display:block}

/* PC ≥769px：brand | center | right */
@media (min-width:769px){
  .site-footer .footer-inner{
    display:grid;grid-template-columns:260px 560px 240px;grid-template-areas:"brand center right";
    align-items:start;gap:80px;width:min(var(--container-w),100%);margin-inline:auto;padding:40px 24px 12px
  }
  .site-footer .footer-brand{grid-area:brand;display:flex;align-items:center;gap:12px}
  .site-footer .footer-brand .footer-logo{height: 50px;width:auto}

  .site-footer .footer-nav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
  .site-footer .footer-nav--center{grid-area:center}
  .site-footer .footer-nav--right{grid-area:right}

  .site-footer .footer-nav a{
    color:#FFFFFF;
    text-decoration:none;
    font:700 14px/1.6 'Inter',system-ui,sans-serif;
    letter-spacing:.02em;
    /* text-transform:uppercase; */
  }
  .site-footer .footer-nav a:hover{text-decoration:underline}

  .site-footer .footer-copy{
    width:min(var(--container-w),100%);margin:22px auto 0;padding:14px 24px 0;
    border-top:1px solid rgba(255,255,255,.36);text-align:center;font-size:12px;color:#cdd5e6
  }
}

/* SP ≤768px：縦積み */
@media (max-width:768px){
  .gnav{display:none}
  .hamburger{display:inline-block}

  .hero{padding:84px 0 100px}
  .hero-title{font-size:30px;text-shadow:0 2px 8px rgba(28,59,112,.25)}
  .hero-lead{font-size:14px}

  .news-list{max-width:100%}
  .news-list li{grid-template-columns:100px 1fr}

  .feature{padding:48px 0}
  .feature-inner{grid-template-columns:1fr;gap:28px}
  .feature-inner>.feature-image{order:1!important}
  .feature-inner>.feature-body{order:2!important}
  .feature-image img{height:420px!important}
  .feature-body{max-width:none;padding:12px 0}
  .feature-title{font-size:28px;text-shadow:0 1px 6px rgba(28,59,112,.22)}

  .site-footer .footer-inner{
    display:grid;grid-template-columns:1fr;gap:24px;width:min(var(--container-w),100%);
    margin-inline:auto;padding:28px 24px 12px
  }
  .site-footer .footer-brand{display:flex;align-items:center;gap:12px}
  .site-footer .footer-brand .footer-logo{height:50px;width:auto}
  .site-footer .footer-nav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:24px}
  .site-footer .footer-nav a{
    color:#FFFFFF;
    text-decoration:none;
    font:700 14px/1.8 'Inter',system-ui,sans-serif;
    letter-spacing:.02em;
    /* text-transform:uppercase; */
  }
  .site-footer .footer-copy{
    width:min(var(--container-w),100%);margin:16px auto 0;padding:12px 0 0;
    border-top:1px solid rgba(255,255,255,.36);text-align:center;font-size:12px
  }
}

@media (max-width:600px){
 .feature-image img{height:300px!important}
}

/* SP 430/375 微調整 */
@media (max-width:500px){
  .hero{background-image:url('assets/img/hero_sp_430.jpg');padding:140px 0 135px}
  .hero-title{font-size:31px;text-shadow: #000000 1px 0px 10px;}
  .news-list li{grid-template-columns:1fr;gap:6px}
  .news-list time{font-size:13px}
  .feature-title{font-size:24px;letter-spacing:.06em;line-height:1.3}
  .feature-image img{height:240px!important;border-radius:0}
  .site-footer .footer-inner{gap:20px;padding:24px 24px 10px}
  .site-footer .footer-nav{gap:20px}
}
@media (max-width:375px){
  .hero{background-image:url('assets/img/hero_sp_375.jpg');padding:140px 0 135px}
  .hero-title{font-size:28px;;text-shadow: #000000 1px 0px 10px;}
  .hero-lead{font-size:13px}
  .site-footer .footer-inner{gap:18px;padding:22px 24px 8px}
  .site-footer .footer-nav{gap:18px}
  .site-footer .footer-copy{padding-top:10px}
}

/* SP 見出し折返し制御　*/
@media (max-width:768px){
  .feature .feature-inner,
  .feature--image-right .feature-inner,
  .feature--image-left .feature-inner{grid-template-columns:1fr!important;gap:20px}
  .feature-inner>.feature-image{order:1!important}
  .feature-inner>.feature-body{order:2!important}
  .feature-image{width:100%}
  .feature-image img{width:100%;height:auto;max-height:none;border-radius:0}
  .feature-body{max-width:none;padding:8px 0 0;margin:0;text-align:left}
  .feature-title{font-size: 28px;letter-spacing:.04em;line-height:1.3;margin:12px 0 10px;text-shadow:0 1px 6px rgba(28,59,112,.22);word-break:normal;overflow-wrap:break-word;hyphens:manual}
  .feature-desc{font-size:14px;line-height:1.9;margin:0 0 18px}
  .btn{margin:16px auto 0;width:212px;height:50px;line-height:50px;border-radius:0}
}
@media (max-width:500px){
  .feature-title{font-size:21px;letter-spacing:.04em;line-height:1.28;text-shadow:0 1px 5px rgba(28,59,112,.20);word-break:normal;overflow-wrap:break-word}
  .feature-desc{margin:4px 0 18px}
}
/* ===== Footer 中間幅(769–1279px)での崩れ対策：可変3カラム ===== */
@media (min-width: 769px) and (max-width: 1279px){
  .site-footer .footer-inner{
    /* 左|中央|右 を可変に。gap も可変で縮む */
    grid-template-columns:
      clamp(160px, 18vw, 220px)
      minmax(0, 1fr)
      clamp(160px, 16vw, 220px);
    gap: clamp(24px, 5vw, 64px);
    padding: 32px 24px 10px;
  }
  .site-footer .footer-brand .footer-logo{
    height: clamp(32px, 6.2vw, 50px);
    width: auto;
  }
  .site-footer .footer-nav a{
    font-size: 13px;          /* テキストの折返しを想定して少しタイトに */
    line-height: 1.6;
  }
  .site-footer .footer-copy{
    margin-top: 18px;
    padding-top: 12px;
  }
}

/* ロゴは左列で上下に跨り、右列(=ポリシー/利用規約)を中央列の下へ回す */
@media (min-width: 769px) and (max-width: 980px){
  .site-footer .footer-inner{
    grid-template-columns: clamp(160px, 22vw, 200px) 1fr;
    grid-template-areas:
      "brand center"
      "brand right";
    row-gap: 24px;
    column-gap: clamp(24px, 5vw, 48px);
  }
  .site-footer .footer-brand{ grid-area: brand; }
  .site-footer .footer-nav--center{ grid-area: center; }
  .site-footer .footer-nav--right { grid-area: right;  }
}
/* ===== Hero: entrance animations ===== */

/* コンテナも軽くフェード（※不要ならこの1ブロック削除するかも） */
.hero-inner{
  opacity: 0;
  animation: topmv .3s ease-out .3s forwards;
}

/* ===== Hero: フェードイン===== */

/* 見出し */
.hero-title{
  opacity: 0;
  transform: translateX(-18px);
  transform-origin: left center;
  will-change: transform, opacity;
  animation: topmvcatch 1s cubic-bezier(.2,.7,.2,1) .6s forwards;
  backface-visibility: hidden;
  text-align: left;
  text-shadow: #000000 1px 0px 10px;
}

/* リード文 */
.hero-lead{
  opacity: 0;
  transform: translateX(-14px);
  will-change: transform, opacity;
  animation: topmvtxt 1s cubic-bezier(.2,.7,.2,1) 1.2s forwards;
  backface-visibility: hidden;
}

.hear-sub{
  text-align:center;
}

/* ボタン */
.hero .btn{
  opacity: 0;
  transform: translateX(-10px);
  transform-origin: left center;
  will-change: transform, opacity;
  animation: topmvbtn .8s cubic-bezier(.2,.7,.2,1) 1.6s forwards;
  backface-visibility: hidden;
}

/* ヒーロー内全体も軽くフェード */
.hero-inner{
  opacity: 0;
  transform: translateX(-8px);
  animation: topmv .3s ease-out .3s forwards;
}

/* --- Keyframes（左→右へ） --- */
@keyframes topmv{
  from{ opacity:0; transform: translateX(-8px); }
  to  { opacity:1; transform: none; }
}
@keyframes topmvcatch{
  from{ opacity:0; transform: translateX(-18px); }
  to  { opacity:1; transform: none; }
}
@keyframes topmvtxt{
  from{ opacity:0; transform: translateX(-14px); }
  to  { opacity:1; transform: none; }
}
@keyframes topmvbtn{
  from{ opacity:0; transform: translateX(-10px); }
  to  { opacity:1; transform: none; }
}

/* 動きが苦手な環境では無効化 */
@media (prefers-reduced-motion: reduce){
  .hero-inner,
  .hero-title,
  .hero-lead,
  .hero .btn{
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}
/* ===== Scroll reveal: 下からふわっと ===== */

.reveal-target{
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity .7s ease,
    transform .7s ease;
  will-change: opacity, transform;
}

.reveal-target.is-inview{
  opacity: 1;
  transform: none;
}

.reveal-target .feature-image,
.reveal-target .feature-body{
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal-target.is-inview .feature-image,
.reveal-target.is-inview .feature-body{
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce){
  .reveal-target,
  .reveal-target .feature-image,
  .reveal-target .feature-body{
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

:root{
  --btn-grad-dur: 3.6s; 
  --btn-grad-ease: cubic-bezier(.22,.61,.36,1);
}

.btn{
  transform: none;

  background-image: linear-gradient(
    180deg,
    var(--c-btn-from) 0%,
    var(--c-btn-to)   50%,
    var(--c-btn-from) 100%
  );
  background-size: 100% 200%;
  background-position: 0 0;

  /* 常時ゆったり往復アニメ */
  animation: btnGradPan var(--btn-grad-dur) var(--btn-grad-ease) infinite alternate;

  transition:
    font-size var(--btn-grad-dur) var(--btn-grad-ease),
    filter    var(--btn-grad-dur) var(--btn-grad-ease);

  will-change: background-position, font-size;
}

/* hover時 */
.btn:hover,
.btn:focus-visible{
  font-size: 16px; 
}

@keyframes btnGradPan{
  0%   { background-position: 0 0; }
  50%  { background-position: 0 100%; }
  100% { background-position: 0 0; }
}

.hero.hero--contact{
  background-image: url('assets/img/hero_contact.jpg');
}

/* ---------- タイトル & リード ---------- */
.page-contact .contact-head,
 .newsletter-head{
  max-width: 762px;
  margin: 40px auto 24px;
  padding: 0 24px;
  text-align: center;
}
.page-contact .contact-head .contact-title,
 .newsletter-title{
  font-weight: 600;
  font-size: 28px;
  letter-spacing: .02em;
  font-family: 'Inter';
  margin: 0px 0 40px;
  color: #02082A;
}
.page-contact .contact-head .contact-lead,
 .newsletter-lead{
  margin: 0;
  color: #333;
  font-size: 14px;
  line-height: 1.9;
}

/* ---------- 注意事項 ---------- */
.page-contact .notice-box{
  position: relative;
  max-width: 750px;          
  margin: 40px auto;      
  padding: 18px 22px;
  border: 1px solid #999;    
  border-radius: 4px;
  background: #fff; 
}

.page-contact .notice-box p{
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.9;
}
.page-contact .notice-box .notice-label{
  position: absolute;
  top: -12px;
  left: 22px;
  padding: 0px 10px;
  font-size: 15px;
  font-weight: bold;
  color: #333;
  background: #ffffff;
}
.page-contact .notice-box ul{
  margin: 0;
  padding-left: 1.2em;
  color: #333;
  font-size: 14px;
  line-height: 1.9;
}

/* ---------- Google Form 埋め込み ---------- */
.page-contact .gform-embed{
  max-width: 960px;
  margin: 20px auto 56px;
  padding: 0 24px;
}
.page-contact .gform-embed iframe{
  display: block;
  width: 100%;
  height: 1600px;  
  border: 0;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent;
}

/* ---------- SP（～768px） ---------- */
@media (max-width: 768px){
  .page-contact .contact-head{
    margin: 32px auto 18px;
    padding: 0 16px;
  }
  .page-contact .contact-head .contact-title{
    font-size: 20px;
    margin-bottom: 22px;
  }
  .page-contact .notice-box{
    margin: 40px auto 40px;
    padding: 14px 16px 16px;
    border-radius: 8px;
  }
  .page-contact .notice-box .notice-label{
    left: 16px;
  }
  .page-contact .gform-embed{
    padding: 0 16px;
    margin: 16px auto 44px;
  }
  .page-contact .gform-embed iframe{
    height: 1700px;          
  }
}
/* CONTACT のヒーローだけ中央寄せ（index には影響しない） */
.page-contact .hero .hero-inner{ text-align:center; }
.page-contact .hero .hero-title,
.page-contact .hero .hero-lead{ margin-left:auto; margin-right:auto; }
.page-contact .hero .btn{ margin-left:auto; margin-right:auto; }

/* Google Form 埋め込み余白の最適化 */
.page-contact .gform-embed{ margin-bottom: 8px; padding-bottom: 0; }

/* 画面に合わせて iframe 高さを最適化（余白が出ない程度に短め） */
@media (min-width: 1280px){
  .page-contact .gform-embed iframe{ height: 1200px; }
}
@media (min-width: 769px) and (max-width: 1279px){
  .page-contact .gform-embed iframe{ height: 1250px; }
}
@media (max-width: 768px){
  .page-contact .gform-embed iframe{height: 1375px;}
}
/* ========== CONTACT: ヒーロー（画像/配置/ふわっとアニメ） ========== */

/* 画像差替え・余白（index には影響させない） */
.page-contact .hero{
  background-image: url('assets/img/hero-page.jpg');
  padding: 120px 0 72px;   /* 上を少しだけ広め、下もゆったり */
}

/* 中央寄せ（フォントのサイズ/シャドウは既存を継承） */
.page-contact .hero .hero-inner{ text-align:center; }
.page-contact .hero .hero-title,
.page-contact .hero .hero-lead{margin-left:auto;margin-right:auto;text-align: center;}

/* サブ（「— お問い合わせ —」） */
.page-contact .hero .hero-sub{
  color:#ffffff;
  opacity:.95;
  font-weight:600;
  letter-spacing:.12em;
  font-size:14px;
  margin: 6px 0 14px;
}

/* ふわっと表示（下から） */
@keyframes contactFadeUp{
  from{ opacity:0; transform: translateY(12px); }
  to  { opacity:1; transform: none; }
}

/* モーション減設定のユーザーにはアニメ無効化 */
@media (prefers-reduced-motion: reduce){
  .page-contact .hero .hero-title,
  .page-contact .hero .hero-sub,
  .page-contact .hero .hero-lead,
  .page-contact .hero .btn{
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* SP 調整（画像は同一ファイルを使用） */
@media (max-width: 768px){
  .page-contact .hero{ padding: 96px 0 64px; }
  .page-contact .hero .hero-sub{ font-size:13px; margin:4px 0 12px; }
}

/* 既存：フォーム周りの余白最適化 */
.page-contact .gform-embed{ margin-bottom:8px; padding-bottom:0; }
/* ===========================
   CONTACT 専用レイアウトの追記（マスター末尾）
   --------------------------- */

/* ヒーロー：背景はページ専用画像、見出し/リード */
.contact-hero{
  background-image: url('assets/img/hero-page.jpg');
}
.contact-hero .hero-title,
.contact-hero .hero-lead{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.contact-title{
  text-align: center;
  font-weight: 700;
  letter-spacing: .08em;
  font-size: 24px;           
  color: #02082A;
  margin: 32px 0 12px;
 text-shadow: 0 2px 10px rgba(28,59,112,.20);
}

/* 説明テキスト（2行）と注意事項： */
.contact-intro,
.contact-notes{
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
}
.contact-lead{
  max-width: 750px;
  margin: 0 auto 16px;
  font-size: 14px;
  line-height: 1.9;
  text-align: center;
}

/* 注意事項ボックス（左揃え・同幅） */
.contact-notes{
  text-align: left;
  background: #fff;
  border: 1px solid #d8deea;
  border-radius: 8px;
  padding: 16px 18px;
  box-shadow: none;
}
.contact-notes .notes-head{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-weight: 700;
  color: #1b2c55;
}
.contact-notes .notes-badge{
  display: inline-block;
  padding: 2px 8px;
  font-size: 12px;
  background: #e9f0ff;
  border: 1px solid #cbd8ff;
  border-radius: 999px;
}
.contact-notes ul{
  margin: 0; padding-left: 1.1em;
  font-size: 14px; line-height: 1.9;
}

/* Googleフォーム */
.contact-form{
  max-width: 750px;
  margin: 18px auto 24px;    
}
.contact-form iframe{
  display: block;
  width: 100% !important;    
  max-width: 100%;
  border: 0 !important;
  box-shadow: none !important;
}


@media (max-width: 768px){
  .contact-title{ font-size: 22px; }
  .contact-intro,
  .contact-lead,
  .contact-notes,
  .contact-form{max-width: 100%;padding-inline: 24px;/* margin-top: 50px; */}
}
/* ===== Header 修復パッチ（背景が白くなる/ブレンドする対策） ===== */
.site-header{
  position: sticky;
  top: 0;
  z-index: 1000;
  /* 背景を強制固定。半透明・ブレンドを無効化 */
  background-color: var(--c-header) !important;
  background-image: none !important;
  isolation: isolate;    
}

.site-header{
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* ヘッダー内の高さ・中央寄せを堅牢に */
.site-header .header-inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;    
}

/* ロゴの表示サイズは固定（HiDPIでも崩さない） */
.site-header .brand-logo{
  display:block;
  height: var(--logo-h-header, 36px);
  width:auto;
}


.site-header .gnav a{ color:#fff !important; }
.hero{ position: relative; z-index: 0; }
/* ===== Header logo sizing (固定の高さを可変で指定) ===== */
:root{
  --logo-h-header: 48px;  
}

@media (max-width:1024px){ :root{ --logo-h-header: 42px; } }
@media (max-width:768px) { :root{ --logo-h-header: 30px; } }

.site-header .logo img,
.site-header .brand-logo{
  height: var(--logo-h-header) !important;
  width: auto;
  display: block;
}

.site-header .header-inner{ height: 64px; }
/* ===== Header logo sizing (fix for SP too) ===== */
.site-header .logo img{
  height: 50px;         
  width: auto;
  object-fit: contain;
}

/* タブレット未満は少し大きめに（SPで小さく見える問題を解消） */
@media (max-width: 768px){
  .site-header .logo img{ height: 50px; } 
}

.site-header .logo img{
  image-rendering: auto;
}

@media (max-width: 768px){
  .site-header .header-inner{ height:64px; }      
  .site-header .logo{ display:flex; align-items:center; }

  .site-header .header-inner .logo > img{
    height: 40px !important;    
    width: auto !important;
    max-height: none !important;
    flex: 0 0 auto;
  }
}
/* === Section subtitle under feature-title === */
.feature-sub{
  margin: -8px 0 26px;  
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .04em;
  color: #273445;               
  text-align: center;        

@media (max-width: 768px){
  .feature-sub{
    font-size: 13px;
    margin: -6px 0 14px;
  }
}
}
/* ===== Company page ===== */

/* Hero 背景（contactと同仕様。画像だけ差し替えたい場合はここで） */
.page-hero--company{
  background-image: url('assets/img/hero-page.jpg');
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 84px 0 120px; /* 既存のpage-heroに合わせていれば不要 */
}

/* 会社概要テーブル */
.company-table-wrap{
  max-width: 750px;          /* 指定どおり 750px 基準 */
  margin: 69px auto 80px;    /* 上下の余白はスクショ準拠 */
  margin-bottom: 150px;
}

.company-table{
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;           /* 指定どおり 14px */
  line-height: 1.9;
  color: var(--c-text);
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;          /* 角丸を効かせる */
}

.company-table th,
.company-table td{
  padding: 16px 18px;
  vertical-align: top;
  background: #fff;
}

.company-table th{
  width: 32%;
  color: var(--c-muted);
  font-weight: 600;
  text-align: left;
  background: #fafbff;
}

.company-table tr + tr th,
.company-table tr + tr td{
  border-top: 1px solid var(--c-border);
}

/* SP */
@media (max-width:768px){
  .company-table-wrap{ margin: 40px auto 64px; padding: 0 16px; }
  .company-table th, .company-table td{ display: block; width: 100%; }
  .company-table th{
    border-bottom: none;
    background: #f6f8ff;
    color: #4a4f63;
  }
  .company-table td{ padding-top: 10px; }
  .company-table tr + tr td{ border-top: none; }
  .company-table tr + tr th{ border-top: 1px solid var(--c-border); }
}

/* 視覚的に非表示（スクリーンリーダー用） */
.visually-hidden{
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  padding: 0 !important;
  border: 0 !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden !important;
}
/* ===== COMPANY: hero を CONTACT と同じ見た目に揃える ===== */

/* 画像は contact と同じ運用（hero-page.jpg） */
.page-company .page-hero--company{
  background-image: url('assets/img/hero-page.jpg');
  background-size: cover;
  background-position: center;
}

/* 位置・余白・中央寄せ（contact と同様） */
.page-company .page-hero__inner{
  text-align: center;
 /* padding: 96px 24px 120px;  */  /* contact と同値 */

 opacity: 0;
  transform: translateY(12px);
  animation: phFadeIn .8s cubic-bezier(.2,.7,.2,1) .15s forwards; /* ふわっと */
}

/* タイトルのスタイル（contact と同値） */
.page-company .page-hero__title{
  margin: 0 0 6px;
  color: #fff;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.25;
  letter-spacing: .18em;
  opacity: 0;
  transform: translateX(-18px);
  transform-origin: left center;
  will-change: transform, opacity;
  animation: topmvcatch 1s cubic-bezier(.2,.7,.2,1) .6s forwards;
  backface-visibility: hidden;
    text-shadow: #000000 1px 0px 10px;
}

/* リード（contact と同値） */
.page-company .page-hero__lead{
  margin: 0;
  color: #fff;
  font-size: 14px;
  letter-spacing: .14em;
 
}

/* SP 調整（contact と同値） */
@media (max-width: 768px){
  .page-company .page-hero__inner{ padding: 84px 16px 100px; }
  .page-company .page-hero__title{ font-size: 32px; }
  .page-company .page-hero__lead{ font-size: 13px; }
}

/* ふわっとアニメ（contact と同じ挙動） */
@keyframes phFadeIn{
  from{ opacity:0; transform: translateY(12px); }
  to  { opacity:1; transform: none; }
}

/* ========== Privacy Policy（専用） ========== */
.page-privacy .page-hero--privacy{
  background-image: url('assets/img/hero-page.jpg'); /* 使い回しOK */
  background-size: cover;
  background-position: center;
  color: #fff;
}
.page-privacy .page-hero__inner{
  text-align: center;
  padding: 96px 24px 120px;
  opacity: 0;
  transform: translateY(12px);
  animation: policyFade .8s cubic-bezier(.2,.7,.2,1) .15s forwards;
}
.page-privacy .page-hero__title{
  margin: 0 0 8px;
  font-weight: 700;
  font-size: 40px;
  letter-spacing: .18em;
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
}
.page-privacy .page-hero__sub{
  margin: 0;
  font-size: 14px;
  letter-spacing: .12em;
  opacity: .95;
}
@keyframes policyFade{
  from{ opacity:0; transform: translateY(12px); }
  to  { opacity:1; transform: none; }
}

/* 本文レイアウト */
.policy-wrap{
  max-width: 820px;    
  margin: 40px auto 80px;
  padding: 0 24px;
  font-size: 14px;
  line-height: 1.9;
  color: #222;
}
.policy-meta{
  margin: 0 0 18px;
  color: #666;
  font-size: 13px;
}
.policy-section + .policy-section{ margin-top: 28px; }

.policy-section h2{
  margin: 0 0 10px;
  padding: 0;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #0b1e46;
  position: relative;
}
/*.policy-section h2::after{
  content: "";
  display: block;
  width: 56px;
  height: 2px;
  background: #d1d9ee;
  margin: 10px 0 6px;
}?*/
.policy-section h3{
  margin: 14px 0 6px;
  font-size: 15px;
  font-weight: 600;
  color: #1b2c55;
}
.policy-section p{ margin: 0 0 10px; }

.policy-section ol{
  margin: 6px 0 10px 1.4em;
  padding: 0;
}
.policy-section li{ margin: 4px 0; }

.policy-contact a{ color: #0a3a87; text-decoration: underline; }
.policy-end{ margin-top: 8px; }

/* SP */
@media (max-width: 768px){
  .page-privacy .page-hero__inner{ padding: 84px 16px 100px; }
  .page-privacy .page-hero__title{ font-size: 32px; }
  .policy-wrap{ padding: 0 16px; margin-bottom: 64px; }
}
/* ===== Privacy Policy: 文頭 h2 を contact と同じ装飾に ===== */
/* 文頭 (= 最初のセクション) の h2 を強調・中央寄せ */
.page-privacy .policy-wrap .policy-section:first-of-type h2{
  text-align: center;
  font-weight: 600;
  font-size: 28px;
  letter-spacing: .02em;
  font-family: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif;
  color: #02082A;
  margin: 0 0 32px;
  text-shadow: 0 2px 10px rgba(28,59,112,.20);
}

/* h2 の after は不要（全 h2 で無効化） */
.page-privacy .policy-section h2::after{
  content: none !important;
  display: none !important;
}

/* SP 調整：文頭 h2 を少しだけ小さく */
@media (max-width: 768px){
  .page-privacy .policy-wrap .policy-section:first-of-type h2{
    font-size: 22px;
    margin-bottom: 22px;
  }
}

/* 印刷（表が途中で切れないように） */
@media print {
  .company-table-wrap {
    overflow: visible !important;
  }
  .company-table.company-table--list {
    min-width: auto;
    font-size: 12pt;
  }
  .company-table.company-table--list thead th {
    position: static;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}
/* ===== セクションの余白調整（ヒーローとフッターがくっつかないように） ===== */
.hero { margin-bottom: 32px; }          /* ヒーロー下に余白 */

/* セクション幅（このページだけ広め） */
.company-block .container { max-width: 1280px; }

/* ===== テーブル（専用クラス） ===== */
.ra-list-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.ra-list-table {
  width: 100%;
  min-width: 1000px;   
  border-collapse: collapse;
  table-layout: auto;  
  font-size: 14px;     
  line-height: 1.6;
  background: #fff;
}

.ra-list-table thead th,
.ra-list-table td {
  padding: 12px 14px;
  border-bottom: 1px solid #eef0f3;
  vertical-align: top;
}

.ra-list-table thead th {
  background: #f6f7f9;
  font-weight: 600;
  white-space: nowrap; 
}

.ra-list-table tbody tr:nth-child(even) { background: #fafbfc; }

.ra-list-table th:nth-child(1), .ra-list-table td:nth-child(1),
.ra-list-table th:nth-child(2), .ra-list-table td:nth-child(2) {
  width: 140px; white-space: nowrap;
}
.ra-list-table th:nth-child(3), .ra-list-table td:nth-child(3) {
  width: 260px;
  white-space: normal;
  word-break: keep-all;
}

.ra-list-table th:nth-child(4), .ra-list-table td:nth-child(4) { width: 220px; }
.ra-list-table th:nth-child(5), .ra-list-table td:nth-child(5) { width: 180px; }
.ra-list-table th:nth-child(6), .ra-list-table td:nth-child(6) { width: 280px; }

.ra-list-table td:nth-child(4),
.ra-list-table td:nth-child(5),
.ra-list-table td:nth-child(6) {
  white-space: nowrap;
  word-break: keep-all;
}

/* スマホ：横スクロール前提で最小幅のみ調整 */
@media (max-width: 640px) {
  .ra-list-table { min-width: 900px; }
  .ra-list-table thead th, .ra-list-table td { padding: 10px 12px; }
}
/* ソート可能ヘッダ */
.ra-list-table th.sortable { cursor: pointer; position: relative; user-select: none; }

/* 矢印表示（aria-sortに応じて）*/
.ra-list-table th[aria-sort="ascending"]::after  { content: "▲"; position: absolute; right: 10px; }
.ra-list-table th[aria-sort="descending"]::after { content: "▼"; position: absolute; right: 10px; }
/* ===== ソートUI ===== */
.ra-list-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin:12px 0 8px;
}
.ra-sort-controls{ display:flex; align-items:center; gap:8px; }
.ra-sort-controls label{ font-size:14px; color:#374151; }
.ra-sort-controls select,
.ra-sort-controls button{
  font-size:14px; line-height:1; padding:8px 10px; border-radius:8px; border:1px solid #e5e7eb; background:#fff;
}
.ra-sort-controls button{ cursor:pointer; }
#ra-sort-order[data-order="asc"]::after{ content:" ▲"; }
#ra-sort-order[data-order="desc"]::after{ content:" ▼"; }
#ra-sort-reset{ background:#f9fafb; }

.ra-sort-status{ font-size:12px; color:#6b7280; }

/* テーブルヘッダの“ソートできる”演出 */
/* ===== ソート可能ヘッダ（インジケータ＆操作感） ===== */
.ra-list-table th.sortable{
  cursor: pointer;
  position: sticky; top: 0; z-index: 1;
  background: #f6f7f9;
  transition: background .15s ease;
  user-select: none;
}
.ra-list-table th.sortable:hover{ background: #eef2ff; }

/* 矢印（昇順/降順/未設定） */
.ra-list-table th.sortable::after{
  content: ""; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  border: 6px solid transparent; opacity: .35; border-top-color: #6b7280; /* デフォは薄い上向き */
}
.ra-list-table th[aria-sort="ascending"]::after{
  border: 6px solid transparent; border-bottom-color: #111827; opacity: 1;
}
.ra-list-table th[aria-sort="descending"]::after{
  border: 6px solid transparent; border-top-color: #111827; opacity: 1;
}
.ra-csv-btn{
  display:inline-block;
  margin:12px 0 8px;
  padding:8px 12px;
  font-size:14px;
  border:1px solid #e5e7eb;
  border-radius:8px;
  background:#fff;
  cursor:pointer;
}
.ra-csv-btn:hover{ background:#f9fafb; }
/* 右上に配置するためのヘッダー行 */
.ra-list-header{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  margin: 8px 0 6px; 
}

/* CSVボタンのスタイル */
.ra-csv-btn{
  background:#ffffff;
  color:#162446;     
  font-weight:700;  
  font-size:14px;
  line-height:1;
  padding:10px 14px;
  border:1px solid #162446;
  border-radius:4px;   
  cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
  transition: filter .15s ease, transform .02s ease;
}
.ra-csv-btn:hover{ filter: brightness(1.08); }
.ra-csv-btn:active{ transform: translateY(1px); }
.ra-csv-btn:focus-visible{
  outline:2px solid #3b82f6; /* フォーカス可視化 */
  outline-offset:2px;
}

footer {
  width: 100%;

}
.policy-wrap {
  min-height:30vw;
}

/* ===== Product Detail (縦型) ===== */
.ra-detail {
  margin: 24px 0 64px;
  font-size: 14px;             /* 指定 */
  line-height: 1.8;
}
.ra-detail__header{
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  margin-bottom:16px;
}
.ra-detail__title{
  font-size: 22px; line-height:1.3; font-weight:700; margin:0;
}
.ra-detail__back{
  font-weight:600; text-decoration:none; color:#162446;
}
.ra-detail__back:hover{ text-decoration:underline; }

/* 定義リストを2カラム風に。見出しは固定幅、値は可変 */
.ra-detail__list{
  margin:0;
  padding:0;
  background:#fff;
  border: 1px solid #f9f9f9;
  /* border-radius:8px; */
}
.ra-detail__row{
  display:grid;
  grid-template-columns: 200px 1fr;   /* 左：項目名 右：値 */
  gap:0;
  border-bottom:1px solid #eef0f3;
}
.ra-detail__row:last-child{ border-bottom:none; }

.ra-detail__list dt,
.ra-detail__list dd{
  margin:0; padding:12px 14px;
}

.ra-detail__list dt{
  background:#f6f7f9;
  font-weight:600;
  color:#111;
  white-space:nowrap;
}
.ra-detail__list dd{
  color:#222;
  word-break:break-word;
}

.ra-detail__list dt{
border-bottom: 0.5px solid #ffffff }
.ra-detail__list dd{
border-bottom: 0.5px solid #f9f9f9 }

/* スマホ：1カラムに畳む（項目名→値の順で縦積み） */
@media (max-width: 640px){
  .ra-detail__row{
    grid-template-columns: 1fr;
  }
  .ra-detail__list dt{
    border-bottom:1px solid #eef0f3;
  }
}

/* ── LIST: テーブル内スクロール＆ヘッダ固定 ───────────── */
/* テーブル */
.ra-list-wrap { position: relative; }
.ra-list-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.ra-list-table thead th { position: sticky; top: 0; background: #F3F4F6; z-index: 1; }

/* ページネーション（テーブル外に配置） */
.ra-pagination {
  display: flex; gap: 8px; align-items: center; justify-content: flex-end;
  margin-top: 12px; flex-wrap: wrap;
}
.ra-pagination button {
  padding: 6px 10px; border: 1px solid #E5E7EB; background: #fff;
  border-radius: 6px; cursor: pointer;
}
.ra-pagination button[disabled] { opacity: .5; cursor: default; }
.ra-pagination .is-current { background: #111827; color: #fff; border-color: #111827; }

/* スマホ：テーブル内スクロール（ページネーションは外） */
@media (max-width: 768px){
  .ra-list-wrap {
    max-height: 60vh;            /* 中の表だけスクロール */
    overflow: auto;
    border: 1px solid #E5E7EB; border-radius: 8px; background: #fff;
  }
  .ra-list-table thead th, .ra-list-table tbody td { white-space: nowrap; }
}
/* ページネーションを常に中央配置 */
.ra-pagination{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  justify-content: center;   /* ★ 中央寄せ */
  margin: 16px auto 0;       /* 自身も中央に */
  max-width: 100%;
  text-align: center;
}
.ra-pagination button{
  padding: 6px 10px;
  border: 1px solid #E5E7EB;
  background: #fff;
  border-radius: 6px;
  cursor: pointer;
}
.ra-pagination button[disabled]{ opacity:.5; cursor: default; }
.ra-pagination .is-current{ background:#111827; color:#fff; border-color:#111827; }

/* 情報テキストも中央 */
.ra-page-info{
  width: 100%;
  order: -1;                 /* 先頭に表示（不要なら消してOK） */
  font-size: 12px;
  color: #6B7280;
  text-align: center;
  margin-bottom: 4px;
}
.ra-list-table td:nth-child(1),
.ra-list-table td:nth-child(4), .ra-list-table td:nth-child(5), .ra-list-table td:nth-child(6){
  text-align:center;
}
.ra-list-table th:nth-child(1), .ra-list-table td:nth-child(1), .ra-list-table th:nth-child(2), 
.ra-list-table td:nth-child(2),.ra-list-table th:nth-child(3), .ra-list-table td:nth-child(3),
.ra-list-table th:nth-child(4), .ra-list-table td:nth-child(4){
 width:auto;
 text-align: left;
}
.ra-list-table thead th,
.ra-list-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #eef0f3;
  vertical-align: top;
}
/* ========== SaMD LIST：横スクロール無しの“流体”テーブル ========== */
/* テーブルに .ra-list-table--fluid を付けると有効化（4列専用） */
.record-ex, .record-date,.ra-list-table--fluid{
  /* 既存の min-width:1000px を無効化 */
  min-width: 0 !important;
  /* 幅に応じて自動折返しさせる */
  table-layout: fixed;
  /* フォントを画面幅に追随（PCで14px、狭くなるほど縮む） */
  font-size: clamp(11px, 1.2vw, 14px);
  line-height: 1.55;
}
.record-date{
  text-align:right;
  margin-bottom: 8px;
}
.record-ex{
  text-align:center;
  margin-top: 20px;
}
/* 既存の nowrap を上書きして折り返し可に */
.ra-list-table--fluid thead th,
.ra-list-table--fluid tbody td{
  white-space: normal !important;
  word-break: break-word;
  overflow-wrap: anywhere;
  padding: clamp(8px, 1.2vw, 12px) clamp(8px, 1.6vw, 14px);
}

/* 列幅バランス（%指定で潰れにくくする） */
.ra-list-table--fluid th:nth-child(1),
.ra-list-table--fluid td:nth-child(1){   /* No */
  width: 4.2em;           /* 数字幅。折返させない */
  text-align: center;
  white-space: nowrap !important;
}
.ra-list-table--fluid th:nth-child(2),
.ra-list-table--fluid td:nth-child(2){   /* 一般的名称 */
  width: 34%;
}
.ra-list-table--fluid th:nth-child(3),
.ra-list-table--fluid td:nth-child(3){   /* 販売名 */
  width: 46%;
}
.ra-list-table--fluid th:nth-child(4),
.ra-list-table--fluid td:nth-child(4){   /* 承認日 */
  width: 20%;
  white-space: nowrap !important;        /* 日付は1行 */
  text-align: center;
}

/* さらに幅が狭い時の微調整（段階的に少しずつ小さく） */
@media (max-width: 1024px){
  .ra-list-table--fluid{ font-size: clamp(10.5px, 1.3vw, 13px); }
}
@media (max-width: 900px){
  .ra-list-table--fluid{ font-size: clamp(10px, 1.6vw, 12px); }
}
@media (max-width: 768px){
  .ra-list-table--fluid{ font-size: clamp(9.8px, 2.0vw, 11.5px); }
.news{padding: 0;}
}

/* ===== Newsletter ===== */

/* 見出し・リード（このページだけ中央寄せに） */
.page-newsletter .contact-title {
  text-align: center;
  font-weight: 600;
  margin: 2rem 0 1rem;
  font-size: 1.4rem;
}
.page-newsletter .contact-lead {
  text-align: center;
  line-height: 1.8;
  margin-bottom: 2.5rem;
}

/* フォーム本体 */
.newsletter-form { max-width: 640px; margin: 0 auto; }
.newsletter-form .form-group { margin-bottom: 1.5rem; }
.newsletter-form label { display: block; font-weight: 600; margin-bottom: .45rem; }
.newsletter-form input[type="text"],
.newsletter-form input[type="email"] {
  width: 100%;
  box-sizing: border-box;
  padding: .75rem 1rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1rem;
}
.newsletter-form .checkbox label {font-weight: 400;margin-top: 2rem;}

/* 必須 / 任意バッジ */
.badge {
  display: inline-block;
  margin-left: .5rem;
  margin-top: 0.05rem;
  padding: 0.2rem .55rem 0.15rem .55rem;
  border-radius: 3px;
  font-size: .75rem;
  line-height: 1;
  vertical-align: text-top;
  /* text-align: center; */
}
.badge--required { background: #e53935; color: #fff; }  /* 必須 */
.badge--optional { background: #f39c12; color: #fff; }  /* 任意 */

/* ボタン（見た目は共通 .btn / .btn--sm を使用。ここでは位置のみ） */
.nl-actions {text-align: center;margin-top: 3rem;margin-bottom: 4rem;}

/* 注意書きパネル */
.privacy-note {
  background: #f5f5f5;
  padding: 1.5rem;
  font-size: .9rem;
  line-height: 1.6;
  color: #333;
  border-radius: 4px;
  max-width: 900px;
  margin: 0 auto 3rem;
}

/* Responsive */
@media (max-width: 600px) {
  .page-newsletter .contact-title { font-size: 1.2rem; }
  .newsletter-form { padding: 0 12px; }
}
/* --- footer を常に最下部へ（thanksページ用） --- */
html, body { height: 100%; }

body.page-contact {
  min-height: 100vh;          /* 画面全高を確保 */
  display: flex;
  flex-direction: column;     /* 縦並び */
}

body.page-contact > #site-footer {
  margin-top: auto;           /* 余白を押し出して最下部へ */
}

/* 余白の微調整（任意） */
body.page-contact .contact-head { padding-bottom: 40px; }
@media (max-width: 600px) {
  body.page-contact .contact-head { padding-bottom: 24px; }
}
/* ===== Sticky Footer 共通 ===== */
html, body {
  height: 100%;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main, .contact-head, .company-block {
  flex: 1; /* コンテンツ領域を伸ばしてフッターを押し下げる */
}

#site-footer {
  margin-top: auto; /* 自動で一番下に配置 */
}
/* ===== Sticky Footer 共通 ===== */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main, .contact-head, .company-block {
  flex: 1;
}

/* フッターをページ下部に固定 */
#site-footer {
  margin-top: auto;
}

/* ===== フッター上の余白除去 ===== */
.contact-head,
.company-block {
  margin-bottom: 0 !important;
  padding-bottom: 5rem; /* 最小限の呼吸スペースを確保 */
}

.container:last-child {
  margin-bottom: 0;
}

/* 画面が小さい時のレイアウトも崩さない */
@media (max-width: 768px) {
  .contact-head,
  .company-block {
    padding-bottom: 1.5rem;
  }
}
/* ===== Privacy Policy: フッターが中腹で固定化される不具合の対策 ===== */
.page-privacy body {               /* 念のためページ限定でフレックス化を強制 */
  display: flex !important;
  flex-direction: column !important;
  min-height: 100dvh !important;   /* モバイルでも確実に全高を確保 */
}

.page-privacy #main {              /* コンテンツ領域を伸ばしてフッターを押し下げる */
  flex: 1 0 auto !important;
}

.page-privacy #site-footer,
.page-privacy .site-footer {       /* 万一 inline で fixed/absolute が当たっても無効化 */
  position: static !important;
  bottom: auto !important;
  top: auto !important;
  margin-top: auto !important;     /* 下端へ押し下げ */
}

/* 余白の最終調整：ヒーローの下余白が原因で中腹に見えるケースを吸収 */
.page-privacy .hero { margin-bottom: 32px !important; }
/* placeholderの色を薄く */
::placeholder {
  color: rgba(0, 0, 0, 0.4); /* 黒の40%の透明度（現在より薄い） */
}

/* Safari / Edge対策 */
input::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.4); }
input::-moz-placeholder { color: rgba(0, 0, 0, 0.4); }
input:-ms-input-placeholder { color: rgba(0, 0, 0, 0.4); }
input::-ms-input-placeholder { color: rgba(0, 0, 0, 0.4); }


/* ---------- 記事レイアウト（左寄せ） ---------- */
.article-head{
  max-width: 762px;
  margin: 40px auto 24px;
  padding: 0 24px;
  text-align: left;
}
.article-title{
  font-weight: 600;
  font-size: 28px;
  letter-spacing: .02em;
  font-family: 'Inter';
  margin: 0px 0 20px;
  color: #02082A;
  text-align: center;
  font-weight: 700;
  letter-spacing: .08em;
  font-size: 24px;
  color: #02082A;
  margin: 40px 0 24px;
  text-shadow: 0 2px 10px rgba(28,59,112,.20);
}
.article-lead{
  margin: 0;
  color: #333;
  font-size: 14px;
  line-height: 1.9;
  text-align: left;
}
@media (max-width: 768px){
  .article-head{margin: 32px auto 18px;/* padding: 0 16px; */}
  .article-title{ font-size: 20px; margin-bottom: 12px; }
}
/* ---------- 参加者の声 ---------- */
.voices{
  max-width: 750px;
  margin: 28px auto 12px;
  padding: 0 24px 8px;
}
.voices-head{
  margin-bottom: 12px;
}
.voices-title{
  display: inline-block;
  padding: 10px 16px;
  color: #02082A;          /* 白文字 */
  background: #ffffff;
  /* border: solid 1px; */
  font-size: 17px;
  letter-spacing: .06em;
  border-radius: 4px;   /* ラベル風（角丸） */
  line-height: 1.2;
  margin: 30px 10px 24px 0px;
}
.voices-list{
  list-style: none;        /* デフォルトの丸を消す */
  margin: 12px 0 0;
  padding-left: 0;
  color: #222;
  font-size: 14px;
  line-height: 1.9;
}
.voices-list li{
  position: relative;
  padding-left: 1.2em;     /* カスタム行頭の余白 */
  margin: 0 0 30px;
}
.voices-list li::before{
  content: "・";           /* 文頭に「・」 */
  position: absolute;
  left: 0;
  top: 0;
  line-height: 1.9;
  font-weight: 700;
  color: #162446;          /* ネイビーで統一感 */
}


/* ===== Page-scoped overrides: qms_seminar_20251008 (article) ===== */
body[data-page="article-qms-20251008"] .container{
  max-width: 900px; /* widen just for this page */
}
body[data-page="article-qms-20251008"] .article-head{
  max-width: 900px;
}
/* Typography unification (titles excluded) */
body[data-page="article-qms-20251008"] :where(p, li, dd, dt){
  font-size: 14px;
  line-height: 1.9;
}
body[data-page="article-qms-20251008"] .voices-list{
  font-size: 16px; /* unify with base text */
  line-height: 1.9;
  /* margin: 2px 2px 2px; */
}

.article-notice-box{
  position: relative;
  max-width: 850px;
  margin: 40px auto;
  padding: 18px 22px;
  border: 1px solid #dddddd;
  border-radius: 4px;
  background: #fff;
}
.article-notice-box{
    margin: 40px 0px 0px;
    /* padding: 14px 0px 16px; */
    border-radius: 8px;
  }
.article-notice-label{
  position: absolute;
  top: -12px;
  left: 22px;
  padding: 0px 10px;
  font-size: 15px;
  font-weight: bold;
  color: #333;
  background: #ffffff;
}
.article-notice-label{
    left: 16px;
  }


/* ===== article-text width tuning (page-scoped) ===== */
body[data-page="article-qms-20251008"] .article-text.container{
  max-width: 820px;              /* 読みやすい本文幅 */
  padding-inline: 24px;          /* 左右に余白 */
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 768px){
  body[data-page="article-qms-20251008"] .article-text.container{
    max-width: 100%;
    padding-inline: 16px;        /* SPもビタ付回避 */
  }
}
/* （任意）質問ボックスの幅も本文と揃える */
body[data-page="article-qms-20251008"] .article-notice-box{
  /* max-width: 820px; */
  /* margin-left: auto; */
  /* margin-right: auto; */
}
@media (max-width: 768px){
  body[data-page="article-qms-20251008"] .article-notice-box{
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}


/* ===== Voices: bordered block (reverting cards) — page-scoped ===== */
body[data-page="article-qms-20251008"] .voices-list{
  display: block !important;              /* 旧カードのgridを無効化 */
  grid-template-columns: none !important;
  gap: 0 !important;
  list-style: none;
  margin: 14px 0 0;
                        /* 内側余白 */
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}
@media (max-width: 768px){
  body[data-page="article-qms-20251008"] .voices-list{
    padding: 14px 14px;                    /* SPは少しタイトに */
  }
}

/* 各項目を通常のリスト型へ */
body[data-page="article-qms-20251008"] .voices-list li{
  position: relative;
  margin: 0 0 30px;
                      /* 行頭インデント */
  padding: 1em 1.5em;
  background: #f2f2f2;
  border-radius: 8px;
}
body[data-page="article-qms-20251008"] .voices-list li:last-child{ margin-bottom: 0; }

/* ドット記号（・）を復活 */
body[data-page="article-qms-20251008"] .voices-list li::before{
  content: "・" !important;
  position: absolute;
  left: 0;
  top: 0;
  line-height: 1.9;
  font-weight: 700;
  color: #162446;
  padding: 1em .5em;
}

/* ===== Voices: centered title with full-width side rules (div-based) ===== */
.voices-head{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  margin: 28px 0 9px;
}
.voices-head .voices-title{
  display:inline-block;
  font-weight:600;
  text-align:center;
  white-space:nowrap;
  padding:0 4px;
}
.voices-head .voices-rule{
  flex:1 1 auto;
  height:1px;
  background: currentColor;
  opacity:.25;
}
@media (max-width: 600px){
  .article-title{ font-size: 18px; margin-bottom: 12px; }
}
  
@media (max-width: 480px){
  .voices-head{ gap:8px; }
  .voices-head .voices-title{ font-size:.95rem; }
  .voices-head .voices-rule{ opacity:.3; }
  .article-title{ font-size: 16px; margin-bottom: 12px; }
}

/* ===== Q&A layout: .qa-8 (dt=Q / dd=A) ===== */
.qa-8 dt {
  margin-bottom: 1em;
  color: #333333;
  /* font-weight: 600; */
}
.qa-8 dt::before,
.qa-8 dd::before {
  margin-right: .4em;
}
.qa-8 dt::before {
  content: "Q.";
}
.qa-8 dd {
  margin: 0px 0 1em;
  padding: 1em 1.5em;
  background-color: #f2f2f2;
  color: #333333;
  border-radius: 8px;
  margin-top: 1em;
}
.qa-8 dd::before {
  content: "A.";
}

/* ===== Modifier: panel-style voices list (Plan A) ===== */
.voices-list--panel li{
  position: relative;
  margin: 0 0 30px;
  padding: 1em 1.5em;     /* 行頭インデント */
  background: #f2f2f2;
  border-radius: 8px;
}