/* マウスストーカー */

.cursorArea{
	position: relative;
	width: 100%;
}

#stkr{
	position: absolute;
	top: 0;
	left: 0;
	width: 7.5em;
	height: 3em;
	z-index: 10;
	pointer-events: none;
	display: none;
	margin: 0;
}

#stkr.active{
	display: block;
	transition: 0.25s;
	transition-timing-function: ease-out;
}

.carImage{
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: contain;
	transition: transform 0.25s;
}

.stopImage{
	display: none;
	width: 100%;
	height: 100%;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: contain;
	transition: transform 0.25s;
}

/*
.direction-top img{
	transform: rotate(15deg);
}

.direction-bottom img{
	transform: rotate(-15deg);
}
*/
.direction-left img{
	transform: scaleX(1);
}

.direction-right img{
	transform: scaleX(-1);
}

.direction-top.direction-left img{
	transform: scaleX(1) rotate(15deg);
}

.direction-top.direction-right img{
	transform: scaleX(-1) rotate(15deg);
}

.direction-bottom.direction-left img{
	transform: scaleX(1) rotate(-15deg);
}

.direction-bottom.direction-right img{
	transform: scaleX(-1) rotate(-15deg);
}

.direction-stop img{
	transform: scaleX(1) rotate(0) !important;
}

.direction-stop .carImage,
.direction-go .carImage{
	display: none;
}

.direction-stop .stopImage,
.direction-go .stopImage{
	display: block;
}

.direction-go .stopImage{
	transform: scale(0) rotate(0) !important;
}

