/* ===== Price section ===== */
.gpc-price .wrap-block {
  max-width: 1300px;
}

.gpc-price{padding:56px 0}
.gpc-price__title{font-size:clamp(24px,2.4vw,32px);font-weight:700;text-align:center;margin:0 0 24px}
.gpc-price__subtitle{text-align:center;margin:32px 0 16px;font-weight:700}

.gpc-price-grid{
  display:grid;gap:16px;
  grid-template-columns:repeat(1,1fr)
}
@media(min-width:768px){.gpc-price-grid{grid-template-columns:repeat(3,1fr)}}

.gpc-price-card{
  border:1px solid #eee;border-radius:16px;overflow:hidden;background:#fff;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease
}
.gpc-price-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.08);background:#fffef8}

.gpc-price-card--featured{display:grid;grid-template-columns:1fr;gap:0;margin-bottom:24px}
@media(min-width:960px){.gpc-price-card--featured{grid-template-columns:1.2fr 1fr}}

.gpc-price-card__media{position:relative;overflow:hidden;aspect-ratio:16/9}
.gpc-price-card__media img{width:100%;height:100%;object-fit:cover;transform:scale(1);transition:transform .35s ease}
.gpc-price-card:hover .gpc-price-card__media img{transform:scale(1.06)} /* 写真ズーム */

.gpc-badge{
  position:absolute;top:12px;left:12px;background:#ff7a00;color:#fff;font-weight:700;
  padding:6px 10px;border-radius:8px;font-size:12px
}

