@charset "UTF-8";

/* ====================================
	ベーススタイル
 ==================================== */

.font-bold {
	font-weight: 500;
}

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

/* フレックスコンテナ */
.flex-container {
	display: flex;
	flex-wrap: wrap;
}

.flex-item {
	width: 100%;
}

/* ====================================
	共通スタイル
 ==================================== */

.bdr-bk {
	border: solid 1px #000;
	padding: 1em;
}

/* メインセクション */
.main-title {
	font-weight: 500;
	text-align: center;
}

/* サブセクション */
.sub-category {
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	letter-spacing: 0.1em;
	color: #fff;
	border-radius: 4px;
	text-align: center;
}

ul.list-kouka li .ttl,
#sub01 .sub-category {
	background: #5A94CF;
}

#sub02 ul.list-kouka li .ttl,
#sub02 .sub-category {
	background: #3CBECD;
}

#sub03 ul.list-kouka li .ttl,
#sub03 .sub-category {
	background: #70CCAC;
}

#sub04 ul.list-kouka li .ttl,
#sub04 .sub-category {
	background: #F78F97;
}

ul.list-kouka li .ttl {
	padding: 0.2em;
	color: #fff;
	text-align: center;
}
ul.list-kouka li .ttl sup {
	color: #fff;
}
ul.list-kouka li .text {
	margin-top: 0.5em;
}

/* ====================================
	スマートフォン専用スタイル
===================================== */
@media only screen and (max-width: 767px) {

	.mts {
		margin-top: 2rem;
	}

	/* メインセクション */
	.main-section {
		padding: 4rem 0;
	}

	/* サブセクション */
	.sub-section {
		padding: 4rem 0;
	}
	.sub-title-container {
		margin-bottom: 3rem;
		text-align: center;
	}
	.sub-category {
		width: 8em;
		margin: 0 auto 1rem;
		font-size: 1.8rem;
	}
	.sub-title {
		padding: 0 5%;
		font-size: 2rem;
	}
	ul.list-kouka {
		margin-top: 3rem;
	}
	ul.list-kouka li {
		margin-top: 2rem;
	}
	ul.list-kouka li:first-child {
		margin-top: 0;
	}
	ul.list-kouka li .ttl {
		font-size: 1.6rem;
	}
	ul.list-kouka li .text {
		font-size: 1.4rem;
	}

	/* 注釈セクション */
	.caption-section {
		margin-top: 4rem;
		padding: 4rem 0 0;
		border-top: solid 1px #a8a8a8;
	}
	.banner-portal {
		margin: 0 auto 4rem;
	}

}

/* ====================================
	PC&タブレット、印刷専用スタイル
===================================== */
@media print , screen and (min-width: 768px) {

	.maxw1080 {
		max-width: 1080px;
		margin-left: auto;
		margin-right: auto;
	}
	.mts {
		margin-top: 4rem;
	}

	/* メインセクション */
	.main-section {
		padding: 4rem 0 5rem;
	}

	/* サブセクション */
	.sub-section {
		padding: 5rem 0;
	}
	.sub-title-container {
		display: flex;
		justify-content: space-between;
		margin-bottom: 3rem;
	}
	.sub-category {
		width: 9em;
		height: 1.8em;
		font-size: 2.6rem;
	}
	.sub-title {
		flex: 1;
		padding: 0 0 0 0.8em;
		font-size: 3rem;
	}
	ul.list-kouka {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-top: 5rem;
	}
	ul.list-kouka li {
		width: 48%;
		margin-top: 3rem;
	}
	ul.list-kouka li:nth-child(-n+2) {
		margin-top: 0;
	}
	ul.list-kouka li .ttl {
		font-size: 1.8rem;
	}
	ul.list-kouka li .text {
		font-size: 1.4rem;
	}

	/* 注釈セクション */
	.caption-section {
		margin-top: 4rem;
		padding: 6rem 0;
		border-top: solid 1px #a8a8a8;
	}
	.banner-portal {
		max-width: 675px;
		margin: 0 auto 8rem;
	}

}