@keyframes fade {
  0% {
    opacity: 0;
    transform: translate(0, 20px);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
.ani {
  opacity: 0;
}
.ani.animation {
  animation: fade 0.8s 0s forwards;
}

/*
div.maincont01-inner01{
	p{
		&.ani{
			opacity: 0;
			&.animation{
				animation: fade 0.8s 0.2s forwards;
			}
		}
	}
	h3{
		z-index: 2;
	}
}
div.maincont01-inner02{
	ul li{
		p{
			&.ani{
				opacity: 0;
				&.animation{
					animation: fade 0.8s 0.2s forwards;
				}
			}
		}
		@include mq(pc) {
			&:nth-child(2){
				p{
					&.ani{
						opacity: 0;
						&.animation{
							animation: fade 0.8s 0.4s forwards;
						}
					}
				}
			}
		}
	}
}

section.sec-present ul{
	&.ani{
		&.animation{
			li{
				&:nth-of-type(1){
					animation: fade 0.8s 0.2s forwards;
				}
				&:nth-of-type(2){
					animation: fade 0.8s 0.4s forwards;
				}
			}
		}
	}
}
@keyframes fade {
	0%{
		opacity: 0;
		transform: translate(0, 20px);
	}
	100% {
		opacity: 1;
		transform: translate(0, 0);
	}
}

div.maincontent01-wrap div.maincont01-inner01 h3,
div.maincontent01-wrap div.maincont01-inner02 ul li h3{
	opacity: 0;
	&.ani{
		&.animation{
			animation: titleani 0.8s forwards;
		}
	}
}
@keyframes titleani {
	0%{
		opacity: 0;
		top: 3%;
	}
	100% {
		opacity: 1;
		top: 0;
	}
}


section.sec02 div.solio-box{
	&.animation{
		p{
			span{
				animation: solio 0.4s 0.4s forwards;
			}
		}
	}
}
@keyframes solio {
	0%{
		transform: scale(0);
	}
	90% {
		transform: scale(1.12);
	}
	100% {
		transform: scale(1);
	}
}

section.sec02 div.fronx-box{
	p{
		opacity: 0;
		clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
	}
	&.animation{
		p{
			animation: clipani 0.8s 0.4s forwards;
		}
	}
}


@keyframes clipani {
	0%{
		opacity: 0;
		clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
	}
	100%{
		opacity: 100%;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}
}

section.sec02 div.car-lineup ul li{
	&.ani{
		opacity: 0;
		&.animation{
			animation: fade 0.8s forwards;
		}
	}
}
*//*# sourceMappingURL=animation.css.map */