/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 08 2026 | 16:14:16 */
/* ★：要確認 */
/*===========================================
 * xxx
 *==========================================*/
/* === xxx === */

/*===========================================
 * 変数定義
 *==========================================*/

/* === 共通 === */
/* 変数名（色）：--color-カテゴリ-役割-状態
 * カテゴリ：brand / ink / bg / ui / consulting / training / coaching / btn / link など
 * 役割：main / bg / text / hover / active / border など
 * 状態：（必要に応じて）hover / active / focus など */

:root {
  /* === コンテナ === */

  /* 基本コンテナ（サイト標準） */
  --container: 1080px;

  /* 文章だけ狭くする幅（おすすめ：860〜920px） */
  --container-text: 920px;

  /* 左右余白（全体統一） */
  --gutter: clamp(16px, 4vw, 32px);

  /* セクション上下余白（任意：統一したいなら） */
  --section-y: clamp(48px, 6vw, 88px);

  /* === Brand === */
  --color-brand-main: #4A3D66;  /* ブランド メイン */
  --rgb-brand-main: 74 61 102;  /* #4A3D66 */

  --color-brand-accent: #F4B63F;  /* アクセント */
  --rgb-brand-accent: 244 182 63;

  /* === Services === */

  /* コンサルティング */
  --color-consulting-main: #5F7BA0;  /* コンサルティング メイン */
  --rgb-consulting-main: 95 123 160;  /* #5F7BA0 */

  /* 研修 */
  --color-training-main: #E58C76;  /* 研修 メイン */
  --rgb-training-main: 229 140 118;  /* #E58C76 */

  /* コーチング */
  --color-coaching-main: #8FA893;  /* コーチング メイン */
  --rgb-coaching-main: 143 168 147;  /* #8FA893 */

  /* === Ink === */
  --color-ink-strong: #222222;
  --color-ink-base:   #333333;
  --color-ink-weak:   #666666;
  --color-ink-muted:  #999999;

  /* === Background === */

  /* 共通 */
  --color-bg-base:       #FFFFFF;
  --color-bg-beige:      #F7F4EE;  /* ベージュ */
  --color-bg-gray:       #F4F5F3;  /* グレー */

  --color-bg-brand:      #F0EDF7;
  --color-bg-consulting: #EEF3F8;
  --color-bg-training:   #FBF0EC;
  --color-bg-coaching:   #EEF4F1;

  /* コンサルティング */
  --color-bg-bridge-consulting: #FFF9F1;  /* 初回相談ボックス用の淡いあたたかさ */

  /* === UI === */

  /* 0. アルファ */

  /* カード背景 */
  --a-expand-card-bg: 0.02;        /* 2.拡張カードのカード背景：主役感をほんの少し */
  --a-expand-card-bg-hover: 0.03;
  --a-simple-card-bg: 0.01;        /* 3.シンプルカードのカード背景：読みやすさ重視でごく薄く */
  --a-simple-card-bg-hover: 0.02;
  --a-flow-card-bg: 0;             /* 4.流れカードのカード背景：基本は白のまま */

  /* 他 */
  --a-card-li: 0.90;  /* 箇条書きドット */

  --a-soft: 0.10;    /* 2.拡張カードのボタン背景・3.シンプルカードのアイコン背景・4.流れカードのStep */
  --a-border: 0.12;  /* 2.拡張カードの区切り線・3.シンプルカードの枠線 */

  --a-expand-card-border: 0.14;        /* 2.拡張カードの枠線 */
  --a-expand-card-border-hover: 0.26;  /* 2.拡張カードの枠線ホバー */
  --a-expand-btn-border: 0.09;         /* 2.拡張カードのボタン枠線 */
  --a-expand-btn-bg-hover: 0.18;       /* 2.拡張カードのボタン背景ホバー */
  --a-expand-btn-shadow-hover: 0.12;   /* 2.拡張カードのボタン影ホバー */
  --a-expand-btn-focus-outline: 0.35;  /* 2.拡張カードのボタンフォーカスアウトライン */

  --a-simple-icon-outline: 0.14;  /* 3.シンプルカードのアイコンアウトライン */

  --a-flow-card-border: 0.10;  /* 4.流れカードの枠線 */
  --a-flow-tag-bg: 0.08;       /* 4.流れカードの期間タグ背景 */
  --a-flow-tag-border: 0.20;   /* 4.流れカードの期間タグ枠線 */

  /* 1. サービスカード（トップページ） */
  --color-card-tag-bg:  #E8E2F2;
  --color-card-tag-ink: #3A3550;
  --color-card-bg:      #F9F8FB;
  --color-card-line:    rgba(74,61,102,.12);
  --color-card-shadow:       0 4px 12px rgba(0,0,0,.05);
  --color-card-shadow-hover: 0 8px 24px rgba(0,0,0,.08);
  --color-card-border-dark: #0000;

  /* 共通：（2. 拡張, 3. シンプル, 4. 流れ）  */
  --color-card-icon-grad-consulting: #768FB1;
  --color-card-icon-grad-training:   #EBAA95;
  --color-card-icon-grad-coaching:   #A6BBAA;

  /* 2. 拡張カード */
  --color-expand-icon: #FFFFFF;
  --expand-card-gap: 1.2rem;  /* 好みで 1rem〜1.5rem の間で調整 */

  /* 3. シンプルカード */
  --color-simple-bg:   #FFFFFF;

  /* 4. 流れカード */

  /* === Buttons & Links === */

  /* 共通 */
  --color-btn-bg-main:     var(--color-brand-accent);

  /* === Card === */
  --card-radius: 1.25rem;

}

/*===========================================
 * 変数置換
 *==========================================*/

/* トップページ用 */
.page-top {
  --color-base: var(--color-brand-main);  /* メイン 基本色 */
  --rgb-base:   var(--rgb-brand-main);
  --color-bg: var(--color-bg-brand);
}

/* A：コンサルティングページ用 */
.page-a {
  --color-base: var(--color-consulting-main);  /* サービスA 基本色 */
  --rgb-base:   var(--rgb-consulting-main);
  --color-bg: var(--color-bg-consulting);
  --color-card-icon-grad: var(--color-card-icon-grad-consulting);  /* サービスA アイコン背景グラデーション薄色 */
}

/* B：研修ページ用 */
.page-b {
  --color-base: var(--color-training-main);  /* サービスB 基本色 */
  --rgb-base:   var(--rgb-training-main);
  --color-bg: var(--color-bg-training);
  --color-card-icon-grad: var(--color-card-icon-grad-training);  /* サービスB アイコン背景グラデーション薄色 */
}

/* C：コーチングページ用 */
.page-c {
  --color-base: var(--color-coaching-main);  /* サービスC 基本色 */
  --rgb-base:   var(--rgb-coaching-main);
  --color-bg: var(--color-bg-coaching);
  --color-card-icon-grad: var(--color-card-icon-grad-coaching);  /* サービスC アイコン背景グラデーション薄色 */
}

/* プロフィールページ用 */
.page-profile {
  --color-base: var(--color-brand-main);  /* メイン 基本色 */
  --rgb-base:   var(--rgb-brand-main);
  --color-bg: var(--color-bg-brand);  /* nouse */
}

/*===========================================
 * セクションの上下余白と背景バリエーション
 *==========================================*/

/* セクションは上下余白だけ担当（任意） */
.section {
  padding-block: var(--section-y);
}

/* 共通 */
.section.is-base { background: var(--color-bg-base); }
.section.is-beige { background: var(--color-bg-beige); }
.section.is-gray { background: var(--color-bg-gray); }

.section.is-color { background: var(--color-bg); }

/* コンサルティング */
.section.is-bridge-consulting { background: var(--color-bg-bridge-consulting); }

 /* 標準コンテナ：カード/一覧/一般ページ用 */
