@charset "UTF-8";
.tiles--2col,
.tiles--3col {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.tile {
	margin: 0.5rem;
	padding: 1rem;
	width: 90%;
	min-width: 80vw;
	min-height: 30vh;
	border-radius: 0.5em;
	text-align: left;
}
.tile__title {
	font-weight: bold;
	font-size: 1.5rem;
}
.tile--long {
	height: auto;
}

/** SP Contents */
@media screen and (min-width: 1280px) {
	.tiles--3col {
		margin: 0 auto;
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-template-rows: 1fr;
		gap: 1rem;
		width: 100%;
		max-width: 90rem;
		place-items: center; /* align-items + justify-items の短縮形 */
	}
	.tiles--2col {
		margin: 0 auto;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1rem;
		width: 100%;
		max-width: 90rem;
		place-items: center;
	}

	.tile {
		width: 100%;
		margin: 0;
		min-width: initial; /* PCではmin-widthをリセットして、親の幅に合わせる */
		min-height: 30vh;
		box-sizing: border-box;
	}
}
