/* KOYOMICHI Table Enhancer v0.2.2 */

.koy-table-wrap {
	position: relative;
	width: 100%;
	max-width: 100%;
	margin: 24px 0 30px;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
}

.koy-table-enhanced {
	display: table !important;
	margin: 0 !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	border: 1px solid #dde4e8;
	border-radius: 10px;
	background: #fff;
	color: #2b3945;
	font-size: 14px;
	line-height: 1.65;
	table-layout: auto;
	box-sizing: border-box;
}

.koy-table-enhanced thead { display: table-header-group !important; }
.koy-table-enhanced tbody { display: table-row-group !important; }
.koy-table-enhanced tfoot { display: table-footer-group !important; }
.koy-table-enhanced tr { display: table-row !important; }

.koy-table-enhanced th,
.koy-table-enhanced td {
	display: table-cell !important;
	box-sizing: border-box;
	padding: 12px 14px;
	border: 0;
	border-right: 1px solid #e5eaed;
	border-bottom: 1px solid #e5eaed;
	vertical-align: top;
	text-align: left;
	word-break: normal;
	overflow-wrap: anywhere;
}

.koy-table-enhanced tr > *:last-child { border-right: 0; }
.koy-table-enhanced tbody tr:last-child > * { border-bottom: 0; }

.koy-table-enhanced thead th,
.koy-table-enhanced thead td {
	background: #edf3f6;
	color: #263f51;
	font-weight: 800;
	white-space: nowrap;
}

.koy-table-enhanced tbody th {
	background: #f7f9fa;
	color: #293f51;
	font-weight: 800;
}

.koy-table-wrap-compact {
	overflow-x: visible;
}

.koy-table-enhanced.koy-table-compact {
	width: auto !important;
	min-width: min(100%, 420px);
	max-width: 100% !important;
}

.koy-table-enhanced.koy-table-compact tbody th:first-child,
.koy-table-enhanced.koy-table-compact tbody td:first-child {
	width: 1%;
	min-width: 96px;
	white-space: nowrap;
}

.koy-table-enhanced.koy-table-compact tbody td:last-child {
	min-width: 180px;
}

.koy-table-enhanced.koy-table-wide {
	width: 100% !important;
	min-width: min(100%, var(--koy-table-min-width, 620px));
	max-width: 100% !important;
}

@media (min-width: 701px) {
	.koy-table-enhanced.koy-table-wide col {
		width: auto !important;
	}

	.koy-table-enhanced.koy-table-wide th,
	.koy-table-enhanced.koy-table-wide td {
		width: auto !important;
		max-width: none !important;
	}
}

.koy-table-controls {
	display: flex;
	justify-content: center;
	padding: 12px 0 2px;
}

.koy-table-toggle {
	appearance: none;
	min-width: 210px;
	padding: 10px 18px;
	border: 1px solid #c9d5dc;
	border-radius: 999px;
	background: #fff;
	color: #285570;
	font: inherit;
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
	box-shadow: 0 4px 12px rgba(32, 56, 73, .05);
}

.koy-table-is-collapsed .koy-table-extra-row {
	display: none !important;
}

@media (max-width: 700px) {
	.koy-table-wrap {
		margin: 20px 0 26px;
		border-radius: 0;
	}

	.koy-table-wrap-compact {
		overflow-x: hidden;
	}

	.koy-table-enhanced.koy-table-compact {
		width: 100% !important;
		min-width: 0 !important;
		font-size: 13px;
	}

	.koy-table-enhanced.koy-table-compact th,
	.koy-table-enhanced.koy-table-compact td {
		padding: 10px 11px;
	}

	.koy-table-enhanced.koy-table-compact tbody th:first-child,
	.koy-table-enhanced.koy-table-compact tbody td:first-child {
		width: 34% !important;
		min-width: 0;
		white-space: normal;
	}

	.koy-table-enhanced.koy-table-compact tbody td:last-child {
		width: 66% !important;
		min-width: 0;
	}

	/* 3列以上は全体を横スクロール。先頭列固定はしない */
	.koy-table-wrap-wide {
		overflow-x: auto;
		padding-bottom: 5px;
	}

	.koy-table-enhanced.koy-table-wide {
		width: max-content !important;
		min-width: var(--koy-table-min-width, 620px) !important;
		max-width: none !important;
		font-size: 12px;
	}

	.koy-table-enhanced.koy-table-wide th,
	.koy-table-enhanced.koy-table-wide td {
		padding: 8px 10px;
	}

	.koy-table-enhanced.koy-table-wide th:first-child,
	.koy-table-enhanced.koy-table-wide td:first-child {
		position: static !important;
		left: auto !important;
		z-index: auto !important;
		box-shadow: none !important;
	}

	.koy-table-wrap-wide.koy-table-can-scroll {
		box-shadow: inset -10px 0 8px -10px rgba(25, 47, 63, .22);
	}

	.koy-table-toggle {
		width: min(100%, 320px);
	}
}

@media print {
	.koy-table-is-collapsed .koy-table-extra-row {
		display: table-row !important;
	}

	.koy-table-controls {
		display: none !important;
	}
}