@keyframes show {
	0% {
		transform: translate(0, 0);
	}
	100% {
		transform: translate(0, calc(-100% + 121vh));
	}
}
@keyframes turn {
	0% {
		transform: rotateY(1800deg);
	}
	100% {
		transform: rotateY(0);
	}
}
.pla-com.com-logo {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 100;
}
	.pla-com.com-logo .com-item {
		position: absolute;
		display: inline-block;
		width: 6vh;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
		.pla-com.com-logo .com-item img {
			width: 100%;
			height: auto;
			animation: 4800ms 200ms turn cubic-bezier(0.67, .34, .34, 0.67) backwards;
		}
	.pla-com.com-logo .com-item:first-child {
		left: calc(25% + 1vh);
	}
		.pla-com.com-logo .com-item:first-child img {
			animation: 4200ms 150ms turn cubic-bezier(0.67, .34, .34, 0.67) backwards;
		}
	.pla-com.com-logo .com-item:last-child {
		left: calc(75% - 1vh);
	}
		.pla-com.com-logo .com-item:last-child img {
			animation: 5200ms 250ms turn cubic-bezier(0.67, .34, .34, 0.67) backwards;
		}
.pla-com.com-slot {
	display: block;
	width: 100%;
	margin: auto;
	background-color: white;
	padding: 0 2vh;
	position: relative;
}
	.pla-com.com-slot .com-item {
		display: inline-block;
		text-align: center;
		width: 25%;
		font-size: 10em;
		transform: translate(0, calc(-100% + 121vh));
	}
	.pla-com.com-slot .com-item:nth-child(1) {
		animation: 3600ms 100ms show cubic-bezier(1,.34,.34,1) backwards;
	}
	.pla-com.com-slot .com-item:nth-child(2) {
		animation: 4200ms 150ms show cubic-bezier(1,.34,.34,1) backwards;
	}
	.pla-com.com-slot .com-item:nth-child(3) {
		animation: 4800ms 200ms show cubic-bezier(1,.34,.34,1) backwards;
	}
	.pla-com.com-slot .com-item:nth-child(4) {
		animation: 5200ms 250ms show cubic-bezier(1,.34,.34,1) backwards;
	}
		.pla-com.com-slot .com-item .item-list .list-item {
			border: 2vh solid white;
			height: 23vh;
			display: flex;
			background-size: cover;
			background-position: center;
		}
			.pla-com.com-slot .com-item .item-list .list-item img {
				width: auto;
				height: auto;
				max-width: 50%;
				max-height: 100%;
				margin: auto;
				transform: scale(0.5);
			}
		.pla-com.com-slot .com-item .item-list:last-child .list-item:nth-child(3) {
			height: 50vh;
			line-height: 50vh;
			color: white;
		}
			.pla-com.com-slot .com-item .item-list:last-child .list-item:nth-child(3) img {
				transform: scale(1);
			}
		.pla-com.com-slot .com-item .item-list .list-item.item-1 {
			background-image: url("images/background/1.png");
		}
		.pla-com.com-slot .com-item .item-list .list-item.item-2 {
			background-image: url("images/background/2.png");
		}
		.pla-com.com-slot .com-item .item-list .list-item.item-3 {
			background-image: url("images/background/3.png");
		}
		.pla-com.com-slot .com-item .item-list .list-item.item-4 {
			background-image: url("images/background/4.png");
		}
		.pla-com.com-slot .com-item .item-list .list-item.item-5 {
			background-image: url("images/background/5.png");
		}

* {
	padding: 0;
	margin: 0;
}
html, body {
	width: 100%;
	height: 100%;
	display: flex;
	overflow: hidden;
	background-color: rgb(250, 250, 250);
}
canvas {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) scale(0.5);
}

@media all and (max-width: 1023px) {
	canvas {
		transform: translate(-50%, -50%) scale(0.25);
	}
}