@media all and (max-width:768px){.u-hidden-sp{display:none}}@media all and (min-width:769px){.u-hidden-pc{display:none}}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline;text-decoration:none;border:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-spacing:0;border-collapse:collapse}*{box-sizing:border-box}img{vertical-align:middle}button{padding:0;cursor:pointer;border:none;outline:none;background-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none}a,button{border:none;outline:none;background:none}:focus{outline:none}.wrapper{font-family:"Helvetica Neue","Helvetica","Hiragino Sans","Hiragino Kaku Gothic ProN","Arial","Yu Gothic","Meiryo",sans-serif;position:relative;overflow:hidden}.wrapper img{width:100%;height:auto}.header{position:absolute;z-index:10;top:0;left:0;width:100vw}.header__main{position:relative;display:flex;padding-right:50px;align-items:center;justify-content:space-between}.header__main::before{position:absolute;top:0;left:0;display:inline-block;min-width:435px;min-height:140px;content:"";-webkit-animation:headeranime 10s infinite;animation:headeranime 10s infinite;background-image:url(../images/title-bg.png);background-repeat:no-repeat;background-position:top right;background-size:cover}@media all and (max-width:768px){.header__main::before{width:75%;min-width:300px;height:100%;min-height:120px;background-position:bottom right}}@media all and (max-width:768px){.header__main{padding-right:0}}.header__title{font-size:44px;font-weight:700;position:relative;z-index:10;padding:25px 20px 20px}@media all and (max-width:768px){.header__title{font-size:9vw;padding:6vw 4vw}}.header__nav{position:relative;z-index:10;display:flex;justify-content:flex-end}@media all and (max-width:768px){.header__nav{display:none}}.header__text{font-size:18px;font-weight:700;transition:0.3s;color:#0e0b0b}.header__text:nth-of-type(n+2){margin-left:20px}.header__text:hover{opacity:.6}@media all and (max-width:768px){.header__text:hover{opacity:1}}@-webkit-keyframes headeranime{0%{transform:scale(1.1)}50%{transform:scale(1.3)}100%{transform:scale(1.1)}}@keyframes headeranime{0%{transform:scale(1.1)}50%{transform:scale(1.3)}100%{transform:scale(1.1)}}.hero{position:relative;width:100vw;height:100vh;min-height:605px;text-align:center}.hero.is-yel{background-color:#f8e371}.hero.is-red{background-color:#d2445b}.hero.is-blue{background-color:#66a1e4}.hero__inner{position:absolute;top:50%;left:50%;width:100%;padding:0 40px;transform:translate(-50%,-50%)}@media all and (max-width:768px){.hero__inner{padding:0 4vw}}.hero__title{font-size:9vw;font-weight:700;margin:50px 0}@media all and (max-width:768px){.hero__title{font-size:10vw;margin:7vw 0}}.hero__title span{opacity:0}.hero__title.is-yel{color:#f2d460}.hero__title.is-red{color:#be364c}.hero__title.is-blue{color:#5790d2}.hero__text{font-size:3.8vw;font-weight:700;display:block;color:#fff;text-shadow:1.5px 1.5px 0 #333,-1.5px -1.5px 0 #333,-1.5px 1.5px 0 #333,1.5px -1.5px 0 #333,0 1.5px 0 #333,0 -1.5px 0 #333,-1.5px 0 0 #333,1.5px 0 0 #333}@media all and (max-width:768px){.hero__text{font-size:8vw}}.hero__text--left{height:0;transition:0.7s;transform:translateX(-100%);text-align:left}.hero__text--left.is-active{height:auto;transform:translateX(0)}@media all and (max-width:768px){.hero__text--left{text-align:center}}.hero__text--right{height:0;transition:0.7s;transform:translateX(100%);text-align:right}.hero__text--right.is-active{height:auto;transform:translateX(0)}@media all and (max-width:768px){.hero__text--right{text-align:center}}.profile{position:relative;text-align:center}.profile__bg{position:relative;z-index:-2}.profile__bg.is-yel{background-color:#f8e371}.profile__bg.is-red{background-color:#d2445b}.profile__bg.is-blue{background-color:#66a1e4}.profile__title{font-size:84px;font-weight:700;position:absolute;top:15%;left:50px}@media all and (max-width:768px){.profile__title{font-size:10vw;top:12vw;left:4vw}}.profile__inner{max-width:1000px;margin:80px auto 0;padding:0 50px 30px}@media all and (max-width:768px){.profile__inner{margin-top:15vw;padding:0 4vw 5vw}}.profile__top{display:flex;justify-content:center;align-items:flex-end}.profile__area{position:relative;z-index:10;width:45%;margin-right:-40px;margin-bottom:-40px;padding:30px 25px 60px;text-align:left;background-color:#f0efef}@media all and (max-width:768px){.profile__area{width:50%;margin-right:-4vw;margin-bottom:-4vw;padding:3vw}}.profile__image{width:45%;max-width:400px}@media all and (max-width:768px){.profile__image{width:50%}}.profile__name{font-size:24px;font-weight:700;margin-bottom:20px}@media all and (max-width:768px){.profile__name{font-size:4vw}}.profile__attribute{font-size:18px;font-weight:700;line-height:1.3}@media all and (max-width:768px){.profile__attribute{font-size:3.5vw}}.profile__rogo{width:70%;max-width:200px;margin-top:20px}@media all and (max-width:768px){.profile__rogo{width:90%;margin-top:4vw}}.profile__paragraph{margin-top:90px}@media all and (max-width:768px){.profile__paragraph{margin-top:12vw}}.profile__subtitle{font-size:46px;font-weight:700}@media all and (max-width:768px){.profile__subtitle{font-size:6vw}}.profile__text{font-size:18px;font-weight:700;line-height:1.8;margin-top:30px}@media all and (max-width:768px){.profile__text{font-size:3.5vw;margin-top:5vw}}.profile__dot01{position:absolute;z-index:-1;top:20%;right:-8%;width:30%;max-width:450px}@media all and (max-width:768px){.profile__dot01{top:8%;width:38%}}.profile__dot02{position:absolute;z-index:-1;bottom:0;left:-2%;width:20%}@media all and (max-width:768px){.profile__dot02{bottom:0;left:-2%;width:30%}}.service{position:relative;text-align:center}.service__title{font-size:84px;font-weight:700;text-align:left}@media all and (max-width:768px){.service__title{font-size:10vw}}.service__subtitle{font-size:100px;font-weight:700;position:absolute;top:20%;right:0;color:#76a8ae}@media all and (max-width:768px){.service__subtitle{font-size:10vw;top:8%}}.service__inner{padding:0 50px 60px;background-color:#7eb2b8}@media all and (max-width:768px){.service__inner{padding:5vw 4vw 8vw}}.service__content{display:flex;max-width:1000px;margin:90px auto 0;justify-content:space-between}@media all and (max-width:768px){.service__content{display:block;margin:15vw auto 0}}.service__item{display:flex;flex-direction:column;width:31%;padding:25px 20px;border-radius:10px;background-color:#fff}@media all and (max-width:768px){.service__item{width:auto;padding:5vw 3vw}.service__item:nth-of-type(n+2){margin-top:5vw}}.service__leed{font-size:20px;font-weight:700}@media all and (max-width:768px){.service__leed{font-size:6vw}}.service__icon{display:flex;width:20%;min-height:65px;margin:20px auto 0;align-items:flex-end}.service__icon--coding{width:30%}.service__icon--wordpress{width:30%}.service__text{font-size:16px;line-height:1.6;margin:20px 0 25px;text-align:left;color:#9a9898}@media all and (max-width:768px){.service__text{font-size:3.5vw;margin:3vw 0 5vw}}.service__foot{margin-top:auto}.service__button{font-size:16px;font-weight:700;display:block;width:40%;margin:0 auto;padding:10px;transition:0.3s;color:#f7f7f7;border-radius:50px;background-color:#464444}@media all and (max-width:768px){.service__button{font-size:4vw;padding:3vw 2vw}}.service__button:hover{-webkit-animation:servicebtnanime 3.5s infinite;animation:servicebtnanime 3.5s infinite;background-color:#f8e371}@media all and (max-width:768px){.service__button:hover{-webkit-animation:none;animation:none;background-color:#464444}}@-webkit-keyframes servicebtnanime{0%{box-shadow:0 0 0 0 #f7d24a}100%{box-shadow:0 0 0 9pt rgba(254,242,178,0)}}@keyframes servicebtnanime{0%{box-shadow:0 0 0 0 #f7d24a}100%{box-shadow:0 0 0 9pt rgba(254,242,178,0)}}.works{position:relative;text-align:center}.works__bg{position:relative;z-index:-2;background-color:#7eb2b8}.works__inner{padding:0 50px 100px}@media all and (max-width:768px){.works__inner{padding:5vw 4vw 8vw}}.works__title{font-size:84px;font-weight:700;text-align:left}@media all and (max-width:768px){.works__title{font-size:10vw}}.works__subtitle{font-size:100px;font-weight:700;position:absolute;right:0;bottom:-15px;color:#f3f1f1}@media all and (max-width:768px){.works__subtitle{font-size:10vw;top:8%;bottom:auto}}.works__content{display:flex;max-width:1000px;margin:90px auto 0;justify-content:space-between}@media all and (max-width:768px){.works__content{display:block}}.works__item{overflow:hidden;width:31%;padding:25px 30px;cursor:pointer;cursor:hand;background-color:#e8e6e6}@media all and (max-width:768px){.works__item{width:auto;padding:5vw}.works__item:nth-of-type(n+2){margin-top:7vw}}.works__image{width:100%;transition:0.5s}.works__item:hover .works__image{transform:scale(1.1) rotate(3deg)}@media all and (max-width:768px){.works__item:hover .works__image{transform:none}}.works__foot{margin-top:50px}@media all and (max-width:768px){.works__foot{margin-top:9vw}}.works__button{font-size:16px;font-weight:700;display:block;width:20%;max-width:100px;margin:0 auto;padding:10px;transition:0.3s;color:#fff;border-radius:50px;background-color:#464444}@media all and (max-width:768px){.works__button{font-size:4vw;width:40%;min-width:170px;padding:3vw 2vw}}.works__button:hover{-webkit-animation:workbtnanime 3.5s infinite;animation:workbtnanime 3.5s infinite;background-color:#f8e371}@media all and (max-width:768px){.works__button:hover{-webkit-animation:none;animation:none;background-color:#464444}}.works__dot03{position:absolute;z-index:-1;top:24%;right:-5%;width:20%}@media all and (max-width:768px){.works__dot03{top:13%;right:-5%;width:32%}}.works__dot04{position:absolute;z-index:-1;top:40%;left:-5%;width:15%}@media all and (max-width:768px){.works__dot04{top:50%;left:-5%;width:32%}}.works__dot05{position:absolute;z-index:-1;bottom:-20%;left:20%;width:15%}@media all and (max-width:768px){.works__dot05{bottom:-4%;left:2%;width:36%}}@-webkit-keyframes workbtnanime{0%{box-shadow:0 0 0 0 #f7d24a}100%{box-shadow:0 0 0 9pt rgba(254,242,178,0)}}@keyframes workbtnanime{0%{box-shadow:0 0 0 0 #f7d24a}100%{box-shadow:0 0 0 9pt rgba(254,242,178,0)}}.output{position:relative;text-align:center}.output__inner{padding:0 50px 100px;background-color:#a95fa5}@media all and (max-width:768px){.output__inner{padding:0 4vw 8vw}}.output__title{font-size:84px;font-weight:700;text-align:left}@media all and (max-width:768px){.output__title{font-size:10vw}}.output__subtitle{font-size:100px;font-weight:700;position:absolute;bottom:0;left:0;color:#b36baf}@media all and (max-width:768px){.output__subtitle{font-size:10vw;top:20%;right:0;bottom:auto;left:auto}}.output__content{display:flex;max-width:600px;margin:90px auto 0;justify-content:space-between}@media all and (max-width:768px){.output__content{max-width:300px;margin:10vw auto 0}}.output__item{width:15%}.output__link{display:block;width:100%;transition:0.5s}.output__link:hover{transform:scale(1.5)}@media all and (max-width:768px){.output__link:hover{transform:none}}.footer{text-align:center;background-color:#252424}.footer__inner{padding:90px 20px 50px}@media all and (max-width:768px){.footer__inner{padding:10vw 4vw}}.footer__nav{position:relative;display:flex;justify-content:center}.footer__word{font-size:16px;font-weight:700;padding:0 20px;transition:0.5s;color:#fff}@media all and (max-width:768px){.footer__word{font-size:3.2vw;padding:0 2vw}}.footer__word:hover{opacity:.6}@media all and (max-width:768px){.footer__word:hover{opacity:1}}.footer__bottom{margin-top:50px}@media all and (max-width:768px){.footer__bottom{margin-top:9vw}}.footer__text{font-size:14px;font-weight:400;color:#fff}@media all and (max-width:768px){.footer__text{font-size:3vw}}.footer__link{font-size:16px;font-weight:400;padding:0 8px;transition:0.5s;color:#fff}@media all and (max-width:768px){.footer__link{font-size:3.5vw;padding:0 2vw}}.footer__link:hover{opacity:.6}@media all and (max-width:768px){.footer__link:hover{opacity:1}}.scrolldown{position:absolute;bottom:0;left:50%;transform:translateX(-50%)}@media all and (max-width:850px){.scrolldown{transform:translate(-50%,-100%)}}.scrolldown__item{font-size:12px;font-weight:700;line-height:1;display:inline-block;overflow:hidden;padding:10px 10px 50px;color:#f7f7f7}.scrolldown__item::after{position:absolute;bottom:0;left:50%;width:1px;height:40px;content:"";transform:translateX(-50%);-webkit-animation:sdl 2.5s cubic-bezier(1,0,0,1) infinite;animation:sdl 2.5s cubic-bezier(1,0,0,1) infinite;background:#f7f7f7}@-webkit-keyframes sdl{0%{transform:scale(1,0);transform-origin:0 0}50%{transform:scale(1,1);transform-origin:0 0}50.1%{transform:scale(1,1);transform-origin:0 100%}100%{transform:scale(1,0);transform-origin:0 100%}}@keyframes sdl{0%{transform:scale(1,0);transform-origin:0 0}50%{transform:scale(1,1);transform-origin:0 0}50.1%{transform:scale(1,1);transform-origin:0 100%}100%{transform:scale(1,0);transform-origin:0 100%}}.modal{position:absolute;z-index:200;left:0;display:none;width:100vw;height:100vh;text-align:center}.modal__content{position:absolute;top:50%;left:50%;width:50vw;padding:30px 20px;transform:translate(-50%,-50%);border-radius:20px;background-color:#f7f7f7}@media all and (max-width:768px){.modal__content{width:95vw;padding:5vw 3vw}}.modal__list{width:auto;margin:50px auto 0}@media all and (max-width:768px){.modal__list{margin:10vw auto 0}}.modal__item{margin-bottom:40px}@media all and (max-width:768px){.modal__item{margin-bottom:9vw}}.modal__item:last-of-type{margin-bottom:0}.modal__button{font-size:16px;font-weight:700;display:block;width:30%;max-width:200px;margin:40px auto 0;padding:10px;transition:0.5s;color:#f7f7f7;border-radius:50px;background-color:#464444}@media all and (max-width:768px){.modal__button{font-size:4vw;width:40%;margin:10vw auto 0;padding:3vw 2vw}}.modal__button:hover{background-color:#f8e371}@media all and (max-width:768px){.modal__button:hover{background-color:#464444}}.modal__title{font-size:28px;font-weight:700;position:relative;padding-bottom:12px;color:#464444}@media all and (max-width:768px){.modal__title{font-size:5vw;padding-bottom:3vw}}.modal__title:after{position:absolute;bottom:0;left:50%;display:block;width:8%;height:3px;content:"";transform:translateX(-50%);background-color:#464444}.modal__subtitle{font-size:20px;font-weight:700;color:#464444}@media all and (max-width:768px){.modal__subtitle{font-size:4.5vw}}.modal__leed{font-size:16px;line-height:1.5;margin-top:10px;color:#7b7b7b}@media all and (max-width:768px){.modal__leed{font-size:3vw;margin:2vw 0 0 2vw}}.modal__area{margin-top:20px}@media all and (max-width:768px){.modal__area{margin:2vw 0 0 2vw}}.modal__text{font-size:18px;font-weight:700;line-height:1.5;color:#464444}@media all and (max-width:768px){.modal__text{font-size:4vw}}.modal__subtext{font-size:14px;line-height:1.5;margin-top:18px;color:#464444}@media all and (max-width:768px){.modal__subtext{font-size:4vw}}.modal-bg{position:absolute;z-index:100;top:0;left:0;display:none;width:100vw;background-color:rgba(0,0,0,.8)}