*{box-sizing:border-box;padding:0;margin:0}img{width:100%;height:auto}html{font-size:62.5%}li{list-style:none}a{text-decoration:none}body{font-family:Noto Sans JP,sans-serif;font-optical-sizing:auto;background:#f5f5f5;color:#333}.primary-ttl{font-size:5rem;max-width:1400px;width:96%;margin:0 auto 5rem}.primary-ttl span{font-size:2rem;margin-left:3rem}.container-small{max-width:900px;width:96%;margin:0 auto}.container-small .primary-ttl{width:100%;max-width:900px}.header{width:100%}.header-container{max-width:1400px;width:96%;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:3.5rem 0}.header .logo{font-size:2rem;width:140px}nav ul{display:flex;align-items:center}nav ul li{margin-right:7rem}nav ul li:last-of-type{margin-right:0}nav ul li a{font-size:1.6rem;color:#333}.menu-btn{display:none}.main-visual{position:relative;padding-right:230px}.main-visual .copy-vertical span{background:#fff;display:inline-block;padding:1rem;letter-spacing:.17rem}.main-visual .picture{height:750px}.main-visual .picture img{width:100%;height:100%;object-fit:cover}.copy-vertical{position:absolute;top:30%;bottom:auto;right:calc(200px - 20px);font-size:1.6rem;writing-mode:vertical-rl}#about{margin-top:15rem}.about-container{display:flex}.about-container .about-picture{width:57%}.about-container .about-picture img{width:100%;height:700px;object-fit:cover}.about-container .about-content{width:53%;padding:4% 20rem 4rem 10%;margin:10vw 0 0 -10%;background:#f5f5f5;z-index:10}.about-container .about-content h2{font-size:2.4rem;padding-bottom:3rem;line-height:2}.about-container .about-content p{font-size:1.5rem;line-height:2}.primary-btn{display:flex;justify-content:space-between;align-items:center;position:relative;margin-top:5rem;padding:1em 2em;text-align:center;display:block;width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.primary-btn:before{top:calc(50% - 2px);transform:translateY(calc(-50% - 2px)) rotate(30deg);width:12px}.primary-btn:after,.primary-btn:before{content:"";position:absolute;right:-2em;height:2px;background-color:#333;transition:.3s}.primary-btn:after{top:50%;transform:translateY(-50%);width:70px}.primary-btn:hover:after,.primary-btn:hover:before{right:-2.5em}#works{margin-top:15rem}.works-container{max-width:1400px;width:96%;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap}.works-container .work{width:47%;margin-bottom:4rem}.works-container .work-img,.works-container .work-img img{width:100%;height:auto}.work-sub{margin-top:2rem}.work-sub p.work-ttl{font-size:2.2rem;font-weight:700;margin-bottom:.8rem}.work-sub p.work-desc{font-size:1.4rem;color:#999}#works .primary-btn{margin:4rem auto 0}#blog{margin-top:15rem}.blog-container{max-width:1400px;width:96%;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap}.blog-container .blog-inner{width:100%}.blog-container li{width:100%;border-bottom:1px solid #d1d1d1;padding-top:1.6rem;padding-bottom:1.6rem}.blog-container img{width:200px;height:140px;object-fit:cover;transition:all .3s}.blog-container a{display:flex;align-items:center}.blog-container .blog-content-right{margin-left:3rem}.blog-container .blog-content-right time{font-size:1.5rem;font-weight:700;color:#505050}.blog-container .blog-content-right span{display:inline-block;color:#fff;background:#333;font-size:1.3rem;padding:.2rem 1rem;margin-left:2rem}.blog-container .blog-content-right p{font-size:1.8rem;font-weight:700;color:#333;margin-top:1rem;position:relative}.blog-container p:after{position:absolute;left:0;content:"";width:100%;height:1px;background:#505050;bottom:-1px;transform:scaleX(0);transform-origin:right top;transition:transform .3s}.blog-container a:hover p:after{transform:scale(1);transform-origin:left top}.blog-container .blogImgWrapper{transition:all .2s}.blog-container a:hover .blogImgWrapper{opacity:.8}#blog .primary-btn{margin:4rem auto 0;display:block}#contact{width:100%;background:#111;margin-top:12rem;display:flex;align-items:center;justify-content:center;height:30rem}#contact p{font-size:2.4rem;font-weight:700}#contact h2,#contact p{color:#fff;text-align:center}#contact h2{font-size:3.6rem;margin-bottom:3rem}#contact .contact-container{display:flex;flex-direction:column;justify-content:space-between;align-items:center}#contact .contact-btn{margin:0 auto;background:#fff;color:#333;border:1px solid #fff;display:block;width:335px;text-align:center;font-size:1.6rem;padding:2rem 5rem;font-weight:700;transition:all .3s}#contact .contact-btn:hover{background:#111;color:#fff}footer ul{width:92%;display:flex;justify-content:end;padding-top:5rem}footer ul li{font-size:1.5rem;margin-right:7rem}footer ul li:last-of-type{margin-right:0}footer ul li a{color:#333}footer p{text-align:center;font-size:1.2rem;padding:3rem 0}.topBtn{position:fixed;opacity:0;width:55px;right:5rem;bottom:5rem;cursor:pointer;z-index:10;transition:all .3s}.topBtn.show{opacity:1}.sub-mv .copy-vertical span{background:#fff;display:inline-block;padding:1rem;letter-spacing:.17rem}@media screen and (max-width:1024px){.primary-ttl{width:92%}.container-small{max-width:100%;width:92%;margin:0 auto}.container-small .primary-ttl{width:100%;max-width:900px}.header{position:relative}.header-container{width:92%}.header nav{position:fixed;top:0;left:0;width:100%;height:100vh;background:hsla(0,0%,100%,.9);z-index:1;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:all .3s}.header.show nav{opacity:1;visibility:visible}.header nav ul{display:block;padding:0}.header nav ul li{margin-bottom:3rem}.header nav ul li a{font-size:2.2rem}.menu-btn{cursor:pointer;z-index:10}.menu-btn,.menu-btn span{display:block;width:28px;transition:all .3s}.menu-btn span{height:1px;background:#333;margin-bottom:.85rem}.menu-btn span:last-of-type{margin-bottom:0}.header.show .menu-btn span:first-of-type{position:absolute;top:50%;transform:translateY(-50%) rotate(45deg)}.header.show .menu-btn span:last-of-type{position:absolute;top:50%;transform:translateY(-50%) rotate(-45deg)}.header.show .menu-btn span:nth-of-type(2){opacity:0}.main-visual{padding-right:100px}.main-visual picture{height:625px}.copy-vertical{right:calc(100px - 20px)}#about{margin-top:10rem}.about-container{display:block}.about-container .about-picture img{width:100%;height:500px;object-fit:cover}.about-container .about-picture{width:100%;padding-right:15%}.about-container .about-content{width:100%;padding:4% 15% 4rem 4%;margin:1vw 0 0;background:#f5f5f5;z-index:10}#works{margin-top:10rem}.blog-container,.works-container{width:92%}footer ul{padding-top:3.5rem}}@media screen and (max-width:768px){.primary-btn{font-size:1.6rem}.header .logo{width:110px}.work-sub p.work-ttl{font-size:1.8rem;margin-bottom:.5rem}footer ul{display:block;margin:0 auto}footer ul li{font-size:1.5rem;margin-bottom:2rem}.topBtn{width:5rem;right:4%;bottom:4%;cursor:pointer;z-index:10;transition:all .3s}}@media screen and (max-width:549px){.primary-ttl{font-size:4rem;width:92%;margin-bottom:3rem}.primary-ttl span{font-size:1.8rem;margin-left:2rem}.primary-btn{display:flex;justify-content:space-between;align-items:center;position:relative;margin-top:5rem;padding:1em 2em;text-align:center;display:block;width:300px;color:#333;font-size:1.6rem;font-weight:700;background-color:#ccc;transition:.3s}.primary-btn:before{top:calc(50% - 2px);transform:translateY(calc(-50% - 2px)) rotate(30deg);width:12px}.primary-btn:after,.primary-btn:before{content:"";position:absolute;right:-2em;height:2px;background-color:#333;transition:.3s}.primary-btn:after{top:50%;transform:translateY(-50%);width:70px}.primary-btn:hover:after,.primary-btn:hover:before{right:-2.5em}.main-visual{padding-right:7vw}.copy-vertical{right:4vw}.works-container{display:block}.works-container .work{width:100%}#blog .blogImgWrapper{display:none}.blog-container li{margin-bottom:1rem}.blog-container .blog-content-right{margin-left:0}.blog-container .blog-content-right p{font-size:1.6rem}#contact p{font-size:2.2rem}#contact h2{font-size:3rem}#contact .contact-btn{max-width:100%;padding:1.5rem 0}}