@charset "utf-8";

.anime-scroll--hidden-x{
    overflow-x:hidden;
}
.anime-scroll--hidden-y{
    overflow-y:hidden;
}

/* 基本設定 */
.si{
	opacity: 0;
	transition:
	transform .8s var(--easeOutSine),
	opacity .6s var(--easeOutSine),
	filter .6s var(--easeOutSine)
	;
}
/* 解除 */
.si.show{
	will-change: transform;
	opacity: 1;
	transform: none;
	filter: none;
}

/* --------------------- */
/* アニメーション */
/* ジワっと出現 */
.si--blur{
	opacity: 0;
	filter: blur(6px);
}
/* ボーダーを伸ばす */
.si--border{
	opacity: 1;
}
.si--border::before{
	transform: scaleX(0);
	transition: transform .4s var(--linear);
	transform-origin: center;
}
.si.show.si--border::before{
	transform: scaleX(1);
}
/* 背景を伸ばす */
.si--bg{
	opacity: 1;
}
.si--bg::before{
	transform: scaleX(0);
	transition: transform .6s var(--easeOutSine);
	transform-origin: center;
}
.si.show.si--bg::before{
	transform: scaleX(1);
}

/* --------------------- */
/* ディレイ--.si基準 */
@media(min-width: 560px){
	.si--delay_short{
		transition-delay: .1s;
	}
	.si--delay_mid{
		transition-delay: .2s;
	}
	.si--delay_mid-long{
		transition-delay: .3s;
	}
	.si--delay_long{
		transition-delay: .4s;
	}
	.si--delay_very-long{
		transition-delay: .5s;
	}
	.si--delay_longest{
		transition-delay: .6s;
	}
}