/*
Theme Name: grouththeme2026
Text Domain: grouth.co.jp
*/

:root{
  --white:#fff;
  --offwhite:#f5f7fa;

  --text:#0b2a4a;
  --muted:#5d6b7a;

  --brand-navy:#0b2a4a;
  --brand-blue:#0e4c8c;
  --brand-cyan:#1aa6b7;

  --border:#e2e8f0;
  --border-strong:#cfd8e3;

  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:18px;
  --radius-xl:22px;

  --container:1200px;

  /* overlay */
  --hero-ov-a: rgba(14,76,140,.70);
  --hero-ov-b: rgba(26,166,183,.55);

  --sec-ov-a: rgba(14,76,140,.45);
  --sec-ov-b: rgba(26,166,183,.32);

  /* shadows */
  --card-shadow: 0 18px 40px rgba(11,42,74,0.10);
  --worry-shadow: 0 18px 40px rgba(11,42,74,0.10);
}

/* =================================================
  Base
================================================= */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:"Noto Sans JP", system-ui, -apple-system, "Segoe UI", sans-serif;
  color:var(--text);
  line-height:1.9;
  background:var(--white);
  padding-top:80px; /* fixed header分 */
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }

/* =================================================
  Header
================================================= */
.site-header{
  position:fixed;
  top:0; left:0;
  width:100%;
  z-index:1000;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
.header-inner{
  height:80px;
  display:flex;
  align-items:center;
  gap:18px;
}

/* Logo */
.logo{
  display:flex;
  align-items:center;
  flex-shrink:0;
}
.logo-mark{
  display:block;
  width:160px;
  height:44px;
  background:url("images/grouth_logo.png") no-repeat left center / contain;
}
.logo-text{ display:none; }

/* Nav (PC) */
.nav{
  margin-left:auto;
  display:flex;
  gap:18px;
}
.nav a{
  color:var(--brand-navy);
  font-size:15px;
  font-weight:800;
}
.nav a:hover{ color:var(--brand-blue); }

/* Header CTA */
.header-cta{ display:flex; gap:10px; }

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:48px;
  padding:0 18px;
  border-radius:var(--radius-md);
  font-size:16px;
  font-weight:900;
  border:1px solid transparent;
  cursor:pointer;
  transition: transform .08s ease, opacity .2s ease, background .2s ease;
}
.btn:active{ transform: translateY(1px); }
.btn-primary{
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  color:#fff;
}
.btn-primary:hover{ opacity:.92; }
.btn-secondary{
  background:#fff;
  color:var(--brand-navy);
  border-color: var(--border-strong);
}
.btn-secondary:hover{ background: rgba(14,76,140,0.06); }
.btn-sm{ height:40px; font-size:14px; padding:0 14px; }

/* Burger */
.burger{
  display:none;
  width:44px;
  height:44px;
  border:0;
  background:transparent;
  cursor:pointer;
  margin-left:auto; /* SPで右に固定 */
}
.burger span{
  display:block;
  width:24px;
  height:2px;
  margin:5px auto;
  background:var(--brand-navy);
  transition: transform .25s ease, opacity .25s ease;
}

/* =================================================
  Hero (index)
================================================= */
.hero{
  position:relative;
  height:82vh;
  min-height:560px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 56px;
}
.hero-media{ position:absolute; inset:0; overflow:hidden; }
.hero-media img{ width:100%; height:100%; object-fit:cover; }

/* slide */
.hero-slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transform: scale(1.03);
  transition: opacity 1s ease, transform 6s ease;
  will-change: opacity, transform;
}
.hero-slide.is-active{
  opacity:1;
  transform: scale(1.00);
}

.hero-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 420px at 20% 15%, rgba(26,166,183,0.18), transparent 60%),
    radial-gradient(900px 420px at 80% 15%, rgba(14,76,140,0.22), transparent 60%),
    linear-gradient(135deg, var(--hero-ov-a), var(--hero-ov-b));
}
.hero-overlay::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:34px;
  background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,1));
  pointer-events:none;
}
.hero-content{
  position:relative;
  padding: 90px 0 56px;
  color:#fff;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  font-weight:900;
  letter-spacing:.03em;
  color: rgba(255,255,255,0.95);
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.20);
}
.hero-title{
  margin: 18px 0 14px;
  font-size: 44px;
  font-weight: 950;
  letter-spacing: -0.02em;
  line-height: 1.18;
  text-shadow: 0 10px 32px rgba(0,0,0,0.35);
}
.hero-sub{
  margin:0;
  max-width: 720px;
  font-size: 17px;
  font-weight: 750;
  color: rgba(255,255,255,0.92);
  text-shadow: 0 8px 22px rgba(0,0,0,0.25);
}
.hero-cta{
  margin-top: 22px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.hero-cta .btn{ height:52px; padding:0 20px; }

.hero-badges{
  margin-top: 16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.badge{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .02em;
  color: rgba(255,255,255,0.95);
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.22);
}

/* =================================================
  Section base / Visual（H1/H2背景）
================================================= */
.section{ padding:72px 0; }
.section-alt{
  background:var(--offwhite);
  border-top:1px solid rgba(14,76,140,0.08);
  border-bottom:1px solid rgba(14,76,140,0.08);
}

.section-visual{
  position:relative;
  height: 220px;
  overflow:hidden;
  border-top: 1px solid rgba(14,76,140,0.06);
  border-bottom: 1px solid rgba(14,76,140,0.06);
}
.section-visual--short{ height: 180px; }

.section-visual img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.02);
  z-index:0;
}