.wrap {
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* 文章ブロック専用：読みやすさ優先のナロー幅 */
.prose {
  max-width: var(--container-text);
  /* margin-inline: auto; */
}

/* prose の中は、段落の読みやすさを少し整える（お好みで） */
.prose p {
  /* すでに整っていれば不要。保険として */
  text-wrap: pretty;
}

/*===========================================
 * フォント・見出し
 *==========================================*/

/* フォント */
body {
  font-family: "Noto Sans JP", "Hiragino Sans", sans-serif;
  font-size: 16px;
  color: var(--color-ink-base);
  line-height: 1.7;
}

/* 見出し */
h1 {
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--color-ink-strong);
}
h2 {
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--color-ink-strong);
}
h2 + .subtitle_h2 {
  font-size: 1.5rem;
  font-weight: 400;
  color: var(--color-ink-weak);
  margin-top: 0px;
}

h3 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--color-ink-base);
}
h4 {
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--color-ink-base);
}

/* === 英語ラベル付き見出し === */

/* 見出し：日本語 | 英語（小さめ） */
h2.section-heading {
	font-size: 2.4rem;
  margin: 24px 0px 0px;
  border: 0px;
  padding: 0px;
  position: relative;
}
h2.section-heading::after {
	content: "| " attr(data-label);
	font-size: 1.2rem;
  font-weight: 600;
  color: var(--color-base);
  margin-left: 0.5rem;
}

/* === ハイライト === */

/* 共通スタイル */
.highlight {
  font-weight: 600;                 /* 目立たせたい時は700、控えめなら600 */
  padding: 0 0.08em;                /* 文字滲み抑制の極小余白 */
  background-repeat: no-repeat;
  background-position: 0 100%;      /* 行下端に寄せる（85%→100%で揺れを抑制） */
  background-size: 100% 40%;        /* 下40%をマーカー塗り */
  box-decoration-break: clone;      /* 複数行で切れない */

  background-image: linear-gradient(
    to bottom,
    rgb(var(--rgb-base) / 0.00) 45%,
    rgb(var(--rgb-base) / 0.20) 45%
  );
  background-size: 100% 55%;
}

/* === 補足1行（肩書き） === */

.lp-profile-role {
  font-weight: 600;
  color: var(--color-brand-main);
  margin-bottom: 0.75rem;
  letter-spacing: 0.04em;
}

/*===========================================
 * 1. サービスカード（トップページ）
 *==========================================*/

.services {
  display: grid;
  gap: clamp(16px,2.5vw,28px);
  grid-template-columns: repeat(3,minmax(0,1fr));
  margin: 4rem 0;
}
@media(max-width: 1024px) { .services {grid-template-columns: repeat(2,1fr);} }
@media(max-width: 640px) { .services {grid-template-columns: 1fr;} }

.service-card {
  position: relative; display:flex; flex-direction:column;
  background: var(--color-card-bg);
  border: 1px solid var(--color-card-line);
  border-radius: var(--card-radius);
  padding: clamp(20px,2.4vw,30px);
  box-shadow: var(--color-card-shadow);
  transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
  overflow: hidden;
}
.service-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--color-card-shadow-hover);
}

/* 上端アクセント（各サービス色で既に差別化） */
.service-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  opacity: .24;
  background: linear-gradient(90deg,var(--color-brand-main),transparent);
}
.service-card.consulting::before { background: linear-gradient(90deg,var(--color-consulting-main),transparent); }
.service-card.training::before {   background: linear-gradient(90deg,var(--color-training-main),transparent); }
.service-card.coaching::before {   background: linear-gradient(90deg,var(--color-coaching-main),transparent); }

/* 上部レール行 */
.card-head.rail {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 56px;
  margin-bottom: 16px;
}

/* アイコン：単色SVG（currentColor） */
.icon-area {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgb(var(--rgb-base) / 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 48px;
  transform: translateY(-1px); /* 光学補正 */
}
.icon-area svg {
  width: 26px; height: 26px;
  color: var(--color-brand-main);                 /* 通常：紫（統一） */
  transition: color .35s cubic-bezier(.4,0,.2,1);
}

/* 右上CTA（“Learn more >”） */
.cta-top__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  color: var(--color-brand-main);
  text-decoration: none;
  padding: 10px 12px;
  border-radius: 999px;
  min-height: 44px;
  min-width: 44px;
  background: rgb(var(--rgb-base) / 0.04);
  transition: background .2s ease, transform .2s ease;
}
.cta-top__link::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-btn-bg-main);
  box-shadow: 0 0 0 2px rgb(var(--rgb-brand-accent) / 0.18);
}
.cta-top__link:hover { background:rgb(var(--rgb-base) / 0.08); transform:translateY(-1px); }
.cta-top__link:focus { outline:3px solid rgb(var(--rgb-base) / 0.35); outline-offset:3px; }
.cta-top__icon { width:12px; height:12px; flex:0 0 12px; transition:transform .18s ease; }
.cta-top__link:hover .cta-top__icon,
.cta-top__link:focus-visible .cta-top__icon,
.cta-top__link:active .cta-top__icon { transform: translateX(1px); }

/* aタグとして使うときのリセット */
a.cta-top__link,
a.cta-top__link:visited,
a.cta-top__link:hover,
a.cta-top__link:focus {
  text-decoration: none;
  color: var(--color-brand-main);
}

/* タイトル以下 */
h3.service-title,
h3.expand-title,
h3.simple-title,
h3.flow-title {
  margin: 6px 0 4px;
  border: 0px;
  padding: 0px;
  font-weight: 700;
  font-size: clamp(18px,1.4vw,22px);
  color: var(--color-base);
}

p.service-sub,
p.expand-sub,
p.simple-sub {
  margin: 0 0 10px;
  color: var(--color-ink-weak);
  font-weight: 600;
  font-size: clamp(14px,1.1vw,16px);
}

p.service-text,
p.expand-lead,
p.simple-lead,
p.flow-lead {
  color: var(--color-ink-base);
  line-height: 1.9;
  font-size: clamp(14px,1.15vw,16px);
  margin: 0px 0 1.6rem;
  max-width: 60ch;
}

p.expand-lead + p.expand-lead,
p.simple-lead + p.simple-lead {
  margin-top: -1.6rem;
}

/* タグ */
ul.service-tags {
  list-style: none;
  padding: 0;
  margin: 6px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap:8px;
}
ul.service-tags li span {
  background: var(--color-card-tag-bg);
  color: var(--color-card-tag-ink);
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12.5px;
  line-height: 1;
  white-space: nowrap;
}

/* === B’：hoverで各カード固有色に（アイコン＆枠） === */
.service-card.consulting:hover { border-color: color-mix(in oklab, var(--color-consulting-main) 55%, var(--color-card-border-dark)); }
.service-card.training:hover {   border-color: color-mix(in oklab, var(--color-training-main) 55%, var(--color-card-border-dark)); }
.service-card.coaching:hover {   border-color: color-mix(in oklab, var(--color-coaching-main) 55%, var(--color-card-border-dark)); }

.service-card.consulting:hover .icon-area svg { color: var(--color-consulting-main); }
.service-card.training:hover   .icon-area svg { color: var( --color-training-main); }
.service-card.coaching:hover   .icon-area svg { color: var(--color-coaching-main); }

/* ===== Contact CTA (Primary gold) ===== */

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  .service-card:hover { transform: none; box-shadow: var(--color-card-shadow); }
  .cta-top__link, .cta-top__icon, .btn { transition: none; }
}

/*===========================================
 * 2. 拡張カード（各サービスページ）
 *==========================================*/

/* カードを横並び・高さバラバラでOKに */
.expand-card-grid {
  max-width: var(--container);
  margin: 4rem auto;  /* 0 auto */
  padding: 0rem; /* 0 1.5rem */
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: flex-start;
}

