/* page motion */
.add-upscroll:not(.play-mo) {transform:translateY(70px) ;opacity:0;}
.play-mo.add-upscroll ,.play-mo .add-upscroll {animation: add-upscroll 0.7s 0s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay10 ,.play-mo .add-upscroll.delay10 {animation: add-upscroll 0.8s 0.1s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay20 ,.play-mo .add-upscroll.delay20 {animation: add-upscroll 0.8s 0.2s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay30 ,.play-mo .add-upscroll.delay30 {animation: add-upscroll 0.8s 0.3s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay40 ,.play-mo .add-upscroll.delay40 {animation: add-upscroll 0.8s 0.4s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay50 ,.play-mo .add-upscroll.delay50 {animation: add-upscroll 0.8s 0.5s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay60 ,.play-mo .add-upscroll.delay60 {animation: add-upscroll 0.8s 0.6s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay70 ,.play-mo .add-upscroll.delay70 {animation: add-upscroll 0.8s 0.7s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay80 ,.play-mo .add-upscroll.delay80 {animation: add-upscroll 0.8s 0.8s ease-in-out;animation-fill-mode: both;}
@keyframes add-upscroll {
	0%		{transform:translateY(70px);opacity:0;}
	100%	{transform: translateY(0px);opacity:1;}
}

.add-downscroll:not(.play-mo) {transform:translateY(-70px) ;opacity:0;}
.play-mo.add-downscroll ,.play-mo .add-downscroll {animation: add-downscroll 0.7s 0.0s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay10 ,.play-mo .add-downscroll.delay10 {animation: add-downscroll 0.7s 0.1s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay20 ,.play-mo .add-downscroll.delay20 {animation: add-downscroll 0.7s 0.2s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay30 ,.play-mo .add-downscroll.delay30 {animation: add-downscroll 0.7s 0.3s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay40 ,.play-mo .add-downscroll.delay40 {animation: add-downscroll 0.7s 0.4s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay50 ,.play-mo .add-downscroll.delay50 {animation: add-downscroll 0.7s 0.5s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay60 ,.play-mo .add-downscroll.delay60 {animation: add-downscroll 0.7s 0.6s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay70 ,.play-mo .add-downscroll.delay70 {animation: add-downscroll 0.7s 0.7s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay80 ,.play-mo .add-downscroll.delay80 {animation: add-downscroll 0.7s 0.8s ease-in-out;animation-fill-mode: both;}

@keyframes add-downscroll {
	0%		{transform: translateY(-70px) ;opacity:0;}
	100%	{transform: translateY(0px);opacity:1;}
}

header.show {animation: showMenu 0.3s ease-out;animation-fill-mode: both;}
@keyframes showMenu {

	100%{
		opacity:1;
		top:0px;
	}

}


.leftorg {
    transform-origin: left center;
	}
.rightorg {
    transform-origin: right center;
	}

.add-qzoom:not(.play-mo) {transform:scale(0) ;opacity:0;}
.play-mo.add-qzoom ,.play-mo .add-qzoom {animation: add-qzoom 1.5s 0.0s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay10 ,.play-mo .add-qzoom.delay10 {animation: add-qzoom 0.7s 0.1s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay20 ,.play-mo .add-qzoom.delay20 {animation: add-qzoom 0.7s 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay30 ,.play-mo .add-qzoom.delay30 {animation: add-qzoom 0.7s 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay40 ,.play-mo .add-qzoom.delay40 {animation: add-qzoom 0.7s 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay50 ,.play-mo .add-qzoom.delay50 {animation: add-qzoom 0.7s 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay60 ,.play-mo .add-qzoom.delay60 {animation: add-qzoom 0.7s 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay70 ,.play-mo .add-qzoom.delay70 {animation: add-qzoom 0.7s 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}
.play-mo.add-qzoom.delay80 ,.play-mo .add-qzoom.delay80 {animation: add-qzoom 0.7s 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);animation-fill-mode: both;}

@keyframes add-qzoom {
	0%		{transform: scale(0.8);opacity:0;}
	50%		{transform: scale(0.9);opacity:0;}
	100%	{transform: scale(1);opacity:1;}
}

.aware-button {
    -webkit-transition: -webkit-transform 3s cubic-bezier(0.34, 1.56, 0.64, 1);
    transition: transform 3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.aware-button.top, .aware-button.right, .aware-button.bottom, .aware-button.left {
	transition:0.5s ease-in-out;
}
.aware-button.top {
	transform: translateY(20px);
}
.aware-button.right{
	transform: translateX(-20px);
}
.aware-button.bottom {
	transform: translateY(-20px);
}
.aware-button.left {
	transform: translateX(20px);
}
.aware-button:focus {
	transform: scale(1.1);
}

@keyframes target_image {
	0%{
		transform:  translateY(0px);
	}
	100%{
		transform: translateY(10px);
	}
}
#wrap section.headingWrap.fix {position:fixed;bottom:0px;width: 100%;}
#wrap section.headingWrap.nofix {position:absolute;bottom:0px;width: 100%;}

[data-step] {opacity:0;}
 

@keyframes step02_A {
	100% 	{transform: scale(1);opacity:1;}
}
@keyframes step02_B {
	100% 	{transform: scale(0.2);opacity:1;}
}
@keyframes step02_N {
	100% 	{transform: scale(0);opacity:0;}
}
@keyframes step02_M {
	100% 	{transform: translate(72px,50px) ;}
}
@keyframes step02_M2 {
	100% 	{transform: translate(293px,187px) ;}
}
@keyframes step_M {
	100% 	{transform: translate(0px,0px);}
}
@keyframes step_M2 {
	100% 	{transform: translate(152px,0px);}
}


@keyframes step_fadeIn {
	100% 	{opacity:1;}
}
@keyframes step_fadeOut {
	100% 	{opacity:0;}
}
@keyframes step_show {
	100% 	{transform: translateY(0px);opacity:1;}
}
@keyframes step_hide {
	100% 	{transform: translateY(72px);opacity:0;}
}
.check__area .check-item .icon_check {transform:scale(0);opacity:0;}
.check__area .check-item .check_active {opacity:0;}
.check__area .check-item.active .icon_check {
	animation: show_btn 0.7s  ease-in-out;animation-fill-mode: both;
}
 .check__area .check-item.active .check_active {animation: show_btn2 0.3s  ease-in-out;animation-fill-mode: both;}

@keyframes show_btn {
	50% 	{transform: scale(1.5);opacity:1;}
	100% 	{transform: scale(1);opacity:1;}
}
@keyframes show_btn2 {
	100% 	{opacity:1;}
}

.headMotion__area .ani {opacity:0;}

.headMotion__area .mShow1 {opacity:0.3;  transform: translate(-160px,160px);transition:0.6s;}
.headMotion__area .mShow2 { opacity:0.3;   transform: translate(160px,-160px);transition:0.6s;}
.headMotion__area .mShow3 { opacity:0.3;   transform: translate(-160px,160px);transition:0.6s;}
.headMotion__area .mShow4 { opacity:0.3;  transform: translate(160px,-160px);transition:0.6s;}
header {opacity:0;top:-100px;transition:0.5s;}
header.show {animation: showMenu 0.3s ease-out;animation-fill-mode: both;}
@keyframes showMenu {

	100%{
		opacity:1;
		top:0px;
	}

}
.headMotion__area .step-text {opacity:0; transform: translateY(100px);transition:0.5s;}
.headMotion__area .step-text01 {opacity:0; transform: translateY(100px);transition:0.5s;}
.headMotion__area .step-info {opacity:0; transform: translateY(100px);transition:0.5s;}
.headMotion__area .link-group {opacity:0; transform: translateY(100px);transition:0.5s;}


