@charset "UTF-8";
/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 *
 * .hk-eyebrow              - Cinzel英字ラベル＋細線の小見出しモチーフ（center/left/on-dark）
 * .hk-h2 / .hk-lead        - 明朝のセクション見出し／理念ステートメント
 * .hk-ink/-body/-muted/-sub- デザイン固有テキストカラー
 * .hk-hairgrid             - 1px隙間で罫線を見せるヘアライングリッド（auto/--2/--3/--4/--5）
 * .hk-pagehead             - 下層ページのネイビー見出し帯（パンくず＋EN＋JA＋EN）
 * .hk-head / .hk-foot      - ヘッダー／フッターのサイト固有装飾
 * .hk-mv                   - トップMV（3Dセンターステージ・カルーセル）
 * .hk-feature/.hk-rep      - TOP「法人に強い理由」カード＋代表ボックス
 * .hk-svc-row              - 事業内容の左右交互ロウ
 * .hk-case                 - 相談事例カード（上ネイビー罫線）
 * .hk-partner              - 取り扱い保険会社グリッド
 * .hk-blog* / .hk-side*    - ブログ一覧・記事・サイドバー
 * .hk-cta                  - お問い合わせCTA帯
 * .hk-form                 - お問い合わせフォーム
 * .hk-arrow / .hk-viewall  - 矢印付きリンク／VIEW ALL
 * .hk-reveal               - スクロールフェードイン（控えめ）
 *
 * ======================================
 * 共通SCSSに不足していたもの（5分類）
 * ======================================
 * ・構造不足：英字ラベル＋細線の小見出し（heading系は英字大→日本語の構成のみで、
 *   「短い細線＋小さな英字ラベル」のミニマルなセクション頭が無い）→ .hk-eyebrow を追加
 * ・構造不足：1pxギャップで境界線を見せるグリッド（grid-N は gap:20px 固定）→ .hk-hairgrid
 * ・構造不足：下層ヒーローが中央寄せのみ（page-hero--solid）。本デザインは
 *   左寄せ＋パンくず＋EN/JA/ENの3段構成 → .hk-pagehead
 * ・装飾パターン不足：3Dセンターステージのカルーセル → .hk-mv
 * ・値の粒度不足：clamp()による流体タイポ/余白（デザイン完全一致のため踏襲）
 */

/* ==========================================================================
   palette / tokens
   ========================================================================== */
:root {
  --navy:   #001872;
  --navy-d: #0a235c;
  --ink:    #0e1430;
  --body:   #4b5169;
  --body2:  #454b63;
  --body3:  #3a3f52;
  --muted:  #9aa1ba;
  --sub:    #7480a6;
  --line:   #e3e5ee;
  --line2:  #eef0f5;
  --gray:   #F9F9F7;
  --num:    #b3bad2;
  --partner:#c9cee0;
  --cinzel: "Cinzel", "EB Garamond", serif;
  --mincho: "Shippori Mincho", serif;
}

