@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd,ul,li{margin:0;padding:0}ul,ol{list-style:none}html:focus-within{scroll-behavior:smooth}body{text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block;height:auto}input,button,textarea,select{font:inherit}@media (prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.slick-dotted.slick-slider{margin-bottom:0}.mb10{margin-bottom:min(.5208333333vw,10px)!important}.mb20{margin-bottom:min(1.0416666667vw,20px)!important}.mb25{margin-bottom:min(1.3020833333vw,25px)!important}.mb30{margin-bottom:min(1.5625vw,30px)!important}.mt10{margin-top:min(.5208333333vw,10px)!important}.mt20{margin-top:min(1.0416666667vw,20px)!important}.mt30{margin-top:min(1.5625vw,30px)!important}hr{border-color:#ecf1f4}.f-bold{font-weight:700}.fade-in{opacity:0;transform:translateY(50px);transition:opacity 1s,transform 1s}.fade-in.visible{opacity:1;transform:translateY(0)}.hidden{pointer-events:none;filter:brightness(.8)}.header{position:relative}.header__ttl{position:absolute;top:min(2.6041666667vw,50px);left:min(4.6875vw,90px)}.header__ttl h1{font-family:Roboto,sans-serif;font-size:min(5.184375vw,99.54px);line-height:min(5.184375vw,99.54px)}.header__ttl span{font-family:Roboto,sans-serif;font-size:min(3vw,57.6px);font-weight:700;line-height:min(3vw,57.6px);color:#555}.header__nav{position:absolute;width:min(21.6145833333vw,415px);bottom:min(2.6041666667vw,50px);left:min(4.6875vw,90px)}.header__nav ul{display:flex;flex-direction:column;gap:min(.5208333333vw,10px)}.header__nav ul li a{position:relative;display:block;font-family:Roboto,sans-serif;font-size:min(2.5vw,48px);width:100%;padding:min(.78125vw,15px) min(.5208333333vw,10px);font-weight:700;color:#222;text-decoration:none;line-height:1;z-index:1}.header__nav ul li a:after{content:"";position:absolute;top:50%;left:0;transform:translateY(-50%) scaleX(0);transform-origin:left center;width:100%;height:100%;background-color:#1c1c1c;z-index:-1;transition:transform .3s ease}.header__nav ul li.is-active a{color:#fff;pointer-events:none}.header__nav ul li.is-active a:after{transform:translateY(-50%) scaleX(1)}footer{width:100%;padding:min(1.0416666667vw,20px);font-family:Noto Sans JP,sans-serif}.barba-container{position:absolute;top:0;left:0;display:grid;width:100%;height:100vh;grid-template-areas:"header contents" "header contents" "footer contents";grid-template-columns:min(37.5vw,720px) auto;grid-template-rows:90vh auto}.barba-container header{grid-area:header}.barba-container .contents{grid-area:contents}.barba-container footer{grid-area:footer}.contents{position:relative;width:100%;height:100%}.contents_ttl{position:absolute;top:min(2.0833333333vw,40px);left:0;font-weight:700;padding-left:min(1.0416666667vw,20px)}.contents_ttl h2{font-size:min(5.184375vw,99.54px);color:#1c1c1c}.contents_ttl span{font-size:min(3.5208333333vw,67.6px);color:#555}#three-bg{position:absolute;top:0;left:0;pointer-events:none;z-index:-1}#barba-wrapper{position:relative}.contents>*:not(canvas){position:relative;z-index:1}.skills-archive{box-sizing:border-box}.skills-archive .skills-list-area{display:flex;flex-direction:column;padding:min(3.125vw,60px) min(1.0416666667vw,20px);gap:min(2.6041666667vw,50px);height:100vh;overflow-y:auto}.skills-archive .skills-list-area h3{margin-bottom:min(.5208333333vw,10px);font-size:min(2.5vw,48px);font-weight:700}.skills-archive .skills-list-area .skills-list{display:flex;flex-wrap:wrap;width:min(36.4583333333vw,700px);gap:min(.5208333333vw,10px);list-style:none;padding:0}.skills-archive .skills-list-area .skills-list .skill-item{width:min(6.25vw,120px);cursor:pointer;transition:all .3s ease}.skills-archive .skills-list-area .skills-list .skill-item img{width:100%}.skills-archive .skills-list-area .skills-list .skill-item:hover{transform:scale(1.05)}.works-archive{padding:min(3.125vw,60px) min(2.6041666667vw,50px);overflow-y:auto}.works-archive__list{display:grid;grid-template-columns:repeat(3,1fr);gap:min(1.5625vw,30px)}.works-archive__item{overflow:hidden}.works-archive__item img{width:100%;height:100%;object-fit:cover;filter:grayscale(100%);transition:transform .5s ease,filter .5s ease}.works-archive__item img:hover{filter:grayscale(0%);transform:scale(1.1)}
