/* ============================================================
   KS掲載学校紹介 フロントCSS
   方針：モバイル優先、左右の余白は最小限、
         表がはみ出す場合は右へスクロール、大学名列（左）は固定表示
   ============================================================ */

.ks-gi-wrap {
	max-width: 100%;
	padding: 0 4px;
}

/* ---------- パンくず ---------- */
.ks-gi-breadcrumb {
	font-size: 13px;
	color: #888;
	margin-bottom: 16px;
}
.ks-gi-breadcrumb a {
	color: #1a3a6b;
	text-decoration: none;
}
.ks-gi-bc-current {
	color: #666;
}

/* ---------- 見出し・リード文 ---------- */
.ks-gi-title {
	font-size: 22px;
	font-weight: 700;
	color: #222;
	margin: 0 0 12px;
	padding-left: 8px;
	border-left: 5px solid #c0392b;
}
.ks-gi-lead {
	font-size: 15px;
	color: #444;
	margin: 0 0 20px;
}
.ks-gi-region-heading {
	font-size: 17px !important;
	font-weight: 700 !important;
	color: #1a3a6b !important;
	margin: 28px 0 10px !important;
	padding-left: 0 !important;
	border-left: none !important;
}
.ks-gi-kana-heading {
	font-size: 18px !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	background: #1a3a6b !important;
	padding: 6px 12px !important;
	margin: 32px 0 12px !important;
	border-left: none !important;
	border-radius: 4px;
	scroll-margin-top: 20px;
}

/* ---------- 入口カード（設置者別・地域別トップ） ---------- */
.ks-gi-entrance-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	margin: 0 0 24px;
}
@media (max-width: 640px) {
	.ks-gi-entrance-grid {
		grid-template-columns: 1fr;
	}
}
.ks-gi-entrance-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #f7f8f9;
	border: 1px solid #ddd;
	border-radius: 6px;
	padding: 14px 16px;
	text-decoration: none;
	color: #222;
}
.ks-gi-entrance-card:hover {
	border-color: #1a3a6b;
	background: #eef1f5;
}
.ks-gi-entrance-title {
	font-weight: 700;
	font-size: 16px;
	color: #1a3a6b;
}
.ks-gi-entrance-desc {
	font-size: 13px;
	color: #888;
	margin-left: 8px;
}
.ks-gi-entrance-arrow {
	font-size: 20px;
	color: #c0392b;
	margin-left: 8px;
}

/* ---------- 都道府県チップ（地域別入口） ---------- */
.ks-gi-pref-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 8px;
}
.ks-gi-pref-chip {
	display: inline-block;
	padding: 8px 14px;
	background: #f7f8f9;
	border: 1px solid #ddd;
	border-radius: 20px;
	font-size: 14px;
	color: #1a3a6b;
	text-decoration: none;
	white-space: nowrap;
}
.ks-gi-pref-chip:hover {
	background: #1a3a6b;
	color: #fff;
	border-color: #1a3a6b;
}

/* ---------- 50音ジャンプナビ ---------- */
.ks-gi-kana-jump {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	position: sticky;
	top: 0;
	background: #fff;
	padding: 8px 0;
	margin: 0 0 8px;
	z-index: 5;
	border-bottom: 1px solid #eee;
}
.ks-gi-kana-jump a {
	display: inline-block;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	background: #eef1f5;
	color: #1a3a6b;
	border-radius: 50%;
	text-decoration: none;
	font-size: 14px;
	font-weight: 700;
}
.ks-gi-kana-jump a:hover {
	background: #1a3a6b;
	color: #fff;
}

/* ---------- 一覧テーブル：左列固定・右スクロール ---------- */
.ks-gi-table-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #ececec;
	border-radius: 4px;
	margin: 0 0 8px;
}
.ks-gi-table {
	width: 100%;
	min-width: 460px;
	border-collapse: collapse;
	font-size: 14px;
}
.ks-gi-table th,
.ks-gi-table td {
	padding: 10px 12px;
	border-bottom: 1px solid #ececec;
	white-space: nowrap;
	text-align: left;
}
.ks-gi-table thead th {
	background: #1a3a6b;
	color: #fff;
	font-weight: 700;
}
.ks-gi-table tbody tr:nth-child(even) td {
	background: #f7f8f9;
}
.ks-gi-table .ks-gi-col-name {
	min-width: 220px;
	white-space: normal;
}
.ks-gi-table .ks-gi-col-name a {
	color: #1a3a6b;
	font-weight: 700;
	text-decoration: none;
}
.ks-gi-table .ks-gi-col-name a:hover {
	text-decoration: underline;
}
/* 見出し(th)は白文字のまま。グレー文字はデータ行(td)だけに適用する */
.ks-gi-table .ks-gi-col-pref,
.ks-gi-table .ks-gi-col-owner {
	min-width: 80px;
}
.ks-gi-table tbody .ks-gi-col-pref,
.ks-gi-table tbody .ks-gi-col-owner {
	color: #555;
}
.ks-gi-table thead .ks-gi-col-pref,
.ks-gi-table thead .ks-gi-col-owner {
	color: #fff;
}

/* モバイル：大学名列を左に固定し、地域・設置だけを横スクロール対象にする */
@media (max-width: 640px) {
	.ks-gi-table {
		min-width: 100%;
	}
	.ks-gi-table .ks-gi-col-name {
		position: sticky;
		left: 0;
		background: #fff;
		min-width: 150px;
		max-width: 150px;
		z-index: 1;
		box-shadow: 2px 0 4px rgba(0,0,0,0.06);
	}
	.ks-gi-table thead .ks-gi-col-name {
		background: #1a3a6b;
		z-index: 2;
	}
	.ks-gi-table tbody tr:nth-child(even) .ks-gi-col-name {
		background: #f7f8f9;
	}
}

.ks-gi-count {
	font-size: 12px;
	color: #888;
	margin: 0 0 24px;
}
.ks-gi-empty {
	color: #888;
	padding: 20px 0;
}