@charset "UTF-8";:root{--z-top: 100;--z-middle: 50;--z-bottom: 0;--radius: 2rem;--radius-s: .5rem;--color-brightest: rgb(255 255 255 / 100%);--color-brighter: rgb(249 248 247 / 50%);--color-darker: rgb(0 0 0 / 50%)}html{font-family:Noto Sans JP,Noto Sans,sans-serif;font-weight:400;font-style:normal;font-optical-sizing:auto;font-size:1rem;scroll-behavior:smooth}body{position:relative;z-index:var(--z-bottom);width:100%;margin:0;padding:0;background-image:url(../img/bg-craftpaper.webp);background-repeat:repeat;background-position:left bottom;overflow-x:hidden}.text-en{font-family:adobe-handwriting-ernie,Noto Sans JP,sans-serif;font-weight:400;font-style:normal;font-optical-sizing:auto;transform:translateY(10%) rotate(-15deg)}.text-jp{font-family:Noto Sans JP,sans-serif;font-weight:300;font-style:normal;font-optical-sizing:auto}p{line-height:2;word-break:keep-all;overflow-wrap:anywhere;word-break:auto-phrase}a{color:inherit;text-decoration:none;display:block;width:100%;height:100%}img{display:block;width:100%;height:auto}ul{list-style:none}nav ul li a{font-size:2rem;display:block;text-align:center;transition:all .3s}.nav-header li{color:gray}.nav-footer li{color:#000}header{display:flex;flex-direction:row;justify-content:space-between;padding:.25rem 1.5rem;position:fixed;top:0;left:0;width:100%;z-index:var(--z-top);font-size:2rem;color:#fff;background-color:#000c;backdrop-filter:blur(12px);mix-blend-mode:luminosity}.nav-header{display:flex;flex-direction:row;gap:2rem}.hamburger,.nav-sp{display:none}nav ul li.is-current a,nav ul li a:hover{color:var(--color-brightest)}@media screen and (max-width:736px){nav ul li a:hover{color:var(--color-darker)}nav ul li.is-current a{color:#fff}}.link-hov:after{content:"";position:absolute;left:-4px;bottom:16px;width:120%;height:6px;background:linear-gradient(0deg,#ffffff80,#fff 50%,#ffffff80);transform:scaleX(0);transform-origin:right top;transition:transform .3s;border-radius:30% 100%}.link-hov:hover:after{transform:scale(1);transform-origin:left top}main{position:relative;width:100%;z-index:var(--z-bottom)}section{width:100%;height:100%;min-height:50vh;position:relative}section:before{mix-blend-mode:multiply;content:"";position:absolute;width:100%;height:100%;background-color:#f9f8f7;border-bottom:1px solid #ffffff;border-radius:0 0 2rem 2rem;box-shadow:0 1rem 1rem #0000001a}.section-wrapper{width:80%;height:100%;margin:0 auto;padding:4rem 0;position:relative;z-index:calc(var(--z-middle) + 20)}.section-heading{display:flex;flex-direction:row;align-items:baseline;margin:3rem 0 4rem}.section-heading h2{font-size:4rem}.section-heading p{font-size:1.2rem;border-bottom:1px solid #80808080;padding-left:4rem}.page-overlap{width:100%;height:7rem;position:relative;z-index:calc(var(--z-middle) + 20);bottom:0;left:0}.page-overlap a{font-size:2.5rem;color:#0000004d;width:100%;height:100%;text-align:center;display:block;position:absolute;top:60%;left:50%;transform:translate(-50%,-50%);padding:24px 8% 16px 50%}.page-overlap a:hover{color:var(--color-darker);text-shadow:.5px .5px 0 #00000080}.page-overlap-z1,.page-overlap-z2,.page-overlap-z3,.page-overlap-z4,.page-overlap-z5{border-radius:0 0 2rem 2rem;border-bottom:1px solid #ffffff;box-shadow:0 1rem 1rem #0000001a;position:absolute;width:100%;height:2rem}.page-overlap-z1{z-index:calc(var(--z-middle) + 15);top:0}.page-overlap-z2{z-index:calc(var(--z-middle) + 14);top:1rem}.page-overlap-z3{z-index:calc(var(--z-middle) + 13);top:2rem}.page-overlap-z4{z-index:calc(var(--z-middle) + 12);top:3rem}.page-overlap-z5{z-index:calc(var(--z-middle) + 11);top:4rem}.section-top{color:#000;background-image:url(../img/bg-craftpaper.webp);background-repeat:repeat;background-position:left top;border-radius:0 0 2rem 2rem;border-top:2px solid #0000001A;border-bottom:3px solid #00000033;box-shadow:1rem 1rem 2rem #80808080;height:99vh;z-index:calc(var(--z-middle) - 1)}.top-title{display:block;position:relative;height:70vh;background-image:url(../img/bg-text-nessys-portfoliosite.webp);background-position:center;background-repeat:no-repeat;background-size:70%}.scrolldown{position:absolute;right:0;bottom:20px;height:70px}.scrolldown span{position:absolute;left:-23px;top:-25px;color:#000;font-size:1.25rem;font-weight:400;letter-spacing:0}.scrolldown:after{content:"";position:absolute;top:0;width:1.5px;height:40px;background:#000;animation:pathmove 1.4s ease-in-out infinite;opacity:0}@keyframes pathmove{0%{height:0;top:0;opacity:0}30%{height:40px;opacity:1}to{height:0;top:60px;opacity:0}}.section-works{z-index:calc(var(--z-middle) - 2);top:-2rem}.section-works .section-heading{margin-bottom:1rem}.section-works .section-wrapper{padding:4rem 0 2rem}.work-list{list-style:none;display:flex;flex-direction:column;flex-wrap:wrap;gap:6rem}.work-list li{width:100%}.work-item{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:24px;width:100%;position:relative;transition:all .3s ease-out}.work-title{display:flex;flex-direction:column;gap:1rem;width:50%}.work-title h3{color:#4d4d4d;font-size:1.5rem;font-weight:400;padding-bottom:1rem;border-bottom:1px solid #0000004D;word-break:auto-phrase}.work-category{display:flex;flex-direction:row;gap:.5rem}.work-category p{display:block;color:#00000080;font-weight:400;margin-right:.5rem}.work-img{width:50%;aspect-ratio:1 / 1;overflow-y:hidden;border-radius:var(--radius-s)}.work-img img{width:100%;height:100%;object-fit:contain;object-position:top center}@media(pointer:fine){.work-img:before{content:"";display:block;width:50%;height:100%;overflow:hidden;border-radius:var(--radius-s);position:absolute;top:0;right:0;transition:all .3s ease-out}.work-item:hover .work-img:before{background-color:var(--color-brighter);transform:scale(1.05)}}.section-about{z-index:calc(var(--z-middle) - 3);top:-4rem}.section-about:after{content:"Nessy";color:#e6e6e6;font-size:200px;font-family:adobe-handwriting-ernie,Noto Sans JP,sans-serif;font-weight:400;font-style:normal;font-optical-sizing:auto;display:block;position:absolute;top:45%;left:50%;transform:translate(-15%,-60%) rotate(-25deg)}.about-text{display:flex;flex-direction:column;gap:1rem;width:75%;margin:2rem 0 4rem}.about-text p{line-height:2}.section-skills{z-index:calc(var(--z-middle) - 4);top:-6rem}.skill-list{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;flex-wrap:wrap;gap:2rem;margin-bottom:3rem}.skill-item{display:flex;flex-direction:column;align-items:flex-start;gap:0}.skill-item h3{font-size:1.5rem;font-weight:400;margin-bottom:2rem}@media screen and (max-width:736px){.skill-list{gap:2rem;margin-bottom:3rem}.skill-item{width:100%;min-width:300px}}.section-hobby{z-index:calc(var(--z-middle) - 5);top:-8rem}.hobby-list{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.hobby-item{position:relative;width:100%;height:100%;border-radius:2rem .2rem;overflow:hidden;background-repeat:no-repeat;background-position:center;background-size:cover}.hobby-img-game{background-image:url(../img/hobby/hobby-img-game.jpg)}.hobby-img-trpg{background-image:url(../img/hobby/hobby-img-trpg.jpg)}.hobby-img-notion{background-image:url(../img/hobby/hobby-img-notion.jpg)}.hobby-img-illust{background-image:url(../img/hobby/hobby-img-illustration.jpg)}.hobby-item:before{content:"";display:block;width:100%;height:100%;position:absolute;top:0;left:0;mix-blend-mode:luminosity;background-color:#80808080;transition:all .3s ease-out}.hobby-text{color:#fff;text-shadow:1px 1px .25rem #00000088;position:relative;z-index:calc(var(--z-middle) + 10);margin:2rem}.hobby-text h3{font-size:1.5rem;font-weight:400;display:block;width:fit-content;margin-bottom:2rem}.hobby-text h3:before{content:"";padding:0rem .5rem;border-left:8px solid #ffffff80}.hobby-text p{font-size:.9rem;margin-bottom:.5rem}@media(pointer:fine){.hobby-item:hover:before{background-color:var(--color-darker);backdrop-filter:blur(2px)}.hobby-item{transform:scale(1);.hobby-text p{opacity:0}}.hobby-item:hover{transform:scale(1.05);transition:all .3s;.hobby-text p{opacity:1;transition:opacity .3s .1s}}}@media(pointer:coarse){.hobby-item:before{background-color:var(--color-darker);backdrop-filter:blur(2px)}}.section-contact{z-index:calc(var(--z-middle) - 6);top:-10rem}.contact-form{display:flex;flex-direction:column;align-items:flex-start;gap:0rem}.contact-form input,.contact-form textarea,.contact-form button{background-color:#0000004d;color:#000;border-radius:.4rem;padding:1rem}.contact-form label{margin-bottom:.5rem}.contact-form input,.contact-form textarea{margin-bottom:2rem;width:100%}.contact-form textarea{min-height:10rem}.contact-form button{color:#fff;width:75%;margin:2.5rem auto 0;transition:all .3s ease-out}.contact-form button:hover{background-color:var(--color-darker);backdrop-filter:blur(2px)}footer{width:80%;margin:0 auto;position:relative;top:-2rem;z-index:var(--z-bottom);color:#000;text-shadow:.5px .5px 0 #00000080}.nav-footer{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:2rem;margin:0 .5rem 2rem 0;font-size:2rem}.footer-copyright{font-size:1.2rem;border-top:2px solid #00000080;padding:2rem 0 1.5rem}.xrea-ad a,img{display:block;width:100%;max-width:80vw;margin:0 auto}@media screen and (max-width:736px){.section-heading{display:flex;flex-direction:column;position:relative;margin:1rem 0 2rem}.section-heading p{font-size:1rem;border-bottom:1px solid #80808080;padding-left:0;width:40%;text-align:right;position:absolute;right:0;bottom:1rem}.nav-header{display:none}.hamburger,.nav-sp{display:block}.hamburger{position:fixed;top:10px;right:20px;z-index:var(--z-top);width:48px;height:48px;border:none;background:transparent;cursor:pointer}.hamburger-line{position:absolute;left:11px;width:26px;height:1.6px;background-color:#fff;border-radius:1px;transition:all .4s}.hamburger-line:nth-of-type(1){top:14px}.hamburger-line:nth-of-type(2){top:23px}.hamburger-line:nth-of-type(3){top:32px}.hamburger.active .hamburger-line:nth-of-type(1){transform:translateY(9px) rotate(-45deg)}.hamburger.active .hamburger-line:nth-of-type(2){opacity:0}.hamburger.active .hamburger-line:nth-of-type(3){transform:translateY(-9px) rotate(45deg)}.nav-sp{position:fixed;top:0;right:0;width:100vw;height:100vh;background-color:#000000b3;opacity:0%;z-index:calc(var(--z-bottom) - 8);visibility:hidden;transition:opacity .4s,visibility .4s;mix-blend-mode:darken}.nav-sp.active{opacity:100%;z-index:calc(var(--z-top) - 8);visibility:visible}.nav-sp-wrapper{color:#000;width:120%;height:100%;position:absolute;bottom:10%;left:10%;border-radius:0 0 24px 24px;background:url(../img/bg-tracing-paper.webp);backdrop-filter:blur(3px);box-shadow:0 1rem 1rem #0000001a;padding:0 3rem 10rem;transform:translate(-40px,-100px) rotate(5deg);z-index:calc(var(--z-bottom) - 10);transition:transform .4s .2s}.nav-sp-wrapper.active{z-index:var(--z-top);transform:translate(0) rotate(0)}.nav-sp-list{width:100%;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;gap:1.5rem;margin-bottom:4rem}.nav-sp-link{border-bottom:2px solid #00000033;width:100%}.nav-sp-link span{display:block;width:fit-content;text-align:left;font-size:2rem;line-height:1.7}.nav-sp-copyright{font-size:1.2rem;border-top:3px solid #00000080;margin:4rem 0;padding-top:24px}.nav-sp-bg{width:120%;height:120%;position:absolute;bottom:18%;left:-15%;border-radius:24px;background:url(../img/bg-tracing-paper.webp);backdrop-filter:blur(1px);box-shadow:0 1rem 1rem #0000001a;transform:translate(-10%,-10%) rotate(10deg);z-index:calc(var(--z-bottom) - 9);transition:transform .6s .2s}.nav-sp-bg.active{z-index:calc(var(--z-top) - 9);transform:translate(20%,10%) rotate(-10deg)}.top-title{background-size:90%}.work-item{width:100%;flex-direction:column;align-items:center;gap:1rem}.work-title{width:100%;order:2}.work-title h3{font-size:1.3rem}.work-img{width:50%;aspect-ratio:1 / 1;margin:0 auto;order:1}.work-img img{width:100%;height:100%;object-fit:contain;object-position:top center}.work-img:before{display:none}.scrolldown{right:50%}.section-about:after{display:none}.about-text{width:100%;font-size:.9rem}.hobby-list{display:flex;flex-direction:column;gap:2rem}.contact-form textarea{min-height:12rem}.xrea-ad a,img{max-width:100vw}}.t-sticky-note{padding:2rem 4rem 2rem 3rem;position:relative;background-color:#fff;border:1px solid #8080801A;border-right:1rem solid #80800080}.t-sticky-note:before{content:"";position:absolute;bottom:-4px;right:0;z-index:-1;transform:rotate(3deg);width:90%;height:90%;background-color:#d0d0d0;filter:blur(4px)}@media screen and (max-width:736px){.t-sticky-note{padding:2rem 2rem 2rem 1.5rem}}.t-box-square{aspect-ratio:1 / 1}.t-box-portrait{aspect-ratio:1 / 1.5}.t-box-landscape{aspect-ratio:1.5 / 1}.t-box-cutout{position:relative}.t-box-cutout:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#f9f8f7 4%,transparent 4%,transparent 96%,#f9f8f7 96%)}.t-heading-line:before{content:"";padding:0rem .5rem;border-left:8px solid #80808080}.t-border{border-bottom:1px solid #00000033}.t-text-bg{border-radius:.3rem;mix-blend-mode:difference;padding:.1rem .7rem;margin:0 .3rem}.t-text-bg-white{background-color:#fff;color:#000;border:#0000001A 1px solid}.t-text-bg-black{background-color:#000000b3;color:#fff}.t-text-bg-gray{background-color:#cccdcc;color:#000}.t-text-bg-yellow{background-color:#eaf6c5;color:#000;border:#0000001A 1px solid}.t-text-bg-orange{background-color:#ffa953;color:#000}.t-text-bg-ivory{background-color:#f8f2eb;color:#000;border:#0000001A 1px solid}.t-text-bg-pink{background-color:#ff7f7f;color:#000}