@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital@0;1&display=swap");@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@500&display=swap");html,body{background:white;font-size:0;line-height:0;margin:0;border:0;padding:0;width:100vw;-webkit-overflow-scrolling:touch;scroll-snap-type:y mandatory}:lang(ja) i,:lang(zh-CH) i,:lang(zh-Hans) i{margin:0 1px 0 -1px}.text-zh{transform:scaleX(0.95);transform-origin:left}a,p,div,div a,span,a:link{text-decoration:none;font-family:'EB Garamond', 'Noto Serif SC', serif;font-size:24px;color:#552a1b;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;hanging-punctuation:allow-end;font-variant-numeric:lining-nums;font-feature-settings:"kern" 1;font-kerning:normal}a[href^=tel]{text-decoration:inherit;color:inherit;-moz-font-feature-settings:"kern" 1;-ms-font-feature-settings:"kern" 1;-o-font-feature-settings:"kern" 1;-webkit-font-feature-settings:"kern" 1;font-feature-settings:"kern" 1;font-kerning:normal}.button-titleEn mark{color:#552a1b;padding-left:3px;background:white}html,body,div,span,p,a{user-select:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none}::selection{background:grey}::-moz-selection{background:grey}::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;background:transparent}.smoothTransform{perspective:1000px;position:fixed}.bg-logo img{position:fixed;width:20vw;margin:3vw;background:white;mix-blend-mode:multiply;transition:opacity 1s}.bg-logo .yiqi{transition-delay:0.5s}.bg-logo .number{opacity:0;width:auto;border:#552a1b 1px solid;height:12px;transition-delay:0s;padding:calc(4vw - 6px);margin:3vw;mix-blend-mode:normal}.logo-scrolled .yiqi,.logo-info .yiqi{opacity:0;pointer-events:none}.logo-scrolled .number,.logo-info .number{transition-delay:0.5s;opacity:1}.zoomcover{position:fixed;width:100vw;height:100vh;background:radial-gradient(white, white, white);pointer-events:none}.zooming{animation:zooming alternate 0.2s 2}@keyframes zooming{0%{background:radial-gradient(white, white, white)}50%{background:radial-gradient(#c7c7c7, #828282, #000)}100%{background:radial-gradient(#000, #000, #000)}}.projects-container{mix-blend-mode:multiply;width:100vw;position:absolute;float:left;padding:50vh 0 0 0;background:white}.projects-container .boundary{scroll-snap-align:center;float:left;height:14vw;width:100%}.projects-container .project{display:none;font-size:0;position:relative;width:100%;float:left}.projects-container .project .project-img{scroll-snap-align:center;height:8vw;padding:3vw;filter:grayscale(1) contrast(0.6)}.projects-container .project-showing{display:block}.projects-container .project-selected img,.projects-container .project-selected-top img,.projects-container .project-selected-bottom img{filter:grayscale(0) contrast(1) !important;background:#e0e0e0 !important;float:left !important}.projects-container .project-scaleM .project-img{height:20vw}.projects-container .project-scaleL .project-img{height:50vw}.projects-container .studio-info-container{scroll-snap-align:center;opacity:0.3;transition:opacity 0.5s;position:relative;float:left;width:100vw;top:25vh;background:white}.projects-container .studio-info-container .info{position:relative;margin:0 3vw 3vw 3vw;border:#552a1b solid 1px;padding:2vw}.projects-container .studio-info-container .info div,.projects-container .studio-info-container .info a,.projects-container .studio-info-container .info p{color:#552a1b;font-size:12px;line-height:4vw}.projects-container .studio-info-container .info .title,.projects-container .studio-info-container .info .title-en{display:inline}.projects-container .studio-info-container .tele div,.projects-container .studio-info-container .tele a,.projects-container .studio-info-container .tele p,.projects-container .studio-info-container .email div,.projects-container .studio-info-container .email a,.projects-container .studio-info-container .email p,.projects-container .studio-info-container .addr div,.projects-container .studio-info-container .addr a,.projects-container .studio-info-container .addr p,.projects-container .studio-info-container .icp div,.projects-container .studio-info-container .icp a,.projects-container .studio-info-container .icp p{display:inline}.projects-container .studio-info-container .tele .content,.projects-container .studio-info-container .email .content,.projects-container .studio-info-container .addr .content,.projects-container .studio-info-container .icp .content{width:calc(70% - 2vw) !important;height:5vw;position:absolute;left:30%;overflow-x:scroll;overflow-y:visible;white-space:nowrap}.projects-container .studio-info-container .about .content,.projects-container .studio-info-container .jobs .content{display:none;line-height:20px;hanging-punctuation:allow-end;font-variant-numeric:lining-nums;font-feature-settings:"kern" 1;font-kerning:normal}.projects-container .studio-info-container .info-content-show .content{display:block}.projects-container .studio-info-inview{opacity:1}.project-info-container{position:fixed;bottom:1vw;right:1vw;width:98vw;background:white}.project-info-container p{color:#552a1b}.controls{border-color:#552a1b;border-style:solid;border-width:1px}.controls,.zooms{position:fixed;transition:opacity 0.5s;background:white;opacity:0;pointer-events:none}.controls .text-zh,.zooms .text-zh{transform:scaleX(0.95);transform-origin:left}.types{position:fixed;transition:opacity 0.5s;opacity:0;pointer-events:none;padding-top:calc(8vw + 2px)}.types .button{color:rgba(73,38,25,0.3);width:fit-content;background-color:#fff;margin-top:-1px;border:1px dashed #552a1b}.types .button .text-zh{color:rgba(73,38,25,0.3);position:absolute;transform:scaleX(0.95);transform-origin:left}.types .type-selected,.types .type-initial{color:#552a1b;border:1px solid #552a1b;transform:translateZ(1px)}.types .type-selected .text-zh,.types .type-initial .text-zh{color:#552a1b}.zooms .button{display:block;text-align:center;border:1px solid #552a1b}.zooms .button-down{margin-top:-1px}.zooms .zoom-inactive{color:rgba(73,38,25,0.3);border:1px dashed #552a1b}.controls-reveal{transition-delay:0.5s;opacity:1;pointer-events:auto}.controls-detail{opacity:1;mix-blend-mode:normal;background:rgba(255,255,255,0.95);border-color:#552a1b}.controls-detail .button,.controls-detail .detail{color:#552a1b}.controls-detail .button-titleEn{left:50%;transform:translateY(-50%) skewX(-3deg)}.controls-detail .detail{overflow:scroll}.pics-container{mix-blend-mode:multiply;width:100vw;position:absolute;float:left;padding-bottom:8vh;background:white}.pics-container .project-pics{scroll-snap-align:center;position:relative;float:left}.pics-container .project-pics img{height:50vw;padding:3vw;float:left;transition-duration:1s;transition-property:background-color, filter;background:#efefef !important}.pics-container .project-pics .project-img{pointer-events:none;position:absolute;left:0;background:none !important}.pics-container .project-scaleL .project-img{pointer-events:none;height:auto;width:94vw;max-height:none}.pics-container .project-scaleL .project-img-thumbnail{pointer-events:none;height:auto;width:94vw;max-height:none}@media (min-width: 800px) and (min-aspect-ratio: 1 / 1){.bg-logo img{width:9vw;margin:2vw}.bg-logo .number{padding:1.5vh;height:14px;margin:2vw}.projects-container .project .project-img{height:4vw;padding:2vw}.projects-container .project-scaleM .project-img{height:10vw}.projects-container .project-scaleL .project-img{height:30vw}.projects-container .studio-info-container{top:5vh}.projects-container .studio-info-container .info{float:right;width:calc(50vw - 5vh);min-width:calc(700px - 5vh);margin:0 2vw 2vw 2vw;padding:calc(2.5vh - 11px) 2.5vh}.projects-container .studio-info-container .info div,.projects-container .studio-info-container .info a,.projects-container .studio-info-container .info p{font-size:14px;line-height:22px}.projects-container .studio-info-container .tele .content,.projects-container .studio-info-container .email .content,.projects-container .studio-info-container .addr .content,.projects-container .studio-info-container .icp .content{height:22px}.projects-container .studio-info-container .about .content,.projects-container .studio-info-container .jobs .content{line-height:22px}.projects-container .studio-info-container .about .content hr,.projects-container .studio-info-container .jobs .content hr{margin:calc(2.5vh - 11px) 0}.types{left:2vw;top:2vw;padding-top:calc(3vh + 16px)}.types .button{font-size:14px;line-height:14px;padding:1.5vh}.types .button span{font-size:14px;line-height:14px}.zooms{right:2vw;top:2vw}.zooms .button{font-size:14px;line-height:14px;padding:1.5vh;width:14px}.controls{height:5vh;color:white;bottom:2vw;right:2vw;width:50vw;min-width:700px}.controls .button,.controls .detail{position:absolute;transform:translateY(-50%);font-size:14px;line-height:14px;padding:2.5vh}.controls .text-zh{transform:scaleX(0.95) translateY(-50%)}.controls .button{top:2.5vh}.controls .detail{display:none}.controls .button-next,.controls .button-previous{display:none}.controls .button-previous{left:0}.controls .button-next{right:0}.controls .button-title{left:0;width:max-content;padding-right:55vw}.controls .button-titleEn{left:calc(50% - 2.5vh);transform:translateY(-50%) skewX(-3deg)}.controls-detail{opacity:1;height:23vh}.controls-detail .detail{display:block;width:42%}.controls-detail .project-time,.controls-detail .project-category{top:8.5vh}.controls-detail .project-location,.controls-detail .project-locationEn{top:11.5vh}.controls-detail .project-area,.controls-detail .project-areaEn{top:14.5vh}.controls-detail .project-structure,.controls-detail .project-structureEn{top:17.5vh}.controls-detail .project-service,.controls-detail .project-serviceEn{top:20.5vh}.controls-detail .project-time,.controls-detail .project-location,.controls-detail .project-area,.controls-detail .project-structure,.controls-detail .project-service{left:0}.controls-detail .project-category,.controls-detail .project-locationEn,.controls-detail .project-areaEn,.controls-detail .project-structureEn,.controls-detail .project-serviceEn{left:calc(50% - 2.5vh);width:50%}.pics-container{padding-bottom:10vh}.pics-container .project-pics{scroll-snap-align:start}.pics-container .project-pics img{height:20vw;padding:2vw;margin-bottom:-1.9vw}.pics-container .project-scaleL .project-img{height:88vh;width:auto}.pics-container .project-scaleL .project-img-thumbnail{height:88vh;width:auto}}@media (max-aspect-ratio: 1 / 1), (max-width: 800px){html,body{scroll-snap-type:none}.types{left:3vw;top:3vw}.types .button{font-size:12px;line-height:12px;padding:calc(4vw - 6px)}.types .button span{font-size:12px;line-height:12px}.zooms{right:3vw;top:3vw}.zooms .button{font-size:12px;line-height:12px;width:12px;padding:calc(4vw - 6px)}.controls{height:5vh;bottom:3vw;right:3vw;width:calc(94vw - 2px)}.controls .button,.controls .detail{font-size:12px;line-height:12px;position:relative}.controls .text-zh{transform:scaleX(0.95);transform-origin:left}.controls .button-next,.controls .button-previous{display:none}.controls .button{top:2.5vh}.controls .detail{display:none}.controls .button-title{position:absolute;transform:scaleX(0.95) translateY(-50%);left:0;padding:2.5vh 4vw;width:80vw}.controls .button-titleEn{position:absolute;transform:translateY(-50%) skewX(-3deg);left:auto;padding:2.5vh 4vw;right:0}.controls-detail{opacity:1;height:auto;padding:5vh 0 calc(2.5vh - 6px) 0}.controls-detail .detail{display:block;padding:0.5vh 4vw}.controls-detail .project-location,.controls-detail .project-area,.controls-detail .project-structure,.controls-detail .project-service,.controls-detail .project-locationEn,.controls-detail .project-areaEn,.controls-detail .project-structureEn,.controls-detail .project-serviceEn{left:0;width:90%}.controls-detail .project-location,.controls-detail .project-time{float:left;width:44%;padding-right:0}.controls-detail .project-locationEn,.controls-detail .project-category{float:right;text-align:right;width:44%;padding-left:0}}@media (max-width: 350px){.types .button{font-size:11px;line-height:11px;padding:calc(4vw - 5.5px)}.types .button span{font-size:11px;line-height:11px}.zooms .button{font-size:11px;line-height:11px;width:11px;padding:calc(4vw - 5.5px)}.controls .button,.controls .detail{font-size:11px;line-height:11px}}@media (min-aspect-ratio: 1 / 1) and (max-height: 500px){.bg-logo img{width:9vw;margin:2vw}.bg-logo .number{padding:1.5vh;margin:2vw}.types{left:2vw;top:2vw;padding-top:calc(3vh + 14px)}.types .button{padding:1.5vh}.zooms{right:2vw;top:2vw}.zooms .button{padding:1.5vh}.controls{height:8vh;bottom:2vw;right:2vw;width:calc(96vw - 2px)}.controls .button{top:4vh;padding:2.5vh 2vw}.controls-detail{height:auto}.controls-detail .detail{padding:0.5vh 2vw}.projects-container .studio-info-container .info{margin:0 2vw 2vw 2vw;padding:calc(4vh - 6px) 2vw}.projects-container .studio-info-container .info div,.projects-container .studio-info-container .info a{line-height:12px}.projects-container .project .project-img{height:8vh;padding:2vw}.projects-container .project-scaleM .project-img{height:16vh}}@media (max-aspect-ratio: 1 / 1) and (min-width: 750px){.bg-logo .number{height:14px;padding:calc(2.5vh - 7px)}.zooms .button,.zooms .detail,.types .button,.types .detail,.controls .button,.controls .detail,.controls-detail .button,.controls-detail .detail{font-size:14px;line-height:14px;padding:calc(2.5vh - 7px)}.zooms .button{width:14px}.types{padding-top:calc(5vh + 2px)}.controls-detail{padding:5vh 0 calc(2.5vh - 7px) 0}.controls-detail .detail{padding:0.5vh calc(2.5vh - 7px)}}@media (max-width: 260px){.studio-info-container,.types,.controls{display:none}}