.expand-card {
  background: rgb(var(--rgb-base) / var(--a-expand-card-bg));
  border: 1px solid rgb(var(--rgb-base) / var(--a-expand-card-border));
  border-radius: var(--card-radius);
  box-shadow: 0 6px 22px rgba(0,0,0,.04);
  display: flex;
  flex-direction: column;
  position: relative;
  width: min(100%, 325px); /* 330px */
  transition: box-shadow .15s ease, transform .15s ease, border .15s ease;
}
.expand-card:hover {
  background: rgb(var(--rgb-base) / var(--a-expand-card-bg-hover));
  border: 1px solid rgb(var(--rgb-base) / var(--a-expand-card-border-hover));
  box-shadow: 0 14px 40px rgba(0,0,0,.04);
  transform: translateY(-2px);
}

.expand-card-body {
  padding: 2rem 2rem 6rem;  /* ボタン位置がテキストと重ならないように調整 */
  display: flex;
  flex-direction: column;
  gap: var(--expand-card-gap);  /* アイコン〜タイトル〜リード〜主なテーマ の間隔 */
}

.expand-icon {
  width: 52px;
  height: 52px;
  border-radius: 9999px;
  background: linear-gradient(145deg, var(--color-base), var(--color-card-icon-grad)); /* 控えめグラデーション */
  display: grid;
  place-items: center;
  color: var(--color-expand-icon);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 1px 2px rgba(0,0,0,.04); /* 微光沢 */
}
.expand-icon svg {
  width: 26px;
  height: 26px;
}

/* ===== ボタン（トップページのLearn moreと同じ構造） ===== */
.expand-toggle {
  position: absolute;
  right: 2rem;  /* 右が20pxになるように調整 */
  /* right: 1.05rem; */
  bottom: 1.6rem;  /* 右が16pxになるように調整 */
  /* bottom: 1.05rem; */
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 1.2rem;
  /* font-size: 0.75rem; */
  line-height: 1;
  color: var(--color-base);  /* テキストはサービスカラー */
  text-decoration: none;
  padding: 10px 12px;
  border-radius: 999px;
  min-height: 40px;
  background: rgb(var(--rgb-base) / var(--a-soft));
  border: 1px solid rgb(var(--rgb-base) / var(--a-expand-btn-border));  /* ほぼ見えない境界線 */
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease, color .2s ease;
  cursor: pointer;
  z-index: 2;
}

/* 小さなゴールドの丸（トップと同じ） */
.expand-toggle::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--color-brand-accent);
  box-shadow: 0 0 0 2px rgb(var(--rgb-brand-accent) / 0.16);
}

.expand-toggle:hover {
  background: rgb(var(--rgb-base) / var(--a-expand-btn-bg-hover));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgb(var(--rgb-base) / var(--a-expand-btn-shadow-hover));
}

.expand-toggle:focus-visible {
  outline: 3px solid rgb(var(--rgb-base) / var(--a-expand-btn-focus-outline));
  outline-offset: 3px;
}

.expand-toggle__icon {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  transition: transform .15s ease;
}
.expand-toggle__icon path {
  stroke: currentColor;
}

/* 開いたときは下に流すだけ（色はそのまま） */
.expand-card.is-open .expand-toggle {
  position: static;
  align-self: flex-end;
  margin: 0.3rem 2rem 1.6rem;  /* 下が16px・左右が20pxになるように調整 */
  /* margin: .3rem 1.25rem 1rem; */
}
.expand-card.is-open .expand-toggle__icon {
  transform: rotate(180deg);
}

/* ===== 詳細（アコーディオン） ===== */
.expand-details {
  max-height: 0;
  overflow: hidden;
  transition: max-height .25s ease, opacity .2s ease;
  opacity: 0;
  padding: 0 2rem 0;  /* 左右が20pxになるように調整 */
  /* padding: 0 1.25rem 0; */
  /* 拡張部もflexにする */
  display: flex;
  flex-direction: column;
  gap: var(--expand-card-gap);
}

.expand-card.is-open .expand-details {
  opacity: 1;
  padding-bottom: 2rem;  /* 下が20pxになるように調整 */
  /* padding-bottom: 1.1rem; */
}

/* 開いた時だけ、左右が短いラインを表示 */
.expand-card.is-open .expand-details {
  --line-gap-top: 0.70rem;    /* 上から線まで */
  --line-gap-side: 1.25rem; /* 左右の余白 */
  --line-gap-bottom: 1rem;/* 線から本文まで */

  /* 上に余白（線＋下余白）を確保 */
  padding-top: calc(var(--line-gap-top) + 1px + var(--line-gap-bottom));

  /* 線を“横方向グラデーション”として1pxで描く */
  background-image: linear-gradient(
    to right,
    rgb(var(--rgb-base) / var(--a-border)),
    rgb(var(--rgb-base) / var(--a-border))
  );
  background-repeat: no-repeat;

  /* 左右を接地させない */
  background-size: calc(100% - (var(--line-gap-side) * 2)) 1px;

  /* 線の位置（上から gap 分 乖離した位置） */
  background-position: center var(--line-gap-top);
}

h4.expand-details-title {
  margin: 0 0 0.4rem;    /* 上は0・下だけ少し */
  border: 0;
  padding: 0;
  font-weight: 600;
  font-size: clamp(15px,1.2vw,18px);
  color: rgba(0,0,0,.75);
  line-height: 1.4;
}

ul.expand-list {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
}
ul.expand-list li {
  line-height: 1.5;
  margin-bottom: 0.25rem;
  padding-left: 1.6rem;
  position: relative;
}
ul.expand-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: rgb(var(--rgb-base) / var(--a-card-li));
}

@media (max-width: 720px) {
  .expand-card {
    width: 100%;
  }
}

/*===========================================
 * 3. シンプルカード（各サービスページ）
 *==========================================*/

/* === 横並び & 高さ揃え === */
.simple-card-grid {
  max-width: var(--container);
  margin: 4rem auto;  /* 0 auto */
  padding: 0rem; /* 0 1.5rem */
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: stretch; /* 高さを揃えるポイント */
}

/* === カード本体 === */
.simple-card {
  background: rgb(var(--rgb-base) / var(--a-simple-card-bg));
  border: 1px solid rgb(var(--rgb-base) / var(--a-border));
  border-radius: var(--card-radius);
  box-shadow: 0 4px 16px rgba(0,0,0,.02);
  display: flex;
  flex-direction: column; /* 中身を上下に並べ、stretchに対応 */
  width: min(100%, 350px); /* 330px */
  transition: none;
}

.simple-card:hover {
  background: rgb(var(--rgb-base) / var(--a-simple-card-bg-hover));
}

.simple-card-body {
  padding: 2rem;  /* 上・左右が20pxになるように調整 */
  display: flex;
  flex-direction: column;
  gap: 1.2rem;  /* 0.6rem */
  flex-grow: 1; /* 本体を伸縮させて高さ調整 */
}

.simple-icon {
  width: 48px;
  height: 48px;
  border-radius: 9999px;
  background: rgb(var(--rgb-base) / var(--a-soft));
  display: grid;
  place-items: center;
  color: var(--color-base);
  outline: 1px solid rgb(var(--rgb-base) / var(--a-simple-icon-outline));
  outline-offset: -1px;
}
.simple-icon svg {
  width: 24px;
  height: 24px;
}

@media (max-width: 720px) {
  .simple-card {
    width: 100%;
  }
}

 /*===========================================
 * 4. 流れカード（各サービスページ）
 *==========================================*/

/* === カード群 === */
.flow-card-grid {
  max-width: var(--container);
  margin: 4rem auto;  /* 0 auto */
  padding: 0rem; /* 0 1.5rem */
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: stretch;
}