/* overlay layers */
.section-visual::before,
.section-visual::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.section-visual::before{
  z-index:1;
  background: linear-gradient(135deg, var(--sec-ov-a), var(--sec-ov-b));
  opacity: .90;
  mix-blend-mode: multiply;
}
.section-visual::after{
  z-index:2;
  background: linear-gradient(
    180deg,
    rgba(11,42,74,.25) 0%,
    rgba(11,42,74,.60) 55%,
    rgba(11,42,74,.78) 100%
  );
}

/* text layer（必ずoverlayより上） */
.section-visual__inner{
  position:absolute;
  left:0; right:0;
  bottom: 20px;
  z-index:3;
  color:#fff;

  /* フェードアップ（初期） */
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .7s ease, transform .7s ease;
}
.section-visual__inner.is-show{
  opacity: 1;
  transform: translateY(0);
}

.section-visual__inner h1,
.section-visual__inner h2{
  margin:0 0 6px;
  font-size:32px;
  line-height:1.2;
  letter-spacing:-0.01em;
  color:#fff;
  text-shadow:
    0 3px 10px rgba(0,0,0,0.45),
    0 8px 24px rgba(0,0,0,0.55);
}
.section-visual__inner p{
  margin:0;
  color: rgba(255,255,255,0.90);
  font-weight:700;
  text-shadow: 0 2px 8px rgba(0,0,0,0.40);
}

