@charset "UTF-8";
/* CSS Document */
 /* ===== Brand Tokens ===== */
  :root{
  --mint:#7FAE9E;        /* グリーン */
  --blush:#F6E9EE;       /* 淡ピンク 背景 */
  --ink:#303041;         /* 本文 */
  --muted:#777777;       /* 補助 */
  --line:#E6E6E6;        /* 罫線 */

  /* Brand（優しめピンク基調） */
  --brand:#F395A8;       /* CTAメイン */
  --brand-700:#f6c2ca;   /* CTAホバー/アクティブ（やさしくトーンダウン） */
  --brand-50:#E4C1C9;    /* ごく淡いピンク背景 */

  /* UI */
  --radius-2xl: 8px;     /* 角丸（控えめ） */
  --shadow-soft: 0 6px 18px rgba(0,0,0,.06);
}


    *{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Noto Sans JP',system-ui,-apple-system,"Segoe UI","Hiragino Sans","Yu Gothic",sans-serif;
  color:var(--ink); line-height:1.85; background:#fff;
}
h1,h2,h3{font-family:"Yu Mincho","Hiragino Mincho ProN","游明朝",serif; letter-spacing:.02em}
a{color:var(--brand); text-decoration:none} a:hover{opacity:.92}
.wrap{max-width:1080px;margin:0 auto;padding:28px 20px}