/* === カード本体 === */
.flow-card {
  background: rgb(var(--rgb-base) / var(--a-flow-card-bg)); /* 既定=0で白 */
  border: 1px solid rgb(var(--rgb-base) / var(--a-flow-card-border));
  border-radius: var(--card-radius);
  box-shadow: none;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: min(100%, 350px); /* 330px */
}

.flow-card-body {
  padding: 2rem 2rem 3.5rem; /* 下にタグとStepぶんの余白 */
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  flex-grow: 1;
}

.flow-icon {
  width: 44px;
  height: 44px;
  border-radius: 9999px;
  background: transparent;
  display: grid;
  place-items: center;
  color: var(--color-base);
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.05));
}
.flow-icon svg {
  width: 22px;
  height: 22px;
}

/* === 左下タグ（基準線） === */
.flow-tag {
  position: absolute;
  left: 2rem;
  bottom: 1rem;             /* ← 基準 */
  background: rgb(var(--rgb-base) / var(--a-flow-tag-bg));
  border: 1px solid rgb(var(--rgb-base) / var(--a-flow-tag-border));
  color: var(--color-base);
  font-size: 0.85rem;                     /* 読みやすく補足情報らしい大きさに */
  font-weight: 500;
  padding: 0.28rem 0.62rem;
  border-radius: 6px;
  letter-spacing: 0.01em;
  line-height: 1.15;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4); /* 控えめな上級の工夫 */
}

/* === Step番号（右下・薄い大文字） === */
.flow-step {
  position: absolute;
  right: 2rem;
  bottom: 1rem;             /* ← タグと同じ高さに配置 */
  transform: translateY(0.25rem); /* ← 文字のベースラインを下に合わせるための微調整 */
  font-size: 2.1rem;
  font-weight: 800;
  color: rgb(var(--rgb-base) / var(--a-soft));
  line-height: 1;
  letter-spacing: 0.02em;
  user-select: none;
  pointer-events: none;
}

@media (max-width: 720px) {
  .flow-card {
    width: 100%;
  }
}

/* =========================
   研修ページ：スペック表
   ========================= */
.spec-table {
  /* 周囲がグレー(#F4F5F3)でも“カード”として浮かせる */
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid rgb(229 140 118 / 22%);  /* add */
  border-radius: 14px;
  overflow: hidden; /* 角丸を効かせる */
  box-shadow: 0 10px 26px rgba(0, 0, 0, .05);
}

/* セル共通 */
.spec-table th,
.spec-table td {
  padding: 0.95rem 1.05rem;
  font-size: 1.4rem;
  line-height: 1.7;
  vertical-align: center;
  border: 0;
}

/* 罫線（行区切り） */
.spec-table tr + tr th,
.spec-table tr + tr td {
  border-top: 1px solid rgba(0, 0, 0, .06);
}

/* 左列（見出し） */
.spec-table th {
  width: 20%;
  min-width: 9.5em;               /* 見出しが詰まりすぎない */
  font-weight: 700;
  background: rgb(229 140 118 / 10%);
  letter-spacing: .02em;
  text-align: left;
}

/* ホバーで行が追いやすく（PCのみ） */
@media (hover:hover) {
  .spec-table tbody tr:hover th {
    background: rgba(244, 182, 63, .2);
  }
    .spec-table tbody tr:hover td {
    background: rgba(244, 182, 63, .08);
  }
}

/* =========================
   スマホ：縦積み（読みやすさ最優先）
   ========================= */
@media (max-width: 640px) {
  .spec-table {
    border-radius: 12px;
  }

  .spec-table th,
  .spec-table td {
    display: block;
    width: 100%;
    padding: 0.8rem 0.95rem;
    border: 0;
  }

  .spec-table th {
    border-right: 0;
    border-top: 0;
    background: rgb(229 140 118 / 10%);
    padding-bottom: 0.55rem;
    text-align: center;
  }

  .spec-table td {
    padding-top: 0.55rem;
  }

  .spec-table tr + tr th,
  .spec-table tr + tr td {
    border-top: 0;
  }

  .spec-table tr + tr th {
    border-top: 1px solid rgba(0, 0, 0, .08);
  }

  .spec-table tr:first-child {
    border-top: 0;
  }
}

/*===========================================
 * Contact Form 7 お問い合わせフォーム用
 *==========================================*/

/* ========= フォーム全体 ========== */

/* フォーム全体の余白調整（必要に応じて） */
.contact-form p {
  margin: 0;
  /* margin-bottom: 1.2em; */
}

/* ラベルはブロック表示にして、上に項目名・下に入力欄の縦並び */
.contact-form label {
  display: block;
  font-weight: 600;
  color: var(--color-base, #333);
}

/* テキスト・メール・セレクト・テキストエリア共通の見た目 */
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form select,
.contact-form textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.6em 0.8em;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 4px;
  line-height: 1.6;
}

/* フォーカス時：メインカラー寄りの枠色（#4A3D66想定） */
.contact-form input[type="text"]:focus,
.contact-form input[type="email"]:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  outline: none;
  border-color: rgba(74,61,102,0.7);
  box-shadow: 0 0 0 1px rgba(74,61,102,0.12);
}

/* テキストエリアは高さ少し大きめ */
.contact-form textarea {
  min-height: 8em;
}

/* ========= 入力欄の上に置く説明文 ========== */

/* フォームの説明文（入力欄の上） */
.contact-form .form-help {
  margin: 0 0 .5rem;          /* 下に少し余白 */
  padding-left: 0.3rem;
  font-size: 1.5rem;           /* 本文より少しだけ小さく */
  line-height: 1.6;
  color: rgba(0,0,0,.72);      /* 文字を薄めに（テーマに合わせて調整） */
}

/* ========= 必須タグ ========== */

/* ラベル名テキスト（必須）の右横にタグを出す基準 */
.required-label .label-text {
  position: relative;
  padding-right: 2.4em; /* 必須タグ分の余白（狭め設定） */
  display: inline-block;
}

/* 必須タグの見た目 */
.required-label .label-text::after {
  content: "必須";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.85rem;      /* 少し大きめに */
  color: #fff;
  background: #d9534f;     /* 落ち着いた赤 */
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 600;
  letter-spacing: 0.03em;
}

/* ========= 任意タグ ========== */

/* ラベル名テキスト（任意）の右横にタグを出す基準 */
.optional-label .label-text {
  position: relative;
  padding-right: 2.4em;
  display: inline-block;
}

/* 任意タグの見た目（必須より控えめなグレー） */
/* サイズは必須タグに合わせる */
.optional-label .label-text::after {
  content: "任意";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.85rem;
  color: #555;
  background: #e5e5e5;
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 500;
  letter-spacing: 0.03em;
}

/* ========= チェックボックス／同意部分 ========== */

/* チェックボックスとテキストの距離を少しだけ開ける */
.contact-form input[type="checkbox"] {
  margin-right: 0.4em;
}

/* ========= チェックボックス／個人情報 ========== */

/* 個人情報の案内文を控えめに整える */
.contact-form .privacy-note {
  font-size: 1.3rem;
  color: #555;
  line-height: 1.6;
  margin-top: 5rem;
  padding-left: 0.3rem;   /* なくてもOK。気になれば微調整用 */
}

.contact-form .privacy-accept {
  margin-top: 0.5em;
  margin-bottom: 1.2em;
}

/* CF7 標準の「チェックボックスだけ右に寄せる」余白を打ち消す */
.contact-form .wpcf7-list-item {
  margin-left: 0;              /* デフォルト 1em を 0 に */
}

/* チェックボックス行（2つとも）の左端を揃える */
.contact-form .confirm-check,
.contact-form .privacy-accept {
  margin-left: 0;
  padding-left: 0;
}

