/* ==================== h1.css ==================== */

h1 {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 2em auto 0;
	background: no-repeat center center;
	background-size: contain;
}


@media (max-width: 567px) {
	h1 {
		width: 21.65em;
		height: 12.05em;
		background-image: url(../images/index/title_cloud_sp.svg);
	}
}


@media (min-width: 568px) {
	h1 {
		width: 50em;
		height: 10.6em;
		background-image: url(../images/index/title_cloud_pc.svg);
	}
}


/* ==================== indexBanner.css ==================== */

.indexBanner ul {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 2em auto;
	padding: 0;
	list-style-type: none;
}

.indexBanner li {
	transition: transform 250ms;
}
.indexBanner li:hover {
	transform: scale(1.08);
}


/* ==================== indexMenu.css ==================== */

.indexMenu ul {
	position: relative;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
}

.indexMenu li {
	position: absolute;
	transition: transform 250ms;
}
.indexMenu li:hover {
	transform: scale(1.08);
}


@media (max-width: 567px) {

	.indexMenu ul {
		width: 21.45em;
		height: 47.05em;
		margin-top: 1em;
	}

	.menu_cm {left: 0.9em; top: 12.4em;}
	.menu_episode {left: 0.95em; top: 35.85em;}
	.menu_factory {left: 9em; top: 36.8em;}
	.menu_game {left: 11.65em; top: 14em;}
	.menu_history {left: 11.8em; top: 28em;}
	.menu_lineup {left: 0em; top: 0em;}
	.menu_play {left: 1.5em; top: 24.05em;}
	.menu_tales {left: 10.7em; top: 2.1em;}

}


@media (min-width: 568px) {

	.indexMenu ul {
		width: 44.6em;
		height: 23.3em;
	}

	.menu_cm {left: 24.65em; top: 1.3em;}
	.menu_episode {left: 24.25em; top: 12.75em;}
	.menu_factory {left: 32.25em; top: 13.1em;}
	.menu_game {left: 35.75em; top: 0em;}
	.menu_history {left: 14em; top: 16.05em;}
	.menu_lineup {left: 0em; top: 0.2em;}
	.menu_play {left: 3.45em; top: 11.95em;}
	.menu_tales {left: 11.85em; top: 2.2em;}
}