/* =====================================================================
   ももな先生の肌育教室 — main.css  v2「誌面」
   参考: 30〜40代女性誌（美ST・BAILA・VERY・LEE）の組み方。N1＝30〜40代の肌育に詳しい女性。
   ・箱で区切らない。区切りは「細い罫線・大きな番号・リーダー罫・角カギ・斜線の見出し・余白」
   ・左端の色線つき角丸カード、白カード＋影の量産は使わない（tasks/lessons.md）
   ・書体は役割で分ける: 大見出し=明朝／小見出し・ラベル・説明=太ゴシック／数字・欧文=イタリック
   ・色: ベース（生成り）＋本文の濃色＋ローズ（ブランド・CTA）＋青緑（編集の一語＝チェック・下線・マーカー）
   動き: 本文は動かさない。下線・マーカー・帯・ピン・チェックだけ、画面に入ったとき1回（reduced-motion では止める）
   ===================================================================== */

/* ---------- tokens ---------- */
:root{
	--paper:#FAF7F2; --paper-2:#F2ECE4; --paper-3:#EDE5DA; --white:#fff;
	--ink:#2A2527; --ink-soft:#625759; --ink-faint:#8E8285;
	--rose:#B0596B; --rose-deep:#8E4356; --blush:#EECDD2; --blush-soft:#F6E6E8;
	--mint:#5FA49A; --mint-ink:#2E6D65; --mint-soft:#D9EEE9;
	--line:#E2D8CE; --line-2:#CFC2B6; --rule:#2A2527;
	--serif:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;
	--sans:system-ui,-apple-system,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic UI","Meiryo",sans-serif;
	--latin:"Cormorant Garamond","Times New Roman",serif;
	--r:4px;
	--ease:cubic-bezier(.2,.7,.2,1);
	--gutter:clamp(16px,4vw,32px);
	--head-h:64px;
	--t:var(--rose); --t-ink:var(--rose-deep); --t-soft:var(--blush-soft);
}
[data-t="pinklla"]{--t:#B0596B;--t-ink:#8E4356;--t-soft:#F6E6E8}
[data-t="rejuran"]{--t:#D08A70;--t-ink:#94523A;--t-soft:#FAEDE7}
[data-t="juvelook"]{--t:#B89A62;--t-ink:#735A2B;--t-soft:#F5EFE3}
[data-t="sunekos"]{--t:#8C6F8E;--t-ink:#664968;--t-soft:#F1EAF1}
[data-t="skinbotox"]{--t:#6F8A6A;--t-ink:#4A6346;--t-soft:#EAF0E8}
[data-t="basics"]{--t:#5FA49A;--t-ink:#2E6D65;--t-soft:#E3F1EE}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--head-h) + 56px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.95;letter-spacing:.02em;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
p,h1,h2,h3,h4,figure,dl,dd,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
button{font:inherit;color:inherit}
em{font-style:normal}
.i{width:18px;height:18px;flex:none}
:focus-visible{outline:2px solid var(--rose-deep);outline-offset:3px;border-radius:2px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:8px;background:var(--ink);color:#fff;padding:8px 16px;z-index:100}
.skip:focus{left:16px}
.wrap{max-width:1120px;margin:0 auto;padding:0 var(--gutter)}
.wrap.is-narrow{max-width:800px}
h1,h2,.serif{font-family:var(--serif);font-weight:600;font-feature-settings:"palt";letter-spacing:.04em;text-wrap:balance;word-break:auto-phrase}
h3{font-feature-settings:"palt";text-wrap:balance;word-break:auto-phrase}
[lang="en"]{font-family:var(--latin);font-style:italic;letter-spacing:.04em}

/* 共通の誌面パーツ: ［角括弧ラベル］ */
.kicker{display:inline-flex;align-items:center;gap:.15em;font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--t-ink)}
.kicker::before{content:"［"}
.kicker::after{content:"］"}

/* ---------- buttons ---------- */
.juno-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 28px;border-radius:2px;font-size:15px;font-weight:700;letter-spacing:.06em;transition:transform .2s var(--ease),background-color .2s,border-color .2s,color .2s;-webkit-tap-highlight-color:transparent}
.juno-btn .i{width:16px;height:16px;transition:transform .2s var(--ease)}
.juno-btn:hover .i{transform:translateX(3px)}
.juno-btn:active{transform:scale(.98)}
.juno-btn.is-primary{background:var(--rose-deep);color:#fff}
.juno-btn.is-primary:hover{background:#7A3749}
.juno-btn.is-ghost{background:transparent;border:1px solid var(--ink);color:var(--ink)}
.juno-btn.is-ghost:hover{background:var(--ink);color:#fff}
.juno-btn.is-block{display:flex;width:100%}
.text-link{display:inline-flex;align-items:center;gap:6px;color:var(--ink);font-weight:700;font-size:14px;border-bottom:1px solid currentColor;padding-bottom:2px}
.text-link:hover{color:var(--rose-deep)}
.text-link .i{width:15px;height:15px}

/* ---------- header ---------- */
.admin-bar .site-head{top:32px}
@media (max-width:782px){.admin-bar .site-head{top:46px}}
@media (max-width:600px){.admin-bar .site-head{top:0}}
.site-head{position:sticky;top:0;z-index:40;background:rgba(250,247,242,.9);-webkit-backdrop-filter:saturate(1.3) blur(12px);backdrop-filter:saturate(1.3) blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
.site-head.is-scrolled{border-color:var(--line)}
.site-head__inner{max-width:1120px;margin:0 auto;padding:0 var(--gutter);height:var(--head-h);display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;line-height:1.2}
.brand__logo{height:30px;width:auto;flex:none}
.brand__name{font-family:var(--serif);font-weight:600;font-size:19px;letter-spacing:.08em}
.brand__name em{color:var(--rose-deep)}
.gnav{display:flex;align-items:center;gap:26px;font-size:13.5px;font-weight:600;letter-spacing:.06em}
.gnav a{color:var(--ink-soft);position:relative;padding:6px 0;transition:color .2s}
.gnav a:not(.gnav__cta)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.gnav a:hover{color:var(--ink)}
.gnav a:hover::after{transform:scaleX(1)}
.gnav .gnav__cta{background:var(--rose-deep);color:#fff;padding:9px 18px;border-radius:2px}
.gnav .gnav__cta:hover{background:#7A3749;color:#fff}
.menu-btn{display:none;align-items:center;gap:8px;background:transparent;border:0;padding:10px 0 10px 10px;font-size:12.5px;font-weight:700;letter-spacing:.12em;cursor:pointer}
/* 読了バー: CSSのスクロール連動だけ（非対応ブラウザでは出さない） */
.progress{display:none;position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none}
.progress span{display:block;height:100%;background:var(--mint);transform-origin:left;transform:scaleX(0)}
@supports (animation-timeline:scroll()){
	.progress{display:block}
	.progress span{animation:progress linear both;animation-timeline:scroll(root)}
}
@keyframes progress{to{transform:scaleX(1)}}
.chapter{display:none}

/* ---------- sheet ---------- */
.sheet{border:0;padding:0;margin:auto auto 0;width:100%;max-width:560px;max-height:86dvh;background:var(--paper);border-radius:18px 18px 0 0;box-shadow:0 -20px 60px rgba(0,0,0,.18);color:var(--ink)}
.sheet::backdrop{background:rgba(42,37,39,.38)}
.sheet__inner{padding:16px 20px calc(24px + env(safe-area-inset-bottom));display:grid;gap:12px}
.sheet__head{display:flex;align-items:center;justify-content:space-between}
.sheet__title{font-family:var(--serif);font-weight:600;letter-spacing:.1em}
.sheet__close{background:transparent;border:1px solid var(--line-2);border-radius:50%;width:40px;height:40px;display:grid;place-items:center;cursor:pointer}
.sheet__nav li a{display:flex;align-items:center;justify-content:space-between;padding:14px 2px;border-bottom:1px solid var(--line);font-weight:600}
.sheet__nav .i{width:16px}
.sheet__toc{border-block:1px solid var(--rule);padding:10px 0}
.sheet__toc p{font-size:12px;font-weight:700;color:var(--ink-soft);letter-spacing:.14em;margin-bottom:2px}
.sheet__toc a{display:flex;gap:12px;padding:9px 0;font-size:14.5px;line-height:1.6;border-bottom:1px dotted var(--line-2)}
.sheet__toc li:last-child a{border:0}
.sheet__toc a span{color:var(--ink-faint);min-width:1.6em}
.sheet__toc a[aria-current="true"]{font-weight:700}
.sheet__toc a[aria-current="true"] span{color:var(--mint-ink)}
@media (prefers-reduced-motion:no-preference){
	.sheet[open]{animation:sheet-up .32s var(--ease)}
	.sheet[open]::backdrop{animation:fade .32s ease}
}
@keyframes sheet-up{from{transform:translateY(40px);opacity:0}}
@keyframes fade{from{opacity:0}}

/* ---------- sections ---------- */
.sec{padding:clamp(64px,9vw,112px) 0}
.sec--tint{background:var(--paper-2)}
.sec-head{text-align:center;margin-bottom:clamp(32px,5vw,52px)}
.sec-head.is-left{text-align:left}
.sec-head__latin{font-family:var(--latin);font-style:italic;font-size:17px;color:var(--ink-soft);letter-spacing:.06em;margin-bottom:6px}
.sec-head h2{font-size:clamp(25px,3.6vw,36px);line-height:1.45}
.sec-head h2 em,.hero__title em{color:var(--rose-deep)}
.sec-head p:not(.sec-head__latin){color:var(--ink-soft);font-size:14.5px;margin-top:14px}
.empty{color:var(--ink-soft);border-block:1px solid var(--line-2);padding:28px 0;text-align:center}

/* ---------- hero（誌面の特集扉） ---------- */
.hero{max-width:1180px;margin:0 auto;padding:clamp(28px,5vw,64px) var(--gutter) 0}
.hero__card{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:.15em;font-weight:700;font-size:13.5px;letter-spacing:.1em;color:var(--mint-ink);margin-bottom:20px}
.eyebrow::before{content:"［"}
.eyebrow::after{content:"］"}
.hero__title .nb{display:inline-block}
.hero__title{font-size:clamp(28px,4vw,46px);line-height:1.5;letter-spacing:.05em;margin-bottom:26px}
.hero__accent{position:relative;display:inline-block;color:var(--rose-deep)}
.hero__swash{position:absolute;left:6%;right:4%;bottom:-.06em;width:90%;height:.34em;overflow:visible;fill:none;stroke:var(--mint);stroke-width:3;stroke-linecap:round}
.hero__lead{color:var(--ink-soft);font-size:15.5px;max-width:31em;margin-bottom:34px}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px}
.hero__visual{position:relative;justify-self:center;width:min(380px,100%);padding-right:76px}
.hero__vertical{position:absolute;right:0;top:12%;writing-mode:vertical-rl;font-family:var(--serif);font-weight:600;font-size:14.5px;letter-spacing:.2em;line-height:2;color:var(--ink);padding-top:28px}
.hero__vertical::before{content:"";position:absolute;top:0;right:50%;width:1px;height:20px;background:var(--ink)}
.arch{display:block;aspect-ratio:3/4;overflow:hidden;background:var(--paper-3);position:relative;z-index:1}
.arch img{width:100%;height:100%;object-fit:cover}
.hero__name{position:relative;z-index:1;margin-top:14px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;line-height:1.4;border-top:1px solid var(--rule);padding-top:10px}
.hero__name b{font-family:var(--serif);font-size:17px;letter-spacing:.14em}
.hero__name small{font-size:12px;color:var(--ink-soft)}
.hero__name small[lang]{font-size:13px}
.hero__facts{display:flex;flex-wrap:wrap;margin-top:clamp(36px,5vw,56px);border-block:1px solid var(--rule)}
.hero__facts li{flex:1 1 220px;display:flex;align-items:center;gap:10px;padding:14px 18px;font-size:13.5px;font-weight:700;letter-spacing:.04em}
.hero__facts li+li{border-left:1px solid var(--line-2)}
.hero__facts .i{color:var(--mint-ink);width:18px}

/* ---------- map（目次型） ---------- */
.map{display:grid;grid-template-columns:repeat(4,1fr);gap:0 28px;border-top:1px solid var(--rule)}
.map__item{position:relative;display:grid;grid-template-columns:52px 1fr;grid-template-rows:auto 1fr;column-gap:14px;padding:24px 0 26px;border-bottom:1px solid var(--line-2)}
.map__num{grid-row:span 2;font-size:44px;line-height:.9;color:var(--mint)}
.map__title{font-weight:700;font-size:17px;letter-spacing:.04em;align-self:end}
.map__desc{font-size:13.5px;color:var(--ink-soft);line-height:1.8;margin-top:4px;padding-right:18px}
.map__item .i{position:absolute;right:0;top:30px;width:16px;color:var(--ink-faint);transition:transform .3s var(--ease),color .2s}
.map__item:hover .map__title{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:5px}
.map__item:hover .i{transform:translateX(4px);color:var(--ink)}

/* ---------- swipe ---------- */
.swipe{position:relative}
.swipe__track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,290px);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);padding:4px max(var(--gutter),calc((100vw - 1120px)/2 + var(--gutter))) 22px;scrollbar-width:none;overscroll-behavior-x:contain}
.swipe__track::-webkit-scrollbar{display:none}
.swipe__track>li{scroll-snap-align:start}
.swipe__track .card{height:100%}
.swipe__bar{max-width:1120px;margin:2px auto 0;padding:0 var(--gutter)}
.swipe__bar::before{content:"";display:block;height:1px;background:var(--line-2)}
.swipe__bar span{display:block;height:2px;margin-top:-1.5px;background:var(--ink);width:var(--w,30%);transform:translateX(var(--x,0));transition:transform .15s linear}
/* 施術タイル（色見本のようなタイル） */
.tcard{display:flex;flex-direction:column;gap:10px;height:100%;min-height:300px;padding:22px 22px 20px;background:var(--paper);border-top:1px solid var(--ink);position:relative;transition:transform .3s var(--ease)}
.tcard:hover{transform:translateY(-3px)}
.tcard:active{transform:scale(.985)}
.tcard__latin{font-size:30px;line-height:1;color:var(--t-ink)}
.tcard__name{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:.06em;padding-bottom:10px;border-bottom:1px solid var(--line-2)}
.tcard__desc{font-size:13.5px;color:var(--ink-soft);line-height:1.8;flex:1}
.tcard__more{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--ink)}
.tcard__more .i{width:15px}

/* ---------- article cards（枠なし。写真＋ラベル＋明朝タイトル） ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 28px}
.card{display:flex;flex-direction:column;gap:14px}
.card__thumb{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--paper-2)}
.card__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.card:hover .card__thumb img{transform:scale(1.03)}
.card__art{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;height:100%;padding:16px 18px;background:var(--paper-2);text-align:center}
.card__art b{font-family:var(--serif);font-weight:500;font-size:clamp(22px,2.4vw,26px);letter-spacing:.16em;color:var(--ink);line-height:1.3}
.card__art i{font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--t-ink);opacity:.75;line-height:1}
.card__body{display:flex;flex-direction:column;gap:6px}
.card__cat{font-weight:700;font-size:12.5px;letter-spacing:.06em;color:var(--t-ink)}
.card__cat::before{content:"［"}
.card__cat::after{content:"］"}
.card__title{font-family:var(--serif);font-weight:600;font-size:17px;line-height:1.65;letter-spacing:.03em}
.card:hover .card__title{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:5px}
.card__meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--ink-soft);padding-top:8px;border-top:1px solid var(--line)}

/* ---------- feature（特集見開き） ---------- */
.feature{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,48px);align-items:center}
.feature__visual{display:block;aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;background:var(--t-soft)}
.feature__visual img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.feature__body{display:flex;flex-direction:column;gap:16px}
.feature__title{font-family:var(--serif);font-weight:600;font-size:clamp(21px,2.6vw,27px);line-height:1.6}
.feature:hover .feature__title{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:6px}
.feature__excerpt{font-size:14.5px;color:var(--ink-soft)}
.feature__by{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-soft);padding-top:14px;border-top:1px solid var(--line-2)}
.feature__by img{width:36px;height:36px;border-radius:50%}
.feature__by b{color:var(--ink)}

/* ---------- doctor ---------- */
.doctor{background:var(--white);padding:clamp(56px,8vw,104px) 0}
.doctor.is-profile{padding-top:24px}
.doctor__inner{max-width:1000px;margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:300px 1fr;gap:clamp(32px,6vw,72px);align-items:center}
.doctor__name{font-size:clamp(28px,3.6vw,36px);letter-spacing:.12em;margin-top:4px}
.doctor__name small{display:block;font-family:var(--latin);font-style:italic;font-size:15px;color:var(--ink-soft);font-weight:400;margin-top:2px;letter-spacing:.08em}
.doctor__title{font-size:13.5px;font-weight:700;color:var(--ink-soft);margin:8px 0 18px}
.doctor__lead{font-family:var(--serif);font-size:16.5px;line-height:2;margin-bottom:22px}
.doctor__career{border-top:1px solid var(--rule);margin-bottom:22px}
.doctor__career div{display:grid;grid-template-columns:6.5em 1fr;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.doctor__career dt{font-weight:700;color:var(--ink-soft);white-space:nowrap}

/* ---------- promise（3段の誌面コラム） ---------- */
.promise{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--rule)}
.promise li{padding:28px clamp(16px,2.6vw,32px) 30px;display:flex;flex-direction:column;gap:8px}
.promise li+li{border-left:1px solid var(--line-2)}
.promise__num{font-size:38px;line-height:1;color:var(--mint)}
.promise b{font-family:var(--serif);font-size:19px;letter-spacing:.06em}
.promise span:not(.promise__num){font-size:14px;color:var(--ink-soft);line-height:1.9}

/* ---------- footer ---------- */
.site-foot{background:#2A2527;color:#CFC5C8;font-size:13.5px;padding:56px 0 calc(40px + env(safe-area-inset-bottom));margin-top:clamp(56px,8vw,96px)}
.site-foot__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px;margin-bottom:36px}
.site-foot__logo{height:44px;width:auto;margin-bottom:14px}
.site-foot__brand{font-family:var(--serif);font-weight:600;color:#fff;font-size:19px;letter-spacing:.1em;margin-bottom:10px}
.site-foot__h{color:#fff;font-weight:700;letter-spacing:.12em;margin-bottom:10px}
.site-foot li{margin-bottom:6px}
.site-foot a:hover{color:#fff}
.site-foot__note{border-top:1px solid #4A4245;padding-top:20px;font-size:12.5px;line-height:1.95;color:#B2A7AA}
.site-foot__copy{margin-top:14px;font-size:13px;color:#91868A}

/* ---------- dock（下部固定CTA） ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;gap:10px;padding:7px var(--gutter) calc(7px + env(safe-area-inset-bottom));background:rgba(250,247,242,.96);color:var(--ink);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--rule);transform:translateY(110%);transition:transform .35s var(--ease)}
.dock.is-on{transform:none}
.dock__text{flex:1;font-size:13px;font-weight:700;line-height:1.35}
.dock__text small{display:block;font-weight:400;color:var(--ink-soft);font-size:11.5px}
.dock__btn{background:var(--rose-deep);color:#fff;font-weight:700;font-size:14px;letter-spacing:.06em;padding:10px 20px;border-radius:2px;white-space:nowrap}
.dock__line{height:42px;padding:0 12px;border-radius:2px;display:grid;place-items:center;border:1px solid var(--ink);color:var(--ink);font-family:var(--sans);font-style:normal;font-size:12.5px;font-weight:700;letter-spacing:.08em}

/* =====================================================================
   記事
   ===================================================================== */
.article__head{padding-top:18px}
.crumbs ol{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:12.5px;color:var(--ink-soft);margin-bottom:26px}
.crumbs li:not(:last-child)::after{content:"/";margin-left:8px;opacity:.5}
.crumbs a:hover{color:var(--ink)}
.crumbs li[aria-current]{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;max-width:24em}
.article .kicker{margin-bottom:12px}
.article__title{font-size:clamp(25px,3.7vw,36px);line-height:1.58;letter-spacing:.03em;margin-bottom:24px}
.verify{display:grid;grid-template-columns:44px 1fr;gap:4px 14px;align-items:center;padding:14px 0;border-block:1px solid var(--rule)}
.verify__face{grid-row:span 2}
.verify__face img{width:44px;height:44px;border-radius:50%}
.verify__who{font-size:14px;line-height:1.6}
.verify__who a{font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:4px}
.verify__who span{display:block;font-size:12.5px;color:var(--ink-soft)}
.verify__dates{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:12.5px;color:var(--ink-soft);line-height:1.6}
.pr-note{margin:16px 0 0;font-size:12.5px;line-height:1.85;color:var(--ink-soft)}
.pr-note b{color:var(--ink)}
.article__eyecatch{margin-top:26px;border-radius:var(--r);overflow:hidden;aspect-ratio:16/9;background:var(--t-soft)}
.article__eyecatch img{width:100%;height:100%;object-fit:cover}
.article__layout{max-width:1120px;margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:minmax(0,1fr);justify-items:center}
.article__body{width:100%;max-width:680px;padding-top:30px}
.rail{display:none}

/* ---------- entry typography ---------- */
.entry{counter-reset:h2;overflow-wrap:anywhere}
.entry>*+*{margin-top:1.5em}
.entry p{line-height:2}
.entry h2{counter-increment:h2;position:relative;font-size:clamp(23px,3vw,28px);line-height:1.55;margin-top:3.4em;padding:0 0 16px;border-bottom:1px solid var(--rule)}
.entry h2::before{content:"Chapter " counter(h2,decimal-leading-zero);display:block;font-family:var(--latin);font-style:italic;font-weight:500;font-size:16px;letter-spacing:.06em;color:var(--mint-ink);margin-bottom:4px}
.entry h2::after{content:"";position:absolute;left:0;bottom:-2px;width:56px;height:3px;background:var(--mint);transform-origin:left}
.entry h3{display:flex;gap:10px;align-items:baseline;font-weight:700;font-size:clamp(17.5px,2.2vw,19px);line-height:1.65;letter-spacing:.03em;margin-top:2.6em}
.entry h3::before{content:"";flex:none;width:18px;height:2px;background:var(--t);transform:translateY(-.32em)}
.entry h2+*,.entry h3+*{margin-top:1em}
.entry a:not([class]){color:var(--ink);text-decoration:underline;text-decoration-color:var(--mint);text-underline-offset:4px;text-decoration-thickness:2px}
.entry a:not([class]):hover{color:var(--mint-ink)}
.entry strong{font-weight:700}
.entry mark{color:inherit;background:none;text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:1.5px;text-underline-offset:5px}
.entry ul:not([class]),.entry ol:not([class]){padding-left:1.4em}
.entry ul:not([class]){list-style:disc}
.entry ol:not([class]){list-style:decimal}
.entry li::marker{color:var(--t)}
.entry li+li{margin-top:.4em}
.entry figure img{border-radius:var(--r)}
.entry figcaption,.entry .wp-element-caption{font-size:12.5px;color:var(--ink-soft);margin-top:8px;line-height:1.7}
.entry blockquote{padding:4px 0 4px 18px;color:var(--ink-soft);font-family:var(--serif);border:0;position:relative}
.entry blockquote::before{content:"“";position:absolute;left:-4px;top:-14px;font-family:var(--latin);font-size:44px;color:var(--mint)}
.entry hr{border:0;height:1px;background:var(--line-2);margin:3em 0}
.entry .wp-block-footnotes{font-size:13px;color:var(--ink-soft);border-top:1px solid var(--line-2);padding-top:16px;padding-left:1.6em;list-style:decimal}
.entry sup a{color:var(--mint-ink);text-decoration:none;font-weight:700;padding:0 2px}

/* 目次（本文内）— 誌面の CONTENTS */
.juno-toc{margin-top:2.6em;border-block:1px solid var(--rule);padding:18px 0 8px}
.juno-toc__head{display:flex;align-items:baseline;gap:12px;font-weight:700;font-size:13.5px;letter-spacing:.1em;margin-bottom:6px}
.juno-toc__head span{font-size:22px;color:var(--ink);letter-spacing:.04em;font-weight:500}
.entry .juno-toc ol{counter-reset:toc;list-style:none;padding:0}
.juno-toc li+li{margin-top:0}
.juno-toc li{counter-increment:toc}
.entry .juno-toc a{display:flex;gap:14px;padding:9px 0;border-bottom:1px dotted var(--line-2);font-size:15px;line-height:1.6;text-decoration:none;color:var(--ink)}
.juno-toc li:last-child a{border:0}
.juno-toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--latin);font-style:italic;font-size:17px;color:var(--mint-ink);min-width:1.6em;line-height:1.4}
.juno-toc a:hover{text-decoration:underline;text-decoration-color:var(--mint);text-underline-offset:4px}
.juno-toc.is-folded li:nth-child(n+6){display:none}
.juno-toc.is-folded li:nth-child(5) a{border:0}
.juno-toc__more{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:6px;padding:12px 0;background:transparent;border:0;border-top:1px solid var(--line-2);font-size:13.5px;font-weight:700;letter-spacing:.06em;color:var(--ink);cursor:pointer}
.juno-toc__more::after{content:"";width:9px;height:9px;border:solid var(--ink);border-width:0 1.5px 1.5px 0;transform:translateY(-2px) rotate(45deg)}
.juno-toc__more[aria-expanded="true"]::after{transform:translateY(2px) rotate(-135deg)}

/* 表（普通の表はスマホで横スクロール） */
.wp-block-table{margin-inline:0;overflow-x:auto}
.wp-block-table table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.7}
.wp-block-table th,.wp-block-table td{border:0;border-bottom:1px solid var(--line-2);padding:12px 14px;text-align:left;vertical-align:top}
.wp-block-table thead th{border-bottom:1.5px solid var(--rule);font-weight:700;font-size:13.5px}
/* 比較表 */
.is-style-juno-compare{position:relative;border-top:1.5px solid var(--rule);-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.is-style-juno-compare table{font-variant-numeric:tabular-nums}
.is-style-juno-compare table:has(thead th:nth-child(4)){min-width:680px}
.is-style-juno-compare table:not(:has(thead th:nth-child(4))) tr>*:first-child{width:7.5em;position:static;box-shadow:none}
.is-style-juno-compare td+td,.is-style-juno-compare th+th{border-left:1px solid var(--line)}
.is-style-juno-compare tr>*:first-child{position:sticky;left:0;z-index:1;background:var(--paper);font-weight:700;font-size:13px;color:var(--ink-soft);min-width:7em;box-shadow:8px 0 10px -10px rgba(0,0,0,.35)}
.is-style-juno-compare thead th{white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent;font-family:var(--serif);font-weight:600;font-size:14.5px}
.is-style-juno-compare table:has(thead th:nth-child(4)) thead th:not(:first-child)::after{content:"＋";margin-left:6px;font-family:var(--sans);font-size:11px;color:var(--ink-faint)}
.is-style-juno-compare .is-hl{background:var(--mint-soft)}
.is-style-juno-compare thead th.is-hl{background:var(--mint-ink);color:#fff}
.is-style-juno-compare thead th.is-hl::after{content:"✓";color:#fff}
.is-style-juno-compare figcaption{position:sticky;left:0;padding:10px 0;margin:0}
.juno-compare-hint{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-soft);margin:-.8em 0 0}

/* FAQ（details）— Q/A を罫線で区切る */
.wp-block-details{border-bottom:1px solid var(--line-2);padding:0}
h2+.wp-block-details{border-top:1px solid var(--rule)}
.wp-block-details+.wp-block-details{margin-top:0}
.wp-block-details summary{list-style:none;cursor:pointer;display:flex;gap:14px;align-items:baseline;padding:18px 40px 18px 0;font-weight:700;line-height:1.7;position:relative}
.wp-block-details summary::-webkit-details-marker{display:none}
.wp-block-details summary::before{content:"Q";font-family:var(--latin);font-style:italic;font-weight:500;font-size:24px;color:var(--mint-ink);line-height:1;min-width:.9em}
.wp-block-details summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;margin-top:-6px;background:linear-gradient(var(--ink),var(--ink)) center/12px 1.5px no-repeat,linear-gradient(var(--ink),var(--ink)) center/1.5px 12px no-repeat;transition:transform .25s var(--ease)}
.wp-block-details[open] summary::after{transform:rotate(135deg)}
.wp-block-details>:not(summary){position:relative;padding:0 0 0 36px;margin-top:0;color:var(--ink-soft);font-size:15px}
.wp-block-details>p:first-of-type::before{content:"A";position:absolute;left:2px;top:-2px;font-family:var(--latin);font-style:italic;font-size:24px;color:var(--rose)}
.wp-block-details>:last-child{padding-bottom:22px}
:root{interpolate-size:allow-keywords}
@media (prefers-reduced-motion:no-preference){
	.wp-block-details::details-content{height:0;overflow:clip;transition:height .3s var(--ease),content-visibility .3s allow-discrete}
	.wp-block-details[open]::details-content{height:auto}
}

/* グループのスタイル */
.is-style-juno-feature{position:relative;background:var(--t-soft);border-radius:var(--r);padding:clamp(26px,4.5vw,44px) clamp(20px,4vw,40px);overflow:hidden}
.is-style-juno-feature::before{content:"PinkLLA";position:absolute;right:-6px;top:-18px;font-family:var(--latin);font-style:italic;font-size:clamp(56px,10vw,96px);color:color-mix(in srgb,var(--t) 16%,transparent);pointer-events:none;line-height:1}
.is-style-juno-feature>*{position:relative}
.is-style-juno-feature>*+*{margin-top:1.2em}
.is-style-juno-note{background:var(--paper-2);padding:20px 24px;font-size:15px;border-radius:var(--r)}
.is-style-juno-steps{counter-reset:st;border-top:1px solid var(--rule)}
.is-style-juno-steps li{counter-increment:st;position:relative;padding:16px 0 16px 56px;border-bottom:1px solid var(--line-2)}
.is-style-juno-steps li+li{margin-top:0}
.is-style-juno-steps li::before{content:counter(st,decimal-leading-zero);position:absolute;left:0;top:10px;font-family:var(--latin);font-style:italic;font-size:30px;color:var(--mint)}

/* ---------- 専用ブロック ---------- */
.juno-warn{background:#FFF4E5;border:1px dashed #C77700;color:#6E4300;font-size:13px;padding:8px 12px;margin:8px 0}

/* 結論ボックス — 誌面の「まとめ」。二重罫と角括弧ラベル */
.juno-quick{margin-top:2.2em;border-top:3px double var(--rule);border-bottom:1px solid var(--rule);padding:18px 0 20px}
.juno-quick__label{display:inline-flex;font-weight:700;font-size:13.5px;letter-spacing:.1em;color:var(--rose-deep);margin-bottom:6px}
.juno-quick__label::before{content:"［"}
.juno-quick__label::after{content:"］"}
.juno-quick__head{font-family:var(--serif);font-weight:600;font-size:clamp(19px,2.4vw,22px);line-height:1.6;margin-bottom:10px}
.juno-quick__body ul{display:grid;gap:6px}
.juno-quick__body li{position:relative;padding-left:30px;line-height:1.8}
.juno-quick__body li::before{content:"";position:absolute;left:2px;top:.42em;width:18px;height:14px;background:var(--mint);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M2 10c2.5 1.8 4.4 3.9 6 6.4C11.6 9 16 4.4 22.5 1.5' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M2 10c2.5 1.8 4.4 3.9 6 6.4C11.6 9 16 4.4 22.5 1.5' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain}
.juno-quick__body strong,.juno-quick__body b{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:1.5px;text-underline-offset:5px}

/* 医師の所見 — 角カギ「 」で囲むコメント */
.juno-note{display:grid;grid-template-columns:52px 1fr;gap:14px 18px;align-items:start;padding:6px 0}
.juno-note__face img{width:52px;height:52px;border-radius:50%}
.juno-note__body{position:relative;padding:14px 22px 16px}
.juno-note__body::before,.juno-note__body::after{content:"";position:absolute;width:16px;height:16px;border:0 solid var(--mint)}
.juno-note__body::before{left:0;top:0;border-width:2px 0 0 2px}
.juno-note__body::after{right:0;bottom:0;border-width:0 2px 2px 0}
.juno-note__label{font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-bottom:4px}
.juno-note__label span{display:block;color:var(--mint-ink);font-size:16px;font-weight:500}
.juno-note__body>*+*{margin-top:.8em}
.juno-note__body p{font-size:15.5px;line-height:2}

/* 開示ブロック — 治療データ表（常に開いた状態） */
.juno-disclosure{background:var(--paper-2);border-radius:var(--r);padding:22px clamp(18px,3vw,28px);font-size:14px;line-height:1.85}
.juno-disclosure__head{font-weight:700;letter-spacing:.04em;padding-bottom:10px;border-bottom:1.5px solid var(--rule);margin-bottom:6px}
.juno-disclosure__item+.juno-disclosure__item{margin-top:14px;padding-top:14px;border-top:1px solid var(--line-2)}
.juno-disclosure__name{display:flex;align-items:center;gap:8px;font-family:var(--serif);font-weight:600;font-size:16px;color:var(--t-ink);margin:8px 0 4px}
.juno-disclosure__name span{width:9px;height:9px;border-radius:50%;background:var(--t)}
.juno-disclosure__memo{font-size:13px;color:var(--ink-soft)}
.juno-disclosure dl>div{display:grid;grid-template-columns:8.5em 1fr;gap:12px;padding:7px 0;border-bottom:1px dotted var(--line-2)}
.juno-disclosure dt{color:var(--ink-soft);font-size:13px;font-weight:700}
.juno-disclosure__ua{margin-top:12px;padding-top:10px;border-top:1px solid var(--line-2)}
.juno-disclosure__ua-head{font-weight:700;font-size:13.5px;margin-bottom:2px}
.juno-disclosure__ua dl>div{grid-template-columns:11em 1fr}
.juno-disclosure__foot{margin-top:12px;font-size:12.5px;color:var(--ink-soft)}

/* 数値カード — 大きな数字を縦罫で区切る */
.juno-stats{border-block:1px solid var(--rule);padding:14px 0 12px}
.juno-stats__name{font-weight:700;font-size:13.5px;color:var(--t-ink);margin-bottom:4px}
.juno-stats ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.juno-stats li{padding:8px 18px 6px 0;display:flex;flex-direction:column}
.juno-stats li+li{padding-left:18px;border-left:1px solid var(--line-2)}
.juno-stats__label{font-size:12.5px;font-weight:700;color:var(--ink-soft)}
.juno-stats__num{font-family:var(--serif);font-weight:600;color:var(--ink);line-height:1.15}
.juno-stats__num b{font-family:var(--latin);font-style:italic;font-size:56px;font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:0;color:var(--t-ink)}
.juno-stats__num small{font-size:15px;margin-left:4px}
.juno-stats__note{font-size:12.5px;color:var(--ink-soft)}
.juno-stats__src{font-size:12px;color:var(--ink-soft);margin-top:8px}
.juno-stats__src a{text-decoration:underline}

/* タイムライン */
.juno-timeline{border-block:1px solid var(--rule);padding:16px 0 10px}
.juno-timeline__axis{position:relative;height:22px;margin:0 0 4px 7em;border-bottom:1px solid var(--line-2);font-size:12.5px;font-weight:700;color:var(--ink-faint)}
.juno-timeline__axis span{position:absolute;left:var(--x);bottom:4px;transform:translateX(-50%);white-space:nowrap}
.juno-timeline__axis span:first-child{transform:none}
.juno-timeline__axis span:last-child{transform:translateX(-100%)}
.juno-timeline__row{display:grid;grid-template-columns:7em 1fr;align-items:start;padding:12px 0;border-bottom:1px dotted var(--line-2)}
.juno-timeline__row:last-of-type{border:0}
.juno-timeline__name{font-family:var(--serif);font-weight:600;font-size:14.5px;color:var(--t-ink);padding-top:2px}
.juno-timeline__track{position:relative;display:grid;gap:8px}
.juno-timeline__seg{position:relative;padding-top:14px}
.juno-timeline__bar{position:absolute;top:0;left:var(--from);width:calc(var(--to) - var(--from));min-width:8px;height:8px;border-radius:8px;background:var(--t);transform-origin:left}
.juno-timeline__seg.is-dt .juno-timeline__bar{background:repeating-linear-gradient(135deg,var(--t) 0 4px,color-mix(in srgb,var(--t) 40%,#fff) 4px 8px)}
.juno-timeline__label{display:block;margin-left:min(var(--from),55%);font-size:13px;line-height:1.55}
.juno-timeline__label small{color:var(--ink-soft);font-size:12.5px}
.juno-timeline figcaption{font-size:12px;color:var(--ink-soft);margin-top:8px}

/* 肌の層 */
.juno-layers__stack{border-block:1px solid var(--rule)}
.juno-layers__layer+.juno-layers__layer{border-top:1px solid rgba(42,37,39,.08)}
.juno-layers__layer{position:relative;display:grid;grid-template-columns:7.5em 1fr;gap:4px 14px;align-items:center;padding:14px 18px}
.juno-layers__layer.is-epidermis{background:#F6F2EE;min-height:56px}
.juno-layers__layer.is-dermis-upper{background:#EFE9E4;min-height:72px}
.juno-layers__layer.is-dermis{background:#E8E0DA;min-height:104px}
.juno-layers__layer.is-subcutis{background:#E2D9D3;min-height:64px}
.juno-layers__name{font-family:var(--serif);font-weight:600;font-size:15px}
.juno-layers__desc{font-size:12.5px;color:var(--ink-soft);line-height:1.6}
.juno-layers__pins{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:2px 0}
.juno-layers__pin{display:inline-flex;align-items:center;color:var(--ink);font-size:13px;font-weight:700;letter-spacing:.04em}
.juno-layers__pin+.juno-layers__pin::before{content:"／";margin:0 .4em;color:var(--ink-faint);font-weight:400}
.juno-layers figcaption{font-size:12px;color:var(--ink-soft);margin-top:8px}

/* 悩み別の選び方 — 誌面の「診断」: 番号・問い・リーダー罫・「答え」 */
.juno-chooser{border-top:1.5px solid var(--rule)}
.juno-chooser li{display:grid;grid-template-columns:2.6em auto minmax(24px,1fr) auto;align-items:baseline;gap:12px;padding:16px 0;border-bottom:1px solid var(--line-2)}
.juno-chooser__num{font-size:24px;line-height:1;color:var(--mint)}
.juno-chooser__q{font-weight:700;font-size:15.5px;line-height:1.6;text-wrap:pretty}
.juno-chooser__lead{align-self:center;height:0;border-bottom:2px dotted var(--line-2);transform-origin:left}
.juno-chooser__a{font-family:var(--serif);font-weight:600;font-size:17px;color:var(--t-ink);white-space:nowrap}
.juno-chooser__a::before{content:"「"}
.juno-chooser__a::after{content:"」"}

/* チェックリスト — ／見出し＼＋手描きのチェック */
.juno-check{padding:4px 0}
.juno-check__title{font-weight:700;font-size:15.5px;margin-bottom:10px}
.juno-check__title span::before{content:"［"}
.juno-check__title span::after{content:"］"}
.juno-check ul{border-top:1px solid var(--line-2)}
.juno-check li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;line-height:1.75;border-bottom:1px solid var(--line-2);font-weight:600}
.juno-check__mark{flex:none;width:24px;height:24px;margin-top:2px;color:var(--mint)}
.juno-check__mark svg{width:24px;height:24px}
.juno-check__mark path{stroke-dasharray:1;stroke-dashoffset:0}
.juno-check.is-unfit li{font-weight:400;color:var(--ink-soft)}
.juno-check.is-unfit .juno-check__mark{color:var(--ink-faint);width:20px;height:20px;margin-top:5px}
.juno-check.is-unfit .juno-check__mark svg{width:20px;height:20px}

/* CTA */
.juno-cta{text-align:center;padding:clamp(40px,6vw,64px) 0;margin-top:3em;position:relative;color:var(--ink);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.juno-cta__head{font-family:var(--serif);font-weight:600;font-size:clamp(20px,2.7vw,25px);letter-spacing:.06em;line-height:1.6}
.juno-cta__text{font-size:14.5px;color:var(--ink-soft);margin:12px auto 24px;max-width:34em}
.juno-cta__actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
.juno-cta__tel{font-size:12.5px;color:var(--ink-soft);margin-top:14px}
.juno-cta__tel a{text-decoration:underline}
/* 記事中の控えめCTA — 罫線で挟む */
.juno-cta.is-inline{padding:22px 0 24px}
.juno-cta__kicker{font-size:13px;font-weight:700;color:var(--mint-ink);margin-bottom:6px}
.juno-cta__kicker span::before{content:"［"}
.juno-cta__kicker span::after{content:"］"}
.juno-cta.is-inline .juno-cta__text{margin:8px auto 18px;color:var(--ink-soft)}

/* 更新履歴 */
.juno-history{border-top:1px solid var(--line-2);padding-top:12px;font-size:13.5px;color:var(--ink-soft)}
.juno-history summary{cursor:pointer;font-weight:700;list-style:none;display:flex;align-items:center;gap:8px}
.juno-history summary::-webkit-details-marker{display:none}
.juno-history summary::after{content:"＋";font-weight:400;color:var(--ink-faint)}
.juno-history[open] summary::after{content:"－"}
.juno-history li{display:grid;grid-template-columns:7em 1fr;gap:12px;padding:6px 0}

/* 著者 */
.author{display:grid;grid-template-columns:112px 1fr;gap:24px;align-items:start;border-block:1px solid var(--rule);padding:24px 0;margin-top:3.6em}
.author__photo{width:112px;height:112px;border-radius:50%;object-fit:cover;object-position:center 18%}
.author__label{font-size:12.5px;font-weight:700;color:var(--mint-ink);letter-spacing:.06em}
.author__name{font-family:var(--serif);font-weight:600;font-size:21px;letter-spacing:.12em}
.author__name small{display:inline-block;white-space:nowrap;font-family:var(--latin);font-style:italic;font-size:14px;color:var(--ink-soft);margin-left:10px;font-weight:400}
.author__title{font-size:13px;color:var(--ink-soft)}
.author__text{font-size:13.5px;color:var(--ink-soft);margin:8px 0 10px;line-height:1.85}

/* 一覧・固定ページ */
.archive{padding-top:18px}
.archive__head{margin-bottom:40px;padding-bottom:20px;border-bottom:1px solid var(--rule)}
.archive__head h1{font-size:clamp(27px,3.6vw,36px)}
.archive__desc{color:var(--ink-soft);margin-top:10px}
.page{padding-top:18px}
.page__title{font-size:clamp(26px,3.6vw,34px);margin-bottom:28px;padding-bottom:16px;border-bottom:1px solid var(--rule)}
.notfound{text-align:center;padding-block:64px}
.notfound .page__title{border:0}
.nav-links{display:flex;justify-content:center;gap:8px;margin-top:48px}
.page-numbers{min-width:42px;height:42px;display:grid;place-items:center;border-bottom:1px solid transparent;padding:0 12px;font-family:var(--latin);font-style:italic;font-size:18px}
.page-numbers.current{border-color:var(--ink)}

/* =====================================================================
   PC: 目次レール
   ===================================================================== */
@media (min-width:1180px){
	.article__layout{grid-template-columns:220px minmax(0,680px);justify-content:center;gap:56px;align-items:start}
	.rail{display:block;position:sticky;top:calc(var(--head-h) + 28px);padding-top:36px;max-height:calc(100vh - var(--head-h) - 40px);overflow:auto}
	.rail__head{font-size:20px;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--rule)}
	.rail__list a{display:flex;gap:10px;padding:8px 0;border-bottom:1px dotted var(--line-2);font-size:13px;line-height:1.6;color:var(--ink-soft);transition:color .2s}
	.rail__list a span{color:var(--ink-faint);font-size:14px}
	.rail__list a:hover{color:var(--ink)}
	.rail__list a[aria-current="true"]{color:var(--ink);font-weight:700}
	.rail__list a[aria-current="true"] span{color:var(--mint-ink)}
	.article__body .juno-toc{display:none}
}

/* =====================================================================
   タブレット・スマホ
   ===================================================================== */
@media (max-width:1199px){
	.map{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
	.cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
	:root{--head-h:54px}
	.gnav{display:none}
	.menu-btn{display:inline-flex}
	.brand__name{font-size:17px}
	.brand{flex-direction:column;align-items:flex-start;gap:3px}
	.brand__logo{height:20px}
	.hero__card{grid-template-columns:1fr}
	.hero__visual{width:min(320px,100%);padding-right:60px;margin-top:8px}
	.hero__vertical{font-size:13px}
	.hero__facts li{flex-basis:100%}
	.hero__facts li+li{border-left:0;border-top:1px solid var(--line-2)}
	.feature{grid-template-columns:1fr}
	.doctor__inner{grid-template-columns:1fr}
	.doctor__photo{max-width:240px;margin:0 auto}
	.promise{grid-template-columns:1fr}
	.promise li+li{border-left:0;border-top:1px solid var(--line-2)}
	.site-foot__grid{grid-template-columns:1fr;gap:28px}
	.chapter:not([hidden]){display:flex;align-items:center;gap:10px;width:100%;height:40px;padding:0 var(--gutter);background:rgba(250,247,242,.96);border:0;border-top:1px solid var(--line);font-size:13px;text-align:left;cursor:pointer}
	.chapter__num{font-family:var(--latin);font-style:italic;color:var(--mint-ink);font-size:16px}
	.chapter__title{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}
	.chapter .i{color:var(--ink-soft);width:16px}
	html{scroll-padding-top:calc(var(--head-h) + 52px)}
}
@media (max-width:640px){
	.cards{grid-template-columns:1fr;gap:32px}
	.map{grid-template-columns:1fr}
	.hero{padding-top:20px}
	.hero__actions .juno-btn{flex:1 1 100%}
	.juno-chooser li{grid-template-columns:2.2em 1fr;row-gap:2px}
	.juno-chooser__lead{display:none}
	.juno-chooser__a{grid-column:2;justify-self:end;white-space:normal;text-align:right}
	.juno-disclosure{padding:18px 16px}
	.juno-disclosure dl>div,.juno-disclosure__ua dl>div{grid-template-columns:1fr;gap:0}
	.juno-timeline__axis{margin-left:0}
	.juno-timeline__row{grid-template-columns:1fr;gap:6px}
	.juno-layers__layer{grid-template-columns:1fr}
	.juno-stats__num b{font-size:46px}
	.author{grid-template-columns:84px 1fr;gap:16px}
	.author__photo{width:84px;height:84px}
	.juno-note{grid-template-columns:40px 1fr;gap:10px}
	.juno-note__face img{width:40px;height:40px}
	.juno-note__body{padding:12px 14px 14px}
	.dock__text small{display:none}
}
@media (min-width:861px){
	.entry{font-size:17px}
	.dock{left:auto;right:24px;bottom:24px;width:400px;padding:10px 10px 10px 18px;border:1px solid var(--rule);box-shadow:0 10px 30px rgba(42,37,39,.12)}
}

/* =====================================================================
   動き（JS が html.io を付けた時だけ・画面に入った時に1回）
   ===================================================================== */
@media (prefers-reduced-motion:no-preference){
	.hero__swash path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw .9s .45s var(--ease) forwards}
	.io .entry h2::after{transform:scaleX(0);transition:transform .8s var(--ease)}
	.io .entry h2.is-in::after{transform:scaleX(1)}
	.io .qa-key{filter:blur(3px);opacity:.5;transition:filter .6s .15s var(--ease),opacity .6s .15s var(--ease)}
	.io .juno-quick.is-in .qa-key{filter:none;opacity:1}
	.io .juno-timeline__bar{transform:scaleX(0);transition:transform .8s calc(var(--i) * .12s + .1s) var(--ease)}
	.io .juno-timeline.is-in .juno-timeline__bar{transform:none}
	.io .juno-layers__pin{opacity:0;transform:translateY(-6px);transition:opacity .45s,transform .45s var(--ease);transition-delay:calc(var(--i) * .08s + .15s)}
	.io .juno-layers.is-in .juno-layers__pin{opacity:1;transform:none}
	.io .juno-layers.is-in .is-dermis-upper .juno-layers__pin{transition-delay:calc(var(--i) * .08s + .45s)}
	.io .juno-layers.is-in .is-dermis .juno-layers__pin{transition-delay:calc(var(--i) * .08s + .75s)}
	.io .juno-check__mark path{stroke-dashoffset:1;transition:stroke-dashoffset .45s calc(var(--i) * .22s + .3s) var(--ease)}
	.io .juno-check.is-in .juno-check__mark path{stroke-dashoffset:0}
	.io .juno-chooser__lead{transform:scaleX(0);transition:transform .6s calc(var(--i) * .1s + .1s) var(--ease)}
	.io .juno-chooser.is-in .juno-chooser__lead{transform:none}
	@view-transition{navigation:auto}
	::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}
}
@keyframes draw{to{stroke-dashoffset:0}}

@media print{
	.site-head,.dock,.sheet,.rail,.juno-cta,.related{display:none!important}
}