.intro{position:fixed;top:0;width:100%;height:100%;background:#e6e1de;z-index:20}.intro:after{content:"";width:100%;height:100%;background-image:url(../images/intro.jpg);background-position:50% 50%;background-size:cover;background-repeat:no-repeat;opacity:.4;position:absolute;top:0;left:0;pointer-events:none}.intro-img{position:absolute;top:50%;left:50%;width:150px;z-index:2;opacity:0;transform:translate(-50%, -50%);transition:opacity .8s,transform 1s}.show-intro .intro-img{opacity:1;transform:translate(-50%, calc(-50% - 55px));transition:opacity .8s,transform 1s 2.9s}.intro-logo img{width:100%}.intro-logo svg{width:100%}.intro-logo #intro-tw1,.intro-logo #intro-tw2{opacity:0;transition:opacity 1s}.show-intro .intro-logo #intro-tw1,.show-intro .intro-logo #intro-tw2{opacity:1;transition-delay:.4s}.show-intro .intro-logo #intro-tw2{transition-delay:.9s}.intro-logo #intro-tw3{clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transition:clip-path 1s}.show-intro .intro-logo #intro-tw3{clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);transition-delay:1.4s}.intro-logo #intro-stamp{opacity:0;transition:opacity .8s,transform .8s}.show-intro .intro-logo #intro-stamp{opacity:1;transition-delay:2.4s}.intro-text{font-size:.875rem;-moz-text-align-last:justify;text-align-last:justify;letter-spacing:.2rem;line-height:1.8;position:absolute;left:50%;top:calc(50% + 65px);margin-left:17px;z-index:2;transform:translate(-50%, -50%)}.show-intro .intro-text span{opacity:1;transform:translateY(0);transition-delay:3.6s}.show-intro .intro-text span:last-child{transition-delay:4.2s}.intro-text span{display:block;opacity:0;transform:translateY(10px);transition:opacity 1.2s,transform 1.2s}.top-img{position:relative;height:100%;overflow:hidden}.top-img li{position:absolute;top:0;width:100%;height:100%;background-size:cover;background-position:center;transform:scale(1.1);transition:transform 8s}.top-img li.show-img{transform:scale(1)}.top-img li:nth-child(1){background-position:60% 65%}.top-img li:nth-child(2){background-position:35% 30%}.top-img li:last-child{background-position:50% 65%}.top-slogan li{position:absolute;color:#fff;text-shadow:0 0 5px #222;z-index:6}.top-slogan li:nth-child(1){left:8%;bottom:25%}.top-slogan li:nth-child(2){right:10%;bottom:20%}.top-slogan li:last-child{left:8%;bottom:22%}.top-big{font-size:1.5rem;font-family:"DM Serif Display",serif;letter-spacing:.25rem;opacity:0;transform:translateY(20px);transition:opacity 1s,transform 1s}.show-text .top-big{opacity:1;transform:translateY(0);transition-delay:.2s}.top-line{width:0px;height:1px;background:#fff;box-shadow:0 0 3px #666;margin:20px 0 20px -15px;transition:width 1s}.show-text .top-line{width:30px;transition-delay:.6s}.top-text{opacity:0;transform:translateY(-20px);transition:opacity 1s,transform 1s}.show-text .top-text{opacity:1;transform:translateX(0);transition-delay:.2s}.slogan-wrap{display:flex;flex-flow:row-reverse;align-items:flex-end;justify-content:flex-end;padding:0 10%}.slogan-img{width:65%}.slogan-img img{width:100%;aspect-ratio:5/2;-o-object-fit:cover;object-fit:cover;-o-object-position:50% 55%;object-position:50% 55%}.slogan-text{margin-left:10%;margin-bottom:6%}.slogan-text.show p{opacity:1;transform:translateX(0)}.slogan-text.show .slogan-en{opacity:1;transform:translateY(0)}.slogan-text.show .slogan-tw:before{height:100%;transition-delay:.4s}.slogan-text p{opacity:0;transform:translateX(-20px);transition:opacity .8s,transform .8s}.slogan-text p:nth-child(2){padding:15px 0}.slogan-text span{display:block}.slogan-tw{font-weight:normal;font-size:1rem;padding-left:30px;position:relative}.slogan-tw:before{content:"";width:1px;height:0;border-left:1px solid hsla(0,0%,80%,.5);position:absolute;top:0;left:0;transition:height .8s}.slogan-en{font-family:"DM Serif Display",serif;font-size:54px;font-weight:normal;line-height:60px;color:rgba(230,225,222,.4);letter-spacing:.4rem;margin-bottom:80px;opacity:0;transform:translateY(-20px);transition:opacity .8s,transform .8s}.about-wrap{display:flex;flex-flow:row-reverse;align-items:center}.about-img{width:42%;margin-right:10%}.about-img img{width:100%}.about-content{width:28%;padding:0 10%;position:relative}.about-line{position:absolute;left:0;width:100vw;height:1px;background:#ccc;z-index:-1}.about-text{padding-top:30px}.about-text span{display:block}.concept-wrap{display:flex;align-items:center;position:relative}.concept-img{width:23%;margin-left:10%}.concept-img img{width:100%}.concept-content{width:32%;padding:0 15%;margin-bottom:3vw}.concept-line{position:absolute;right:0;bottom:3vw;width:100vw;height:1px;background:#ccc;z-index:-1}.project-inner{padding:0 50px}.project-wrap{display:flex;flex-wrap:wrap;align-items:center;width:90%;margin:0 auto}.project-item{width:33.3333%;padding:2%;box-sizing:border-box}.project-item a:hover .project-img{filter:saturate(1);clip-path:polygon(2% 2%, 98% 2%, 98% 98%, 2% 98%)}.project-title{width:-moz-fit-content;width:fit-content;margin:auto}.project-image{position:relative;padding:0 20px 20px 0}.project-image:after{content:"";width:100%;height:100%;border-right:1px solid #ccc;border-bottom:1px solid #ccc;position:absolute;top:0;left:0}.project-img{filter:saturate(0.3);clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);transition:clip-path .8s}.project-img img{width:100%}.project-name{color:#000;margin-top:-11px;width:-moz-fit-content;width:fit-content;padding-right:10px;background:#fff;opacity:0;transform:translateX(-20px);transition:opacity .8s,transform .8s}.show .project-name{opacity:1;transform:translateX(0)}.slogan2-inner{padding:0 50px}.slogan2-text{text-align:center;color:#000}.slogan2-text.show .en{opacity:1;transform:translateY(0)}.slogan2-text.show .en:after{clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);transition-delay:.4s}.slogan2-text.show .tw{opacity:1;transform:translateY(0)}.slogan2-text .en{font-size:1.25rem;font-family:"DM Serif Display",serif;line-height:2;opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s}.slogan2-text .en:after{content:"";width:45px;height:1px;background:#999;display:block;margin:40px auto;clip-path:polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%);transition:clip-path .8s}.slogan2-text .en span{display:block}.slogan2-text .tw{font-size:1rem;opacity:0;transform:translateY(-20px);transition:opacity .8s,transform .8s}.award-wrap{display:flex;flex-flow:row-reverse;align-items:center}.award-img{width:24%;margin-right:12%}.award-img img{width:100%}.award-content{width:40%;padding:0 12%;position:relative}.award-line{position:absolute;left:0;width:100vw;height:1px;background:#ccc;z-index:-1}.award-list{padding-top:30px}.award-item{position:relative;padding-left:60px;margin-top:30px}.award-item:nth-child(1){margin-top:unset}.award-logo{width:35px;padding:5px;background:#f8f8f8;position:absolute;top:0;left:0}.award-logo img{width:100%}.award-text{font-size:.875rem}.award-work{color:#000;margin-bottom:3px}.contact-map{width:100%;height:45vw;max-height:670px}.contact-map-in{width:100%;height:100%}.contact-inner{position:relative;margin-top:50px}.contact-title{padding:0 50px;max-width:1100px;margin:0 auto 30px}.contact-line{position:absolute;left:0;width:100vw;height:1px;background:#ccc;z-index:-1}.contact-content{padding:30px 50px 0;max-width:1100px;margin:0 auto}.contact-list{display:flex;flex-wrap:wrap}.contact-list li{width:50%;font-size:.875rem;margin-bottom:10px}.contact-list li span:nth-child(1){margin-right:10px;display:inline-block;color:#999}.contact-list li a{transition:color .4s}.contact-list li a:hover{color:#000}.contact-social{padding-top:15px}.contact-social a{font-size:.875rem;color:#999;margin-right:5px;border:1px solid #ccc;padding:2px 0 1px 1px;width:23px;display:inline-block;text-align:center;transition:color .4s,background .4s}.contact-social a:hover{color:#fff;background:#999}@media screen and (max-width: 1300px){.slogan-img{width:60%}.slogan-img img{aspect-ratio:7/4}.slogan-text{margin-left:12%}.concept-img{width:30%}.concept-content{width:36%;padding:0 12%}.project-wrap{width:auto}.award-img{width:30%;margin-right:10%}.award-content{padding:0 10%}}@media screen and (max-width: 1100px){.slogan-img{width:45%}.slogan-img img{aspect-ratio:1/1;-o-object-position:50% 60%;object-position:50% 60%}.slogan-text{margin-left:15%;margin-bottom:10%}.about-wrap{display:block}.about-img{width:auto;max-width:750px;margin:0 auto}.about-content{width:auto;padding:0 50px;margin-top:50px}.about-title{max-width:600px;margin:0 auto 30px}.about-text{max-width:600px;margin:0 auto}.concept-img{width:35%;margin-left:7%}.concept-content{width:42%;padding:0 8%}.project-item{width:50%}.award-img{width:35%;margin-right:7%}.award-content{width:42%;padding:0 8%}.contact-map{height:60vw;max-height:550px}}@media screen and (max-width: 900px){.slogan-wrap{display:block}.slogan-img{margin-top:-100px}.slogan-img img{aspect-ratio:unset;-o-object-fit:unset;object-fit:unset;-o-object-position:unset;object-position:unset}.slogan-text{margin-left:unset;margin-bottom:unset}.slogan-tw{width:-moz-fit-content;width:fit-content;margin-left:auto}.concept-wrap{display:block}.concept-img{padding:0 50px;width:auto;max-width:420px;margin:0 auto}.concept-content{width:auto;max-width:640px;margin:50px auto 0;padding:0 50px 50px}.concept-line{bottom:0}.project-wrap{display:block}.project-item{width:auto;max-width:500px;margin:0 auto 40px;padding:unset}.project-item:last-child{margin-bottom:unset}.project-title{width:auto;margin-bottom:30px}.award-wrap{display:block}.award-img{padding:0 50px;width:auto;max-width:450px;margin:0 auto}.award-content{width:auto;margin-top:50px;padding:0 50px}.award-title{max-width:640px;margin:0 auto 30px}.award-line{left:unset;right:0}.award-list{max-width:640px;margin:0 auto}.contact-title{max-width:640px}.contact-content{max-width:640px}.contact-list{display:block}.contact-list li{width:auto}}@media screen and (max-width: 760px){.slogan-img{display:none}.slogan-tw{margin-left:unset}}@media screen and (max-width: 640px){.intro-img{width:130px}.show-intro .intro-img{transform:translate(-50%, calc(-50% - 60px))}.intro-text{top:calc(50% + 50px);margin-left:14px}.top-slogan li{width:100%;padding:0 30px;box-sizing:border-box}.top-slogan li:nth-child(1){left:5px;bottom:21%}.top-slogan li:nth-child(2){left:5px;right:unset;bottom:21%}.top-slogan li:last-child{left:5px;bottom:21%}.top-line{margin:15px 0 15px -15px}.slogan-inner{padding:0 30px}.slogan-wrap{padding:unset}.slogan-text{font-size:.875rem}.slogan-en{margin-bottom:50px;font-size:42px;line-height:48px}.slogan-tw{padding-left:25px}.about-content{padding:0 30px}.concept-img{padding:0 30px}.concept-content{padding:0 30px 50px}.project-inner{padding:0 30px}.project-item{margin-bottom:30px}.project-name{font-size:.875rem;margin-top:-10px}.slogan2-inner{padding:0 30px}.slogan2-text .en{font-size:1rem}.slogan2-text .en:after{width:35px;margin:30px auto}.slogan2-text .en span{display:initial}.slogan2-text .tw{font-size:.875rem}.slogan2-text .tw span{display:block}.award-img{padding:0 30px}.award-content{padding:0 30px}.award-item{padding-left:50px}.award-logo{width:30px;top:2px;padding:3px}.award-name{font-size:.75rem}.contact-map{height:450px}.contact-title{padding:0 30px}.contact-content{padding:30px 30px 0}.contact-list li span:nth-child(1){display:block;font-size:.75rem;margin-right:unset;margin-bottom:2px}.contact-social{padding-top:10px}}