/* ============================================================
   サムライネットワーク株式会社
   スカイブルー基調・極太ゴシック（そらまめ風テイスト強化版）
   ============================================================ */

:root {
  --sky: #29A8E0;
  --sky-deep: #0E7EBF;
  --sky-dark: #0A5C8C;
  --sky-navy: #093F5F;
  /* サムライブルー：専門家の肩書・上下の帯・追加した案内ボタンの共通色 */
  --samurai-blue-background: linear-gradient(120deg, var(--sky) 0%, var(--sky-deep) 100%);
  --sky-pale: #EAF6FD;
  --sky-tint: #CDE9F8;
  --ink: #17384E;
  --gray: #5C7484;
  --white: #FFFFFF;
  --radius-l: 30px;
  --radius-m: 18px;
  /* 参考サイトと同じ M PLUS 1p。丸ゴシックではない標準ゴシックで芯を出す */
  --font-fat: "M PLUS 1p", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", sans-serif;
  --font-body: "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
  --font-serif: "Noto Serif JP", serif;
  /* そらまめ風の斜線ハッチ */
  --hatch-lines: repeating-linear-gradient(
    45deg,
    var(--sky-tint) 0 2px,
    transparent 2px 9px
  );
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 92px; }

body {
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--white);
  line-height: 2.0;
  font-size: 15.5px;
  letter-spacing: 0.02em;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: var(--sky-deep); text-decoration: none; }
ul, ol { list-style: none; }

.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 28px;
  position: relative;
  z-index: 2;
}

section { position: relative; padding: 110px 0; }

.pc { display: inline; }
.sp { display: none; }

/* ============ 出現アニメーション ============ */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
/* 参考サイトの slideup 相当。見出しを深い位置から一気に持ち上げる */
.reveal.slideup {
  transform: translateY(60px);
  transition: opacity 0.9s ease, transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal.is-visible { opacity: 1; transform: none; }
.reveal.d1 { transition-delay: 0.1s; }
.reveal.d2 { transition-delay: 0.2s; }
.reveal.d3 { transition-delay: 0.3s; }
.reveal.d4 { transition-delay: 0.4s; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* ============ ヘッダー ============ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  box-shadow: 0 1px 0 var(--sky-tint);
}

.header-inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 12px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.brand { display: flex; align-items: center; gap: 13px; }

/* 会社案内 PDF から抜いた正式ロゴ。縦を固定して横は自動、原寸比を崩さない */
.brand-logo {
  height: 30px;
  width: auto;
  display: block;
  flex: none;
}

.brand-name {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 15px;
  color: var(--ink);
  letter-spacing: 0.04em;
  padding-left: 13px;
  border-left: 1px solid var(--sky-tint);
  line-height: 1.3;
}

.global-nav { display: flex; align-items: center; gap: 28px; }
.global-nav a {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 14px;
  color: var(--ink);
  letter-spacing: 0.05em;
  position: relative;
  padding: 4px 0;
}
.global-nav a:not(.nav-cta)::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sky);
  transform: translateX(-50%) scale(0);
  transition: transform 0.2s;
}
.global-nav a:not(.nav-cta):hover::after { transform: translateX(-50%) scale(1); }
.global-nav a:hover { color: var(--sky-deep); }

.nav-cta {
  background: var(--sky);
  color: #fff !important;
  padding: 12px 26px;
  border-radius: 60% 40% 55% 45% / 50% 55% 45% 50%;
  transition: background 0.2s, border-radius 0.3s;
  box-shadow: 0 4px 14px rgba(41, 168, 224, 0.4);
}
.nav-cta:hover { background: var(--sky-deep); border-radius: 999px; }

/* ============ 共通パーツ ============ */
.section-label {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.32em;
  color: var(--sky);
  margin-bottom: 16px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 12px;
}
.section-label::before {
  content: "";
  width: 34px;
  height: 3px;
  border-radius: 3px;
  background: var(--sky);
  flex: none;
  transform: scaleX(0.15);
  transform-origin: left center;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.1s;
}
.section-label.is-visible::before,
.section-label.on::before { transform: scaleX(1); }

/* 見出しは「大きく・太く・詰める」。字間をマイナスに振るのが参考サイトの効き所 */
.section-title {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(29px, 5.2vw, 62px);
  line-height: 1.3;
  letter-spacing: -0.03em;
  margin-bottom: 28px;
  color: var(--ink);
}

/* 1文字ずつ下からせり上げる。親のフェードは切って文字側に任せる */
.reveal.split { opacity: 1; transform: none; }
.split .ch {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.62em) rotate(5deg);
  transition:
    opacity 0.45s ease calc(var(--i) * 26ms),
    transform 0.62s cubic-bezier(0.2, 0.85, 0.3, 1.25) calc(var(--i) * 26ms);
}
.split.is-visible .ch { opacity: 1; transform: none; }

/* 参考サイトの手法。一文の中でキーワードだけ拡大＋色替えして圧をつける。
   line-height を詰めているのは、拡大した文字で行送りが広がるのを防ぐため */
.kw,
.num-accent {
  color: var(--sky);
  font-size: 1.45em;
  line-height: 0.85;
  letter-spacing: -0.05em;
  padding: 0 0.03em;
}
.num-accent { font-size: 1.95em; }

/* 「最短3日」相当の巨大ステートメント。コンテナを左に突き抜けさせる */
.big-stat {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(40px, 8.4vw, 118px);
  line-height: 1;
  letter-spacing: -0.06em;
  color: var(--ink);
  white-space: nowrap;
  margin: 0 0 30px calc(50% - 50vw + 30px);
}
.big-stat b {
  color: var(--sky);
  font-weight: 900;
  font-size: 1.3em;
  letter-spacing: -0.07em;
}

.sub-title {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 25px;
  line-height: 1.36;
  letter-spacing: -0.03em;
  margin-bottom: 16px;
}

.section-lead { max-width: 800px; margin-bottom: 34px; }
.section-lead strong { color: var(--sky-deep); }

/* 巨大英字ウォーターマーク（そらまめの MERIT 風） */
.watermark {
  position: absolute;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(90px, 15vw, 210px);
  letter-spacing: 0.06em;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 2px var(--sky-pale);
  white-space: nowrap;
  z-index: 1;
  pointer-events: none;
  user-select: none;
}
.watermark-light { -webkit-text-stroke-color: rgba(255, 255, 255, 0.75); }
.watermark-onblue { -webkit-text-stroke-color: rgba(255, 255, 255, 0.16); }

/* ボタン */
.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  background: var(--sky);
  color: #fff;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 16px;
  padding: 16px 40px;
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(41, 168, 224, 0.45);
  transition: transform 0.15s, background 0.2s, box-shadow 0.2s;
}
.btn-primary:hover {
  background: var(--sky-deep);
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(14, 126, 191, 0.5);
}
.btn-large { font-size: 18px; padding: 20px 56px; }

/* 主ボタンと並べる副ボタン。淡いブルーの面に置くので地は白で抜く */
.btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  color: var(--sky-deep);
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 15px;
  padding: 15px 32px;
  border: 2px solid var(--sky-tint);
  border-radius: 999px;
  transition: border-color 0.2s, color 0.2s, transform 0.15s;
}
.btn-outline:hover {
  border-color: var(--sky);
  color: var(--sky-dark);
  transform: translateY(-2px);
}

.btn-arrow {
  font-style: normal;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.25);
  display: grid;
  place-items: center;
  font-size: 15px;
  transition: transform 0.2s;
}
.btn-primary:hover .btn-arrow { transform: translateX(4px); }

/* 淡色ブロブ */
.blob {
  position: absolute;
  width: 680px;
  height: 600px;
  background: var(--sky-pale);
  border-radius: 58% 42% 55% 45% / 48% 55% 45% 52%;
  z-index: 0;
}
.blob-right { right: -280px; top: 60px; }
.blob-left { left: -300px; bottom: -80px; }

