@font-face{font-family:Yomogi;src:url('fonts/Yomogi-Regular.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Noto;src:url('fonts/NotoSansJP-variable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--auria-blue:#B8D4E3;--ink:#0d2268;--pink:#fa5595;--cyan:#2fb5ce;--yellow:#ffe36a;--purple:#aa78e9;--font-body:Noto,sans-serif;--font-heading:Yomogi,serif;--paper:#f7fcff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:65px}body{margin:0;background:#eaf5fa;color:var(--ink);font-family:var(--font-body);font-size:13px;line-height:1.65}h1,h2,h3,p{margin:0}a{color:inherit}button,input,textarea{font:inherit}button,a,input,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default}a{text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid #163cac;outline-offset:4px}.page{max-width:1024px;margin:auto;container-type:inline-size;background:radial-gradient(ellipse at 15% 50%,#ffeefa80,transparent 40%),linear-gradient(#e5f6ff,#f9fcff 46%,#eef8ff)}.hand,h1{font-family:var(--font-heading);font-weight:600;font-synthesis:none}.underline{background:linear-gradient(transparent 86%,#ff80ad 86%,#ff80ad 93%,transparent 93%);padding-bottom:4px}.button{display:inline-flex;justify-content:center;align-items:center;gap:.65em;border:0;border-radius:50px;background:var(--pink);color:#fff;font-weight:750;line-height:1.4;padding:12px 20px;text-align:center;transition:transform .18s,filter .18s;min-height:44px}.button:hover:not(:disabled){filter:brightness(.96);transform:translateY(-2px)}.button:disabled{background:#66768c;color:white}.header{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 3%;position:relative;z-index:5;background:#e9f7fbea;gap:12px}.brand{display:block;white-space:nowrap;font-family:Yomogi,serif;font-weight:600;line-height:1.1}.brand>span{font-size:24px}.brand small{display:block;font-family:Noto,sans-serif;font-size:6px;letter-spacing:2px;text-align:center;padding-top:3px}.megaphone{font-size:28px}.header nav{display:flex;gap:18px;font-size:9px;font-weight:700;align-items:center}.header-cta{font-size:11px;min-height:32px;padding:7px 20px}.menu-toggle{display:none}.art{position:relative;isolation:isolate}.art:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:url('images/pc-clean.png');background-repeat:no-repeat;background-size:100cqw 150cqw;background-position:0 var(--bg-y,0)}
.hero{min-height:36.2cqw;display:grid;grid-template-columns:repeat(100,1fr);grid-template-rows:3.8cqw auto 1.2cqw auto 1.2cqw auto 2cqw;--bg-y:-4.6875cqw}.hero-heading{grid-column:16/58;grid-row:2;transform:rotate(-5deg);transform-origin:20% 50%}.hero .eyebrow{font-size:1.45cqw;font-weight:800;margin-bottom:3px}.hero h1{line-height:1.17;font-size:6.2cqw;letter-spacing:-.06em}.hero h1 span{display:block}.hero h1 .lead{font-size:2.65cqw;letter-spacing:0;white-space:nowrap}.hero h1 .last{padding-left:12%;text-decoration:underline;text-decoration-color:#ff77a7;text-underline-offset:10px;text-decoration-thickness:4px}.hero-body{grid-column:25/60;grid-row:4;font-size:1.13cqw;font-weight:650;line-height:1.6;align-self:start}.hero-key{grid-column:23/43;grid-row:6;transform:rotate(-6deg);font-size:1.8cqw;white-space:nowrap;align-self:center;text-align:center;z-index:1}.hero-key span{border-bottom:2px solid #ff77a7}.hero-cta{grid-column:43/64;grid-row:6;align-self:center;font-size:1.3cqw;transform:rotate(-12deg);border:3px solid white;box-shadow:0 3px 8px #4443;padding:10px 8px}.hero-cta:hover{transform:rotate(-12deg) translateY(-2px)!important}.hero-doodles span{position:absolute;line-height:1.4}.sticky-pink{left:52%;top:10%;transform:rotate(-13deg);font-size:2.3cqw}.sticky-yellow{right:9%;top:24%;font-size:1.65cqw;transform:rotate(8deg)}.polaroid-one{left:2%;top:45%;font-size:1.2cqw;transform:rotate(-15deg)}.polaroid-two{left:7%;top:81%;font-size:1.3cqw;transform:rotate(10deg)}.tagline{right:2%;top:4%;font-size:1.55cqw;transform:rotate(-8deg)}.laptop{right:13%;top:68%;font-size:1.7cqw;transform:rotate(-15deg)}.cup{right:3%;top:80%;font-size:1.4cqw}.scroll-hint{display:none}.mobile-only{display:none}
.empathy{min-height:21.5cqw;--bg-y:-40.89cqw;display:grid;grid-template-columns:22% 19% 18% 18% 23%;grid-template-rows:5.8cqw auto 1.1cqw}.empathy h2{grid-column:2/5;text-align:center;font-size:2.6cqw;padding-top:.6cqw}.self-words{grid-column:2;grid-row:2;font-size:1.05cqw;font-weight:650}.self-words p{margin:0 0 6px 24px}.self-words span,.fan-words span{display:block;width:fit-content;border-radius:20px;background:#fff9;padding:3px 10px;margin:2px 0}.fan-words{grid-column:4;grid-row:2;font-size:1.12cqw;font-weight:700}.fan-words b{display:block;color:white;background:#ee699a;border-radius:20px;padding:2px 5px;margin-bottom:6px;font-size:1.12cqw}.empathy-end{grid-column:5;grid-row:2;transform:rotate(-7deg);font-size:2.35cqw;align-self:center;padding:0 8px;line-height:1.6}.concept{--bg-y:-62.4cqw;min-height:16cqw;display:grid;grid-template-columns:19% 27% 54%;padding:1cqw 2%}.concept-title h2{font-size:2.75cqw}.concept-title small{font-size:.8cqw;letter-spacing:2px}.concept-copy{font-size:1.03cqw;line-height:1.6;padding-top:.3cqw}.concept-key{font-size:1.3cqw;margin-top:.8cqw;font-weight:600}.concept-key em{font-style:normal;color:#d53978;white-space:nowrap}.concept-five{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;padding-bottom:1cqw;font-size:.9cqw;font-weight:650;text-align:center;gap:5px}.diagnosis{--bg-y:-78.4cqw;min-height:20.1cqw;padding:1cqw 0 1cqw}.diagnosis-heading{display:flex;align-items:center;gap:20px;padding-left:7%}.diagnosis-heading h2{font-size:2.25cqw;line-height:1.2}.diagnosis-heading h2 small{display:block;font-size:1.7cqw;padding-left:25px}.diagnosis-heading p{font-size:1cqw;line-height:1.6}.diagnosis-list{margin:1.1cqw 12% 0 9%;display:grid;grid-template-columns:25% 24% 29% 22%;gap:0}.diagnostic{text-align:center;position:relative;transition:transform .2s;font-size:1.0cqw;line-height:1.4;padding:0 4%;display:flex;align-items:center;flex-direction:column}.diagnostic:hover{transform:translateY(-4px)}.diagnostic h3{font-size:1.8cqw;line-height:1.3;margin-bottom:4px}.diagnostic p{min-height:4cqw}.diagnostic>span{background:var(--pink);color:#fff;border-radius:50px;display:block;padding:5px 12px;font-weight:700;min-height:30px}.diagnostic>small{font-size:.72cqw}.diagnostic.ticket{padding-right:40%}.diagnostic.yellow>span{background:#a57100}.diagnostic.fan>span{background:#167e96}.diagnostic.purple>span{background:#8350bf}.diagnosis-note{position:absolute;right:2%;top:48%;font-size:1.8cqw;transform:rotate(-12deg)}
.maker{--bg-y:-98.5cqw;min-height:20.3cqw;display:grid;grid-template-columns:36% 28% 36%;gap:0;padding:0 1% 1cqw}.card-preview{padding:4cqw 2cqw 0 8cqw;align-self:start;transform:rotate(-8deg)}canvas{width:100%;height:auto;display:block;border-radius:10px;box-shadow:0 4px 10px #596d9655}.maker-form{padding:0 5px}.maker h2{font-size:1.45cqw;line-height:1.5;text-align:center;margin-bottom:6px}.maker-form>p{font-size:1.05cqw;padding:0 2cqw}.maker form{margin-top:7px}.maker label{font-size:11px}.maker input{display:block;width:100%;color:var(--ink);background:#fffc;border:0;border-bottom:1px solid #8495b0;padding:4px 6px;font-size:12px}.maker fieldset{border:0;padding:0;margin:4px 0 8px}.maker legend{font-size:10px}.colors{display:flex;gap:4px}.colors label{flex:1;position:relative;cursor:pointer;display:grid;place-items:center}.colors input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.colors span{display:block;width:19px;height:19px;border-radius:50%;background:var(--swatch);border:1px solid #0001}.colors input:checked+span{outline:2px solid var(--ink);outline-offset:2px}.colors input:focus-visible+span{outline:3px solid #163cac;outline-offset:3px}.maker form>.button{width:100%;padding:10px 8px;font-size:13px;min-height:38px}.maker-actions{position:relative;display:flex;flex-direction:column;justify-content:end;padding:3cqw 1cqw 0 3cqw}.maker-actions .done{font-size:1.7cqw;transform:rotate(-5deg);position:absolute;top:2cqw;left:3cqw}.support{font-size:.97cqw;line-height:1.9;margin-bottom:1.8cqw;width:58%;font-weight:650}.save-buttons{display:flex;gap:7px}.save-buttons .button{font-size:.95cqw;min-height:36px;padding:7px 10px}.cyan{background:#13839b}.outline{border:1px solid #16849f;background:white;color:#146f86}.maker #card-status{font-size:11px;margin-top:5px;font-weight:700;text-align:center}.maker #share-fallback{grid-column:1/-1;background:#f8fcff;border:1px solid #bdd7e5;border-radius:15px;padding:20px;margin:16px 10px}.maker textarea{display:block;width:100%;max-width:600px;margin:6px 0 12px;color:var(--ink);border:1px solid #97b8ce;padding:12px}.people-area{--bg-y:-118.8cqw;display:grid;grid-template-columns:65% 35%;min-height:14.2cqw;padding:1cqw 3%}.members h2{font-size:2.4cqw;display:inline-block}.members>p{font-size:1.05cqw}.members-empty{font-size:2cqw;text-align:center;padding:20px 0 8px}.members-empty span{display:block;font-size:1.2cqw;margin-top:5px}.join{padding-left:3%}.join h2{font-size:1.6cqw;margin:3px 0 6px}.join>p{font-size:1.02cqw;max-width:73%}.join .button{font-size:1.1cqw;padding:7px 12px;min-height:34px;margin:8px 0 4px}.join #contact-note{font-size:.8cqw;max-width:80%}.member-item{display:inline-flex;flex-direction:column;align-items:center;margin:10px;color:var(--ink);font-weight:700}.member-item img{width:70px;height:70px;border-radius:50%;object-fit:cover;border:3px solid var(--member-color)}.member-item .fan-letter{font-size:22px;border-radius:50%;background:var(--member-color);padding:0 10px}.final{--bg-y:-133cqw;min-height:13cqw;display:grid;grid-template-columns:42% 36% 22%;padding:1.2cqw 6%}.final h2{font-size:2.9cqw;transform:rotate(-5deg);line-height:1.4}.final h2 small{display:block;font-size:1.9cqw;margin-left:20%}.final>p{font-size:1.8cqw;padding:1.5cqw 0 0 3cqw;transform:rotate(-5deg)}.final-note{font-size:1.4cqw;padding-top:2.2cqw;transform:rotate(-6deg)}.faq{padding:24px 7% 30px;background:linear-gradient(#e6f4fc00,#f7fbff66)}.faq h2{font-size:25px;text-align:center;margin-bottom:16px}.faq details{border-bottom:1px solid #b8d4e3;padding:9px 0}.faq summary{font-weight:650;cursor:pointer;min-height:32px}.faq details p{padding:10px 20px;line-height:1.8}footer{display:flex;align-items:center;gap:16px;padding:20px 3%;font-size:9px;background:#d7edf8aa}footer .brand>span{font-size:19px}footer p{font-size:8px}footer>small{margin-left:auto;font-size:8px}.skip{position:absolute;top:-100px;background:white;padding:10px;z-index:100}.skip:focus{top:0}.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}
@media(min-width:701px) and (max-width:900px){.header nav{gap:8px;font-size:8px}.header-cta{font-size:9px;padding:6px 9px}.brand>span{font-size:21px}.empathy{min-height:23cqw}.concept{min-height:18cqw}.maker{min-height:26cqw}.maker-actions{padding-bottom:12px}}
@media(max-width:700px){
body{font-size:14px}.page{max-width:500px}.header{height:44px;background:transparent;position:absolute;top:0;left:0;right:0;max-width:500px;margin:auto;padding:7px 5%;align-items:start}.header .brand>span{font-size:22px}.header .brand small{font-size:5px;letter-spacing:1.8px}.header .megaphone{font-size:24px}.header-cta{display:none}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;border:0;background:transparent;padding:4px;width:38px;height:34px;color:var(--ink)}.menu-toggle span{width:24px;height:2px;background:currentColor}.header nav{display:none;position:absolute;top:46px;left:4%;right:4%;border:1px solid #b8d4e3;box-shadow:0 8px 30px #143e6833;border-radius:16px;background:#f6fcff;padding:15px;font-size:14px;gap:0}.header nav.open{display:flex;flex-direction:column;align-items:stretch}.header nav a{padding:11px;border-bottom:1px solid #b8d4e355}.hero{min-height:177.69cqw;display:grid;grid-template-columns:repeat(100,1fr);grid-template-rows:9.1cqw 4cqw 6cqw 35cqw 2cqw 19cqw 53cqw 15cqw 4cqw 14cqw 2cqw 11cqw 3.59cqw}.hero:before{background-image:url('images/mobile-clean.png');background-size:100cqw auto;background-position:top center}.hero-heading{grid-column:24/80;grid-row:3/5;align-self:start;transform:rotate(-5deg)}.hero .eyebrow{font-size:3.3cqw;margin:0 0 2.2cqw 2cqw}.hero h1{font-size:11.4cqw;line-height:1.08;letter-spacing:-.08em}.hero h1 .lead{font-size:4.7cqw;line-height:1.6;letter-spacing:-.03em;white-space:nowrap}.hero h1 .last{padding-left:10%;text-underline-offset:5px;text-decoration-thickness:2px;white-space:nowrap}.hero-body{grid-column:33/85;grid-row:6;font-size:2.63cqw;line-height:1.7;font-weight:650;align-self:start;transform:rotate(-3deg)}.mobile-only{display:block}.hero-key{grid-column:19/82;grid-row:8;font-size:4.2cqw;align-self:center;line-height:1.7;transform:rotate(-4deg);white-space:nowrap}.hero-key span{border-bottom-width:1.5px}.hero-cta{grid-column:16/85;grid-row:10;font-size:4cqw;padding:10px 6px;align-self:stretch;transform:none;gap:8px;border:2px solid white;box-shadow:0 3px 8px #4443;min-height:44px}.hero-cta:hover{transform:translateY(-2px)!important}.hero-cta span:first-child{font-size:5cqw}.hero-doodles .sticky-pink{left:84%;top:16%;font-size:4.5cqw;transform:rotate(-10deg)}.hero-doodles .sticky-yellow{right:4%;top:30%;font-size:4.1cqw;transform:rotate(-13deg)}.hero-doodles .polaroid-one{left:5%;top:26%;font-size:3.5cqw;transform:rotate(-15deg)}.hero-doodles .polaroid-two{left:7%;top:46%;font-size:2.7cqw;transform:rotate(10deg)}.hero-doodles .tagline{right:5%;top:5.5%;font-size:2.8cqw;transform:rotate(-8deg)}.hero-doodles .laptop{right:13%;top:64%;font-size:3.7cqw}.hero-doodles .cup{right:1.5%;top:67%;font-size:3.4cqw}.scroll-hint{grid-column:40/61;grid-row:12;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;align-self:center}.scroll-circle{display:grid;place-items:center;width:28px;height:28px;border:1px solid #527197;border-radius:50%;font-size:19px}.scroll-hint small{font-size:8px;letter-spacing:2.5px}.empathy{min-height:0;padding:23px 5% 24px;display:grid;grid-template-columns:50% 50%;grid-template-rows:auto auto auto;gap:20px 0;background:radial-gradient(ellipse at 75% 55%,#ffe9f5 0,transparent 65%)}.empathy:before{background-size:820px 1230px;background-position:center -322px;opacity:.22;mask-image:linear-gradient(transparent,black 18%,black 75%,transparent)}.empathy h2{grid-column:1/-1;font-size:5.8cqw;padding:0;text-align:center}.empathy h2 span{display:block}.self-words{grid-column:1;grid-row:2;font-size:12px;padding-right:5px}.self-words p{margin:0 0 9px}.self-words span{padding:5px 7px;line-height:1.6}.fan-words{grid-column:2;grid-row:2;font-size:12px;padding-left:6px}.fan-words b{font-size:12px;padding:5px 8px}.fan-words span{padding:6px;line-height:1.6}.empathy-end{grid-column:1/-1;grid-row:3;text-align:center;font-size:6cqw;transform:rotate(-5deg);line-height:1.8}.concept{min-height:0;padding:22px 6% 28px;display:block}.concept:before{background-size:740px 1110px;background-position:30% -463px;opacity:.16;mask-image:linear-gradient(transparent,black 20%,black 75%,transparent)}.concept-title h2{font-size:8cqw}.concept-title small{font-size:10px;letter-spacing:2px}.concept-copy{font-size:14px;line-height:1.9;padding-top:18px}.concept-copy>p:first-child{margin-bottom:12px}.concept-key{font-size:5.3cqw;margin-top:16px;line-height:1.8}.concept-key em{display:block;text-align:right}.concept-five{display:none}.diagnosis{min-height:0;padding:20px 5% 28px}.diagnosis:before{background-position:center -600px;background-size:780px 1170px;opacity:.35;mask-image:linear-gradient(transparent,black 15%,black 80%,transparent)}.diagnosis-heading{display:block;padding:0}.diagnosis-heading h2{font-size:7cqw}.diagnosis-heading h2 small{font-size:5cqw;padding-left:20px}.diagnosis-heading p{font-size:12px;margin-top:16px}.diagnosis-list{margin:24px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:20px 12px;align-items:stretch}.diagnostic{font-size:13px;padding:18px 8px 10px;min-height:222px;background:#ffe3ee;box-shadow:2px 4px 0 #d5baca77;border:1px solid #f5afca;transform:rotate(-3deg);border-radius:4px}.diagnostic.ticket{padding:18px 8px 10px;border-left:7px dotted white}.diagnostic h3{font-size:20px;margin-bottom:10px}.diagnostic p{min-height:64px}.diagnostic>span{padding:8px 12px;min-height:38px;margin-top:auto;font-size:12px}.diagnostic>small{font-size:10px;margin-top:4px}.diagnostic.yellow{background:#fff4b8;border-color:#ebd689;transform:rotate(4deg);border-radius:12px 2px 12px 2px}.diagnostic.fan{background:#d8f7fc;border-color:#a0dce5;border-radius:55% 55% 16% 16%;transform:rotate(-2deg);padding-top:24px}.diagnostic.purple{background:#eadcff;border:5px double #cba8ee;transform:rotate(3deg);border-radius:8px}.diagnosis-note{display:none}.maker{min-height:0;padding:20px 6% 25px;display:flex;flex-direction:column;background:radial-gradient(ellipse at 5% 50%,#ffebf8,transparent 75%)}.maker:before{background-size:740px 1110px;background-position:right -732px;opacity:.16;mask-image:linear-gradient(transparent,black 15%,black 80%,transparent)}.maker-form{order:1;padding:0}.maker h2{font-size:17px;text-align:left;line-height:1.6}.maker-form>p{font-size:14px;padding:0;margin-top:14px}.maker form{margin-top:20px}.maker label{font-size:14px}.maker input{font-size:16px;padding:10px 6px}.maker fieldset{margin:14px 0 20px}.maker legend{font-size:12px;margin-bottom:10px}.colors{gap:8px;flex-wrap:wrap}.colors label{min-width:23px;min-height:32px}.colors span{width:24px;height:24px}.maker form>.button{font-size:16px;min-height:46px}.card-preview{order:2;padding:22px 7px;transform:rotate(-5deg)}.maker-actions{order:3;padding:10px 0 0;display:block}.maker-actions .done{position:static;font-size:22px;margin-bottom:16px}.support{font-size:12px;line-height:2;width:auto;margin-bottom:17px}.save-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.save-buttons .button{font-size:12px;min-height:44px;padding:9px}.maker #card-status{font-size:14px;margin-top:12px}.maker #share-fallback{order:4;margin:20px 0 0;padding:16px}.people-area{display:block;min-height:0;padding:20px 6% 26px}.people-area:before{background-size:740px 1110px;background-position:center -880px;opacity:.3;mask-image:linear-gradient(transparent,black 20%,black 70%,transparent)}.members h2{font-size:6.4cqw}.members>p{font-size:12px;margin:9px 0 14px}.members-empty{font-size:5.5cqw;line-height:1.8;padding:20px 0}.members-empty span{font-size:3.5cqw}.join{padding:26px 0 0}.join h2{font-size:22px}.join>p{font-size:14px;max-width:none;line-height:1.9;margin-top:10px}.join .button{font-size:14px;padding:12px 20px;min-height:44px;margin:20px 0 10px}.join #contact-note{font-size:11px;max-width:none}.final{min-height:230px;padding:18px 5% 15px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto}.final:before{background-size:1100px 1650px;background-position:47% -1458px;mask-image:linear-gradient(transparent,black 13%,black 90%,transparent)}.final h2{grid-column:1/-1;font-size:7cqw;text-shadow:0 0 8px white}.final h2 small{font-size:5cqw;margin-left:20%}.final>p{grid-column:2;font-size:4cqw;align-self:end;padding:0;text-shadow:0 0 5px white;background:#fff9}.final-note{display:none}.faq{padding:25px 6% 30px}.faq h2{font-size:26px}.faq summary{font-size:13px;min-height:44px;padding:7px 0}.faq details p{font-size:13px;padding:10px 0}footer{flex-wrap:wrap;gap:14px;padding:22px 6%;font-size:11px}footer .brand>span{font-size:23px}footer p{width:100%;font-size:10px}footer>small{font-size:9px}html{scroll-padding-top:15px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
/* 原画の参照窓。文字量が増えても隣の情景が露出しない。 */
@media(min-width:701px){
.hero{grid-template-rows:3.2cqw minmax(18.5cqw,auto) 1cqw minmax(5cqw,auto) .9cqw minmax(5.5cqw,auto) 2.1cqw}.hero h1{font-size:5.8cqw;line-height:1.16}.hero:before{max-height:36.2cqw}.hero-cta{white-space:nowrap;font-size:1.17cqw;min-height:42px;padding:8px 5px}.hero-heading{grid-column:17/58}.hero-key{font-size:1.7cqw}.empathy:before{max-height:21.5cqw}.concept:before{max-height:16cqw}.diagnosis:before{max-height:20.1cqw}.maker:before{max-height:20.3cqw;mask-image:linear-gradient(black 82%,transparent)}.people-area:before{max-height:14.2cqw;mask-image:linear-gradient(black 85%,transparent)}.concept-title h2{font-size:2.3cqw;white-space:nowrap}.empathy-end{font-size:2.08cqw;white-space:nowrap;padding-left:0}.diagnosis-note{font-size:1.5cqw;right:2.5%}.final:before{mask-image:linear-gradient(transparent,black 12%,black 95%,transparent)}.hero-doodles .polaroid-two{top:82%}
}
@media(max-width:700px){.hero-heading{grid-column:24/82}.hero h1{font-size:9.8cqw;line-height:1.14}.hero h1>span{white-space:nowrap}.hero h1 .last{padding-left:9%;font-size:10.3cqw}.hero-body{font-size:2.7cqw}.hero-doodles .sticky-yellow{font-size:3.8cqw}.final{min-height:220px;grid-template-columns:1fr 1fr;grid-template-rows:95px auto}.final:before{background-size:1000px 1500px;background-position:47% -1328px}.final>p{font-size:3.5cqw;padding:7px 3px;align-self:start}.final h2{font-size:6.7cqw}}
.megaphone{vertical-align:middle;transform:rotate(-12deg)}
.hero-body span{display:inline}.hero-body span:nth-child(3):before,.hero-body span:nth-child(4):before{content:'';display:block}
@media(max-width:700px){.header .megaphone{width:25px;height:25px}.hero{grid-template-rows:9.1cqw 4cqw 6cqw 32cqw 2cqw 19cqw 56cqw 15cqw 4cqw 14cqw 2cqw 11cqw 3.59cqw}.hero-body{grid-column:33/91;font-size:2.55cqw;line-height:1.55}.hero-body span{display:block;white-space:nowrap}.hero-body span:before{display:none!important}.hero-doodles .sticky-yellow{top:30.8%;font-size:3.4cqw}}
@media(min-width:701px){.empathy-end{transform:translateX(-8px) rotate(-7deg);font-size:2cqw}.card-preview{transform:none}.card-preview canvas{transform:rotate(-8deg)}}
@media(min-width:701px){.final{grid-template-columns:52% 30% 18%}.final>p{padding-left:0}.join>p{max-width:66%}.join #contact-note{max-width:90%}}
/* 白文字の小さい操作ラベルの可読性を確保。 */
:root{--pink:#d72d73}.fan-words b{color:var(--ink)}.diagnostic.yellow>span{background:#986600}.cyan{background:#117b92}
@media(max-width:700px){
.empathy:before{max-height:178px}.concept:before{max-height:116px}.diagnosis:before{max-height:158px}.maker:before{max-height:154px}.people-area:before{max-height:110px}
.final{min-height:230px;grid-template-rows:90px auto}.final:before{top:62px;bottom:auto;height:128px;background-size:900px 1350px;background-position:47% -1186px;mask-image:linear-gradient(transparent,black 17%,black 80%,transparent)}.final h2{font-size:6.7cqw}.final>p{align-self:start;background:#ffffffbd;font-size:3.4cqw;padding:8px 5px}
}
@media(min-width:701px){.colors{gap:2px}.colors span{width:clamp(13px,1.8cqw,19px);height:clamp(13px,1.8cqw,19px)}}
@media(min-width:701px) and (max-width:900px){.header-cta{display:none}.header nav{gap:15px;font-size:9px}.header nav a{white-space:nowrap}.header .brand>span{font-size:21px}}

/* 2026-09-26: ユーザー希望のラフな手書き感。実在Regular字形を使う。 */
.hand,h1,.brand,.hero .eyebrow,.maker h2,.join h2,.diagnostic h3{font-family:Yomogi,serif;font-weight:400;font-synthesis:none}
h1{-webkit-text-stroke:.45px currentColor}.hand,.brand{-webkit-text-stroke:.18px currentColor}.hero .eyebrow,.maker h2,.join h2,.diagnostic h3{-webkit-text-stroke:.3px currentColor}

/* 採用原画の太いペンの筆圧・跳ねを、編集可能な文字で近似。 */
@font-face{font-family:Pen;src:url('fonts/YuseiMagic-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
:root{--font-heading:Pen,serif}
.hand,h1,.brand,.hero .eyebrow,.maker h2,.join h2,.diagnostic h3{font-family:Pen,serif;font-weight:400;font-synthesis:none;-webkit-text-stroke:0}
.hero h1{letter-spacing:-.065em;line-height:1.16}.penchar{display:inline-block!important;font:inherit;font-style:normal;transform:translateY(var(--dy,0)) rotate(var(--angle,0deg)) scale(var(--size,1));transform-origin:50% 80%}
.hero h1>span:not(.lead) .penchar:first-child{--size:1.12!important;margin-right:.03em}
.hero-key{font-size:1.7cqw}.hero-key span{border-bottom-width:3px}.hero-doodles .tagline{font-family:Pen,serif}
@media(max-width:700px){.hero h1{font-size:10.1cqw;letter-spacing:-.085em}.hero h1 .last{font-size:10.4cqw;padding-left:8%}.hero-key{font-size:3.8cqw}.header .brand>span{font-size:21px}.hero .eyebrow{font-size:3.2cqw}.hero h1 .lead{font-size:4.65cqw}.hero-doodles .polaroid-one{font-size:3.2cqw}}

/* Original ink layers: source letterforms, independently positioned. */
.original-ink{display:block;width:100%;height:auto}.header .brand{width:225px;flex-shrink:0}footer .brand{width:180px}.original-heading{position:absolute;left:14.94%;top:2.64cqw;width:40.82%;transform:none}.original-heading h1{font-size:inherit;line-height:1}.original-key{position:absolute;left:21.68%;top:28.52cqw;width:21.19%;transform:none}.hero{height:36.2cqw;min-height:36.2cqw}.hero-body{position:absolute;left:24.7%;top:22.8cqw;width:36%;font-size:1.03cqw}.hero-cta{position:absolute;left:42.4%;top:27.4cqw;width:20.4%}.empathy h2{width:35cqw;justify-self:center}.empathy-end{transform:none;width:22.3cqw}.concept-title h2{width:15.14cqw}.diagnosis-heading h2{width:20.3cqw}.members h2{width:19.92cqw}.final h2{width:29.4cqw;transform:none}.hero-doodles .original-ink{max-width:100%}.hero-doodles .sticky-pink{width:7.8%;transform:none}.hero-doodles .sticky-yellow{width:8%;transform:none}.hero-doodles .polaroid-one{width:10%;transform:none}.hero-doodles .polaroid-two{width:12%;transform:none}.hero-doodles .tagline{width:12%;transform:none}.hero-doodles .laptop{width:10%;transform:none}.hero-doodles .cup{width:5%;transform:none}
@media(max-width:700px){.header .brand{width:47.5%;margin-top:0}.header{padding:1.6cqw 4.5%}.hero{height:177.69cqw;min-height:177.69cqw}.original-heading{left:23.49%;top:12.43cqw;width:62.27%;transform:none}.original-key{left:21.47%;top:131.13cqw;width:56.22%;transform:none}.hero-body{left:33%;top:57.1cqw;width:59%;font-size:2.55cqw;transform:rotate(-3deg)}.hero-cta{left:16%;top:150.1cqw;width:68%;height:13.2cqw;min-height:44px}.hero-doodles .sticky-pink{left:82.04%;top:25.82cqw;width:11.05%}.hero-doodles .sticky-yellow{left:84.06%;top:51.86cqw;width:11.48%}.hero-doodles .polaroid-one{left:4.68%;top:44.63cqw;width:16.47%}.hero-doodles .polaroid-two{left:6.38%;top:79.91cqw;width:19.55%}.hero-doodles .tagline{left:77.68%;top:7.33cqw;width:19.45%}.hero-doodles .laptop{left:72.05%;top:113.07cqw;width:15.83%}.hero-doodles .cup{left:92.56%;top:119.45cqw;width:6.38%}.empathy h2{width:88%;margin:auto}.empathy-end{width:70%;margin:auto}.concept-title h2{width:52%}.diagnosis-heading h2{width:76%}.members h2{width:75%}.final h2{width:85%}}
.hero>.original-heading,.hero>.original-key,.hero>.hero-body,.hero>.hero-cta{grid-area:auto}

@media(max-width:700px){.hero-body{font-size:2.35cqw;line-height:1.6;top:56.5cqw}}

.ink-definitions{position:absolute;overflow:hidden;pointer-events:none}.ink-responsive{display:block}.ink-mobile{display:none}@media(max-width:700px){.ink-mobile{display:block}.ink-pc{display:none}}
.hero-key .ink-responsive{border:0}.empathy-end{max-width:229px}.concept-title h2{max-width:155px}.diagnosis-heading h2{max-width:208px}.members h2{max-width:204px}.final h2{max-width:301px}


/* Prevent shared span positioning from affecting inline ink wrappers. */
.hero-doodles .sticky-pink{left:51.07%;top:3.91cqw;width:7.32%}.hero-doodles .sticky-yellow{left:84.77%;top:8.2cqw;width:6.84%}.hero-doodles .polaroid-one{left:2.44%;top:16.41cqw;width:6.84%}.hero-doodles .polaroid-two{left:5.86%;top:29.49cqw;width:10.94%}.hero-doodles .tagline{left:87.89%;top:.98cqw;width:10.64%}.hero-doodles .laptop{left:78.8%;top:23.63cqw;width:8.2%}.hero-doodles .cup{left:92.68%;top:28.9cqw;width:6.35%}
@media(max-width:700px){.hero-doodles .sticky-pink{left:82.04%;top:25.82cqw;width:11.05%}.hero-doodles .sticky-yellow{left:84.06%;top:51.86cqw;width:11.48%}.hero-doodles .polaroid-one{left:4.68%;top:44.63cqw;width:16.47%}.hero-doodles .polaroid-two{left:6.38%;top:79.91cqw;width:19.55%}.hero-doodles .tagline{left:77.68%;top:7.33cqw;width:19.45%}.hero-doodles .laptop{left:72.05%;top:113.07cqw;width:15.83%}.hero-doodles .cup{left:92.56%;top:119.45cqw;width:6.38%}}

/* Text repair: align source lettering with its original paper and keep copy clear. */
@media(min-width:701px){
.empathy h2{position:absolute;left:27.15%;top:.62cqw;width:34.96%;padding:0}
.empathy-end{position:absolute;left:76.76%;top:5.5cqw;width:22.36%;padding:0}
.hero-cta{left:43.3%}
.concept-title{padding-left:.73cqw}
}
@media(max-width:700px){
.hero-body{left:32%;top:56.5cqw;width:62%;font-size:2.55cqw;line-height:1.5;transform:none;text-shadow:0 0 4px #fff,0 0 8px #fff}
.hero-body span:first-child{font-size:2.25cqw}
.hero-doodles .tagline{left:77.68%;top:8.5cqw;width:19.45%}
.menu-toggle{position:relative;top:-1cqw}
.final>p{transform:none;background:#ffffffd9;padding:8px;width:100%;align-self:end}
}

@media(min-width:701px){.empathy h2,.empathy-end{grid-area:auto;justify-self:auto;align-self:auto}}
.final h2 .original-ink{clip-path:polygon(0 0,100% 0,100% 100%,38% 100%,38% 58%,0 58%)}
.final>p{font-family:Pen,serif;line-height:1.65;}
@media(max-width:700px){.final>p{font-size:3.3cqw;min-width:0}.hero-body{font-size:2.5cqw;line-height:1.45;top:56.3cqw}}

/* Reference update: 2026-09-26 11:18 artwork. Text remains native HTML. */
.section-sprite{display:block;overflow:hidden;pointer-events:none}
.reference-concept{display:block;min-height:0;padding:24px 5% 28px;background:radial-gradient(ellipse at 95% 50%,#dbf4ff90,transparent 65%)}
.concept-paper{position:relative;max-width:890px;margin:auto;padding:22px 32px 25px;background:radial-gradient(ellipse at 30% 0,#fffefa,#f8f6ef);border:1px solid #d8d7cc;box-shadow:2px 4px 9px #64778119;clip-path:polygon(0 2%,2% 1%,5% 2%,9% 0,13% 1%,18% 0,23% 1%,28% 0,32% 1%,37% 0,43% 1%,48% 0,54% 1%,60% 0,67% 1%,73% 0,80% 1%,85% 0,91% 1%,96% 0,100% 2%,99.6% 15%,100% 28%,99.5% 43%,100% 60%,99.6% 78%,100% 97%,95% 99%,90% 98%,85% 100%,79% 99%,73% 100%,67% 99%,60% 100%,54% 99%,48% 100%,42% 99%,36% 100%,30% 99%,24% 100%,18% 99%,12% 100%,7% 99%,2% 100%,0 98%,.5% 80%,0 60%,.4% 40%,0 20%)}
.reference-concept .concept-title{padding:0;text-align:center}.reference-concept .concept-title h2{font-size:30px;line-height:1.4;width:auto;max-width:none;white-space:normal;transform:rotate(-2deg)}
.concept-intro{text-align:center;font-size:13px;font-weight:650;margin:9px 0 17px}
.reference-concept .concept-five{display:grid;grid-template-columns:repeat(5,1fr);align-items:start;padding:0;gap:0;font-size:12px;line-height:1.7}
.concept-principle{padding:0 8px;border-right:1px solid #d9e0df;min-height:105px}.concept-principle:last-child{border:0}
.principle-icon{width:62px;height:58px;margin:0 auto 10px}.concept-principle p{font-weight:650}
.reference-concept .concept-key{display:flex;justify-content:center;align-items:center;gap:40px;margin:20px 0 0;font-size:22px;line-height:1.5;text-align:center;transform:rotate(-2deg)}
.reference-concept .concept-key strong{font-weight:400;border-bottom:3px solid #ff70a5;padding-bottom:3px}.reference-concept .concept-key em{color:#f05e9b;font-size:27px;transform:rotate(-7deg);border-bottom:2px solid #ff7aae}
.reference-diagnosis{position:relative;min-height:0;padding:14px 3% 28px;background:radial-gradient(ellipse at 20% 65%,#c8edffbd,transparent 75%),linear-gradient(130deg,#ecf9ff80,#d9f0fb99,#fcf6ff66)}
.reference-diagnosis .diagnosis-heading{max-width:900px;margin:auto;display:flex;justify-content:space-around;align-items:center;padding:0 8px;gap:20px}
.reference-diagnosis .diagnosis-heading h2{font-size:28px;width:auto;max-width:none;line-height:1.35;transform:rotate(-3deg)}
.reference-diagnosis .diagnosis-heading h2 small{font-size:20px;padding-left:35px}.reference-diagnosis .diagnosis-heading p{font-size:12px;font-weight:600;line-height:1.9}
.reference-diagnosis .diagnosis-list{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;max-width:900px;margin:16px auto 0;align-items:start}
.reference-diagnosis .diagnostic{position:relative;display:block;padding:0;min-height:0;height:240px;border:0;background:none;box-shadow:none;border-radius:0;transform:none;font-size:12px;isolation:isolate}
.reference-diagnosis .diagnostic:hover{transform:translateY(-4px)}
.goods-art{position:absolute;inset:0;width:100%;height:auto;z-index:-1;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.goods-copy{position:relative;padding:27px 15px 0;text-align:center}.reference-diagnosis .diagnostic h3{font-size:22px;line-height:1.25;margin:0 0 9px;white-space:nowrap}
.reference-diagnosis .diagnostic p{font-size:12px;line-height:1.6;min-height:59px;font-weight:650}
.goods-copy>span{display:inline-flex;align-items:center;justify-content:center;min-height:32px;min-width:112px;border-radius:40px;padding:5px 12px;color:#fff;background:#dc357b;font-size:12px;font-weight:750;box-shadow:0 2px 0 #ffffffa1}
.goods-copy>small{display:block;font-size:9px;margin-top:4px}.yellow .goods-copy>span{background:#987000}.fan .goods-copy>span{background:#168c91}.purple .goods-copy>span{background:#8654ba}
.reference-diagnosis .ticket .goods-copy{transform:rotate(3deg);padding-top:28px}.reference-diagnosis .yellow .goods-copy{transform:rotate(-6deg);padding-top:30px}.reference-diagnosis .fan .goods-copy{transform:rotate(3deg);padding-top:22px}.reference-diagnosis .purple .goods-copy{transform:rotate(-4deg);padding-top:25px}.reference-diagnosis .purple h3{font-size:20px}.reference-diagnosis .fan{height:272px}
@media(min-width:701px) and (max-width:900px){.reference-diagnosis .diagnostic{height:230px}.goods-copy{padding-left:7px;padding-right:7px}.reference-diagnosis .diagnostic h3{font-size:18px}.reference-diagnosis .purple h3{font-size:16px}.reference-diagnosis .diagnostic p{font-size:10px;min-height:48px}.goods-copy>span{font-size:11px;min-width:100px;min-height:30px}.reference-diagnosis .diagnosis-heading h2{font-size:24px}.reference-diagnosis .diagnosis-heading p{font-size:10px}.concept-principle{padding:0 4px}.reference-concept .concept-five{font-size:10px}}
@media(max-width:700px){
.reference-concept{padding:20px 4% 26px}.concept-paper{padding:20px 12px 24px}.reference-concept .concept-title h2{font-size:27px}.concept-intro{font-size:12px;line-height:1.8;margin:12px auto 18px;max-width:285px}
.reference-concept .concept-five{display:grid;grid-template-columns:repeat(5,1fr);font-size:10px;line-height:1.65;gap:0;align-items:start}.concept-principle{padding:0 2px;min-height:120px;border-color:#dae0df}.principle-icon{width:47px;height:47px;margin-bottom:9px}.concept-principle p{overflow-wrap:anywhere}.reference-concept .concept-key{display:block;font-size:20px;line-height:1.65;margin:15px 0 0}.reference-concept .concept-key em{display:block;width:fit-content;margin:10px 8px 0 auto;font-size:24px}
.reference-diagnosis{padding:14px 3% 20px}.reference-diagnosis .diagnosis-heading{display:block;padding:0 3%}.reference-diagnosis .diagnosis-heading h2{font-size:25px;line-height:1.4}.reference-diagnosis .diagnosis-heading h2 small{font-size:18px;padding-left:25px}.reference-diagnosis .diagnosis-heading p{font-size:12px;margin:18px 0 0;line-height:1.8}
.reference-diagnosis .diagnosis-list{grid-template-columns:repeat(2,1fr);gap:8px 5px;margin:18px 0 0}.reference-diagnosis .diagnostic{height:225px;padding:0;min-height:0;overflow:visible}.goods-art{height:100%;width:100%}.goods-copy{padding:28px 5px 0}.reference-diagnosis .diagnostic h3{font-size:19px;margin-bottom:7px}.reference-diagnosis .diagnostic p{font-size:11px;line-height:1.6;min-height:54px}.reference-diagnosis .purple h3{font-size:17px}.goods-copy>span{font-size:12px;min-height:36px;min-width:112px;padding:7px 11px}.goods-copy>small{font-size:9px}.reference-diagnosis .ticket .goods-copy{padding-top:45px}.reference-diagnosis .yellow .goods-copy{padding-top:39px}.reference-diagnosis .fan .goods-copy{padding-top:23px}.reference-diagnosis .purple .goods-copy{padding-top:45px}.reference-diagnosis .fan{height:250px}
}

.narrow-break{display:none}.principle-icon{width:48px;height:46px;mix-blend-mode:multiply}.concept-principle{border:0}.goods-art{height:200px;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.reference-diagnosis .diagnostic h3{font-size:18px;margin-bottom:6px}.reference-diagnosis .purple h3{font-size:17px}.reference-diagnosis .diagnostic p{font-size:11px;min-height:53px;line-height:1.5}.goods-copy>span{min-height:29px;font-size:11px}.reference-diagnosis .ticket .goods-copy,.reference-diagnosis .yellow .goods-copy,.reference-diagnosis .purple .goods-copy{padding-top:23px}.reference-diagnosis .fan .goods-art{height:250px}.reference-diagnosis .fan .goods-copy{padding-top:25px}.goods-copy>small{font-size:8px}.reference-diagnosis .diagnostic{height:222px}
@media(max-width:700px){.narrow-break{display:block}.concept-intro{max-width:none;font-size:12px}.reference-concept .concept-five{font-size:9px;line-height:1.7}.concept-principle{padding:0 1px;min-height:116px}.principle-icon{width:43px;height:43px}.goods-art{height:220px}.reference-diagnosis .diagnostic{height:236px}.reference-diagnosis .fan .goods-art{height:250px}.reference-diagnosis .ticket .goods-copy,.reference-diagnosis .yellow .goods-copy,.reference-diagnosis .purple .goods-copy{padding-top:25px}.reference-diagnosis .diagnostic h3{font-size:18px}.reference-diagnosis .purple h3{font-size:16px}.reference-diagnosis .diagnostic p{font-size:11px;min-height:55px}.goods-copy>span{min-height:34px;font-size:11px;min-width:110px}.reference-diagnosis .fan .goods-copy{padding-top:22px}.goods-copy>small{font-size:9px}}

.paper-corner{position:absolute;width:34px;height:40px;top:12px;mix-blend-mode:multiply}.corner-left{left:12px;transform:rotate(-8deg)}.corner-right{right:14px;transform:rotate(8deg)}
.goods-art{mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(transparent,#000 4%,#000 94%,transparent);mask-composite:intersect}
@media(max-width:700px){.reference-concept .concept-five{grid-template-columns:repeat(6,1fr);gap:14px 5px;font-size:12px;line-height:1.65}.concept-principle{grid-column:span 2;min-height:0;padding:0 2px}.concept-principle:nth-child(4),.concept-principle:nth-child(5){grid-column:span 3}.concept-principle p{overflow-wrap:normal}.principle-icon{width:43px;height:43px}.reference-concept .concept-key{margin-top:22px;font-size:19px}.paper-corner{width:25px;height:29px;top:8px}.corner-left{left:6px}.corner-right{right:7px}}

.principle-icon{mask-image:radial-gradient(ellipse,#000 55%,transparent 75%)}.paper-corner{mask-image:radial-gradient(ellipse,#000 55%,transparent 77%)}

.reference-diagnosis .ticket .goods-copy{padding-top:32px}.reference-diagnosis .yellow .goods-copy{padding-top:30px}.reference-diagnosis .purple .goods-copy{padding-top:32px}.reference-diagnosis .fan .goods-copy{padding-top:27px}
@media(max-width:700px){.reference-diagnosis .ticket .goods-copy,.reference-diagnosis .yellow .goods-copy,.reference-diagnosis .purple .goods-copy{padding-top:35px}.reference-diagnosis .fan .goods-copy{padding-top:24px}}