:root{--primary: #d97a8c;--secondary: #f7e8ec;--accent: #7a5c61;--text: #333;--bg: #fff;--container: 1280px}*{box-sizing:border-box}html{scroll-behavior:smooth;margin:0}body{margin:0;background:var(--secondary);color:var(--text);font-family:Noto Sans JP,sans-serif}.container{max-width:var(--container);margin:0 auto}section{padding:120px 24px}.hero{min-height:100vh;display:flex;align-items:center;background-image:url(/color-muse/hero-bg.webp);background-size:cover;background-repeat:no-repeat;background-position:5% 20%;background-size:115%;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background:#ffffff80;z-index:0}.hero .container{position:relative;z-index:1;max-width:720px;margin-left:8%}.hero-copy{margin:0 0 24px;font-size:.95rem;font-weight:600;letter-spacing:.12em;color:var(--accent)}.hero h1{margin:0;font-size:clamp(3.5rem,6vw,6rem);line-height:1.2;font-weight:800;color:#333;text-shadow:0 4px 20px rgba(255,255,255,.8)}.hero h1 span{color:var(--primary)}.hero-description{margin:36px 0 52px;font-size:1.25rem;line-height:1.9;color:#444}.hero a{display:inline-flex;align-items:center;justify-content:center;min-width:280px;padding:20px 48px;border-radius:9999px;background:linear-gradient(135deg,#eb89a2,#d95d7b);color:#fff;text-decoration:none;font-size:1.05rem;font-weight:700;box-shadow:5px 5px 5px #d95d7b59;transition:transform .25s ease,box-shadow .25s ease,filter .25s ease}.hero a:hover{transform:translateY(-4px);filter:brightness(1.05);box-shadow:5px 5px 10px #d95d7b80}.hero a:active{transform:translateY(-1px)}.problems{background:#fff}.section-label{text-align:center;font-size:.8rem;font-weight:700;letter-spacing:.35em;color:#d97a8c;margin-bottom:24px}.problems h2{text-align:center;font-size:clamp(2rem,4vw,3rem);color:#4f4f4f;margin:0}.section-lead{max-width:700px;margin:24px auto 80px;text-align:center;line-height:1.9;color:#666}.problems-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.problem-card{background:#fff;border-radius:24px;overflow:hidden;border:1px solid #f0e4e7;transition:transform .3s ease,box-shadow .3s ease}.problem-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px #00000014}.problem-image{width:100%;height:280px;object-fit:cover;display:block}.problem-body{padding:40px}.problem-number{display:block;font-size:3rem;font-weight:800;color:#d97a8c26;line-height:1;margin-bottom:16px}.problem-card h3{margin:0 0 16px;font-size:1.35rem;line-height:1.6}.problem-card p{margin:0;line-height:1.8;color:#666}.features{background:#faf7f8}.features h2{text-align:center;font-size:clamp(2rem,4vw,3rem);margin:0}.features .section-lead{max-width:700px;margin:24px auto 80px;text-align:center;line-height:1.9;color:#666}.features-list{display:flex;flex-direction:column;gap:64px}.feature-card{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.feature-card.reverse .feature-image{order:2}.feature-card.reverse .feature-content{order:1}.feature-image{border-radius:24px;overflow:hidden;box-shadow:0 20px 40px #00000014}.feature-image img{width:100%;height:420px;object-fit:cover;display:block;transition:transform .4s ease}.feature-card:hover img{transform:scale(1.03)}.feature-number{display:block;font-size:5rem;font-weight:800;line-height:1;color:#d97a8c26;margin-bottom:16px}.feature-content h3{margin:0 0 20px;font-size:2.4rem;line-height:1.4}.feature-content p{margin:0;font-size:1.1rem;line-height:2;color:#666}.results{background:#fff}.results h2{text-align:center;margin:0;font-size:clamp(2rem,4vw,3rem)}.results .section-lead{text-align:center;max-width:700px;margin:24px auto 80px;color:#666;line-height:1.8}.result-overview{display:block;width:100%;max-width:1100px;height:auto;margin:0 auto 100px;border-radius:32px;box-shadow:0 20px 50px #00000014}.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}.result-card{background:#fff;border:1px solid #f0e4e7;border-radius:24px;overflow:hidden;position:relative;transition:transform .3s ease,box-shadow .3s ease}.result-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px #00000014}.result-card img{width:100%;height:240px;object-fit:cover;display:block;transition:transform .4s ease}.result-card:hover img{transform:scale(1.04)}.result-card h3{margin:24px 24px 12px;text-align:center;font-size:1.6rem}.result-card h3 span{display:block;margin-top:6px;font-size:.85rem;font-weight:400;color:#888}.result-card p{margin:0 24px 32px;text-align:center;line-height:1.8;color:#666}.spring h3{color:#ff8a65}.summer h3{color:#7b9acc}.autumn h3{color:#b87333}.winter h3{color:#5a5a8f}.voices{background:#faf7f8}.voices h2{text-align:center;margin:0;font-size:clamp(2rem,4vw,3rem)}.voices .section-lead{text-align:center;max-width:700px;margin:24px auto 80px;color:#666;line-height:1.8}.voice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.voice-card{background:#fff;border:1px solid #f0e4e7;border-radius:24px;padding:48px 40px;text-align:center;transition:transform .3s ease,box-shadow .3s ease}.voice-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px #00000014}.voice-avatar{width:120px;height:120px;object-fit:cover;border-radius:50%;display:block;margin:0 auto 24px}.voice-rating{font-size:1.1rem;color:#f6b73c;margin-bottom:20px}.voice-comment{margin:0 0 24px;line-height:1.9;color:#555}.voice-name{color:#888;font-size:.9rem}.faq{background:#fff}.faq h2{text-align:center;margin:0;font-size:clamp(2rem,4vw,3rem)}.faq .section-lead{text-align:center;max-width:700px;margin:24px auto 80px;color:#666}.faq-list{max-width:900px;margin:0 auto}.faq-item{background:#fff;border:1px solid #eee;border-radius:20px;margin-bottom:20px;overflow:hidden}.faq-item summary{cursor:pointer;list-style:none;padding:28px 36px;font-weight:700;font-size:1.2rem}.faq-item summary::-webkit-details-marker{display:none}.cta{background:linear-gradient(180deg,#fff,#faf4f6);padding:60px 24px;text-align:center}.cta .container{max-width:900px}.cta h2{margin:0;font-size:clamp(2.2rem,4vw,3.5rem);line-height:1.4}.cta .section-lead{max-width:700px;margin:24px auto 48px;color:#666;line-height:1.8;font-size:1.1rem}.cta-button{display:inline-flex;align-items:center;justify-content:center;min-width:320px;padding:24px 56px;border-radius:999px;text-decoration:none;font-size:1.2rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#e67b95,#d95d7b);box-shadow:5px 5px 5px #d95d7b59;transition:transform .3s ease,box-shadow .3s ease,filter .3s ease}.cta-button:hover{transform:translateY(-5px);filter:brightness(1.05);box-shadow:0 10px 10px #d95d7b59}.cta-button:active{transform:translateY(-2px)}.cta-note{margin-top:20px;color:#999;font-size:.9rem}.problems h2,.features h2,.results h2,.voices h2,.faq h2,.cta h2{font-size:clamp(2.5rem,5vw,4rem);line-height:1.3}.faq-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease,opacity .35s ease;opacity:0}.faq-content p{overflow:hidden;margin:0;padding:0 32px 24px;line-height:1.8;color:#666}.faq-item[open] .faq-content{grid-template-rows:1fr;opacity:1}.faq-item{transition:box-shadow .3s ease,border-color .3s ease}.faq-item[open]{border-color:#f0d7de;box-shadow:0 12px 30px #0000000a}.faq-item summary{position:relative}.faq-item summary:after{content:"+";position:absolute;right:32px;top:50%;transform:translateY(-50%);font-size:1.5rem;color:var(--primary);transition:transform .3s ease}.faq-item[open] summary:after{transform:translateY(-50%) rotate(45deg)}.header{position:fixed;top:0;left:0;width:100%;z-index:999;backdrop-filter:blur(16px);background:#fffc;border-bottom:1px solid rgba(0,0,0,.05)}.header-inner{height:80px;max-width:90vw;display:flex;align-items:center;justify-content:space-between}.logo{font-size:1.3rem;font-weight:700;color:#d95d7b;text-decoration:none;letter-spacing:.05em}.nav{display:flex;gap:40px}.nav a{color:#444;text-decoration:none;font-size:.95rem;transition:.3s}.nav a:hover{color:var(--primary)}.header-cta{display:inline-flex;align-items:center;justify-content:center;padding:14px 24px;border-radius:999px;background:linear-gradient(135deg,#e67b95,#d95d7b);color:#fff;text-decoration:none;font-weight:700;box-shadow:0 5px 5px #d95d7b40;transition:.3s}.header-cta:hover{transform:translateY(-2px);box-shadow:0 5px 5px #d95d7b80}.hamburger{display:none;width:44px;height:44px;background:none;border:none;cursor:pointer;padding:0;z-index:1001}.hamburger span{display:block;width:28px;height:3px;margin:6px auto;background:#333;border-radius:999px;transition:.3s}.desktop-only{display:inline-flex}.mobile-only{display:none}@media(max-width:768px){.hamburger{display:block}.desktop-only{display:none}.mobile-only{display:inline-flex;justify-content:center;align-items:center;width:100%;margin-top:12px;padding:18px 24px;border-radius:999px;background:linear-gradient(135deg,#eb89a2,#d95d7b);color:#fff;font-weight:700;text-decoration:none;box-shadow:0 12px 30px #d95d7b40}.nav{position:fixed;top:80px;left:16px;right:16px;padding:40px 32px;display:flex;flex-direction:column;align-items:center;gap:28px;background:#fffffff2;backdrop-filter:blur(18px);border-radius:28px;border:1px solid #f3dce3;box-shadow:0 20px 60px #d97a8c26;transform:translateY(-20px);opacity:0;pointer-events:none;transition:opacity .35s ease,transform .35s ease}.nav.active{transform:translateY(0);opacity:1;pointer-events:auto}.nav a{font-size:1.1rem;font-weight:600;color:var(--accent);text-decoration:none;transition:.25s}.header-cta{color:#fff!important}.nav a:hover{color:var(--primary);transform:translateY(-2px)}.hamburger.active span:nth-child(1){transform:translateY(9px) rotate(45deg)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}.section-label{margin-top:-20px}}.footer{color:var(--accent);padding:80px 24px 32px}.footer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:80px;margin-bottom:48px}.footer-brand h2{margin:0 0 16px;font-size:1.8rem}.footer-brand p{max-width:400px;color:var(--accent);line-height:1.8}.footer-nav{display:flex;flex-direction:column;gap:16px}.footer-nav a{color:var(--accent);text-decoration:none;transition:.3s}.footer-nav a:hover{color:var(--accent);opacity:.7}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;text-align:center;font-size:.9rem}.privacy{padding:100px 24px 120px}.privacy .container{max-width:900px}.privacy h1{margin-bottom:16px;text-align:center;font-size:clamp(2.5rem,5vw,4rem)}.updated{text-align:center;color:#888;margin-bottom:80px}.privacy section{padding:0;margin-bottom:56px}.privacy h2{margin-bottom:20px;font-size:1.5rem;color:var(--accent)}.privacy p,.privacy li{line-height:2}.privacy ul{padding-left:24px}.diagnosis{min-height:100vh;min-height:100dvh;padding:160px 24px;background:linear-gradient(180deg,#fff,#faf4f6)}.diagnosis-card{max-width:700px;margin:0 auto;background:#fff;padding:64px;border-radius:32px;text-align:center;box-shadow:0 20px 50px #0000000f}.diagnosis h1{margin-bottom:16px;font-size:clamp(2rem,4vw,3rem)}.diagnosis-lead{margin-bottom:40px;color:#666;line-height:1.8}#imageInput{margin-bottom:32px}.diagnosis-button{display:inline-flex;align-items:center;justify-content:center;min-width:280px;padding:20px 48px;border-radius:999px;text-decoration:none;color:#fff;font-weight:700;background:linear-gradient(135deg,#e67b95,#d95d7b)}.upload-area{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;width:100%;min-height:320px;margin-bottom:40px;border:2px dashed #e6cfd6;border-radius:24px;background:#fcf8f9;cursor:pointer;transition:border-color .3s ease,transform .3s ease,background .3s ease}.upload-area:hover{border-color:var(--primary);background:#fff6f8;transform:translateY(-2px)}.upload-icon{font-size:4rem}.upload-area h2{margin:0;font-size:1.5rem}.upload-area p{margin:0;color:#777}.preview.show{display:block}.upload-button{display:inline-flex;align-items:center;justify-content:center;margin-top:24px;width:260px;height:60px;border:2px dashed #d97a8c;border-radius:16px;cursor:pointer;transition:.3s}.upload-button:hover{background:#fff4f7}.preview{display:none;width:240px;height:240px;object-fit:cover;border-radius:20px;margin:32px auto}.diagnosis-button{display:none}.diagnosis-button.show{display:inline-flex}.analyzing{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#fff,#faf4f6)}.analyzing-card{text-align:center;max-width:700px;margin:0 auto}.analyzing h1{margin:24px 0 16px;font-size:clamp(2rem,4vw,3rem)}.analyzing-lead{color:#666;line-height:1.8}.spinner{width:90px;height:90px;margin:0 auto 24px;border:6px solid #f2d9e0;border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.result-page{padding:100px 24px;background:#fff}.result-hero{text-align:center;margin-bottom:100px}.result-hero h1{font-size:clamp(3rem,6vw,5rem);margin:0}.result-hero span{color:var(--primary)}.result-summary{margin-top:24px;font-size:1.2rem;color:#666}.result-detail{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-bottom:120px}.result-detail img{width:100%;border-radius:24px;display:block}.result-detail p{line-height:2;color:#666}.recommend-section{margin-bottom:100px}.recommend-section h2{text-align:center;margin-bottom:40px}.color-palette{display:flex;justify-content:center;gap:24px}.color-chip{width:100px;height:100px;border-radius:50%;border:1px solid rgba(0,0,0,.08);box-shadow:0 4px 12px #00000080;box-sizing:border-box}.recommend-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}.recommend-card{padding:40px;border-radius:24px;background:#faf7f8;text-align:center}.caution{border:1px solid #f3d9df}.result-bottom{text-align:center;display:flex;justify-content:center;align-items:center;flex-direction:column;margin-top:80px}.result-bottom a{display:flex;align-items:center;justify-content:center;width:260px;min-width:280px;padding:20px 48px;border-radius:999px;text-decoration:none;color:#fff;font-weight:700;background:linear-gradient(135deg,#e67b95,#d95d7b)}@media(max-width:768px){section{padding:60px 20px}.hero{min-height:auto;padding:160px 20px 100px;background-position:65% center;background-size:cover}.hero h1{font-size:clamp(2.5rem,10vw,4rem)}.hero-description{font-size:1rem;line-height:1.8}.hero a,.cta-button{width:100%;min-width:auto}.problems-grid,.voice-grid,.result-grid,.recommend-grid{grid-template-columns:1fr}.problem-body{padding:32px}.feature-content h3{font-size:2rem}.feature-card{grid-template-columns:1fr;gap:40px}.feature-card.reverse .feature-image,.feature-card.reverse .feature-content{order:initial}.result-page{padding:40px 10px;border-radius:10px}.result-overview{width:100%;margin-bottom:60px}.result-hero h1{font-size:clamp(2rem,8vw,3rem);line-height:1.4}.result-summary{font-size:1rem}.result-detail{grid-template-columns:1fr;gap:32px;text-align:center}.result-detail img{width:100%;max-width:360px;margin:0 auto}.color-palette{display:flex;justify-content:center;flex-wrap:wrap;gap:16px}.recommend-card{padding:24px}.result-bottom{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:80px;text-align:center}.result-bottom a{width:100%;max-width:320px}.cta{padding:0 20px 40px}.diagnosis-card{padding:40px 24px}.upload-area{min-height:240px}.preview{width:100%;max-width:320px;height:320px}}@media(max-width:480px){.hero{background-position:70% center}.hero h1,.result-hero h1{font-size:2.2rem}.section-label{letter-spacing:.2em}.feature-content h3{font-size:1.7rem}.problem-number,.feature-number{font-size:3rem}.voice-card,.diagnosis-card{padding:24px}.faq-item summary{padding:20px 24px;font-size:1rem}.faq-item summary:after{right:24px}.result-detail img{max-width:100%}.recommend-section h2{font-size:1.5rem}.recommend-card h3{font-size:1.1rem}.problems h2,.features h2,.results h2,.voices h2,.faq h2,.cta h2{font-size:clamp(2.5rem,5vw,4rem);line-height:1.3;color:var(--accent)}.color-palette{display:grid;grid-template-columns:repeat(2,120px);justify-content:center;gap:16px}}.home-link{display:block!important;width:fit-content!important;min-width:0!important;margin:40px auto 0!important;color:var(--accent);font-size:.95rem;font-weight:600;text-align:center;text-decoration:none;transition:color .25s ease,opacity .25s ease}.home-link:hover{color:var(--primary);opacity:.75}