/* そらまめ風の斜線ハッチ枠 */
.hatch {
  background-image: var(--hatch-lines);
  border-radius: calc(var(--radius-l) + 10px);
  padding: 10px;
}
.hatch > * { height: 100%; }
.hatch-deep {
  background-image: repeating-linear-gradient(45deg, var(--sky) 0 2px, transparent 2px 9px);
  opacity: 1;
}

/* 波の区切り */
.wave { line-height: 0; margin: -1px 0; position: relative; z-index: 3; }
.wave svg { width: 100%; height: 90px; display: block; }

/* タグ・チップ */
.tag-cloud { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.tag-cloud li {
  background: #fff;
  border: 2px solid var(--sky);
  color: var(--sky-deep);
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 13.5px;
  padding: 7px 18px;
  border-radius: 999px;
  transition: background 0.2s, color 0.2s;
}
.tag-cloud li:hover { background: var(--sky); color: #fff; }
.tag-cloud.small li { font-size: 12px; padding: 4px 13px; border-width: 1.5px; }

.dash-list li {
  padding: 9px 0 9px 24px;
  position: relative;
  border-bottom: 1px dashed var(--sky-tint);
  font-size: 14.5px;
}
.dash-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 10px;
  height: 10px;
  border-radius: 50% 50% 50% 10%;
  background: var(--sky);
}

/* ============ ヒーロー ============ */
.hero {
  padding: 138px 0 118px;
  overflow: hidden;
  min-height: 82vh;
  display: flex;
  align-items: center;
}

.hero-inner {
  max-width: 1240px;
  width: 100%;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 20px;
  align-items: center;
}

.hero-illust svg,
.hero-illust img { width: 100%; height: auto; display: block; }
.hero-illust {
  min-width: 0;
  position: relative;
  margin-right: -22px;
}
/* FV コピー。詰め字（-0.05em）と行間1.2で塊として見せるのが要 */
.hero-title {
  position: relative;
  /* em の下線を「見出しの中の背面」に閉じ込める（背景ブロブに潜らせない） */
  isolation: isolate;
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(29px, 4.4vw, 60px);
  line-height: 1.2;
  letter-spacing: -0.05em;
  color: var(--sky-deep);
  margin-bottom: 40px;
}
@media (min-width: 961px) {
  .hero-title { white-space: nowrap; }
}
/* FV は完成形を初期HTMLから表示し、導入用コピーはレイアウトに入れない。 */
.type-block { display: block; }
.hero-title .type-block[data-delete] { display: none; }
.type-line { display: block; }

.hero-title em {
  font-style: normal;
  color: var(--ink);
  position: relative;
}
.hero-title em::after {
  content: "";
  position: absolute;
  left: 0.04em;
  right: 0.04em;
  bottom: 0.14em;
  height: 0.22em;
  background: var(--sky-tint);
  z-index: -1;
  border-radius: 999px;
  transform: none;
}

/* FV のラベル・補足文も完成位置で表示。他セクションの出現演出は変更しない。 */
.hero-label,
.hero-late { opacity: 1; transform: none; }
.hero-label::before { transform: scaleX(1); transition: none; }

.hero-point {
  display: inline-block;
  background: #fff;
  border: 2.5px solid var(--sky);
  border-radius: var(--radius-m);
  padding: 20px 32px;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 17px;
  color: var(--sky-dark);
  box-shadow: 8px 8px 0 var(--sky-tint);
  margin-bottom: 30px;
  line-height: 1.9;
}

.hero-lead { max-width: 660px; color: var(--gray); }

.scroll-down {
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 10.5px;
  letter-spacing: 0.3em;
  color: var(--sky);
  z-index: 3;
}
.scroll-down i {
  width: 1.5px;
  height: 42px;
  background: var(--sky);
  display: block;
  transform-origin: top;
}


/* ============ 団体別入口ストリップ ============ */
.org-strip { padding: 20px 0 110px; }

.org-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.org-list a {
  display: block;
  height: 100%;
  background: #fff;
  border: 2px dashed var(--sky);
  border-radius: 22px;
  padding: 22px 18px;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--ink);
  transition: background 0.2s, transform 0.2s, box-shadow 0.2s, border-style 0.2s;
}
.org-list a:hover {
  background: var(--sky-pale);
  border-style: solid;
  transform: translateY(-5px);
  box-shadow: 0 12px 24px rgba(41, 168, 224, 0.22);
}

.org-num {
  display: block;
  font-size: 12px;
  letter-spacing: 0.24em;
  color: var(--sky);
  margin-bottom: 8px;
  font-weight: 800;
}

.org-go {
  display: block;
  margin-top: 14px;
  font-size: 12px;
  color: var(--sky-deep);
}

/* ============ 専門家チーム ============ */
.team { background: var(--sky-pale); overflow: hidden; }
.team .watermark { -webkit-text-stroke-color: rgba(255, 255, 255, 0.9); }
.team .section-lead { margin-bottom: 48px; }
.team .hatch { background-image: repeating-linear-gradient(45deg, rgba(41,168,224,0.35) 0 2px, transparent 2px 9px); margin-bottom: 24px; }

.team-group {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 30px 32px 34px;
}

.team-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 24px;
}
.team-row .hatch { margin-bottom: 0; }
/* 4カラムの狭い枠では 9文字の肩書がピル内で割れるため、この行だけ小さく組む。
   スマホは2カラムでさらに狭いので、下のブレークポイント側の値を使わせる */
@media (min-width: 621px) {
  .team-row .team-group { padding: 26px 18px 28px; }
  .team-row .team-cat { font-size: 14px; padding: 7px 16px; line-height: 1.45; }
}
.team-row.two { grid-template-columns: 3fr 1.15fr; }

.team-cat {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 18px;
  color: #fff;
  background: var(--samurai-blue-background);
  display: inline-block;
  padding: 8px 28px;
  border-radius: 999px;
  margin-bottom: 24px;
  box-shadow: 0 4px 12px rgba(41, 168, 224, 0.35);
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 22px 14px;
}
.team-grid.one { grid-template-columns: 1fr; }

.team-grid li { text-align: center; }

.avatar {
  width: 92px;
  height: 92px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 32% 28%, #fff 0%, var(--sky-pale) 55%, var(--sky-tint) 100%);
  border: 3px solid #fff;
  outline: 2.5px solid var(--sky-tint);
  color: var(--sky-deep);
  font-family: var(--font-serif);
  font-size: 32px;
  display: grid;
  place-items: center;
  transition: outline-color 0.2s, transform 0.2s;
}

/* 顔写真版。元素材が 120px 前後のものがあり、拡大時の眠さを contrast で少し戻す */
img.avatar {
  display: block;
  object-fit: cover;
  box-shadow: 0 3px 10px rgba(17, 62, 82, 0.13);
  filter: saturate(1.04) contrast(1.03);
}
.team-grid li:hover .avatar { outline-color: var(--sky); transform: translateY(-4px); }

.t-name {
  display: block;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 15px;
  line-height: 1.5;
}

.t-org {
  display: block;
  font-size: 11px;
  color: var(--gray);
  line-height: 1.55;
  margin-top: 3px;
}

.team-note {
  margin-top: 22px;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 16px;
  color: var(--sky-dark);
  text-align: center;
}

/* ============ 3つの事業 ============ */
.services { background: #fff; overflow: hidden; padding-top: 130px; }

.services-intro {
  max-width: 760px;
  margin: 0 auto 40px;
  text-align: center;
}
.services-intro .section-label { justify-content: center; }
.services-intro .section-title { margin-bottom: 20px; }
.services-intro .section-lead { margin-bottom: 0; }

.service-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}

