@charset 'UTF-8';

/* ----------------------------------------
    テキスト
---------------------------------------- */

.center {
	text-align: center;
}

.bold {
	font-weight: bold;
}

.small {
	font-size: .8em;
}

/* ----------------------------------------
    レイアウト
---------------------------------------- */

.grid {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
}
.grid-2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}
.grid-4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}

@media screen and (max-width: 800px) {
	.sp-grid {
		grid-template-columns: repeat(1, 1fr);
	}
	.sp-grid-2 {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ----------------------------------------
    レイアウト（余白）
---------------------------------------- */

.gap-1em {
	grid-gap: 1em;
}
.gap-2em {
	grid-gap: 2em;
}
.gap-3em {
	grid-gap: 3em;
}

/* ----------------------------------------
    横幅
---------------------------------------- */

.w-1000 {
	margin: auto;
	width: 1000px;
	max-width: calc(100% - 3em);
}

.w-800 {
	margin: auto;
	width: 800px;
	max-width: calc(100% - 3em);
}

.w-600 {
	margin: auto;
	width: 600px;
	max-width: calc(100% - 3em);
}

.w-max {
	margin: auto;
	width: 100%;
	max-width: calc(100% - 3em);
}