:root{--bg-color: #f2f2f0;--text-color: #1a1a1a;--accent-color: #000;--sub-text: #666;--border-color: rgba(0, 0, 0, .1);--font-inter: "Inter", sans-serif;--font-jp: "Noto Sans JP", sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-inter),var(--font-jp);overflow-x:hidden;line-height:1.6;transition:background-color .8s ease,color .8s ease}#paper-layer{position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(https://www.transparenttextures.com/patterns/natural-paper.png);opacity:.3;pointer-events:none;z-index:999}#noise-layer{position:fixed;top:0;left:0;width:100%;height:100%;opacity:.05;pointer-events:none;z-index:1000;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3%3Cfilter id='noiseFilter'%3%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3%3C/filter%3%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3%3C/svg%3")}.container{max-width:1400px;margin:0 auto;padding:0 5vw}header{position:fixed;top:40px;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:0 5vw;z-index:100}.logo{font-weight:800;font-size:1.2rem;letter-spacing:.1em}.site-status{font-size:.7rem;letter-spacing:.2em;color:var(--sub-text)}.hero{height:100vh;display:flex;align-items:center;position:relative;overflow:hidden}.hero-bg-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:60vh;font-weight:800;color:#00000008;z-index:1;line-height:1}.hero-visual-container{position:absolute;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;z-index:2;overflow:hidden;perspective:2000px}.hero-main-img{width:120%;height:120%;object-fit:cover;opacity:.9}.reveal-text{position:relative;z-index:3;font-size:clamp(3rem,10vw,8rem);font-weight:800;line-height:.9;letter-spacing:-.02em}.reveal-text .line{display:block;overflow:hidden}.scroll-prompt{position:absolute;bottom:5vh;right:5vw;display:flex;flex-direction:column;align-items:center}.vertical-text{writing-mode:vertical-rl;font-size:.7rem;letter-spacing:.3em;margin-bottom:20px;color:var(--sub-text)}.scroll-prompt .line{width:1px;height:100px;background:var(--text-color);transform-origin:top}.concept{padding:20vh 0}.grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:center}.tag{font-size:.7rem;letter-spacing:.4em;color:var(--sub-text);display:block;margin-bottom:40px}.title{font-size:4rem;font-weight:700;margin-bottom:40px;line-height:1.2}.description{font-size:1.1rem;max-width:400px;color:var(--sub-text)}.visual-block{position:relative;display:flex;justify-content:center;align-items:center}.abstract-object{width:400px;height:500px;background:#000;position:relative;clip-path:polygon(10% 0,100% 0,90% 100%,0% 100%);transition:transform .5s ease;overflow:hidden}.concept-scroll-img{position:absolute;top:50%;left:-50%;height:100%;width:auto;object-fit:cover;transform:translateY(-50%);opacity:.6;filter:grayscale(1)}.caption-vertical{writing-mode:vertical-rl;position:absolute;right:-40px;font-size:.6rem;letter-spacing:.5em;color:var(--sub-text)}.philosophy{padding:30vh 0;position:relative;overflow:hidden}.door-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;z-index:10;pointer-events:none}.door{flex:1;height:100%;background:#1a1a1a}.container-philosophy{position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.footer-notice{position:fixed;bottom:58%;left:50%;transform:translate(-50%);font-size:1.6rem;font-weight:700;opacity:0;letter-spacing:.3em;color:inherit;text-align:center;filter:blur(30px);pointer-events:none;z-index:1001;width:100%}.big-quote{text-align:center}.quote-mark{font-size:10rem;display:block;line-height:1;font-family:serif;opacity:.1}.big-quote p{font-size:3rem;font-weight:700;line-height:1.4}.footer{padding:10vh 0 5vh;border-top:1px solid var(--border-color)}.footer-grid{display:grid;grid-template-columns:1fr 1fr;margin-bottom:10vh}.footer-info h3{font-size:1.5rem;letter-spacing:.1em;margin-bottom:20px}.footer-links a{display:block;text-decoration:none;color:inherit;font-weight:800;font-size:2rem;margin-bottom:10px;transition:opacity .3s}.footer-links a:hover{opacity:.5}.copyright{font-size:.7rem;color:var(--sub-text);text-align:center}@media (max-width: 768px){.grid{grid-template-columns:1fr;gap:60px}.title{font-size:3rem}.abstract-object{width:100%;height:300px}}@media (max-width: 768px){.nav-header{padding:1.5rem 20px!important}.hero{height:auto!important;min-height:80vh!important;padding:120px 20px 60px!important}.hero h1{font-size:clamp(2.5rem,10vw,4.5rem)!important}.hero-bg-text{font-size:35vw!important}.container{padding:0 20px!important}.concept{padding:60px 0!important}.title{font-size:clamp(2rem,8vw,3rem)!important}.big-quote{padding:60px 0!important}.big-quote p{font-size:clamp(1.6rem,6vw,2.4rem)!important}.footer-grid{grid-template-columns:1fr!important;gap:40px!important}.footer-links a{font-size:1.4rem!important}}

@media screen and (max-width: 834px) {
  html, body, #smooth-wrapper, #smooth-content, main {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: clip !important;
    position: relative !important;
  }
  .nav-header {
    padding: 1.2rem 20px !important;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }
  .hero {
    height: auto !important;
    min-height: 80vh !important;
    padding: 100px 20px 40px 20px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  .hero-visual-container {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    contain: paint !important;
    clip-path: inset(0) !important;
  }
  .hero-main-img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: cover !important;
  }
  .hero-bg-text {
    font-size: 35vw !important;
    overflow: hidden !important;
  }
  .container {
    padding: 0 20px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .concept, .philosophy, .visual-block, .door-container {
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    contain: paint !important;
    clip-path: inset(0) !important;
  }
  .caption-vertical {
    display: none !important; /* スマホでは画面外突き抜け防止のため非表示 */
  }
  .abstract-object {
    width: 100% !important;
    max-width: 100% !important;
    height: 280px !important;
  }
  /* フッター注釈の固定解除（文字被り根絶） */
  .footer-notice {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    opacity: 0.7 !important;
    filter: none !important;
    font-size: 0.95rem !important;
    margin: 30px auto 10px auto !important;
    text-align: center !important;
    width: 100% !important;
    display: block !important;
  }
  /* フッターグリッドの1列化・適正配置 */
  .footer {
    padding: 60px 20px 40px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .footer-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 40px !important;
  }
  .footer-info, .footer-links {
    width: 100% !important;
    max-width: 100% !important;
  }
  .footer-info h3 {
    font-size: 1.3rem !important;
    margin-bottom: 10px !important;
  }
  .footer-info p {
    font-size: 0.9rem !important;
  }
  .footer-links a {
    font-size: 1.1rem !important;
    margin-bottom: 12px !important;
    line-height: 1.5 !important;
    word-break: break-word !important;
  }
}