@charset "UTF-8";

/* ===== アニメーション ===== */

#mv.slide07 .mv_img li img {
	opacity: 0;
	-webkit-filter: blur(10px);
	filter: blur(10px);
	transition: opacity .6s ease, filter 1s ease, transform 1s ease;
}
#mv.slide07 .mv_img li.show img {
	opacity: 1;
	-webkit-filter: blur(0);
	filter: blur(0);
}

/*  */
#mv .mv_img li::before {
	content: '';
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 100;
	transition: 1.2s cubic-bezier(0.65, 0, 0.35, 1);
	opacity: 0;
}
#mv .mv_img li.show:before {
	opacity: 1;
}

#mv_outer.active .mv_img li::before {
	width: 0;
}

/*  */
#mv .mv_text h2 .num {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}
#mv_outer.active .mv_text h2 .num {
	opacity: 1;
	transform: translateY(0);
}

#mv_outer .mv_text .mv_team span {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}

#mv_outer.active .mv_text .mv_team span {
	opacity: 1;
	transform: translateY(0);
}

#mv_outer.active .mv_text .mv_team span:nth-child(1) {
	transition-delay: 0.8s;
}

#mv_outer.active .mv_text .mv_team span:nth-child(2) {
	transition-delay: 1s;
}

#mv_outer.active .mv_text .mv_team span:nth-child(3) {
	transition-delay: 1.2s;
}

/* img */
#img + div .inner_item_img,
#company_ttl + section .inner_item_img {
	position: relative;
	overflow: hidden;
}

#img + div .inner_item img {
	opacity: 0;
	-webkit-filter: blur(10px);
	filter: blur(10px);
	transform: scale(1.05);
}

#img + div .inner_item.show img {
	opacity: 1;
	-webkit-filter: blur(0);
	filter: blur(0);
	transform: scale(1);
	transition: opacity 0.8s ease, filter 0.8s ease, transform 0.8s ease;
}

/* COMPANY */
#company_ttl + section .inner_item_img {
	opacity: 0;
	transition: opacity 0ms 800ms;
}

#company_ttl + section .inner_item_img:before {
	background: #fff;
	content: '';
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 1;
}
#company_ttl + section.show .inner_item_img {
	opacity: 1;
}
#company_ttl + section.show .inner_item_img:before {
	animation: img-wrap2 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes img-wrap {
	100% {
		transform: translateX(100%);
	}
}

@keyframes img-wrap2 {
	100% {
		transform: translateX(-100%);
	}
}

@keyframes maskImg {
	0% {
		transform: translate(-101%, 0)
	}

	42%,
	58% {
		transform: translate(0, 0%)
	}

	100% {
		transform: translate(101%, 0)
	}
}

#company_ttl + section:before {
	opacity: 0;
	transition: opacity 0ms 800ms;
}
#company_ttl + section.show:before {
	opacity: 1;
	animation: maskImg-left 1400ms cubic-bezier(0.77, 0, 0.175, 1) 0.8s forwards;
}

@keyframes maskImg-left {
	0% {
		transform: translate(-101%, 0);
	}

	100% {
		transform: translate(0, 0);
	}
}
/* SERVICE */
#service + div .inner_item {
	opacity: 0;
	transform: translateY(30px);
}

#service + div .inner_item.show {
	opacity: 1;
	transform: translateY(0px);
	transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

#service + div .inner_item:nth-child(2) {
	transition-delay: 0.15s;
}
#service + div .inner_item:nth-child(3) {
	transition-delay: 0.3s;
}
#service + div .inner_item:nth-child(4) {
	transition-delay: 0.45s;
}
#service + div .inner_item:nth-child(5) {
	transition-delay: 0.6s;
}
#service + div .inner_item:nth-child(6) {
	transition-delay: 0.75s;
}
