@keyframes main-title-scroll-animation{0%{transform:translateX(100%)}50%{transform:translateX(0);width:100%;padding-left:2vw}100%{width:0%}}@keyframes main-title-scroll-animation-inversion{0%{transform:translateX(-100%)}50%{transform:translateX(0);width:100%;padding-right:2vw}100%{width:0%}}article{position:relative}.main-title-scroll-view{color:var(--vesta-background-color);background:linear-gradient(to right, var(--vesta-main-shadow), var(--vesta-main-color));position:absolute;top:0;left:0;width:100%;overflow:hidden;z-index:2;white-space:nowrap}.main-title-scroll-view.active{animation:main-title-scroll-animation 2s ease-in-out 0s 1 forwards}.main-title-scroll-view.inversion{background:linear-gradient(to left, var(--vesta-main-shadow), var(--vesta-main-color));text-align:right;left:auto;right:0}.main-title-scroll-view.inversion.active{animation:main-title-scroll-animation-inversion 2s ease-in-out 0s 1 forwards}#contact-info p{font-size:3vw}.form-parts{position:relative;width:80vw;margin:10vw}.form-parts input[type='text'],.form-parts input[type="email"]{font-size:4vw;box-sizing:border-box;width:100%;padding-left:4em}.form-parts input[type='text']:focus,.form-parts input[type="email"]:focus{outline:none}.form-input{font-family:-apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;padding:0;border:0;border-bottom:0.2vw solid var(--vesta-text-color-50);background-color:transparent}.form-input ~ .focus_line{position:absolute;bottom:0;left:50%;width:0;height:.5vw;transition:0.4s;background-color:var(--vesta-main-highlight)}.form-input:focus ~ .focus_line,.form-parts.form-input ~ .focus_line{left:0;width:100%;transition:0.4s}.form-input ~ label{font-family:-apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;font-size:4vw;position:absolute;z-index:-1;top:50%;left:0;width:100%;transition:0.3s;letter-spacing:.1vw;color:var(--vesta-text-color-50);transform:translateY(-50%)}.form-input:focus ~ label,.form-parts.form-input ~ label{font-size:4vw;top:-4vw;transition:0.3s;color:var(--vesta-main-highlight)}.textarea-wrap{display:flex;flex-direction:column-reverse;position:relative}.textarea-wrap textarea{font-family:-apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;font-size:4vw;color:var(--vesta-text-color);line-height:1em;resize:none;height:40vw;padding:2.5%;margin-top:6vw;outline:none;display:block;border:none;border:0.2vw solid var(--vesta-text-color-50)}.textarea-wrap textarea:focus ~ label{color:var(--vesta-main-highlight)}.textarea-wrap textarea:focus ~ .focus_line:nth-of-type(1),.textarea-wrap textarea:focus ~ .focus_line:nth-of-type(2){width:100%;transition:.3s}.textarea-wrap textarea:focus ~ .focus_line:nth-of-type(3),.textarea-wrap textarea:focus ~ .focus_line:nth-of-type(4){height:calc(100% - 6vw);transition:.3s .3s}.textarea-wrap label{font-family:-apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;font-size:4vw;position:absolute;top:0;left:0;height:6vw;line-height:6vw;letter-spacing:.1vw;color:var(--vesta-text-color-50);display:block;transition:0.3s}.textarea-wrap .focus_line{position:absolute;background:var(--vesta-main-highlight)}.textarea-wrap .focus_line:nth-of-type(1),.textarea-wrap .focus_line:nth-of-type(2){left:50%;transform:translateX(-50%);width:0;height:.5vw;transition:.3s .3s}.textarea-wrap .focus_line:nth-of-type(1){top:6vw}.textarea-wrap .focus_line:nth-of-type(2){bottom:0}.textarea-wrap .focus_line:nth-of-type(3),.textarea-wrap .focus_line:nth-of-type(4){width:.5vw;height:0;transition:.3s}.textarea-wrap .focus_line:nth-of-type(3){top:6vw;left:0}.textarea-wrap .focus_line:nth-of-type(4){bottom:0;right:0}#contact-button{text-align:center}.button{margin:5vw auto;display:inline-block;border-radius:1em;font-size:2vw;text-align:center;cursor:pointer;padding:2vw;background-color:var(--vesta-main-shadow);color:var(--vesta-background-color);line-height:1em;transition:.3s;box-shadow:1.5vw 1.5vw 1vw var(--vesta-background-shadow);border:0.2vw solid var(--vesta-main-shadow)}.button:hover{box-shadow:none;color:var(--vesta-main-shadow);background-color:var(--vesta-background-color)}.button:focus{outline:none}.button:disabled{box-shadow:none;color:var(--vesta-main-shadow);background-color:rgba(0,0,0,0.4)}#sending-animation{position:fixed;top:0;left:0;width:100%;height:100%;display:none;background:rgba(16,32,88,0.4)}#sending-animation.active{display:block;z-index:2147483647}#sending-animation #circle{position:absolute;top:50%;left:50%;width:60vw;height:60vw;transform:translate(-50%, -50%)}#sending-animation #circle span{position:absolute;top:50%;left:50%;width:100%;height:4vw;opacity:.3}#sending-animation #circle span::after{content:'';position:absolute;top:0;right:0;background:var(--vesta-main-shadow);width:30%;height:4vw;border-radius:2vw}@keyframes sending-circle{from{opacity:1}to{opacity:.3}}#sending-animation #circle span:nth-of-type(1){transform:translate(-50%, -50%) rotate(30deg);animation:sending-circle 1s ease-in .0833333333s infinite normal forwards}#sending-animation #circle span:nth-of-type(2){transform:translate(-50%, -50%) rotate(60deg);animation:sending-circle 1s ease-in .1666666667s infinite normal forwards}#sending-animation #circle span:nth-of-type(3){transform:translate(-50%, -50%) rotate(90deg);animation:sending-circle 1s ease-in .25s infinite normal forwards}#sending-animation #circle span:nth-of-type(4){transform:translate(-50%, -50%) rotate(120deg);animation:sending-circle 1s ease-in .3333333333s infinite normal forwards}#sending-animation #circle span:nth-of-type(5){transform:translate(-50%, -50%) rotate(150deg);animation:sending-circle 1s ease-in .4166666667s infinite normal forwards}#sending-animation #circle span:nth-of-type(6){transform:translate(-50%, -50%) rotate(180deg);animation:sending-circle 1s ease-in .5s infinite normal forwards}#sending-animation #circle span:nth-of-type(7){transform:translate(-50%, -50%) rotate(210deg);animation:sending-circle 1s ease-in .5833333333s infinite normal forwards}#sending-animation #circle span:nth-of-type(8){transform:translate(-50%, -50%) rotate(240deg);animation:sending-circle 1s ease-in .6666666667s infinite normal forwards}#sending-animation #circle span:nth-of-type(9){transform:translate(-50%, -50%) rotate(270deg);animation:sending-circle 1s ease-in .75s infinite normal forwards}#sending-animation #circle span:nth-of-type(10){transform:translate(-50%, -50%) rotate(300deg);animation:sending-circle 1s ease-in .8333333333s infinite normal forwards}#sending-animation #circle span:nth-of-type(11){transform:translate(-50%, -50%) rotate(330deg);animation:sending-circle 1s ease-in .9166666667s infinite normal forwards}#sending-animation #circle span:nth-of-type(12){transform:translate(-50%, -50%) rotate(360deg);animation:sending-circle 1s ease-in 1s infinite normal forwards}#sending-animation #message{color:var(--vesta-main-shadow);font-size:5vw;font-weight:bold;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}@keyframes sending-message{from{opacity:1}to{opacity:.3}}#sending-animation #message p span:nth-of-type(1){animation:sending-message 0.6s ease .2s infinite normal forwards}#sending-animation #message p span:nth-of-type(2){animation:sending-message 0.6s ease .4s infinite normal forwards}#sending-animation #message p span:nth-of-type(3){animation:sending-message 0.6s ease .6s infinite normal forwards}@media screen and (max-width: 560px){#contact-info p{display:none}}@media screen and (min-width: 560px){#contact-info{display:grid;grid-template-columns:repeat(3, 1fr);grid-template-rows:repeat(2, 1fr);padding:1vw 3vw;height:20vw}#contact-info h1{grid-column:1/2;grid-row:1/2}#contact-info h3{grid-column:1/2;grid-row:2/3;margin:0;text-align:left;text-indent:0}#contact-info p{grid-column:2/4;grid-row:1/3;display:flex;flex-direction:column;justify-content:flex-end;font-size:2vw;color:var(--vesta-background-color)}#contact-info p span{display:inline-block}#contact-info p #note{color:yellow}#sending-animation #circle{width:40vw;height:40vw}#sending-animation #circle span{height:2vw}#sending-animation #circle span:after{height:2vw}#sending-animation #message{font-size:3.5vw}}@media screen and (min-width: 960px){#contact-info{height:15vw}#contact-info p{grid-row:2/3;display:block;font-size:1vw}.form-parts{margin:5vw 20vw;width:60vw}.form-parts input[type='text'],.form-parts input[type='email']{font-size:2vw}.form-input ~ label{font-size:2vw}.form-input:focus ~ label,.form-parts.form-input ~ label{font-size:2vw}#contact-content{font-size:2vw;height:20vw}#contact-content ~ label{font-size:2vw}#sending-animation #circle{width:20vw;height:20vw}#sending-animation #circle span{height:1vw}#sending-animation #circle span:after{height:1vw}#sending-animation #message{font-size:1.5vw}}