@charset "UTF-8";

body {
	margin: 0;
	font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif;
}

/* 基本 */
.post * {
	margin: 0;
}

/* グリッド */
.post {
	display: grid;
	grid-template-columns: repeat(20, 1fr);
	grid-template-rows: repeat(2, 1fr);
	grid-column-gap: 20px;
	grid-row-gap: 10px;
	padding: 0 30px;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-size: 16px;
}


/* 文章01 ～ 文章04 */
.post-text01-title {
	grid-column: 1;
	grid-row: 2;
}
.post-text01-input {
	grid-column: 2 / 4;
	grid-row: 2;
}
.post-text02-title {
	grid-column: 4;
	grid-row: 2;
}
.post-text02-input {
	grid-column: 5 / 13;
	grid-row: 2;
}
.post-text03-title {
	grid-column: 13;
	grid-row: 2;
}
.post-text03-input {
	grid-column: 14 / 17;
	grid-row: 2;
}
.post-text04-title {
	grid-column: 17;
	grid-row: 2;
}
.post-text04-input {
	grid-column: 18 / 21;
	grid-row: 2;
}


/* ##### 画面の横幅1000ピクセル以上 ##### */
@media (min-width: 2000px) {

	.post {
		width: 2000px;
		box-sizing: border-box;
		margin: auto;
		font-size: 20px;
	}

}


/* ##### 画面の横幅1000～1999ピクセル ##### */
@media (min-width: 1000px) and (max-width: 1999px) {
	.post {
		display: grid;
		width: 1000px;
		grid-template-columns: repeat(12, 1fr);
		grid-template-rows: repeat(4, 1fr);
}

	/* 文章01 ～ 文章04 */
	.post-text03-title {
		grid-column: 1;
		grid-row: 4;
		text-align: right;
	}
	.post-text03-input {
		grid-column: 2 / 5;
		grid-row: 4;
	}
	.post-text02-title {
		grid-column: 1;
		grid-row: 3;
		text-align: right;
	}
	.post-text02-input {
		grid-column: 2 / 13;
		grid-row: 3;
	}
	.post-text01-title {
		grid-column: 5;
		grid-row: 2;
		text-align: right;
	}
	.post-text01-input {
		grid-column: 6 / 9;
		grid-row: 2;
	}
	.post-text04-title {
		grid-column: 9;
		grid-row: 4;
		text-align: right;
	}
	.post-text04-input {
		grid-column: 10 / 13;
		grid-row: 4;
	}
}


/* ##### 画面の横幅999ピクセル以下 ##### */
@media (max-width: 999px) {

	.post {
		grid-template-columns: none;
		grid-template-rows: none;
		grid-row-gap: 20px;
		padding: 20px;
		font-size: 14.4px;
	}

	.post > *,
	.post::after {
		grid-column: auto;
		grid-row: auto;
	}


	/* 文章01 ～ 文章04 */
	.post-text01-title,
	.post-text01-input,
	.post-text02-title,
	.post-text02-input,
	.post-text03-title,
	.post-text03-input,
	.post-text04-title,
	.post-text04-input {
		font-size: 18px;
	}

}