/* ============================================
   ケース別実践Ｑ＆Ａ集 共通スタイルシート
   qa-common.css
   ============================================ */

/* ------------------------------------------
   バッジ（PEFC / SOFC）
------------------------------------------ */
.badge-type {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	width: 5vw;
	border-radius: 50%;
	aspect-ratio: 1;
	padding: 0.2em 0.8em;
}
.badge-pefc {
	background: #1a3a8a;
}
.badge-sofc {
	background: #028090;
}
/* タイプバッジ行（右寄せ） */
.qa-type-badges {
	justify-content: flex-end;
	gap: 1em;
	margin-bottom: 0.5em;
}
/* ------------------------------------------
   QAセクション・ブロック
------------------------------------------ */
.qa-section {
	margin-top: 0.5em;
	text-align:left;
}
.qa-block-first {
	margin-bottom: 5em;
}
.qa-block-last {
	margin-bottom: 0;
}
/* ------------------------------------------
   見出し行
------------------------------------------ */
.qa-heading-row {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-bottom: 0.6em;
}
.qa-heading-inner {
	display: flex;
	align-items: center;
	gap: 0.4em;
}
.qa-diamond {
	color: #b45592;
	font-size: 1.4em;
}
.qa-title {
	font-size: 1.3em;
	font-weight: bold;
	color: #1a3a8a;
}
.qa-dashed-line {
	flex: 1;
	border-top: 4px dashed #f05a26;
}
.qa-badge-label {
	border: 2px solid #f05a26;
	border-radius: 50px;
	padding: 0.15em 0.7em;
	font-size: 0.85em;
	white-space: nowrap;
}
/* ------------------------------------------
   ヒアリング項目
------------------------------------------ */
.hearing-label {
	display: inline-block;
	background: #5b9bd5;
	color: #fff;
	padding: 0.2em 0.8em;
	border-radius: 50px;
	font-size: 0.9em;
}
/* 縦並びリスト */
.hearing-list {
	padding-left: 0.5em;
	margin: 0 0 1em 0;
	list-style: none;
}
.hearing-list li {
	margin-bottom: 0.2em;
}
.hearing-list li::before {
	content: "▶";
	color: #f05a26;
	margin-right: 0.3em;
}
/* 横並びリスト */
.hearing-list-inline {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em 2em;
	padding-left: 0.5em;
	margin: 0 0 1em 0;
	list-style: none;
}
.hearing-list-inline li::before {
	content: "▶";
	color: #f05a26;
	margin-right: 0.3em;
}
/* ------------------------------------------
   説明のポイント
------------------------------------------ */
.point-label {
	display: inline-block;
	background: #f05a26;
	color: #fff;
	padding: 0.2em 0.8em;
	border-radius:50px;
	font-size: 0.9em;
	position: absolute;
	left:-3px;
	top:0;
	transform:translateY(-50%);
}
.point-box {
	border: 3px dashed #f05a26;
	border-radius: 0.5em;
	padding: 0.8em 1.2em;
	margin: 0.3em 0 1em 0;
	position:relative;
}
.point-box:has(.point-label) {
 padding: 1.2em 1.0em 0.2em;
 margin-top:1em;
}
.point-box ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.point-box ul li {
	line-height: 1.9;
}
.point-box ul li::before {
	content: "✔";
	color: #028090;
	font-weight: bold;
	margin-right: 0.4em;
}
/* ------------------------------------------
   フォロートーク
------------------------------------------ */
.follow-talk-label {
	display: inline-block;
	background: #b3d3bb;
	color: #111;
	padding: 0.2em 0.8em;
	border-radius: 50px;
	font-size: 0.9em;
}
.qa-body {
	display: flex;
	align-items: flex-start;
	gap: 0.5em;
	margin-top: 0.2em;
	padding-left: 0.5em;
	line-height: 1.8;
}
.qa-icon {
	font-size: 1.5em;
	margin-top: -0.1em;
	color: #488c61;
}
.qa-text {
	margin: 0;
	text-align: left;
}
/* ------------------------------------------
   よくある質問一覧ページ専用（E0047-01）
------------------------------------------ */
.section-title {
	display: flex;
	align-items: center;
	gap: 0.4em;
	font-size: 1.4em;
	font-weight: bold;
	color: #1a3a8a;
	margin-bottom: 0.4em;
}
.section-title .diamond {
	color: #b45592;
	font-size: 1.1em;
}
.subtitle {
	font-size: 1.1em;
	margin: 0 0 1em 1.2em;
}
.subtitle::before {
	content: "●";
	color: #1a3a8a;
	margin-right: 0.4em;
}
.chart-heading {
	text-align: center;
	font-size: 1.15em;
	font-weight: bold;
	color: #1a3a8a;
	margin-bottom: 1em;
}
/* 2カラムレイアウト */
.qa-columns {
	display: flex;
	gap: 0;
	border: 2px solid #ccc;
	border-radius: 6px;
	overflow: hidden;
}
.qa-col {
	flex: 1;
	padding: 0 1em ;
}
.qa-col-left {
	border-right: 3px solid #5bbccc;
}
/* カラムヘッダ */
.col-header {
	text-align: center;
	font-size: 1.1em;
	font-weight: bold;
	border: 2px solid #ccc;
	border-radius: 6px;
	padding: 0.1em 0.5em;
	margin-bottom: 1em;
}
.col-header .pefc {
	color: #2d77ba;
}
.col-header .sofc {
	color: #028090;
}
.col-header .slash {
	color: #555;
}
/* 疑問グループ */
.qa-group {
	display: flex;
	align-items: flex-start;
	gap: 0.5em;
	margin-bottom: 1.4em;
}
.qa-group:last-child {
	margin-bottom: 0;
}
/* 疑問ラベル */
.qa-label {
	background: #f4a58a;
	border: 2px solid #f05a26;
	border-radius: 50px;
	padding: 0.25em 0.7em;
	font-size: 0.88em;
	white-space: nowrap;
	min-width: 6em;
	text-align: center;
	margin-top: 0.2em;
}
/* 矢印 */
.qa-arrow {
	font-size: 1.1em;
	color: #888;
	margin-top: 0.3em;
	flex-shrink: 0;
}
/* 原因ボックス */
.qa-causes {
	border: 2px dashed #c084c8;
	border-radius: 6px;
	padding: 0.4em 0.8em;
	flex: 1;
}
.qa-causes ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.qa-causes ul li {
	padding: 0.25em 0;
	font-size: 0.9em;
	border-bottom: 1px solid #e8d0ef;
	text-align: center;
}
.qa-causes ul li:last-child {
	border-bottom: none;
}
