@charset "utf-8";:root{--inner-screen-size:clamp(300px,90vw,1170px);--link-color-org:#551a8b;--color-white:#fff;--color-black:#000;--color-transparent:transparent;--color-gray:grey;--font-family-base:"Raleway","游ゴシック","Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3","Hiragino Sans","ヒラギノ角ゴシック","メイリオ","Meiryo","Arial",sans-serif;--font-color-base:#4b4b4b;--font-size-base:16px;--size-0_05rem:0.05rem;--size-0_1rem:0.1rem;--size-0_2rem:0.2rem;--size-0_5rem:0.5rem;--size-0_8rem:0.8rem;--size-1rem:1rem;--size-1_5rem:1.5rem;--size-2rem:2rem;--size-2_5rem:2.5rem;--size-3rem:3rem;--size-3_5rem:3.5rem;--size-4rem:4rem;--size-4_5rem:4.5rem;--size-5rem:5rem;--size-5_5rem:5.5rem;--size-6rem:6rem;--size-0_05em:0.05em;--size-0_1em:0.1em;--size-0_2em:0.2em;--size-0_5em:0.5em;--size-0_8em:0.8em;--size-1em:1em;--size-1_5em:1.5em;--size-2em:2em;--size-2_5em:2.5em;--size-3em:3em;--size-3_5em:3.5em;--size-4em:4em;--size-4_5em:4.5em;--size-5em:5em;--size-5_5em:5.5em;--size-6em:6em;--font-weight-normal:normal;--font-weight-bold:600;--line-height-0_5:0.5;--line-height-1:1;--line-height-1_2:1.2;--line-height-1_5:1.5;--line-height-2:2;--line-height-2_5:2.5}a{color:#551a8b;text-decoration:none}.body{background-color:#ddd;font-family:var(--font-family-base);position:relative;width:100%;text-align:center;color:#28292e;font-size:var(--font-size-1rem)}.header{width:100%;height:100px;display:flex;flex-direction:column;justify-content:center;align-items:center}.header__inner{width:var(--inner-screen-size);display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-end}.main{background-color:#fafafa;display:inline-block;z-index:500}.main,.section{width:100%;display:flex;flex-direction:column;align-items:center}.section{margin-top:150px}.first-section{margin-top:2rem}.main__inner{width:var(--inner-screen-size)}.footer,.main__inner{display:flex;flex-direction:column;align-items:center}.footer{width:100%;height:auto;justify-content:center;margin-top:4rem}.footer__inner{width:var(--inner-screen-size);height:auto;display:flex;flex-direction:row;justify-content:flex-start;align-items:baseline;margin:2rem 2rem 1rem}.footer__inner small{margin-left:auto}.window__cover{position:fixed;display:flex;justify-content:center;align-items:center;top:0;left:0;background-color:rgba(0,0,0,.6);width:100vw;height:100vh;z-index:9999;cursor:pointer}.zoomimg{position:relative;width:min(80vw,800px);max-height:80vh;object-fit:contain;margin:auto;animation:slideInRight .5s ease-out}@keyframes slideInRight{0%{transform:translateX(30%);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes slideOutLeft{0%{transform:translateX(0);opacity:1}to{transform:translateX(-30%);opacity:0}}.typing-text{overflow:hidden;border-right:.15em solid #9e9e9e;color:#444;word-break:keep-all;letter-spacing:.1em;animation:blink-caret .75s step-end infinite}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:#9e9e9e}}.main__prompt--call-to-scroll{margin-top:2em;opacity:0;animation:fadeIn 1s forwards}.main__img--double-down-arrow{display:inline-block;background-image:url(/images/portfolio/banner_design/double-down-arrow.svg);background-size:contain;width:3rem;height:3rem;margin-top:1rem;opacity:0;animation:fadeIn 1s forwards}@keyframes fadeIn{to{opacity:1}}@keyframes down{0%{transform:translateY(0);opacity:.5}50%{transform:translateY(1rem);opacity:1}to{transform:translateY(3rem);opacity:0}}.banner-list__inner{display:grid;width:clamp(300px,90vw,930px);grid-template-columns:repeat(3,250px);grid-auto-rows:auto;place-content:center;grid-gap:50px;gap:50px;margin:100px 0}.banner-list__item{position:relative;display:inline-flex;opacity:0;transform:translateY(50px);transition:1s;cursor:pointer}.banner-list__item.show{opacity:1;transform:none}.banner-list__img{width:250px;height:250px;object-fit:cover;cursor:pointer}.banner-list__item:after{position:absolute;display:none;content:attr(data-comment);background-color:#fff6f6ee;border:1px solid #9e9e9e;border-radius:3px;padding:.5em 1em;word-wrap:normal;bottom:20px;right:0;transform:translate(20%,20%);text-align:start}.banner-list__item:hover:after{display:flex}.banner-list__text--now-loading{display:flex;justify-content:center;align-items:center;background-color:#9e9e9e;width:250px;height:250px;border-radius:10px}@media screen and (max-width:930px){.banner-list__inner{grid-template-columns:repeat(1,250px)}}.link--to-portfolio-list{display:block;width:100%;text-align:end;margin:80px 2rem 80px 0}