.gpc-price-card__body{padding:16px 16px 20px}
.gpc-price-card__name{margin:0 0 8px;font-size:clamp(18px,2vw,22px);font-weight:700}
.gpc-price-card__desc{margin:0 0 12px;line-height:1.7;color:#444}
.gpc-price-card__price{margin:0 0 16px}
.gpc-price-card__price span{font-size:clamp(20px,2.4vw,28px);font-weight:800;letter-spacing:.02em}
.gpc-price-card__price small{margin-left:6px;color:#666}

.gpc-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 16px;border-radius:999px;background:#111;color:#fff;font-weight:700;
  transition:background .25s ease, transform .2s ease;text-decoration:none
}
.gpc-btn:hover{transform:translateY(-1px)}

.gpc-btn--ghost{
  background:#fff;border:2px solid #111;color:#111
}
.gpc-price-card:hover .gpc-btn--ghost{background:#111;color:#fff} /* 反転 */
.gpc-price-grid{display:grid; gap:16px; grid-template-columns:1fr}
@media(min-width:640px){.gpc-price-grid{grid-template-columns:repeat(2,1fr); gap:20px}}
@media(min-width:1024px){.gpc-price-grid{grid-template-columns:repeat(3,1fr); gap:24px}}
.gpc-price-card{display:flex; flex-direction:column; height:100%}
.gpc-price-card__body{display:flex; flex-direction:column; gap:12px; flex:1}
.gpc-price-card__desc{flex:1}          /* 余白をここで吸収 */
.gpc-price-card .gpc-btn{align-self:flex-start}
.gpc-price-card{will-change:transform; transform:translateZ(0)}
.gpc-price-card__media img{backface-visibility:hidden}
.gpc-btn:focus-visible{
  outline:3px solid #4a8fff; outline-offset:2px; box-shadow:0 0 0 3px rgba(74,143,255,.15)
}

/* ===== Intro (title under) ===== */
.gpc-intro{max-width:960px;margin:8px auto 28px;text-align:center}

/* 黄色ピルのタグ */
.gpc-tags{display:flex;justify-content:center;gap:8px;list-style:none;margin:0 0 12px;padding:0}
.gpc-tags li{
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 18px;border-radius:6px;background:#ffe26a;font-weight:700;
  font-size:18px;line-height:1;color:#111;box-shadow:inset 0 -1px 0 rgba(0,0,0,.06)
}

/* リード文 */
.gpc-lead{margin:0;color:#333;line-height:1.9;font-size:clamp(16px,1.8vw,18px)}

/* 飾り線＋ドット */
.gpc-divider{position:relative;height:28px;margin:16px auto 0;max-width:960px}
.gpc-divider::before{
  content:"";position:absolute;left:0;right:0;top:50%;height:1px;
  background:linear-gradient(to right,transparent 0 8%,#f3b35e 8% 92%,transparent 92% 100%);
  transform:translateY(-50%);
}
.gpc-divider::after{
  content:"";position:absolute;right:3%;top:4px;bottom:4px;width:120px;
  background-image:radial-gradient(#e9e9e9 1.6px,transparent 1.6px);
  background-size:10px 10px;opacity:.8;pointer-events:none
}
/* ===== レイアウトの外側余白（横いっぱいを回避） ===== */
.wrap-block{
  margin: 0 auto;
  padding: 0 16px;         /* 両端の息継ぎ */
}
@media (min-width: 1024px){
  .wrap-block{ padding: 0 24px; }
}

/* ========== Featuredカード ========== */
.gpc-price-card--featured {
  display: grid;
  grid-template-columns: 58% 42%;
  gap: 13px;
  padding: 24px;
  border: 1px solid #eee5d6;
  background: #fffdf7;
  border-radius: 18px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}

.gpc-price-card--featured .gpc-price-card__media {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  aspect-ratio: 16 / 9;   /* 画像の高さを安定 */
}
.gpc-price-card--featured .gpc-price-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translateZ(0);
}

/* バッジ（左上・右上） */
.gpc-price-card__media .gpc-badge,
.gpc-price-card__media .gpc-badge--right {
  position: absolute;
  top: 12px;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  background: #ff8a00;
  color: #fff;
  box-shadow: 0 2px 6px rgba(255,138,0,.25);
}
.gpc-price-card__media .gpc-badge { left: 12px; }
.gpc-price-card__media .gpc-badge--right { right: 12px; }

/* タイトル・リード */
.gpc-price-card__body { padding: 4px 2px; }
.gpc-price-card__name {
  font-size: clamp(22px, 2vw + 8px, 32px);
  letter-spacing: .02em;
  margin: 0 0 8px;
}
.gpc-price-card__desc {
  font-size: 16px;
  line-height: 1.9;
  color: #333;
  margin: 0 0 14px;
}

/* 追加情報（内容説明＋学習時間の目安） */
.gpc-meta { margin-top: 6px; }
.gpc-meta__desc { margin: 2px 0 8px; line-height: 1.9; }
.gpc-meta__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 6px 16px;
}
.gpc-meta__grid dt {
  font-size: 12px; font-weight: 700; color: #7b6a54; opacity: .9; margin-bottom: 2px;
}
.gpc-meta__grid dd { margin: 0; }

/* 価格・ボタン */
.gpc-price-card__price {
  display: flex; align-items: baseline; gap: 10px;
  margin: 14px 0 16px;
}
.gpc-price-card__price span {
  font-size: clamp(26px, 3vw + 6px, 36px);
  font-weight: 800;
  color: #ff7a00; /* オレンジ強め */
  letter-spacing: .02em;
}
.gpc-price-card__price small { color: #666; }

.gpc-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 12px 22px; border-radius: 999px;
  background: #111; color: #fff; font-weight: 800; letter-spacing: .02em;
  transition: transform .15s ease, background .15s ease, color .15s ease;
}
.gpc-btn:hover { background: #fff; color: #111; outline: 2px solid #111; }

/* ========== 通常カード（グリッド） ========== */
.gpc-price-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 22px;
}
.gpc-price-card {
  border: 1px solid #eee;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}
.gpc-price-card:hover { transform: translateY(-2px); box-shadow: 0 10px 18px rgba(0,0,0,.06); }

.gpc-price-card .gpc-price-card__media { position: relative; aspect-ratio: 16/10; overflow: hidden; }
.gpc-price-card .gpc-price-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.gpc-price-card:hover .gpc-price-card__media img { transform: scale(1.04); }

.gpc-price-card .gpc-price-card__body { padding: 14px 16px 16px; }
.gpc-price-card .gpc-price-card__name { 
  font-size: 1.25rem; /* 20px相当 */
  margin: 0 0 0.4em;
}
.gpc-price-card .gpc-price-card__desc { 
  font-size: 0.875rem; /* 14px相当 */
  line-height: 1.8;
  margin-bottom: 0.5em;
}

.gpc-price-card .gpc-price-card__price { margin: 10px 0 12px; }
.gpc-price-card .gpc-btn { padding: 10px 18px; }

/* ========== レスポンシブ ========== */
@media (max-width: 1024px){
  .gpc-price-card--featured { grid-template-columns: 1fr; gap: 16px; }
}
@media (max-width: 768px){
  .gpc-price-grid { grid-template-columns: 1fr; gap: 16px; }
  .gpc-price-card--featured { padding: 16px; border-radius: 14px; }
  .gpc-price-card--featured .gpc-price-card__media { border-radius: 10px; }
}

/* 画像を少し小さく（58:42 → 52:48） */
.gpc-price-card--featured { grid-template-columns: 52% 48%; }

/* 見出しを大きく、リードは指定色に */
.gpc-price-card--featured .gpc-price-card__name { font-size: 2rem; }           /* 32px相当 */
.gpc-price-card--featured .gpc-price-card__lead { 
  font-size: 0.9375rem;  /* 15px相当：小さめ */
  color: #e0a446; 
  margin: 0 0 .6em;
}

/* 内容説明はさらに小さく */
.gpc-price-card--featured .gpc-meta__desc { font-size: 0.875rem; }             /* 14px */

/* 学習時間の目安の下のリストを横並び（・区切り） */
.gpc-meta__list { 
  display: flex; flex-wrap: wrap; gap: 6px 12px;
  list-style: none; padding: 0; margin: 8px 0 0;
}
.gpc-meta__list li { position: relative; padding-left: 0; }
.gpc-meta__list li + li::before {
  content: "・"; margin-right: 8px; color: #333; opacity: .7;
}

/* 価格の横に付ける特典ラベル（プランナー専用） */
.gpc-price-label {
  display: inline-block;
  margin-left: 10px;
  padding: .35em .6em;
  border: 2px solid #ff7a00;     /* 価格と同色 */
  color: #ff7a00;
  border-radius: .6em;
  font-size: 0.8125rem;          /* 13px相当 */
  font-weight: 700;
  white-space: nowrap;
}
/* Featured カードのレイアウト調整 */
.gpc-price-card--featured {
  grid-template-columns: 35% 65%; /* 画像:本文 を縮小→本文広め */
  padding: 5px; /* 上と左の余白を詰める */
}

/* メディア部分の調整 */
.gpc-price-card--featured .gpc-price-card__media {
  margin-top: 0;
  margin-left: 0;
  border-radius: 10px;
}

/* コース名とサブ説明の間隔を詰める */
.gpc-price-card--featured .gpc-price-card__name {
  margin-bottom: 0.2em;
}
.gpc-price-card--featured .gpc-price-card__lead {
  margin-top: 0; 
  margin-bottom: 0.8em;
}

/* 「学習時間の目安」見出しを少し大きく */
.gpc-meta__grid dt,.gpc-meta__grid dd{
  font-size: 1.2rem; 
  font-weight: 700;
  color: #7b6a54;
}

/* リスト（動画本数〜）を小さめに */
.gpc-meta__list li {
  font-size: 1rem; 
  line-height: 1.6;
}

/* バッジ（演習サポート付き）を小さく */
.gpc-price-card__media .gpc-badge,
.gpc-price-card__media .gpc-badge--right {
  font-size: 0.8rem;   /* 12px相当 */
  padding: 4px 8px;
  border-radius: 3px;
}
/* 価格の最初のspan（=数字）だけ大きく */
.gpc-price-card__price > span:first-child {
  font-size: 1.8rem;
  font-weight: 800;
  color: #ff7a00;
  letter-spacing: .02em;
}
/* ラベルはサイズ固定 */
.gpc-price-card__price .gpc-price-label {
  font-size: 0.8125rem;
  padding: .35em .6em;
  border: 2px solid #ff7a00;
  color: #ff7a00;
  border-radius: .6em;
  margin-left: 10px;
  display: inline-flex;
  align-items: center;
}
/* ===== Featured（プランナー）内の縦余白を詰める ===== */
.gpc-price-card--featured .gpc-price-card__name{
  margin: 0;           /* タイトルと次の行の距離をさらに短く */
  line-height: 1;           /* 行高も少し詰める */
}
.gpc-price-card--featured .gpc-price-card__lead{
  margin: 0;        /* サブ説明（オレンジ）と本文の距離を短く */
}

.gpc-price-card--featured .gpc-meta{ 
  margin-top: 0;           /* 本文（description_ja）ブロックの頭を詰める */
}
.gpc-price-card--featured .gpc-meta__desc{
  margin: .2em 0 .5em;         /* 説明文と「学習時間の目安」の距離を詰める */
}
.gpc-price-card--featured .gpc-meta__grid{
  row-gap: 4px;                /* 見出し/値の縦ギャップをさらに縮小 */
}
.gpc-price-card--featured .gpc-meta__list{
  margin-top: 6px;             /* 箇条書きがある場合の上マージンを控えめに */
}

.gpc-price-card--featured .gpc-price-card__price{
  margin: .7em 0 0;            /* 価格までの余白を短く（下はそのまま） */
}

/* もし段落のデフォルト余白が残っていたら最小化（Featured内のみ） */
.gpc-price-card--featured .gpc-price-card__body p{
  margin-top: 0;
}
/* 学習時間の目安の見出しと内容を横並び */
.gpc-price-card--featured .gpc-meta__grid div {
  display: flex;
  align-items: baseline;   /* 文字のベースラインを揃える */
  gap: .4em;               /* 見出しと内容の間隔 */
}

.gpc-price-card--featured .gpc-meta__grid dt {
  font-weight: 600;
  margin: 10px 8px 10px 0;;
}

.gpc-price-card--featured .gpc-meta__grid dd {
  margin: 0;
}

@media (max-width: 600px) {

  /* 1) 「学習時間の目安」と「約100時間」を横並び＆改行禁止 */
  /* A: dl構造の場合 */
  .gpc-price-card--featured .gpc-meta__grid dt,
  .gpc-price-card--featured .gpc-meta__grid dd {
    display: inline;       /* 横並びに */
    white-space: nowrap;   /* 改行させない */
    margin: 0;
  }
  .gpc-price-card--featured .gpc-meta__grid dt::after {
    content: "　";         /* 間のスペース（全角/半角は好みで）*/
  }
  .gpc-price-card--featured .gpc-price-card__body {
    padding-left: 17px !important; /* 数値は好みで調整 */
    padding-right: 16px; /* 右側も揃えるなら */
  }
	 /* 3) 価格行のレイアウト：金額の横の「税込」を1行に、バッジは下段へ */
  .gpc-price-card--featured .gpc-price-card__price {              /* 金額行のラッパー */
    display: flex;
    align-items: baseline;
    gap: .75rem;
    flex-wrap: wrap;                       /* 折り返し許可 */
  }
  .gpc-price-card--featured .gpc-price-card__price .amount {      /* 295,700円 など */
    white-space: nowrap;                   /* 改行させない */
  }
  .gpc-price-card--featured .gpc-price-card__price .tax {         /* （税込） を span.tax で囲む */
    white-space: nowrap;                   /* 金額と同じ行で維持 */
  }
  .gpc-price-card--featured .gpc-price-card__price .badge {       /* 「モニタープランあり【最大34%OFF】」 */
    flex-basis: 100%;                      /* 強制的に次の行へ */
    margin-top: .5rem;                     /* 上に余白 */
    order: 2;                              /* 金額の後ろに表示 */
  }
  }

/* PCデフォルト用: 画像と本文を横並び */
.gpc-price-card--featured {
  display: flex;
  flex-direction: row;
}

.gpc-price-card--featured .gpc-price-card__media {
  flex: 0 0 40%;   /* 画像の幅（調整可: 30〜45%くらい） */
  max-width: 40%;
}

.gpc-price-card--featured .gpc-price-card__body {
  flex: 1;
  padding-left: 24px;
}

/* スマホで縦並び */
@media (max-width: 768px) {
  .gpc-price-card--featured {
    flex-direction: column;
  }
  .gpc-price-card--featured .gpc-price-card__media,
  .gpc-price-card--featured .gpc-price-card__body {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
  }
  .gpc-price-card--featured .gpc-price-card__media {
    margin-bottom: 12px;
  }
}
/* ====== 通常カードを Featured 風に統一 ====== */
/* リード（オレンジの小見出し） */
.gpc-price-card__lead{
  font-size: 0.9375rem;      /* 15px相当 */
  color: #e0a446;
  margin: 0 0 .6em;
}

/* 説明文と「目安」行 */
.gpc-price-card__desc{
  font-size: 0.9375rem;      /* 15px寄せ */
  line-height: 1.9;
  color: #333;
  margin-bottom: .6em;
}
.gpc-price-card__meta{
  margin: .2em 0 .6em;
  color: #666;
  font-size: .8125rem;       /* 13px相当 */
}


/* 主なカリキュラム（・区切りで横並び） */
.gpc-price-card__list{
  list-style: none;
  padding: 0;
  margin: 6px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
}
.gpc-price-card__list li{
  font-size: 0.875rem;       /* 14px相当 */
  line-height: 1.6;
  position: relative;
  padding-left: 0;
}
.gpc-price-card__list li + li::before{
  content: "・";
  margin-right: 8px;
  color: #333;
  opacity: .7;
}

/* 価格の見た目を Featured に寄せる（数字を強調） */
.gpc-price-card__price{
  display: flex; align-items: baseline; gap: 10px;
  margin: 12px 0 14px;
}
.gpc-price-card__price span{
  font-size: clamp(22px, 2.6vw, 30px);
  font-weight: 800;
  color: #ff7a00;
  letter-spacing: .02em;
}
.gpc-price-card__price small{ color:#666 }

/* スマホはリストを縦の箇条書きに戻す（読みやすさ優先） */
@media (max-width: 480px){
  .gpc-price-card__list{ display:block; }
  .gpc-price-card__list li{ padding-left: 1em; }
  .gpc-price-card__list li + li::before{ content:""; margin:0; }
  .gpc-price-card__list li::before{
    content:"•"; position:absolute; left:0; top:0; color:#333; opacity:.7;
  }
}
/* === 詳細ボタン：横幅いっぱい＆hoverで黒 === */

/* 既存の align-self を上書きして横幅100%に */
.gpc-price-card .gpc-btn{
  align-self: stretch !important;  /* flex-start → stretch */
  width: 100%;
  padding: 12px 20px;              /* ほんのり大きめ */
  border-radius: 999px;
}

/* デフォルトは白（ゴースト） */
.gpc-btn--ghost{
  background: #fff;
  border: 2px solid #111;
  color: #111;
}

/* カードにホバーしただけでは色を変えない（既存ルールを打ち消す） */
.gpc-price-card:hover .gpc-btn--ghost:not(:hover){
  background: #fff;
  color: #111;
}

/* ボタンにカーソルを置いた時だけ黒反転 */
.gpc-btn--ghost:hover{
  background: #111;
  color: #fff;
}

/* ===============================
   A) プランナー以外（通常カード）
   - タイトル大きく
   - 各要素の上下余白を詰める
   - 学習時間の行を小さく＆1行に
=================================*/
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__name{
  font-size: clamp(20px, 2.2vw, 24px);
  margin-bottom: .3em;
}
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__lead{ margin: 0 0 .5em; }
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__desc{ margin: 0 0 .6em; }
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__meta{
  margin: .2em 0 .5em;
}
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__meta small{
  font-size: 1.1rem;         /* 13px相当 */
  color: #666;
  white-space: nowrap;          /* 「目安：約xx時間」を1行で */
}

/* ===============================
   B) 全カード共通（価格の間隔を詰める）
   - 数字と「円（税込）」の距離を縮める
=================================*/
.gpc-price-card__price{
  display: flex;                 /* 通常カードにも適用して横並び化 */
  align-items: baseline;
  gap: 6px;                      /* 以前の10pxを短縮 */
  margin: .6em 0 .8em;
}
.gpc-price-card__price small{ margin-left: 0 !important; } /* 既存の left マージンを打消し */

/* ===============================
   C) プランナーを含む全カード（ボタン挙動を統一）
   - 通常＝白、hover＝黒（他カードと同じに）
=================================*/
/* 横幅いっぱいは既に適用済みだが、念のため */
.gpc-price-card .gpc-btn{ align-self: stretch !important; width:100%; }

/* デフォルトは白いゴーストボタン */
.gpc-btn--ghost{
  background:#fff;
  border:2px solid #111;
  color:#111;
}
/* hover時だけ黒反転 */
.gpc-btn--ghost:hover{
  background:#111; color:#fff; outline:0;
}
/* プランナー（featured）のボタンも同じ見た目に強制 */
.gpc-price-card--featured .gpc-btn{
  background:#fff; color:#111; border:2px solid #111;
}
.gpc-price-card--featured .gpc-btn:hover{
  background:#111; color:#fff;
}
/* ===== 余白をさらに詰める（非Featured） ===== */
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__body{
  gap: 8px !important; /* 既存 gap:12px を上書き */
}
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__name{
  font-size: clamp(21px, 2.25vw, 25px);
  margin: 0 0 .3em !important;
}
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__lead{
  margin: 0 0 .45em !important;
}
.gpc-price-card:not(.gpc-price-card--featured) .gpc-price-card__desc{
  margin: 0 0 .5em !important;
  line-height: 1.75;
}

/* ===== 学習時間の目安：横並び＆小さめ ===== */
.gpc-price-card__meta{
  margin: .2em 0 .5em !important;
  display: flex; align-items: baseline; gap: .5em;
  flex-wrap: wrap;
}
.gpc-meta__label{
  font-size: .8125rem;   /* 13px */
  color: #7b6a54;
  font-weight: 700;
  white-space: nowrap;
}
.gpc-meta__value{
  font-size: .8125rem;   /* 13px */
  color: #555;
  white-space: nowrap;   /* 折返し防止（スマホで狭い時は外してOK） */
}

/* ===== 価格の間隔をさらに短縮（全カード） ===== */
.gpc-price-card__price{
  display:flex; align-items:baseline; gap: 4px !important;
  margin: .5em 0 .75em !important;
}
.gpc-price-card__price small{ margin-left: 0 !important; }

/* ===== Featured（プランナー）側も余白を微調整（任意） ===== */
.gpc-price-card--featured .gpc-price-card__body{ gap: 8px !important; }
.gpc-price-card--featured .gpc-price-card__name{ margin-bottom: .2em !important; }
.gpc-price-card--featured .gpc-price-card__lead{ margin-bottom: .6em !important; }

/* ボタンの統一（通常=白／hover=黒）— 前回の指定を維持するための保険 */
.gpc-price-card .gpc-btn{ align-self: stretch !important; width:100% }
.gpc-btn--ghost{ background:#fff; border:2px solid #111; color:#111 }
.gpc-btn--ghost:hover{ background:#111; color:#fff }
.gpc-price-card--featured .gpc-btn{ background:#fff; color:#111; border:2px solid #111 }
.gpc-price-card--featured .gpc-btn:hover{ background:#111; color:#fff }
/* 見出しのサイズ統一（他セクションと同等） */
.gpc-price__title {
  font-size: clamp(24px, 2.4vw, 32px);
  font-weight: 800;
  text-align: center;
  margin: 0 0 18px;
}

/* 下の説明テキスト（2行）の後ろに余白を追加して飾り線が映えるように */
.gpc-intro { max-width: 960px; margin: 8px auto 24px; text-align: center; }

/* ==== H3 サブタイトル ==== */
h3.gpc-price__subtitle {
  margin: 66px 0 18px !important;
  font-size: 1.75rem;
  font-weight: 800;
  color: #111;
  text-align: center;
}
@media (max-width: 480px){
	h3.gpc-price__subtitle {
  font-size: 1.25rem;}
}

.gpc-price__subtitle + .gpc-divider {
  margin: 20px auto 38px !important;
}
/* ==== H2「コースを探す」：比較表と同じ見た目に ==== */
.gpc-price__title span {
  position: relative;
  display: inline-flex;
  padding-bottom: 10px;
  border-bottom: 3px solid #111;  /* 線色を比較表と同じに */
  font-size: clamp(29px, 4vw, 50px);
  font-weight: 800;
	margin-bottom: 34px;
}


/* ===== Course Detail ===== */
.gpc-course .wrap-block { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 1024px){ .gpc-course .wrap-block{ padding: 0 24px; } }

.gpc-breadcrumb{ font-size: 13px; color:#666; margin: 8px auto 18px; }
.gpc-breadcrumb a{ color:#666; text-decoration: none; }
.gpc-breadcrumb span{ margin: 0 6px; }

.gpc-course-hero{ display: grid; grid-template-columns: 1fr; gap: 22px; align-items: start; margin-bottom: 18px; }
@media (min-width: 960px){ .gpc-course-hero{ grid-template-columns: 48% 52%; gap: 28px; } }

.gpc-course-hero__media{ position: relative; overflow: hidden; border-radius: 14px; aspect-ratio: 16/10; }
.gpc-course-hero__media img{ width: 100%; height: 100%; object-fit: cover; }

.gpc-course__title{
  font-size: clamp(29px, 4vw, 50px);  /* 一覧で話した .title と同尺 */
  font-weight: 800;
  margin: 0 0 4px;
}
.gpc-course__lead{ color:#e0a446; font-weight:700; margin: 0 0 10px; }
.gpc-course__desc{ color:#333; line-height:1.9; margin: 0 0 12px; }

.gpc-course-meta{ margin: 8px 0 16px; }
.gpc-course-meta__row{ display:flex; gap:10px; align-items: baseline; margin: 4px 0; flex-wrap: wrap; }
.gpc-course-meta dt{ font-size: 13px; color:#7b6a54; font-weight: 800; white-space: nowrap; }
.gpc-course-meta dd{ margin:0; font-size: 13px; color:#555; }

.gpc-pills{ list-style:none; padding:0; margin: 6px 0 0; display:flex; flex-wrap:wrap; gap:8px; }
.gpc-pills li{ background:#ffe26a; color:#111; font-weight:700; font-size:12px; border-radius:6px; padding:4px 8px; }

.gpc-course-price{ display:flex; align-items:baseline; gap:6px; margin: 10px 0 14px; }
.gpc-course-price__num{ font-size: clamp(26px, 3vw + 6px, 36px); font-weight: 800; color:#ff7a00; letter-spacing:.02em; }
.gpc-course-price__note{ color:#666; }
.gpc-price-label{ display:inline-block; margin-left:10px; padding:.35em .6em; border:2px solid #ff7a00; color:#ff7a00; border-radius:.6em; font-size:13px; font-weight:700; white-space:nowrap; }

.gpc-btn.gpc-btn--ghost{
  align-self: stretch; width:100%;
  background:#fff; color:#111; border:2px solid #111; border-radius:999px; padding:12px 20px; font-weight:800;
}
.gpc-btn.gpc-btn--ghost:hover{ background:#111; color:#fff; }

.gpc-course-section{ margin: 28px 0 36px; }
.gpc-course-sec__title span{
  display:inline-flex; padding-bottom:10px; border-bottom:3px solid #111; font-size: clamp(22px, 2.2vw, 28px); font-weight:800;
}
.gpc-list{ margin: 12px 0 0; padding-left: 1.2em; }
.gpc-list li{ margin: .3em 0; line-height: 1.8; }



/* すでにサイト共通の飾り線 .gpc-divider がある前提で流用 停止中の作業のCSSここから */
/* ---- アンカー群 ---- */
.gpc-anchors { margin: 24px 0 40px; }
.gpc-anchors__group + .gpc-anchors__group { margin-top: 24px; }
.gpc-anchors__label {
  font-weight: 700; color:#c7a85f; display:flex; align-items:center; gap:12px; margin-bottom:12px;
}
.gpc-anchors__label::after {
  content:""; flex:1; height:2px; background:#e8d9a5;
}
.gpc-anchors__chips { display:flex; flex-wrap:wrap; gap:12px; }
.chip{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:6px 16px; border:1.5px solid #e8e4d6; border-radius:12px;
  background:#fff; color:#111; font-weight:700; text-decoration:none;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .06s ease;
}
.chip:hover, .chip:focus-visible, .chip[aria-current="true"]{
  background:#f9db4a; border-color:#f9db4a; outline:none;
  box-shadow:0 6px 14px rgba(0,0,0,.06);
}
.chip:active{ transform:translateY(1px); }

/* ---- セクション余白 & アンカーずれ対策 ---- */
.course-block{ scroll-margin-top: 96px; margin-bottom: clamp(56px, 8vw, 96px); }

/* ---- ヒーロー ---- */
.course-hero{
  display:grid; grid-template-columns: 1.2fr 1fr; gap: clamp(20px, 3vw, 40px); align-items:center;
}
@media (max-width: 960px){ .course-hero{ grid-template-columns:1fr; } }
.course-hero__media{ aspect-ratio: 16/9; overflow:hidden; border-radius:14px; box-shadow:0 6px 22px rgba(0,0,0,.08); }
.course-hero__img{ width:100%; height:100%; object-fit:cover; display:block; }
.course-hero__eyebrow{ color:#777; font-weight:700; letter-spacing:.02em; }
.course-hero__title{ font-size: clamp(28px, 4vw, 44px); color:#f0b74a; font-weight:800; margin:.2em 0; }
.course-hero__pill{
  display:inline-block; margin:.2em 0 10px; padding:6px 12px; border-radius:999px;
  background:#fff7d6; color:#c78b26; font-weight:700; border:1px solid #f5e7b2;
}
.course-hero__lead{ color:#333; line-height:1.9; }

/* ---- 見出し（▶） ---- */
.c-heading-arrow{
  position:relative; padding-left:28px; font-size: clamp(18px, 2.4vw, 22px); font-weight:800; margin:28px 0 12px;
}
.c-heading-arrow::before{
  content:""; position:absolute; left:0; top:.45em; width:0; height:0;
  border-left:14px solid #ffd34d; border-top:8px solid transparent; border-bottom:8px solid transparent;
}

/* ---- ドットリスト ---- */
.c-list{ margin:0; padding:0; list-style:none; }
.c-list--dot > li{ position:relative; padding-left:1.4em; margin:.45em 0; }
.c-list--dot > li::before{
  content:""; position:absolute; left:0.2em; top:.6em; width:8px; height:8px; border-radius:50%; background:#111;
}

/* ---- 価格行 ---- */
.price-row{ display:flex; align-items:center; gap:12px; border-top:1px solid #eee; border-bottom:1px solid #eee; padding:14px 8px; }
.price-label{ display:inline-block; background:#ffe275; color:#111; padding:6px 10px; border-radius:6px; font-weight:700; }
.price-num{ font-weight:800; font-size: clamp(18px, 2.6vw, 22px); color:#c78b26; }

/* ---- CTA ---- */
.course-cta{ margin-top:22px; }
.btn-primary{
  display:block; text-align:center; text-decoration:none;
  padding:16px 20px; border-radius:999px; font-weight:800; color:#fff; background:#ff8a00;
  transition: background .18s ease, box-shadow .18s ease, transform .06s ease;
}
.btn-primary:hover, .btn-primary:focus-visible{
  background:#f9db4a; color:#111; box-shadow:0 8px 18px rgba(0,0,0,.08); outline:none;
}
.btn-primary:active{ transform: translateY(1px); }


/* ===== Anchor page base 0911ここから===== */
.courses-anchor .inner{max-width:1000px;margin:0 auto;padding:0 20px}
.courses-anchor .course-block{scroll-margin-top:96px;padding:48px 0;border-top:1px solid #eee}
.courses-anchor .course-block:first-of-type{border-top:0}

/* Eyebrow */
.courses-anchor .eyebrow{
  color:#7b7b7b;font-size:14px;letter-spacing:.05em;margin:0 0 8px
}

/* Title row */
.courses-anchor .title-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;margin:0 0 12px}
.courses-anchor .title{
  font-size:36px;line-height:1.2;font-weight:800;
  display:flex;align-items:center;gap:.4em
}
@media (max-width:768px){
  .courses-anchor .title{font-size:28px}
}
.courses-anchor .study-time{color:#9b9b9b;font-weight:700}

/* Lead */
.courses-anchor .lead{font-size:16px;line-height:1.9;color:#333;margin:0 0 20px}

/* KV image */
.courses-anchor .kv{margin:0 0 28px}
.courses-anchor .kv img{width:100%;height:auto;border-radius:6px;display:block}

/* Info stack (yellow left label rows) */
.courses-anchor .info-stack{display:flex;flex-direction:column;gap:18px;margin:0 0 28px}
.courses-anchor .info-row{
  display:grid;grid-template-columns:180px 1fr;gap:18px;
  align-items:stretch;border:1px solid #eee;border-radius:6px;overflow:hidden;background:#fff
}
@media (max-width:768px){
  .courses-anchor .info-row{grid-template-columns:1fr}
}
.courses-anchor .info-row .label{
  background:#ffe15b;color:#222;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  padding:18px;min-height:64px;letter-spacing:.05em
}
.courses-anchor .info-row .content{padding:18px}

/* Dot list */
.courses-anchor .dotlist{list-style:none;margin:0;padding:0}
.courses-anchor .dotlist>li{position:relative;padding-left:1.4em;margin:.5em 0;line-height:1.9}
.courses-anchor .dotlist>li::before{
  content:"";position:absolute;left:.2em;top:.8em;width:8px;height:8px;border-radius:50%;background:#111
}

/* Price row emphasis */
.courses-anchor .price-row .price-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px}
.courses-anchor .price-row .price{
  font-size:28px;font-weight:800;color:#ff7a00; /* オレンジ数値 */
}
.courses-anchor .price-row .price-note{color:#666}

/* CTA primary (orange -> hover black) */
.courses-anchor .cta-wrap{margin-top:18px}
.courses-anchor .btn-primary{
  display:inline-block;width:100%;text-align:center;
  padding:18px 22px;border-radius:999px;font-weight:800;
  background:linear-gradient(180deg,#ffa726 0%,#ff7a00 100%);
  color:#fff;text-decoration:none;transition:background .25s ease, transform .05s ease;
  box-shadow:0 8px 18px rgba(255,122,0,.25)
}
.courses-anchor .btn-primary:hover{
  background:#000; /* ←要件：ホバー時に背景を黒に */
}
.courses-anchor .btn-primary:active{transform:translateY(1px)}

/* Headings (black underline style) 共通 */
.courses-anchor .wp-block-heading{
  font-weight:800;border-bottom:3px solid #111;padding-bottom:8px;margin:0 0 14px
}

/* すでにサイト共通の飾り線 .gpc-divider がある前提で流用 停止中の作業のCSSここまで */

/* トップの「費用でお悩みの方へ」部分 */
/* sale-off（テキスト化した割引表示） */
.block-sale .sale-off {
  display: flex;
  align-items: center;   /* 縦位置揃え */
  justify-content: center; /* 横中央配置 */
  gap: 1.5rem;             /* 金額とOFFラベルの間隔 */
  flex-wrap: wrap;
  margin-top: 1rem;
  text-align: center;
}

.block-sale .sale-off .sale-label {
  font-size: 0.95rem;
  letter-spacing: .02em;
  margin-right: .25rem;
}

.block-sale .sale-off .sale-amount {
  color: #D90000;  /* 赤 */
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
}

.block-sale .sale-off .sale-badge {
  color: #ff7a00;
  border: 2px solid #ff7a00;
  border-radius: .4rem;
  padding: .25rem .6rem;
  font-size: clamp(.9rem, 1.8vw, 1.1rem);
  font-weight: 700;
  white-space: nowrap;
  display: inline-block;
}

/* 金額全体 */
.block-sale .sale-off .sale-amount {
  color: #D90000;
  font-style: italic;   /* イタリック */
  font-size: clamp(3rem, 6vw, 4rem);  /* 倍くらい大きく */
  font-weight: 700;
  line-height: 1;
}

/* 円の部分だけ小さく */
.block-sale .sale-off .sale-amount .unit {
  font-size: 0.5em;       /* 半分サイズ */
  font-style: normal;     /* 通常フォント */
  margin-left: .2rem;
  vertical-align: baseline; /* 下に揃える */
  position: relative;
  top: 0.1em;             /* 少しだけ下げる */
}


/* モバイルでの詰まり対策 */
@media (max-width: 480px) {
  .block-sale .sale-off {
    gap: .5rem .75rem;
	padding: 19px 10px !important;
  }
}
/* 購入するボタン（外部リンク）は gpc-btn で出力される */
.gpc-price-card .gpc-btn:not(.gpc-btn--ghost) {
  background: #fff !important;
  color: #111 !important;
  border: 2px solid #111 !important;
  border-radius: 999px;
  padding: 12px 20px;
  font-weight: 800;
  text-decoration: none;
}

/* ホバー時（背景ダークグレー＋文字白） */
.gpc-price-card .gpc-btn:not(.gpc-btn--ghost):hover,
.gpc-price-card .gpc-btn:not(.gpc-btn--ghost):focus {
  background: #555 !important;   /* ダークグレー */
  color: #fff !important;
  border-color: #555 !important;
  text-decoration: none;
}

/*お問い合わせレイアウト調整*/
.block-form-contact .agree input{
transform: translateY(20%)!important;
    margin-right: 10px!important;
}
/* ===== 費用セクション（block-sale）価格整形 2025-09-15 ===== */

/* 「受講料 198,000円」を1行でベースライン揃えに */
.sale-off .sale-price{
  display: inline-flex;
  align-items: baseline;
  gap: .35em;
  flex-wrap: nowrap;
  white-space: nowrap;
}

/* 数字本体：画面幅で自動縮小。太さも少しだけ細く */
.sale-off .sale-amount{
  display: inline-flex;           /* strongがblock指定されていても上書き */
  align-items: baseline;
  white-space: nowrap;
  line-height: 1;
  font-size: clamp(40px, 10vw, 56px);
  font-weight: 600;               /* もっと細く → 500 に変更可 */
  font-variant-numeric: tabular-nums lining-nums;
}

/* 「円」を小さく・改行禁止 */
.sale-off .sale-amount .unit{
  display: inline;                /* 念のため block化されていたら戻す */
  font-size: .38em;               /* 数字に対する相対サイズ（調整可） */
  margin-left: .15em;
  line-height: 1;
  white-space: nowrap;
}

/* とても狭い端末の保険（任意調整） */
@media (max-width: 360px){
  .sale-off .sale-amount{ font-size: clamp(36px, 9.5vw, 48px); font-weight: 500; }
}

