@charset "UTF-8";html{scroll-behavior:smooth;scroll-padding-top:100px}p{margin:0}.H2_worksTitleWap,.works_webSiteWap,.works_bannerWap,.works_retouchWap,.aboutSectionTop,.works_graphicWap,.illustration_section{width:360px;margin:0 auto;text-align:center}.h2_wap{margin:120px 0 30px;width:120px}.h2_works_wap{margin:0 0 30px;width:120px}.h2_top_about,.h2_top_works{font-size:4rem;margin-bottom:4px;position:relative;display:inline-block;font-weight:500;transform:translateY(20px);opacity:0;transition:opacity .6s ease-out,transform .6s ease-out}.h2_top_about:after,.h2_top_works:after{content:"";position:absolute;left:50%;bottom:0;width:0;height:1px;background-color:#5c4033;transition:width .6s ease-out,left .6s ease-out}.h2_top_about.line,.h2_top_works.line{opacity:1;transform:translateY(0)}.h2_top_about.line:after,.h2_top_works.line:after{width:100%;left:0}.h2sab,.h2sab_work{text-align:center}.h2sab_work{padding-right:0}h3.h3_topPage,h3.h3_topPage_retouch{display:inline-block;font-size:2.8rem;text-align:center;margin-bottom:20px}.illustration_sab{font-size:1.4rem}.mockUp_img{width:360px}@media screen and (min-width:769px){.aboutSectionTop,.H2_worksTitleWap,.works_bannerWap,.works_retouchWap,.works_graphicWap,.illustration_section{max-width:1200px;width:auto;margin:120px auto 0}.h2_wap{margin:60px 0 80px;max-width:1200px;width:230px}.h2_works_wap{margin:120px 0 60px;max-width:1200px;width:240px}h2.h2_top_about,h2.h2_top_works{font-size:8rem}h3.h3_topPage,h3.h3_topPage_retouch{font-size:4rem;margin:40px auto 30px}}.scroll-indicator{display:flex;flex-direction:column;align-items:center;gap:10px;position:absolute;top:74vh;left:50%;transform:translateX(-50%)}.scroll-indicator span{width:15px;height:15px;background-color:#6e4722;border-radius:50%;opacity:0;animation:fadeEffect 1.5s infinite ease-in-out}.scroll-indicator span:nth-child(1){animation-delay:0s}.scroll-indicator span:nth-child(2){animation-delay:.4s}.scroll-indicator span:nth-child(3){animation-delay:.8s}@keyframes fadeEffect{0%,100%{opacity:0}50%{opacity:1}}.scroll-text{font-size:1.8rem;font-weight:700;color:#734e30;margin-bottom:8px;letter-spacing:2px;font-family:"Lora"}@media screen and (min-width:547px){.scroll-indicator{display:flex;flex-direction:column;align-items:center;gap:10px;position:absolute;top:79vh;left:50%;transform:translateX(-50%)}}@media screen and (min-width:769px){.scroll-indicator{display:flex;flex-direction:column;align-items:center;gap:10px;position:absolute;top:83vh;left:50%;transform:translateX(-50%)}.scroll-indicator span{width:30px;height:30px;background-color:#6e4722;border-radius:50%;opacity:0;animation:fadeEffect 1.5s infinite ease-in-out}.scroll-indicator span:nth-child(1){animation-delay:0s}.scroll-indicator span:nth-child(2){animation-delay:.4s}.scroll-indicator span:nth-child(3){animation-delay:.8s}@keyframes fadeEffect{0%,100%{opacity:0}50%{opacity:1}}.scroll-text{font-size:2rem;font-weight:700;color:#734e30;margin-bottom:8px;letter-spacing:2px;font-family:"Lora"}}#mainVisual{height:80vh;width:100vw;background-image:url('/wp-content/themes/nana-Portfolio/assets/imgs/room_sp_main.png');background-repeat:no-repeat;background-size:cover;background-position:bottom}.image-container{position:relative;width:100%;height:auto}.hide{opacity:0;display:none;transition:opacity 1s ease-in-out}.mainx3{opacity:1;display:block;transition:opacity 1s ease-in-out}#lottie-container{display:block;position:absolute;width:100%;height:100vh;justify-content:center;align-items:center;z-index:10;background:#fff;top:0;transition:opacity .3s ease-in-out;background-repeat:no-repeat;overflow:hidden}#lottie-container>svg{display:block !important;max-width:100%;max-height:100vh}#lottieWithCat{position:absolute;top:56vh;left:50%;transform:translate(-50%,-50%);width:350px;height:250px}#lottieWithCat svg{display:block;position:absolute;top:0;left:0}.mainVisual .h1_wap{position:absolute;width:60vw;padding-left:2%;top:32px}@media screen and (min-width:547px){#mainVisual{height:97vh;background-image:url('/wp-content/themes/nana-Portfolio/assets/imgs/room_pc_main.png');position:relative;background-size:cover;background-position:center;width:auto}.mainVisualImg_wap{height:822px}.visualImg_wap{display:block;width:100vw;height:100vh;margin:0 auto}.mainVisual .h1_wap{position:absolute;top:0;padding-left:9%;width:44vw}.h1sab{font-size:3.8rem;color:#a98c74}#lottie-container{margin:auto;padding-top:30px}#mainVisual.anime{opacity:1}#lottieWithCat{position:absolute;top:552px;left:50%;transform:translate(-50%,-50%);width:450px;height:360px}}@media screen and (min-width:1300px){.mainVisual .h1_wap{position:absolute;top:34px;padding-left:9%;width:550px}}.fixed-work-button{position:fixed;bottom:20px;right:15px;background-color:#6b4f3f;color:#fff;padding:30px 3px;border-radius:50px;font-size:1.5rem;text-decoration:none;box-shadow:0 4px 10px rgba(0,0,0,.4);z-index:1000;transition:background-color .3s ease}.fixed-work-button:hover{background-color:#a0826b}@media screen and (min-width:547px){.fixed-work-button{padding:46px 16px}}.aboutDetail{text-align:center;margin-bottom:150px}.myPhoto{border-top-left-radius:85px;border-top-right-radius:85px;height:334px;width:250px;margin-bottom:20px}.aboutSection{text-align:center;margin:0 auto 150px;line-height:1.6em;display:block}.name{margin-bottom:10px;font-size:1.8rem}.small{font-size:1.4rem}.message{text-align:left;width:360px;line-height:2.4rem;margin:0 auto 20px}*,*:before,*:after{-webkit-box-sizing:inherit;box-sizing:inherit}.btn,a.btn,button.btn{font-weight:700;line-height:1.5;position:relative;display:inline-block;padding:1rem 4rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all .3s;transition:all .3s;text-align:center;vertical-align:middle;text-decoration:none;letter-spacing:.1em;color:#212529;border-radius:.5rem}a.btn-malformation{font-family:"Lora";font-weight:800;padding:1.8rem 2.5rem;color:#5a3e2e;border-radius:100% 80px/80px 100%;opacity:0;transform:scale(.8);transition:opacity .3s ease-out}a.btn-malformation.poyon{animation:h3_topPage .8s ease-out forwards}.btn-malformation--pastel{background:#f5ede4;-webkit-box-shadow:30px 10px 0 #eae3e3;box-shadow:30px 10px 0 #8b6f5b;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fca1a1',endColorstr='#fcfc5d',GradientType=1)}@keyframes h3_topPage{0%{transform:scale(1);opacity:0}30%{transform:scale(1.2);opacity:1}50%{transform:scale(.9)}70%{transform:scale(1.05)}100%{transform:scale(1);opacity:1}}@media screen and (min-width:547px){.aboutSectionTop{margin:120px auto}}@media screen and (min-width:769px){.aboutSection{max-width:760px;align-items:center;margin:0 auto 150px;gap:46px;line-height:1.2em}.name{margin-bottom:20px;font-size:2.8rem;text-align:center;align-items:center}.message{font-size:1.8rem;padding:0;line-height:1.5em;margin-bottom:20px}*,*:before,*:after{-webkit-box-sizing:inherit;box-sizing:inherit}html{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:62.5%}.btn,a.btn,button.btn{line-height:1.5;position:relative;display:inline-block;cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none;transition:all .3s;text-align:center;vertical-align:middle;text-decoration:none;letter-spacing:.1em}.aboutDetail{margin:0 auto 120px}}@media screen and (min-width:1200px){.message{width:600px}.aboutDetail{display:flex;gap:40px;justify-content:center}}.work_webSiteList{text-align:center;margin:0 auto}.work_webSiteList:last-of-type{margin-bottom:120px}.workLink_wap{margin-bottom:60px}.workLinkSmall{font-size:1.5rem}.workLink{width:360px;display:flex;margin:0 auto;color:#5c4033;position:relative;justify-content:center;font-size:1.4rem;gap:10%}.link_banner{margin:0 10px}.btn02{position:relative;display:inline-block;width:80px;height:50px;line-height:50px;text-align:center;outline:none}.btn02 span{display:block;position:absolute;width:94px;height:100%;transform-style:preserve-3d;transition:.5s}.rotateback span:nth-child(1){text-decoration:underline;color:#8d6c5a;transform:rotateX(0deg);transform-origin:0 50% -25px}.rotateback:hover span:nth-child(1){transform:rotateX(90deg)}.rotateback span:nth-child(2){background:#8d6c5a;color:#fff;transform:rotateX(-90deg);transform-origin:0 50% -25px;font-family:"Noto Serif JP",serif}.rotateback:hover span:nth-child(2){transform:rotateX(0deg)}.workLinkSmall:after{content:"";position:absolute;top:38px;right:45%;border:6px solid transparent;border-top:7px solid #fff}@media screen and (min-width:769px){.workLink_wap{margin:0 auto}.workLink{width:39vw;font-size:2.4rem;margin:60px auto 0}.btn02{position:relative;display:inline-block;width:150px;height:50px;line-height:50px;text-align:center;outline:none;font-size:2.4rem}.btn02 span{display:block;position:absolute;width:100%;height:100%;transform-style:preserve-3d;transition:.5s}.rotateback span:nth-child(1){color:#8d6c5a;text-decoration:underline;transform:rotateX(0deg);transform-origin:0 50% -25px}.rotateback:hover span:nth-child(1){transform:rotateX(90deg)}.rotateback span:nth-child(2){background:#8d6c5a;color:#fff;transform:rotateX(-90deg);transform-origin:0 50% -25px}.rotateback:hover span:nth-child(2){transform:rotateX(0deg)}.workLinkSmall{font-size:1.5rem}.workLinkSmall:after{content:"";position:absolute;top:38px;right:45%;border:6px solid transparent;border-top:7px solid #fff}}@media screen and (min-width:1200px){.works_webSiteWap{margin:120px auto 0;width:auto;max-width:1200px}}.detail01,.charge{font-size:1.5rem}.mockupTitle01,.mockupTitle02{font-weight:700}.mockup_detailWap{margin:10px auto 40px;width:360px}.mockup_detail{gap:20px;display:flex;justify-content:center}.mockupTitle01,.mockupTitle02{line-height:2.5em}.detailWap{margin:10px auto 40px;display:flex;gap:20px;justify-content:center}.detail01,.detail02{display:inline-block;padding:4px 10px;background-color:#dcd3ce;border-radius:5px;font-size:1.4rem}.detail02{background-color:#efd9d1}@media screen and (min-width:769px){.detailWap{margin-bottom:40px}.detail01,.detail02{margin-top:10px;display:inline-block;padding:4px 10px;background-color:#dcd3ce;border-radius:5px;font-size:1.5rem}.detail02{background-color:#efd9d1}.mockupTitle01,.mockupTitle02{margin-top:5px;font-size:2rem;font-weight:500}.charge{font-size:1.5rem;margin-top:2px}.mockup_detailWap{margin:10px auto 40px}}@media screen and (min-width:1200px){.work_webSiteList{max-width:1200px;width:100%;display:grid;gap:48px;margin:0 auto 120px;grid-template-columns:1fr 1fr}.work_Banner{max-width:1200px;width:100%;display:grid;gap:48px;margin:0 auto 120px;grid-template-columns:1fr 1fr 1fr}.illustration_wap{max-width:1200px;width:100%;display:grid;gap:48px;grid-template-columns:1fr 1fr 1fr;margin:0 auto 240px}.mockup_detailWap{width:550px}}.work_Banner{margin-bottom:120px;text-align:center}.work_Banner:last-of-type{margin-bottom:120px}.illustration_section{margin-bottom:240px}.mockupDetail{font-size:1rem}.detail{display:flex;font-size:1rem;width:360px}.banner_detail01,.banner_detail02{display:inline-block;padding:6px 10px 2px;background-color:#efd9d1;border-radius:5px;font-size:1.1rem}.banner_wap{margin-bottom:80px}@media screen and (min-width:1200px){.mockupDetail{font-size:1rem}.detail{display:flex;font-size:1rem;width:350px}}.slider{margin-bottom:120px}.twenty20{margin:0 auto 80px}#twenty20-1,#twenty20-2,#twenty20-3{width:360px !important}@media screen and (min-width:1200px){.slider{display:flex;margin:0 auto 240px;width:1200px;gap:45px}.twenty20{width:300px;margin:0}#twenty20-1,#twenty20-2,#twenty20-3{width:380px !important}}.illustration_img{margin-bottom:60px}