@charset "utf-8";

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

/* 基本設定 */
.si{
	opacity: 0;
	transition: 
	opacity .6s var(--easeInOutSine),
	transform .6s var(--easeInOutSine);
}

/* 解除 */
.si.show{
	will-change: transform;
	opacity: 1;
	transform: none;
}
/* --------------------- */
/* アニメーション */
/* 手前からフワッ */
.si--scale{
	transform: scale(1.6);
}
/* 下からスライドイン */
.si--up{
	transform: translateY(30px);
}
/* 上からスライドイン */
.si--down{
	transform: translateY(-30px);
}
/* 左からスライドイン */
.si--left{
	transform: translateX(-30px);
}
/* 右からスライドイン */
.si--right{
	transform: translateX(30px);
}
/* フワッと表示 */
.si--fade{
	opacity: 0;
}
/* ボーダー */
.si--border{
	opacity: 1;
	transform: scaleX(0);
	transform-origin: left top;
	transition-delay: .2s;
}
.si--border-vertical{
	opacity: 1;
	transform: scaleY(0);
	transform-origin: left top;
}
.si.si--border.show{
	transform: scaleX(1);
}
.si.si--border-vertical.show{
	transform: scaleY(1);
}



/* --------------------- */
/* ディレイ--.si基準 */
.si--delay_short{
	transition-delay: .2s;
}

.si--delay_mid{
	transition-delay: .4s;
}

.si--delay_mid-long{
	transition-delay: .6s;
}

.si--delay_long{
	transition-delay: .8s;
}

.si--delay_very-long{
	transition-delay: 1s;
}
.si--delay_longest{
	transition-delay: 2.4s;
}


/* --------------------- */
/* クイック--.si基準 */
.si--quick_short{
	transition-delay: -.2s;
}
.si--quick_mid{
	transition-delay: -.4s;
}