/* ためりす LP v2（2026-11）— legal / support ページは style.css のまま */
@font-face{font-family:"ZMG";src:url(/tamerisu/fonts/zmg-black.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"ZMG";src:url(/tamerisu/fonts/zmg-bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
  --cream:#FFF8EC; --sand:#F6EBD9; --ink:#2A2420; --sub:#6B5E52; --brown:#7A4A22;
  --green:#2F6B4F; --leaf:#7DBB6A; --orange:#E08A2E; --coin:#F7C04A; --coin-d:#D99A12; --blue:#3E78B8;
  --sky1:#BFE3F5; --sky2:#E9F6FB;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;color:var(--ink);background:var(--cream);line-height:1.85;-webkit-text-size-adjust:100%}
h1,h2,h3,.logo,.chip,.tag,.store,.seg button,.tabs button,.result b,.yen,.kicker,.ribbon,figcaption,.trio h3{font-family:"ZMG","Hiragino Maru Gothic ProN",-apple-system,sans-serif}
img{max-width:100%;display:block}
a{color:var(--green)}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
.sp{display:none}
@media (max-width:640px){.sp{display:inline}.pc{display:none}}

/* header */
header.top{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;max-width:1080px;margin:0 auto;padding:14px 20px}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.35rem;color:var(--brown);text-decoration:none;white-space:nowrap}
.logo img{width:40px;height:40px;border-radius:11px;box-shadow:0 2px 6px rgba(0,0,0,.12)}
header.top nav{display:flex;gap:18px}
header.top nav a{font-size:.9rem;font-weight:700;color:var(--brown);text-decoration:none;white-space:nowrap}
@media (max-width:640px){header.top nav a:not([href="#play"]):not([href="#price"]){display:none}header.top nav{gap:12px}}

/* hero */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--sky1) 0%,var(--sky2) 70%,#F2F9EC 100%);padding:96px 0 0}
.sky{position:absolute;inset:0;pointer-events:none}
.sun{position:absolute;top:70px;right:8%;width:110px;height:110px;border-radius:50%;background:#FFD866;box-shadow:0 0 0 18px rgba(255,216,102,.25),0 0 0 40px rgba(255,216,102,.12)}
.cloud{position:absolute;height:44px;background:#fff;border-radius:44px;opacity:.95;animation:drift 38s linear infinite}
.cloud::before,.cloud::after{content:"";position:absolute;background:#fff;border-radius:50%}
.cloud::before{width:56px;height:56px;top:-26px;left:22px}
.cloud::after{width:40px;height:40px;top:-18px;left:62px}
.c1{width:150px;top:120px;left:-160px}
.c2{width:110px;top:220px;left:-120px;animation-duration:52s;animation-delay:-20s;transform:scale(.8)}
.c3{width:130px;top:60px;left:-140px;animation-duration:64s;animation-delay:-40s}
@keyframes drift{to{transform:translateX(calc(100vw + 320px))}}
.hero-in{position:relative;z-index:2;max-width:1080px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:center}
.kicker{display:inline-block;background:#fff;color:var(--green);font-weight:900;font-size:.9rem;padding:4px 14px;border-radius:99px;margin-bottom:14px;box-shadow:0 2px 0 rgba(47,107,79,.15)}
.hero h1{font-size:3.1rem;line-height:1.3;color:var(--brown);letter-spacing:.02em;margin-bottom:18px}
.hero h1 em{font-style:normal;color:var(--orange);background:linear-gradient(transparent 62%,#FFE39A 62%)}
.lead{font-size:1.06rem;color:var(--sub);margin-bottom:24px}
.stores{display:flex;flex-wrap:wrap;gap:12px}
.stores.center{justify-content:center}
.store{display:inline-flex;flex-direction:column;justify-content:center;min-width:184px;padding:10px 20px 11px;border-radius:16px;background:var(--ink);color:#fff;text-decoration:none;font-weight:900;font-size:1.02rem;line-height:1.25;box-shadow:0 4px 0 rgba(0,0,0,.18);transition:transform .15s}
.store small{font-weight:700;font-size:.72rem;opacity:.75}
.store:hover{transform:translateY(-2px)}
.free{margin-top:12px;font-size:.88rem;color:var(--green);font-weight:700}
.hero-art{position:relative;height:540px}
.phone{position:absolute;right:0;top:0;width:240px;transform:rotate(4deg);filter:drop-shadow(0 24px 30px rgba(40,60,30,.25));animation:float 6s ease-in-out infinite}
@keyframes float{50%{transform:rotate(4deg) translateY(-10px)}}
.risu-big{position:absolute;left:0;bottom:30px;width:190px;z-index:3;animation:hop 3.2s ease-in-out infinite}
@keyframes hop{0%,70%,100%{transform:translateY(0)}80%{transform:translateY(-16px)}90%{transform:translateY(0)}}
.stack{position:absolute;bottom:46px;display:flex;flex-direction:column-reverse;z-index:4}
.stack i,.coins i{display:block;width:46px;height:13px;margin-top:-3px;border-radius:50%;background:var(--coin);border:2.5px solid var(--coin-d)}
.s1{left:150px}.s2{left:196px}.s3{left:242px}
.drop{position:absolute;width:30px;height:30px;border-radius:50%;background:var(--coin);border:3px solid var(--coin-d);left:250px;z-index:4;animation:fall 3.2s ease-in infinite}
.drop::after{content:"¥";position:absolute;inset:0;display:grid;place-items:center;font-weight:900;color:#B8861B;font-size:.85rem}
.d2{animation-delay:1.6s;left:204px}
@keyframes fall{0%{top:120px;opacity:0}15%{opacity:1}70%{top:330px;opacity:1}80%,100%{top:340px;opacity:0}}
.hills{position:relative;height:150px;margin-top:-70px;z-index:1}
.hero-copy{padding-bottom:70px}
.hills svg{position:absolute;bottom:0;width:100%;height:100%}
.tree{position:absolute;bottom:60px;width:70px;height:110px}
.tree::before{content:"";position:absolute;left:29px;bottom:0;width:12px;height:40px;background:#8B5A2B;border-radius:4px}
.tree::after{content:"";position:absolute;left:0;bottom:30px;width:70px;height:76px;border-radius:50%;background:#5FA552;box-shadow:inset -10px -8px 0 rgba(0,0,0,.06)}
.t1{left:1%;bottom:40px;transform:scale(.8)}.t2{left:7%;transform:scale(.6);bottom:30px}.t3{right:3%;transform:scale(.8);bottom:40px}
@media (max-width:820px){
  .hero{padding-top:76px}
  .hero-in{grid-template-columns:1fr;text-align:left}
  .hero h1{font-size:2.2rem}
  .hero-art{height:400px;max-width:360px;margin:0 auto;width:100%}
  .phone{width:200px;right:0}
  .risu-big{width:140px;bottom:40px}
  .s1{left:110px}.s2{left:150px}.s3{left:190px}
  .drop{left:196px}.d2{left:156px}
  .hero-copy{padding-bottom:0}
  .sun{width:70px;height:70px;top:60px;right:20px}
}

/* sections */
.band{position:relative;padding:84px 0}
.cream{background:var(--cream)}
.sand{background:var(--sand)}
.white{background:#fff}
.green{background:var(--green);color:#fff;padding:110px 0}
h2{font-size:2.1rem;line-height:1.4;color:var(--brown);text-align:center;margin-bottom:12px}
h2 .chip{display:block;width:max-content;margin:0 auto 12px;font-size:.85rem;font-weight:900;color:#fff;background:var(--orange);padding:3px 14px;border-radius:99px;letter-spacing:.05em}
h2.light{color:#fff}
h2.light .chip{background:var(--coin);color:var(--brown)}
.sub{text-align:center;color:var(--sub);margin-bottom:40px}
.sub.light{color:rgba(255,255,255,.85)}
@media (max-width:640px){h2{font-size:1.55rem}.band{padding:60px 0}}
.wave{position:absolute;left:0;width:100%;height:60px}
.wave.top{top:0}.wave.bottom{bottom:0}

/* why */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{border-radius:28px;padding:30px 24px 26px;text-align:center;background:#fff;border:3px solid transparent;box-shadow:0 6px 0 rgba(122,74,34,.08)}
.card img{width:84px;height:84px;margin:0 auto 10px}
.card h3{font-size:1.5rem;margin-bottom:6px}
.card p{font-size:.95rem;color:var(--sub);text-align:left}
.c-orange{border-color:#F6D3A8}.c-orange h3{color:var(--orange)}
.c-green{border-color:#CBE5BE}.c-green h3{color:var(--green)}
.c-blue{border-color:#C6DCF0}.c-blue h3{color:var(--blue)}
@media (max-width:760px){.trio{grid-template-columns:1fr}}

/* simulator */
.sim{display:grid;grid-template-columns:1fr 1fr;gap:28px;background:rgba(255,255,255,.08);border:2px solid rgba(255,255,255,.18);border-radius:32px;padding:34px}
.sim-ctrl label{display:block;font-weight:700;margin:4px 0 10px}
.sim-ctrl label b{color:var(--coin);font-size:1.15rem}
.seg{display:flex;gap:8px;margin-bottom:22px}
.seg button{flex:1;border:0;border-radius:14px;padding:12px 6px;font-size:1.05rem;font-weight:900;background:rgba(255,255,255,.14);color:#fff;cursor:pointer}
.seg button.on{background:var(--coin);color:var(--brown);box-shadow:0 4px 0 var(--coin-d)}
input[type=range]{width:100%;accent-color:var(--coin);height:28px}
.ticks{display:flex;justify-content:space-between;font-size:.78rem;opacity:.75;margin-bottom:20px}
.result{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.result div{background:#fff;color:var(--ink);border-radius:18px;padding:12px 16px}
.result small{display:block;font-size:.8rem;color:var(--sub)}
.result b{font-size:2rem;color:var(--green);line-height:1.2}
.result div:first-child b{color:var(--orange)}
.result span{font-weight:700;margin-left:2px}
.note{font-size:.85rem;opacity:.85;margin-top:14px}
.sim-art{position:relative;min-height:300px;border-radius:24px;background:linear-gradient(180deg,#DDF1F8,#F2F9EC 70%);overflow:hidden}
.sim-art::after{content:"";position:absolute;left:0;right:0;bottom:0;height:56px;background:var(--leaf);border-radius:50% 50% 0 0/40% 40% 0 0}
.pots{position:absolute;left:24px;bottom:40px;z-index:2}
.pots img{width:110px;transition:opacity .2s}
.coins{position:absolute;left:50%;bottom:48px;transform:translateX(-50%);display:flex;flex-direction:column-reverse;z-index:2}
.coins i{width:64px;height:17px}
.coins i.plus{background:#FFE08A;animation:pop .35s ease-out both}
@keyframes pop{from{transform:translateY(-30px);opacity:0}}
.sim-risu{position:absolute;right:16px;bottom:30px;width:120px;z-index:3}
@media (max-width:820px){.sim{grid-template-columns:1fr;padding:22px}.sim-art{min-height:260px}}

/* features */
.feat{display:grid;grid-template-columns:1fr 1.1fr;gap:44px;align-items:center;margin-top:56px}
.feat.rev .feat-img{order:2}
.feat-img{border-radius:36px;padding:34px 0 0;display:flex;justify-content:center;overflow:hidden;height:380px}
.feat-img img{width:230px;filter:drop-shadow(0 16px 20px rgba(0,0,0,.18))}
.bg-orange{background:#FCE3C4}.bg-yellow{background:#FFF0B8}.bg-green{background:#D5EDC9}.bg-blue{background:#D3E6F7}
.feat-txt h3{font-size:1.75rem;color:var(--brown);line-height:1.4;margin:10px 0 10px}
.feat-txt p{color:var(--sub);margin-bottom:10px}
.tag{display:inline-block;font-size:.85rem;font-weight:900;padding:3px 12px;border-radius:99px}
.tag.orange{background:#FCE3C4;color:#A9561A}.tag.brown{background:#F3E2CC;color:var(--brown)}.tag.green{background:#D5EDC9;color:var(--green)}.tag.blue{background:#D3E6F7;color:#2D5E99}
@media (max-width:760px){.feat{grid-template-columns:1fr;gap:20px;margin-top:40px}.feat.rev .feat-img{order:0}.feat-img{height:320px}.feat-img img{width:200px}.feat-txt h3{font-size:1.4rem}}

/* age */
.tabs{display:flex;justify-content:center;gap:10px;margin-bottom:28px;flex-wrap:wrap}
.tabs button{border:3px solid #E6D4B8;background:#fff;border-radius:20px;padding:10px 22px;font-size:1.15rem;font-weight:900;color:var(--brown);cursor:pointer;line-height:1.3}
.tabs button small{display:block;font-size:.72rem;font-weight:700;color:var(--sub)}
.tabs button.on{background:var(--brown);border-color:var(--brown);color:#fff}
.tabs button.on small{color:rgba(255,255,255,.8)}
.age{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;justify-content:center;max-width:720px;margin:0 auto}
.age img{width:240px;filter:drop-shadow(0 16px 20px rgba(0,0,0,.18))}
.age ul{list-style:none}
.age li{position:relative;padding:12px 16px 12px 46px;background:#fff;border-radius:16px;margin-bottom:10px;font-weight:700}
.age li::before{content:"";position:absolute;left:14px;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:var(--coin);border:2.5px solid var(--coin-d)}
@media (max-width:640px){.age{grid-template-columns:1fr;gap:20px}.age img{width:210px;margin:0 auto}}

/* kisekae */
.risus{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:36px}
.risus figure{border-radius:28px;padding:22px 10px 16px;text-align:center;transition:transform .2s}
.risus figure:hover{transform:translateY(-6px) rotate(-2deg)}
.risus img{width:100%;max-width:130px;margin:0 auto}
.risus figcaption{margin-top:8px;font-weight:900;color:var(--brown)}
.risus figcaption small{display:block;font-size:.72rem;font-weight:700;color:var(--sub)}
.r-forest{background:#D5EDC9}.r-space{background:#2E2F5E}.r-space figcaption{color:#fff}
.r-umi{background:#BFE6F2}.r-okashi{background:#FBD9E0}.r-yuki{background:#E7F0F8}
@media (max-width:760px){.risus{grid-template-columns:repeat(3,1fr)}.risus figure:nth-child(n+4){}}
@media (max-width:420px){.risus{grid-template-columns:repeat(2,1fr)}}

/* parents */
.safe{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
.safe div{background:var(--cream);border-radius:22px;padding:22px}
.safe b{display:block;font-size:1.6rem;margin-bottom:4px}
.safe strong{display:block;color:var(--green);font-size:1.05rem;margin-bottom:4px}
.safe span{font-size:.9rem;color:var(--sub)}
@media (max-width:760px){.safe{grid-template-columns:1fr}}

/* price */
.price{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:820px;margin:0 auto}
.plan{position:relative;background:#fff;border-radius:28px;padding:30px 26px;border:3px solid #EDE3D5}
.plan h3{font-size:1.25rem;color:var(--brown)}
.yen{font-size:1.1rem;font-weight:900;color:var(--ink);margin:4px 0}
.yen b{font-size:2.8rem;line-height:1.1}
.alt{color:var(--sub);font-size:.9rem;margin-bottom:6px}
.plan ul{list-style:none;margin-top:12px}
.plan li{padding:6px 0 6px 28px;position:relative;border-top:1px dashed #EDE3D5}
.plan li::before{content:"✓";position:absolute;left:4px;color:var(--green);font-weight:900}
.premium{border-color:var(--coin);box-shadow:0 8px 0 rgba(217,154,18,.25)}
.premium .yen b{color:var(--orange)}
.ribbon{position:absolute;top:-14px;right:20px;background:var(--orange);color:#fff;font-size:.78rem;font-weight:900;padding:4px 12px;border-radius:99px}
.fine{text-align:center;font-size:.82rem;color:var(--sub);margin-top:20px}
@media (max-width:700px){.price{grid-template-columns:1fr}}

/* cta */
.cta{position:relative;background:linear-gradient(180deg,var(--sky2),var(--sky1));padding:80px 0 150px;text-align:center;overflow:hidden}
.cta h2{font-size:2.3rem}
.cta-risu{width:130px;margin:0 auto 8px;animation:hop 3.2s ease-in-out infinite}
.cta .stores{margin-top:22px}
.cta-hill{position:absolute;bottom:0;left:0;width:100%;height:110px}
footer{background:var(--leaf);text-align:center;color:#1F4A2E;font-size:.85rem;padding:10px 20px 40px}
footer a{color:#1F4A2E;margin:0 8px}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}