.service-card {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 26px 30px 36px;
  position: relative;
  height: 100%;
}

/* 3事業は記号アイコンでは伝わらなかったので、各事業を「人がその行為をしている絵」で示す。
   3枚は縦横比が違うため、絵の高さを揃えてカード同士の見出し位置をそろえる。
   高さは % ではなく px。グリッド／フレックス項目の % 高さは解決されず素通りする */
.service-figure {
  margin: -26px -30px 20px;
  height: 210px;
  border-radius: var(--radius-l) var(--radius-l) 0 0;
  background: var(--sky-pale);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.service-figure img {
  max-height: 186px;
  max-width: 86%;
  width: auto;
  height: auto;
  display: block;
}

.service-no {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 11.5px;
  letter-spacing: 0.16em;
  color: var(--sky);
  margin-bottom: 12px;
}

.service-card h3 {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 25px;
  line-height: 1.34;
  letter-spacing: -0.03em;
  margin-bottom: 16px;
}

.service-card h3 small {
  display: block;
  margin-top: 8px;
  font-size: 14px;
  font-weight: 800;
  color: var(--sky-dark);
  letter-spacing: 0;
  line-height: 1.5;
}

.service-card p { font-size: 14px; margin-bottom: 16px; }

.service-note {
  background: var(--sky-pale);
  border-radius: var(--radius-m);
  padding: 18px 20px;
  margin-top: 18px;
}
.service-note h4 {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 14px;
  color: var(--sky-dark);
  margin-bottom: 6px;
}
.service-note p { font-size: 12.5px; margin: 0; }

.service-audience {
  background: var(--sky-pale);
  border-radius: var(--radius-m);
  padding: 16px 18px;
  margin-top: 8px;
}

.service-audience h4 {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 14px;
  color: var(--sky-dark);
  margin-bottom: 8px;
}

.service-audience .dash-list { margin: 0; }

/* ============ リスク管理サービス ============ */
.risk { background: var(--sky-pale); overflow: hidden; padding-top: 130px; }
.risk .watermark { -webkit-text-stroke-color: rgba(255, 255, 255, 0.9); }

.risk-catch {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 21px;
  color: var(--sky-dark);
  margin-bottom: 20px;
  line-height: 1.9;
}

.highlight-box {
  background: linear-gradient(135deg, var(--sky) 0%, var(--sky-deep) 100%);
  color: #fff;
  border-radius: var(--radius-l);
  padding: 44px 48px;
  margin: 40px 0 60px;
  box-shadow: 0 16px 40px rgba(14, 126, 191, 0.35);
  position: relative;
  overflow: hidden;
}
.highlight-box::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -90px;
  width: 260px;
  height: 240px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 58% 42% 55% 45% / 48% 55% 45% 52%;
}

.hl-head {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 23px;
  margin-bottom: 16px;
  line-height: 1.8;
}

/* 役割ラベルを読める大きさで入れるため、図は横幅いっぱいの帯として本文の下に置く */
.highlight-box { display: block; }

.hl-close {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1.5px dashed rgba(255, 255, 255, 0.45);
}
.hl-close strong { font-weight: 900; }
.rc-illust {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1.5px dashed rgba(255, 255, 255, 0.45);
}
.rc-illust svg { width: 100%; height: auto; position: relative; z-index: 1; }
.rc-illust .rc-tall { display: none; }
/* 横並び版のラベルが 10px を切る幅から縦積み版に切り替える */
@media (max-width: 860px) {
  .rc-illust .rc-wide { display: none; }
  .rc-illust .rc-tall { display: block; max-width: 340px; margin: 0 auto; }
}

.risk .hatch { margin-bottom: 70px; background-image: repeating-linear-gradient(45deg, rgba(41,168,224,0.35) 0 2px, transparent 2px 9px); }

.worry {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 46px 50px;
}

.worry-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
}
.worry-illust { flex: none; width: 168px; }
.worry-illust svg,
.worry-illust img { width: 100%; height: auto; display: block; }

.worry h3 {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(25px, 3.4vw, 34px);
  line-height: 1.3;
  letter-spacing: -0.03em;
  margin-bottom: 12px;
}

.worry > p { margin-bottom: 26px; color: var(--gray); }

.check-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 32px;
}

.check-list li {
  background: var(--sky-pale);
  border-radius: 14px;
  padding: 13px 18px 13px 48px;
  position: relative;
  font-size: 14px;
  font-weight: 500;
}
.check-list li::before {
  content: "✓";
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border-radius: 8px;
  background: var(--sky);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  display: grid;
  place-items: center;
}

/* FLOW 直前の一言。上の .highlight-box と同じ青のグラデーションだと帯が二枚続いて
   見えるので、こちらは濃紺側に振って別の役割の面だと分かるようにしている */
.specialty {
  background: linear-gradient(135deg, var(--sky-dark) 0%, var(--sky-navy) 100%);
  color: #fff;
  border-radius: var(--radius-l);
  padding: 44px 52px;
  margin-bottom: 70px;
  box-shadow: 0 16px 40px rgba(9, 63, 95, 0.32);
  position: relative;
  overflow: hidden;
}
.specialty::after {
  content: "";
  position: absolute;
  right: -80px;
  top: -70px;
  width: 250px;
  height: 230px;
  background: rgba(255, 255, 255, 0.07);
  border-radius: 58% 42% 55% 45% / 48% 55% 45% 52%;
}

.specialty-label {
  display: inline-block;
  background: var(--sky);
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.14em;
  padding: 7px 22px;
  border-radius: 999px;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}

.specialty-copy {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(23px, 3.7vw, 42px);
  line-height: 1.45;
  letter-spacing: -0.04em;
  position: relative;
  z-index: 1;
}
.specialty-copy em {
  font-style: normal;
  position: relative;
}
/* 白文字の上に白線は引けないので、下線はスカイブルーで入れる */
.specialty-copy em::after {
  content: "";
  position: absolute;
  left: 0.02em;
  right: 0.02em;
  bottom: 0.1em;
  height: 0.2em;
  background: var(--sky);
  border-radius: 999px;
  z-index: -1;
}

/* FLOW */
.flow { margin-bottom: 70px; }

.flow-steps {
  margin: 28px 0 40px;
  counter-reset: step;
}

.flow-steps li {
  display: flex;
  gap: 28px;
  padding: 26px 30px;
  background: #fff;
  border-radius: var(--radius-m);
  margin-bottom: 14px;
  position: relative;
  box-shadow: 0 3px 14px rgba(23, 56, 78, 0.05);
}
.flow-steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 55px;
  bottom: -14px;
  width: 3px;
  height: 14px;
  background: var(--sky-tint);
}

.flow-no {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 34px;
  line-height: 1.2;
  color: var(--sky);
  flex: none;
  width: 60px;
}

.flow-steps h4 {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 17.5px;
  margin-bottom: 4px;
}

.flow-steps p { font-size: 14px; color: var(--gray); }

.flow-summary {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 38px 42px;
  border-left: 8px solid var(--sky);
  box-shadow: 0 4px 20px rgba(23, 56, 78, 0.06);
}

.flow-summary h4 {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 21px;
  color: var(--sky-dark);
  margin-bottom: 12px;
}

/* 6ステップの流れ。矢印は擬似要素で挟み、折り返した行頭では消す */
.icon-flow {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
  margin-top: 26px;
  list-style: none;
}

.icon-flow li {
  position: relative;
  text-align: center;
}

.icon-flow li:not(:first-child)::before {
  content: "";
  position: absolute;
  left: -5px;
  top: 27px;
  width: 10px;
  height: 10px;
  border-top: 2.5px solid var(--sky);
  border-right: 2.5px solid var(--sky);
  transform: translateX(-50%) rotate(45deg);
}

