/*
 * Phase 8C：資格比較（[qlm_qualification_compare]）専用の見た目。すべて .qlm-qcompare 配下に
 * scopeしており、既存の資格詳細ページ・資格探索・クイズ等のCSSには影響しない。
 * 横スクロール必須の巨大tableは避け、項目ごとに「見出し→資格ごとのセル」を並べるgridで構成する
 * （PC：資格を列に並べた比較、スマホ：1列に収まり項目単位で縦積み）。
 */

.qlm-qcompare {
	max-width: 900px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 1.6;
	box-sizing: border-box;
}

.qlm-qcompare * {
	box-sizing: border-box;
	max-width: 100%;
	overflow-wrap: anywhere;
}

.qlm-qcompare-notice,
.qlm-qcompare-partial-notice {
	font-weight: 600;
}

.qlm-qcompare-partial-notice {
	color: #8a6d1a;
	background: #fdf3d8;
	border-radius: 6px;
	padding: 0.6em 0.9em;
}

.qlm-qcompare-heading {
	font-size: 1.15rem;
	margin: 0 0 0.5em;
}

.qlm-qcompare-names {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em 1em;
	list-style: none;
	margin: 0 0 1.5em;
	padding: 0;
}

.qlm-qcompare-names li {
	background: #f6f9fc;
	border: 1px solid #e6edf3;
	border-radius: 999px;
	padding: 0.3em 0.9em;
	font-weight: 600;
}

.qlm-qcompare-item {
	margin-bottom: 1.5em;
}

.qlm-qcompare-item-heading {
	font-size: 1rem;
	margin: 0 0 0.6em;
	padding-bottom: 0.3em;
	border-bottom: 1px solid #dde6ee;
}

.qlm-qcompare-item-grid {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 220px, 1fr ) );
	gap: 0.75em;
}

.qlm-qcompare-cell {
	background: #fafbfc;
	border: 1px solid #f0f1f2;
	border-radius: 10px;
	padding: 0.85em 1em;
}

.qlm-qcompare-cell-qual {
	font-size: 0.8em;
	font-weight: 600;
	color: #556370;
	margin-bottom: 0.35em;
}

.qlm-qcompare-cell-value {
	font-size: 1.02rem;
	font-weight: 600;
}

.qlm-qcompare-supplement {
	display: block;
	margin-top: 0.3em;
	font-size: 0.85em;
	font-weight: 400;
	color: #667079;
}

.qlm-qcompare-highlight {
	display: inline-block;
	margin-top: 0.5em;
	font-size: 0.78em;
	font-weight: 700;
	color: #1a6f3d;
	background: #e3f6ea;
	border-radius: 4px;
	padding: 0.2em 0.55em;
}

.qlm-qcompare-workplaces-list {
	margin: 0;
	padding-left: 1.2em;
	font-weight: 400;
}

.qlm-qcompare-detail-link {
	font-weight: 600;
}

/* 極小幅ではitem-gridを1列に固定し、資格ごとの比較を縦積みで確実に読める形にする。 */
@media ( max-width: 380px ) {
	.qlm-qcompare-item-grid {
		grid-template-columns: 1fr;
	}
}

/*
 * Phase 8D-3A：市場比較（求人での資格ニーズ／収入面の参考データ）。
 * 各行自体は既存 .qlm-qcompare-item / .qlm-qcompare-item-grid / .qlm-qcompare-cell をそのまま
 * 再利用しており、ここでは市場セクション固有の見出し・調査条件・注記・折りたたみのみを追加する。
 */
.qlm-qcompare-market {
	margin-top: 2em;
	padding-top: 1.5em;
	border-top: 2px solid #dde6ee;
}

.qlm-qcompare-market-heading {
	font-size: 1.1rem;
	margin: 1.5em 0 0.6em;
}

.qlm-qcompare-market-heading:first-child {
	margin-top: 0;
}

.qlm-qcompare-market-conditions {
	font-weight: 600;
	color: #445263;
	margin: 0 0 0.3em;
}

.qlm-qcompare-market-batch-name {
	font-size: 0.85em;
	color: #667079;
	margin: 0 0 0.8em;
}

.qlm-qcompare-market-methodology {
	font-size: 0.85em;
	color: #556370;
	margin: 0 0 1em;
}

.qlm-qcompare-market-methodology summary {
	cursor: pointer;
	font-weight: 600;
}

.qlm-qcompare-market-methodology p {
	margin: 0.5em 0 0;
	white-space: pre-line;
}

.qlm-qcompare-market-notice {
	font-size: 0.82em;
	color: #667079;
	margin: 0.5em 0 1.5em;
}

.qlm-qcompare-market-salary-line {
	display: block;
}

.qlm-qcompare-market-salary-line:first-child {
	font-size: 1.05em;
}
