@charset "utf-8";

.line-wrap{position:absolute;width:100%;height:100%;bottom:0;left:0;z-index:10}
.line-box span.line{position:absolute;background-color:/*rgba(83,79,255,.7);*/#0091ea;border:none}
.line-box span.line-top{width:0;height:3px;top:0;right:0}
.line-box span.line-right{width:3px;height:0;bottom:0;right:0}
.line-box span.line-bottom{width:0;height:3px;bottom:0;left:0}
.line-box span.line-left{width:3px;height:0;top:0;left:0}
.line-wrap:hover .line-box span.line-top,
.line-wrap:hover .line-box span.line-bottom {
    -webkit-animation: keyframes-width-box .8s cubic-bezier(0.345, 0.005, 0.07, 1) 1;
    -moz-animation: keyframes-width-box .8s cubic-bezier(0.345, 0.005, 0.07, 1) 1;
    animation: keyframes-width-box .8s cubic-bezier(0.345, 0.005, 0.07, 1) 1;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}
.line-wrap:hover .line-box span.line-right,
.line-wrap:hover  .line-box span.line-left {
	-webkit-animation: keyframes-height-line 0.8s cubic-bezier(0.345, 0.005, 0.07, 1) 1;
 	-moz-animation: keyframes-height-line 0.8s cubic-bezier(0.345, 0.005, 0.07, 1) 1;
 	animation: keyframes-height-line 0.8s cubic-bezier(0.345, 0.005, 0.07, 1) 1;
 	-webkit-animation-fill-mode: forwards;
 	-moz-animation-fill-mode: forwards;
 	animation-fill-mode: forwards;
}

/* animation */
@-webkit-keyframes keyframes-width-box {
	form {
	  width: 0%;
	} to {
	  width: 100%;
	}
  }
  @-moz-keyframes keyframes-width-box {
	form {
	  width: 0%;
	} to {
	  width: 100%;
	}
  }
  @keyframes keyframes-width-box {
	form {
	  width: 0%;
	} to {
	  width: 100%;
	}
  }

  /* animation */
  @-webkit-keyframes keyframes-height-line {
	form {
	  height: 0%;
	} to {
	  height: 100%;
	}
  }
  @-moz-keyframes keyframes-height-line {
	form {
	  height: 0%;
	} to {
	  height: 100%;
	}
  }
  @keyframes keyframes-height-line {
	form {
	  height: 0%;
	} to {
	  height: 100%;
	}
  }


@keyframes toUp {
	0% {transform:translateY(0);}
	50% {transform:translateY(-10px);}
	100% {transform:translateY(0);}
}

/* button */
@keyframes moveInBottom {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

/* text logo rotate */
@-moz-keyframes spin{ 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

/* main wave */
@keyframes wave {
	0% {margin-left: 0;}
	100% {margin-left:-1200px}
}
@-webkit-keyframes wave {
	0% {margin-left: 0;}
	100% {margin-left:-1200px}
}

/* sub visual */
@-webkit-keyframes zoomout {
	0% {transform:scale(1.1)}
	100% {transform:scale(1)}
}
@keyframes zoomout {
	0% {transform:scale(1.1)}
	100% {transform:scale(1)}
}

@keyframes fadeInMenu{
	from{
		opacity:0;
		top:100px;
	}
	to{
		opacity:1;
		top:80px;
	}
}

@media (max-width:1200px){
	@keyframes fadeInMenu{
		from{
			opacity:0;
			top:80px;
		}
		to{
			opacity:1;
			top:60px;
		}
	}
}

@keyframes fadeInLink{
	from{
		opacity:0;
		transform:translateY(40px);
	}
	to{
		opacity:1;
		transform:translateY(0);
	}
}