/* v046(10/12 本人「最後まで読ませる工夫、次々読ませる工夫をやりきって！ワクワク感情大事に！」「ディテールのワクワクさにこだわって」)
   Fable r1(qa/fable_r1/reply.md)の上位案: 分身が集まる帯・あなた専用の特典・心の声のつなぎ・帯の出し方・FAQ を開く・空白を出さない */

/* ---- 文節でくっつける(言葉の途中で折れない) ---- */
.v46-ph{display:inline-block}

/* ---- 作品の壁: 3段目(本棚)・壁の下の一文と一時停止ボタン ---- */
.tile.book img{width:calc(var(--fvw,390px) * .2);aspect-ratio:2/3;object-fit:cover;border-radius:6px 10px 10px 6px;background:#f6e9ee;box-shadow:0 8px 20px rgba(42,35,38,.14),inset 3px 0 0 #0000;border-left:3px solid #e9cfd8}
#wall .lane{padding-bottom:4px}
.v46-wallfoot{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;margin:8px 16px 0}
.v46-wallfoot .ww26-cap{margin:0!important}
.v46-wallfoot .vp-wall{position:relative!important;inset:auto!important;flex:none;margin:0!important;width:44px!important;height:44px!important;opacity:.9}

/* ---- 受講生インタビューの動画の見出し(文節でくっつける・狭い幅は一段小さく) ---- */
#real-3 .r19-vid figcaption strong{display:block;font-size:clamp(13.5px,calc((100vw - 74px) / 22.6),15.5px);line-height:1.55;letter-spacing:0;word-break:keep-all}

/* ---- 心の声のつなぎ(考えごとの吹き出し・次の見出しがその答え) ---- */
.v46-think{display:flex;flex-direction:column;align-items:center;gap:4px;margin:0 16px;padding:26px 0 8px;text-align:center}
.v46-think-d{display:flex;align-items:flex-end;gap:7px;height:24px;transform:translateX(-46px)}
.v46-think-d i{display:block;border-radius:50%;background:#fff;box-shadow:0 0 0 2px #d9b7c5}
.v46-think-d i:nth-child(1){width:7px;height:7px}
.v46-think-d i:nth-child(2){width:10px;height:10px;margin-bottom:5px}
.v46-think-d i:nth-child(3){width:14px;height:14px;margin-bottom:12px}
.v46-think-b{position:relative;margin:0;padding:14px 22px 15px;border-radius:30px 30px 30px 30px/26px 26px 26px 26px;background:#fff;box-shadow:0 0 0 2px #e6cbd6,0 10px 24px #b3486e1c;font-family:"Zen Maru Gothic",var(--sans);font-weight:700;font-size:17px;line-height:1.55;color:#6a4b5c;letter-spacing:.04em}
.v46-think:not(.v45-in) .v46-think-d i,.v46-think:not(.v45-in) .v46-think-b{opacity:0}
.v46-think.v45-in .v46-think-d i{animation:v46pop .35s cubic-bezier(.2,.9,.3,1.3) calc(.1s + var(--k,0)*.22s) both}
.v46-think.v45-in .v46-think-d i:nth-child(1){--k:0}.v46-think.v45-in .v46-think-d i:nth-child(2){--k:1}.v46-think.v45-in .v46-think-d i:nth-child(3){--k:2}
.v46-think.v45-in .v46-think-b{animation:v46bub .5s cubic-bezier(.2,.9,.3,1.25) .8s both}
@keyframes v46pop{0%{opacity:0;transform:scale(.3)}100%{opacity:1;transform:scale(1)}}
@keyframes v46bub{0%{opacity:0;transform:translateY(8px) scale(.82)}100%{opacity:1;transform:none}}
@media (min-width:600px){.v46-think-b{font-size:19px}}

/* ---- 特典: 絵(箱まで)と「あなた専用」の部品 ---- */
#gift{background:#fef9fa}
.v46-giftart img{-webkit-mask-image:linear-gradient(#000 92%,#0000);mask-image:linear-gradient(#000 92%,#0000)}
.v46-mine{position:relative;margin:-6px 16px 0;padding:6px 0 10px;text-align:center}
.v46-mine-k{position:relative;display:inline-block;margin:0 0 12px;padding:9px 26px 10px;border-radius:999px;background:linear-gradient(135deg,#ff7aa2,#e0466f);color:#fff;font-family:"Zen Maru Gothic",var(--sans);font-weight:700;font-size:20px;letter-spacing:.14em;box-shadow:0 6px 0 #c13a60,0 14px 26px #e0466f40;transform:rotate(-4deg)}
.v46-mine-sp{position:absolute;width:14px;height:14px;background:#ffd76a;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.v46-mine-sp.a{left:-20px;top:-6px}.v46-mine-sp.b{right:-18px;bottom:-4px;width:10px;height:10px}
.v46-mine:not(.v45-in) .v46-mine-k{opacity:0}
.v46-mine.v45-in .v46-mine-k{animation:v46stamp .42s cubic-bezier(.2,.9,.3,1.4) .1s both}
@keyframes v46stamp{0%{opacity:0;transform:scale(1.9) rotate(-12deg)}70%{opacity:1}100%{opacity:1;transform:scale(1) rotate(-4deg)}}
.v46-mine-t{margin:0 0 14px;font-family:"Zen Maru Gothic",var(--sans);font-weight:700;font-size:clamp(19px,5.6vw,25px);line-height:1.6;color:#3F2A2E;letter-spacing:.03em}
.v46-mine-t em{font-style:normal;color:#D9506F;background:linear-gradient(transparent 62%,#ffd3df 62%)}
/* 窓: タイトルの「りかこ」に線が引かれ「あなた」が打ち込まれ、フォルダが1つずつ現れる */
.v46-ws{position:relative;max-width:360px;margin:0 auto;border-radius:16px;background:#fff;box-shadow:0 0 0 1.5px #f1d3de,0 18px 40px #b3486e24;text-align:left;overflow:hidden}
.v46-ws-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:linear-gradient(180deg,#fff5f8,#fde9ef);border-bottom:1px solid #f3d6e0}
.v46-ws-bar>i{display:block;width:10px;height:10px;border-radius:50%;background:#f7a6bc}
.v46-ws-bar>i:nth-child(2){background:#ffd27a}.v46-ws-bar>i:nth-child(3){background:#9bd8a8}
.v46-ws-name{margin-left:8px;font-size:15px;font-weight:700;color:#5a3f4c;white-space:nowrap}
.v46-ws-old{position:relative;color:#9b8590}
.v46-ws-old::after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:2px;border-radius:2px;background:#e0466f;transform:scaleX(0);transform-origin:left center;transition:transform .4s ease-out}
.v46-ws.strike .v46-ws-old::after{transform:scaleX(1)}
.v46-ws-you{color:#D9506F;margin-left:4px}
.v46-ws-cur{display:inline-block;width:2px;height:1em;margin:0 3px 0 1px;vertical-align:-.12em;background:#D9506F;opacity:0}
.v46-ws.typing .v46-ws-cur{animation:v46blink .5s steps(1) infinite}
.v46-ws.typed .v46-ws-cur{animation:none;opacity:0}
@keyframes v46blink{0%{opacity:1}50%{opacity:0}}
.v46-ws-list{list-style:none;margin:0;padding:10px 12px 14px}
.v46-ws-list li{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;font-size:16px;color:#3F2A2E}
.v46-ws-list li+li{margin-top:6px}
.v46-ws-list li:nth-child(1){background:#fff1f5}.v46-ws-list li:nth-child(2){background:#fff7e8}.v46-ws-list li:nth-child(3){background:#eef5ff}
.v46-ws-ic{flex:none;font-size:20px;line-height:1}
.v46-ws-ok{margin-left:auto;flex:none;width:22px;height:22px;border-radius:50%;background:#2E9E5B;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12'/%3E%3C/svg%3E");position:relative}
.v46-ws-ok::after{content:"";position:absolute;left:7px;top:5px;width:6px;height:10px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.v46-ws:not(.typed) .v46-ws-list li{opacity:0;transform:translateY(10px)}
.v46-ws.typed .v46-ws-list li{animation:v46row .4s cubic-bezier(.2,.9,.3,1.2) calc(.05s + var(--k)*.2s) both}
.v46-ws.typed .v46-ws-ok{animation:v46pop .3s cubic-bezier(.2,.9,.3,1.4) calc(.3s + var(--k)*.2s) both}
@keyframes v46row{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
.v46-ws-bow{position:absolute;right:-6px;top:-6px;width:58px;height:58px;pointer-events:none}
.v46-hand{display:flex;align-items:center;justify-content:center;gap:10px;margin:18px auto 0}
.v46-hand img{flex:none;width:58px;height:58px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #fff,0 0 0 5px #f3b7c8}
.v46-hand-b{position:relative;margin:0;padding:11px 16px 12px;border-radius:18px;background:linear-gradient(135deg,#ff8fb0,#e0466f);color:#fff;font-weight:700;font-size:16px;line-height:1.5;text-align:left;box-shadow:0 8px 18px #e0466f33}
.v46-hand-b::before{content:"";position:absolute;left:-9px;top:50%;margin-top:-8px;border-style:solid;border-width:8px 12px 8px 0;border-color:transparent #f0688f transparent transparent}
.v46-hand-b small{display:block;margin-top:1px;font-size:12px;font-weight:500;opacity:.9}
.v46-ws:not(.typed) ~ .v46-hand{opacity:0}
.v46-ws.typed ~ .v46-hand{animation:v46bub .5s cubic-bezier(.2,.9,.3,1.25) .75s both}
.v46-mine-n{margin:14px 0 0}
.v46-mine-n span{display:inline-block;padding:7px 16px;border-radius:999px;background:#fff;box-shadow:0 0 0 1.5px #b9dcc5;color:#24704a;font-weight:700;font-size:14.5px}
.v46-mine-n span::before{content:"✓ "}
.v46-ws:not(.typed) ~ .v46-mine-n{opacity:0}
.v46-ws.typed ~ .v46-mine-n{animation:v46row .45s ease-out 1.05s both}
@media (prefers-reduced-motion:reduce){.v46-mine *,.v46-think *,.v46-ws *,.v46-mine-k{animation:none!important;opacity:1!important;transform:none!important}.v46-mine-k{transform:rotate(-4deg)!important}.v46-ws-old::after{transform:scaleX(1)!important}}
@media (min-width:600px){.v46-ws-list li{font-size:17px}.v46-hand-b{font-size:17px}}

/* ---- 下の追従の帯: 分身が集まる輪+2段のボタン ---- */
#sticky.v46-sticky{display:block;padding:8px 10px calc(8px + env(safe-area-inset-bottom));transition:transform .35s cubic-bezier(.2,.9,.3,1),opacity .25s}
#sticky.v46-sticky[hidden]{display:block!important;transform:translateY(110%);opacity:0;pointer-events:none;visibility:hidden}
.v46-st{display:flex;align-items:center;gap:9px}
.v46-crew{position:relative;display:flex;flex:none;margin:0;padding:0 2px 0 0;list-style:none}
.v46-crew li{position:relative;width:28px;height:28px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px #fff,0 0 0 3.5px #f3c3d2;overflow:hidden}
.v46-crew li+li{margin-left:-9px}
.v46-crew li img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1) opacity(.28)}
.v46-crew li.on img{filter:none}
.v46-crew li.on{box-shadow:0 0 0 2px #fff,0 0 0 3.5px #e0466f}
.v46-crew li.pop{animation:v46join .45s cubic-bezier(.2,.9,.3,1.5) both;z-index:2}
@keyframes v46join{0%{transform:scale(.6)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
.v46-crew.full::after{content:"";position:absolute;inset:-10px -8px;background:radial-gradient(circle,#ffe58a 0 2px,#0000 3px) 0 0/14px 14px;animation:v46spark .8s ease-out both;pointer-events:none}
@keyframes v46spark{0%{opacity:0;transform:scale(.6)}40%{opacity:1}100%{opacity:0;transform:scale(1.25)}}
#sticky .v46-st-btn{position:relative;flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:56px;padding:6px 10px 6px 14px;border-radius:999px;background:linear-gradient(180deg,#0BA24F 0%,#05973F 52%,#037F37 100%);color:#fff;overflow:hidden;box-shadow:0 4px 0 #036b2f,0 8px 18px #0b7a3d33}
.v46-st-l{display:flex;flex-direction:column;align-items:center;line-height:1.2}
.v46-st-l small{font-size:clamp(10.5px,2.9vw,12px);font-weight:700;letter-spacing:.02em;opacity:.95}
.v46-st-l b{font-size:clamp(15px,4.3vw,18px);font-weight:800;letter-spacing:.04em;white-space:nowrap}
.v46-st-l .v45-free{margin-right:2px}
.v46-st-arw{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;color:#05973F}
.v46-st-arw svg{width:14px;height:14px}
#sticky .v46-st-btn::after{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:30%;background:linear-gradient(100deg,#fff0,#ffffff8c,#fff0);transform:translateX(-160%) skewX(-18deg);pointer-events:none}
#sticky.shine .v46-st-btn::after{animation:v46shine .9s ease-in-out .15s both}
#sticky.shine .v46-st-arw{animation:v46nudge .5s ease-in-out .9s both}
@keyframes v46shine{0%{transform:translateX(-160%) skewX(-18deg)}100%{transform:translateX(420%) skewX(-18deg)}}
@keyframes v46nudge{0%,100%{transform:none}50%{transform:translateX(4px)}}
@media (max-width:340px){.v46-crew li{width:24px;height:24px}.v46-crew li+li{margin-left:-10px}}
@media (prefers-reduced-motion:reduce){#sticky.v46-sticky{transition:none}.v46-crew li.pop,.v46-crew.full::after,#sticky.shine .v46-st-btn::after,#sticky.shine .v46-st-arw{animation:none!important}}

/* ---- 最後のボタンの上に、5人がそろう ---- */
.v46-crew-final{display:flex;justify-content:center;gap:6px;margin:0 16px 10px;list-style:none;padding:0}
.v46-crew-final li{width:52px;height:52px;border-radius:50%;overflow:hidden;background:#fff;box-shadow:0 0 0 2.5px #fff,0 0 0 4.5px #f08aa8,0 8px 16px #c2456a26}
.v46-crew-final img{display:block;width:100%;height:100%;object-fit:cover}
.v46-crew-final:not(.v45-in) li{opacity:0}
.v46-crew-final.v45-in li{animation:v46pop .45s cubic-bezier(.2,.9,.3,1.5) calc(.1s + var(--k)*.12s) both}
@media (min-width:600px){.v46-crew-final li{width:60px;height:60px}}
@media (prefers-reduced-motion:reduce){.v46-crew-final li{animation:none!important;opacity:1!important}}

/* ---- よくある質問: 1問目と「特典はいつ？」を開いておく・下から積む・Q を大きく ---- */
#faq .faq summary{font-size:16px}
#faq .faq details{transition:box-shadow .2s}
#faq .faq:not(.v45-in) details{opacity:0;transform:translateY(12px)}
#faq .faq.v45-in details{animation:v46row .4s ease-out calc(var(--k,0)*.06s) both}
@media (prefers-reduced-motion:reduce){#faq .faq details{animation:none!important;opacity:1!important;transform:none!important}}

/* ---- 動画の15本: 中央の列を少し下げて、目がジグザグに降りる ---- */
@media (max-width:599px){#gal43 .v43-grid>li:nth-child(3n+2){transform:translateY(14px)}#gal43 .v43-grid{padding-bottom:14px}}

/* ---- 発信の紹介: 1枚目も左の余白から ---- */
#friends-4 .c28-cards{scroll-padding-inline:16px}

/* ---- 見本の注記の下の空きを詰める ---- */
#works-2 .note{margin-bottom:0!important}
#works-2{padding-bottom:12px!important}

/* ---- 大きな絵は、読み込み前も地の色で「続きがある」と見せる ---- */
#offer .o21-art{background:linear-gradient(#fde7ee,#e7eef8)}
#offer .o21-art img{aspect-ratio:1024/1536}
.v38-panel img,#why img,#clone-2 img,#fit img,#works-2 .mk-out img,#safe img,#flow img,#last img{background:#fcf1f4}

/* ---- つなぎの波の下に文字が隠れないよう、空きの少ない節は下に余白を足す(seams_v046.py が付ける) ---- */
.v46-seamPad::after{content:"";display:block;height:34px}
/* 「かけ算」の絵の下136pxを切る v019 の決まりが残り、最後の行「つくったあと、どう仕事にするかまで一緒に。」が隠れていた → 切らない */
.p18:has(> img[src$="usp18.webp"]){aspect-ratio:auto!important;overflow:visible!important}
#works-2{display:flow-root}
.v46-mine,.v46-think{overflow-x:clip;overflow-clip-margin:12px}
/* 帯の中の「無料」も黄色の札に */
#sticky .v46-st-l .v45-free{display:inline-block;margin:0 4px 0 0;padding:0 8px 1px;border-radius:7px;background:#FFE45C;color:#0B6B33;font-style:normal;font-size:.95em;letter-spacing:.04em;line-height:1.3;transform:rotate(-4deg);box-shadow:0 2px 0 #c9a800}
/* 一時停止ボタンは壁の下の一文の左(前の版の「壁の右下に固定」より強く) */
#works-wall .v46-wallfoot .vp-wall{position:relative!important;inset:auto!important;right:auto!important;bottom:auto!important;left:auto!important;top:auto!important}
/* 窓の右上のリボンを切らない */
.v46-ws{overflow:visible}
.v46-ws-bar{border-radius:16px 16px 0 0}
.v46-ws-bow{right:-10px;top:-12px}
/* 最後の5人は、絵の下の端から出てきてボタンに寄る */
#last .v46-crew-final{position:relative;z-index:2;margin:-30px 16px -10px}
.v46-wallfoot{gap:8px}
.v46-wallfoot .ww26-cap{padding:0!important;min-width:0}
@media (max-width:340px){.v46-wallfoot .ww26-cap{font-size:13px!important}}
#real-3 .r19-vid figcaption strong .v46-ph{display:inline-block!important;white-space:nowrap}
#real-3 .r19-vid figcaption strong .v46-ph{font-size:inherit!important;margin:0!important;color:inherit!important}
/* 総点検 r1: 上の帯の添え書きを少し濃く(4.43→)・下の帯の小さい行は12px以上 */
.bar .v45-tag{color:#5c4652!important}
.v46-st-l small{font-size:clamp(12px,3.1vw,12.5px)!important;letter-spacing:0!important}
/* Fable r2: 帯の上の行も読める大きさに(390pxで14.5px・狭い幅は12.5px) */
.v46-st-l small{font-size:clamp(12.5px,3.72vw,14.5px)!important}