.top-image{transform:scale(1.1);transition:transform 8s}.top-image.show-img{transform:scale(1)}.top-title{opacity:0;transform:translate(-50%, calc(-50% - 20px));transition:opacity 1s,transform 1s}.top-title .en:after{opacity:0;bottom:-5px;transition:opacity 1s,bottom 1s}.top-title.show-text{opacity:1;transform:translate(-50%, -50%)}.top-title.show-text .en:after{opacity:1;bottom:-25px;transition-delay:.4s}.project-category{padding-bottom:80px}.project-select{display:flex;justify-content:center;position:relative}.project-select.show li{opacity:1;transform:translateX(0)}.project-select.show li:nth-child(2){transition-delay:.2s}.project-select.show li:nth-child(3){transition-delay:.4s}.project-select.show li:nth-child(4){transition-delay:.6s}.project-select:after{content:"";width:100%;height:.5px;background:hsla(0,0%,80%,.7);position:absolute;top:50%;left:50%;z-index:-2;transform:translate(-50%, -50%)}.project-select li{padding:4px 12px 2px 15px;margin:0 15px;font-size:.75rem;cursor:pointer;position:relative;opacity:0;transform:translateX(-10px);transition:color .8s,opacity .8s,transform .8s}.project-select li:hover{color:#000}.project-select li:hover:after{background:#eee}.project-select li:after{content:"";width:100%;height:100%;background:#fff;border:1px solid hsla(0,0%,80%,.7);position:absolute;top:0;left:0;z-index:-1;transform:skewX(-15deg);transition:background .8s}.project-select li.active{color:#000}.project-inner{padding:0 50px 80px;max-width:1500px;margin:0 auto}.project-list{display:flex;flex-wrap:wrap}.project-item{width:31.3333333333%;margin:1%;box-sizing:border-box;position:relative}.project-item:before{content:"";width:100vw;height:calc(100vh - 90px);margin-top:90px;background:#f8f8f8;opacity:0;position:fixed;top:0;left:0;pointer-events:none;z-index:-1;transition:opacity .8s}.project-item:nth-child(4n+1) a.show .project-img:after{animation:imgT 1.4s}.project-item:nth-child(4n+2){margin-right:34.3333333333%}.project-item:nth-child(4n+2) a.show .project-img:after{animation:imgR 1.4s}.project-item:nth-child(4n+3){margin-left:34.3333333333%}.project-item:nth-child(4n+3) a.show .project-img:after{animation:imgB 1.4s}.project-item:nth-child(4n) a.show .project-img:after{animation:imgL 1.4s}.project-item:hover{z-index:9}.project-item:hover:before{opacity:.9}.project-item:hover .project-img{filter:saturate(1)}.project-item:hover .project-view{opacity:1;bottom:0}.project-item a{position:relative}.project-img{position:relative;filter:saturate(0.3);transition:transform .8s,filter .8s}.project-img:after{content:"";width:101%;height:101%;background:#f8f8f8;position:absolute;top:0;left:0;z-index:3;transform:scaleY(0)}.project-img img{width:100%;opacity:0;transition:opacity .4s}.show .project-img img{opacity:1;transition-delay:.6s}.project-text{padding-top:10px;width:100%;position:relative}.project-name{color:#000;font-size:1rem;font-weight:normal;opacity:0;transform:translate(10px, 20px);transition:opacity .8s,transform .8s}.show .project-name{opacity:1;transform:translate(10px, 0);transition-delay:.2s}.project-type{font-size:.75rem;color:#999;font-family:"DM Serif Display",serif;text-transform:capitalize;margin-left:1px;opacity:0;transform:translate(10px, 20px);transition:opacity .8s,transform .8s}.show .project-type{opacity:1;transform:translate(10px, 0);transition-delay:.2s}.project-view{width:30px;height:100%;position:absolute;bottom:-20px;right:10px;opacity:0;transition:opacity .8s,bottom .8s}.project-arrow{width:30px;height:30px;background:hsla(0,0%,100%,.3);border:1px solid #ccc;border-radius:50%;position:absolute;top:-41px;left:50%;transform:translateX(-50%)}.project-arrow:after{content:"+";text-align:center;color:#fff;font-size:1.25rem;display:block;margin-top:-2px;text-shadow:0 0 3px #666}.project-line{width:1px;height:calc(100% + 10px);background:#ddd;position:absolute;bottom:0;left:50%;transform:translateX(-50%)}.project-consult{position:relative}.project-consult:after{content:"";width:100%;height:.5px;background:hsla(0,0%,80%,.7);position:absolute;top:50%;left:50%;z-index:-2;transform:translate(-50%, -50%)}.project-btn{width:-moz-fit-content;width:fit-content;margin:0 auto;padding:0 15px;background:#fff}.project-btn a{position:relative;padding-left:22px;color:#999;font-size:.875rem;transition:color .8s}.project-btn a:hover{color:#666}.project-btn span{font-size:.75rem}.project-icon{text-align:center;position:absolute;top:0;left:0}.project-icon i{font-weight:400}@media screen and (max-width: 1100px){.project-category{padding-bottom:100px}.project-inner{padding:0 50px 100px}.project-list{gap:40px 10px;justify-content:space-between}.project-item{width:calc(50% - 10px);margin:unset}.project-item:hover .project-img{transform:scale(1)}.project-item:nth-child(4n+2),.project-item:nth-child(4n+3){margin:unset}.project-text{position:relative;top:unset;left:unset;pointer-events:auto}.project-arrow{top:-43px}.project-line{height:calc(100% + 12px)}}@media screen and (max-width: 900px){.project-inner{max-width:640px;margin:0 auto}.project-list{flex-flow:column;gap:40px 0}.project-item{width:auto}}@media screen and (max-width: 640px){.project-category{padding-bottom:70px}.project-select{flex-wrap:wrap;max-width:200px;margin:0 auto}.project-select:after{display:none}.project-select li{margin:8px;padding:3px 10px 1px 12px}.project-inner{padding:0 30px 70px}.project-list{gap:30px 0}.project-item:before{height:calc(100vh - 80px);margin-top:80px}.project-name{font-size:.875rem}}