/* チェックボックス自体も、余計な左マージンがあれば消す */
.contact-form .confirm-check input[type="checkbox"],
.contact-form .privacy-accept input[type="checkbox"] {
  margin-left: 0;
}

/* ========= 送信ボタン ========== */

.contact-form .submit input[type="submit"] {
  display: inline-block;
  padding: 0.8em 2.4em;
  border-radius: 999px;
  border: none;
  /* font-size: 0.95rem; */
  font-weight: 600;
  cursor: pointer;
  background: var(--color-base);   /* メインカラー想定 */
  color: #fff;
  transition: background 0.2s ease, transform 0.1s ease, box-shadow 0.1s ease;
}

.contact-form .submit input[type="submit"]:hover {
  background: #3c3055;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}

.contact-form .submit input[type="submit"]:active {
  transform: translateY(0);
  box-shadow: none;
}

/*===========================================
 * 目次設定
 *==========================================*/
/* 目次の自動番号（toc_number）を非表示にする */
#toc_container .toc_number {
  display: none !important;
}

/*===========================================
 * トップページ キービジュアル
 *==========================================*/

/* === トップページ === */
.top-kv {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;
}

/* 内枠：最大幅1920で中央寄せ担当 */
.top-kv .kv-inner {
  max-width: 1920px;
  margin: 0 auto;
}

/* 16:9 を維持しつつレスポンシブにする */
.top-kv__bg img {
  width: 100%;
  height: auto;
  display: block;
}

/* テキスト全体の位置（中央やや上） */
.top-kv__text {
  position: absolute;
  top: 46%;               /* 中央より少し上（PC） */
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  pointer-events: none;   /* 背景クリックを邪魔しないように */
}

/* ぼかし＋白背景のボックス */
.top-kv__text-inner {
  max-width: 680px;
  margin: 0 auto;
  padding: 2.4rem 2.6rem;
  background: rgba(255,255,255,0.42);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px); /* Safari対策 */
  border-radius: 22px;
  text-align: center;
  pointer-events: auto;   /* 中のリンクなどはクリック可 */
}

/* キャッチコピー（h1） */
.top-kv__catch {
  margin: 0 0 20px;
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 700;
  line-height: 1.3;
  color: #333;
}

/* サブコピー */
.top-kv__sub {
  margin: 0;
  font-size: clamp(16px, 1.4vw, 20px);
  line-height: 1.9;
  color: #444;
}

/* ===== スマホ（〜599px）調整 ===== */
@media (max-width: 599px) {

  .top-kv__text {
    top: 48%;             /* ほぼ中央でOK */
    transform: translate(-50%, -50%);
    padding: 0 16px;
  }

  .top-kv__text-inner {
    max-width: 90%;
    padding: 1.8rem 1.6rem; /* ← 少し増やすだけで見違えます */
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.48);
    backdrop-filter: blur(6px);
  }

  .top-kv__catch {
    font-size: clamp(22px, 5.8vw, 28px);
    margin-bottom: 14px;
  }

  .top-kv__sub {
    font-size: clamp(14px, 3.8vw, 17px);
    line-height: 1.8;
  }
}

/* === 各サービスページ === */
.service-kv {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;
}

/* 内枠：最大幅1920で中央寄せ担当 */
.service-kv .kv-inner {
  max-width: 1920px;
  margin: 0 auto;
}

.service-kv__bg img {
  width: 100%;
  height: auto;
  display: block;
}

/* PC：テキストは本文幅（1080）基準で右寄せ */
.service-kv__text {
  position: absolute;
  inset: 0;                 /* top/right/bottom/left:0 */
  display: flex;
  align-items: center;      /* 縦中央 */
  pointer-events: none;

  /* 1080の本文枠を中央に置く */
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 24px;          /* 左右余白（お好みで 16〜32px） */
}

.service-kv__text-inner {
  margin-left: auto;        /* 右に寄せる */
  max-width: 670px;  /* 520px */
  padding: 2.4rem 2.6rem;
  background: rgba(255,255,255,0.5);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 22px;
  text-align: left;
  pointer-events: auto;
}

/* キャッチコピー（h1） */
.service-kv__catch {
  margin: 0 0 16px;
  font-size: clamp(26px, 2.4vw, 34px);       /* トップより少し控えめ */
  font-weight: 700;
  line-height: 1.35;
  color: #333;
}

/* サブコピー */
.service-kv__sub {
  margin: 0;
  font-size: clamp(15px, 1.2vw, 19px);
  line-height: 1.9;
  color: #444;
}

/* ===== スマホ（〜599px）：基本はトップと同じ中央配置 ===== */
/* ===== サービスページ：スマホ（〜599px） ===== */
@media (max-width: 599px) {

  .service-kv__text {
    position: absolute;
    top: 50%;
    left: 50%;
    right: auto;
    transform: translate(-50%, -50%);
    width: 100%;
    padding: 0 16px;
    box-sizing: border-box;
  }

  .service-kv__text-inner {
    max-width: 92%;                 /* ← かなり広めにする */
    margin: 0 auto;
    padding: 1.8rem 1.6rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.56);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    text-align: center;             /* お好みで left にしてもOK */
  }

  .service-kv__catch {
    font-size: clamp(20px, 5.4vw, 24px);  /* ほんの少しだけ小さく */
    margin-bottom: 14px;
    line-height: 1.5;
  }

  .service-kv__sub {
    font-size: clamp(14px, 3.6vw, 17px);
    /* font-size: 0.95rem; */
    line-height: 1.8;
  }
}

/* === キャッチコピーの改行調整 === */
.top-kv__text-inner .keep,
.service-kv__text-inner .keep {
  white-space: nowrap;   /* この塊の途中では絶対に改行させない */
}

/*===========================================
 * その他表示の調整
 *==========================================*/

/* === サービスタイトル === */
.service-title {
  font-size: clamp(16px, 1.4vw, 20px);
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #555;
  margin: 20px 0 0 20px;  /* 位置は好みで調整 */
  opacity: 0.85;
}

/*===========================================
 * テーマの調整
 *==========================================*/

/* === 固定ページの標準タイトル（h1.entry-title）を消す === */
.page .entry-title {
  display: none;
}

/* 固定ページでは 投稿日・更新日（.meta）を非表示 */
.page p.meta {
  display: none;
}

/* === パンくずリストの非表示（トップページのみ） === */
.home #breadcrumb {
  display: none !important;
}

/* === ロゴ直下のキャッチコピーの非表示（トップページのみ） === */
.home p.desc[itemprop="alternativeHeadline"] {
  display: none !important;
}

/* === グローバルナビ === */

/* ===== グローバルナビ 全体 ===== */
#gnavi {
  background-color: #F5F3FA;
}

/* ナビリンク共通 */
#gnavi li > a {
  position: relative;
  display: inline-block;
  padding: 0.75em 1em;
  color: #6B5F8A;              /* 通常時：やや薄い紫 */
  text-decoration: none;
  transition: color 0.2s ease;
}

/* ===== ホバー（非カレントのみ） ===== */
#gnavi li:not([class*="current"]) > a:hover {
  color: #4A3D66;              /* ブランド紫 */
  font-weight: 500;
}

/* 下線（ホバー用） */
#gnavi li > a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 1px;
  background-color: #4A3D66;
  opacity: 0;
  transition: opacity 0.2s ease;
}

/* ホバー時のみ下線を出す（非カレント） */
#gnavi li:not([class*="current"]) > a:hover::after {
  opacity: 0.5;
}

/* ===== カレント ===== */
#gnavi li[class*="current"] > a {
  background-color: #FFFFFF;
  color: #4A3D66;
  font-weight: 600;
}

/* ===== カレントのホバー ===== */
#gnavi li[class*="current"] > a,
#gnavi li[class*="current"] > a:hover {
  background-color: #FFFFFF;
}