/* =================================================
  共通: CTA
================================================= */
.inline-cta{
  margin-top: 22px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

/* =================================================
  index: Worry
================================================= */
.worry-band{ padding: 54px 0 62px; }
.worry-title{
  margin:0 0 18px;
  font-size: 30px;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
}
.worry-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.worry-card{
  background:#fff;
  border-radius: var(--radius-xl);
  box-shadow: var(--worry-shadow);
  overflow:hidden;
  border: 1px solid rgba(14,76,140,0.10);
  padding: 0 0 16px;
}
.worry-card__label{
  width:100%;
  height: 190px;
  object-fit: cover;
}
.worry-card h3{
  margin: 14px 16px 8px;
  font-size: 18px;
  font-weight: 950;
  line-height: 1.35;
}
.worry-card p{
  margin: 0 16px;
  color: rgba(11,42,74,0.66);
  font-weight: 720;
  line-height: 1.85;
}
.worry-cta{
  margin-top: 18px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

/* =================================================
  service: target / indexの3点カード共通
================================================= */
.service-target-visual img{ display:none !important; }

.target-grid{
  margin-top: 32px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.target-item{
  background:#fff;
  border-radius: var(--radius-lg);
  box-shadow: 0 14px 34px rgba(11,42,74,0.08);
  padding: 18px 18px 16px;
  position: relative;
  overflow:hidden;
  border: 1px solid rgba(14,76,140,0.10);
}
.target-item__head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom: 6px;
}
.target-ico{
  width: 44px;
  height: 44px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(14,76,140,0.14), rgba(26,166,183,0.14));
  border: 1px solid rgba(14,76,140,0.14);
}
.target-ico svg{
  width: 22px;
  height: 22px;
  stroke: var(--brand-blue);
}
.target-item h3{
  margin:0;
  font-size: 19px;
  font-weight: 950;
  line-height: 1.35;
  letter-spacing: -0.01em;
}
.target-item p{
  margin: 4px 0 0;
  color: rgba(11,42,74,0.64);
  font-weight: 650;
  line-height: 1.85;
}

/* =================================================
  CTA band
================================================= */
.cta-band{
  margin-top: 22px;
  /* border:1px solid var(--border);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(800px 300px at 15% 20%, rgba(26,166,183,0.14), transparent 60%),
    radial-gradient(800px 300px at 85% 25%, rgba(14,76,140,0.14), transparent 60%),
    #fff;
  padding: 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px; */
}
.cta-band__text h3{ margin:0 0 6px; font-size:20px; line-height:1.35; }
.cta-band__text p{ margin:0; color:var(--muted); }
.cta-band__actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* =================================================
  Footer
================================================= */
.footer{
  background: linear-gradient(180deg, #eaf7fb 0%, #dff3f8 55%, #d3eef6 100%);
  color: var(--brand-navy);
  border-top: 1px solid rgba(14,76,140,0.10);
}
.footer-inner{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:32px 0;
}
.footer-links{ display:flex; gap:14px; flex-wrap:wrap; }
.footer a{ color:#00499b; }
.footer a:hover{ opacity:.85; }
.footer-desc{ margin:10px 0 0; color: rgba(11,42,74,0.78); }
.footer-bottom{
  border-top:1px solid rgba(14,76,140,0.12);
  padding:14px 0;
  color: rgba(11,42,74,0.70);
  font-size:13px;
}

/* フッターナビ（グロナビ同等＋三角） */
.footer-nav-simple{
  display:flex;
  flex-wrap:wrap;
  gap: 10px 18px;
  margin-top: 14px;
  padding: 0;
  font-weight: 800;
  font-size: 14px;
}
.footer-nav-simple a{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  color: rgba(11, 42, 74, 0.72);
  line-height: 1.4;
}
.footer-nav-simple a::before{
  content:"▶";
  font-size: 9px;
  line-height: 1;
  color: rgba(14, 76, 140, 0.6);
}
.footer-nav-simple a:hover{
  color: rgba(11, 42, 74, 0.92);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.footer-nav-simple a:hover::before{
  color: rgba(14, 76, 140, 0.9);
}

/* =================================================
  company page
================================================= */
.page-section--alt{
  background:#f7fafc;
  border-top:1px solid rgba(14,76,140,0.08);
  border-bottom:1px solid rgba(14,76,140,0.08);
}
.page-title-wrap{ padding: 22px 0 0; }
.page-title{
  margin: 0 0 8px;
  font-size: 34px;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
}
.page-title-sub{
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  color: rgba(11,42,74,0.62);
}

/* 背景なし見出し（company用） */
.section-head{
  margin: 28px 0 22px;
  padding-left: 18px;
  border-left: 6px solid;
  border-image: linear-gradient(180deg, var(--brand-blue), var(--brand-cyan)) 1;
}
.section-head h2{
  margin: 0 0 6px;
  font-size: 28px;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
}
.section-head p{
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  color: rgba(11,42,74,0.60);
}

/* Vision */
.vision-text{
  font-size: 15.5px;
  line-height: 2.0;
  color: rgba(11,42,74,0.72);
  margin-top: 16px;
}
.vision-text p{ margin: 0 0 12px; }

/* 共通カードグリッド */
.service-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.service-card{
  /*background:#fff;
  border-radius: var(--radius-lg);
  box-shadow: 0 14px 34px rgba(11,42,74,0.08);
  padding: 18px 18px 16px;
  border: 1px solid rgba(14,76,140,0.10);*/
}
.service-card h3{
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 900;
  color: rgba(11,42,74,0.72);
}
.service-card p{
  margin: 0;
  font-size: 15px;
  font-weight: normal;
  color: rgba(11,42,74,0.88);
  line-height: 1.7;
}

/* CEO */
.ceo-photos{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 12px;
}
.ceo-photo{
  margin:0;
  text-align:center;
}
.ceo-photo img{
  width:100%;
  height: 280px;
  object-fit: cover;
  border-radius: 18px;
  box-shadow: 0 16px 36px rgba(11,42,74,0.12);
  border: 1px solid rgba(14,76,140,0.10);
}
.ceo-photo figcaption{
  margin-top: 10px;
  font-weight: 900;
  color: rgba(11,42,74,0.70);
}

/* =================================================
  service page offers（service.html）
================================================= */
.service-intro{
  display:flex;
  justify-content:center;
  margin: 46px 0 40px;
}
.service-lead.service-lead--emphasis{
  max-width: 920px;
  text-align:center;
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.7;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: rgba(11,42,74,0.88);
  padding: 0 0 10px;
  border: none;
  background: none;
  box-shadow: none;
  position: relative;
}
.service-lead.service-lead--emphasis::after{
  content:"";
  display:block;
  width: 120px;
  height: 3px;
  margin: 14px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--brand-blue), var(--brand-cyan));
  opacity: .85;
}

.service-grid.service-grid--offers{
  margin-top: 30px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.service-card.service-card--offer{
  padding: 0;
  overflow:hidden;
  border-radius: var(--radius-xl);
  box-shadow: var(--card-shadow);
}
.service-card__label{
  width:100%;
  height: 240px;
  object-fit: cover;
  object-position: center;
}
.service-card__body{ padding: 18px 18px 16px; }
.service-card__body h2{
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 950;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
}
.service-card__body p{
  margin: 0;
  color: rgba(11,42,74,0.64);
  font-weight: 720;
  font-size: 15px;
  line-height: 1.85;
}

/* =================================================
  Timeline（index: 事業内容 / 強み）
================================================= */
.timeline{
  list-style:none;
  padding:0;
  margin: 28px 0 0;
  position:relative;
}

/* 線は丸の中心を通す */
.timeline::before{
  content:"";
  position:absolute;
  left: 19px;          /* tl-dot(38px)中心 */
  top: 10px;
  bottom: 10px;
  width: 2px;
  background: rgba(14,76,140,0.18);
  border-radius: 999px;
}

.tl-item{
  display:flex;
  gap:18px;
  align-items:flex-start;
  padding: 0 0 26px;
}

/* 丸（塗りつぶし） */
.tl-dot{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:50%;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  box-shadow: 0 6px 18px rgba(14,76,140,0.35);
  display:flex;
  align-items:center;
  justify-content:center;
  margin: 0;
}

/* 丸内文字を完全に非表示 */
.tl-dot span{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
}

/* 本文カード */
.tl-body{
  width:100%;
  background:#fff;
  border: 1px solid rgba(14,76,140,0.10);
  border-radius:18px;
  box-shadow: 0 14px 34px rgba(11,42,74,0.08);
  padding: 18px 18px 16px;
  overflow:hidden;
}
.tl-body h3{
  margin:0 0 6px;
  font-size:20px;
  font-weight:950;
  line-height:1.35;
  letter-spacing:-0.01em;
}
.tl-body p{
  margin:0;
  color: rgba(11,42,74,0.64);
  font-weight:720;
  line-height:1.85;
}
.tl-actions{ margin-top: 12px; }

/* =================================================
  service.html：サービス詳細（統合版）
  ※「通常版」と「強化版」の二重定義を統合
================================================= */
.service-detail{
  padding: 72px 0;
  background:
    radial-gradient(800px 260px at 15% 20%, rgba(26,166,183,0.08), transparent 60%),
    radial-gradient(800px 260px at 85% 25%, rgba(14,76,140,0.08), transparent 60%),
    #f7fafc;
}

.service-detail-title{
  margin: 0 0 12px;
  font-size: 30px;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
}

.service-detail-lead{
  margin: 0 0 32px;
  font-size: 16px;
  font-weight: 750;
  color: rgba(11,42,74,0.75);
  line-height: 1.9;
}

.service-detail-box{
  background:#fff;
  border-radius: var(--radius-xl);
  padding: 28px 30px;
  box-shadow: 0 18px 40px rgba(11,42,74,0.10);
  margin-bottom: 56px;
  position: relative;
  overflow: hidden;
}

.service-detail-box::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:6px;
  height:100%;
  background: linear-gradient(180deg, var(--brand-blue), var(--brand-cyan));
}

.service-detail-sub{
  margin: 0 0 18px;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.5;
  color: var(--brand-navy);
}

/* リスト（目立つ版のみ残す） */
.service-detail-list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.service-detail-list li{
  position: relative;
  padding-left: 34px;
  margin-bottom: 14px;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.8;
  color: rgba(11,42,74,0.80);
}
.service-detail-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:0.45em;
  width:20px;
  height:20px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  box-shadow: 0 6px 16px rgba(14,76,140,0.35);
}
.service-detail-list li::after{
  content:"";
  position:absolute;
  left:6px;
  top:0.75em;
  width:6px;
  height:10px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform: rotate(45deg);
}

.service-detail-divider{
  margin: 64px 0;
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(14,76,140,0.35), transparent);
}

