@charset "utf-8";
/*
* ANIMATION
******************************************************/
/* common */
@keyframes fade {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fadeBg {
    0% {
        opacity: 0;
    }
    100% {
        opacity: .6;
    }
}
@keyframes fadeUptext{
    0% {
        opacity: 0;
    }
	50% {
        opacity: .3;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fadeSlide {
    0% {
        opacity: 0;
        transform: translate(-60px,0)
    }

    30% {
        opacity: 0;
        transform: translate(-60px,0)
    }

    100% {
        opacity: 1;
        transform: translate(0,0)
    }
}
@keyframes fadeUpAnime{
	0% {
		opacity: 0;
		transform: translateY(60px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes list-fadeup01 {
    0% {
        opacity: 0;
        transform: translate(0,30px)
    }

    100% {
        opacity: 1;
        transform: translate(0,0)
    }
}

@keyframes list-fadeup02 {
    0% {
        opacity: 0;
        transform: translate(30px,0)
    }

    100% {
        opacity: 1;
        transform: translate(0,0)
    }
}
@keyframes list-fadeup03 {
    0% {
        opacity: 0;
        transform: translate(-30px,0)
    }

    30% {
        opacity: 0;
        transform: translate(-30px,0)
    }

    100% {
        opacity: 1;
        transform: translate(0,0)
    }
}
@keyframes changeBlur{
	0% {
		opacity: .8;
		filter: blur(20px);
		scale: 1.1;
	}
	100% {
		opacity: 1;
		filter: blur(0px);
		scale: 1;
	}
}
@keyframes changeBg{
	0% {
		background:transparent;
		opacity: .8;
	}
	100% {
		background:var(--default);
		opacity: 1;
	}
}
@keyframes changeBgColor{
	0% {
		background:var(--main-bg);
		opacity: 1;
	}
	100% {
		background:var(--sub-bg);
		opacity: 1;
	}
}
@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes lighting {
    0% {
        transform: scaleX(0);
        transform-origin: 0 100%
    }

    50% {
        transform: none;
        transform-origin: 0 70%
    }

    100% {
        transform: none;
        transform-origin: 100% 0
    }

    100% {
        transform: scaleX(0);
        transform-origin: 100% 0
    }
}