@charset "utf-8";
/* =============================================================================
   占い道しるべ／固定ページ デザイン v0.2
   -----------------------------------------------------------------------------
   uranaiguide-page-design プラグインの assets/page-design.css として配る。

   ■ スコープ
   body.page-id-475（/campaign/）
   body.page-id-14 （/hajimete/）
   body.page-id-7  （/worry/・悩みから探す）  ← v0.2 で追加
   の3ページだけに効かせる。
   固定ページIDは本体CSSも使っている既存の目印なので、body_class を足す必要がない。
   /worry/ の「子」5ページは別プラグイン（uranaiguide-category-design）の担当で、
   あちらは親IDで判定しているため /worry/ 自身は対象外。住み分けはそこで切れている。

   ■ 方針（トップ・カテゴリと同じ語彙）
   紺×金。金は線で使い、面では塗らない。角を落とした矩形のボタン。
   見出しは明朝、本文は 38rem の測度。カードは白地・細い罫・浅い角丸・影は最小。
   絵文字は使わず、自前の線画SVGを data URI で持つ。

   ■ 本文マークアップについて
   この3ページは本文を書き直す前提（インラインの !important を外すため）。
   クラスは ugpd- で新しく起こし、本体CSSの .ug-* とは土俵を分ける。
   ただし主要CTAだけは page-chrome v1.3.0 のシャインの対象に入るよう、
   .ug-btn .ug-btn--primary を併記する（見た目はこちらで完全に上書きする）。
   ============================================================================= */

body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21){
  --ugpd-navy:#161a34;
  --ugpd-navy-deep:#0f1228;
  --ugpd-gold:#c8a24a;
  --ugpd-gold-lt:#e6c877;
  --ugpd-paper:#faf7f0;
  --ugpd-tint:#f5f1e6;
  --ugpd-ink:#22263a;
  --ugpd-ink-soft:#474c5e;
  --ugpd-line:rgba(22,26,52,.12);
  --ugpd-accent:#d9b45c;         /* この2ページは金を主役にする */
  --ugpd-accent-ink:#6d5216;
  --ugpd-accent-soft:#eeddb6;
  --ugpd-measure:38rem;
  --ugpd-wide:62rem;
  --ugpd-gap:clamp(2.6rem,6vw,4.4rem);
  --ugpd-serif:"Noto Serif JP","Yu Mincho","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro","MS PMincho",serif;
  --ugpd-sans:"Noto Sans JP",-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;

  /* 線画アイコン（絵文字の置き換え）。色は #a07d2e */
  --ugpd-ic-app:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23a07d2e%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20x=%227.2%22%20y=%222.8%22%20width=%229.6%22%20height=%2218.4%22%20rx=%222%22/%3E%3Cpath%20d=%22M10.6%2018.6h2.8%22/%3E%3C/svg%3E");
  --ugpd-ic-chat:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23a07d2e%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M20%2013.2c0%203.4-3.6%206.2-8%206.2-1%200-1.9-.1-2.8-.4L4.6%2020.6l1.2-3.4C4.7%2016.1%204%2014.7%204%2013.2%204%209.8%207.6%207%2012%207s8%202.8%208%206.2z%22/%3E%3C/svg%3E");
  --ugpd-ic-phone:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23a07d2e%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M6.4%203.8h3.2l1.6%204-2%201.2a11%2011%200%200%200%205.8%205.8l1.2-2%204%201.6v3.2a1.6%201.6%200%200%201-1.7%201.6C10.6%2018.6%205.4%2013.4%204.8%205.5a1.6%201.6%200%200%201%201.6-1.7z%22/%3E%3C/svg%3E");
  --ugpd-ic-heart:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23a07d2e%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M12%2020.2c-1.6-1.2-7.4-5-7.4-10.1a4.2%204.2%200%200%201%207.4-2.7%204.2%204.2%200%200%201%207.4%202.7c0%205.1-5.8%208.9-7.4%2010.1z%22/%3E%3C/svg%3E");
  --ugpd-ic-book:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23e6c877%22%20stroke-width=%221.4%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4.4%205.2h6a2.4%202.4%200%200%201%202.4%202.4v11a2%202%200%200%200-2-2H4.4z%22/%3E%3Cpath%20d=%22M19.6%205.2h-6a2.4%202.4%200%200%200-2.4%202.4v11a2%202%200%200%201%202-2h6.4z%22/%3E%3C/svg%3E");
  --ugpd-ic-gift:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23e6c877%22%20stroke-width=%221.4%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20x=%224%22%20y=%229%22%20width=%2216%22%20height=%2211%22%20rx=%221.4%22/%3E%3Cpath%20d=%22M2.8%206.2h18.4V9H2.8zM12%206.2V20%22/%3E%3Cpath%20d=%22M12%206.2C10.6%203.4%206%203.6%207%206.2M12%206.2c1.4-2.8%206-2.6%205%200%22/%3E%3C/svg%3E");
}

/* -----------------------------------------------------------------------------
   1) 地と器
   -------------------------------------------------------------------------- */
html body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21){ background:var(--ugpd-paper) !important; }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #content,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #content-in,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #main,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .article,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content{
  background:transparent !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21){
  color:var(--ugpd-ink);
  font-family:var(--ugpd-sans);
  overflow-x:hidden;
}
@supports (overflow:clip){
  body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21){ overflow-x:clip; }
  /* html 側にも掛けること。全幅の帯は負のマージンで画面幅より
     スクロールバーぶんだけ広くなるので、body だけ clip しても
     文書全体の幅（documentElement.scrollWidth）が残る。
     トップとカテゴリは html にも掛けてあり、そちらは横スクロールが出ていない（実測）。 */
  html:has(body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21)){ overflow-x:clip; }
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content{ margin-top:0 !important; }

