body {
	background: #fff;
}

body>footer {
	text-align: center;
	margin-top: 50px;
}

.app {
	max-width: 1024px;
	margin: 0 auto;
	padding: 0 16px 20px;
}

.app_title {
	color: #000;
	border-bottom: 4px solid #177B39;
}

.app_h2 {
	margin: 50px 0 0;
}

.app_h2 span,
.app_h3 span {
	border-bottom: 3px solid #177B39;
}

.app_tableWrapper {
	margin-top: 20px;
}

.app_title+.app_h2 {
	margin-top: 20px;
}

.app_h3 {
	margin: 40px 0 0;
}

.app_forms {
	margin: 10px 0;
}

.app_tabbar {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
}

.app_tab {
	background: #fff;
	border: 2px solid #177B39;
	border-radius: 4px;
	cursor: pointer;
	padding: 5px 10px;
	font-size: 1em;
	color: inherit;
}

.app_tab-active {
	background: #177B39;
	color: #fff;
}

.app_simpleTable {
	width: 100%;
	border-collapse: collapse;
}

.app_simpleTable th,
.app_simpleTable td {
	text-align: left;
	padding: 5px 10px;
	white-space: pre-line;
}

.app_tableWrapper:has(.app_simpleTable-typeA) {
	border-left: 5px solid #177B39;
	padding-left: 15px;
}

.app_simpleTable-typeA tr+tr {
	border-top: 1px dotted #ccc;
}

/* --- ここから表（TypeB）のスタイル定義 --- */

.app_simpleTable-typeB th {
	background: #70ad47; /* ヘッダーは緑 */
	color: #fff;
	border: 1px solid black;
}

/* 強制的に白背景・黒枠線にする設定 */
.app_simpleTable-typeB td {
	background-color: #fff !important;
	border: 1px solid black !important;
	color: #000 !important;
}

/* 縞模様を無効化 */
.app_simpleTable-typeB tbody tr:nth-child(odd),
.app_simpleTable-typeB tbody tr:nth-child(even) {
	background-color: #fff !important;
}

/* --- 追加機能：目次と表の均等配置 --- */

/* 目次（TOC） */
.app_toc {
	margin: 20px 0;
	padding: 15px;
	background-color: #f9f9f9;
	border: 1px solid #ddd;
	border-radius: 4px;
}

.app_toc ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	justify-content: center;
}

.app_toc a {
	text-decoration: none;
	color: #177B39;
	font-weight: bold;
	display: block;
	padding: 5px 10px;
	border: 1px solid #177B39;
	border-radius: 20px;
	background: #fff;
	transition: all 0.3s ease;
}

.app_toc a:hover {
	background-color: #177B39;
	color: #fff;
}

.app_simpleTable-typeB {
	table-layout: fixed; 
	width: 100%;
}

/* セル内の文字が多すぎてはみ出す場合の処理（折り返し） */
.app_simpleTable-typeB th,
.app_simpleTable-typeB td {
	word-wrap: break-word;
	overflow-wrap: break-word;
}


/* --- ページトップへ戻るボタン --- */
.app_backToTop {
	text-align: right;
	margin-top: 20px;
	margin-bottom: 40px;
}

.app_backToTop a {
	display: inline-block;
	text-decoration: none;
	color: #666;
	font-size: 0.9em;
	padding: 5px 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #f9f9f9;
	transition: background-color 0.3s;
}

.app_backToTop a:hover {
	background-color: #e0e0e0;
	color: #333;
}


/* モバイル版 */
@media (max-width: 767px) {
	.app {
		padding: 0;
	}

	.app_breadcrumb>li {
		display: block;
	}

	.app_tabbar {
		gap: 5px;
		grid-template-columns: repeat(2, 1fr);
	}

	.app_forms button {
		margin-top: 0;
	}

	.app_fieldset {
		display: block;
	}

	.app_legend br {
		display: none;
	}

	.app_fieldset input[type="text"] {
		box-sizing: border-box;
		width: 100%;
	}

	.app_dataSummary {
		flex-direction: column;
	}

	.app_dataSummary_right {
		text-align: right;
	}
	
	.app_toc ul {
		flex-direction: column;
		gap: 10px;
	}
	
	/* モバイルでは均等配置を解除して、内容に合わせる（文字がつぶれるのを防ぐ） */
	.app_simpleTable-typeB {
		table-layout: auto;
	}
}