.zen-kaku-gothic-new-light[data-astro-cid-sckkx6r4]{font-family:Zen Kaku Gothic New,sans-serif;font-weight:300;font-style:normal}.zen-kaku-gothic-new-regular[data-astro-cid-sckkx6r4]{font-family:Zen Kaku Gothic New,sans-serif;font-weight:400;font-style:normal}.zen-kaku-gothic-new-medium[data-astro-cid-sckkx6r4]{font-family:Zen Kaku Gothic New,sans-serif;font-weight:500;font-style:normal}[data-astro-cid-sckkx6r4]{margin:0;padding:0;list-style:none;text-decoration:none;font-weight:300;box-sizing:border-box}img[data-astro-cid-sckkx6r4]{width:auto;height:100%}h3[data-astro-cid-sckkx6r4]{font-size:min(24px,3.125vw);font-weight:300;letter-spacing:.05em}p[data-astro-cid-sckkx6r4],li[data-astro-cid-sckkx6r4]{font-size:min(16px,calc((16 / 1440)*100vw));font-weight:300;letter-spacing:.1em}.more[data-astro-cid-sckkx6r4]{transform:rotate(45deg)}a[data-astro-cid-sckkx6r4],a[data-astro-cid-sckkx6r4]:visited{color:#000;transition:.2s ease-in-out}a[data-astro-cid-sckkx6r4]:hover{color:#c9970d}a[data-astro-cid-sckkx6r4]:active{color:#586aa8}#header[data-astro-cid-sckkx6r4]{display:flex;justify-content:space-between;align-items:center;padding:0 80px;width:100%;height:80px;position:fixed;top:0;z-index:5;background-color:#ffffffb3;backdrop-filter:blur(5px);border-bottom:.5px solid #000}#header[data-astro-cid-sckkx6r4] a[data-astro-cid-sckkx6r4]{font-size:16px}.header__nav[data-astro-cid-sckkx6r4] ul[data-astro-cid-sckkx6r4]{display:flex;gap:60px}footer[data-astro-cid-sckkx6r4]{background-color:#f5f5f5}#footer[data-astro-cid-sckkx6r4]{margin:0 auto;width:600px;padding:100px 0 200px}.footer__container[data-astro-cid-sckkx6r4]{display:flex;flex-direction:column;gap:20px}.footer__container__content[data-astro-cid-sckkx6r4]{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:10px;width:100%;height:40px;border-bottom:1px solid #000}.footer__container__content__contact[data-astro-cid-sckkx6r4]{display:flex;gap:15px;align-items:flex-end}.footer__other[data-astro-cid-sckkx6r4]{display:flex;justify-content:space-between;margin:60px 0 0}.footer__other__sns[data-astro-cid-sckkx6r4]{display:flex;gap:15px}.fa-brands[data-astro-cid-sckkx6r4]{font-size:20px}p[data-astro-cid-sckkx6r4].copyright{font-size:min(20px,calc((20 / 1440)*100vw));font-weight:300;letter-spacing:.05em}.page__top__btn[data-astro-cid-sckkx6r4]{display:block;z-index:10;position:fixed;bottom:80px;right:30px;width:70px;height:70px;border:none;background-color:#fff0;cursor:pointer;opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.page__top__btn[data-astro-cid-sckkx6r4].is-show{opacity:1;visibility:visible}@media screen and (max-width:1000px){#footer[data-astro-cid-sckkx6r4]{width:70%}}@media screen and (max-width:768px){p[data-astro-cid-sckkx6r4],li[data-astro-cid-sckkx6r4]{font-size:min(20px,calc((20 / 768)*100vw))}#header[data-astro-cid-sckkx6r4]{padding:0 20px;height:60px}.header__nav[data-astro-cid-sckkx6r4] ul[data-astro-cid-sckkx6r4]{display:flex;gap:20px}#header[data-astro-cid-sckkx6r4] a[data-astro-cid-sckkx6r4]{font-size:16px;font-weight:400}#header[data-astro-cid-sckkx6r4] .header__nav[data-astro-cid-sckkx6r4] a[data-astro-cid-sckkx6r4]{font-weight:300}#footer[data-astro-cid-sckkx6r4]{width:calc((500 / 768)*100%);padding:80px 0 100px}.footer__container__content__contact[data-astro-cid-sckkx6r4] h3[data-astro-cid-sckkx6r4]{font-size:min(30px,3.90625vw)}p[data-astro-cid-sckkx6r4].copyright{font-size:min(20px,calc((20 / 768)*100vw));font-weight:300;letter-spacing:.05em}}.sp{display:none}.pc{display:inline-block}.view_sp{display:none}.view_pc{display:block}.zen-kaku-gothic-new-light{font-family:Zen Kaku Gothic New,sans-serif;font-weight:300;font-style:normal}.zen-kaku-gothic-new-regular{font-family:Zen Kaku Gothic New,sans-serif;font-weight:400;font-style:normal}.zen-kaku-gothic-new-medium{font-family:Zen Kaku Gothic New,sans-serif;font-weight:500;font-style:normal}.passions-conflict-regular{font-family:Passions Conflict,cursive;font-weight:400;font-style:normal}*{margin:0;padding:0;list-style:none;text-decoration:none;font-weight:300;box-sizing:border-box}html{scroll-behavior:smooth}img{width:auto;height:100%}body{font-family:Zen Kaku Gothic New,sans-serif}h1{font-size:min(64px,calc((64 / 1440)*100vw));font-weight:300;letter-spacing:.2em}h2{font-size:min(35px,calc((35 / 1440)*100vw));font-weight:300;letter-spacing:.2em}.h3{font-size:min(30px,calc((30 / 1440)*100vw));font-weight:300;letter-spacing:.05em}.h4{font-size:min(20px,calc((20 / 1440)*100vw));font-weight:300;letter-spacing:.15em;line-height:50px}p,li{font-size:min(25px,calc((25 / 1440)*100vw));font-weight:300;letter-spacing:.1em}.righttext{text-align:right}a,a:visited{color:#000;transition:.3s ease-in-out}a:hover{color:#c9970d}a:active{color:#092e45}.fade{opacity:0;filter:blur(10px);transition:.8s ease-in-out}.fade.is-visible{opacity:1;filter:blur(0px)}#mainvisual{width:100%;height:100vh;position:relative;z-index:4;background-image:url(/33ki-webfolio/images/mainvisual-bg_image.webp);background-size:100% 100%;background-position:center;background-repeat:no-repeat}#mainvisual:after{content:"";display:block;width:1px;height:100px;position:absolute;bottom:0;left:50%;transform:translate(-50%);background-color:#000;animation:line-flow 2s ease-in-out infinite;transform-origin:top}@keyframes line-flow{0%{transform:translate(-50%) scaleY(0);transform-origin:top}45%{transform:translate(-50%) scaleY(1);transform-origin:top}55%{transform:translate(-50%) scaleY(1);transform-origin:bottom}to{transform:translate(-50%) scaleY(0);transform-origin:bottom}}.mainvisual__cycle{width:25%;aspect-ratio:1 / 1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid #000;border-radius:1000px}.mainvisual__title{display:flex;flex-direction:column;justify-content:space-between;width:calc((515 / 1440)*100%);height:250px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#welcome{position:relative;background-color:#dfecf6}.welcome__bg{content:"";width:100%;height:100%;position:absolute;z-index:2;background-color:#fff}.welcome__content{display:flex;flex-direction:column;margin:0 auto;padding:230px 0 200px;width:600px;position:relative;z-index:3}.welcome__content h2{margin-bottom:100px}.welcome__content p.h3{margin-bottom:80px}.welcome__content h2,.welcome__content p{text-align:center}.welcome__content .h3{letter-spacing:.5em;line-height:60px}#works{padding:200px 0 100px;width:100%;position:relative;z-index:2;background-color:#f4f8fb}#works h2{padding:0 0 0 120px}.works-grid{display:flex;flex-direction:column;margin:110px 0 0;padding:0 0 100px;border-top:.5px solid #092e45}.card{display:flex;gap:10px;justify-content:space-between;align-items:flex-end;padding:50px;height:100%;position:relative;text-decoration:none;color:inherit;overflow:hidden;border:.5px solid #092e45;border-top:none;border-left:none;border-right:none;opacity:1;transform:translateY(20px);filter:blur(5px);transition:.5s ease-in-out}.card.is-visible{opacity:1;transform:translateY(0);filter:blur(0px)}.card:before{content:"";display:block;width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-1;background-image:url(/33ki-webfolio/images/webforlio_bg.webp);background-size:cover;background-position:center;background-repeat:repeat-x;opacity:0;transition:.5s ease-in-out}.card:hover:before{opacity:100%}.card:hover{color:#fff}.card:hover .tags:before,.card:hover .categories:before{background-color:#fff}.card-bg-text{position:absolute;top:50%;left:0;transform:translateY(-50%);white-space:nowrap;font-size:80px;font-weight:700;color:#ffffff0d;pointer-events:none;opacity:0;font-family:Passions Conflict}.card:hover .card-bg-text{opacity:1;animation:slideLoop 30s linear infinite;animation-delay:-5s}@keyframes slideLoop{0%{transform:translate(-100%,-50%)}to{transform:translate(100%,-50%)}}.card img{width:calc((600 / 1440)*100%);height:300px;position:relative;z-index:2;object-fit:cover}.card-body{display:flex;justify-content:space-between;flex-direction:column}.period{display:none}.card__text{display:flex;flex-direction:column;gap:10px}.card__text h3{margin-bottom:5px;font-size:min(30px,calc((30 / 1440)*100vw));font-weight:400;letter-spacing:.15em}.tags,.categories{display:flex;gap:10px;padding-left:15px;position:relative;font-size:min(20px,calc((20 / 1440)*100vw));font-weight:300;letter-spacing:.1em}.tags:before,.categories:before{content:"";display:block;width:5px;height:5px;position:absolute;top:50%;left:0;transform:translateY(-50% + 3px);background-color:#c9970d;transition:.5s ease-in-out}.categories:before{background-color:#092e45}.description{margin-top:30px;font-size:min(20px,calc((20 / 1440)*100vw));font-weight:300;letter-spacing:.15em}#works a{align-items:center}.viewmore{display:flex;justify-content:center;gap:15px;padding:14px 0;margin:0 auto;width:300px;position:relative;border:.5px solid #000;border-radius:100px;transition:0 ease-in-out}.viewmore:hover{color:#fff;background-color:#092e45;border:1px solid rgba(0,0,0,0)}#aboutme{width:100%;background-color:#fff}#aboutme:before{content:"";width:100%;height:100px;position:absolute;z-index:3;background-color:#f4f8fb;mask-image:linear-gradient(to bottom,#FFF,transparent)}#aboutme h2{padding:140px 0 0 120px;position:relative;z-index:4}.about__container{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin:0 auto;padding:100px 0 300px;width:calc((1040 / 1440)*100%);position:relative;z-index:3}.about__container__lefttext__name{font-size:min(30px,calc((50 / 1440)*100vw));font-weight:400}.about__container__img{width:300px;height:350px;position:relative;z-index:4;background-image:url(/33ki-webfolio/images/aboutme.webp);background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:200px 200px 0 0}.about__container p.h4{font-size:min(15px,calc((20 / 1440)*100vw));font-weight:300;letter-spacing:.1em;line-height:25px}.about__container__lefttext{display:flex;flex-direction:column;gap:100px}.about__container__lefttext__name h3{font-size:min(20px,calc((20 / 1440)*100vw));font-weight:400;letter-spacing:.15em;line-height:37px}.about__container__lefttext__text,.about__container__righttext__text{display:flex;flex-direction:column;gap:40px}.about__container__righttext__more{display:flex;justify-content:center;align-items:flex-end;gap:15px;margin-top:50px;padding:10px 0;width:200px;border:.5px solid #000;border-radius:100px;transition:.3s ease-in-out}.about__container__righttext__more:hover{color:#fff;background-color:#092e45;border:1px solid rgba(0,0,0,0)}.about__container__righttext__more p.h3{font-size:min(20px,calc((20 / 1440)*100vw));font-weight:300;letter-spacing:.1em}@media screen and (max-width:1000px){h1{font-size:min(70px,calc((70 / 1000)*100vw));font-weight:400}h2{font-size:min(40px,4vw);letter-spacing:.1em;font-weight:400}.h3{font-size:min(25px,2.5vw)}.h4{font-size:min(30px,2vw)}p,li{font-size:min(20px,2vw)}.welcome__content{padding:200px 0}#works{padding:150px 0 100px}.card-body{width:450px}.card__text h3{font-size:min(30px,3vw)}.tags,.categories{font-size:min(18px,calc((18 / 1000)*100vw));font-weight:400}.tag{font-weight:400}.description{margin-top:15px;font-size:min(15px,1.5vw);font-weight:400}.about__container{flex-direction:column;gap:20px;align-items:center;padding:50px 0 80px;width:60%}.about__container__lefttext,.about__container__righttext{display:flex;flex-direction:column;gap:20px;width:100%}.about__container__lefttext__name h3{font-size:min(25px,2.5vw);font-weight:400;text-align:left;line-height:40px}.about__container p.h4{margin:20px 0 0;font-size:min(20px,2vw);line-height:30px}.about__container__img{transform:scale(.9)}.about__container__lefttext__text{gap:5px}.about__container__righttext__text{display:none}.about__container__righttext__more{gap:8px;margin:40px auto 0;width:300px;border:.8px solid #000}.about__container__righttext__more p.h3{font-size:min(20px,3vw)}}@media screen and (max-width:800px){.sp{display:inline-block}.pc{display:none}.view_sp{display:block}.view_pc{display:none}}@media screen and (max-width:480px){h1{font-size:min(60px,12.5vw);font-weight:400}h2{font-size:min(30px,6.25vw);font-weight:400}.h3{font-size:min(20px,calc((20 / 480)*100vw))}.h4{font-size:min(18px,3.75vw);line-height:20px}p,li{font-size:min(20px,calc((20 / 480)*100vw));font-weight:400}.mainvisual__title{justify-content:normal;height:auto;gap:20px;width:250px}.welcome__content{width:80%}}
