/* d102: 既存の質問・条件を起点とする、長文域まで続く紙面設計。KR-D11 / K-0033 */
body{word-break:auto-phrase}
.hero-grid{row-gap:28px}
.hero h1{margin-block:24px}
.hero .lead{max-width:36em;text-wrap:pretty}
.hero .cta{margin-top:26px}
.hero-art{margin-top:72px;padding-bottom:30px}
.hero-art::before{inset:-28px -24px -80px;background-size:auto 100%;background-position:66% center;mask-image:radial-gradient(ellipse 64% 62% at 50% 48%,#000 36%,transparent 83%)}
.hero-art .cap{padding:18px 16px 0;border-top:1px solid #bfd9e9;margin-top:24px}
.price-line,.shipping-line{display:block}
.price-source{display:inline-block;white-space:nowrap}
.shipping-line{margin-top:8px;text-wrap:pretty}
.cond .ln+.ln{margin-top:22px}
.cond .ln:nth-child(2){border-left:3px solid #bbd8e9;padding:14px 18px;background:#f5faff;line-height:1.95;text-wrap:pretty}
.hero .cond .ln:nth-child(2){background:#f8fcff}
.cond .return-obligation{font-weight:700;color:var(--ink)}
.final .cond{max-width:none}

/* 番号から要点、朝夜の参照、適用範囲の相違へ視線をつなぐ */
.steps.four{gap:36px;align-items:start}
.step{padding:28px 28px 30px;border-top:0;border-left:1px solid #c9dfed}
.step .no{font-size:36px;width:auto;border:0;margin-bottom:18px;padding:0;color:var(--main)!important}
.step h3{border-bottom:2px solid #c8e0ef;padding-bottom:20px;margin-bottom:24px;text-wrap:pretty}
.step .key-text{padding:0 0 24px;border-bottom:0}
.step-copy>.key-text+.reading-unit{margin-top:0}
.step:nth-child(2){background:#f3f9fd}
.step:nth-child(3){border-top:4px solid var(--main);border-left:0}
.step.free{border:0;background:#e5f2fb}
.step-copy .care-routine{margin-top:2px;background:#eef7fd;padding:22px;border-left:3px solid #a9d2eb}
.care-routine .reading-unit+.reading-unit{padding-top:20px;border-top:1px solid #bfd8e8;margin-top:20px}
.care-limitation{padding:22px 0 0;margin-top:24px;border-top:2px solid #c7dfea}
.care-limitation .critical-detail{border:0;padding:0}
.step .step-limitation{padding-top:20px;border-top:1px solid #b9d4e6;font-weight:700}
.step .step-contact{padding:20px 0 0;border-top:1px solid #adcbdf;margin-top:0}
.step:nth-child(3)>p:last-child{padding-top:22px;border-top:1px solid #d1e3ed}

/* 回答は主回答の横長フレームと、質問の対、余白のある締めへ。 */
.qa{gap:30px 36px;align-items:start}
.qa li:not(.main){padding:0 0 26px;border:0;position:relative;isolation:isolate}
.qa li:not(.main) h3{padding:22px 24px;margin-bottom:24px;border:0;border-left:4px solid #b4d7ed;background:#eef7fd;font-size:23px;line-height:1.6;position:relative;isolation:isolate}
.question-phrase{display:inline-block}
.qa li.answer-wash h3::before{content:'';position:absolute;inset:0 0 0 48%;z-index:-1;background:url('assets/frame-watercolor.webp') 70% 50%/290px auto no-repeat;mask-image:linear-gradient(90deg,transparent,#000);opacity:.65}
.qa li:not(.main) .a{padding-inline:24px;max-width:none}
.qa li .answer-lead{font-weight:700;font-size:17px;line-height:1.95}
.qa li[data-answer='2'] h3{background:#e3f0fa;border-left-color:var(--main)}
.qa li[data-answer='2'] .answer-lead{font-size:16px;font-weight:400}
.qa li[data-answer='2'] .reading-unit:last-child{font-weight:700;padding:18px 20px;background:#edf6fc;border-left:3px solid #b7d6e9}
.qa li[data-answer='3'] h3{background:#f3f8fc}
.qa li[data-answer='4'] h3{background:white;border-block:2px solid #d0e4ef;border-left:0;padding-left:0}
.qa li[data-answer='4'] .a{padding:0}
.qa li[data-answer='4'] .answer-lead{font-size:16px;font-weight:400}
.qa li[data-answer='4'] .reading-unit+.reading-unit{border-left:3px solid #c9dfed;padding-left:20px}
.qa li[data-answer='5']{grid-column:1/-1;display:grid;grid-template-columns:17em minmax(0,1fr);gap:32px;padding:28px 30px;background:#f4f9fc;border-block:1px solid #d3e6f1}
.qa li[data-answer='5'] h3{background:transparent;padding:0 0 22px;border-left:0;border-bottom:3px solid #bedbeb;align-self:start;margin:0}
.qa li[data-answer='5'] h3::before{inset:-28px -10px -40px -30px;mask-image:radial-gradient(ellipse,#000 24%,transparent 76%);opacity:.4}
.qa li[data-answer='5'] .a{padding:0}
.qa li.main{border:1px solid #bad8ea;border-top:0}
.qa li.main h3{background:#e5f2fc;padding:26px 32px}
.qa li.main .a{padding-block:28px 32px}
.qa li.main .key-text{font-size:18px;max-width:44em}
.qa li.main .critical-detail{background:#f0f7fc;padding:20px 22px;border-left:3px solid #bbd9eb}

/* 条件: 項目名の水彩の欄、要点の面、出典を残した本文。 */
.terms-heading{margin-bottom:34px}
.trow,.trow.key{grid-template-columns:10.5em minmax(0,1fr);gap:32px;padding:32px 0;border:0;border-bottom:1px solid #cfe1ec;margin:0}
.trow dt,.trow.key dt{position:relative;isolation:isolate;align-self:stretch;padding:24px 20px 32px;border:0;border-top:3px solid #8bb8d6;background:#edf6fc;font-size:20px;line-height:1.65;overflow:hidden}
.trow dt::before{display:block;content:'';position:absolute;inset:48px -60px 0 -85px;z-index:-1;background:url('assets/frame-watercolor.webp') 72% 5%/400px auto no-repeat;mask-image:linear-gradient(#000,transparent 360px);opacity:.65}
.trow dd{padding-top:4px}
.term-summary{padding:0 0 20px;border-bottom:1px solid #cfe3ef}
.term-summary>.c{font-size:19px;line-height:1.85}
.term-details{margin-top:24px;max-width:44em}
.term-details>.reading-unit+.reading-unit{margin-top:22px}
.trow[data-condition='0'] .term-summary{padding:0 0 14px;border:0}
.trow[data-condition='0'] .term-summary>.c{font-size:28px;color:var(--main-deep)}
.trow[data-condition='0'] dd{padding:24px 28px;background:#f3f9fd}
.trow[data-condition='0'] .term-details{margin-top:8px}
.trow[data-condition='1'] dt{background:#f4f9fc}
.trow[data-condition='1'] .term-summary{padding:16px 22px;background:#eff7fd;border:0}
.trow[data-condition='2'] dt{border-top-color:var(--main);background:#e5f2fb}
.trow[data-condition='2'] .term-summary{padding:22px 24px;background:#e5f2fc;border-block:2px solid #a9cee7}
.term-details>div+div,.term-details>div+.reading-unit{margin-top:26px}
.term-details>div>.reading-unit+.reading-unit{margin-top:18px}
.detail-contact{padding:22px 24px;background:#f0f7fc;border-left:3px solid #bad8eb}
.detail-contact .reading-unit:first-child{font-weight:700}
.detail-refund{padding-block:22px;border-block:1px solid #c9deeb}
.trow[data-condition='3'] dt{background:white;border-top:0;border-left:3px solid #d1e5f1}
.trow[data-condition='3'] dt::before{opacity:.3}
.trow[data-condition='4'],.trow[data-condition='5']{padding-block:36px}
.trow[data-condition='4'] .term-summary,.trow[data-condition='5'] .term-summary{padding:22px 24px;background:#eaf4fc;border:0;border-left:4px solid #a5cde7}
.detail-timing{padding:22px 24px;border-block:2px solid #c0dcea;background:#f4f9fd}
.detail-timing>.reading-unit{font-weight:700}
.trow[data-condition='4'] .term-details>.reading-unit{padding-left:24px;border-left:1px solid #c5ddea}
.trow[data-condition='5'] .detail-arrival{padding-left:24px;border-left:2px solid #c7dfed}
.detail-delay{padding:22px 24px;background:#f3f6f8}
.trow[data-condition='6'] dt,.trow[data-condition='7'] dt{border-top:0;background:#f4f8fb;border-left:3px solid #b7d7eb}
.trow[data-condition='6'] .term-summary,.trow[data-condition='7'] .term-summary{border-bottom:0;padding-bottom:0}
.trow[data-condition='8'] dt{border-top:0;background:transparent}
.trow[data-condition='8'] dt::before{display:none}
.trow[data-condition='8'] .term-summary{padding-bottom:12px}
.trow[data-condition='8'] .term-details{margin-top:14px}

@media(min-width:860px){
 .steps.four{grid-template-columns:repeat(12,minmax(0,1fr))}
 .step:nth-child(1){grid-column:1/span 6}
 .step:nth-child(2){grid-column:7/span 6}
 .step:nth-child(3){grid-column:1/span 7}
 .step:nth-child(4){grid-column:8/span 5}
 .hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:36px}
 .hero .cond{max-width:100%}
 .step.free{border-bottom:3px solid #b1d3e8}
}
@media(max-width:859px){
 .hero-art{margin-top:0;padding-bottom:0}
 .hero-art::before{inset:-12px -16px -12px}
 .qa li[data-answer='5']{grid-template-columns:minmax(0,1fr);gap:24px}
 .trow,.trow.key{grid-template-columns:8.5em minmax(0,1fr);gap:24px}
 .trow dt,.trow.key dt{padding:20px 16px;font-size:19px}
}
@media(max-width:559px){
 .hero h1{margin-block:22px}
 .hero .cta{margin-top:26px}
 .hero-grid{row-gap:24px}
 .hero-art .cap{margin-top:22px;padding:16px 0 0}
 .cond .ln:nth-child(2){padding:14px 0 14px 14px;background:transparent}
 .hero .cond .ln:nth-child(2){background:transparent}
 .shipping-line{margin-top:8px}
 .step{padding:24px 20px 28px}
 .step .no{font-size:32px}
 .step h3{padding-bottom:18px;margin-bottom:22px}
 .step-copy .care-routine{padding:20px 16px}
 .step .key-text{padding-bottom:22px}
 .care-limitation{margin-top:22px}
 .qa{gap:0}
 .qa li:not(.main){padding:0 0 30px}
 .qa li:not(.main) h3{padding:20px 18px;margin-bottom:22px;font-size:21px}
 .qa li:not(.main) .a{padding-inline:18px}
 .qa li[data-answer='4'] h3{padding-inline:0}
 .qa li[data-answer='4'] .a{padding:0}
 .qa li[data-answer='4'] .reading-unit+.reading-unit{padding-left:16px}
 .qa li[data-answer='5']{padding:24px 20px;gap:0}
 .qa li[data-answer='5'] h3{padding:0 0 18px;margin-bottom:22px;border-left:0}
 .qa li[data-answer='5'] .a{padding:0}
 .qa li.main{margin-bottom:30px}
 .qa li.main h3{padding:22px 20px}
 .qa li.main .a{padding:24px 20px}
 .qa li.main .critical-detail{padding:18px 16px}
 .trow,.trow.key{grid-template-columns:minmax(0,1fr);gap:20px;padding:28px 0;border:0}
 .trow dt,.trow.key dt{padding:18px 20px;border-top:0;border-left:4px solid #9fc6e0;font-size:20px;overflow:visible}
 .trow dt::before{inset:0 0 0 40%;background-size:320px auto;mask-image:linear-gradient(90deg,transparent,#000);opacity:.55}
 .trow dd{padding-top:0}
 .term-summary>.c{font-size:18px}
 .term-summary{padding-bottom:20px}
 .term-details{margin-top:22px}
 .trow[data-condition='0'] dd{padding:20px}
 .trow[data-condition='0'] .term-summary>.c{font-size:26px}
 .trow[data-condition='1'] .term-summary{padding:18px}
 .trow[data-condition='2'] .term-summary{padding:20px 18px}
 .detail-contact,.detail-timing,.detail-delay{padding:20px 18px}
 .trow[data-condition='4'] .term-summary,.trow[data-condition='5'] .term-summary{padding:20px 18px}
 .trow[data-condition='4'] .term-details>.reading-unit{padding-left:18px}
 .trow[data-condition='5'] .detail-arrival{padding-left:18px}
 .trow[data-condition='4'],.trow[data-condition='5']{padding-block:28px}
 .trow[data-condition='3'] dt,.trow[data-condition='6'] dt,.trow[data-condition='7'] dt{border-left:4px solid #bfd9e9}
 .trow[data-condition='8'] dt{padding:18px 0;border-block:1px solid #cfe1ec;border-left:0}
 .final .cond{margin-top:24px}
}
@media(max-width:359px){
 .step{padding-inline:18px}
 .step-copy .care-routine{padding-inline:14px}
 .qa li.main h3,.qa li.main .a{padding-inline:18px}
 .qa li:not(.main) h3{padding-inline:16px}
 .qa li:not(.main) .a{padding-inline:16px}
 .qa li[data-answer='4'] h3,.qa li[data-answer='4'] .a{padding-inline:0}
 .qa li[data-answer='5']{padding-inline:18px}
 .qa li[data-answer='5'] h3,.qa li[data-answer='5'] .a{padding-inline:0}
 .detail-contact,.detail-timing,.detail-delay{padding-inline:16px}
}