/* カレント項目：span.gim.gnavi-item を常に白に固定 */
#gnavi li[class*="current"] > a > span.gim.gnavi-item,
#gnavi li[class*="current"] > a:hover > span.gim.gnavi-item {
  background-color: #fff;
}

/* カレントの下線（常時表示） */
#gnavi li[class*="current"] > a::after {
  opacity: 1;
}

#gnavi li > a {
  transition:
    color 0.2s ease,
    background-color 0.2s ease;
}

/* === グローバルナビ：お問い合わせ・ご相談だけ控えめにボタン風 === */

/* お問い合わせボタン */
#gnavi li.nav-contact > a,
#gnavi li.nav-contact > a > span.gim.gnavi-item {
  background-color: #FBF4E6;
  color: #4A3D66;
  font-weight: 600;
  border-radius: 4px;
}

/* ホバー */
#gnavi li.nav-contact > a:hover,
#gnavi li.nav-contact > a:hover > span.gim.gnavi-item {
  background-color: #F4EAD5;
}

/* フォーカス（キーボード操作） */
#gnavi li.nav-contact > a:focus-visible > span.gim.gnavi-item {
  outline: 2px solid rgba(74, 61, 102, 0.4);
  outline-offset: 2px;
}

/* グローバルナビが1行におさまるように調整 */
#gnavi .gc>ul>li>a>.gim {
  padding: 16px 14px;  /* 16px 18px */
}

/* ===========================================
 * グローバルナビ：日本語＋英語 併記（追記用）
 *  - PC：2段（日本語→英語）
 *  - SP：1行（日本語の右に英語） ※ハンバーガーも #gnavi の想定
 * =========================================== */

/* 1) 追加した英語用spanの基本 */
#gnavi .gnavi-ja,
#gnavi .gnavi-en {
  display: block;
  line-height: 1.2;
}

/* 英語の見た目（まずは“他と同等”寄り。後で弱め調整しやすい） */
/* 英語を一段弱める（PC/SP共通） */
#gnavi .gnavi-en {
  font-size: 0.72em;          /* 日本語の約70% */
  letter-spacing: 0.04em;     /* 英語を整える */
  opacity: 0.75;          /* 0.7〜0.8で微調整 */
}

/* 2) PC（デフォルト）：2段表示にする
   Luxeritasの span.gim.gnavi-item 内で縦積みに */
#gnavi li > a > span.gim.gnavi-item {
  display: inline-flex;
  flex-direction: column;
  align-items: center;         /* 現状の中央寄せナビに合わせる */
  gap: 0.2em;                  /* 日本語と英語の間隔（窮屈さを軽減） */
}

/* 3) SP（ハンバーガー内想定）：日本語＋英語を1行にする
   - ここは「ハンバーガーが開いた状態のナビ」でも #gnavi の同一DOMという前提
   - ブレークポイントはサイトに合わせて調整可（まずは 599px / 767px どちらか）
*/
@media (max-width: 991px) {  /* ハンバーガーメニューに合わせて、767px -> 991px */
  #gnavi li > a > span.gim.gnavi-item {
    flex-direction: row;
    align-items: baseline;
    gap: 0.5em;               /* 日本語と英語の横の間隔 */
  }

  #gnavi .gnavi-ja,
  #gnavi .gnavi-en {
    display: inline;
  }

  /* SPでは英語を少し読みやすく（メニュー内の視認性UP） */
  #gnavi .gnavi-en {
    font-size: 0.82em;
    letter-spacing: 0.03em;
    white-space: nowrap;      /* 英語だけ改行されにくくする */
  }
}

/*===========================================
 * プロフィールページ
 *==========================================*/

/* ===========================================
 * Profile hero image (picture version)
 * =========================================== */

/* フルブリード化 */
.profile-hero {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-bottom: 2.2rem;
  aspect-ratio: 1600 / 560;
  overflow: hidden;
}

.profile-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* SP */
@media (max-width: 599px) {
  .profile-hero {
    margin-bottom: 1.8rem;
  }
}

/* ===========================================
 * Profile page heading design
 * =========================================== */

/* ==========================
 * h1 : ページタイトル
 * ========================== */
.profile-heading h1 {
  text-align: left;
  margin: 0 0 3rem;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: 0.02em;
  font-size: 2.6rem;
  color: rgb(51, 51, 51, 0.88);
}

/* h1 下の控えめな区切り */
.profile-heading h1::after {
  content: "";
  display: block;
  margin-top: 0.6rem;
  width: 2.4rem;
  height: 2px;  /* 1px */

  /* ベース色を薄く（ブランド感は出さない） */
  background: rgb(51, 51, 51, 0.22);
}

/* ==========================
 * h2 : セクション見出し（左ライン）
 * ========================== */
.profile-section h2 {
  margin: 2.4rem 0 2rem;
  padding-left: 0.9rem;

  font-size: 2.1rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.01em;

  color: rgb(51, 51, 51, 0.9);

  /* ブランドカラー寄りの左ライン */
  border-left: 4px solid rgb(var(--rgb-base) / 0.40); /* 3px */
}

/* h2直後の文章を少し読みやすく */
.profile-section h2 + p,
.story-text > p {
  margin-top: 0.6rem;
}

/* ==========================
 * h3 : h2より一段控えめ
 * ========================== */
.profile-section h3 {
  margin: 1.6rem 0 0.6rem;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.01em;
  color: rgb(51, 51, 51, 0.85);
}

/* ==========================
 * p : サービスページより控えめ
 * ========================== */
.page-profile p {
  font-size: 1.6rem;
}

/* ==========================
 * SP調整
 * ========================== */
@media (max-width: 599px) {
  .profile-section h2 {
    /* border-left-width: 2px; */
    padding-left: 0.8rem;
  }
}

/* -------------------------------------------
 * これまでの歩み：テキスト＋写真
 * ------------------------------------------- */
.story-layout {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr; /* 文章主役 */
  gap: 2rem;
  align-items: start;
}

/* テキスト */
.story-text p {
  margin-bottom: 1.1rem;
}

/* 写真（控えめ） */
.story-photo {
  max-width: 280px;
  /* margin-left: auto; */
  margin: 0.6rem 0 0.6rem auto;  /* 上：p位置と揃える、下：線とくっつかないように */
}

.story-photo img {
  width: 100%;
  height: auto;
  display: block;

  border-radius: 12px;
  border: 1px solid rgba(51, 51, 51, 0.10);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
}

/* SP：縦並び */
@media (max-width: 799px) {
  .story-layout {
    grid-template-columns: 1fr;
    gap: 1.4rem;
  }

  .story-photo {
    max-width: 200px;      /* ← 小さめ */
    margin: 0 auto 0.6rem;  /* 下：線とくっつかないように */
  }
}

/* -------------------------------------------
 * 専門領域と資格：カード（常に縦並び）
 * ------------------------------------------- */
.profile-meta-card {
  margin-top: 0.4rem;
  margin-bottom: 0.6rem;  /* add */
  padding: 1.6rem;
  border-radius: 16px;
  border: 1px solid rgba(51, 51, 51, 0.12);
  background: rgba(255, 255, 255, 0.65);
}

/* 縦並び固定 */
.profile-meta-col + .profile-meta-col {
  margin-top: 2.4rem; /* 1.6rem */
}

/* h3：小見出し（線なし） */
.profile-meta-col > h3:first-child {    /* デフォルトの「h3:first-child」より、margin-topを優先させるため */
  margin: 0.8rem 0;  /* 0 0 0.8rem */
  font-size: 1.8rem;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: rgba(51, 51, 51, 0.92);
  padding-left: 0;  /* add */
  border: none;  /* add */
}

/* h3直下の本文 */
.profile-meta-col > p {
  margin-top: 0.2rem;  /* add */
  margin-bottom: 0.2rem;  /* 0 */
}