/* =================================================
  section-alt 内の見出しが消える対策（維持）
  ※既存挙動を保つため残す（必要なら範囲を絞れます）
================================================= */
.section-alt h2{
  opacity: 1 !important;
  transform: none !important;
  color: var(--brand-navy) !important;
  text-shadow: none !important;
  position: relative;
  z-index: 1;
}
.section-alt h2 + p{ color: rgba(11,42,74,0.7); }

/* =================================================
  service.html：当社の強み 見出し（背景なし）
================================================= */
.alt-title{
  margin: 0 0 22px;
  text-align: center;
  font-size: 28px;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
  position: relative;
}
.alt-title::after{
  content:"";
  display:block;
  width: 92px;
  height: 4px;
  margin: 10px auto 0;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  opacity: .95;
}

/* =================================================
  service.html：FAQ（details/summary アコーディオン）
  ※ faq-q::after の二重定義を統合
================================================= */
.service-faq{
  background:
    radial-gradient(900px 320px at 20% 10%, rgba(26,166,183,0.08), transparent 60%),
    radial-gradient(900px 320px at 80% 10%, rgba(14,76,140,0.08), transparent 60%),
    #fff;
  border-top: 1px solid rgba(14,76,140,0.08);
}

.faq-head{
  text-align:center;
  margin-bottom: 24px;
}
.faq-title{
  margin: 0 0 6px;
  font-size: 30px;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
}
.faq-sub{
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  color: rgba(11,42,74,0.62);
}