/* Hero */
.hero{
  position:relative; overflow:hidden; border-radius:var(--radius-2xl);
  background:linear-gradient(135deg,#89ad9f 0%,#7FAE9E 35%,#F6E9EE 100%);
  color:#fff; padding:46px 22px; box-shadow:var(--shadow);
}
.eyebrow{display:inline-block;padding:.35rem .7rem;border-radius:999px;background:#ffffff22;border:1px solid #ffffff55;font-weight:700;font-size:.82rem;letter-spacing:.12em}
.hero h1{margin:10px 0 8px; font-size:clamp(1.6rem,4.2vw,2.2rem)}
.hero p{margin:.2rem 0 1rem}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.9rem 1.2rem;border-radius:999px;font-weight:700;border:1px solid transparent;box-shadow:0 6px 14px rgba(0,0,0,.08);transition:transform .08s ease}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--brand);color:#fff}
.btn--primary:hover{background:var(--brand-700)}
.btn--ghost{background:#fff;color:var(--brand)}
.btn--sm{padding:.6rem .9rem; font-size:.92rem}

/* Intro Feature */
.feature{margin:34px 0;display:grid;gap:16px;grid-template-columns:repeat(12,1fr)}
.feature .leadbox{grid-column:span 12;background:var(--brand-50);border:1px solid var(--line);border-radius:var(--radius-2xl);padding:18px 16px}
@media(min-width:860px){.feature .leadbox{grid-column:span 12}}
.kv3{display:grid;gap:12px;grid-template-columns:repeat(12,1fr);margin-top:10px}
.kv3 .item{grid-column:span 12;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px}
@media(min-width:720px){.kv3 .item{grid-column:span 4}}
.kv3 .num{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--mint);color:#fff;font-weight:800;margin-right:8px}

/* Checklist */
.checks{display:grid;gap:8px;margin-top:10px;grid-template-columns:repeat(12,1fr)}
.checks .col{grid-column:span 12;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px}
@media(min-width:720px){.checks{grid-template-columns:repeat(2,1fr)} .checks .col{grid-column:span 1}}
.checks ul{margin:.2rem 0 0;padding-left:1.2rem}

/* Course Grid */
.section{margin:38px 0}
.section h2{font-size:clamp(1.3rem,3.5vw,1.8rem);margin:0 0 12px}
.section .lead{color:var(--muted);margin:0 0 18px}
.grid{display:grid;gap:16px;grid-template-columns:repeat(12,1fr)}
.grid-3col>.col{grid-column:span 12}
@media(min-width:720px){.grid-3col>.col{grid-column:span 6}}
@media(min-width:1024px){.grid-3col>.col{grid-column:span 4}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-2xl);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;height:100%}
.card .thumb{aspect-ratio:16/10;background:var(--blush)}
.card .pad{padding:16px}
.badge{display:inline-flex;align-items:center;gap:.4rem;padding:.28rem .6rem;border-radius:999px;font-size:.78rem;font-weight:800;border:1px solid var(--line);background:#fff;color:var(--ink)}
.card h3{font-size:1.1rem;margin:.6rem 0 .3rem}
.card p{margin:0 0 .8rem}
.cta-row{display:flex;gap:8px;margin-top:auto;padding:0 16px 16px;flex-wrap:wrap}

/* Compare (optional) */
.compare{background:var(--brand-50);border:1px solid var(--line);border-radius:var(--radius-2xl);padding:16px}
.table{width:100%;border-collapse:collapse;font-size:.95rem}
.table th,.table td{border-bottom:1px solid var(--line);padding:12px 10px;text-align:left;vertical-align:top}
.table th{white-space:nowrap;color:#444}
@media(max-width:720px){
  .table thead{display:none}
  .table tr{display:block;padding:12px 0}
  .table td{display:flex;gap:10px}
  .table td::before{content:attr(data-label);flex:0 0 8rem;color:#555;font-weight:700}
}

/* Steps / FAQ / Final */
.steps{display:grid;gap:12px;grid-template-columns:repeat(12,1fr)}
.step{grid-column:span 12;display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}
@media(min-width:720px){.step{grid-column:span 6}}
.step .num{flex:0 0 36px;height:36px;border-radius:50%;background:var(--mint);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800}
details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
details+details{margin-top:10px}
summary{cursor:pointer;font-weight:700;list-style:none} summary::-webkit-details-marker{display:none}
.final{background:linear-gradient(135deg,var(--blush),#ffffff);border:1px solid var(--line);border-radius:var(--radius-2xl);padding:22px;text-align:center;box-shadow:var(--shadow)}
.final p{margin:.4rem 0 1rem}

/* Util */
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;clip:rect(0 0 0 0);overflow:hidden}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}

/* 下段2カラムのレイアウト */
.grid-two{
  display:grid; gap:14px; margin-top:14px;
  grid-template-columns: 1fr; 
}
@media (min-width: 960px){
  .grid-two{ grid-template-columns: 1.1fr 1fr; } /* 左=やや広め */
}

.panel{
  background:#fff; border:1px solid var(--line);
  border-radius: var(--radius-2xl);
  padding:16px 16px 18px;
  box-shadow: var(--shadow-soft);
}
.panel-title{
  margin:0 0 8px; font-size:1rem; color:#2f2f2f; 
}

/* 左：チェックリストを上品に */
.checklist{
  list-style:none; padding:0; margin:6px 0 0;
  display:grid; gap:8px;
}
.checklist li{
  position:relative; padding-left:1.6em;
  color:var(--ink);
}
.checklist li::before{
  content:""; position:absolute; left:.1em; top:.45em;
  width:1em; height:1em; background: var(--mint);
  border-radius:4px;
  -webkit-mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
  <path fill='black' d='M9 16.17l-3.88-3.88L4 13.41 9 18.41 20 7.41 18.59 6l-9.59 9.59z'/>\
  </svg>") no-repeat center / contain;
  mask: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M9 16.17l-3.88-3.88L4 13.41 9 18.41 20 7.41 18.59 6l-9.59 9.59z\"/></svg>') no-repeat center / contain;
}

/* 右：実務支援インフォ */
.panel--info{ background: var(--brand-50); }
.copy-strong{
  margin:.4rem 0 .6rem; color:#333;
}
.bullets{
  margin:.4rem 0 .6rem; padding-left:1.2rem;
}
.bullets li{ margin:.2rem 0; }
.note{
  font-size:.9rem; color:#666; margin:.4rem 0 .8rem;
}

/* 強調ピル */
.pill-row{ display:flex; gap:8px; flex-wrap:wrap }
.pill{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.45rem .8rem; border-radius:999px;
  background:#fff; color:var(--ink);
  border:1px solid var(--line);
  box-shadow: var(--shadow-soft);
}
.pill--link{ background:#fff; color:var(--brand); border-color: var(--brand); }
/* 見出しを“やさ可愛”に */
.panel-title.cute{
  font-family:"Yu Mincho","Hiragino Mincho ProN","游明朝",serif;
  font-weight:700;
  font-size:1.06rem;
  color:#2f2f2f;
  position:relative;
  padding-left:1.2em;
  letter-spacing:.02em;
}

/* タイトル左に小さな花丸バッジ */
.panel-title.cute::before{
  content:"✿";
  position:absolute; left:0; top:.05em;
  display:inline-flex; align-items:center; justify-content:center;
  width:1em; height:1em; line-height:1;
  border-radius:50%;
  background:var(--blush);
  color:#925a6b;           /* 花色（少し落ち着いたピンク） */
  font-size:.9em;
}

/* サブ見出し（任意） */
.sub-cute{
  margin:.1rem 0 .4rem;
  font-size:.94rem;
  color:#666;
  padding:.25rem .6rem;
  display:inline-block;
  background:#fff;
  border:1px solid var(--line);
  border-radius:999px;     /* ふんわりピル */
}
/* 可愛い見出しの強化（花ピクト＋下線） */
.panel-title.cute{
  font-family:"Yu Mincho","Hiragino Mincho ProN","游明朝",serif;
  font-weight:700; font-size:1.14rem; letter-spacing:.02em;
  color:#2f2f2f; position:relative; padding-left:2.1em; margin-bottom:.6rem;
}
.panel-title.cute::before{
  /* 花びらロゼット */
  content:"";
  position:absolute; left:0; top:.1em;
  width:1.4em; height:1.4em; border-radius:50%;
  background: radial-gradient(circle at 50% 50%, #fff 40%, transparent 41%) ,
              conic-gradient(from 0deg, var(--blush) 0 25%, transparent 25% 50%, var(--blush) 50% 75%, transparent 75% 100%);
  box-shadow: inset 0 0 0 2px #e8b8c3;
}
.panel-title.cute::after{
  content:""; display:block; width:72px; height:4px; margin:.4rem 0 0;
  border-radius:999px; background:linear-gradient(90deg, var(--blush), #fff);
  opacity:.9;
}

/* チャームリスト（花びらバレット＋サブコピー付き） */
.charm-list{list-style:none; margin:.2rem 0 0; padding:0; display:grid; gap:12px}
.charm-list li{position:relative; padding-left:2rem; background:#fff; border:1px solid var(--line);
  border-radius:12px; padding:12px 12px 12px 2rem; box-shadow: var(--shadow-soft);}
.charm-list li::before{
  content:""; position:absolute; left:.6rem; top:14px; width:16px; height:16px;
  background: radial-gradient(circle at 50% 50%, #fff 40%, transparent 41%),
              conic-gradient(var(--mint) 0 25%, transparent 25% 50%, var(--mint) 50% 75%, transparent 75% 100%);
  border-radius:50%; box-shadow: inset 0 0 0 2px #cfe2dc;
}
.charm-list .ttl{display:block; font-weight:700; color:#2f2f2f}
.charm-list .sub{display:block; font-size:.92rem; color:#555; margin-top:.1rem}

/* 余白調整（セクションが詰まる時に） */
.panel--list{padding-top:18px; padding-bottom:18px}
/* 右パネルの背景そのまま（var(--brand-50)） */
.panel--info{ background: var(--brand-50); }

/* 帯コピー */
.sub-cute{
  display:inline-block; margin:.2rem 0 .8rem; padding:.25rem .7rem;
  font-size:.95rem; color:#2f2f2f; background:#fff;
  border:1px solid var(--line); border-radius:999px;
}

/* リード文は行間広め・サイズ少しUP */
.lead-copy{
  color:#2f2f2f; font-size:1rem; line-height:1.9; margin:.2rem 0 .8rem;
}

/* 箇条書きの整え（丸ではなくダッシュ風＋左インデント揃え） */
.bullets--pretty{
  padding-left:1.2rem; margin:.4rem 0 .4rem; list-style:none;
}
.bullets--pretty li{
  position:relative; margin:.28rem 0; padding-left:1rem;
}
.bullets--pretty li::before{
  content:"—"; position:absolute; left:0; top:0; color:#6b6b6b;
}

/* 注意書きはトーン控えめ＆字間ほんの少し */
.note{ font-size:.9rem; color:#666; letter-spacing:.01em; margin:.6rem 0 1rem; }

/* ピルボタン（白×影で立体感） */
.pill-row{ display:flex; flex-wrap:wrap; gap:10px; }
.pill{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.6rem 1rem; border-radius:999px; text-decoration:none;
  border:1px solid #e8e8e8; background:#fff; color:var(--ink);
  box-shadow: 0 6px 14px rgba(0,0,0,.08);
}
.pill--cta{ border-color: var(--brand); color: var(--brand); }
.pill--cta:hover{ opacity:.92; }
/* STORY ティーザー */
.story-h2{
  font-family:"Yu Mincho","Hiragino Mincho ProN","游明朝",serif;
  font-size:clamp(1.3rem,3.5vw,1.8rem);
  margin:0 0 10px; letter-spacing:.02em;
}
.story-grid{
  display:grid; gap:14px; margin-top:12px;
  grid-template-columns: repeat(12,1fr);
}
.story-card{ 
  grid-column: span 12;
  background:#fff; border:1px solid var(--line); border-radius: var(--radius-2xl);
  box-shadow: var(--shadow-soft); overflow:hidden; position:relative;
}
.story-card--lead{ background: linear-gradient(135deg, var(--blush), #fff); }
@media(min-width:800px){
  .story-card{ grid-column: span 4; }
  .story-card--lead{ grid-column: span 12; }
}
.story-link{ display:block; padding:16px 16px 18px; color:inherit }
.story-meta{
  display:inline-block; font-weight:800; font-size:.78rem; letter-spacing:.12em;
  padding:.3rem .6rem; border-radius:999px; background:#fff; border:1px solid var(--line);
  color:#2f2f2f; box-shadow:var(--shadow-soft); margin-bottom:.5rem;
}
.story-title{ font-size:1.06rem; margin:.2rem 0 .2rem }
.story-sub{ color:#555; margin:0 }
.story-note{ color:#666; font-size:.95rem; margin:.8rem 0 0 }

.story-cta{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px }
.bullets--pretty li::before{ content:"・"; color: var(--mint); font-weight:700; }

/* 箇条書きカード風（薄いピンク背景） */
.bullets--pretty{
  list-style:none;
  margin:.6rem 0 .6rem;
  padding:12px 14px;                /* 内側余白 */
  background: color-mix(in oklab, var(--blush) 35%, #fff); /* やさしい薄ピンク */
  border:1px solid color-mix(in oklab, var(--blush) 55%, #fff);
  border-radius:12px;
  box-shadow: var(--shadow-soft);
}
.bullets--pretty li{
  position:relative; margin:.35rem 0; padding-left:1.1rem;
}
.bullets--pretty li::before{
  content:"・"; position:absolute; left:0; top:0; color:var(--mint); font-weight:700;
}
.bullets--pretty{ border-left:4px solid var(--mint); padding-left:12px }
/* 可愛いピンクの“ころん”バレット */
.bullets--pretty li{
  position:relative;
  margin:.55rem 0;                /* 行間ゆったり */
  padding-left:1.6rem;            /* 丸のぶん左余白を広めに */
}

.bullets--pretty li::before{
  content:"";
  position:absolute; left:0; top:.35em;
  width:10px; height:10px;        /* ←大きさ。14〜16pxにしても可愛い */
  border-radius:50%;
  background:
    radial-gradient(circle at 30% 30%, #fff8 0 35%, transparent 36%), /* きらりハイライト */
    linear-gradient(180deg, #F6C7D1, #EFA6B5);                        /* ピンクの立体感 */
  box-shadow:
    0 1px 0 rgba(0,0,0,.04),
    0 3px 10px rgba(0,0,0,.06);   /* “ころん”とした影 */
  transform: translateY(1px);
}

/* ダーク文字でも読みやすく：太字行の間隔を少し詰めたいとき */
.bullets--pretty li strong{ letter-spacing:.01em }

/* リード文の可読性＆バランスを最適化 */
.section .lead{
  max-width: 42ch;              /* 1行の長さを程よく（約42文字） */
  font-size: 1.02rem;           /* 見出しとの対比で少しだけ大きく */
  line-height: 2.0;             /* 行間ゆったり */
  color: #5a5a5a;               /* 黒よりやわらかいグレー */
  letter-spacing: .02em;        /* ほんの少し字間を広げる */
  margin: .2rem 0 1rem;         /* 上=少し/下=ゆったり */
  text-wrap: balance;           /* 可能なら美しく改行（対応ブラウザ） */
  hanging-punctuation: allow-end;/* 句読点のぶら下がり（対応ブラウザ） */
}

/* 画面幅が狭いときは行長をゆるめる */
@media (max-width: 560px){
  .section .lead{
    max-width: 100%;
    font-size: 1rem;
    line-height: 1.95;
  }
}
/* リード文の可読性＆バランスを最適化 */
.section .lead{
  max-width: 42ch;              /* 1行の長さを程よく（約42文字） */
  font-size: 1.02rem;           /* 見出しとの対比で少しだけ大きく */
  line-height: 2.0;             /* 行間ゆったり */
  color: #5a5a5a;               /* 黒よりやわらかいグレー */
  letter-spacing: .02em;        /* ほんの少し字間を広げる */
  margin: .2rem 0 1rem;         /* 上=少し/下=ゆったり */
  text-wrap: balance;           /* 可能なら美しく改行（対応ブラウザ） */
  hanging-punctuation: allow-end;/* 句読点のぶら下がり（対応ブラウザ） */
}

/* 画面幅が狭いときは行長をゆるめる */
@media (max-width: 560px){
  .section .lead{
    max-width: 100%;
    font-size: 1rem;
    line-height: 1.95;
  }
}
.section .lead{ padding-block: 4px; border-left: 4px solid var(--blush); padding-left: 10px; }

/* デフォルト：モバイルは読みやすく折り返し */
.section .lead{
  font-size: 1.02rem;
  line-height: 1.9;
  color: #5a5a5a;
  letter-spacing: .02em;
  margin: .2rem 0 1rem;
  white-space: normal;     /* 折り返し可 */
  max-width: 100%;
}

/* PC幅は1行固定（必要なら幅に応じて縮む） */
@media (min-width: 1024px){
  .section .lead{
    white-space: nowrap;   /* ← 1行に固定 */
    max-width: none;       /* 幅制限を解除 */
  }
}

/* 見出しを目立たせる（バッジ＋花ライン） */
.story-h2.pretty{
  display:flex; align-items:center; gap:.6rem;
  font-family:"Yu Mincho","Hiragino Mincho ProN","游明朝",serif;
  font-size: clamp(1.5rem, 3.6vw, 2.1rem);
  letter-spacing:.02em; margin: 0 0 .4rem; position:relative;
}
.story-h2.pretty::after{
  /* 花びらの淡色ライン（右に伸びる装飾） */
  content:""; height:8px; flex:1;
  background: repeating-linear-gradient(
    90deg,
    var(--blush), var(--blush) 12px,
    transparent 12px, transparent 20px
  );
  border-radius:999px; opacity:.7;
}

/* 左側の“STORY”バッジ */
.story-badge{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.25rem .6rem; border-radius:999px;
  background:#fff; border:1px solid var(--line); color:#2f2f2f;
  box-shadow: var(--shadow-soft); font-weight:800; font-size:.9rem; letter-spacing:.12em;
  position:relative;
}
.story-badge::before{
  /* ちいさな花丸アイコン */
  content:""; position:absolute; left:-10px; width:16px; height:16px; border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, #fff 40%, transparent 41%),
    conic-gradient(var(--blush) 0 25%, transparent 25% 50%, var(--blush) 50% 75%, transparent 75% 100%);
  box-shadow: inset 0 0 0 2px #e8b8c3;
}

/* サブコピー（リード） */
.story-tagline{
  margin:.1rem 0 .8rem;
  color:#5a5a5a; font-size:1.02rem; line-height:1.9;
  border-left:4px solid var(--blush);
  padding-left:10px;
}

/* PCで1行に寄せる（必要なら） */
@media (min-width: 1024px){
  .story-tagline{ white-space: nowrap; }
}
.story-h2.pretty{
  background: color-mix(in oklab, var(--blush) 28%, #fff);
  padding:.4rem .6rem; border-radius:12px; border:1px solid var(--line);
}
.story-h2.pretty::after{ opacity:0 } /* 帯にする場合は右ラインを消す */


/* 共通スタイル：見出し（サイズは現状のまま） */
h3#paris2, h3#art2, h3#fresh2, h3#bridal2, h3#pre2{
  position: relative;
  font-weight: 800;            /* 強さだけUP（不要なら削除OK） */
  letter-spacing: .02em;
  color:#2f2f2f;
  margin:.45rem 0 .25rem;
  padding-left: 2rem;          /* 左のアイコン分 */
}

/* コース別アクセント色（ベースは --blush） */
:root{
  --accent-paris:  #f6c2ca;   /* 上品ピンク（既存ブランド寄り） */
  --accent-art:    #EFA6B5;   /* 少し濃いピンク */
  --accent-fresh:  #7FAE9E;   /* ミント（生花） */
  --accent-bridal: #F395A8;   /* ブランドのピンク */
  --accent-pre:    #E4C1C9;   /* ふわっと薄ピンク */
}

/* 左の“花ロゼット”アイコン（コース別カラー） */
h3#paris2::before, h3#art2::before, h3#fresh2::before, h3#bridal2::before, h3#pre2::before{
  content:""; position:absolute; left:0; top:.15em;
  width:1.2rem; height:1.2rem; border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, #fff 42%, transparent 43%),
    conic-gradient(var(--accent-paris) 0 25%, transparent 25% 50%,
                   var(--accent-paris) 50% 75%, transparent 75% 100%);
  box-shadow: inset 0 0 0 2px #e8b8c3;
}
h3#art2::before   { background: radial-gradient(circle at 50% 50%, #fff 42%, transparent 43%), conic-gradient(var(--accent-art) 0 25%, transparent 25% 50%, var(--accent-art) 50% 75%, transparent 75% 100%); }
h3#fresh2::before { background: radial-gradient(circle at 50% 50%, #fff 42%, transparent 43%), conic-gradient(var(--accent-fresh) 0 25%, transparent 25% 50%, var(--accent-fresh) 50% 75%, transparent 75% 100%); }
h3#bridal2::before{ background: radial-gradient(circle at 50% 50%, #fff 42%, transparent 43%), conic-gradient(var(--accent-bridal) 0 25%, transparent 25% 50%, var(--accent-bridal) 50% 75%, transparent 75% 100%); }
h3#pre2::before   { background: radial-gradient(circle at 50% 50%, #fff 42%, transparent 43%), conic-gradient(var(--accent-pre) 0 25%, transparent 25% 50%, var(--accent-pre) 50% 75%, transparent 75% 100%); }

/* やさしい下線（各コース色で短めリズム） */
h3#paris2::after, h3#art2::after, h3#fresh2::after, h3#bridal2::after, h3#pre2::after{
  content:""; display:block; width:82px; height:4px; margin:.35rem 0 0;
  border-radius:999px; opacity:.9; background:linear-gradient(90deg, #fff, #fff);
}
h3#paris2::after  { background: linear-gradient(90deg, var(--accent-paris), #fff); }
h3#art2::after    { background: linear-gradient(90deg, var(--accent-art), #fff); }
h3#fresh2::after  { background: linear-gradient(90deg, var(--accent-fresh), #fff); }
h3#bridal2::after { background: linear-gradient(90deg, var(--accent-bridal), #fff); }
h3#pre2::after    { background: linear-gradient(90deg, var(--accent-pre), #fff); }

/* 丸のサイズと色（ここだけ変えれば全見出しに反映） */
:root{
  --dot-size: 14px;                 /* ← 大きさをここで調整（例：16px/18px） */
  --dot-top: .2em;                  /* 上下の位置微調整 */
  --dot-grad-top:  #f6c2ca;         /* 上側のピンク */
  --dot-grad-bottom:#F395A8;         /* 下側のピンク（ブランド） */
}

/* 対象見出し（必要なIDを並べてください） */
h3#paris2, h3#art2, h3#fresh2, h3#bridal2, h3#pre2{
  position: relative;
  padding-left: calc(var(--dot-size) + .8rem); /* 丸ぶんの左余白 */
  font-weight: 800; letter-spacing: .02em; color:#2f2f2f;
}

/* 左アイコン：ピンクのグラデ丸（“ころん”と見えるハイライト＋影） */
h3#paris2::before,
h3#art2::before,
h3#fresh2::before,
h3#bridal2::before,
h3#pre2::before{
  content:"";
  position:absolute; left:0; top: var(--dot-top);
  width: var(--dot-size); height: var(--dot-size);
  border-radius:50%;
  background:
    radial-gradient(circle at 30% 30%, #ffffffb3 0 38%, transparent 39%), /* きらりハイライト */
    linear-gradient(180deg, var(--dot-grad-top), var(--dot-grad-bottom)); /* ピンクのグラデ */
  box-shadow: 0 1px 0 rgba(0,0,0,.04), 0 3px 10px rgba(0,0,0,.08);
}

/* 既存の下線演出を残したい場合（任意） */
h3#paris2::after, h3#art2::after, h3#fresh2::after, h3#bridal2::after, h3#pre2::after{
  content:""; display:block; width:82px; height:4px; margin:.35rem 0 0;
  border-radius:999px; background: linear-gradient(90deg, var(--dot-grad-top), #fff); opacity:.9;
}