.if-art {
  width: 56px;
  height: 56px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: #fff;
  border: 2.5px solid var(--sky-tint);
  display: grid;
  place-items: center;
  box-shadow: 0 5px 12px rgba(41, 168, 224, 0.18);
}
.if-art svg { width: 30px; height: 30px; }

.icon-flow p {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 12.5px;
  line-height: 1.4;
  color: var(--sky-deep);
}

.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: stretch;
}

.emphasis-text { font-size: 16px; margin-bottom: 24px; }
.emphasis-text strong { color: var(--sky-deep); }

.quote-box {
  background: #fff;
  border: 2px dashed var(--sky);
  border-radius: var(--radius-m);
  padding: 26px 28px;
}
.quote-box h4 {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 16px;
  color: var(--sky-dark);
  margin-bottom: 8px;
}
.quote-box p { font-size: 13.5px; }

.risk-closing {
  max-width: 880px;
  margin: 64px auto 0;
  text-align: center;
  font-size: 15.5px;
}
.risk-closing strong {
  display: block;
  margin-top: 16px;
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 22px;
  color: var(--sky-deep);
}

/* ============ ネットワーク ============ */
.network { background: #fff; overflow: hidden; padding-top: 130px; }
.network .watermark { -webkit-text-stroke-color: var(--sky-pale); }
.network .blob-left { background: var(--sky-pale); }

.network-body { margin-bottom: 80px; }

.network-text {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 48px;
}
.network-text .stats,
.network-text .tag-cloud { grid-column: 1 / -1; }

/* 相談者 → 窓口（RC） → 専門家チーム の3層図 */
.relay {
  display: grid;
  grid-template-columns: 260px 90px minmax(300px, 1fr);
  align-items: center;
  background: var(--sky-pale);
  border-radius: var(--radius-l);
  padding: 40px 34px;
  margin-bottom: 52px;
}

.relay-stage { text-align: center; }

.relay-cap {
  display: inline-block;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--sky-deep);
  background: #fff;
  border: 1.5px solid var(--sky-tint);
  padding: 4px 13px;
  border-radius: 999px;
  margin-bottom: 14px;
}
.relay-face {
  display: block;
  width: 84px;
  height: 84px;
  margin: 0 auto 12px;
  border-radius: 50%;
  overflow: hidden;
  background: #fff;
  border: 3px solid var(--sky-tint);
}
.relay-face svg { width: 100%; height: 100%; display: block; }

.relay-stage.rc .relay-face {
  width: 108px;
  height: 108px;
  border-color: #fff;
  background: linear-gradient(150deg, var(--sky) 0%, var(--sky-deep) 100%);
  box-shadow: 0 14px 30px rgba(14, 126, 191, 0.36);
}

.relay-role {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 15px;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin-bottom: 4px;
}
.relay-stage.rc .relay-role { font-size: 17px; color: var(--sky-deep); }

.relay-sub { font-size: 11.5px; line-height: 1.6; color: var(--muted); }

.relay-fan { align-self: stretch; min-height: 240px; }
.relay-fan svg { width: 100%; height: 100%; display: block; }

.relay-team { text-align: center; }
.relay-team ul { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 10px; }
.relay-team li {
  background: #fff;
  border: 2px solid var(--sky-tint);
  border-radius: 999px;
  padding: 7px 8px;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 12.5px;
  color: var(--sky-dark);
}

.network-text p { margin-bottom: 18px; }

.stats {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 44px;
  margin: 30px 0;
}

.stats dt {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: 60px;
  line-height: 1;
  color: var(--sky);
  letter-spacing: 0.01em;
}
.stats dt span { font-size: 28px; }

.stats dd { font-size: 13px; color: var(--gray); margin-top: 8px; line-height: 1.7; }

.stats-4 { grid-template-columns: repeat(4, 1fr); gap: 24px; }

.first-point {
  text-align: center;
  background: #fff;
  border-radius: var(--radius-l);
  padding: 64px 32px;
}

.first-point .section-label { justify-content: center; }
.first-point .section-label::before { display: none; }

.first-point h3 {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(27px, 4.3vw, 48px);
  line-height: 1.34;
  letter-spacing: -0.035em;
  margin-bottom: 32px;
}

/* ============ 講演 ============ */
.lectures { background: var(--sky-pale); overflow: hidden; padding-top: 130px; }
.lectures .watermark { -webkit-text-stroke-color: rgba(255, 255, 255, 0.9); }
.lectures .hatch { background-image: repeating-linear-gradient(45deg, rgba(41,168,224,0.35) 0 2px, transparent 2px 9px); }

.lect-intro {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 56px;
  align-items: center;
  margin-bottom: 40px;
}
.lect-intro .section-lead { margin-bottom: 0; }
.lect-illust svg,
.lect-illust img { width: 100%; height: auto; display: block; }

.lecture-box {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 34px 36px;
  height: 100%;
}

/* ============ 実績 ============ */
.track { background: #fff; overflow: hidden; padding-top: 130px; }
.track .watermark { -webkit-text-stroke-color: var(--sky-pale); }
.track .blob-right { background: var(--sky-pale); }

.track .hatch { margin: 44px 0 52px; }

.stats-panel {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 44px 46px;
  margin: 0;
  text-align: center;
}

.voice-head { text-align: center; margin: 72px 0 30px; }
.voice-head .section-label { justify-content: center; }
.voice-head .section-label::before { display: none; }
.voice-head .sub-title { margin-bottom: 0; }

.voice-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}

/* 吹き出しを伸ばして、話し手アイコンの高さを3枚で揃える */
.voice-cards figure { display: flex; flex-direction: column; transition: transform 0.2s; }
.voice-cards blockquote { flex: 1; }
.voice-cards figure:hover { transform: translateY(-6px); }

/* 吹き出し。下向きのしっぽで「話し手の言葉」だと一目で分かるようにする */
.voice-cards blockquote {
  background: #fff;
  border: 2.5px solid var(--sky-tint);
  border-radius: var(--radius-l);
  padding: 30px 28px 26px;
  position: relative;
  box-shadow: 0 8px 20px rgba(41, 168, 224, 0.12);
}
.voice-cards blockquote::before,
.voice-cards blockquote::after {
  content: "";
  position: absolute;
  left: 44px;
  width: 0;
  height: 0;
  border-style: solid;
}
.voice-cards blockquote::before {
  bottom: -20px;
  border-width: 20px 15px 0 0;
  border-color: var(--sky-tint) transparent transparent transparent;
}
.voice-cards blockquote::after {
  bottom: -15px;
  border-width: 16px 12px 0 0;
  border-color: #fff transparent transparent transparent;
}

.voice-mark {
  font-family: var(--font-serif);
  font-size: 52px;
  line-height: 0.7;
  color: var(--sky-tint);
  display: block;
  margin-bottom: 6px;
}

.voice-cards p { font-size: 14px; }

.voice-cards figcaption {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 30px 0 0 22px;
}

.voice-face {
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: 50%;
  overflow: hidden;
  background: var(--sky-pale);
  border: 2.5px solid #fff;
  box-shadow: 0 4px 10px rgba(14, 126, 191, 0.2);
}
.voice-face svg { width: 100%; height: 100%; display: block; }

.voice-who {
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 13.5px;
  color: var(--sky-deep);
  line-height: 1.4;
}
.voice-who small { font-size: 11px; font-weight: 700; color: var(--muted); margin-left: 4px; }

/* ============ 認定資格 ============ */
.certification { background: var(--sky-pale); overflow: hidden; padding-top: 130px; }
.certification .watermark { -webkit-text-stroke-color: rgba(255, 255, 255, 0.9); }

.cert-body { margin-bottom: 44px; align-items: stretch; }

