*{box-sizing:border-box}body{margin:0;background:#f5f7fa;color:#20354a;font:16px/1.7 system-ui,"Yu Gothic",Meiryo,sans-serif}.wrap{width:100%;max-width:1140px;margin:auto;padding-inline:34px}header .wrap{display:flex;align-items:center;justify-content:space-between;padding-block:16px}a{color:#2d4da0;font-weight:700}header a{display:flex;align-items:center;gap:8px;text-decoration:none}header strong{font-size:clamp(16px,2.3vw,26px)}header img{width:40px;height:40px;object-fit:contain}main{padding-bottom:48px}.intro,article{border:1px solid #d9e2ef;border-radius:16px;background:white;overflow:hidden}.intro{display:grid;grid-template-columns:1.2fr 1fr;background:#ecf4fc}.intro>div,.details{padding:clamp(18px,3vw,36px)}h1,h2,h3{color:#213f78;line-height:1.3}h1{font-size:clamp(30px,4.5vw,56px);margin:0 0 16px}.intro h2{font-size:20px}.intro>img{width:100%;height:100%;max-height:460px;object-fit:contain}.book,.detail{display:inline-block;padding:10px 18px;border-radius:9px;text-decoration:none}.book{background:#2d4da0;color:white}.detail{background:#edf3fc;margin-top:12px}.list-title{margin:36px 0 16px}article{display:grid;grid-template-columns:1fr 1fr;margin:16px 0}.gallery{align-self:center;display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#fff}.gallery img{display:block;width:100%;aspect-ratio:2.45;object-fit:cover}.gallery img:first-child{grid-column:span 2;aspect-ratio:1.95}.details h3{font-size:clamp(21px,2.4vw,29px);margin:0 0 12px}.benefit{padding:9px 14px;border-left:4px solid #eda62f;background:#f0f5fb;margin-bottom:14px;color:#233f73}.benefit>*{display:block}.benefit strong{font-size:1.15em}.details p{margin:4px 0}@media(max-width:720px){.wrap{padding-inline:16px}article,.intro{grid-template-columns:1fr}.intro>img{height:210px}.gallery img:first-child{aspect-ratio:2.1}header a{font-size:14px}.details{padding:18px}}

.key-intro{background:white;color:#121212;text-align:center;padding-bottom:14px;font-family:Georgia,"Yu Mincho","Hiragino Mincho ProN",serif}
.key-intro h1{margin:0;padding:4px 8px 6px;border-bottom:3px solid #111;color:#111;font:700 clamp(24px,3vw,36px)/1.15 Georgia,serif}
.key-images{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:6px;width:min(92%,560px);margin:clamp(24px,7vw,48px) auto 8px}
.key-images img{display:block;width:100%;aspect-ratio:1;object-fit:contain}
.key-intro h2{margin:12px 8px 16px;color:#111;font-size:clamp(22px,6vw,32px);font-weight:500}
.key-intro p{max-width:640px;margin:0 auto 14px;padding:0 20px;text-align:left;font-size:16px;line-height:1.35}
.key-intro .book{min-width:172px;padding:4px 18px;border-radius:7px;background:linear-gradient(#81adff,#2164f4 62%,#1751da);color:white;font:700 14px/1.45 system-ui,sans-serif}
.key-intro .book:focus-visible{outline:3px solid #152e75;outline-offset:3px}
@media(max-width:720px){.key-intro{margin-inline:-12px}.key-intro h2{font-size:clamp(21px,6vw,27px)}}

.store-preview{display:block;scroll-margin-top:12px}
.store-heading,.store-copy{padding:clamp(16px,2.6vw,30px)}
.store-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.store-heading h3{margin:0;color:#19375a;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(23px,4vw,36px);letter-spacing:.035em}
.store-heading .benefit{display:flex;align-items:baseline;gap:8px;margin:0;padding:6px 14px;background:#fff6df;border-color:#c78b25;color:#694613}
.store-heading .benefit strong{line-height:1.1;font-size:clamp(22px,3vw,32px);white-space:nowrap}
.store-photos{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;aspect-ratio:3/1;gap:4px;background:#fff}
.store-photos img{display:block;width:100%;height:100%;min-height:0;object-fit:cover}
.store-photos img:first-child{grid-row:span 2}
.store-copy{display:flex;gap:24px;align-items:center;justify-content:space-between}
.store-copy p{max-width:50em;margin:0;line-height:1.8}
.store-copy .detail{flex:none;margin:0}
@media(max-width:720px){.store-heading .benefit{display:block;padding:5px 9px}.store-heading .benefit small{font-size:11px}.store-photos{aspect-ratio:1.9}.store-copy{display:block}.store-copy .detail{margin-top:14px}.store-heading h3{font-size:clamp(21px,6vw,29px)}}

.store-heading{flex-wrap:wrap}
.store-heading h3,.store-heading .benefit{max-width:100%;overflow-wrap:anywhere}
.store-heading .benefit{flex-wrap:wrap}
.store-heading .benefit strong{white-space:normal}
.store-heading .benefit strong + strong{font-size:.85rem;line-height:1.5}