@charset "UTF-8";
:root{--ink:#193b4c;--muted:#526b78;--blue:#176f95;--line:#e3ebef;--snow:#f6f9fc;--aqua:#e5f5f8;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);background:white;font-family:"Avenir Next","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #197da6;outline-offset:5px}header{height:88px;display:flex;justify-content:space-between;align-items:center;max-width:1180px;margin:auto;padding:0 30px}.brand{font-size:23px;font-weight:750;letter-spacing:-1px;display:flex;align-items:center;gap:10px}.brand-mark{width:30px;height:30px;border-radius:10px;background:var(--blue);color:white;display:grid;place-items:center;font-size:22px;font-weight:600}.brand em{font-style:normal;color:var(--blue)}nav{display:flex;gap:32px;font-size:13px;font-weight:600}nav a:hover,.text-link:hover{color:var(--blue)}.wrap{max-width:1120px;margin:auto}.hero{background:#eef7fb;position:relative;overflow:hidden;border-radius:30px;margin:15px auto 0;min-height:520px;display:grid;grid-template-columns:1.1fr 1fr;padding:62px 58px 54px;gap:25px}.hero-copy{z-index:1;align-self:center}.hero h1{font-size:45px;line-height:1.6;letter-spacing:.015em;margin:0 0 21px;font-weight:750}.hero .intro{font-size:14px;line-height:2.1;color:var(--muted);margin:0 0 30px}.hero-art{position:relative;min-height:380px;display:flex;justify-content:center;align-items:center;gap:18px}.hero-art:before{content:"";position:absolute;width:390px;height:390px;background:#d9eff5;border-radius:50%;left:0;top:15px}.shot{width:185px;height:auto;position:relative;box-shadow:0 18px 35px #28516a20;border:5px solid #fff;border-radius:20px;display:block}.shot.first{transform:rotate(-7deg);margin-top:35px}.shot.second{transform:rotate(7deg);margin-top:-28px}.button{border:0;display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:100px;padding:14px 24px;background:var(--blue);color:#fff;font-size:13px;font-weight:650;cursor:pointer}.button.secondary{background:white;color:var(--ink);border:1px solid var(--line)}.section{padding:70px 0 0}.section-title{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:27px}.section-title h2{font-size:25px;letter-spacing:.02em;margin:0}.section-title p{font-size:13px;color:var(--muted);margin:0}.feature{display:grid;grid-template-columns:1fr auto;gap:35px;align-items:center;padding:32px 38px;border:1px solid var(--line);border-radius:22px;background:#fff}.feature-info{display:flex;gap:24px;align-items:center}.app-icon{width:66px;height:66px;border-radius:16px;object-fit:cover;flex-shrink:0;border:1px solid #17344809}.feature .app-icon{width:86px;height:86px;border-radius:21px}.feature h3{font-size:26px;margin:5px 0 7px;letter-spacing:-.4px}.badge{color:var(--blue);font-size:11px;display:inline-block;font-weight:650}.feature p{font-size:13px;line-height:1.9;color:var(--muted);margin:0}.feature-actions{display:flex;flex-direction:column;align-items:center;gap:15px}.text-link{font-size:12px;color:var(--muted)}.toolbar{display:flex;justify-content:space-between;gap:15px;align-items:center;margin:0 0 25px}.filters{display:flex;gap:8px;flex-wrap:wrap}.filter{border:0;background:var(--snow);color:var(--muted);font-size:12px;padding:9px 18px;border-radius:50px;cursor:pointer}.filter.active{background:var(--ink);color:white}.search{position:relative}.search input{width:215px;border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:white;font-size:12px;color:var(--ink)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 32px}.app-card{padding:26px 0;border-top:1px solid var(--line);min-width:0}.card-head{display:flex;align-items:center;gap:16px}.app-card h3{font-size:16px;line-height:1.5;margin:0 0 5px}.category{color:var(--muted);font-size:11px}.app-card p{font-size:12px;color:var(--muted);line-height:1.9;min-height:46px;margin:19px 0}.card-links{display:flex;gap:17px;align-items:center;font-size:12px}.card-links a:first-child{color:var(--blue);font-weight:650}.card-links a:last-child{color:var(--muted);font-size:11px}.soon{background:var(--snow);border-radius:22px;padding:30px 35px;margin-top:30px}.soon h2{font-size:18px;margin:0 0 23px}.soon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.soon .app-icon{width:48px;height:48px;border-radius:12px}.soon h3{font-size:14px;margin:0 0 4px}.soon p{font-size:11px;color:var(--muted);margin:0}.placeholder-icon{background:#dcebee;display:grid;place-items:center;color:var(--blue);font-size:24px}.privacy-band{margin:65px 0;display:flex;justify-content:space-between;align-items:center;gap:25px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:32px 0}.privacy-band h2{font-size:18px;margin:0 0 10px}.privacy-band p{font-size:12px;color:var(--muted);line-height:1.9;margin:0}.privacy-band .button{white-space:nowrap}footer{max-width:1120px;margin:auto;padding:0 0 30px;display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:11px}footer .brand{font-size:18px}footer .brand-mark{width:23px;height:23px;border-radius:7px;font-size:17px}.subpage{padding:35px 0 70px;min-height:70vh}.breadcrumbs{font-size:12px;color:var(--muted);margin-bottom:38px}.detail-head{display:flex;align-items:center;gap:25px;margin-bottom:35px}.detail-head .app-icon{width:96px;height:96px;border-radius:22px}.detail-head h1{font-size:34px;margin:0 0 8px}.detail-head p{color:var(--muted);font-size:13px;margin:0}.prose{font-size:14px;line-height:2.1;max-width:720px}.prose h2{font-size:21px;margin-top:35px}.prose p{white-space:pre-line}.notice{background:#edf6fa;padding:18px 22px;border-radius:12px;font-size:13px;line-height:1.9;margin:25px 0}.detail-layout{display:grid;grid-template-columns:1fr 280px;gap:55px}.aside{border:1px solid var(--line);border-radius:18px;padding:25px;height:max-content}.aside h2{font-size:16px;margin-top:0}.aside a:not(.button){display:block;margin-top:18px;font-size:13px;color:var(--blue)}.policy-row{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:1px solid var(--line);font-size:14px}.draft{font-size:11px;color:var(--muted)}[hidden]{display:none!important}.empty{color:var(--muted);padding:35px 0}.preview-label{background:#eaf3f7;color:#56717f;font-size:11px;text-align:center;padding:7px}.hero-app-name{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--blue);margin-bottom:15px}.hero-app-name img{width:25px;height:25px;border-radius:7px}.hero-links{display:flex;align-items:center;gap:22px}
@media(min-width:1450px){.hero{min-height:550px}}@media(max-width:1180px){.wrap,footer{margin-left:30px;margin-right:30px}.hero{padding:44px 35px}.hero h1{font-size:38px}.shot{width:160px}.hero-art:before{width:330px;height:330px}.grid{gap:0 24px}}@media(max-width:760px){header{height:73px;padding:0 20px}.brand{font-size:20px}nav{gap:17px;font-size:11px}nav a:last-child{display:none}.wrap,footer{margin-left:20px;margin-right:20px}.hero{margin-top:5px;grid-template-columns:1fr;padding:32px 27px 25px;gap:15px;border-radius:23px}.hero h1{font-size:29px;line-height:1.6}.hero .intro{font-size:12px;margin-bottom:23px}.hero-art{min-height:280px;padding-bottom:10px}.hero-art:before{width:265px;height:265px;left:calc(50% - 132px)}.shot{width:127px;border-width:4px;border-radius:15px}.hero-art .first{margin-top:15px}.hero-art .second{margin-top:-15px}.section{padding-top:42px}.section-title{align-items:center}.section-title h2{font-size:22px}.section-title p{font-size:11px}.feature{grid-template-columns:1fr;padding:25px;gap:22px}.feature-info{gap:17px}.feature .app-icon{width:68px;height:68px;border-radius:17px}.feature h3{font-size:23px}.feature p{font-size:12px}.feature-actions{flex-direction:row;justify-content:space-between}.toolbar{align-items:stretch;flex-direction:column}.search input{width:100%}.filter{padding:8px 15px}.grid{grid-template-columns:1fr;gap:0}.app-card{padding:23px 0}.app-card p{min-height:0;margin:15px 0}.app-icon{width:60px;height:60px}.soon{padding:25px}.soon-grid{grid-template-columns:1fr;gap:22px}.privacy-band{margin:40px 0;align-items:flex-start;flex-direction:column}.privacy-band .button{padding:12px 20px}footer{gap:20px;align-items:flex-start;flex-direction:column}.detail-layout{grid-template-columns:1fr;gap:30px}.detail-head h1{font-size:26px}.detail-head .app-icon{width:74px;height:74px}.subpage{padding-top:20px}.hero-links{gap:15px}.button{padding:12px 20px;font-size:12px}.policy-row{gap:15px}.preview-label{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.prose a:not(.button){color:var(--blue);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}.prose li{margin-bottom:8px}.policy-meta{color:var(--muted);font-size:12px;border-bottom:1px solid var(--line);padding-bottom:22px}footer{flex-wrap:wrap;gap:15px}.policy-row:hover{color:var(--blue)}

/* メインビジュアル：アプリJSONから生成する横スライド */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.carousel{margin-top:15px;border-radius:30px;overflow:hidden;background:#eef7fb;isolation:isolate}
.carousel-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;scroll-behavior:smooth;align-items:stretch}
.carousel-track::-webkit-scrollbar{display:none}
.carousel-track:focus-visible{outline:3px solid var(--blue);outline-offset:-4px}
.carousel .hero{flex:0 0 100%;width:100%;margin:0;border-radius:0;min-height:520px;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden}
.carousel .hero-copy{min-width:0}
.carousel .hero-title{white-space:pre-line;font-size:40px;font-weight:750;line-height:1.6;letter-spacing:.015em;margin:0 0 21px;text-wrap:balance}
.carousel .intro{max-width:33em;min-height:60px}
.carousel .hero-app-name{flex-wrap:wrap;font-size:14px;font-weight:600;gap:10px}
.carousel .hero-app-name .app-icon{width:32px;height:32px;border-radius:8px}
.carousel .hero-links{align-items:flex-start;flex-wrap:wrap;gap:16px}
.carousel .hero-links .button{max-width:100%;line-height:1.6;text-align:center}
.carousel .hero-links .text-link{padding:14px 0;white-space:nowrap}
.coming-badge{font-size:10px;color:#526878;background:#ffffffbf;padding:4px 10px;border-radius:30px}
.carousel-visual{position:relative;min-width:0;min-height:380px;display:flex;align-items:center;justify-content:center}
.carousel-visual:before{content:"";position:absolute;width:345px;height:345px;border-radius:50%;background:#ffffff90;max-width:100%}
.hero-poster{position:relative;width:auto;height:380px;max-width:70%;object-fit:contain;border:5px solid #fff;border-radius:20px;box-shadow:0 18px 35px #28516a20;transform:rotate(5deg)}
.carousel-visual .hero-floating-icon{position:absolute;width:108px;height:108px;border-radius:25px;bottom:24px;left:15px;border:5px solid white;box-shadow:0 12px 25px #28516a20;transform:rotate(-8deg)}
.icon-visual{flex-direction:column;gap:28px}
.icon-visual .hero-large-icon{position:relative;width:190px;height:190px;border-radius:43px;box-shadow:0 18px 35px #28516a20;transform:rotate(-6deg)}
.icon-visual>span:last-child{z-index:1;color:var(--muted);font-size:12px}
.theme-relative-pitch-trainer{background:#f0f1fc}
.theme-block-controller{background:#eaf2fb}
.theme-dakkoken{background:#fff2e9}
.theme-losing-master{background:#edf4f0}
.theme-savingirl{background:#fceef3}
.theme-is-a-counter{background:#f0f4f7}
.theme-kotoba-pocket{background:#edf5fa}
.theme-hibito{background:#fff3e9}
.theme-shaso-jump{background:#edf0fb}
.carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 28px;background:#ffffffb0}
.carousel-position{min-width:68px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.carousel-dots{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap}
.carousel-dot{border:0;width:28px;height:32px;padding:0;background:transparent;display:grid;place-items:center;cursor:pointer}
.carousel-dot:after{content:"";width:6px;height:6px;background:#b6c8d0;border-radius:50%}
.carousel-dot[aria-current="true"]:after{width:19px;border-radius:10px;background:var(--blue)}
.carousel-arrows{display:flex;gap:9px}
.carousel-arrows button{width:36px;height:36px;border:1px solid #cedee5;border-radius:50%;background:white;color:var(--ink);font-size:25px;line-height:1;cursor:pointer}
.carousel-arrows button:disabled{opacity:.35;cursor:default}
@media(max-width:1180px){.carousel .hero-title{font-size:34px}.hero-poster{height:350px}.carousel-visual:before{width:300px;height:300px}.carousel-visual .hero-floating-icon{width:90px;height:90px;left:5px}}
@media(max-width:760px){.carousel{margin-top:5px;border-radius:23px}.carousel .hero{min-height:650px;grid-template-rows:auto 290px;padding:30px 25px 20px;gap:15px}.carousel .hero-copy{align-self:start}.carousel .hero-title{font-size:28px;line-height:1.55;margin-bottom:16px}.carousel .intro{min-height:50px;font-size:12px;line-height:1.9;margin-bottom:20px}.carousel .hero-app-name{font-size:12px;margin-bottom:13px}.carousel .hero-app-name .app-icon{width:28px;height:28px}.carousel .hero-links{gap:10px}.carousel .hero-links .button{font-size:11px;padding:11px 17px}.carousel .hero-links .text-link{font-size:11px;padding:11px 0}.carousel .hero-art,.carousel-visual{min-height:280px;height:290px;align-self:end}.carousel .hero-art{padding-bottom:0}.carousel .shot{width:125px;max-height:280px;object-fit:contain}.carousel .hero-art:before,.carousel-visual:before{width:250px;height:250px}.hero-poster{height:270px;max-width:70%;border-radius:14px;border-width:4px}.carousel-visual .hero-floating-icon{width:76px;height:76px;border-radius:18px;left:14%;bottom:12px;border-width:4px}.icon-visual .hero-large-icon{width:155px;height:155px;border-radius:35px}.carousel-controls{padding:10px 14px;gap:5px;flex-wrap:wrap}.carousel-position{min-width:44px;font-size:11px}.carousel-dots{order:3;flex-basis:100%}.carousel-dot{width:27px;height:27px}.carousel-arrows{gap:8px}.carousel-arrows button{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.carousel-track{scroll-behavior:auto}}

/* 狭い画面でも見出しと補足文を別の行に配置できるようにする */
@media(max-width:760px){.section-title{flex-wrap:wrap;gap:10px}.section-title h2{flex-shrink:0;max-width:100%}.detail-head>div{min-width:0}.detail-head h1{overflow-wrap:anywhere}}

/* 長い英数字・区切り文字がグリッドの幅を押し広げないようにする */
.prose{min-width:0;overflow-wrap:anywhere}
.detail-layout{grid-template-columns:minmax(0,1fr) 280px}
@media(max-width:760px){.detail-layout{grid-template-columns:minmax(0,1fr)}}
@media(max-width:380px){header{height:auto;min-height:73px;flex-wrap:wrap;gap:12px;padding-top:15px;padding-bottom:15px}header nav{width:100%;gap:20px}header nav a{white-space:nowrap}}