.cert-title-sub {
  display: block;
  margin-top: 8px;
  font-size: clamp(24px, 4vw, 42px);
}

.cert-target {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 28px 32px;
  margin-bottom: 28px;
  box-shadow: 0 3px 14px rgba(23, 56, 78, 0.05);
}

.cert-target-title {
  font-family: var(--font-fat);
  font-size: 18px;
  font-weight: 900;
  color: var(--sky-dark);
  margin-bottom: 12px;
}

.cert-target .dash-list { margin: 0; }

.cert-seminar {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 34px 36px;
  margin-bottom: 36px;
  box-shadow: 0 3px 14px rgba(23, 56, 78, 0.05);
}

.cert-seminar .sub-title {
  margin-bottom: 18px;
  line-height: 1.45;
}

.cert-seminar p {
  font-size: 14.5px;
  margin-bottom: 14px;
}

.cert-seminar p:last-child { margin-bottom: 0; }

.cert-stats {
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 0;
}
.cert-stats > div {
  background: #fff;
  border-radius: var(--radius-m);
  padding: 26px 28px;
  box-shadow: 0 3px 14px rgba(23, 56, 78, 0.05);
}
.cert-stats dt { font-size: 44px; }

.cert-quote {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 38px 40px;
  height: 100%;
}

.cert-illust {
  width: 190px;
  margin: 0 auto 20px;
}
.cert-illust svg { width: 100%; height: auto; display: block; }

.cert-quote-main {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 23px;
  line-height: 1.9;
  color: var(--sky-dark);
  margin-bottom: 10px;
}

.cert-quote cite {
  font-style: normal;
  font-size: 13px;
  color: var(--gray);
  display: block;
  margin-bottom: 18px;
}

.cert-quote p:last-child { font-size: 14px; }

.certification .hatch { background-image: repeating-linear-gradient(45deg, rgba(41,168,224,0.35) 0 2px, transparent 2px 9px); }

.cert-detail {
  background: #fff;
  border-radius: var(--radius-m);
  margin-bottom: 48px;
  box-shadow: 0 3px 14px rgba(23, 56, 78, 0.05);
}

.cert-detail summary {
  cursor: pointer;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 16px;
  color: var(--sky-deep);
  padding: 22px 28px;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 14px;
}
.cert-detail summary::-webkit-details-marker { display: none; }
.cert-detail summary::before {
  content: "＋";
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--sky);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 16px;
  flex: none;
  transition: transform 0.2s;
}
.cert-detail[open] summary::before { content: "－"; transform: rotate(180deg); }
.cert-detail summary:hover { color: var(--sky-dark); }

.cert-detail-body { padding: 4px 34px 34px; }
.cert-detail-body p { margin-bottom: 18px; font-size: 14.5px; }
.cert-detail-body strong { color: var(--sky-dark); }

.cert-cta { text-align: center; }
.cert-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 16px;
}
.cert-cta-note {
  max-width: 620px;
  margin: 20px auto 0;
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--muted);
}
.cert-cta .tag-cloud { justify-content: center; margin-top: 24px; }