.faq-list{
  max-width: 920px;
  margin: 0 auto;
  display:flex;
  flex-direction: column;
  gap: 12px;
}

.faq-item{
  background:#fff;
  border: 1px solid rgba(14,76,140,0.12);
  border-radius: var(--radius-xl);
  box-shadow: 0 14px 34px rgba(11,42,74,0.08);
  overflow:hidden;
}

.faq-q{
  list-style: none;
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 16px 46px 16px 18px; /* 右端▼分の余白 */
  cursor:pointer;
  font-weight: 900;
  color: var(--brand-navy);
  position: relative;
}
.faq-q::-webkit-details-marker{ display:none; }

.faq-icon{
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 10px;
  color:#fff;
  font-weight: 950;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  box-shadow: 0 8px 18px rgba(14,76,140,0.28);
}

.faq-qtext{ flex: 1; line-height: 1.55; }

/* クリック誘導 ▼（統合） */
.faq-q::after{
  content: "";
  position: absolute;
  right: 18px;
  top: 50%;
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(11,42,74,0.70);
  border-bottom: 2px solid rgba(11,42,74,0.70);
  transform: translateY(-55%) rotate(45deg);
  transition: transform .25s ease, opacity .25s ease;
  opacity: .9;
}

.faq-a{
  padding: 0 18px 16px;
  border-top: 1px solid rgba(14,76,140,0.10);
}
.faq-a p{
  margin: 14px 0 0;
  color: rgba(11,42,74,0.70);
  font-weight: 720;
  line-height: 1.9;
}
.faq-aicon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  margin-right: 8px;
  color: var(--brand-blue);
  background: rgba(14,76,140,0.10);
  font-weight: 950;
}

.faq-item[open] .faq-q{ background: rgba(14,76,140,0.05); }
.faq-item[open] > .faq-q::after{
  transform: translateY(-35%) rotate(-135deg);
  opacity: 1;
}
.faq-q:hover{ background: rgba(14,76,140,0.04); }

.faq-cta{
  margin-top: 22px;
  display:flex;
  justify-content:center;
  gap: 12px;
  flex-wrap:wrap;
}

/* =================================================
  strength.html（既存：h2背景ユーティリティ + 旧左右ブロック）
  ※レイアウト維持のため残す
================================================= */
.strength-head{
  text-align: center;
  margin-bottom: 10px;
}
.strength-head__title{
  margin: 0 0 6px;
  font-size: 28px;
  font-weight: 950;
  letter-spacing: -0.01em;
  color: var(--brand-navy);
}
.strength-head__sub{
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  color: rgba(11,42,74,0.62);
}

.h2-visual{
  position: relative;
  border-radius: var(--radius-xl);
  overflow: hidden;
  height: 140px;
  margin: 0 0 22px;
  background: #000;
  box-shadow: 0 18px 40px rgba(11,42,74,0.10);
  border: 1px solid rgba(14,76,140,0.10);
}
.h2-visual::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: var(--h2bg);
  background-size: cover;
  background-position: center;
  opacity: 1;
}
.h2-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg, rgba(14,76,140,0.62), rgba(26,166,183,0.40)),
    linear-gradient(180deg, rgba(11,42,74,0.20), rgba(11,42,74,0.65));
  mix-blend-mode: multiply;
}
.h2-visual__inner{
  position: relative;
  z-index: 1;
  height: 100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 0 18px;
  text-align:center;
}
.h2-visual__inner h2{
  margin: 0;
  color: #fff;
  font-size: 26px;
  font-weight: 950;
  line-height: 1.25;
  text-shadow: 0 6px 18px rgba(0,0,0,0.55);
}

.strength-detail{ padding: 72px 0; }
.strength-block{
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 18px;
  align-items: center;
}
.strength-block--reverse{ grid-template-columns: 1fr 1.05fr; }
.strength-block--reverse .strength-media{ order: 2; }
.strength-block--reverse .strength-body{ order: 1; }