/* 資格リスト */
.profile-meta-col ul {
  margin: 0.2rem 0 0 0.2rem; /* 0.2rem 0 0 */
  padding-left: 1.6rem;  /* 1.2rem */
}

.profile-meta-col li {
  margin: 0.35rem 0;
  padding-left: 0.4rem;  /* add */
  line-height: 1.7;
  color: rgba(51, 51, 51, 0.92);
  font-size: 1.5rem;  /* add */
}

/* マーカーをブランドカラー寄りに */
.profile-meta-col li::marker {
  color: rgba(74, 61, 102, 0.45);
}

/* セクション間の視覚的な区切り（控えめ） */
.profile-section {
  padding-top: 2.0rem;
  border-top: 1px solid rgba(51, 51, 51, 0.06);
}

/********************************************************************/
/*===========================================
 * プライバシーポリシーページ
 *==========================================*/

/* ===========================================
 * Privacy Policy page heading design
 * =========================================== */

/* ==========================
 * h1 : ページタイトル
 * ========================== */
.page-privacy h1 {
  text-align: left;
  margin: 0 0 1.3rem;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: 0.02em;
  font-size: 2.6rem;
  color: rgb(51, 51, 51, 0.88);
}

/* ==========================
 * h2 : セクション見出し（左ライン）
 * ========================== */
.page-privacy h2 {
  margin: 5rem 0 1.8rem;  /* 2.4rem 0 1rem */
  padding-left: 0;
  border: none;  /* add */

  font-size: 2.1rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.01em;

  color: rgb(51, 51, 51, 0.9);
}

/* h2直後の文章を少し読みやすく */
.page-privacy h2 + p {
  margin-top: 0.6rem;
}

/* ==========================
 * p : サービスページより控えめ
 * ========================== */
.page-privacy p {
  font-size: 1.6rem;
}

/********************************************************************/

/********************************************************************/
/*===========================================
 * 特定商取引法表記ページ
 *==========================================*/

/* ===========================================
 * Legal page heading design
 * =========================================== */

/* ==========================
 * h1 : ページタイトル
 * ========================== */
.page-legal h1 {
  text-align: left;
  margin: 0 0 1.3rem;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: 0.02em;
  font-size: 2.6rem;
  color: rgb(51, 51, 51, 0.88);
}

/* ==========================
 * p : サービスページより控えめ
 * ========================== */
.page-legal p {
  font-size: 1.6rem;
}

/* =========================
    Legal page：スペック表
   ========================= */
.legal-table {
  /* 周囲がグレー(#F4F5F3)でも“カード”として浮かせる */
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .08);
}

/* セル共通 */
.legal-table th,
.legal-table td {
  padding: 0.95rem 1.05rem;
  font-size: 1.4rem;
  line-height: 1.7;
  vertical-align: center;
  border: 0;
}

.legal-table td p {
  font-size: 1.4rem;
  line-height: 1.7;
  margin-bottom: 0;
}

/* 罫線（行区切り） */
.legal-table tr + tr th,
.legal-table tr + tr td {
  border-top: 1px solid rgba(0, 0, 0, .06);
}

/* 左列（見出し） */
.legal-table th {
  width: 20%;
  min-width: 9.5em;               /* 見出しが詰まりすぎない */
  font-weight: 700;
  letter-spacing: .02em;
  text-align: left;
}

/* =========================
   スマホ：縦積み（読みやすさ最優先）
   ========================= */
@media (max-width: 640px) {
  .legal-table th,
  .legal-table td {
    display: block;
    width: 100%;
    padding: 0.8rem 0.95rem;
    border: 0;
  }

  .legal-table th {
    border-right: 0;
    border-top: 0;
    padding-bottom: 0.55rem;
    text-align: center;
  }

  .legal-table td {
    padding-top: 0.55rem;
  }

  .legal-table tr + tr th,
  .legal-table tr + tr td {
    border-top: 0;
  }

  .legal-table tr + tr th {
    border-top: 1px solid rgba(0, 0, 0, .08);
  }

  .legal-table tr:first-child {
    border-top: 0;
  }
}

/*===========================================
 * ボタン（お問い合わせ・ご相談はこちら）
 *==========================================*/

/* サイト共通のベース：メインカラー塗りつぶし */
a.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 2.25rem;
  padding: 1.2rem 3.0rem;
  border-radius: 999px;
  background: var(--color-brand-main); /* メインカラー */
  color: #fff;
  font-size: 1.6rem;
  font-weight: 600;
  text-decoration: none;
  border: none;
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transition:
    transform .15s ease-out,
    box-shadow .15s ease-out,
    background .15s ease-out,
    border-color .15s ease-out,
    color .15s ease-out;
}

/* ホバー（塗りつぶし時） */
.btn-primary:hover {
  background: #3d3256;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0,0,0,.16);
}

/* アイコンだけアクセントカラー */
.btn-primary .btn-icon {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  display: inline-block;          /* inline-flex不要ならこれでOK */
  vertical-align: -0.15em;        /* テキストとの上下位置を微調整 */
  margin-right: 0.45em;
  position: relative;
  top: 0.05em;   /* 0.04〜0.08emで微調整 */
  color: var(--color-brand-accent); /* アイコンだけアクセント */
}

/* プロフィールページ専用：縁取りボタン */
.btn-outline {
  background: #fff !important;
  color: var(--color-brand-main) !important;
  border: 2px solid var(--color-brand-main) !important;
  box-shadow: none !important;
}

.btn-outline:hover {
  background: rgba(74,61,102,.06) !important;
  transform: translateY(-1px);
}

@media (max-width:560px) { .btn-primary { width: 100%; justify-content: center; } }

/*===========================================
 * ロゴ・ロゴ直下コピーのサイズ調整
 *==========================================*/

/* ロゴ（マーク＋屋号） */
#sitename img {
  height: 4rem;      /* ← ここが基準値（おすすめ） */
  width: auto;       /* 比率保持 */
  max-width: 100%;
}

/* ロゴ直下コピー */
p.desc {
  font-size: 1.45rem;   /* 本文（1.7rem）基準で約1.45rem */
  line-height: 1.5;
}

@media (max-width: 768px) {
  #sitename img {
    height: 3.5rem;
  }

  p.desc {
    font-size: 1.35rem;
  }
}

/*===========================================
 * 背景
 *==========================================*/

/* フルブリード指定 */
.section {
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
}

div#core.grid {
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 0;  /* add */
  border-bottom: 0;  /* add */
  background-color: transparent !important;
}

/* copyrightチラつき対策 */
#thk { display: none !important; }

/* =========================================================
   Footer (Luxeritas) : left aligned / minimal footer
   - for custom HTML widget: .site-footer-mini
   ========================================================= */

/* フッター全体：左寄せを徹底 */
#footer,
#footer footer,
#footer #foot-in,
#footer #copyright {
  text-align: left;
}

/* 余白（薄グレー背景なので線は入れず、余白で区切る） */
#footer #foot-in {
  padding: 2.2rem 0 1.2rem;
}

/* カスタムフッター本体 */
.site-footer-mini {
  max-width: var(--container);  /* 既にテーマで制御されているなら効かなくてもOK */
  margin: 0 auto;
  padding-left: 0;
  padding-right: 1.5rem; /* 右だけは安全余白として残す */
}

/* ロゴ：フッターは主張しすぎない（高さ26px基準） */
.site-footer-mini .sf-logo {
  margin: 0 0 .55rem;
}
.site-footer-mini .sf-logo a {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
}
.site-footer-mini .sf-logo img {
  height: 26px;
  width: auto;
  display: block;
}

/* コピー（余韻）：少しだけ控えめ */
.site-footer-mini .sf-tagline {
  margin: 0 0 .95rem;
  line-height: 1.6;
  font-size: .95rem;
  opacity: .8;
}