/* ============ 団体別窓口 ============ */
.partner { background: #fff; }

.partner-note { margin-top: 32px; }
.partner-note a { font-family: var(--font-fat); font-weight: 800; }

/* ============ AIM ============ */
.aim {
  background: linear-gradient(155deg, var(--sky-deep) 0%, var(--sky) 70%, #4FC0EE 100%);
  color: #fff;
  overflow: hidden;
  padding: 140px 0;
}
.aim .blob-left { background: rgba(255, 255, 255, 0.09); }
.aim .section-label { color: rgba(255, 255, 255, 0.9); justify-content: center; }
.aim .section-label::before { background: rgba(255, 255, 255, 0.9); }

.aim-inner { text-align: center; max-width: 840px; }

.aim-title {
  font-family: var(--font-fat);
  font-weight: 900;
  font-size: clamp(28px, 4.8vw, 54px);
  line-height: 1.36;
  letter-spacing: -0.035em;
  margin-bottom: 30px;
}

.aim-title em { font-style: normal; }

.aim-three {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
  margin: 36px 0;
}

.aim-three span {
  background: rgba(255, 255, 255, 0.14);
  border: 2px solid rgba(255, 255, 255, 0.7);
  border-radius: 999px;
  padding: 13px 32px;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 16px;
}

.aim-skyline {
  max-width: 620px;
  margin: 34px auto 6px;
}
.aim-skyline svg { width: 100%; height: auto; display: block; }

/* ============ 会社概要 ============ */
.company { background: #fff; overflow: hidden; padding-top: 130px; }
.company .watermark { -webkit-text-stroke-color: var(--sky-pale); }

.company-body { gap: 56px; }

.company-table {
  width: 100%;
  border-collapse: collapse;
}

.company-table th,
.company-table td {
  text-align: left;
  padding: 20px 10px;
  border-bottom: 1.5px solid var(--sky-tint);
  vertical-align: top;
  font-size: 15px;
}

.company-table th {
  width: 30%;
  font-family: var(--font-fat);
  font-weight: 800;
  color: var(--sky-dark);
  white-space: nowrap;
}

.mission {
  background: var(--sky-pale);
  border-radius: var(--radius-l);
  padding: 40px 42px;
  height: 100%;
}

.mission-quote {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 25px;
  line-height: 2.0;
  color: var(--sky-dark);
  margin-bottom: 18px;
}

.mission p:last-child { font-size: 14px; }

/* ============ お問い合わせ ============ */
.contact { background: var(--sky-pale); overflow: hidden; padding-top: 130px; }
.contact .watermark { -webkit-text-stroke-color: rgba(255, 255, 255, 0.9); }

.contact .hatch { background-image: repeating-linear-gradient(45deg, rgba(41,168,224,0.5) 0 2px, transparent 2px 9px); }

.contact-form-wrap {
  background: #fff;
  border-radius: var(--radius-l);
  padding: 56px 56px 60px;
}

.contact-illust {
  width: 185px;
  margin: 0 auto 26px;
}
.contact-illust svg { width: 100%; height: auto; display: block; }

.contact-form { max-width: 720px; margin: 0 auto; }

/* 項目どうしは点線で仕切る。枠線で囲むと入力欄と competing して数が多く見えるため */
.cf-field {
  border: 0;
  padding: 22px 0;
  border-bottom: 1px dashed var(--sky-tint);
}
.cf-field:first-of-type { padding-top: 0; }

.cf-label,
.cf-field legend {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-fat);
  font-weight: 800;
  font-size: 15.5px;
  color: var(--sky-dark);
  margin-bottom: 12px;
  padding: 0;
}

.cf-req,
.cf-opt {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 3px 10px;
  border-radius: 999px;
  line-height: 1.6;
}
.cf-req { background: var(--sky); color: #fff; }
.cf-opt { background: var(--sky-pale); color: var(--gray); }

.cf-note { font-size: 12.5px; color: var(--gray); margin: -6px 0 12px; line-height: 1.7; }

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form input[type="date"],
.contact-form textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: 15.5px;
  color: var(--ink);
  background: var(--sky-pale);
  border: 2px solid transparent;
  border-radius: 14px;
  padding: 14px 16px;
  line-height: 1.7;
  transition: border-color 0.18s, background 0.18s;
}
.contact-form textarea { resize: vertical; min-height: 120px; }
.contact-form input:focus,
.contact-form textarea:focus {
  outline: none;
  background: #fff;
  border-color: var(--sky);
}
.contact-form ::placeholder { color: #9DB4C2; }

.cf-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cf-sub { display: block; }
.cf-sub > span {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--gray);
  margin-bottom: 5px;
  letter-spacing: 0.06em;
}
.cf-half input { max-width: 320px; }

.cf-options { display: flex; flex-wrap: wrap; gap: 10px; }
.cf-options-inline .cf-check { min-width: 130px; }

/* 選択肢はカード全体を当たり判定にする（スマホでチェックボックスの点を狙わせない） */
.cf-check {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--sky-pale);
  border: 2px solid transparent;
  border-radius: 14px;
  padding: 12px 18px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.18s, background 0.18s;
}
.cf-check:hover { border-color: var(--sky-tint); }
.cf-check input { accent-color: var(--sky); width: 18px; height: 18px; flex: none; cursor: pointer; }
.cf-check:has(input:checked) {
  background: #fff;
  border-color: var(--sky);
  color: var(--sky-dark);
  font-weight: 700;
}
.cf-check:focus-within { border-color: var(--sky); }

.cf-consent {
  align-items: flex-start;
  font-size: 13.5px;
  line-height: 1.8;
  padding: 16px 20px;
}
.cf-consent input { margin-top: 4px; }
.cf-consent .cf-req { margin-left: 8px; display: inline-block; vertical-align: 1px; }

.cf-error {
  color: #C8382F;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.7;
  margin-top: 8px;
}
.cf-error:empty { display: none; }

.cf-field.is-invalid input,
.cf-field.is-invalid textarea { border-color: #E4A5A0; background: #FDF3F2; }
.cf-field.is-invalid .cf-check { border-color: #E4A5A0; }

/* 団体別カードから飛んできたときに、どこが埋まったのかを一瞬だけ示す */
.cf-field.is-preset { animation: cf-preset 2s ease; }
@keyframes cf-preset {
  0%, 60% { background: rgba(41, 168, 224, 0.12); }
  100% { background: transparent; }
}

.cf-submit { text-align: center; padding-top: 32px; }
.cf-submit button { border: 0; cursor: pointer; font-family: var(--font-fat); }
.cf-submit button:disabled { opacity: 0.55; cursor: default; transform: none; }
.cf-submit-note { font-size: 12.5px; color: var(--gray); margin-top: 14px; }

.cf-result {
  margin-top: 26px;
  border-radius: var(--radius-m);
  padding: 22px 26px;
  font-size: 14px;
  line-height: 1.9;
  text-align: center;
}
.cf-result p + p { margin-top: 6px; }
.cf-result .btn-outline { margin-top: 14px; }
.cf-result.is-ok { background: var(--sky-pale); color: var(--sky-dark); font-weight: 700; }
.cf-result.is-ng { background: #FDF3F2; color: #C8382F; font-weight: 700; }
.cf-result.is-pending { background: var(--sky-pale); color: var(--ink); }

/* ============ フッター ============ */
.site-footer {
  background: var(--samurai-blue-background);
  color: #fff;
  padding: 44px 0;
}

.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.footer-id { display: flex; align-items: center; gap: 14px; }
/* サムライブルーの上に置くロゴは白抜きを維持する */
.footer-logo { height: 26px; width: auto; display: block; filter: brightness(0) invert(1); opacity: 0.92; }
.footer-brand { font-family: var(--font-fat); font-weight: 800; letter-spacing: 0.06em; font-size: 16px; }
.footer-copy { font-size: 12px; opacity: 1; }

/* ============ レスポンシブ ============ */
@media (max-width: 960px) {
  .global-nav { gap: 16px; }
  .global-nav a { font-size: 12.5px; }
  .watermark {
    font-size: clamp(48px, 12vw, 100px);
    max-width: 100%;
    overflow: hidden;
    left: 0;
    right: 0;
    transform: none;
    text-align: center;
  }
  .hero-inner { grid-template-columns: 1fr; gap: 24px; }
  .hero-illust { width: 100%; max-width: 500px; margin: 0 auto; }
  .hero-title { font-size: clamp(27px, 7.6vw, 42px); letter-spacing: -0.045em; }
  .section-label { font-size: 11px; letter-spacing: 0.2em; gap: 9px; }
  .section-label::before { width: 24px; }
  .lect-intro { grid-template-columns: 1fr; gap: 24px; }
  .lect-illust { max-width: 280px; margin: 0 auto; }
  .services-intro { margin-bottom: 26px; }
  .service-figure { height: 240px; }
  .service-figure img { max-height: 212px; }
  .worry-head { flex-direction: column-reverse; align-items: center; }
  .worry-illust { width: 120px; }
  .org-list, .org-list-large { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .org-list a { padding: 14px 12px; font-size: 12.5px; line-height: 1.5; border-radius: 14px; }
  .org-num { font-size: 10px; margin-bottom: 4px; letter-spacing: 0.14em; }
  .org-go { margin-top: 8px; font-size: 11px; }
  .service-cards { grid-template-columns: 1fr; }
  .team-row, .team-row.two { grid-template-columns: 1fr 1fr; gap: 12px; }
  .network-text { grid-template-columns: 1fr; gap: 0; }
  /* 縦積みに切り替え。扇形コネクタは横並び前提なので下向き矢印に置き換える */
  .relay {
    grid-template-columns: 1fr;
    justify-items: center;
    padding: 32px 20px;
    gap: 0;
  }
  .relay-fan { display: none; }
  .relay-team { margin-top: 24px; width: 100%; position: relative; padding-top: 26px; }
  .relay-team::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 50%;
    width: 12px;
    height: 12px;
    border-right: 2.5px solid var(--sky);
    border-bottom: 2.5px solid var(--sky);
    transform: translateX(-50%) rotate(45deg);
  }
  .relay-team ul { grid-template-columns: repeat(4, 1fr); }
  .relay-stage.rc { margin-bottom: 4px; }
  .two-col { grid-template-columns: 1fr; gap: 32px; }
  .check-list { grid-template-columns: 1fr; }
  .voice-cards { grid-template-columns: 1fr; }
  .stats-4 { grid-template-columns: repeat(2, 1fr); }
  .blob { display: none; }
  .company-table th { white-space: normal; width: 28%; }
  .icon-flow { grid-template-columns: repeat(3, 1fr); gap: 18px 10px; }
  /* 3列に折り返すので、各行の先頭からは矢印を外す */
  .icon-flow li:nth-child(3n + 1)::before { display: none; }
}

@media (max-width: 620px) {
  html, body { overflow-x: hidden; max-width: 100%; }
  .container { padding: 0 16px; }
  section { padding: 56px 0; }
  .hero { padding: 72px 0 52px; min-height: auto; }
  .hero-inner { gap: 8px; }
  .hero-illust { max-width: 350px; margin-top: -16px; }
  /* FV が画面高を超えるスマホでは、下端固定のスクロール誘導は意味がなくイラストに重なる */
  .scroll-down { display: none; }
  .org-strip { padding: 0 0 48px; }
  /* ウォーターマークが見出しに被らない上余白。team を外すと TEAM が OUR TEAM に重なる */
  .team, .services, .risk, .network, .lectures, .track, .certification, .contact, .company, .aim, .partner {
    padding-top: 72px;
  }
  .pc { display: none; }
  .sp { display: inline; }
  .global-nav a:not(.nav-cta) { display: none; }
  .nav-cta { padding: 9px 16px; font-size: 12.5px; }

  .org-list, .org-list-large { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .org-list a {
    padding: 10px 10px 12px;
    font-size: 11.5px;
    line-height: 1.45;
    border-width: 1.5px;
    border-radius: 12px;
  }
  .org-num { font-size: 9.5px; margin-bottom: 2px; }
  .org-go { margin-top: 6px; font-size: 10.5px; }

  .team .section-lead { margin-bottom: 24px; font-size: 13.5px; }
  .team .hatch { padding: 5px; margin-bottom: 12px; }
  .team-group { padding: 14px 12px 16px; border-radius: 18px; }
  .team-row, .team-row.two { grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
  .team-cat {
    font-size: 12.5px;
    padding: 5px 12px;
    margin-bottom: 12px;
  }
  .team-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 10px 6px;
  }
  .team-grid.one { grid-template-columns: 1fr; }
  .avatar {
    width: 48px;
    height: 48px;
    font-size: 17px;
    margin-bottom: 4px;
    border-width: 2px;
    outline-width: 1.5px;
  }
  /* keep-all で姓名の間だけを改行点にする（漢字の途中で割れるのを防ぐ） */
  .t-name { font-size: 10.5px; line-height: 1.35; word-break: keep-all; }
  .t-org { display: none; }
  .team-note { font-size: 12.5px; margin-top: 10px; }

  .icon-flow { grid-template-columns: repeat(2, 1fr); gap: 16px 8px; }
  .icon-flow li:nth-child(3n + 1)::before { display: block; }
  .icon-flow li:nth-child(2n + 1)::before { display: none; }
  .if-art { width: 46px; height: 46px; margin-bottom: 7px; border-width: 2px; }
  .if-art svg { width: 25px; height: 25px; }
  .icon-flow p { font-size: 11.5px; }
  .network { overflow-x: hidden; }
  .relay { padding: 26px 16px; gap: 0; }
  .relay-face { width: 66px; height: 66px; margin-bottom: 9px; border-width: 2.5px; }
  .relay-stage.rc .relay-face { width: 84px; height: 84px; }
  .relay-role { font-size: 14px; }
  .relay-stage.rc .relay-role { font-size: 15px; }
  .relay-sub { font-size: 11px; }
  .relay-cap { font-size: 10px; padding: 3px 11px; margin-bottom: 10px; }
  .relay-team ul { grid-template-columns: repeat(2, 1fr); gap: 7px; }
  .relay-team li { font-size: 11px; padding: 7px 4px; word-break: keep-all; }
  .stats { grid-template-columns: repeat(3, 1fr); gap: 12px; text-align: center; }
  .stats dt { font-size: 32px; }
  .stats dd { font-size: 11px; }
  .worry { padding: 22px 16px; }
  .flow-steps li { flex-direction: column; gap: 6px; padding: 16px 16px; }
  .flow-steps li:not(:last-child)::after { display: none; }
  .flow-no { font-size: 26px; width: auto; }
  .highlight-box { padding: 24px 18px; gap: 16px; }
  .hl-head { font-size: 17px; }
  .hero-point {
    display: block;
    box-shadow: 4px 4px 0 var(--sky-tint);
    font-size: 13.5px;
    padding: 14px 16px;
    width: 100%;
  }
  .hero-lead { font-size: 13.5px; }
  .section-title { font-size: clamp(24px, 7.4vw, 34px); line-height: 1.28; margin-bottom: 16px; }
  .section-lead { font-size: 13.5px; margin-bottom: 20px; }
  .watermark { top: 16px; -webkit-text-stroke-width: 1.5px; }
  .wave svg { height: 48px; }
  .tag-cloud li { font-size: 11.5px; padding: 5px 12px; }
  .first-point { padding: 36px 18px; }
  .first-point h3 { font-size: 22px; }
  .specialty { padding: 26px 20px; margin-bottom: 44px; }
  .specialty-label { font-size: 11px; padding: 6px 16px; letter-spacing: 0.1em; margin-bottom: 14px; }
  .specialty-copy { font-size: 20px; line-height: 1.5; }
  .contact-form-wrap { padding: 28px 16px 34px; }
  .contact-illust { width: 130px; margin-bottom: 18px; }
  .cf-field { padding: 18px 0; }
  .cf-label, .cf-field legend { font-size: 14px; margin-bottom: 10px; }
  .cf-pair { gap: 10px; }
  /* 全角の選択肢は幅を食うので、狭い画面では1行1件に落として押し間違いを減らす */
  .cf-options { flex-direction: column; gap: 8px; }
  .cf-options-inline { flex-direction: row; }
  .cf-options-inline .cf-check { flex: 1; min-width: 0; justify-content: center; }
  .cf-check { padding: 11px 14px; font-size: 13px; border-radius: 12px; }
  .contact-form input[type="text"],
  .contact-form input[type="email"],
  .contact-form input[type="tel"],
  .contact-form input[type="date"],
  .contact-form textarea { font-size: 16px; padding: 12px 13px; border-radius: 12px; }
  .cf-half input { max-width: none; }
  .cf-submit { padding-top: 24px; }
  .cf-result { padding: 18px 16px; font-size: 13px; }
  .btn-large { font-size: 15px; padding: 14px 28px; }
  /* 狭い画面でボタン文言が「くださ／い」と割れるのを防ぐ */
  .btn-primary { font-size: 14px; padding: 14px 22px; gap: 10px; word-break: keep-all; }
  .btn-outline { font-size: 13px; padding: 13px 20px; word-break: keep-all; }
  .btn-arrow { width: 26px; height: 26px; font-size: 13px; flex: none; }
  /* 横に並べると1つあたりが細くなって押しにくいので縦積みにする */
  .cert-actions { flex-direction: column; gap: 12px; }
  .cert-actions > a { width: 100%; justify-content: center; }
  .cert-cta-note { font-size: 12.5px; margin-top: 16px; }
  .aim { padding: 80px 0; }
  .aim-title { font-size: clamp(24px, 6.8vw, 32px); line-height: 1.32; }
  .aim-three span { font-size: 13px; padding: 10px 16px; }
  .mission { padding: 24px 20px; }
  .mission-quote { font-size: 18px; }
  .company-table th, .company-table td { font-size: 13px; padding: 14px 4px; }
  /* 「専門家ネット／ワーク」のような中途半端な改行を避けるため見出し列を広げる */
  .company-table th { width: 38%; font-size: 12px; letter-spacing: 0; }
  .header-inner { padding: 10px 14px; }
  .brand { gap: 9px; }
  .brand-logo { height: 22px; }
  /* 社名を出すとロゴと CTA に挟まれて改行するため、狭い画面はロゴだけにする */
  .brand-name { display: none; }
  .footer-id { gap: 11px; }
  .footer-logo { height: 21px; }
}

/* 寺崎みちる：元写真を保持し、顔を中心に拡大表示 */
.terasaki-photo { display:block; background-repeat:no-repeat; background-size:195% auto; background-position:49% 44%; box-shadow:0 3px 10px rgba(17,62,82,.13); }

@media (max-width: 640px) { .stats.cert-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .cert-stats > div { padding:20px 10px; } .cert-stats dt { white-space:nowrap; } .cert-stats dt span { font-size:20px; } }

.lecture-guidance { margin-top:24px; line-height:1.9; }
.lecture-guidance p + p { margin-top:16px; }
.cert-story { margin:32px 0; padding:clamp(20px,4vw,44px); background:#fff; border-radius:var(--radius-m); line-height:1.9; }
.cert-story > p { margin:0 0 20px; }
.program-prices { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:24px; margin:32px 0 24px; }
.program-price { padding:24px; background:var(--sky-pale,#eaf6fd); border-radius:var(--radius-m); }
.program-price h4 { margin:0 0 20px; color:var(--sky-deep); font-size:18px; }
.program-price p { margin:0 0 16px; }
.program-price .program-amount { font-size:clamp(24px,3vw,32px); font-weight:800; color:var(--sky-deep); }
.cert-story .program-footnote { font-size:13px; margin-bottom:0; }
@media(max-width:640px) { .program-prices { grid-template-columns:1fr; } .program-price { padding:20px; } }

.org-intro { margin:0 0 28px; line-height:1.9; font-size:16px; }
.org-intro p { margin:0 0 8px; }
.org-intro p:first-child { font-weight:700; color:var(--sky-deep); }
@media(max-width:640px) { .org-intro { font-size:15px; } }

.cert-pause-notice { margin:0 0 20px; padding:16px 20px; border:1px solid #d6ae68; border-radius:12px; background:#fff8e9; color:#61451d; font-weight:700; line-height:1.8; text-align:center; }

.cf-submit-note a { overflow-wrap: anywhere; text-decoration: underline; }

.program-price .program-amount { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; row-gap: 2px; line-height: 1.4; }
.program-figure, .program-tax, .program-name { white-space: nowrap; }
.program-price .program-tax { font-size: 16px; }
.program-name { display: inline-block; }

/* 関係者向けの確認ページへの入口 */
.stakeholder-review-notice{background:#edf7fc;border-bottom:1px solid #c7e4f1;color:#17384e;position:relative;z-index:2}
.stakeholder-review-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:13px;padding-bottom:13px;font-size:12px;line-height:1.7}
.stakeholder-review-inner strong{display:block;font-size:13px;color:#075c85}.stakeholder-review-inner span{display:block}
.stakeholder-review-inner>a{display:block;flex:0 1 650px;min-width:0;max-width:100%;border:2px solid var(--sky-deep);border-radius:12px;padding:16px 22px;background:var(--samurai-blue-background);color:#fff;font-size:22px;font-weight:800;line-height:1.6;text-align:center;box-shadow:0 4px 12px rgba(9,63,95,.15)}
.stakeholder-review-inner .stakeholder-review-action{margin-top:3px}
.stakeholder-review-inner .stakeholder-review-here{display:inline-block;white-space:nowrap}
.stakeholder-review-inner .stakeholder-review-arrow{display:inline-block;margin-left:4px;font-size:1.2em;line-height:1;vertical-align:-.04em}
.stakeholder-review-inner>a:hover{background:var(--samurai-blue-background);border-color:var(--sky-dark)}.stakeholder-review-inner>a:focus-visible{outline:3px solid #dc931f;outline-offset:3px}
@media(max-width:860px){.stakeholder-review-inner{flex-direction:column;align-items:stretch;gap:10px;padding-top:14px;padding-bottom:14px}.stakeholder-review-inner>a{flex:none;width:100%}}
@media(max-width:600px){.stakeholder-review-inner>a{padding:15px 12px;font-size:18px}.stakeholder-review-inner>div>span{font-size:11px}}

/* お問い合わせ：送信・完了画面 */
.contact-form [hidden] { display: none !important; }
.cf-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cf-preview-note { background: #fff8e6; border: 1px solid #edcc7b; border-radius: 12px; padding: 14px 18px; margin-bottom: 24px; font-size: 13px; line-height: 1.8; color: #725214; }
.cf-result h3 { font-size: clamp(20px, 4vw, 27px); line-height: 1.6; margin-bottom: 12px; }
.cf-result:focus-visible { outline: 3px solid var(--sky); outline-offset: 4px; }
.cf-result .cf-reference { font-size: 12px; font-weight: 400; overflow-wrap: anywhere; }
.cf-preview-again { display: block; margin: 14px auto 0; cursor: pointer; font: inherit; }

.cf-result h3 span { display: inline-block; }

/* ご相談・資格・費用についての案内 */
.disclosure-note { margin: 24px 0; padding: 22px 26px; border: 1px solid var(--sky-tint); border-left: 4px solid var(--sky-deep); border-radius: 12px; background: #f5fafd; color: var(--ink); }
.disclosure-note h3 { margin: 0 0 10px; font-family: var(--font-fat); font-size: 17px; line-height: 1.6; color: var(--sky-dark); }
.disclosure-note p { margin: 0; font-size: 15px; line-height: 1.9; overflow-wrap: anywhere; }
.cf-guidance { margin: 0 0 16px; padding: 15px 18px; background: var(--sky-pale); border-radius: 10px; color: var(--ink); font-size: 14px; line-height: 1.9; overflow-wrap: anywhere; }
@media (max-width: 640px) { .disclosure-note { padding: 18px; } .disclosure-note h3 { font-size: 16px; } .cf-guidance { padding: 14px; } }

/* B025: homepage SNS links and sharing */
.footer-social { flex-basis:100%; margin-top:18px; padding-top:22px; border-top:1px solid #ffffff40; }
.footer-social [hidden] { display:none !important; }
.site-share, .official-social-links { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.official-social-links { margin-bottom:16px; }
.site-share-label { flex-basis:100%; margin:0 0 3px; font-size:13px; font-weight:700; letter-spacing:.04em; }
.footer-social .social-button { display:inline-flex; justify-content:center; align-items:center; min-height:44px; padding:8px 17px; border:1px solid #ffffff99; border-radius:7px; background:transparent; color:#fff; font:inherit; font-size:13px; line-height:1.5; text-decoration:none; cursor:pointer; }
.footer-social .social-button:hover { background:#ffffff18; }
.footer-social .social-button:focus-visible, .copy-site-fallback input:focus-visible { outline:3px solid #efbc5a; outline-offset:3px; }
.site-share-status { min-height:1.6em; margin:12px 0 0; font-size:12px; line-height:1.8; }
.copy-site-fallback { margin-top:8px; max-width:480px; }
.copy-site-fallback label { display:block; margin-bottom:6px; font-size:12px; }
.copy-site-fallback input { box-sizing:border-box; width:100%; padding:10px 12px; border:1px solid #b6cfd8; border-radius:6px; background:#fff; color:#173747; font:inherit; font-size:15px; }
@media(max-width:600px) {
  .site-share, .official-social-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .site-share-label, .site-share-status { grid-column:1 / -1; }
  .footer-social .social-button { min-width:0; padding:9px 7px; font-size:12px; }
}
/* /B025: homepage SNS links and sharing */


/* ご利用者の声の下から各事業の詳細へ移動する案内 */
.service-jump-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 48px;
}
.service-jump-nav > a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 136px;
  padding: 20px 18px;
  border: 2px solid var(--sky-deep);
  border-radius: 12px;
  background: var(--samurai-blue-background);
  color: var(--white);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.65;
  box-shadow: 0 4px 12px rgba(9, 63, 95, .15);
}
.service-jump-nav > a:hover { background: var(--samurai-blue-background); border-color: var(--sky-dark); }
.service-jump-nav > a:focus-visible { outline: 3px solid #dc931f; outline-offset: 4px; }
.service-jump-number { font-family: var(--font-fat); font-size: 26px; line-height: 1; }
.service-jump-label { min-width: 0; overflow-wrap: anywhere; }
.service-jump-kicker { display: block; margin-bottom: 4px; font-size: 13px; }
.service-jump-course { display: block; }
.service-jump-arrow { font-size: 26px; line-height: 1; }
@media (max-width: 960px) {
  .service-jump-nav { grid-template-columns: 1fr; gap: 12px; margin-top: 36px; }
  .service-jump-nav > a { min-height: 88px; padding: 18px 20px; }
}
@media (max-width: 600px) {
  .service-jump-nav > a { gap: 10px; padding: 16px 14px; }
  .service-jump-number { font-size: 24px; }
  .service-jump-arrow { font-size: 24px; }
}


/* トップと、3つの案内から開く詳細画面を切り替える */
[data-home-view][hidden], .service-detail-view[hidden] { display: none !important; }
.service-detail-back { background: var(--white); padding: 24px 0; }
.service-detail-back a {
  display: inline-block;
  padding: 10px 16px;
  border: 2px solid var(--sky-dark);
  border-radius: 8px;
  color: var(--sky-dark);
  font-weight: 800;
  line-height: 1.7;
}
.service-detail-back a:hover { background: var(--sky-pale); }
.service-detail-back a:focus-visible { outline: 3px solid #dc931f; outline-offset: 4px; }
@media (max-width: 600px) {
  .service-detail-back { padding: 18px 0; }
  .service-detail-back a { font-size: 14px; padding: 10px 12px; }
}