body { color: #23283c; }
::selection { background: var(--navy); color: #fff; }

/* テキストカラーヘルパー */
.hk-ink   { color: var(--ink); }
.hk-body  { color: var(--body); }
.hk-muted { color: var(--muted); }
.hk-sub   { color: var(--sub); }
.font-cinzel { font-family: var(--cinzel); }

/* セクション余白（デザインの clamp に合わせる） */
.hk-sec { padding: clamp(72px, 9vw, 128px) 0; }
.hk-sec--tight { padding: clamp(56px, 7vw, 104px) 0; }
.hk-narrow { max-width: 1080px; }
.hk-narrow2 { max-width: 1000px; }
.hk-narrow3 { max-width: 980px; }
.hk-narrow4 { max-width: 840px; }

/* ==========================================================================
   eyebrow（Cinzel英字ラベル＋細線）
   ========================================================================== */
.hk-eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}
.hk-eyebrow::before {
  content: "";
  width: 34px;
  height: 1px;
  background: var(--navy);
  flex-shrink: 0;
}
.hk-eyebrow__en {
  font-family: var(--cinzel);
  font-size: 1.2rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  color: var(--navy);
  line-height: 1;
}
.hk-eyebrow--center { justify-content: center; }
.hk-eyebrow--center::after {
  content: "";
  width: 34px;
  height: 1px;
  background: var(--navy);
  flex-shrink: 0;
}
.hk-eyebrow--dark::before,
.hk-eyebrow--dark.hk-eyebrow--center::after { background: #7f8dc0; }
.hk-eyebrow--dark .hk-eyebrow__en { color: #aeb7d6; }

/* ==========================================================================
   headings
   ========================================================================== */
.hk-h2 {
  font-family: var(--mincho);
  font-weight: 600;
  font-size: clamp(2.6rem, 3.6vw, 4rem);
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: var(--ink);
}
/* セクションタイトルの既定の下余白は50px。:where()で詳細度0にしているため
   mb-*/mt-* ユーティリティで個別に上書き可能。 */
:where(.hk-h2) { margin: 0 0 50px; }
/* タイトル＋VIEW ALL の横並びヘッダー内は、余白をラッパー(.hk-sechead)側で管理 */
:where(.hk-sechead .hk-h2) { margin-bottom: 0; }
.hk-h2--sm { font-size: clamp(2.4rem, 3.4vw, 3.8rem); }
.hk-h2--white { color: #fff; }
.hk-h2--relaxed { line-height: 1.65; }

/* 理念ステートメント（大きめ明朝・中央） */
.hk-lead {
  font-family: var(--mincho);
  font-weight: 500;
  font-size: clamp(2.2rem, 3.2vw, 3.6rem);
  line-height: 1.9;
  letter-spacing: 0.04em;
  color: var(--ink);
}
:where(.hk-lead) { margin: 0; }
.hk-lead--sm { font-size: clamp(2.1rem, 3vw, 3.4rem); }

/* 本文 */
.hk-p {
  font-size: 1.55rem;
  line-height: 2.2;
  color: var(--body);
}
:where(.hk-p) { margin: 0; }
.hk-p--measure { max-width: 55em; margin-left: auto; margin-right: auto; }
/* PCでは1行固定（狭幅では折り返してはみ出しを防ぐ） */
@media (min-width: 768px) { .hk-nowrap-pc { white-space: nowrap; } }

/* 見出し横のラベル（左ライン + JA小） */
.hk-kicker {
  font-family: var(--mincho);
  font-size: 1.4rem;
  letter-spacing: 0.2em;
  color: var(--sub);
  margin: 0 0 14px;
}

/* ==========================================================================
   hairline grid（1px隙間で罫線を見せるグリッド）
   ========================================================================== */
.hk-hairgrid {
  display: grid;
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}
.hk-hairgrid > * { background: #fff; }
.hk-hairgrid--auto  { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.hk-hairgrid--auto-sm { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.hk-hairgrid--auto-logo { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.hk-hairgrid--navy { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.16); }
.hk-hairgrid--navy > * { background: var(--navy); }
.hk-hairgrid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) { .hk-hairgrid--3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 639px)  { .hk-hairgrid--3 { grid-template-columns: 1fr; } }
.hk-hairgrid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 639px)  { .hk-hairgrid--2 { grid-template-columns: 1fr; } }

/* ==========================================================================
   page head（下層ページのネイビー見出し帯）
   ========================================================================== */
/* ヘッダーは position:fixed のため、下層ページ本文を固定ヘッダーの高さ分だけ
   下げ、ページヒーロー上部がヘッダーに潜り込んで詰まって見えるのを防ぐ。 */
.subpage-wrapper { padding-top: 78px; }
@media (max-width: 1100px) { .subpage-wrapper { padding-top: 60px; } }

.hk-pagehead {
  background: var(--navy);
  color: #fff;
}
.hk-pagehead__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(56px, 7vw, 96px) clamp(24px, 5vw, 40px);
}
.hk-pagehead__crumb {
  margin: 0;
  font-family: var(--cinzel);
  font-size: 1.2rem;
  letter-spacing: 0.16em;
  color: #aeb7d6;
}
.hk-pagehead__crumb a { color: #aeb7d6; }
.hk-pagehead__crumb a:hover { color: #fff; opacity: 1; }
.hk-pagehead__title {
  margin: 18px 0 0;
  font-family: var(--mincho);
  font-weight: 600;
  font-size: clamp(3rem, 4.4vw, 5rem);
  letter-spacing: 0.06em;
  line-height: 1.2;
}
.hk-pagehead__en {
  margin: 14px 0 0;
  font-family: var(--cinzel);
  font-size: 1.3rem;
  letter-spacing: 0.24em;
  color: #8d97bd;
}

/* ==========================================================================
   arrows / view-all links
   ========================================================================== */
.hk-viewall {
  font-family: var(--cinzel);
  font-size: 1.3rem;
  letter-spacing: 0.12em;
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid rgba(0,24,114,.4);
  padding-bottom: 5px;
  white-space: nowrap;
}
.hk-viewall:hover { opacity: 1; color: var(--navy-d); }
.hk-viewall--white { color: #fff; border-bottom-color: rgba(255,255,255,.5); }
.hk-viewall--white:hover { color: #fff; opacity: .8; }

/* 塗りボタン（Cinzel） */
.hk-btn {
  display: inline-block;
  font-family: var(--cinzel);
  font-weight: 600;
  font-size: 1.4rem;
  letter-spacing: 0.12em;
  text-decoration: none;
  padding: 18px 44px;
  transition: background .25s, opacity .25s;
}
.hk-btn--navy { background: var(--navy); color: #fff; }
.hk-btn--navy:hover { background: var(--navy-d); color: #fff; opacity: 1; }
.hk-btn--white { background: #fff; color: var(--navy); }
.hk-btn--white:hover { background: #e7eaf6; color: var(--navy); opacity: 1; }
.hk-btn--sm { padding: 16px 36px; font-size: 1.3rem; }

/* セクションヘッダー（左：eyebrow+h2 / 右：view all） */
.hk-sechead {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 54px;
}

/* ==========================================================================
   header
   ========================================================================== */
.hk-head.header-bar { background: #fff; border-bottom: 1px solid var(--line); box-shadow: none; }
.hk-head .header__inner { height: 78px; max-width: 1240px; padding: 0 clamp(20px,4vw,40px); }
.hk-head .header__logo img { height: 40px; }
.hk-head .header__nav { margin-right: 28px; gap: 2px; }
.hk-head .header__nav-item a { padding: 8px 14px; }
.hk-head .header__nav-en { font-family: var(--cinzel); font-size: 0.95rem; letter-spacing: 0.14em; color: var(--navy); }
.hk-head .header__nav-ja { font-family: var(--mincho); font-size: 1.25rem; font-weight: 500; color: var(--body3); margin-top: 3px; }
/* ホバー下線は中央基準で左右対称に広げる（transformで確実に中央配置） */
.hk-head .header__nav-item a::after { background: var(--navy); left: 50%; transform: translateX(-50%); }
.hk-head .header__nav-item a:hover::after { width: 80%; left: 50%; }
.hk-head .header__nav-item--current a .header__nav-ja { color: var(--navy); font-weight: 700; }
.hk-head .header__nav-item--current a::after { width: 70%; left: 50%; transform: translateX(-50%); }
.hk-head .header__tel { font-family: var(--cinzel); font-size: 1.8rem; }
.hk-head .header__cta { background: var(--navy); padding: 0 26px; }
.hk-head .header__cta:hover { background: var(--navy-d); }
.hk-head .header__cta span:first-child { font-family: var(--mincho); font-size: 1.3rem; font-weight: 600; }
.hk-head .header__cta__sub { font-family: var(--cinzel); letter-spacing: 0.12em; }

/* sp-nav の英字を Cinzel に */
.sp-nav__en { font-family: var(--cinzel); font-size: 1.5rem; }
.sp-nav__link { font-family: var(--mincho); }
.sp-nav__link::after { margin-left: 10px; }

/* スマホ・タブレット時（ナビがハンバーガーに切り替わる幅）は、固定ヘッダーの
   白背景・影・境界線を非表示にし、MV画像が上部で見切れないようにする。 */
@media (max-width: 1100px) {
  .hk-head.header-bar { background: transparent; border-bottom: none; box-shadow: none; }
}

/* --------------------------------------------------------------------------
   ヘッダー プルダウン（各ページの中身へジャンプ）
   既存の .header__dropdown コンポーネントを、サイトのネイビー基調に合わせて調整。
   -------------------------------------------------------------------------- */
/* 「下層メニューあり」を示す記号（EN/JAの下）。全ナビ項目で同じ高さの枠を確保し、
   サブ無し項目（TOP・CONTACT）は空にすることで、各項目の日本語ラベルの位置を揃える。 */
.hk-head .hk-nav-caret { display: block; height: 14px; line-height: 14px; margin-top: 4px; font-size: 0.85rem; font-weight: 400; color: var(--sub); transition: transform .25s ease, color .25s ease; }
.hk-head .header__nav-item--has-sub:hover .hk-nav-caret { color: var(--navy); transform: rotate(180deg); }

.hk-head .header__dropdown { padding-top: 16px; min-width: 210px; filter: drop-shadow(0 14px 28px rgba(0,12,48,.14)); }
.hk-head .header__dropdown-item { border-color: var(--line); }
.hk-head .header__dropdown-item:last-child { border-bottom-color: var(--line); }
.hk-head .header__dropdown-item a { font-family: var(--mincho); font-size: 1.25rem; letter-spacing: 0.02em; color: var(--body3); padding: 12px 18px; }
.hk-head .header__dropdown-item a:hover { background: #eef1fb; color: var(--navy); }

/* スマホナビ：コンパクト＋アコーディオン（タップでサブ項目をプルダウン表示） */
.sp-nav__list { max-width: 360px; }
.sp-nav__link { padding: 14px 10px; font-size: 1.5rem; }
.sp-nav__row { display: flex; align-items: stretch; }
/* リンクを行幅いっぱいに広げ、ENは左・日本語は右に寄せる（全項目共通） */
.sp-nav__link { flex: 1 1 auto; min-width: 0; }
/* ナビ右端の「＞」を非表示にし、日本語ラベルを右揃えに */
.sp-nav__link::after { display: none !important; }
.sp-nav__link { justify-content: flex-end; }
.sp-nav__en { margin-right: auto; }
/* サブなし項目（TOP・CONTACT）はトグル幅ぶんの余白を確保し、日本語の右端を揃える */
.sp-nav__item:not(.sp-nav__item--has-sub) .sp-nav__link { padding-right: 64px; }

.sp-nav__toggle {
  flex: 0 0 auto; width: 54px; padding: 0;
  background: transparent; border: none; border-left: 1px solid rgba(255,255,255,.15);
  color: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  opacity: .75; transition: transform .3s ease, opacity .3s ease;
}
.sp-nav__toggle:hover { opacity: 1; }
.sp-nav__item.is-open .sp-nav__toggle { transform: rotate(180deg); opacity: 1; } /* 開くと上向き */

.sp-nav__sub { list-style: none; margin: 0; padding: 0; max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.sp-nav__item.is-open .sp-nav__sub { max-height: 460px; }
.sp-nav__sub li { border-top: 1px solid rgba(255,255,255,.1); }
.sp-nav__sub a { display: block; font-family: var(--mincho); font-size: 1.3rem; color: rgba(255,255,255,.78); text-decoration: none; text-align: left; padding: 12px 10px 12px 22px; }
.sp-nav__sub a::before { content: "─ "; color: rgba(255,255,255,.4); }
.sp-nav__sub a:hover { color: #fff; opacity: 1; background: rgba(255,255,255,.06); }

/* 固定ヘッダー分のアンカーオフセット（遷移先の見出しがヘッダーに隠れないように） */
main [id] { scroll-margin-top: 96px; }
@media (max-width: 1100px) { main [id] { scroll-margin-top: 72px; } }

/* ==========================================================================
   footer
   ========================================================================== */
.hk-foot { background: var(--navy); color: #fff; }
.hk-foot__inner { padding: clamp(56px,7vw,84px) clamp(20px,4vw,40px) 40px; max-width: 1240px; }
.hk-foot__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: clamp(36px, 5vw, 72px);
  align-items: start;
}
.hk-foot__brand-en { font-family: var(--cinzel); font-weight: 700; font-size: 2rem; letter-spacing: 0.16em; line-height: 1.3; }
.hk-foot__brand-sub { font-family: var(--cinzel); font-size: 1.1rem; letter-spacing: 0.34em; color: #aeb7d6; margin-top: 6px; }
.hk-foot__tagline { font-family: var(--mincho); font-size: 1.35rem; line-height: 2; color: #c7cde3; margin: 22px 0 0; }
.hk-foot__col-title { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.2em; color: #8d97bd; border-bottom: 1px solid rgba(255,255,255,.16); padding-bottom: 10px; margin-bottom: 18px; }
.hk-foot__company { font-family: var(--mincho); font-size: 1.35rem; line-height: 1.85; color: #dde1f0; }
.hk-foot__company p { margin: 0 0 6px; }
.hk-foot__company-gap { margin-bottom: 12px !important; }
.hk-foot__nav { display: flex; flex-direction: column; gap: 13px; }
.hk-foot__nav a { font-family: var(--mincho); font-size: 1.4rem; color: #dde1f0; text-decoration: none; }
.hk-foot__nav a:hover { color: #fff; opacity: 1; }
.hk-foot__contact-text { font-family: var(--mincho); font-size: 1.35rem; line-height: 1.9; color: #c7cde3; margin: 0 0 18px; }
.hk-foot__cta { display: inline-block; font-family: var(--cinzel); font-weight: 600; font-size: 1.3rem; letter-spacing: 0.12em; color: var(--navy); background: #fff; text-decoration: none; padding: 13px 26px; transition: background .2s; }
.hk-foot__cta:hover { background: #e7eaf6; color: var(--navy); opacity: 1; }
.hk-foot__meta {
  margin-top: clamp(40px, 5vw, 64px);
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.16);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.hk-foot__partners { margin: 0; font-family: var(--mincho); font-size: 1.2rem; line-height: 1.8; color: #9aa3c6; max-width: 680px; }
.hk-foot__meta-links { display: flex; align-items: center; gap: 22px; }
.hk-foot__meta-links a { font-family: var(--mincho); font-size: 1.25rem; color: #c7cde3; text-decoration: none; }
.hk-foot__meta-links a:hover { color: #fff; opacity: 1; }
.hk-foot__copy { margin: 22px 0 0; font-family: var(--cinzel); font-size: 1.1rem; letter-spacing: 0.1em; color: #7e88b0; }
@media (max-width: 639px) { .hk-foot__copy { padding-bottom: 56px; } }

/* page-top をネイビーに */
.page-top__link { background: var(--navy); }

/* ==========================================================================
   MV（3Dセンターステージ・カルーセル）
   ========================================================================== */
/* PCは固定ヘッダーが不透明（白背景）のため、MVをヘッダー高さ分だけ下げて
   スライド上部がヘッダーに被って見切れるのを防ぐ。モバイルはヘッダーを透明化
   しMVを全面表示しているのでオフセット不要。 */
.hk-mv { background: #fff; padding-top: 78px; }
@media (max-width: 1100px) { .hk-mv { padding-top: 0; } }
.hk-mv__stage-wrap {
  position: relative;
  height: clamp(480px, 80vh, 840px);
  overflow: hidden;
  perspective: 2000px;
}
.hk-mv__stage { position: absolute; inset: 0; transform-style: preserve-3d; }
.hk-mv__slide {
  position: absolute;
  top: 0; bottom: 0; left: 50%;
  width: min(62vw, 1080px);
  transition: transform .85s cubic-bezier(.4,0,.2,1), opacity .85s;
  cursor: pointer;
}
.hk-mv__panel { position: absolute; inset: 0; background: var(--navy); overflow: hidden; }
.hk-mv__panel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hk-mv__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,8,34,0) 28%, rgba(0,8,34,.40)); }

/* text slide（slide0） */
.hk-mv__panel--text { display: flex; align-items: center; justify-content: center; }
.hk-mv__grid {
  position: absolute; inset: 0; opacity: .55;
  background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 58px 58px;
}
.hk-mv__rule { position: absolute; top: 8%; bottom: 8%; left: 50%; width: 1px; background: repeating-linear-gradient(#fff 0 2px, transparent 2px 10px); opacity: .3; }
.hk-mv__vtext {
  position: relative;
  writing-mode: vertical-rl;
  font-family: var(--mincho);
  font-weight: 600;
  font-size: clamp(1.8rem, 2.2vw, 3rem);
  letter-spacing: 0.2em;
  line-height: 2;
  color: #fff;
  text-align: center;
}
.hk-mv__vtext span { display: block; white-space: nowrap; }
.hk-mv__vtext span:last-child { color: #c5cdea; }
.hk-mv__corner { position: absolute; font-family: var(--cinzel); font-size: 1.1rem; color: #8d97bd; }
.hk-mv__corner--tl { left: clamp(22px,3vw,46px); top: clamp(22px,3vw,42px); writing-mode: vertical-rl; letter-spacing: 0.32em; }
.hk-mv__corner--br { right: clamp(22px,3vw,46px); bottom: clamp(22px,3vw,42px); letter-spacing: 0.22em; }

/* image slide caption */
.hk-mv__caption { position: absolute; left: 0; bottom: clamp(48px,15%,140px); display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
.hk-mv__cap {
  font-family: var(--mincho); font-weight: 600;
  font-size: clamp(2rem, 2.7vw, 3.8rem);
  letter-spacing: 0.09em; color: #fff;
  padding: 0.34em 0.72em;
  box-shadow: 0 14px 34px -14px rgba(0,12,48,.55);
}
.hk-mv__cap--a { background: var(--navy); }
.hk-mv__cap--b { background: var(--navy-d); margin-left: clamp(24px,5vw,80px); }

/* controls */
.hk-mv__arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 50;
  width: clamp(42px,4vw,54px); height: clamp(42px,4vw,54px);
  border-radius: 50%; border: 1px solid #c2c8da; background: rgba(255,255,255,.88);
  color: var(--navy); font-size: 2.2rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-family: Georgia, serif;
}
.hk-mv__arrow--prev { left: clamp(10px,2vw,30px); }
.hk-mv__arrow--next { right: clamp(10px,2vw,30px); }
.hk-mv__dots { position: absolute; bottom: clamp(18px,3vw,34px); left: 0; right: 0; display: flex; justify-content: center; gap: 14px; z-index: 50; }
.hk-mv__dot { width: 11px; height: 11px; border-radius: 50%; border: 1px solid #fff; background: transparent; padding: 0; cursor: pointer; }
.hk-mv__dot.is-active { background: var(--navy); }

/* ==========================================================================
   TOP: 法人に強い理由（features）＋ 代表ボックス
   ========================================================================== */
.hk-feature { padding: clamp(36px, 4vw, 52px); }
.hk-feature__num { font-family: var(--cinzel); font-size: 1.3rem; letter-spacing: 0.2em; color: var(--num); }
.hk-feature__title { margin: 18px 0 16px; font-family: var(--mincho); font-weight: 600; font-size: 2.1rem; line-height: 1.6; color: var(--navy); }
.hk-feature__text { margin: 0; font-size: 1.45rem; line-height: 2; color: var(--body); }

.hk-rep {
  margin-top: 48px;
  border: 1px solid var(--line);
  padding: clamp(28px, 4vw, 44px);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px, 3vw, 48px);
  align-items: center;
}
/* 左（ABOUT US／見出し）を狭め、右（本文）を広く＝約4:6 */
@media (min-width: 768px) {
  .hk-rep { grid-template-columns: 4fr 6fr; }
}
.hk-rep__label { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.22em; color: var(--navy); margin: 0 0 14px; }
.hk-rep__lead { margin: 0; font-family: var(--mincho); font-size: clamp(1.6rem, 2vw, 2rem); line-height: 1.9; color: var(--ink); }
.hk-rep__text { margin: 0; font-size: 1.45rem; line-height: 2.1; color: var(--body); }

/* service preview cells（navy） */
.hk-svcprev { padding: clamp(30px, 3.5vw, 44px); }
.hk-svcprev__media { aspect-ratio: 16 / 10; overflow: hidden; margin-bottom: 22px; background: var(--navy-d); }
.hk-svcprev__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.hk-svcprev:hover .hk-svcprev__media img { transform: scale(1.04); }
.hk-svcprev__num { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.2em; color: #8d97bd; }
.hk-svcprev__title { margin: 16px 0 12px; font-family: var(--mincho); font-weight: 600; font-size: 1.9rem; color: #fff; }
.hk-svcprev__text { margin: 0; font-size: 1.35rem; line-height: 1.95; color: #c3c9e1; }

/* case preview（border-top） */
.hk-caseprev { border-top: 2px solid var(--navy); padding-top: 24px; }
/* 画像は後日 ros-cdn へアップロードして差し替える前提の枠。
   <span>を<img src="…">に置き換えれば写真が表示される。 */
.hk-caseprev__media { aspect-ratio: 16 / 10; overflow: hidden; margin-bottom: 20px; background: var(--gray); border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; }
.hk-caseprev__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hk-caseprev__media-label { font-family: var(--cinzel); font-size: 1.1rem; letter-spacing: 0.22em; color: var(--num); }
.hk-caseprev__no { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.18em; color: var(--num); margin-bottom: 14px; }
.hk-caseprev__title { margin: 0 0 12px; font-family: var(--mincho); font-weight: 600; font-size: 1.8rem; line-height: 1.6; color: var(--ink); }
.hk-caseprev__text { margin: 0; font-size: 1.4rem; line-height: 1.95; color: var(--body); }

/* insurance preview logos */
.hk-logo { padding: 34px 18px; font-family: var(--cinzel); letter-spacing: 0.14em; font-size: 1.5rem; color: var(--navy); text-align: center; }
.hk-logo--ja { font-family: var(--mincho); letter-spacing: 0.04em; }
a.hk-logo { display: flex; align-items: center; justify-content: center; text-decoration: none; transition: opacity .2s ease; }
a.hk-logo:hover { opacity: .7; }
.hk-logo img { max-width: 100%; max-height: 60px; width: auto; height: auto; object-fit: contain; }

/* blog preview cards */
.hk-blogcard { text-decoration: none; color: inherit; display: block; }
.hk-blogcard__img {
  aspect-ratio: 16/10; background: var(--gray); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.2em; color: var(--num);
  overflow: hidden;
}
.hk-blogcard__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.hk-blogcard:hover .hk-blogcard__img img { transform: scale(1.05); }
.hk-blogmeta { display: flex; gap: 12px; align-items: center; margin-top: 18px; }
.hk-cat { font-family: var(--cinzel); font-size: 1.1rem; letter-spacing: 0.12em; color: var(--navy); border: 1px solid var(--navy); padding: 3px 9px; }
.hk-cat--diary { color: #5b6075; border-color: #c4c8d6; }
.hk-cat--ja { font-family: var(--mincho); }
.hk-date { font-family: var(--cinzel); font-size: 1.2rem; color: var(--muted); letter-spacing: 0.08em; }
.hk-blogcard__title { margin: 14px 0 0; font-family: var(--mincho); font-weight: 600; font-size: 1.7rem; line-height: 1.65; color: var(--ink); }

/* ==========================================================================
   CTA band
   ========================================================================== */
.hk-cta { background: var(--navy-d); color: #fff; }
.hk-cta__inner { max-width: 980px; margin: 0 auto; padding: clamp(64px,8vw,108px) clamp(24px,5vw,40px); text-align: center; }
.hk-cta__en { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.28em; color: #aeb7d6; margin: 0 0 22px; }
.hk-cta__title { margin: 0; font-family: var(--mincho); font-weight: 600; font-size: clamp(2.4rem,3.4vw,3.8rem); line-height: 1.6; letter-spacing: 0.03em; }
.hk-cta__text { margin: 26px auto 40px; max-width: 30em; font-size: 1.5rem; line-height: 2.1; color: #c7cde3; }
.hk-cta__btn { display: inline-block; font-family: var(--cinzel); font-weight: 600; font-size: 1.4rem; letter-spacing: 0.12em; color: var(--navy); background: #fff; text-decoration: none; padding: 18px 44px; transition: background .2s; }
.hk-cta__btn:hover { background: #e7eaf6; color: var(--navy); opacity: 1; }

/* ==========================================================================
   会社概要：代表挨拶 / 行動指針 / 代理店 / 会社概要表
   ========================================================================== */
.hk-msg { display: grid; grid-template-columns: 280px 1fr; gap: clamp(40px,5vw,72px); align-items: start; }
@media (max-width: 639px) { .hk-msg { grid-template-columns: 1fr; } }
.hk-photo {
  aspect-ratio: 4/5; max-width: 280px; background: var(--gray); border: 1px solid var(--line);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
}
.hk-photo__en { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.24em; color: var(--num); }
.hk-photo__note { font-family: var(--mincho); font-size: 1.3rem; color: var(--muted); }
.hk-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hk-msg__h { margin: 0 0 28px; font-family: var(--mincho); font-weight: 600; font-size: clamp(2.2rem,2.8vw,3.2rem); line-height: 1.65; letter-spacing: 0.03em; color: var(--ink); }
.hk-msg__body { font-size: 1.5rem; line-height: 2.2; color: var(--body2); }
.hk-msg__body p { margin: 0 0 20px; }
.hk-msg__body p:last-child { margin-bottom: 0; }
.hk-msg__sign { margin: 32px 0 0; font-family: var(--mincho); font-size: 1.5rem; color: var(--ink); }

/* 番号付き行リスト（行動指針 / 勧誘方針） */
.hk-numlist { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.hk-numlist__item {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: clamp(16px, 3vw, 40px);
  align-items: baseline;
  padding: clamp(24px, 3vw, 34px) 0;
  border-bottom: 1px solid var(--line);
}
.hk-numlist__no { font-family: var(--cinzel); font-size: 2.4rem; color: var(--navy); }
.hk-numlist__title { margin: 0 0 8px; font-family: var(--mincho); font-weight: 600; font-size: 1.9rem; color: var(--ink); }
.hk-numlist__text { margin: 0; font-size: 1.45rem; line-height: 1.9; color: var(--body); }
.hk-numlist--sm .hk-numlist__item { grid-template-columns: 56px 1fr; gap: clamp(14px,3vw,32px); padding: clamp(26px,3vw,36px) 0; }
.hk-numlist--sm .hk-numlist__no { font-size: 2.2rem; }
.hk-numlist--sm .hk-numlist__title { font-size: 1.8rem; }

/* 代理店名称ボックス */
.hk-agency { background: #fff; border: 1px solid var(--line); padding: clamp(28px,4vw,48px); }
.hk-agency__label { margin: 0 0 8px; font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.18em; color: var(--sub); }
.hk-agency__name { margin: 0 0 32px; font-family: var(--mincho); font-size: clamp(1.7rem,2vw,2.1rem); color: var(--ink); }
.hk-agency__tags { display: flex; flex-wrap: wrap; gap: 10px; }
.hk-tag { font-family: var(--mincho); font-size: 1.4rem; color: var(--navy); border: 1px solid var(--partner); padding: 9px 18px; }
.hk-tag--dashed { color: var(--sub); border-style: dashed; }

/* 会社概要 dl */
.hk-overview { margin: 0; border-top: 1px solid var(--line); }
.hk-overview__row { display: grid; grid-template-columns: minmax(120px, 200px) 1fr; border-bottom: 1px solid var(--line); }
.hk-overview__dt { font-family: var(--mincho); font-size: 1.4rem; color: var(--navy); padding: 22px 12px 22px 0; font-weight: 600; }
.hk-overview__dd { margin: 0; font-size: 1.5rem; color: var(--body3); padding: 22px 0; line-height: 1.8; }

/* ==========================================================================
   事業内容：左右交互ロウ
   ========================================================================== */
.hk-svc-rows { display: flex; flex-direction: column; gap: clamp(28px,4vw,48px); }
.hk-svc-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); background: #fff; border: 1px solid var(--line); }
.hk-svc-row__media { position: relative; overflow: hidden; background: var(--navy); min-height: 240px; display: flex; align-items: flex-end; padding: 32px; }
.hk-svc-row__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hk-svc-row__media--alt { background: var(--navy-d); }
.hk-svc-row__media-label { font-family: var(--cinzel); font-size: 1.3rem; letter-spacing: 0.24em; color: #aeb7d6; }
.hk-svc-row__body { padding: clamp(32px,4vw,56px); }
.hk-svc-row__head { display: flex; align-items: center; gap: 12px; }
.hk-svc-row__num { font-family: var(--cinzel); font-size: 1.3rem; letter-spacing: 0.2em; color: var(--num); }
.hk-svc-row__badge { font-family: var(--mincho); font-size: 1.1rem; color: #fff; background: var(--navy); padding: 3px 10px; letter-spacing: 0.08em; }
.hk-svc-row__title { margin: 14px 0 18px; font-family: var(--mincho); font-weight: 600; font-size: clamp(2rem,2.4vw,2.6rem); color: var(--navy); }
.hk-svc-row__text { margin: 0; font-size: 1.45rem; line-height: 2.05; color: var(--body); }
/* reverse（テキスト左・メディア右）: order */
.hk-svc-row--reverse .hk-svc-row__body { order: 2; }
.hk-svc-row--reverse .hk-svc-row__media { order: 1; }
@media (max-width: 639px) {
  .hk-svc-row--reverse .hk-svc-row__body { order: 1; }
  .hk-svc-row--reverse .hk-svc-row__media { order: 2; }
}
/* ロウ内リード文 */
.hk-svc-row__lead { margin: 0 0 14px; font-family: var(--mincho); font-weight: 600; font-size: clamp(1.5rem, 1.7vw, 1.6rem); line-height: 1.7; color: var(--navy); }
/* ロウ外の補足（おすすめ・相談内容例）＝ボックスの外に2カラムで掲載 */
.hk-svc-detail { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(24px,4vw,56px); padding: 4px clamp(4px,2vw,24px); }
@media (max-width: 639px) { .hk-svc-detail { grid-template-columns: 1fr; gap: 24px; } }
.hk-svc-sub__title { margin: 0 0 12px; font-family: var(--mincho); font-weight: 600; font-size: 1.5rem; color: var(--ink); padding-left: 12px; border-left: 3px solid var(--navy); }
.hk-svc-list { margin: 0; padding-left: 1.3em; list-style: disc; }
.hk-svc-list li { font-size: 1.4rem; line-height: 1.95; color: var(--body); }

/* サイバー特集（navy内2カラム） */
.hk-twocol { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,280px),1fr)); gap: clamp(28px,4vw,56px); }
.hk-twocol__p { margin: 0; font-size: 1.5rem; line-height: 2.15; color: #d4d9ec; }

/* ==========================================================================
   相談事例カード
   ========================================================================== */
.hk-case {
  border: 1px solid var(--line);
  border-top: 2px solid var(--navy);
  padding: clamp(30px,3.5vw,44px);
}
.hk-case__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.hk-case__no { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.18em; color: var(--num); }
.hk-case__tag { font-family: var(--mincho); font-size: 1.1rem; color: var(--navy); border: 1px solid var(--partner); padding: 3px 10px; }
.hk-case__title { margin: 0 0 14px; font-family: var(--mincho); font-weight: 600; font-size: 2rem; line-height: 1.55; color: var(--ink); }
.hk-case__text { margin: 0; font-size: 1.45rem; line-height: 2; color: var(--body); }

/* 事例下のCTAボックス */
.hk-ctabox { margin-top: clamp(48px,6vw,72px); background: var(--gray); border: 1px solid var(--line); padding: clamp(32px,4vw,52px); text-align: center; }
.hk-ctabox__h { margin: 0 0 24px; font-family: var(--mincho); font-size: clamp(1.7rem,2.2vw,2.2rem); line-height: 1.7; color: var(--ink); }
.hk-ctabox__text { margin: 0 auto 32px; max-width: 30em; font-size: 1.45rem; line-height: 2; color: var(--body); }

/* ==========================================================================
   取り扱い保険会社グリッド
   ========================================================================== */
.hk-partner { background: #fff; text-decoration: none; color: inherit; display: flex; flex-direction: column; }
.hk-partner__logo { height: 140px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--line2); font-family: var(--cinzel); font-size: 2.4rem; letter-spacing: 0.14em; color: var(--navy); }
.hk-partner__logo--ja { font-family: var(--mincho); font-weight: 600; font-size: 2.2rem; letter-spacing: 0.06em; }
.hk-partner__logo img { max-width: 80%; max-height: 70%; width: auto; height: auto; object-fit: contain; }
.hk-partner__row { padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hk-partner__name { font-family: var(--mincho); font-size: 1.5rem; color: var(--ink); }
.hk-partner__sub { font-family: var(--mincho); font-size: 1.1rem; color: var(--muted); margin-top: 4px; }
.hk-partner__ext { font-family: var(--cinzel); font-size: 1.1rem; letter-spacing: 0.12em; color: var(--navy); white-space: nowrap; }
.hk-partner--more { background: var(--gray); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 40px 26px; }
.hk-hairgrid--2 .hk-partner--more { grid-column: 1 / -1; }
.hk-partner--more .hk-partner__name { color: var(--sub); }
.hk-partner--more .hk-partner__sub { font-size: 1.2rem; line-height: 1.7; text-align: center; }
.hk-note { margin: 28px 0 0; font-family: var(--mincho); font-size: 1.2rem; color: var(--muted); line-height: 1.9; }

/* ==========================================================================
   ブログ一覧 / 記事 / サイドバー（main-side 2カラム）
   ========================================================================== */
.hk-blogwrap { display: flex; flex-wrap: wrap; gap: clamp(36px,5vw,64px); align-items: flex-start; }
.hk-blogmain { flex: 1 1 380px; min-width: 0; }
.hk-side { flex: 1 1 240px; max-width: 320px; display: flex; flex-direction: column; gap: 40px; }

/* カテゴリフィルタ */
.hk-filter { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 40px; border-bottom: 1px solid var(--line); padding-bottom: 28px; }
.hk-filter__all { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.12em; color: #fff; background: var(--navy); padding: 9px 20px; }
.hk-filter__item { font-family: var(--mincho); font-size: 1.3rem; color: var(--navy); background: #fff; border: 1px solid var(--partner); padding: 9px 20px; text-decoration: none; cursor: pointer; line-height: 1.4; transition: background .2s, color .2s, border-color .2s; }
.hk-filter__item:hover { background: var(--navy); color: #fff; opacity: 1; }
.hk-filter__item.is-active { background: var(--navy); color: #fff; border-color: var(--navy); cursor: default; }
/* カテゴリパネル（CMSコードをカテゴリ別に差し込む） */
.hk-blog-panel { display: none; }
.hk-blog-panel.is-active { display: block; }

/* 一覧行 */
.hk-entry { display: grid; grid-template-columns: 160px 1fr; gap: 28px; text-decoration: none; color: inherit; padding: 28px 0; border-bottom: 1px solid var(--line); }
.hk-entry__img { aspect-ratio: 4/3; background: var(--gray); border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; font-family: var(--cinzel); font-size: 1.1rem; letter-spacing: 0.18em; color: var(--num); overflow: hidden; }
.hk-entry__img img { width: 100%; height: 100%; object-fit: cover; }
.hk-entry__title { margin: 0 0 8px; font-family: var(--mincho); font-weight: 600; font-size: clamp(1.6rem,2vw,1.9rem); line-height: 1.6; color: var(--ink); }
.hk-entry__excerpt { margin: 0; font-size: 1.35rem; line-height: 1.9; color: #5b6075; }
@media (max-width: 639px) {
  .hk-entry { grid-template-columns: 100px 1fr; gap: 16px; }
}

/* ページネーション（デザイン踏襲） */
.hk-pager { display: flex; justify-content: center; gap: 8px; margin-top: 48px; }
.hk-pager a, .hk-pager span { font-family: var(--cinzel); font-size: 1.4rem; height: 44px; min-width: 44px; display: flex; align-items: center; justify-content: center; text-decoration: none; }
.hk-pager .is-current { color: #fff; background: var(--navy); }
.hk-pager a { color: var(--navy); border: 1px solid var(--partner); }
.hk-pager a:hover { background: var(--navy); color: #fff; opacity: 1; }
.hk-pager__next { padding: 0 18px; letter-spacing: 0.08em; }

/* サイドバー */
.hk-side__title { margin: 0 0 18px; font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.2em; color: var(--navy); border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.hk-side__cats { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }
.hk-side__cats a { display: flex; justify-content: space-between; font-family: var(--mincho); font-size: 1.4rem; color: var(--body3); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--line2); }
.hk-side__cats a:hover { color: var(--navy); opacity: 1; }
.hk-side__cats span:last-child { color: var(--muted); }
.hk-side__recent { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 16px; }
.hk-side__recent a { text-decoration: none; color: inherit; display: block; }
.hk-side__recent-date { font-family: var(--cinzel); font-size: 1.1rem; color: var(--muted); letter-spacing: 0.06em; margin-bottom: 5px; }
.hk-side__recent-title { font-family: var(--mincho); font-size: 1.35rem; line-height: 1.6; color: var(--body3); }
.hk-side__recent a:hover .hk-side__recent-title { color: var(--navy); }
.hk-side__archive { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }
.hk-side__archive a { font-family: var(--mincho); font-size: 1.4rem; color: var(--body3); text-decoration: none; padding: 11px 0; border-bottom: 1px solid var(--line2); display: block; }
.hk-side__archive a:hover { color: var(--navy); opacity: 1; }
.hk-side__box { background: var(--navy); color: #fff; padding: 32px 28px; }
.hk-side__box-h { margin: 0 0 12px; font-family: var(--mincho); font-weight: 600; font-size: 1.7rem; }
.hk-side__box-text { margin: 0 0 20px; font-size: 1.3rem; line-height: 1.9; color: #c7cde3; }
.hk-side__box-btn { display: inline-block; font-family: var(--cinzel); font-weight: 600; font-size: 1.2rem; letter-spacing: 0.12em; color: var(--navy); background: #fff; text-decoration: none; padding: 13px 24px; }
.hk-side__box-btn:hover { background: #e7eaf6; color: var(--navy); opacity: 1; }

/* 記事本文 */
.hk-crumbbar { background: var(--gray); border-bottom: 1px solid var(--line); }
.hk-crumbbar__in { max-width: 1200px; margin: 0 auto; padding: 18px clamp(24px,5vw,40px); }
.hk-crumbbar p { margin: 0; font-family: var(--mincho); font-size: 1.25rem; color: var(--sub); }
.hk-crumbbar a { color: var(--sub); text-decoration: none; }
.hk-crumbbar a:hover { color: var(--navy); opacity: 1; }
.hk-crumbbar__cur { color: var(--ink); }
.hk-article { flex: 1 1 420px; min-width: 0; }
.hk-article__meta { display: flex; gap: 14px; align-items: center; margin-bottom: 20px; }
.hk-article__title { margin: 0 0 32px; font-family: var(--mincho); font-weight: 600; font-size: clamp(2.4rem,3.4vw,3.8rem); line-height: 1.55; letter-spacing: 0.02em; color: var(--ink); }
.hk-article__hero { aspect-ratio: 16/9; background: var(--navy); display: flex; align-items: flex-end; padding: 28px; margin-bottom: 40px; overflow: hidden; }
.hk-article__hero img { width: 100%; height: 100%; object-fit: cover; }
.hk-article__hero-label { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.22em; color: #aeb7d6; }
.hk-article__body { font-size: 1.55rem; line-height: 2.25; color: var(--body3); }
.hk-article__body p { margin: 0 0 28px; }
.hk-article__body h2 { margin: 48px 0 18px; font-family: var(--mincho); font-weight: 600; font-size: clamp(1.9rem,2.4vw,2.4rem); line-height: 1.5; color: var(--navy); border-left: 3px solid var(--navy); padding-left: 16px; }
.hk-article__body ul { margin: 0 0 28px; padding-left: 1.3em; list-style: disc; }
.hk-article__body li { margin-bottom: 10px; line-height: 1.9; }
.hk-article__nav { margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 16px; }
.hk-article__nav a { font-family: var(--mincho); font-size: 1.35rem; color: var(--navy); text-decoration: none; }
.hk-article__nav a:hover { opacity: .7; }
.hk-article__nav .hk-article__nav-list { font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.12em; color: var(--body3); }

/* ==========================================================================
   contact form
   ========================================================================== */
.hk-contact { display: flex; flex-wrap: wrap; gap: clamp(40px,5vw,72px); align-items: flex-start; }
.hk-form-col { flex: 1 1 440px; min-width: 0; }
.hk-form-intro { margin: 0 0 36px; font-size: 1.5rem; line-height: 2.1; color: var(--body); }
.hk-form { display: flex; flex-direction: column; gap: 26px; }
.hk-field__label { display: flex; align-items: center; gap: 10px; font-family: var(--mincho); font-size: 1.4rem; color: var(--ink); margin-bottom: 10px; }
.hk-req { font-family: var(--cinzel); font-size: 1rem; letter-spacing: 0.1em; color: #fff; background: var(--navy); padding: 2px 7px; }
.hk-input { width: 100%; padding: 15px 16px; border: 1px solid #d4d7e4; background: #fff; font-size: 1.5rem; color: #23283c; font-family: var(--mincho); border-radius: 0; }
.hk-input:focus { outline: none; border-color: var(--navy); }
textarea.hk-input { line-height: 1.8; resize: vertical; }
.hk-field-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,220px),1fr)); gap: 26px; }
.hk-agree { display: flex; align-items: flex-start; gap: 10px; font-family: var(--mincho); font-size: 1.35rem; color: var(--body); line-height: 1.7; }
.hk-agree input { margin-top: 4px; width: 16px; height: 16px; accent-color: var(--navy); flex: none; }
.hk-agree a { color: var(--navy); }
.hk-submit { font-family: var(--cinzel); font-weight: 600; font-size: 1.4rem; letter-spacing: 0.12em; color: #fff; background: var(--navy); border: none; padding: 18px 52px; cursor: pointer; transition: background .2s; align-self: flex-start; }
.hk-submit:hover { background: var(--navy-d); }
.hk-formnote { margin: 0 0 16px; font-family: var(--mincho); font-size: 1.4rem; color: var(--navy); background: var(--base-color-light, #eef1fb); border: 1px solid #c9d2ef; padding: 14px 18px; }

/* CMSフォーム：必須マーク色をネイビーに */
.form-pattern-1 dl dt:not(.pattern-exclusion) span.required::before {
    background: #001872!important;
}

/* CMSフォーム：送信ボタンをサイトのボタンデザインに */
.submit-btn {
    font-family: var(--cinzel)!important;
    font-weight: 600!important;
    font-size: 1.4rem!important;
    letter-spacing: 0.12em!important;
    color: #fff!important;
    background: #001872!important;
    border: none!important;
    border-radius: 0!important;
    padding: 18px 52px!important;
    cursor: pointer!important;
    transition: background .2s!important;
    -webkit-appearance: none!important;
            appearance: none!important;
    width: auto!important;
}
.submit-btn:hover {
    background: #0a235c!important;
    opacity: 1!important;
}

/* contact aside */
.hk-cinfo { flex: 1 1 280px; max-width: 380px; display: flex; flex-direction: column; gap: 32px; }
.hk-cinfo__box { background: var(--gray); border: 1px solid var(--line); padding: clamp(28px,3vw,36px); }
.hk-cinfo__title { margin: 0 0 22px; font-family: var(--cinzel); font-size: 1.2rem; letter-spacing: 0.2em; color: var(--navy); border-bottom: 1px solid var(--line); padding-bottom: 14px; }
.hk-cinfo__name { font-family: var(--mincho); font-size: 1.5rem; color: var(--ink); margin-bottom: 18px; }
.hk-cinfo__dl { margin: 0; font-size: 1.4rem; line-height: 1.9; color: var(--body); }
.hk-cinfo__dl > div { margin-bottom: 14px; }
.hk-cinfo__dl > div:last-child { margin-bottom: 0; }
.hk-cinfo__dt { font-family: var(--cinzel); font-size: 1.1rem; letter-spacing: 0.14em; color: var(--sub); margin-bottom: 3px; }
.hk-cinfo__dd { margin: 0; }
.hk-cinfo__map { border: 1px solid var(--line); line-height: 0; }
.hk-cinfo__map iframe { width: 100%; height: 280px; border: 0; display: block; }

/* policy 末尾ボックス */
.hk-policy-box { margin-top: 48px; background: var(--gray); border: 1px solid var(--line); padding: clamp(28px,4vw,40px); }
.hk-policy-box p { margin: 0; font-family: var(--mincho); font-size: 1.4rem; line-height: 2; color: var(--body); }

/* ==========================================================================
   reveal animation（控えめなフェードアップ）
   ========================================================================== */
.hk-reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.hk-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .hk-reveal { opacity: 1; transform: none; transition: none; } }

/* ==========================================================================
   responsive
   ========================================================================== */
@media (max-width: 1100px) {
  /* MV: PC以下は中央スライドのみ・カルーセル横並びを抑制 */
  .hk-mv__stage-wrap { height: clamp(420px, 70vh, 620px); }
}
@media (max-width: 896px) {
  .hk-sechead { margin-bottom: 36px; }
  .hk-rep { margin-top: 32px; }
}
@media (max-width: 639px) {
  .hk-mv__slide { width: 86vw; }
  .hk-overview__row { grid-template-columns: 1fr; }
  .hk-overview__dt { padding: 16px 0 0; }
  .hk-overview__dd { padding: 6px 0 16px; }
  .hk-numlist__item { grid-template-columns: 44px 1fr; }
  .hk-numlist__no { font-size: 2rem; }
}