.strength-media{
  border-radius: var(--radius-xl);
  overflow: hidden;
  border: 1px solid rgba(14,76,140,0.12);
  box-shadow: 0 18px 40px rgba(11,42,74,0.10);
  background:#fff;
}
.strength-media img{
  width: 100%;
  height: 340px;
  object-fit: cover;
  display:block;
}

.strength-body{
  background:#fff;
  border: 1px solid rgba(14,76,140,0.12);
  border-radius: var(--radius-xl);
  box-shadow: 0 18px 40px rgba(11,42,74,0.10);
  padding: 22px 22px;
}
.strength-body p{
  margin: 0;
  font-size: 15.5px;
  font-weight: 720;
  color: rgba(11,42,74,0.74);
  line-height: 1.95;
}

.strength-bottom-cta{
  margin-top: 22px;
  display:flex;
  justify-content:center;
  gap: 12px;
  flex-wrap: wrap;
}

/* =================================================
  index.html：「こ当社の特徴・強み」背景なし調整（維持）
================================================= */
.section-alt .service-target-visual{
  background: none;
  min-height: auto;
}
.section-alt .service-target-visual img{ display:none; }
.section-alt .service-target-visual .section-visual__inner{
  position: static;
  transform: none;
  text-align: center;
  padding: 0 0 40px;
  opacity: 1;
}
.section-alt .service-target-visual h2{
  position: static;
  color: #0b3c5d;
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  line-height: 1.4;
  background: none;
  padding: 0;
  margin: 0;
  text-shadow: none;
}
.section-alt .service-target-visual p{ display:none; }

/* =================================================
  strength split layout（希望デザイン）
================================================= */
.strength-split{ padding: 70px 0; }

.split-feature{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 34px;
  align-items: start;
}

.split-feature__title{
  margin: 0;
  font-size: clamp(22px, 2.2vw, 30px);
  font-weight: 950;
  letter-spacing: -0.01em;
  color: rgba(11,42,74,0.92);
  text-align: left;
}

.split-feature__rule{
  margin-top: 14px;
  height: 2px;
  width: 100%;
  background: linear-gradient(90deg, rgba(14,76,140,0.9), rgba(14,76,140,0.25));
  border-radius: 999px;
}

.split-feature__body{ margin-top: 18px; }
.split-feature__body p{
  margin: 0 0 12px;
  font-size: 15.5px;
  line-height: 1.95;
  font-weight: 760;
  color: rgba(11,42,74,0.72);
}

