:root{--base-color: #eee;--sub-color: #333;--white-color: #fff;--border-color: #666;--font-text: "Zen Kaku Gothic New", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;--font-copy: "Playfair Display", "Zen Old Mincho", "Georgia", "Times New Roman", "Hiragino Mincho ProN", serif;--font-en: "Abel", "Zen Kaku Gothic New", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;--font-ja: "Zen Old Mincho", "Playfair Display", "Georgia", "Hiragino Mincho ProN", "MS Mincho", serif}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}@media(max-width:768px){html{font-size:14px}}body{background-color:var(--base-color);margin:0;position:relative;font-family:var(--font-en)}body:after,body:before{content:"";position:fixed;top:0;bottom:0;width:.5px;background-color:var(--border-color);z-index:10}body:before{left:25px}@media(max-width:768px){body:before{left:15px}}body:after{right:25px}@media(max-width:768px){body:after{right:15px}}section{display:flex;flex-direction:column;width:100%;border-bottom:solid .5px var(--border-color);padding:0 25px}@media(max-width:768px){section{padding:0 15px}}section:first-of-type{border-top:solid .5px var(--border-color);margin-top:25px}@media(max-width:768px){section:first-of-type{margin-top:15px}}button{border:none;background-color:transparent}img{width:100%;height:100%;object-fit:cover;display:block}video{width:auto;height:100%;object-fit:cover;display:block}a{text-decoration:none;color:inherit}li{list-style:none;color:inherit}#loader{position:fixed;top:0;left:0;width:100%;height:100vh;background-color:var(--base-color);z-index:9999;overflow:hidden}.line{position:absolute;background-color:var(--border-color)}.line-top,.line-bottom{height:.5px;left:0;right:0;width:100%}.line-left,.line-right{width:.5px;top:0;bottom:0;height:100%}.line-top{top:25px;transform:scaleX(0);transform-origin:left}.line-bottom{bottom:25px;transform:scaleX(0);transform-origin:right}.line-left{left:25px;transform:scaleY(0);transform-origin:bottom}.line-right{right:25px;transform:scaleY(0);transform-origin:top}.counter{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-copy);font-size:6rem;font-weight:300}@media(max-width:768px){.line-top{top:15px}.line-bottom{bottom:15px}.line-left{left:15px}.line-right{right:15px}}.hamburger-nav{position:fixed;top:45px;right:45px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:40px;cursor:pointer;z-index:2}@media(max-width:768px){.hamburger-nav{top:35px;right:30px}}.hamburger-nav>span{width:100%;height:2px;background-color:var(--sub-color)}.nav-section{height:66px}.hamburger-nav-content{position:fixed;top:0;right:0;width:50%;height:100vh;background-color:var(--white-color);z-index:3;display:none}@media(max-width:768px){.hamburger-nav-content{width:100%;height:100dvh}}.hamburger-nav-content:before{content:"";position:absolute;top:25px;left:0;right:0;height:.5px;background-color:var(--border-color)}@media(max-width:768px){.hamburger-nav-content:before{top:15px}}.hamburger-nav-content:after{content:"";position:absolute;bottom:25px;left:0;right:0;height:.5px;background-color:var(--border-color)}@media(max-width:768px){.hamburger-nav-content:after{bottom:15px}}.left-border{position:absolute;top:0;bottom:0;left:25px;width:.5px;background-color:var(--border-color)}@media(max-width:768px){.left-border{left:15px}}.hamburger-nav-content.is-active{display:flex}.nav-wrap{position:relative;width:100%;height:100%;margin:25px;display:flex;justify-content:center;align-items:center}@media(max-width:768px){.nav-wrap{margin:15px}}.close-btn{position:absolute;top:10px;left:10px;width:40px;height:40px;cursor:pointer;display:flex;justify-content:center;align-items:center}.close-btn>span{position:absolute;width:100%;height:2px;background-color:var(--sub-color)}.close-btn>span:nth-child(1){transform:rotate(45deg)}.close-btn>span:nth-child(2){transform:rotate(-45deg)}.contact-overlay{position:fixed;inset:25px;background-color:var(--sub-color);border:solid .5px var(--border-color);z-index:10000;display:flex;justify-content:center;align-items:center;color:var(--white-color);clip-path:circle(0% at 100% 0%);pointer-events:none;visibility:hidden}@media(max-width:768px){.contact-overlay{inset:15px}}.contact-overlay.is-open{pointer-events:auto;visibility:visible}.close-btn-fixed{position:absolute;top:25px;left:25px;width:40px;height:40px;cursor:pointer}.close-btn-fixed span{position:absolute;top:20px;width:100%;height:2px;background-color:var(--white-color)}.close-btn-fixed span:nth-child(1){transform:rotate(45deg)}.close-btn-fixed span:nth-child(2){transform:rotate(-45deg)}.contact-form-inner{opacity:0}.c-form{display:flex;flex-direction:column;gap:2rem}.c-form-item{display:flex;gap:1rem}@media(max-width:768px){.c-form-item{flex-direction:column;gap:1rem}}.c-form-item>label{min-width:120px;text-align:right}@media(max-width:768px){.c-form-item>label{min-width:120px;text-align:left}}.c-form-item>input,.c-form-item>textarea{min-width:400px;border:none;border-bottom:1px solid var(--white-color);border-radius:0;padding:.5rem;background-color:transparent;outline:none;color:#ccc}@media(max-width:768px){.c-form-item>input,.c-form-item>textarea{min-width:300px}}.c-form-item>input:focus,.c-form-item>textarea:focus{background-color:transparent;border-bottom:1px solid var(--white-color);color:#ccc}.c-form-item>input::placeholder,.c-form-item>textarea::placeholder{color:#999}.c-form-item>input:-webkit-autofill,.c-form-item>input:-webkit-autofill:hover,.c-form-item>input:-webkit-autofill:focus,.c-form-item>textarea:-webkit-autofill,.c-form-item>textarea:-webkit-autofill:hover,.c-form-item>textarea:-webkit-autofill:focus{transition:background-color 5000s ease-in-out 0s;-webkit-text-fill-color:#ccc!important}.submit-btn{display:inline-block;padding:.5rem 2rem;font-weight:600;margin:0 auto;background-color:#ccc;color:var(--sub-color);width:fit-content;transition:all .3s ease}.submit-btn:hover{background-color:var(--sub-color);color:#ccc;box-shadow:0 0 0 1px #ccc}.msg{font-size:14px;text-align:center;color:#fff}.border-b{border-bottom:solid .5px var(--border-color)}.title-set{display:flex;flex-direction:column;gap:.25rem;position:relative}@media(min-width:769px){.sp-only{display:none}}@media(max-width:768px){.dt-only{display:none}}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.index-hero{height:100vh}@media(max-width:768px){.index-hero{height:100dvh}}.hero-top{flex:0 0 25%;display:flex;position:relative;padding:20px}@media(max-width:768px){.hero-top{padding:15px}}.title{font-size:8rem;font-weight:400;line-height:.8;position:relative}@media(max-width:768px){.title{font-size:3rem}}.portfolio{position:absolute;top:0;right:-20%;font-size:2.5rem;line-height:1}@media(max-width:768px){.portfolio{right:-5%;font-size:1.5rem}}.ja-name{font-size:1.5rem;line-height:1.2}@media(max-width:768px){.ja-name{font-size:1rem}}.contact-btn{position:absolute;top:0;right:0;background-color:var(--sub-color);color:var(--white-color);padding:1rem 1.75rem;border-bottom-left-radius:25px;font-size:2rem;font-family:var(--font-en);cursor:pointer;transition:all .3s ease;transform-origin:right top}.contact-btn:hover{transform:scale(1.05)}@media(max-width:768px){.contact-btn{font-size:1.25rem;padding:.75rem 1.5rem}}.hero-center{flex:1;display:flex;min-height:0}@media(max-width:768px){.hero-center{flex-direction:column-reverse}}.hero-center-left{flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:20px}@media(max-width:768px){.hero-center-left{flex-direction:row;justify-content:space-between;align-items:flex-end;padding:15px}}.top-copy{display:flex;flex-direction:column;gap:1rem}.en-copy{font-size:4rem;line-height:1;font-family:var(--font-copy)}@media(max-width:768px){.en-copy{font-size:2rem}}.ja-copy{font-size:1.5rem;line-height:1;font-family:var(--font-ja)}@media(max-width:768px){.ja-copy{font-size:1rem}}.status>li{display:flex;gap:.25rem;font-size:.75rem}.status>li:before{content:"";width:6px;height:6px;background-color:var(--sub-color);flex-shrink:0;margin-top:.35rem}.hero-center-right{flex:1}.hero-bottom{flex:0 0 15vh;padding:20px;display:flex;justify-content:center;align-items:center}@media(max-width:768px){.hero-bottom{padding:15px}}.WorA{display:flex;justify-content:center;align-items:center;gap:40px;position:relative}.WorA a{position:relative;padding-bottom:15px;font-size:2rem;display:inline-block}.WorA a:first-child:before{content:"";position:absolute;top:35%;left:calc(100% + 10px);width:20px;height:1px;background-color:var(--sub-color);transform:translateY(-50%);pointer-events:none}.WorA a:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:6px;height:6px;background-color:var(--sub-color);opacity:0;transition:opacity .3s ease}.WorA a.is-active:after,.WorA a:hover:after{opacity:1}.work-genre{flex:1;display:flex;align-items:center;gap:10px;padding:20px;position:relative;font-size:2.5rem;font-family:Zen Kaku Gothic New,Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif}@media(max-width:768px){.work-genre{padding:15px;font-size:2rem}}.work-genre:before{content:"";width:24px;height:24px;background-color:var(--sub-color)}@media(max-width:768px){.work-genre:before{width:20px;height:20px}}.work-item{flex:3;display:flex;gap:20px;padding:20px}@media(max-width:768px){.work-item{flex-direction:column;padding:15px}}.work-img{flex:1;aspect-ratio:4/3}.work-content{flex:1;display:flex;flex-direction:column;justify-content:space-between}@media(max-width:768px){.work-content{gap:2rem}}.client{display:flex;justify-content:space-between}.client-name{font-size:2rem;line-height:1.2;font-weight:500}@media(max-width:768px){.client-name{font-size:1.75rem}}.projectType{display:flex;justify-content:center;align-items:center;border:solid 1px var(--sub-color);border-radius:40px;height:fit-content;padding:.5rem 1rem;width:fit-content;white-space:nowrap}.work-copy{width:75%}@media(max-width:768px){.work-copy{width:100%}}.work-copy>h4{font-size:1.75rem;font-weight:500;line-height:1.2;margin-bottom:.75rem;font-family:var(--font-ja)}@media(max-width:768px){.work-copy>h4{font-size:1.5rem}}.work-supplement{display:flex;justify-content:space-between;align-items:flex-end}.scope>li{display:flex;align-items:center;gap:.5rem}.scope>li:before{content:"";width:6px;height:6px;background-color:var(--sub-color);flex-shrink:0}.read-more{display:flex;justify-content:center;align-items:center;gap:.5rem;font-size:1.5rem;border-bottom:solid 1px var(--sub-color);width:fit-content;transition:all .3s ease}.read-more>span{font-size:2rem}.read-more:hover{transform:scale(1.1)}.banner-wrap{display:flex;gap:2rem;padding:20px;height:70vh;overflow-x:auto}.banner-item{display:flex;flex-direction:column;align-items:flex-end;gap:1rem;width:45%;height:100%;flex-shrink:0}@media(max-width:768px){.banner-item{width:90%}}.banner-img{flex:1;min-height:0;width:100%}.banner-content{flex:0 0 auto;width:100%;display:flex;align-items:center;justify-content:space-between}.about-hero-center-left{flex:1;display:flex;align-items:flex-end;padding:0 0 20px 20px}@media(max-width:768px){.about-hero-center-left{padding:0 0 15px 15px}}.about-hero-center{flex:6}.about-hero-center-right{flex:1;margin:20px}@media(max-width:768px){.about-hero-center-right{display:none}}.about-wrap{display:flex;gap:20px;padding:20px}@media(max-width:768px){.about-wrap{flex-direction:column;padding:15px}}.about-left{flex:0 0 50%;padding-right:10%;margin-bottom:20%}@media(max-width:768px){.about-left{flex:auto;padding-right:0;margin-bottom:5%}}.about-right{flex:1;display:flex;flex-direction:column}.about-item{display:flex;flex-direction:column;padding:20px;gap:2rem;margin-bottom:4rem}@media(max-width:768px){.about-item{gap:1rem;margin-bottom:2rem}}.about-title{font-size:2.5rem;line-height:1.2}.about-sub-title{font-size:1.25rem;line-height:1}.about-content{line-height:1.4;letter-spacing:.1em}.skill-table-th:before{content:"";width:12px;height:12px;background-color:var(--sub-color)}@media(max-width:768px){.skill-table-th:before{width:8px;height:8px}}.skill-table-th{display:flex;align-items:center;gap:.5rem;font-size:1.5rem;line-height:1}@media(max-width:768px){.skill-table-th{display:flex;align-items:center;gap:.5rem;font-size:1.5rem;line-height:1}}.skill-label{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.skill-label>span{border:solid 1px var(--border-color);padding:.25rem 1rem}.skill-table th,.skill-table td{padding:.5rem;vertical-align:top}.work-list{display:block;padding:20px;transition:all .3s ease}.list-title{font-size:1.5rem}@media(max-width:768px){.work-list{padding:15px}}.work-list:hover{background-color:var(--sub-color);color:var(--white-color)}.work-header{display:flex;padding:20px}@media(max-width:768px){.work-header{flex-direction:column;padding:15px}}.work-header-title{flex:1;display:flex;flex-direction:column;gap:2rem}@media(max-width:768px){.work-header-title{flex:1;flex-direction:row;gap:0;justify-content:space-between}}.work-title{display:flex;align-items:center;gap:.5rem;font-size:2rem;line-height:1}.work-title:before{content:"";width:24px;height:24px;background-color:var(--sub-color)}@media(max-width:768px){.work-title:before{width:20px;height:20px}}.work-sub-title{margin-left:2rem}.work-header-title>span{margin-left:2rem}.over-view{flex:1;display:flex;align-items:flex-start;gap:1rem;padding-top:2rem}@media(max-width:768px){.over-view{flex-direction:column;align-items:flex-start}}.heading{flex:1 0;font-size:1.25rem;font-weight:500;line-height:1;display:flex;align-items:center;gap:1rem;white-space:nowrap}.heading:after{content:"";flex:1;height:1px;background-color:var(--sub-color)}.work-top-img{height:80vh;padding:20px;border-radius:36px;margin:0 auto}@media(max-width:768px){.work-top-img{height:60vh;padding:15px}}.mobile-mockup{border-radius:36px;overflow:hidden;background-color:transparent}.info-header{display:flex;position:sticky;top:0;background-color:var(--base-color);z-index:3}.tab{flex:1;border-left:solid .5px var(--sub-color);padding:1rem;cursor:pointer;color:var(--sub-color)}.tab:not(:last-child){clip-path:polygon(0 0,calc(100% - 20px) 0,100% 50%,calc(100% - 20px) 100%,0 100%);margin-right:-20px}@media(max-width:768px){.tab:not(:last-child){clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%);margin-right:-10px}}.tab>h3{display:flex;justify-content:center;align-items:center;gap:.5rem;font-size:1.5rem;color:inherit}@media(max-width:768px){.tab h3{font-size:1.1rem}}.tab.is-active{z-index:2;background-color:var(--sub-color);color:var(--white-color)}.tab.is-active h3:before{content:"";width:20px;height:20px;background-color:var(--white-color)}@media(max-width:768px){.tab.is-active h3:before{display:none}}.tab-content{padding:4rem 8rem;display:none}@media(max-width:768px){.tab-content{padding:20px 15px}}.tab-content.is-active{display:block;animation:slideIn .3s ease forwards}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.tab-content-item{display:grid;grid-template-columns:repeat(5,1fr);gap:2rem;align-items:start;margin-bottom:2rem}.tab-content-item>h4{grid-column:span 1}@media(max-width:768px){.tab-content-item>h4{grid-column:span 5}}.heading{grid-column:2 / span 1;flex:1;width:100%}@media(max-width:768px){.heading{grid-column:span 5}}.tab-content-item>h4{font-size:1.5rem;line-height:1}.text-wrap{grid-column:span 3;flex:2}@media(max-width:768px){.text-wrap{grid-column:span 5;padding:0 10px}}.text-wrap>p{display:flex;gap:.5rem;margin-bottom:1rem}.text-wrap>p:before{content:"";width:5px;height:5px;background-color:var(--sub-color);flex-shrink:0;margin-top:.5rem}.parallax-section{position:relative;z-index:9000;width:100%;height:100vh;background-color:#000;overflow:hidden}.grid-container{position:absolute;width:150%;height:auto;min-height:150vh;left:-25%;top:0;transform:rotate(-5deg);transform-origin:center;display:flex;justify-content:center;gap:20px}@media(max-width:768px){.grid-container{width:200%;gap:10px}}.grid-column{display:flex;flex-direction:column;gap:20px;width:450px;will-change:transform}@media(max-width:768px){.grid-column{gap:10px;width:220px}}.grid-column:nth-child(1),.grid-column:nth-child(3),.grid-column:nth-child(5){margin-top:-1000px}@media(max-width:768px){.grid-column:nth-child(1),.grid-column:nth-child(3),.grid-column:nth-child(5){margin-top:-300px}}.grid-column:nth-child(2),.grid-column:nth-child(4){margin-top:-100px}@media(max-width:768px){.grid-column:nth-child(2),.grid-column:nth-child(4){margin-top:-10px}}.grid-item{width:100%;height:500px;border-radius:8px;overflow:hidden}@media(max-width:768px){.grid-item{width:100%;height:245px}}.view-more{display:flex;justify-content:center;align-items:center;height:40vh}@media(max-width:768px){.view-more{height:20vh}}.work-flow{display:flex;flex-direction:column;gap:1rem;padding:20px;width:60vw;margin:100px auto}@media(max-width:768px){.work-flow{padding:15px;width:90vw;margin:15px auto}}.flow-item{display:flex;align-items:flex-start;gap:1rem}@media(max-width:768px){.flow-item{flex-direction:column}}.banner-full{height:100vh;padding:50px 100px;display:flex;justify-content:center;align-items:center}@media(max-width:768px){.banner-full{height:auto;padding:15px}}.full-img{width:100%;height:100%}.full-img img{object-fit:contain}footer{display:flex;flex-direction:column;background-color:var(--sub-color);height:100vh}@media(max-width:768px){footer{height:100dvh}}.footer-wrap{width:100%;padding:0 25px;border-top:solid .5px var(--border-color);border-bottom:solid .5px var(--border-color);margin-top:25px;margin-bottom:25px;display:flex;flex-direction:column;height:100%}@media(max-width:768px){.footer-wrap{padding:0 15px;margin-top:15px;margin-bottom:15px}}.footer-top{flex:1;display:flex;position:relative;padding:20px}@media(max-width:768px){.footer-top{padding:15px}}.white{color:var(--white-color)}.footer-top>span{font-size:2rem;line-height:1;color:var(--white-color)}.footer-cta{background-color:var(--white-color);color:var(--sub-color)}.footer-center{flex:2;padding:20px;display:flex;justify-content:center;align-items:center;position:relative}.footer-WorA{color:var(--white-color)}.footer-WorA a:first-child:before{background-color:var(--white-color)}.footer-WorA a:after{background-color:var(--white-color)}.footer-status{color:var(--white-color);position:absolute;bottom:20px;left:20px}.footer-status>li:before{background-color:var(--white-color)}.footer-bottom{flex:1;display:flex;justify-content:center;align-items:center;position:relative;padding:20px}.last-message{font-size:3rem;color:var(--white-color)}.copy-right{position:absolute;bottom:15px;right:20px;font-size:.75rem;color:#aaa}
