.project-inner{padding:0 60px}.project-category{display:flex;align-items:center;margin:0 20px 60px}.project-sort{padding-left:25px;font-size:.875rem;margin-right:35px;position:relative;opacity:0;transform:translateX(-30px);transition:opacity .8s,transform .8s}.project-sort.show{opacity:1;transform:translateX(0)}.project-sort.show:nth-child(2){transition-delay:.2s}.project-sort.show:nth-child(3){transition-delay:.4s}.project-sort:before{content:"";width:4px;height:4px;border-top:1px solid #999;border-right:1px solid #999;position:absolute;top:50%;left:0;transform:translateY(-50%) rotate(45deg)}.project-sort a{color:#999;transition:color .4s}.project-sort a:hover{color:#666}.project-sort.active:before{animation:sort-arrow 1.4s infinite;border-top:1px solid #666;border-right:1px solid #666}.project-sort.active a{color:#000}.project-list{overflow:hidden}.project-item{float:left;width:31.3333%;margin:2% 1%}.project-item:nth-child(4n+2){margin-right:34.3333%}.project-item:nth-child(4n+3){margin-left:34.3333%}.project-item.coming .project-name{color:#999;font-style:italic}.project-item.show .project-image:after{height:calc(100% + 27px)}.project-item.show .project-img{clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)}.project-item.show .project-img:before{width:0;transition-delay:.8s}.project-item.show .project-img:after{height:0}.project-item.show .project-type{opacity:1;transition-delay:.8s}.project-item.show .project-name{clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);transition-delay:.8s}.project-item a:hover .project-img{filter:saturate(1) contrast(1)}.project-item a:hover .project-img img{transform:scale(1.15)}.project-image{position:relative}.project-image:after{content:"";width:1px;height:0;background:#c9caca;position:absolute;top:0;left:14px;z-index:-1;transition:height .8s linear}.project-img{width:calc(100% - 30px);margin-left:auto;overflow:hidden;filter:saturate(0.7) contrast(0.8);position:relative;transition:filter .8s}.project-img:before{content:"";width:100%;height:100%;background:#f8f8f8;position:absolute;top:0;right:0;transition:width .8s}.project-img:after{content:"";width:100%;height:100%;background:#fff;position:absolute;bottom:0;left:0;transition:height .8s}.project-img img{width:100%;transition:transform .8s}.project-type{font-family:"Cormorant",serif;font-size:.875rem;writing-mode:vertical-lr;padding:10px 0;background:#fff;position:absolute;left:0;bottom:-10px;opacity:0;transition:opacity .8s}.project-name{padding-left:30px;padding-top:10px;color:#000;letter-spacing:.12rem;text-align:right;display:flex;align-items:center;white-space:nowrap;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transition:clip-path .8s linear}.project-name:before{content:"";width:calc(100% + 15px);min-width:50px;height:1px;background:#c9caca;display:block;margin-right:10px;margin-left:-15px}@keyframes sort-arrow{0%{left:0}50%{left:8px}100%{left:0}}@media screen and (max-width: 1100px){.project-inner{padding:0 40px}.project-category{margin:0 15px 30px}.project-item{width:48%;margin:50px 1% 0}.project-item:nth-child(4n+2),.project-item:nth-child(4n+3){margin:50px 1% 0}.project-item.coming{display:none}}@media screen and (max-width: 900px){.project-inner{max-width:640px;margin:0 auto}.project-item{width:auto;margin:50px 0 0}.project-item:nth-child(4n+2),.project-item:nth-child(4n+3){margin:50px 0 0}}@media screen and (max-width: 640px){.project-inner{padding:0 30px;max-width:unset}.project-category{margin:0 10px 10px;display:block}.project-sort{margin-right:unset;margin-bottom:3px}.project-item.show .project-image:after{height:calc(100% + 24px)}.project-image:after{left:11px}.project-img{width:calc(100% - 27px)}.project-type{font-size:.75rem}.project-name{font-size:.875rem;letter-spacing:.1rem}.project-name:before{width:calc(100% + 18px);margin-left:-18px}}