.split-feature__media{
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(14,76,140,0.12);
  box-shadow: 0 18px 40px rgba(11,42,74,0.10);
  background: #fff;
}
.split-feature__media img{
  width: 100%;
  height: 320px;
  object-fit: cover;
  display: block;
}
.split-feature__cta{
  margin-top: 18px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* =================================================
  下層H1は常に表示（IO未適用でも見える）
================================================= */
.page-hero .section-visual__inner{
  opacity: 1 !important;
  transform: none !important;
}

/* =================================================
  Responsive
================================================= */
@media (max-width: 980px){
  .logo-mark{ width:140px; height:40px; }

  .nav{
    position: fixed;
    top:80px; left:0;
    width:100%;
    height: calc(100vh - 80px);
    background: rgba(255,255,255,0.98);
    flex-direction:column;
    align-items:flex-start;
    padding: 18px 18px 28px;
    gap:12px;
    transform: translateX(100%);
    transition: transform .28s ease;
    border-left:1px solid var(--border);
    overflow:auto;
    z-index: 1200;
  }
  .nav a{
    width:100%;
    padding:12px 10px;
    border-radius:12px;
    font-weight:900;
  }
  .nav a:hover{ background: rgba(14,76,140,0.06); }
  .header-cta{ display:none; }

  .burger{ display:block; }

  .site-header.is-open .nav{ transform: translateX(0); }
  .site-header.is-open .burger span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .site-header.is-open .burger span:nth-child(2){ opacity:0; }
  .site-header.is-open .burger span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  .hero{ height:72vh; min-height:460px; margin-bottom: 34px; }
  .hero-content{ padding: 64px 0 44px; }
  .hero-title{ font-size:34px; }

  .worry-band{ padding: 44px 0 52px; }
  .worry-title{ font-size: 26px; }
  .worry-grid{ grid-template-columns: 1fr; gap: 12px; }
  .worry-card__label{ height: 170px; }

  .section{ padding:56px 0; }
  .section-visual{ height:170px; }
  .section-visual--short{ height:150px; }
  .section-visual__inner h2{ font-size:24px; }

  .cta-band{ flex-direction:column; align-items:flex-start; }

  .footer-inner{ flex-direction:column; align-items:center; text-align:center; }
  .footer-links{ justify-content:center; }

  .page-title{ font-size: 26px; }
  .section-head h2{ font-size: 22px; }

  .service-grid{ grid-template-columns: 1fr; }
  .service-grid.service-grid--offers{ grid-template-columns: 1fr; }
  .service-card__label{ height: 210px; }
  .target-grid{ grid-template-columns: 1fr; }

  .strength-block,
  .strength-block--reverse{ grid-template-columns: 1fr; }
  .strength-block--reverse .strength-media{ order: 0; }
  .strength-block--reverse .strength-body{ order: 0; }
  .strength-media img{ height: 220px; }
  .h2-visual{ height: 120px; }
  .h2-visual__inner h2{ font-size: 22px; }

  .split-feature{
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .split-feature__media img{ height: 240px; }

  .service-detail{ padding: 56px 0; }
  .service-detail-title{ font-size: 24px; }
  .service-detail-sub{ font-size: 18px; }
  .service-detail-box{ padding: 22px 20px; }

  .faq-title{ font-size: 24px; }
  .faq-q{ padding: 14px 42px 14px 14px; }
  .faq-a{ padding: 0 14px 14px; }

  .footer-nav-simple{
    justify-content:center;
    text-align:center;
    margin-top: 12px;
  }
}

@media (max-width: 768px){
  .ceo-photos{ grid-template-columns: 1fr; }
  .ceo-photo img{ height: 220px; }
}

@media (max-width: 520px){
  .container{ padding:20px 18px; }
  .hero-title{ font-size:30px; }
  .hero-sub{ font-size:15px; }
  .section-visual{ height:155px; }
  .worry-card__label{ height: 160px; }

  /* SPでタイムライン見やすく */
  .timeline::before{ left: 17px; }
  .tl-dot{ width:34px; height:34px; flex-basis:34px; }
}

@media (max-width: 520px){
  .page-company .container{ padding:1px 18px; }
  .hero-title{ font-size:30px; }
  .hero-sub{ font-size:15px; }
  .section-visual{ height:200px; }
  .worry-card__label{ height: 160px; }

  /* SPでタイムライン見やすく */
  .timeline::before{ left: 17px; }
  .tl-dot{ width:34px; height:34px; flex-basis:34px; }
}

.stgs h3{
  
  font-size: 1.6rem;
  
}

.stgs p{
  
  font-size: 1.1rem;
  
}

.section.strength-summary{
  
  padding: 1.5rem 0; 
  
}

/* =================================================
  index.html セクション余白 統一ルール
================================================= */

/* index の主要3セクションを同じリズムに */
.index-section {
  padding: 88px 0;
}

/* h2 下の余白も統一 */
.index-section > .container > h2,
.index-section .section-title,
.index-section .alt-title {
  margin-bottom: 42px;
}

/* 中の要素が詰まりすぎないように */
.index-section .target-grid,
.index-section .service-grid,
.index-section .worry-grid {
  margin-top: 0;
}

/* SP */
@media (max-width: 980px) {
  .index-section {
    padding: 64px 0;
  }

  .index-section > .container > h2,
  .index-section .section-title,
  .index-section .alt-title {
    margin-bottom: 32px;
  }
}

/* =================================================
  index.html 余白バランス最終調整
================================================= */

/* --- ① 提供サービス：h1 と 2カラムの間を広げる --- */
.page-hero + .section .service-grid,
.page-hero + .section .target-grid{
  margin-top: 42px; /* ← ここが効きます */
}

/* SP */
@media (max-width: 980px){
  .page-hero + .section .service-grid,
  .page-hero + .section .target-grid{
    margin-top: 32px;
  }
}


/* --- ② 当社の特徴・強み：上下余白を揃える --- */
/* 「こんなお悩みありませんか？」と同じ基準 */
.index-section.strength-summary{
  padding-top: 72px;
  padding-bottom: 72px;
}

/* SP */
@media (max-width: 980px){
  .index-section.strength-summary{
    padding-top: 56px;
    padding-bottom: 56px;
  }
}

/* =================================================
  見出し（h1 / h2）上下余白ルール統一
  目的：全ページで見出し→内容の距離を揃える
================================================= */

/* -----------------------------
  h1（ページタイトル）
----------------------------- */
.page-title,
.section > .container > h1,
.section h1 {
  margin-top: 0 !important;
  margin-bottom: 48px !important;
  line-height: 1.2;
}

/* -----------------------------
  h2（セクション見出し）
----------------------------- */
.section h2,
.section-title,
.alt-title {
  margin-top: 0 !important;
  margin-bottom: 40px !important;
  line-height: 1.35;
}

/* -----------------------------
  h2 の直後に続く要素（詰まり防止）
----------------------------- */
.section h2 + *,
.section-title + *,
.alt-title + * {
  margin-top: 0 !important;
}

/* -----------------------------
  スマホ調整
----------------------------- */
@media (max-width: 980px) {

  /* h1 */
  .page-title,
  .section > .container > h1,
  .section h1 {
    margin-bottom: 36px !important;
  }

  /* h2 */
  .section h2,
  .section-title,
  .alt-title {
    margin-bottom: 32px !important;
  }
}

/* =================================================
  News Section Advanced
================================================= */

.news-list {
  max-width: 900px;
  margin: 0 auto;
}

.news-item {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(11,42,74,0.08); /* 薄く細い下線 */
}

/* --- カテゴリーベタ表示 --- */
.news-category {
  font-size: 12px;
  font-weight: 900;
  padding: 6px 14px;
  border-radius: 6px;
  min-width: 110px;
  text-align: center;
  letter-spacing: .03em;
}

/* お知らせ */
.news-category-oshirase {
  background: rgba(14,76,140,0.10);
  color: var(--brand-blue);
  border: 1px solid rgba(14,76,140,0.30);
}

/* 実績紹介（強調） */
.news-category-jisseki {
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  color: #fff;
}

/* 日付 */
.news-item time {
  font-weight: 700;
  font-size: 14px;
  color: rgba(11,42,74,0.60);
  min-width: 110px;
}

/* タイトル */
.news-title {
  font-weight: 750;
  color: var(--brand-navy);
  position: relative;
  transition: color .2s ease;
}

/* ホバーで下線アニメーション */
.news-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0%;
  height: 2px;
  background: var(--brand-cyan);
  transition: width .3s ease;
}

.news-title:hover {
  color: var(--brand-cyan);
}

.news-title:hover::after {
  width: 100%;
}

@media (max-width: 768px){
  .news-item{
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* =================================================
  Contact page form styling (match site tone)
================================================= */

/* できれば body_class() により contact は page-contact が付く想定 */
.page-contact .wpcf7,
.page-contact form,
.wpcf7{
  max-width: 920px;
  margin: 0 auto;
}

/* フォーム全体を「カード」に */
.page-contact .wpcf7 form,
.page-contact form.wpcf7-form,
.wpcf7 form{
  background:#fff;
  border: 1px solid rgba(14,76,140,0.12);
  border-radius: var(--radius-xl);
  box-shadow: var(--card-shadow);
  padding: 28px 30px;
}

/* 各行 */
.wpcf7 form p{
  margin: 0 0 16px;
}

/* ラベル文字（必須/任意の見出し感） */
.wpcf7 form p,
.wpcf7 form label{
  font-weight: 850;
  color: rgba(11,42,74,0.82);
  letter-spacing: .01em;
}

/* 入力UI共通 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 select,
.wpcf7 textarea{
  width: 100%;
  margin-top: 8px;
  padding: 14px 14px;
  border-radius: 14px;
  border: 1px solid rgba(14,76,140,0.18);
  background: #fff;
  color: var(--brand-navy);
  font-size: 16px;
  line-height: 1.6;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

/* テキストエリア */
.wpcf7 textarea{
  min-height: 160px;
  resize: vertical;
}

/* フォーカス時（他ページと同じ“品のある強調”） */
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus{
  border-color: rgba(26,166,183,0.55);
  box-shadow: 0 0 0 4px rgba(26,166,183,0.12);
}

/* select を少しだけ“フォームっぽく” */
.wpcf7 select{
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(11,42,74,0.65) 50%),
    linear-gradient(135deg, rgba(11,42,74,0.65) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 42px;
}

/* 送信ボタン：サイトの btn-primary と統一 */
.wpcf7 input[type="submit"],
.wpcf7 button[type="submit"],
.wpcf7 .wpcf7-submit{
  display: inline-flex;
  align-items:center;
  justify-content:center;
  height: 52px;
  padding: 0 22px;
  border-radius: var(--radius-md);
  border: 0;
  cursor: pointer;
  font-size: 16px;
  font-weight: 950;
  color:#fff;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  box-shadow: 0 12px 26px rgba(14,76,140,0.22);
  transition: transform .08s ease, opacity .2s ease;
}

.wpcf7 input[type="submit"]:hover,
.wpcf7 button[type="submit"]:hover,
.wpcf7 .wpcf7-submit:hover{
  opacity: .92;
}

.wpcf7 input[type="submit"]:active,
.wpcf7 button[type="submit"]:active,
.wpcf7 .wpcf7-submit:active{
  transform: translateY(1px);
}

/* エラーメッセージもサイトのトーンに */
.wpcf7 .wpcf7-not-valid-tip{
  margin