/* -----------------------------------------------------------------------------
   2) テーマ帯（ページ上部）
   -------------------------------------------------------------------------- */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero{
  position:relative;
  /* width:100vw は使わない。100vw はスクロールバーの幅を含むので、
     実機(スクロールバーが出る環境)で横に8〜17pxはみ出す。
     負のマージンだけで全幅にすれば、幅は自動で画面ぴったりになる。
     ※ --hide-scrollbars を付けた検証では見えなかった。実測で判明。 */
  margin:0 calc(50% - 50vw) var(--ugpd-gap);
  padding:clamp(2.6rem,6vw,3.6rem) 1.2rem clamp(2.4rem,5.5vw,3.2rem);
  text-align:center;
  background-color:var(--ugpd-navy);
  background-image:
    radial-gradient(70% 80% at 30% 0%, rgba(226,190,95,.14) 0%, rgba(0,0,0,0) 70%),
    radial-gradient(120% 86% at 50% 0%, rgba(200,162,74,.12) 0%, rgba(200,162,74,0) 70%);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero__mark{
  display:block; width:66px; height:66px; margin:0 auto 1.4rem;
  border-radius:50%; border:1px solid rgba(230,200,119,.45);
  background-repeat:no-repeat; background-position:center; background-size:28px 28px;
}
/* 帯のマークはページごと。値は各ページの節で --ugpd-hero-ic に入れる */
body.page-id-475{ --ugpd-hero-ic:var(--ugpd-ic-gift); }
body.page-id-14 { --ugpd-hero-ic:var(--ugpd-ic-book); }
body.page-id-7  { --ugpd-hero-ic:var(--ugpd-ic-signpost); }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero__mark{
  background-image:var(--ugpd-hero-ic);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-eyebrow{
  margin:0 0 1.1em; font-size:.86rem; font-weight:600; letter-spacing:.2em;
  color:var(--ugpd-gold-lt);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero__title{
  font-family:var(--ugpd-serif) !important;
  font-weight:600 !important;
  font-size:clamp(1.55rem,4.6vw,2.35rem) !important;
  line-height:1.55 !important; letter-spacing:.08em !important;
  color:#fff !important;
  background:none !important; border:0 !important; padding:0 !important;
  margin:0 0 .2em !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero__title::after{
  content:""; display:block; width:4.2em; height:1px; margin:1.05em auto .9em;
  background:linear-gradient(90deg,transparent,var(--ugpd-gold) 30%,var(--ugpd-gold-lt) 50%,var(--ugpd-gold) 70%,transparent);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero__lead{
  max-width:34rem; margin:0 auto !important;
  font-size:1.03rem !important; line-height:2.05 !important;
  color:rgba(247,241,224,.9) !important;
}

/* -----------------------------------------------------------------------------
   3) セクションと本文組み
   -------------------------------------------------------------------------- */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section{
  margin:0 0 var(--ugpd-gap);
  background:none !important; border:0 !important; box-shadow:none !important; padding:0 !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section--tint{
  margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important;
  padding:var(--ugpd-gap) 1.2rem !important;
  background:var(--ugpd-tint) !important;
  border-top:1px solid rgba(200,162,74,.22) !important;
  border-bottom:1px solid rgba(200,162,74,.22) !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section > h2{
  font-family:var(--ugpd-serif) !important;
  font-weight:600 !important;
  font-size:clamp(1.34rem,3.2vw,1.72rem) !important;
  line-height:1.6 !important; letter-spacing:.09em !important;
  color:var(--ugpd-navy) !important;
  text-align:center;
  background:none !important; border:0 !important; padding:0 !important;
  margin:0 auto 1.9em !important; max-width:var(--ugpd-wide);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section > h2::after{
  content:"" !important; display:block !important; position:static !important;
  width:4.2em !important; height:1px !important; margin:.85em auto 0 !important;
  background:linear-gradient(90deg,transparent,var(--ugpd-gold) 30%,var(--ugpd-accent) 50%,var(--ugpd-gold) 70%,transparent) !important;
  border:0 !important; transform:none !important; opacity:1 !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section > h3{
  font-family:var(--ugpd-serif) !important;
  font-weight:600 !important; font-size:1.14rem !important;
  line-height:1.7 !important; letter-spacing:.04em !important;
  color:var(--ugpd-navy) !important;
  background:none !important; border:0 !important;
  border-left:2px solid var(--ugpd-gold) !important;
  border-radius:0 !important;
  padding:.1em 0 .1em .8em !important;
  margin:2.4em auto 1em !important;
  max-width:var(--ugpd-measure);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section > p,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section > ul:not(.ugpd-ways):not(.ugpd-cats){
  max-width:var(--ugpd-measure); margin-left:auto; margin-right:auto;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-section > p{
  font-size:1.02rem !important; line-height:2.05 !important;
  color:var(--ugpd-ink-soft); margin-top:0; margin-bottom:1.55em;
  /* 本文は左揃え。中央揃えの長文は行頭が揃わず読みにくい。
     もとのページは .ug-center などで中央寄せが効いていたので明示的に戻す。 */
  text-align:left !important;
}

/* 箇条書き（白いカードに菱形マーカー） */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-list{
  list-style:none !important;
  padding:1.7rem 1.6rem !important;
  margin:0 auto 1.8em !important;
  background:#fff; border:1px solid var(--ugpd-line); border-radius:3px;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-list > li{
  position:relative; padding-left:1.65em; margin:0 0 .85em;
  text-align:left !important;
  font-size:1.01rem; line-height:1.9; color:var(--ugpd-ink-soft); list-style:none !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-list > li:last-child{ margin-bottom:0; }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-list > li::before{
  content:""; position:absolute; left:.15em; top:.72em;
  width:7px; height:7px; transform:rotate(45deg);
  border:1px solid var(--ugpd-accent); background:var(--ugpd-accent-soft);
}

/* -----------------------------------------------------------------------------
   4) 相談方法のカード（キャンペーンの4本＝旧・絵文字ボタン）
   -------------------------------------------------------------------------- */
body.page-id-475 .ugpd-ways{
  /* 本文の測度(38rem)の対象から外す。ここを外し忘れると
     カード4枚が 608px の中に押し込まれ、1行1〜2文字まで潰れる（実測） */
  max-width:none !important;
  display:grid !important;
  grid-template-columns:repeat(2,1fr);
  gap:1.1rem;
  margin:0 calc(50% - 50vw) var(--ugpd-gap);
  padding:0 max(1.2rem, calc(50vw - 31rem));
  list-style:none;
}
body.page-id-475 .ugpd-way{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--ugpd-accent-soft); border-radius:3px;
  padding:2rem 1.5rem 1.6rem; margin:0; text-align:center;
  position:relative;
  transition:border-color .22s ease, box-shadow .22s ease;
}
body.page-id-475 .ugpd-way:hover{
  border-color:var(--ugpd-accent);
  box-shadow:0 6px 22px rgba(22,26,52,.07);
}
body.page-id-475 .ugpd-way::after{
  content:""; position:absolute; top:0; left:14px; right:14px; height:2px;
  background:linear-gradient(90deg,rgba(255,255,255,0),var(--ugpd-accent) 28%,var(--ugpd-accent) 72%,rgba(255,255,255,0));
  pointer-events:none;
}
body.page-id-475 .ugpd-way__icon{
  display:block; width:64px; height:64px; margin:0 auto 1rem;
  border-radius:50%; border:1px solid var(--ugpd-accent);
  background-repeat:no-repeat; background-position:center; background-size:28px 28px;
  box-shadow:0 0 0 5px #fff, 0 0 0 6px var(--ugpd-accent-soft);
}
body.page-id-475 .ugpd-way__icon--app  { background-image:var(--ugpd-ic-app); }
body.page-id-475 .ugpd-way__icon--chat { background-image:var(--ugpd-ic-chat); }
body.page-id-475 .ugpd-way__icon--phone{ background-image:var(--ugpd-ic-phone); }
body.page-id-475 .ugpd-way__icon--heart{ background-image:var(--ugpd-ic-heart); }
body.page-id-475 .ugpd-way__title{
  font-family:var(--ugpd-serif) !important; font-size:1.16rem !important; font-weight:700 !important;
  letter-spacing:.04em !important; color:var(--ugpd-navy) !important;
  background:none !important; border:0 !important; padding:0 !important; margin:0 0 .6em !important;
}
body.page-id-475 .ugpd-way__desc{
  flex:1 1 auto; font-size:.99rem !important; line-height:1.9 !important;
  color:var(--ugpd-ink-soft) !important; margin:0 0 1.3em !important; text-align:left;
}
body.page-id-475 .ugpd-way .ug-btn{ margin-top:auto; }

/* -----------------------------------------------------------------------------
   5) ボタン（角を落とした矩形。金は線）
   -------------------------------------------------------------------------- */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-btn{
  display:inline-flex !important; align-items:center; justify-content:center;
  min-height:52px; width:auto;
  padding:.9em 1.8em !important;
  border-radius:2px !important;
  font-family:var(--ugpd-sans) !important;
  font-size:1rem !important; font-weight:600 !important; letter-spacing:.07em;
  line-height:1.5; text-decoration:none !important;
  background:var(--ugpd-navy) !important; background-image:none !important;
  color:var(--ugpd-paper) !important;
  border:1px solid var(--ugpd-navy) !important;
  box-shadow:none !important; text-shadow:none !important;
  min-width:0 !important;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-btn:hover{
  background:var(--ugpd-navy-deep) !important; border-color:var(--ugpd-navy-deep) !important; color:#fff !important;
}
body.page-id-475 .ugpd-way .ug-btn{ width:100% !important; min-height:48px; font-size:.97rem !important; }
/* 紺地の帯の上では紙色のボタン */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero .ug-btn,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-cta .ug-btn{
  background:var(--ugpd-paper) !important; color:var(--ugpd-navy) !important;
  border-color:var(--ugpd-paper) !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-hero .ug-btn:hover,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-cta .ug-btn:hover{ background:#fff !important; border-color:#fff !important; }
/* LINEはブランドの緑（page-chrome 側の指定と同じ考え方。ここでも明示しておく） */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-btn--line{
  background:#06c755 !important; border-color:#05b34c !important; color:#fff !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-btn--line:hover{ background:#05a94a !important; border-color:#05a94a !important; }

body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-actions{
  display:flex; flex-wrap:wrap; gap:.85rem; justify-content:center;
  margin:0 auto 1.4em; max-width:var(--ugpd-wide);
}

/* -----------------------------------------------------------------------------
   6) CTA帯
   -------------------------------------------------------------------------- */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-cta{
  position:relative;
  margin:0 calc(50% - 50vw) var(--ugpd-gap);
  padding:clamp(2.8rem,6.5vw,3.9rem) 1.4rem;
  text-align:center;
  background-color:var(--ugpd-navy);
  background-image:
    radial-gradient(70% 90% at 30% 0%, rgba(226,190,95,.13) 0%, rgba(0,0,0,0) 70%),
    radial-gradient(120% 100% at 50% 0%, rgba(200,162,74,.14) 0%, rgba(200,162,74,0) 60%);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-cta::before{
  content:""; position:absolute; pointer-events:none;
  inset:clamp(.7rem,1.6vw,1.1rem) clamp(1rem,4vw,3rem);
  border:1px solid rgba(200,162,74,.32);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-cta__title{
  position:relative;
  font-family:var(--ugpd-serif) !important; font-size:clamp(1.34rem,3.2vw,1.78rem) !important;
  font-weight:600 !important; letter-spacing:.07em !important; line-height:1.6 !important;
  color:#fff !important; background:none !important; border:0 !important; padding:0 !important;
  margin:0 0 .7em !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-cta__lead{
  position:relative; font-size:1.01rem !important; line-height:2 !important;
  color:rgba(247,241,224,.88) !important; margin:0 auto 1.9em !important; max-width:34rem !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-cta .ugpd-actions{ position:relative; }

/* -----------------------------------------------------------------------------
   7) PR表記・フッターリンク
   -------------------------------------------------------------------------- */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugpd-pr,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-pr{
  max-width:var(--ugpd-wide) !important;
  margin:var(--ugpd-gap) auto 0 !important;
  background:#fff !important;
  border:1px solid rgba(200,162,74,.3) !important;
  border-radius:3px !important;
  padding:1.1em 1.3em !important;
  color:#5f6577 !important; font-size:.86rem !important; line-height:1.85 !important;
  text-align:left !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-footer-links{
  /* 本体CSSが max-width:720px !important を掛けているので、
     ここを打ち消さないと帯だけ720pxに縮む。
     以前は max-width:100vw で打ち消していたが、100vw を外した際に
     一緒に消えてしまい、フッターだけ狭い状態になっていた（実測で判明）。 */
  width:auto !important;
  max-width:none !important;
  display:flex !important; flex-wrap:wrap !important; justify-content:center !important;
  grid-template-columns:none !important;
  gap:.5em 1.7em !important;
  margin:var(--ugpd-gap) calc(50% - 50vw) 0 !important;
  padding:2.3rem 1.2rem !important;
  border:0 !important; border-top:1px solid rgba(200,162,74,.3) !important;
  border-radius:0 !important;
  background:linear-gradient(172deg, var(--ugpd-navy) 0%, var(--ugpd-navy-deep) 100%) !important;
  text-align:center !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-footer-links::before{ content:none !important; }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-footer-links a{
  display:inline-block !important; padding:.2em 0 !important;
  font-size:.92rem !important; font-weight:500 !important;
  color:rgba(247,241,224,.9) !important; text-decoration:none !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-footer-links a:hover{ color:#fff !important; text-decoration:underline !important; }

/* 目次はカテゴリと同じ扱い（金の細罫の箱・既定は畳む） */
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc{
  display:block !important;
  max-width:var(--ugpd-measure);
  margin:0 auto var(--ugpd-gap) !important;
  padding:1.4rem 1.6rem !important;
  background:#fff !important;
  border:1px solid rgba(200,162,74,.35) !important;
  border-radius:3px !important;
  box-shadow:none !important; width:auto !important; float:none !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-content,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-list,
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-content ol{ display:block !important; text-align:left !important; }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-title{
  display:block !important; text-align:center; cursor:pointer;
  font-family:var(--ugpd-serif) !important; font-size:1.02rem !important;
  font-weight:600 !important; letter-spacing:.08em !important; color:var(--ugpd-navy) !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-title::after{
  content:'[開く]' !important; margin-left:.7em !important;
  font-family:var(--ugpd-sans); font-size:.78em !important; font-weight:400;
  color:var(--ugpd-accent-ink) !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-checkbox:not(:checked) + .toc-title::after{ content:'[閉じる]' !important; }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-checkbox:checked ~ .toc-content{
  visibility:hidden !important; height:0 !important; opacity:0 !important;
  padding-top:0 !important; overflow:hidden !important;
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc .toc-checkbox:not(:checked) ~ .toc-content{
  visibility:visible !important; height:auto !important; opacity:1 !important;
  padding-top:1.1em !important; margin-top:1.1em; border-top:1px solid var(--ugpd-line);
}
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc a{ color:var(--ugpd-ink-soft) !important; text-decoration:none !important; }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc a:hover{ color:var(--ugpd-accent-ink) !important; text-decoration:underline !important; }
body:is(.page-id-475,.page-id-14,.page-id-7,.page-id-99,.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) #toc.toc li::marker{ color:var(--ugpd-accent); }

/* -----------------------------------------------------------------------------
   8) レスポンシブ
   -------------------------------------------------------------------------- */
@media (max-width:768px){
  body.page-id-475 .ugpd-ways{ grid-template-columns:1fr; }
  body.page-id-475 .ugpd-actions .ug-btn,
  body.page-id-14 .ugpd-actions .ug-btn{ width:100%; }
}

/* -----------------------------------------------------------------------------
   9) /worry/（悩みから探す）— 5カテゴリへのカード
   -----------------------------------------------------------------------------
   このページ専用。既存の .ug-worry-* には一切触らない。
   本体CSSの .ug-worry-guide 系はトップ（page-id-6）と共用されているので、
   そちらを書き換えるとトップまで動く。新しいクラスで土俵を分けている。

   差し色は行き先のカテゴリページと同じ値。カード上端の細い罫・
   丸いマークの輪・補足の左罫の3か所だけに使い、面では塗らない。
   -------------------------------------------------------------------------- */
body.page-id-7{
  --ugpd-ic-signpost:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23e6c877%22%20stroke-width=%221.4%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M12%203.2v17.6%22/%3E%3Cpath%20d=%22M12%206.2h6.2l1.9%202.3-1.9%202.3H12z%22/%3E%3Cpath%20d=%22M12%2012.6H5.8L3.9%2014.9l1.9%202.3H12z%22/%3E%3C/svg%3E");
}
body.page-id-7 .ugpd-cat--renai{
  --ugpd-c-accent:#d78ba0; --ugpd-c-ink:#8a2e3e; --ugpd-c-pale:#fbe9ec; --ugpd-c-soft:#edcbd4;
  --ugpd-c-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%238a2e3e%22%20stroke-width=%221.500%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cg%20transform=%22translate(-0.000%20-1.060)%20scale(1.0000)%22%3E%3Cpath%20d=%22M12%2020.2c-1.6-1.2-7.4-5-7.4-10.1a4.2%204.2%200%200%201%207.4-2.7%204.2%204.2%200%200%201%207.4%202.7c0%205.1-5.8%208.9-7.4%2010.1z%22/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-7 .ugpd-cat--fukuen{
  --ugpd-c-accent:#a98be0; --ugpd-c-ink:#4a3a8e; --ugpd-c-pale:#ece6f7; --ugpd-c-soft:#d8cbf1;
  --ugpd-c-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%234a3a8e%22%20stroke-width=%221.541%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cg%20transform=%22translate(0.316%200.316)%20scale(0.9737)%22%3E%3Ccircle%20cx=%229.3%22%20cy=%2212%22%20r=%224.9%22/%3E%3Ccircle%20cx=%2214.7%22%20cy=%2212%22%20r=%224.9%22/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-7 .ugpd-cat--kinun{
  --ugpd-c-accent:#d9b45c; --ugpd-c-ink:#8a6b1b; --ugpd-c-pale:#fff6e0; --ugpd-c-soft:#eeddb6;
  --ugpd-c-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%238a6b1b%22%20stroke-width=%221.642%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cg%20transform=%22translate(1.037%201.037)%20scale(0.9136)%22%3E%3Cellipse%20cx=%2212%22%20cy=%2212%22%20rx=%228.1%22%20ry=%225.1%22/%3E%3Cellipse%20cx=%2212%22%20cy=%2212%22%20rx=%223.4%22%20ry=%221.9%22/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-7 .ugpd-cat--shigoto{
  --ugpd-c-accent:#6f93b8; --ugpd-c-ink:#2a4e73; --ugpd-c-pale:#e4ecf5; --ugpd-c-soft:#becedf;
  --ugpd-c-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%232a4e73%22%20stroke-width=%221.662%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cg%20transform=%22translate(1.171%201.171)%20scale(0.9024)%22%3E%3Cpath%20d=%22M6.6%203.8h7.2l3.6%203.6v12.8H6.6z%22/%3E%3Cpath%20d=%22M13.8%203.8v3.6h3.6%22/%3E%3Cpath%20d=%22M9.4%2012.2h5.2M9.4%2015.4h5.2%22/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-7 .ugpd-cat--ningenkankei{
  --ugpd-c-accent:#7fa06a; --ugpd-c-ink:#3c5c2b; --ugpd-c-pale:#eaf2e4; --ugpd-c-soft:#c5d4bc;
  --ugpd-c-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%233c5c2b%22%20stroke-width=%221.520%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cg%20transform=%22translate(0.160%20-0.284)%20scale(0.9867)%22%3E%3Ccircle%20cx=%229.1%22%20cy=%228.6%22%20r=%222.5%22/%3E%3Cpath%20d=%22M4.5%2018.8c0-2.6%202.1-4.4%204.6-4.4s4.6%201.8%204.6%204.4%22/%3E%3Ccircle%20cx=%2216.3%22%20cy=%229.4%22%20r=%222%22/%3E%3Cpath%20d=%22M15%2014.6c2.2-.2%204.5%201.4%204.5%204.2%22/%3E%3C/g%3E%3C/svg%3E");
}

/* カードの並び。
   5枚を3列で組むと最終行が左に寄って落ち着かないので、6分割の格子に置いて
   1枚あたり2列ぶんを使い、4枚目を2列目から始めることで下段2枚を中央に寄せる。 */
body.page-id-7 .ugpd-cats{
  /* 本文の測度(38rem)の対象から外す。外し忘れるとカードが 608px に押し込まれる。 */
  max-width:none !important;
  display:grid !important;
  grid-template-columns:repeat(6,1fr);
  gap:1.15rem;
  margin:0 calc(50% - 50vw) var(--ugpd-gap);
  padding:0 max(1.2rem, calc(50vw - 31rem));
  list-style:none !important;
}
body.page-id-7 .ugpd-cat{
  grid-column:span 2;
  display:flex; flex-direction:column;
  position:relative; overflow:visible;
  background:#fff;
  border:1px solid var(--ugpd-c-soft);
  border-radius:3px;
  padding:2.1rem 1.5rem 1.6rem;
  margin:0;
  list-style:none !important;
  transition:border-color .22s ease, box-shadow .22s ease;
}
body.page-id-7 .ugpd-cat:nth-child(4){ grid-column:2 / span 2; }
body.page-id-7 .ugpd-cat:hover{
  border-color:var(--ugpd-c-accent);
  box-shadow:0 6px 22px rgba(22,26,52,.07);
}
/* 上端の細い罫。カテゴリの色はここでいちばん強く出る */
body.page-id-7 .ugpd-cat::after{
  content:""; position:absolute; top:0; left:14px; right:14px; height:2px;
  background:linear-gradient(90deg,rgba(255,255,255,0),var(--ugpd-c-accent) 28%,var(--ugpd-c-accent) 72%,rgba(255,255,255,0));
  pointer-events:none;
}
body.page-id-7 .ugpd-cat__icon{
  display:block; width:64px; height:64px; margin:0 auto 1.05rem;
  border-radius:50%;
  border:1px solid var(--ugpd-c-accent);
  background-image:var(--ugpd-c-ic);
  background-repeat:no-repeat; background-position:center; background-size:28px 28px;
  box-shadow:0 0 0 5px #fff, 0 0 0 6px var(--ugpd-c-soft);
}
body.page-id-7 .ugpd-cat__title{
  font-family:var(--ugpd-serif) !important;
  font-size:1.24rem !important; font-weight:700 !important;
  letter-spacing:.09em !important; line-height:1.5 !important;
  color:var(--ugpd-navy) !important; text-align:center !important;
  background:none !important; border:0 !important; padding:0 !important;
  margin:0 0 .55em !important;
}
body.page-id-7 .ugpd-cat__title::after{
  content:"" !important; display:block !important; position:static !important;
  width:2.6em !important; height:1px !important; margin:.7em auto 0 !important;
  background:var(--ugpd-c-accent) !important;
  border:0 !important; transform:none !important; opacity:.75 !important;
}
body.page-id-7 .ugpd-cat__desc{
  font-size:.99rem !important; line-height:1.9 !important;
  color:var(--ugpd-ink-soft) !important;
  margin:0 0 1.05em !important; text-align:left !important;
}
/* 「どんな先生が向くか」の一言。面ではなく左の細罫で色を出す */
body.page-id-7 .ugpd-cat__note{
  flex:1 1 auto;
  font-size:.92rem !important; line-height:1.85 !important;
  color:var(--ugpd-ink-soft) !important;
  background:var(--ugpd-c-pale) !important;
  border-left:2px solid var(--ugpd-c-accent) !important;
  padding:.8em 1em !important;
  margin:0 0 1.3em !important; text-align:left !important;
}
/* ボタンの文字はカードによって12〜15文字と幅がある。
   共通の余白(1.8em)と字間(.07em)のままだと、長いほうの2枚だけ2行になり
   「…先生をみ／る」と間の悪いところで折れる（実測）。
   幅いっぱいに敷くので左右の余白は飾りでしかない。詰めて1行に収める。 */
body.page-id-7 .ugpd-cat .ug-btn{
  width:100% !important; min-height:48px;
  padding-left:.7em !important; padding-right:.7em !important;
  font-size:.93rem !important; letter-spacing:.01em;
  margin-top:auto;
}
body.page-id-7 .ugpd-cat .ug-btn:hover{
  background:var(--ugpd-c-ink) !important;
  border-color:var(--ugpd-c-ink) !important;
}

/* 中くらいの幅では2枚ずつ。5枚目は同じ理屈で中央に寄せる */
@media (max-width:1023px){
  body.page-id-7 .ugpd-cats{ grid-template-columns:repeat(4,1fr); }
  body.page-id-7 .ugpd-cat:nth-child(4){ grid-column:auto / span 2; }
  body.page-id-7 .ugpd-cat:nth-child(5){ grid-column:2 / span 2; }
}
@media (max-width:768px){
  body.page-id-7 .ugpd-cats{ grid-template-columns:1fr; }
  body.page-id-7 .ugpd-cat,
  body.page-id-7 .ugpd-cat:nth-child(4),
  body.page-id-7 .ugpd-cat:nth-child(5){ grid-column:auto; }
}

/* -----------------------------------------------------------------------------
   9.5) /faq/・/service/・/service/vernis/ の帯のマークと、[worry_list] の差し色
   -------------------------------------------------------------------------- */
body.page-id-99{  --ugpd-hero-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23e6c877%22%20stroke-width=%221.4%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M20%2013.2c0%203.4-3.6%206.2-8%206.2-1%200-1.9-.1-2.8-.4L4.6%2020.6l1.2-3.4C4.7%2016.1%204%2014.7%204%2013.2%204%209.8%207.6%207%2012%207s8%202.8%208%206.2z%22/%3E%3Cpath%20d=%22M10.4%2011.6a1.7%201.7%200%200%201%203.2.7c0%201.1-1.6%201.3-1.6%202.3%22/%3E%3Cpath%20d=%22M12%2016.4v.05%22%20stroke-width=%221.6%22/%3E%3C/svg%3E"); }
body.page-id-126{ --ugpd-hero-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23e6c877%22%20stroke-width=%221.4%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20x=%223.4%22%20y=%224.6%22%20width=%2217.2%22%20height=%2214.8%22%20rx=%221.8%22/%3E%3Cpath%20d=%22M3.4%209.4h17.2%22/%3E%3Cpath%20d=%22M8.2%204.6v14.8%22/%3E%3Cpath%20d=%22M11.6%2012.4h6M11.6%2015.6h6%22/%3E%3C/svg%3E"); }
body.page-id-15{  --ugpd-hero-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23e6c877%22%20stroke-width=%221.4%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M6.4%203.8h3.2l1.6%204-2%201.2a11%2011%200%200%200%205.8%205.8l1.2-2%204%201.6v3.2a1.6%201.6%200%200%201-1.7%201.6C10.6%2018.6%205.4%2013.4%204.8%205.5a1.6%201.6%200%200%201%201.6-1.7z%22/%3E%3C/svg%3E"); }

/* [worry_list] の5つ。並び順は 恋愛・復縁・金運・仕事・人間関係 で固定されている */
body.page-id-126 .ugc-worry-btn:nth-child(1){
  --ugpd-w-accent:#d78ba0; --ugpd-w-ink:#8a2e3e; --ugpd-w-soft:#edcbd4;
  --ugpd-w-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%238a2e3e%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M12%2020.2c-1.6-1.2-7.4-5-7.4-10.1a4.2%204.2%200%200%201%207.4-2.7%204.2%204.2%200%200%201%207.4%202.7c0%205.1-5.8%208.9-7.4%2010.1z%22/%3E%3C/svg%3E");
}
body.page-id-126 .ugc-worry-btn:nth-child(2){
  --ugpd-w-accent:#a98be0; --ugpd-w-ink:#4a3a8e; --ugpd-w-soft:#d8cbf1;
  --ugpd-w-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%234a3a8e%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Ccircle%20cx=%229.3%22%20cy=%2212%22%20r=%224.9%22/%3E%3Ccircle%20cx=%2214.7%22%20cy=%2212%22%20r=%224.9%22/%3E%3C/svg%3E");
}
body.page-id-126 .ugc-worry-btn:nth-child(3){
  --ugpd-w-accent:#d9b45c; --ugpd-w-ink:#8a6b1b; --ugpd-w-soft:#eeddb6;
  --ugpd-w-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%238a6b1b%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cellipse%20cx=%2212%22%20cy=%2212%22%20rx=%228.1%22%20ry=%225.1%22/%3E%3Cellipse%20cx=%2212%22%20cy=%2212%22%20rx=%223.4%22%20ry=%221.9%22/%3E%3C/svg%3E");
}
body.page-id-126 .ugc-worry-btn:nth-child(4){
  --ugpd-w-accent:#6f93b8; --ugpd-w-ink:#2a4e73; --ugpd-w-soft:#becedf;
  --ugpd-w-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%232a4e73%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M6.6%203.8h7.2l3.6%203.6v12.8H6.6z%22/%3E%3Cpath%20d=%22M13.8%203.8v3.6h3.6%22/%3E%3Cpath%20d=%22M9.4%2012.2h5.2M9.4%2015.4h5.2%22/%3E%3C/svg%3E");
}
body.page-id-126 .ugc-worry-btn:nth-child(5){
  --ugpd-w-accent:#7fa06a; --ugpd-w-ink:#3c5c2b; --ugpd-w-soft:#c5d4bc;
  --ugpd-w-ic:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%233c5c2b%22%20stroke-width=%221.5%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Ccircle%20cx=%229.1%22%20cy=%228.6%22%20r=%222.5%22/%3E%3Cpath%20d=%22M4.5%2018.8c0-2.6%202.1-4.4%204.6-4.4s4.6%201.8%204.6%204.4%22/%3E%3Ccircle%20cx=%2216.3%22%20cy=%229.4%22%20r=%222%22/%3E%3Cpath%20d=%22M15%2014.6c2.2-.2%204.5%201.4%204.5%204.2%22/%3E%3C/svg%3E");
}

/* パンくず（/service/ と /service/vernis/。[breadcrumb] の出力） */
body:is(.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-breadcrumb{
  max-width:var(--ugpd-wide) !important;
  margin:0 auto .9rem !important; padding:0 1.2rem !important;
  font-size:.84rem !important; line-height:1.8 !important;
  color:var(--ugpd-ink-soft) !important;
  background:none !important; border:0 !important;
}
body:is(.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-breadcrumb a{
  color:var(--ugpd-ink-soft) !important; text-decoration:none !important;
}
body:is(.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-breadcrumb a:hover{
  color:var(--ugpd-accent-ink) !important; text-decoration:underline !important;
}

/* -----------------------------------------------------------------------------
   10) /faq/（よくある質問）— 一問一答
   -----------------------------------------------------------------------------
   白地・細い罫のカードを縦に積む。質問の頭に金の Q、答えの頭に控えめな A。
   丸や面ベタは使わず、文字と細い罫だけで組む。
   -------------------------------------------------------------------------- */
body.page-id-99 .ugpd-qa{
  max-width:var(--ugpd-measure); margin:0 auto;
}
body.page-id-99 .ugpd-qa__item{
  position:relative;
  background:#fff; border:1px solid var(--ugpd-line); border-radius:3px;
  padding:1.5rem 1.6rem 1.35rem;
  margin:0 0 1rem;
}
body.page-id-99 .ugpd-qa__item:last-child{ margin-bottom:0; }
body.page-id-99 .ugpd-qa__item > h3{
  position:relative;
  font-family:var(--ugpd-serif) !important;
  font-size:1.06rem !important; font-weight:600 !important;
  line-height:1.75 !important; letter-spacing:.03em !important;
  color:var(--ugpd-navy) !important;
  background:none !important; border:0 !important; border-radius:0 !important;
  padding:0 0 0 2.1em !important; margin:0 0 .7em !important;
  text-align:left !important;
}
body.page-id-99 .ugpd-qa__item > h3::before{
  content:"Q" !important; display:block !important; position:absolute !important;
  left:0; top:-.06em;
  width:1.5em; height:1.5em; line-height:1.5em; text-align:center;
  font-family:var(--ugpd-serif); font-size:.94em; font-weight:600;
  color:var(--ugpd-accent-ink) !important;
  border:1px solid var(--ugpd-accent-soft); border-radius:2px;
  background:none !important; transform:none !important;
}
body.page-id-99 .ugpd-qa__item > h3::after{ content:none !important; }
body.page-id-99 .ugpd-qa__item > p{
  position:relative;
  padding-left:2.1em !important; margin:0 !important;
  font-size:1.0rem !important; line-height:1.95 !important;
  color:var(--ugpd-ink-soft) !important; text-align:left !important;
}
body.page-id-99 .ugpd-qa__item > p::before{
  content:"A"; position:absolute; left:0; top:.05em;
  width:1.5em; height:1.5em; line-height:1.5em; text-align:center;
  font-family:var(--ugpd-serif); font-size:.94em;
  color:#8b8f9c;
  border:1px solid var(--ugpd-line); border-radius:2px;
}
body.page-id-99 .ugpd-qa__item a{
  color:var(--ugpd-accent-ink) !important; text-decoration:underline !important;
  text-underline-offset:.2em;
}

/* -----------------------------------------------------------------------------
   11) /service/（掲載サービス一覧）
   -------------------------------------------------------------------------- */
body.page-id-126 .ugpd-svc{
  max-width:var(--ugpd-wide); margin:0 auto;
  background:#fff; border:1px solid var(--ugpd-accent-soft); border-radius:3px;
  padding:2rem 1.9rem 1.7rem; position:relative;
}
body.page-id-126 .ugpd-svc::after{
  content:"" !important; display:block !important;
  position:absolute; top:0; left:16px; right:16px; height:2px;
  background:linear-gradient(90deg,rgba(255,255,255,0),var(--ugpd-gold) 28%,var(--ugpd-gold) 72%,rgba(255,255,255,0));
  pointer-events:none;
}
body.page-id-126 .ugpd-svc__head{
  display:flex; align-items:baseline; flex-wrap:wrap; gap:.5rem .9rem;
  padding-bottom:.9rem; margin-bottom:1.2rem;
  border-bottom:1px solid var(--ugpd-line);
}
body.page-id-126 .ugpd-svc__name{
  font-family:var(--ugpd-serif) !important;
  font-size:1.3rem !important; font-weight:700 !important;
  letter-spacing:.06em !important; line-height:1.5 !important;
  color:var(--ugpd-navy) !important;
  background:none !important; border:0 !important; padding:0 !important; margin:0 !important;
}
body.page-id-126 .ugpd-svc__name::after{ content:none !important; }
/* 種別のしるし。面では塗らず、細い罫だけ */
body.page-id-126 .ugpd-svc__tag{
  margin:0 !important; padding:.25em .8em !important;
  font-size:.78rem !important; font-weight:500 !important; letter-spacing:.08em;
  line-height:1.6 !important;
  color:var(--ugpd-accent-ink) !important;
  border:1px solid var(--ugpd-accent-soft) !important; border-radius:2px;
  background:none !important;
}
body.page-id-126 .ugpd-svc__summary{
  font-size:1.0rem !important; line-height:1.95 !important;
  color:var(--ugpd-ink-soft) !important; margin:0 0 1.5em !important; text-align:left !important;
}
body.page-id-126 .ugpd-svc__sub{
  font-family:var(--ugpd-serif) !important;
  font-size:1.02rem !important; font-weight:600 !important; letter-spacing:.05em !important;
  color:var(--ugpd-navy) !important;
  background:none !important; border:0 !important;
  border-left:2px solid var(--ugpd-gold) !important; border-radius:0 !important;
  padding:.1em 0 .1em .7em !important; margin:0 0 .9em !important;
  /* 本体CSSが h4 を中央寄せにしている。左の金の罫だけ左端に残って
     文字が真ん中、という妙な形になるので明示的に戻す（実測） */
  text-align:left !important;
}
body.page-id-126 .ugpd-svc__sub::after{ content:none !important; }
/* カードの中の箇条書き。白いカードの中に白いカードが入って見えるので、
   ここだけ枠と地を外して素の並びにする */
body.page-id-126 .ugpd-svc__list{
  max-width:none !important; margin:0 0 1.6em !important;
  padding:0 !important; background:none !important; border:0 !important;
}
body.page-id-126 .ugpd-svc__actions{ justify-content:flex-start; margin-bottom:0 !important; }
/* 2本目は控えめに（枠線だけの紺） */
body:is(.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-btn--secondary{
  background:transparent !important;
  color:var(--ugpd-navy) !important;
  border:1px solid var(--ugpd-navy) !important;
}
body:is(.page-id-126,.page-id-15,.page-id-17,.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ug-btn--secondary:hover{
  background:var(--ugpd-navy) !important; color:var(--ugpd-paper) !important;
}

/* [worry_list] の出力を作り替える。
   本文はショートコードのままなので、絵文字（♡ ◌ ✦ ◇ ◎）は
   文字を消して、同じ場所に線画SVGを敷いて置き換える。 */
body.page-id-126 .ugc-worry-buttons{
  max-width:var(--ugpd-wide) !important;
  display:grid !important; grid-template-columns:repeat(5,1fr) !important;
  gap:.9rem !important;
  margin:0 auto !important; padding:0 !important;
  list-style:none !important; background:none !important; border:0 !important;
}
body.page-id-126 .ugc-worry-btn{
  margin:0 !important; padding:0 !important; list-style:none !important;
  background:none !important; border:0 !important;
}
body.page-id-126 .ugc-worry-btn > a{
  display:flex !important; flex-direction:column; align-items:center; justify-content:flex-start;
  gap:.7rem; height:100%;
  padding:1.4rem .7rem 1.2rem !important;
  background:#fff !important;
  border:1px solid var(--ugpd-w-soft) !important; border-radius:3px !important;
  box-shadow:none !important; text-decoration:none !important;
  transition:border-color .22s ease, box-shadow .22s ease;
}
body.page-id-126 .ugc-worry-btn > a:hover{
  border-color:var(--ugpd-w-accent) !important;
  box-shadow:0 6px 22px rgba(22,26,52,.07) !important;
}
body.page-id-126 .ugc-worry-btn__icon{
  display:block !important;
  width:46px !important; height:46px !important; margin:0 !important; padding:0 !important;
  /* 絵文字の文字そのものを消す。読み上げは aria-hidden で元から外れている */
  font-size:0 !important; line-height:0 !important; color:transparent !important;
  border-radius:50%; border:1px solid var(--ugpd-w-accent) !important;
  background-color:transparent !important;
  background-image:var(--ugpd-w-ic) !important;
  background-repeat:no-repeat !important; background-position:center !important;
  background-size:21px 21px !important;
}
body.page-id-126 .ugc-worry-btn__label{
  display:block !important;
  font-family:var(--ugpd-serif) !important;
  font-size:.98rem !important; font-weight:600 !important; letter-spacing:.05em !important;
  color:var(--ugpd-navy) !important; background:none !important;
}

/* -----------------------------------------------------------------------------
   12) /service/vernis/（ヴェルニの紹介）— [faq] の出力
   -------------------------------------------------------------------------- */
body.page-id-15 .ugc-faq{
  max-width:var(--ugpd-measure) !important; margin:0 auto !important;
  background:none !important; border:0 !important; padding:0 !important;
}
body.page-id-15 .ugc-faq-item{
  background:#fff !important;
  border:1px solid var(--ugpd-line) !important; border-radius:3px !important;
  margin:0 0 .8rem !important; padding:0 !important;
  box-shadow:none !important;
}
body.page-id-15 .ugc-faq-item > summary{
  position:relative; cursor:pointer; list-style:none;
  padding:1.1rem 2.8rem 1.1rem 1.4rem !important;
  font-family:var(--ugpd-serif) !important;
  font-size:1.02rem !important; font-weight:600 !important;
  line-height:1.75 !important; letter-spacing:.03em !important;
  color:var(--ugpd-navy) !important;
  background:none !important; border:0 !important;
}
body.page-id-15 .ugc-faq-item > summary::-webkit-details-marker{ display:none; }
/* 本体CSSは Q を紺の面ベタで塗っている。面は使わない方針なので細罫に置き換える */
body.page-id-15 .ugc-faq-item > summary::before{
  content:"Q" !important;
  position:absolute !important; left:1.4rem !important; top:1.05rem !important;
  width:1.5em !important; height:1.5em !important; line-height:1.5em !important;
  text-align:center !important;
  font-family:var(--ugpd-serif) !important; font-size:.9em !important; font-weight:600 !important;
  color:var(--ugpd-accent-ink) !important;
  background:none !important;
  border:1px solid var(--ugpd-accent-soft) !important; border-radius:2px !important;
}
body.page-id-15 .ugc-faq-item > summary{ padding-left:4.2rem !important; text-align:left !important; }
body.page-id-15 .ugc-faq-a{ padding-left:4.2rem !important; }
body.page-id-15 .ugc-faq-a::before{
  content:"A" !important;
  position:absolute !important; left:1.4rem !important; top:0 !important;
  width:1.5em !important; height:1.5em !important; line-height:1.5em !important;
  text-align:center !important;
  font-family:var(--ugpd-serif) !important; font-size:.9em !important;
  color:#8b8f9c !important;
  background:none !important;
  border:1px solid var(--ugpd-line) !important; border-radius:2px !important;
}
/* 開閉のしるし。金の細い山形 */
body.page-id-15 .ugc-faq-item > summary::after{
  content:"" !important; display:block !important; position:absolute !important;
  right:1.3rem; top:1.55rem;
  width:8px; height:8px;
  border-right:1px solid var(--ugpd-accent-ink); border-bottom:1px solid var(--ugpd-accent-ink);
  transform:rotate(45deg); transition:transform .2s ease;
  background:none !important;
}
body.page-id-15 .ugc-faq-item[open] > summary::after{ transform:rotate(-135deg); top:1.85rem; }
body.page-id-15 .ugc-faq-a{
  padding:0 1.4rem 1.25rem !important; margin:0 !important;
  font-size:1.0rem !important; line-height:1.95 !important;
  color:var(--ugpd-ink-soft) !important; text-align:left !important;
  background:none !important; border:0 !important;
}
/* wpautop が [faq] のまわりに空の p と br を入れることがある。詰めておく */
body.page-id-15 .ugpd-section > p:empty,
body.page-id-15 .ugpd-section > br{ display:none !important; }

/* -----------------------------------------------------------------------------
   13) 新しい3ページのレスポンシブ
   -------------------------------------------------------------------------- */
@media (max-width:900px){
  body.page-id-126 .ugc-worry-buttons{ grid-template-columns:repeat(3,1fr) !important; }
}
@media (max-width:560px){
  body.page-id-126 .ugc-worry-buttons{ grid-template-columns:repeat(2,1fr) !important; }
  body.page-id-126 .ugpd-svc{ padding:1.7rem 1.2rem 1.4rem; }
  body.page-id-126 .ugpd-svc__actions .ug-btn{ width:100%; }
  body.page-id-99 .ugpd-qa__item{ padding:1.3rem 1.1rem 1.2rem; }
}

/* -----------------------------------------------------------------------------
   14) /about/（運営者情報）
   -----------------------------------------------------------------------------
   帯は置かない。運営者情報は名乗りのページなので、飾りより読みやすさを優先し、
   見出しと表だけを整える。
   -------------------------------------------------------------------------- */
body.page-id-17{ --ugpd-hero-ic:none; }
body.page-id-17 .ugc-page-title{
  font-family:var(--ugpd-serif) !important;
  font-size:clamp(1.5rem,4vw,2.05rem) !important; font-weight:600 !important;
  letter-spacing:.09em !important; line-height:1.55 !important;
  color:var(--ugpd-navy) !important; text-align:center !important;
  background:none !important; border:0 !important; padding:0 !important;
  margin:0 auto .2em !important;
}
body.page-id-17 .ugc-page-title::after{
  content:"" !important; display:block !important; position:static !important;
  width:4.2em !important; height:1px !important; margin:.9em auto 1.2em !important;
  background:linear-gradient(90deg,transparent,var(--ugpd-gold) 30%,var(--ugpd-gold-lt) 50%,var(--ugpd-gold) 70%,transparent) !important;
  border:0 !important; transform:none !important; opacity:1 !important;
}
body.page-id-17 .ugc-lead-simple{
  max-width:var(--ugpd-measure) !important; margin:0 auto var(--ugpd-gap) !important;
  font-size:1.02rem !important; line-height:2.05 !important;
  color:var(--ugpd-ink-soft) !important; text-align:center !important;
  background:none !important; border:0 !important;
}
body.page-id-17 .entry-content > h2{
  font-family:var(--ugpd-serif) !important; font-weight:600 !important;
  font-size:clamp(1.24rem,3vw,1.5rem) !important;
  line-height:1.6 !important; letter-spacing:.08em !important;
  color:var(--ugpd-navy) !important; text-align:center !important;
  background:none !important; border:0 !important; padding:0 !important;
  margin:var(--ugpd-gap) auto 1.6em !important; max-width:var(--ugpd-wide);
}
body.page-id-17 .entry-content > h2::after{
  content:"" !important; display:block !important; position:static !important;
  width:3.4em !important; height:1px !important; margin:.8em auto 0 !important;
  background:linear-gradient(90deg,transparent,var(--ugpd-gold) 40%,var(--ugpd-gold) 60%,transparent) !important;
  border:0 !important; transform:none !important; opacity:1 !important;
}
body.page-id-17 .entry-content > p{
  max-width:var(--ugpd-measure) !important; margin:0 auto 1.5em !important;
  font-size:1.02rem !important; line-height:2.05 !important;
  color:var(--ugpd-ink-soft) !important; text-align:left !important;
}
body.page-id-17 .entry-content > p a,
body.page-id-17 .ugc-profile a{
  color:var(--ugpd-accent-ink) !important; text-decoration:underline !important;
  text-underline-offset:.2em;
}
/* 表。線は細く、見出し列だけ地色をほんの少し変える */
body.page-id-17 .ugc-profile{
  width:100% !important; max-width:var(--ugpd-wide) !important;
  margin:0 auto var(--ugpd-gap) !important;
  border-collapse:collapse !important;
  background:#fff !important;
  border:1px solid var(--ugpd-line) !important; border-radius:3px;
  font-size:.98rem !important; line-height:1.9 !important;
}
body.page-id-17 .ugc-profile th,
body.page-id-17 .ugc-profile td{
  border:0 !important; border-bottom:1px solid var(--ugpd-line) !important;
  padding:.95em 1.1em !important; text-align:left !important; vertical-align:top !important;
}
body.page-id-17 .ugc-profile tr:last-child th,
body.page-id-17 .ugc-profile tr:last-child td{ border-bottom:0 !important; }
body.page-id-17 .ugc-profile th{
  width:13em; white-space:nowrap;
  background:var(--ugpd-tint) !important;
  font-family:var(--ugpd-serif) !important; font-weight:600 !important;
  color:var(--ugpd-navy) !important;
}
body.page-id-17 .ugc-profile td{ color:var(--ugpd-ink-soft) !important; }
/* テーマが行に薄い青の縞を付ける。紙の色に統一する */
body.page-id-17 .ugc-profile tr,
body.page-id-17 .ugc-profile tr:nth-child(even),
body.page-id-17 .ugc-profile tr:nth-child(odd){ background:transparent !important; }
@media (max-width:560px){
  body.page-id-17 .ugc-profile,
  body.page-id-17 .ugc-profile tbody,
  body.page-id-17 .ugc-profile tr{ display:block !important; }
  body.page-id-17 .ugc-profile th,
  body.page-id-17 .ugc-profile td{ display:block !important; width:auto !important; white-space:normal; }
  body.page-id-17 .ugc-profile th{ border-bottom:0 !important; padding-bottom:.2em !important; }
}

/* -----------------------------------------------------------------------------
   15) 法務・お問い合わせの5ページ
   -----------------------------------------------------------------------------
   掲載基準(16) / プライバシーポリシー(18) / 免責事項(19) / 広告・PR表記(20) /
   お問い合わせ(21)。

   このグループは本文に一切手を入れずに整える。素の h1・h2・p・ul しか無いので、
   要素そのものに当てている。帯は置かない。読み物ではなく確認するページなので、
   飾りより行の詰まり方と見出しの見つけやすさを優先する。

   見出しは番号つき（「1. 情報の正確性について」）が多いため、章見出しは
   中央揃えにせず左に置き、金の短い縦罫で段を作る。ページ名だけ中央に置く。
   -------------------------------------------------------------------------- */
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > h1{
  font-family:var(--ugpd-serif) !important;
  font-size:clamp(1.5rem,4vw,2.05rem) !important; font-weight:600 !important;
  letter-spacing:.09em !important; line-height:1.55 !important;
  color:var(--ugpd-navy) !important; text-align:center !important;
  background:none !important; border:0 !important; padding:0 !important;
  margin:0 auto .2em !important;
}
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > h1::after{
  content:"" !important; display:block !important; position:static !important;
  width:4.2em !important; height:1px !important; margin:.9em auto 1.4em !important;
  background:linear-gradient(90deg,transparent,var(--ugpd-gold) 30%,var(--ugpd-gold-lt) 50%,var(--ugpd-gold) 70%,transparent) !important;
  border:0 !important; transform:none !important; opacity:1 !important;
}
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > h2,
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-section > h2{
  font-family:var(--ugpd-serif) !important;
  font-size:clamp(1.12rem,2.6vw,1.3rem) !important; font-weight:600 !important;
  line-height:1.7 !important; letter-spacing:.05em !important;
  color:var(--ugpd-navy) !important;
  background:none !important; border:0 !important;
  border-left:2px solid var(--ugpd-gold) !important; border-radius:0 !important;
  padding:.1em 0 .1em .8em !important;
  margin:2.6em auto 1em !important;
  max-width:var(--ugpd-measure) !important;
  text-align:left !important;
}
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > h2::after,
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-section > h2::after{ content:none !important; }
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > p,
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-section > p{
  max-width:var(--ugpd-measure) !important; margin:0 auto 1.5em !important;
  font-size:1.01rem !important; line-height:2.05 !important;
  color:var(--ugpd-ink-soft) !important; text-align:left !important;
  background:none !important; border:0 !important;
}
/* 冒頭のリードだけ少し大きく、中央に */
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-lead-large{
  max-width:var(--ugpd-measure) !important;
  margin:0 auto var(--ugpd-gap) !important;
  font-size:1.06rem !important; line-height:2.05 !important;
  color:var(--ugpd-ink-soft) !important; text-align:center !important;
  background:none !important; border:0 !important;
}
/* 箇条書きは白いカードに菱形マーカー。ほかのページと同じ扱い */
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > ul,
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-choice-list{
  list-style:none !important;
  max-width:var(--ugpd-measure) !important;
  margin:0 auto 1.8em !important;
  padding:1.6rem !important;
  background:#fff !important; border:1px solid var(--ugpd-line) !important; border-radius:3px !important;
}
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > ul > li,
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-choice-list > li{
  position:relative; list-style:none !important;
  padding-left:1.65em !important; margin:0 0 .85em !important;
  font-size:1rem !important; line-height:1.9 !important;
  color:var(--ugpd-ink-soft) !important; text-align:left !important;
}
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > ul > li:last-child,
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-choice-list > li:last-child{ margin-bottom:0 !important; }
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content > ul > li::before,
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-choice-list > li::before{
  content:"" !important; position:absolute !important; left:.15em; top:.72em;
  width:7px; height:7px; transform:rotate(45deg);
  border:1px solid var(--ugpd-accent) !important; background:var(--ugpd-accent-soft) !important;
}
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .entry-content a{
  color:var(--ugpd-accent-ink) !important; text-decoration:underline !important;
  text-underline-offset:.2em;
}
/* 淡く敷いた段（掲載基準・お問い合わせで使われている） */
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-section--tint{
  margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important;
  padding:var(--ugpd-gap) 1.2rem !important;
  background:var(--ugpd-tint) !important;
  border-top:1px solid rgba(200,162,74,.22) !important;
  border-bottom:1px solid rgba(200,162,74,.22) !important;
  border-radius:0 !important;
}
body:is(.page-id-16,.page-id-18,.page-id-19,.page-id-20,.page-id-21) .ugc-section{ background:none !important; border:0 !important; padding-left:0; padding-right:0; }
/* フォームの中身は左に寄せる。テーマがサイト全体を中央揃えにしているため、
   入力欄は左端から始まるのにラベルだけ中央に出て不揃いになっていた。 */
body.page-id-21 .entry-content form,
body.page-id-21 .entry-content form p,
body.page-id-21 .entry-content form div,
body.page-id-21 .entry-content label{
  text-align:left !important;
}
body.page-id-21 .entry-content label{
  display:block !important;
  max-width:var(--ugpd-measure) !important;
  /* 左端は器に合わせる。margin を auto にすると、器(640px)の中で
     ラベル(608px)だけが中央に寄り、入力欄より16px右にずれる（実測）。
     入力欄は width:100% で左端から始まるので、ラベルも左端に置く。 */
  margin:0 auto .45em 0 !important;
  font-size:.95rem !important; font-weight:600 !important;
  color:var(--ugpd-navy) !important;
}
/* 送信ボタンだけは中央に置く（欄と同じ幅で左に置くと押しにくい） */
body.page-id-21 .entry-content form p:last-of-type,
body.page-id-21 .entry-content .ugc-form-submit{
  text-align:center !important;
}
/* お問い合わせのフォーム。枠と余白だけ整える */
body.page-id-21 .entry-content input[type="text"],
body.page-id-21 .entry-content input[type="email"],
body.page-id-21 .entry-content textarea{
  width:100% !important; max-width:var(--ugpd-measure) !important;
  padding:.7em .9em !important;
  border:1px solid var(--ugpd-line) !important; border-radius:3px !important;
  background:#fff !important; color:var(--ugpd-ink) !important;
  font-family:var(--ugpd-sans) !important; font-size:1rem !important;
}
body.page-id-21 .entry-content input[type="submit"],
body.page-id-21 .entry-content button[type="submit"]{
  display:inline-flex !important; align-items:center; justify-content:center;
  min-height:52px; padding:.9em 1.8em !important;
  border-radius:2px !important; border:1px solid var(--ugpd-navy) !important;
  background:var(--ugpd-navy) !important; color:var(--ugpd-paper) !important;
  font-family:var(--ugpd-sans) !important; font-size:1rem !important; font-weight:600 !important;
  letter-spacing:.07em; box-shadow:none !important; text-shadow:none !important;
  cursor:pointer;
}
body.page-id-21 .entry-content input[type="submit"]:hover,
body.page-id-21 .entry-content button[type="submit"]:hover{
  background:var(--ugpd-navy-deep) !important; border-color:var(--ugpd-navy-deep) !important;
}