/* ナビ：2行構成が崩れないように（SPは自然に折り返し） */
.site-footer-mini .sf-nav {
  margin: 0 0 1rem;
  font-size: 1rem;
  line-height: 1.8;
}
.site-footer-mini .sf-nav .sf-nav-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .35rem;          /* 区切りの詰まり防止 */
}
.site-footer-mini .sf-nav a {
  text-decoration: none;
}
.site-footer-mini .sf-nav a:hover,
.site-footer-mini .sf-nav a:focus-visible {
  text-decoration: underline;
  text-underline-offset: .15em;
}
.site-footer-mini .sf-sep {
  opacity: .45;
}

/* 法務リンク：一段弱く、目立たせすぎない */
.site-footer-mini .sf-legal {
  margin: 0;
  font-size: .92rem;
  line-height: 1.7;
  opacity: .8;
}
.site-footer-mini .sf-legal a {
  text-decoration: none;
}
.site-footer-mini .sf-legal a:hover,
.site-footer-mini .sf-legal a:focus-visible {
  text-decoration: underline;
  text-underline-offset: .15em;
}

/* 既存のコピーライト領域：左寄せ＋余白調整 */
#footer #copyright {
  max-width: var(--container);
  margin: 0 auto;
  padding: .9rem 1.5rem 1.6rem;
}

/* Luxeritasのコピーライト表示（p.copy）を整える */
#footer #copyright .copy {
  margin: 0;
  line-height: 1.6;
  font-size: .88rem;
  opacity: .75;
}

/* （任意）コピーライトが複数行になった時の段落間 */
#footer #copyright .copy + .copy {
  margin-top: .4rem;
}

/* SP時：ロゴをほんの少しだけ大きくして視認性を確保（任意） */
@media (max-width: 599px) {
  .site-footer-mini {
    padding: 0 1.25rem;
  }
  .site-footer-mini .sf-logo img {
    height: 28px;
  }
}

/*===========================================
 * 全体の余白設定
 *==========================================*/

/* テーマ側の「内側ラッパー」を同じルールへ寄せる */
#header .head-cover,
#header #gnavi,
#footer #foot-in {
  /* 本文の最大幅。ここを変えるとサイトの“読み幅”が変わる */
  max-width: var(--container);
  margin: auto;
  /* 中央寄せ */
  padding-inline: min(3vw, 24px);
}

.container {
  /* 本文の最大幅。ここを変えるとサイトの“読み幅”が変わる */
  max-width: var(--container);
  /* 中央寄せ */
  margin-inline: auto;
  /* 画面幅に応じて左右の余白を可変に。広い画面でも32pxで止める */
  padding-inline: min(3vw, 32px);
}

div.col-12 {
  padding-left: 0;
}

/* フッター前のデフォルトのラインを消去 */
.page .pbhr {
  display: none;
}

/* フッター前の余白削除 */
#primary.clearfix {
  border-bottom: 0;  
}

.meta-box {
  margin-top: 0;
  margin-bottom: 0;
}

main#main {
  margin-bottom: 0;
}

/*===========================================
 * リンク設定
 *==========================================*/

/* デザインしている感」を出さずに、読みやすさと信頼感だけを上げる */
a {
  text-decoration-thickness: 1.5px;
  text-underline-offset: 0.15em;
}

/*===========================================
 * 「お知らせ」を表示する（トップページのみ）
 *==========================================*/

/* =========================
   トップ：お知らせ（完成版）
   目的：フッター直前の“静かな情報帯”
   ========================= */

/* 帯：背景で場を作り、余白はコンパクトに */
.section.top-news-block {
  padding: 2.2rem 0 1.2rem;
  background: #EEEDE7;
}

/* 見出し：テーマの装飾が乗りやすいので徹底的に無効化 */
.top-news-title {
  margin: 0 0 .55rem 0 !important;
  padding: 0 !important;
  font-size: .88em !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  color: rgba(0,0,0,.60) !important;
  background: none !important;
  border: 0 !important;
}
.top-news-title::before,
.top-news-title::after {
  content: none !important;      /* 太い棒・丸・ライン等を全部殺す */
}

/* 1行情報：左に日付＋タイトル、右に一覧 */
.top-news-list {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
}

.top-news-list li {
  display: flex;
  align-items: baseline;
  gap: .85rem;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* 日付 */
.top-news-list time {
  font-size: 1.2rem;  /* .86em */
  color: rgba(0,0,0,.52);
  white-space: nowrap;
}

/* タイトルリンク：本文リンク感を弱める */
.top-news-list a {
  text-decoration-color: rgba(0,0,0,.16);
  text-underline-offset: 0.3em;  /* add */
  padding-bottom: 1px;
  color: rgba(0,0,0,.78);
}
.top-news-list a:hover {
  text-decoration: underline;  /* add */
  text-decoration-color: rgba(0,0,0,.34);  /* add */
}

/* 一覧リンク：右寄せで補助に */
.top-news-more {
  display: block;
  margin-top: .25rem;
  text-align: right;
  font-size: .86em;
  color: rgba(0,0,0,.52);
  text-decoration: none;
}
.top-news-more:hover { text-decoration: underline; }

/* フッターと隙間を作らない */
#footer { margin-top: 0 !important; }

/*===========================================
 * お知らせページ（カード型からテキスト一覧へ）
 *==========================================*/

/* =================================================
   /news（お知らせ一覧）だけ：トップに近い掲示板型
   scope: body.post-type-archive-news
   ================================================= */

body.post-type-archive-news #list.tile-2 {
  display: block !important;
  column-count: 1 !important; /* 念のため */
}

body.post-type-archive-news #list.tile-2 > #tile-2 {
  display: block !important;
}

/* 1件（カード相当）を箱なし + 1カラム固定 */
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix {
  width: 100% !important;
  max-width: none !important;

  float: none !important;
  clear: both !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  padding: 0 !important;
  margin: 0 !important;
}

/* 行区切り（トップ寄せ：薄め＋詰め） */
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix + .toc.grid.clearfix {
  margin-top: .45rem !important;
  padding-top: .45rem !important;
}

/* 画像（No Image）・抜粋・続きを読むを消す（/newsだけ） */
body.post-type-archive-news #list.tile-2 figure.term,
body.post-type-archive-news #list.tile-2 img.thumbnail,
body.post-type-archive-news #list.tile-2 .excerpt,
body.post-type-archive-news #list.tile-2 .read-more {
  display: none !important;
}

/* 日付＋タイトルを1行テキスト風に */
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix > section {
  display: flex !important;
  align-items: baseline !important;
  gap: 1rem !important;  /* .8rem */
}

/* 日付 */
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix > section > p.meta {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  white-space: nowrap !important;
}
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix > section > p.meta i.material-icons {
  display: none !important;
}
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix .entry-date {
  color: rgba(0,0,0,.55) !important;
}

/* spanの右余白を削除*/
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix > section > p.meta > span.date {
  margin-right: 0;
}

/* タイトル */
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix > section > h2.entry-title > a {
  margin: 0 !important;
  font-size: 1.6rem !important;  /* 1rem */
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

/* リンク（控えめ・hoverで下線） */
body.post-type-archive-news #list.tile-2 .toc.grid.clearfix a.entry-link {
  color: inherit !important;
  text-decoration: underline;  /* add */
  text-decoration-color: rgba(0,0,0,.16);  /* add */
  text-underline-offset: 0.3em;  /* add */
}

body.post-type-archive-news #list.tile-2 .toc.grid.clearfix a.entry-link:hover {
  text-decoration: underline !important;
  text-decoration-color: rgba(0,0,0,.34);  /* add */
}

/* フッター前（div#section）の下余白を広げる */
body.post-type-archive-news div#section {
  margin-bottom: 5rem;
}