@font-face{font-family:'10996';src:url(../font/10996.OTF)}@font-face{font-family:'10990';src:url(../font/10990.OTF)}@font-face{font-family:'10997';src:url(../font/10997.OTF)}.ProjectsTop{position:relative;padding-top:calc(var(--header-height) + 8vw * 9 / 16)}.ProjectsTop .title{font-size:clamp(26px, 4vw, 76px);line-height:1}.ProjectsTop .title span{display:block;color:#fe1822;margin-left:25%}.ProjectsTop .text{margin-left:25%;width:485px;font-size:16px;line-height:1.4;margin-top:calc(15vw * 9 / 16)}.ProjectsTop .img{display:block;margin-top:20px}.ProjectsTop .img img{display:block;width:100%}@media only screen and (min-width: 768px) and (max-width: 1023px){.ProjectsTop .text{font-size:14px}}@media only screen and (min-width: 0px) and (max-width: 767px){.ProjectsTop{padding-top:calc(var(--header-height) + 55px)}.ProjectsTop .title{font-size:38px}.ProjectsTop .title span{margin-left:25%}.ProjectsTop .text{margin-left:0%;width:100%;font-size:16px;margin-top:84px}}.ProjectsResult{position:relative;padding:calc(15vw * 9 / 16) 0}.ProjectsResult .title{font-size:clamp(28px, 2.3vw, 44px);line-height:1;margin-left:25%}.ProjectsResult .title span{color:#fe1822}.ProjectsResult .result{display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;counter-reset:section;gap:20px;margin-top:calc(8vw * 9 / 16)}.ProjectB{position:relative;overflow:hidden;display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-webkit-flex-direction:column;-moz-flex-direction:column;-ms-flex-direction:column;-o-flex-direction:column;flex-direction:column;justify-content:space-between;-webkit-order:4;-moz-order:4;-ms-order:4;-o-order:4;order:4;width:calc((100% - 20px * 3) / 4);aspect-ratio:1;background:#ededed;border-radius:4px;padding:15px 10px}.ProjectB:nth-child(1){-webkit-order:1;-moz-order:1;-ms-order:1;-o-order:1;order:1}.ProjectB:nth-child(2){-webkit-order:2;-moz-order:2;-ms-order:2;-o-order:2;order:2}.ProjectB:before{counter-increment:section;content:"0" counter(section);color:#fe1822;z-index:3;position:relative;letter-spacing:1px;font-weight:bold;font-size:12px}.ProjectB video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;filter:brightness(0.5)}.ProjectB .more{position:absolute;overflow:hidden;display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-ms-align-items:center;align-items:center;justify-content:center;z-index:3;top:5px;right:5px;background:#fff;border-radius:4px;width:44px;height:44px}.ProjectB .more:after{content:'';display:block;position:absolute;bottom:0;left:0;width:100%;height:0;background:#fe1822;transition:0.3s cubic-bezier(0, 0.25, 0, 1)}.ProjectB .more span{position:relative;z-index:2;font-weight:bold;transition:color 0.3s cubic-bezier(0, 0.25, 0, 1);font-size:20px}.ProjectB .name{position:relative;z-index:3;font-size:clamp(18px, 1.05vw, 20px);line-height:1.5}.ProjectB.video .name{color:#fff}@media (hover: hover){.ProjectB:hover .more{color:#fff}.ProjectB:hover .more:after{height:100%}}.ProjectBVideo{position:relative;overflow:hidden;width:calc((100% - 20px * 3) / 4);aspect-ratio:1;border-radius:4px;object-fit:cover;-webkit-order:3;-moz-order:3;-ms-order:3;-o-order:3;order:3}@media only screen and (min-width: 1280px) and (max-width: 1439px){.ProjectB{width:calc((100% - 20px * 2) / 3)}.ProjectBVideo{width:calc((100% - 20px * 2) / 3)}}@media only screen and (min-width: 1024px) and (max-width: 1279px){.ProjectB{padding:10px;width:calc((100% - 20px * 2) / 3)}.ProjectB .name{font-size:clamp(16px, 1.05vw, 20px)}.ProjectBVideo{width:calc((100% - 20px * 2) / 3)}}@media only screen and (min-width: 768px) and (max-width: 1023px){.ProjectB{width:calc((100% - 20px) / 2)}.ProjectBVideo{width:calc((100% - 20px) / 2)}}@media only screen and (min-width: 0px) and (max-width: 767px){.ProjectsResult{padding:40px 0}.ProjectsResult .title{font-size:28px;margin-left:0%}.ProjectsResult .result{gap:15px;margin-top:40px}.ProjectB{width:calc((100% - 15px) / 2);padding:10px}.ProjectB:before{font-size:12px}.ProjectB .name{font-size:16px;line-height:1.2}.ProjectBVideo{width:calc((100% - 15px) / 2)}}
/*# sourceMappingURL=projects.css.map */