@charset "utf-8";

/* サステナビリティ トップ */

/* ESGカード（環境・社会・ガバナンス）の高さを揃える */
#esg-list.card-list {
	align-items: stretch;
}

/* /sustainability/ 配下：メインコンテンツ内の最初のH2は上の余白なし（/common/v2/css/ir.css と同じ指定） */
main .col-lg-9 > .my-h2-block:first-child,
main .col-lg-9 > :first-child > .my-h2-block:first-child {
	margin-top: 0;
	padding-top: 0;
}

/* /sustainability/ 配下：メインコンテンツ先頭のページ内リンク（pfv-info-block）は上マージンなし */
main .col-lg-9 > .pfv-info-block:first-child {
	margin-top: 0;
}

/* /sustainability/ 配下：ページ内リンクは等幅の列に並べ、2行目以降も矢印の位置を1行目と揃える（サポートFAQページの pfv-info-block と同じ見た目）
   （custom.css は li を flex: 0 0 25%・左寄せで並べるため、li が少ないと右側が空き、blockparts.css の inline-block の枠では文字と矢印が重なる。
     枠を全幅にし、ul をグリッドにして auto-fit で列数を自動調整。余った幅は各列に均等に配分するので、li の数に関係なく右側に空白ができない） */
/* 枠は中身の幅に合わせて中央揃え（全幅に間延びさせない）。
   li の左右余白は 0.5rem に詰めているため、枠の内側に左右 1rem を足し、
   右端の矢印と枠の間を製品ページ（blockparts.css の li 左右 1.5rem）と同じ 1.5rem にする */
main .col-lg-9 .pfv-info-wrapper {
	display: inline-block;
	width: auto;
	max-width: 100%;
	padding: 0 1rem;
}

/* 列数は li の数で決める（1個→1列、2個→2列、3個以上→3列。1400px未満のPCでは最大2列）。
   1fr の列は一番長い項目の幅に揃うため、2行目以降も矢印の位置が1行目と揃う */
main .col-lg-9 .pfv-btn-list.no-icon {
	--pfv-cols: 3;
	display: grid !important;
	grid-template-columns: repeat(var(--pfv-cols), 1fr);
}

main .col-lg-9 .pfv-btn-list.no-icon:has(> li:only-child) {
	--pfv-cols: 1;
}

main .col-lg-9 .pfv-btn-list.no-icon:has(> li:nth-child(2):last-child) {
	--pfv-cols: 2;
}

@media (max-width: 1399px) {
	main .col-lg-9 .pfv-btn-list.no-icon:has(> li:nth-child(3)) {
		--pfv-cols: 2;
	}
}

/* テキストが1行に収まるよう、li・a の左右余白を詰める（custom.css：li 左右1.5rem、a 左2rem・右2.5rem） */
main .col-lg-9 .pfv-btn-list.no-icon li {
	min-width: 0;
	padding: 0 0.5rem;
}

/* テキストが短くても間延びしすぎない程度の長さを確保（製品ページと同じ custom.css の min-width: 210px） */
main .col-lg-9 .pfv-btn-list.no-icon li a {
	min-width: 210px;
	padding-left: 1rem;
	padding-right: 2rem;
}

/* /sustainability/ 配下：矢印はリンクの縦中央に配置（テキストが2行になったリンクだけ矢印が上に寄らないように。/common/v2/css/ir.css と同じ指定） */
main .col-lg-9 .pfv-btn-list li a::after {
	top: 50%;
	transform: translateY(-50%);
	line-height: 0;
}

/* /sustainability/ 配下：別ページへのページナビ（.pfv-info-block.page-nav。旧 pageNav）
   ページ内リンクではないため矢印は右向き（common-5.css のボタンと同じ icon-arrow-green.svg を半分に縮小）、表示中のページは緑 */
main .col-lg-9 .page-nav .pfv-btn-list li a::after {
	content: url(../img/icon-arrow-green.svg);
	width: auto;
	height: auto;
	right: 0.25rem;
	transform: translateY(-50%) scale(0.5);
}

/* ページナビは文字を左揃えにして、各列の書き出し位置を揃える（旧 pageNav と同じく左から並べる） */
main .col-lg-9 .page-nav .pfv-btn-list.no-icon li,
main .col-lg-9 .page-nav .pfv-btn-list.no-icon li a {
	text-align: left;
}

/* 長い項目（li.col-wide）は2列分の幅を使い、改行せず1行で表示（PCのみ）。
   リンクは文字の幅に合わせ、矢印が文字のすぐ後ろに来るようにする（2列分の右端まで離れないように） */
@media (min-width: 992px) {
	main .col-lg-9 .pfv-btn-list.no-icon li.col-wide {
		grid-column: span 2;
	}

	main .col-lg-9 .pfv-btn-list.no-icon li.col-wide a {
		display: inline-block;
		white-space: nowrap;
	}
}

main .col-lg-9 .page-nav .pfv-btn-list li a.current {
	color: #14A83B;
	pointer-events: none;
}

/* 環境への取り組み配下（body.page-env）・社会への取り組み配下（body.page-society）・ガバナンス配下（body.page-governance）のページナビのみ：項目が多いため、旧 pageNav と同程度の高さになるよう
   各リンクの上下余白を詰め、枠の上下に余白を確保（他のページ内リンクの高さは変えない）
   （custom.css の a 上下 1.55rem → 0.8rem。スマホ用の padding !important より優先させるため !important） */
.page-env main .col-lg-9 .page-nav .pfv-info-wrapper,
.page-society main .col-lg-9 .page-nav .pfv-info-wrapper,
.page-governance main .col-lg-9 .page-nav .pfv-info-wrapper {
	padding-top: 0.8rem;
	padding-bottom: 0.8rem;
}

.page-env main .col-lg-9 .page-nav .pfv-btn-list.no-icon li a,
.page-society main .col-lg-9 .page-nav .pfv-btn-list.no-icon li a,
.page-governance main .col-lg-9 .page-nav .pfv-btn-list.no-icon li a {
	padding-top: 0.8rem !important;
	padding-bottom: 0.8rem !important;
}

/* /sustainability/ 配下：スマホ時はページ内リンクを1行に1つずつ並べる
   （a の最小幅（blockparts.css 178px・custom.css 160px）を解除し、右端の矢印と重ならないよう右に余白、アイコンなしのため左余白を縮小） */
@media (max-width: 991px) {
	main .col-lg-9 .pfv-info-wrapper {
		display: block;
	}

	/* li の数に関係なく1列（:has の列数指定より優先させるため !important） */
	main .col-lg-9 .pfv-btn-list.no-icon {
		grid-template-columns: 1fr !important;
	}

	main .col-lg-9 .pfv-btn-list.no-icon li {
		width: 100%;
	}

	main .col-lg-9 .pfv-btn-list li a,
	main .col-lg-9 .pfv-btn-list.no-icon li a {
		min-width: 0;
		white-space: nowrap;
		padding: 1rem 2.25rem 1rem 1rem !important;
	}
}


/* /sustainability/ 配下：PDFリンクのアイコン（旧 style.css の .pdf を補完。/common/v2/css/ir.css の指定をベースに、
   common-5.css の section p { line-height: 2.2 } で文字がリンクの縦中央に来るため、アイコンも縦中央に配置） */
a.pdf {
	background: url(../../img/icon_pdf.png) 15px center no-repeat;
	padding-left: 40px;
	min-height: 22px;
	display: inline-block;
	color: #333;
}

a.pdf:hover {
	color: #14A83B;
	text-decoration: underline;
}

/* p 内の PDFリンクは blockparts.css の article .container p a:hover { opacity: 0.7 } がかかるため解除（IRと同じく緑＋下線のみ） */
article .container p a.pdf:hover {
	opacity: 1;
}

/* PDFリンクには別窓アイコン（common-5.css の a[target="_blank"]:after）を付けない */
a.pdf::after,
a[href*=".pdf"]::after {
	content: none;
}


/* /sustainability/ 配下：矢印付きリンク（旧 style.css の a.link。/common/v2/css/ir.css と同じ指定）
   別タブのリンク（target="_blank"）の末尾アイコンは common-5.css の a[target="_blank"]:after で付く */
a.link:before,
span.link:before {
	content: "\f061";
	font-family: FontAwesome;
	display: inline;
	color: #14A83B;
	padding-right: .5em;
}

/* 段落内の矢印付きリンク（a.link）は下線なし */
article .container p a.link {
	text-decoration: none;
}

/* /sustainability/ 配下：文章中のリンク（製品ページの段落内リンクと同じ：緑・下線・矢印なし、ホバー時 opacity 0.7。
   blockparts.css の article .container p a と同じ装飾を、段落以外（注記リスト・箇条書き内）でも使えるようにしたもの） */
main .col-lg-9 a.link-text {
	color: var(--bs-primary);
	text-decoration: underline;
}

main .col-lg-9 a.link-text:hover {
	opacity: 0.7;
}

/* 文章中のリンクで別窓（外部サイト）のものは、アイコンを icon-blank-green.svg にする
   （common-5.css の a[target="_blank"]:after は icon-blank-arrow-green.svg。大きさは同じ 13px の枠に収める） */
main .col-lg-9 a.link-text[target="_blank"]::after {
	content: "";
	width: 13px;
	height: 13px;
	background: url(../img/icon-blank-green.svg) no-repeat center / contain;
	vertical-align: middle;
}

/* /sustainability/ 配下：注記などの小さい文字（旧 .font_s） */
main .col-lg-9 .font_s {
	font-size: 0.8rem;
}

/* /sustainability/ 配下：番号付きリスト「1.」「2.」…（旧 style.css / common/css/sustainability.css の ul.ListCount.typeA） */
main .col-lg-9 ul.ListCount {
	counter-reset: number;
	list-style: none;
	padding-left: 0;
}

main .col-lg-9 ul.ListCount > li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: 0.5em;
	line-height: 1.7;
}

main .col-lg-9 ul.ListCount > li::before {
	counter-increment: number;
	content: counter(number) ".";
	position: absolute;
	left: 0.3rem;
	top: 0;
}

/* /sustainability/ 配下：緑の丸の箇条書き（旧 style.css の ul.circleFill）
   ※ materiality.html・stakeholder.html の表内は各ページの指定（.page-materiality / .page-stakeholder）が優先 */
main .col-lg-9 ul.circleFill {
	list-style: none;
	padding-left: 0;
}

main .col-lg-9 ul.circleFill li {
	position: relative;
	padding: 0.5em 0.5em 0.5em 2em;
	line-height: 1.6;
}

main .col-lg-9 ul.circleFill li::before {
	content: "";
	position: absolute;
	left: 0.2em;
	top: 0.8em;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	background: #14A83B;
}

/* /sustainability/ 配下：注記リスト「※」（旧 style.css の ul.noteList） */
main .col-lg-9 ul.noteList {
	list-style: none;
	padding-left: 0;
	font-size: 90%;
}

main .col-lg-9 ul.noteList li {
	position: relative;
	padding-left: 1.5em;
	line-height: 1.6;
}

main .col-lg-9 ul.noteList li::before {
	content: "※";
	position: absolute;
	left: 0;
	top: 0;
}

/* /sustainability/ 配下：連番付き注記リスト「※1」「※2」…（旧 style.css の ul.noteListCount） */
main .col-lg-9 ul.noteListCount {
	counter-reset: number;
	list-style: none;
	padding-left: 0;
	font-size: 90%;
}

main .col-lg-9 ul.noteListCount > li {
	position: relative;
	padding-left: 2.7em;
	line-height: 1.7;
	margin-bottom: 0.3em;
}

main .col-lg-9 ul.noteListCount > li::before {
	counter-increment: number;
	content: "※" counter(number);
	position: absolute;
	left: 0;
	top: 0;
}

/* /sustainability/ 配下：H3 の下の小見出し（旧 h4） */
main .col-lg-9 h4.sub-heading {
	font-size: 1.125rem;
	font-weight: bold;
	margin-bottom: 1rem;
}

main .col-lg-9 h4.sub-heading .font_s {
	font-weight: normal;
	padding-left: 1em;
}

/* /sustainability/ 配下：表（my-custom-table）の補助クラス */
main .col-lg-9 .my-custom-table col.w10 { width: 10%; }
main .col-lg-9 .my-custom-table col.w18 { width: 18%; }

/* 左上の空セル（旧 th_blank）：背景なし・上と左の罫線なし */
main .col-lg-9 .my-custom-table th.th_blank {
	background: none;
	border-top-color: transparent;
	border-left-color: transparent;
}

/* 強調する見出しセル（旧 table.typeA th.t_green の緑背景を継承） */
main .col-lg-9 .my-custom-table th.t_green {
	background: #ceefbd;
}

/* 薄緑の見出しセル（旧 .t_lime） */
main .col-lg-9 .my-custom-table th.t_lime {
	background: #ebf8e4;
}

/* 中央揃えのセル（旧 .t_c） */
main .col-lg-9 .my-custom-table .t_c {
	text-align: center;
}

/* /sustainability/ 配下：下線付きリンク（旧 a.link_line） */
main .col-lg-9 a.link_line {
	text-decoration: underline;
}

/* /sustainability/ 配下：枠線付き画像（旧 style.css の .borderGrey） */
main .col-lg-9 .borderGrey {
	border: 1px solid #95a6af;
	padding: 8px 6px;
}

/* /sustainability/ 配下：本文の右に回り込む画像（旧 .pull-right.lpd20.bpd10）。PCは右に回り込み、スマホは中央
   画像は原寸を上限に表示（img-fluid） */
main .col-lg-9 .img-float-right {
	text-align: center;
	margin: 0 0 1.5rem;
}

@media (min-width: 768px) {
	main .col-lg-9 .img-float-right {
		float: right;
		max-width: 45%;
		margin: 0 0 10px 20px;
	}
}

/* /sustainability/ 配下：薄緑の背景ボックス（旧 style.css の .designBox01。/common/v2/css/ir.css と同じ指定） */
main .col-lg-9 .designBox01 {
	background: #ebf1de;
	padding: 20px;
}


/* サステナビリティへの取り組み（activity.html） */

/* 推進体制図：PCでは旧デザイン（.w70）と同じく幅70%で中央表示、スマホは全幅 */
@media (min-width: 768px) {
	.page-activity .activity-img {
		width: 70%;
	}
}


/* マテリアリティ（materiality.html）：KPI表
   旧ページ（旧 style.css の table.typeA ＋ 旧 common/css/sustainability.css の #materiality .table-kpi）と同じ装飾にする */

/* 列幅（左：マテリアリティ／中：字下げ用の空セル／右：KPI） */
.page-materiality .table-kpi col.w55 { width: 55%; }
.page-materiality .table-kpi col.w8 { width: 8%; }
.page-materiality .table-kpi col.w37 { width: 37%; }

/* 表全体：罫線 #999、文字 14px、左寄せ（旧 th は左寄せ・太字・上揃え） */
.page-materiality .table-kpi {
	border: 1px solid #999;
	font-size: 0.875rem;
}

.page-materiality .table-kpi th,
.page-materiality .table-kpi td {
	border: 1px solid #999;
	text-align: left;
	color: #333;
}

.page-materiality .table-kpi th {
	background: #efefef;
	font-weight: bold;
	vertical-align: top;
	padding: 0.7em;
}

.page-materiality .table-kpi td {
	vertical-align: middle;
	padding: 0.7em 1.5em;
	line-height: 1.8;
}

.page-materiality .table-kpi th.t_c {
	text-align: center;
	vertical-align: middle;
}

/* 左上の空セルは背景なし・上と左の罫線は白 */
.page-materiality .table-kpi th.th_blank {
	background: none;
	border-top-color: #fff;
	border-left-color: #fff;
}

/* 見出し（白抜き・中央） */
.page-materiality .table-kpi h4 {
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.1;
	text-align: center;
	color: #fff;
	margin: 0.4em 0 0.8em;
	padding: 0.5em;
}

/* SDGsアイコン（中央）・アウトカム本文 */
/* （common-5.css の section p { line-height: 2.2!important } を上書きするため !important） */
.page-materiality .table-kpi th p {
	font-size: 1.2rem;
	line-height: 1.4 !important;
	margin: 0 0 10px;
}

.page-materiality .table-kpi th p.outcome {
	font-weight: bold;
	line-height: 1.6 !important;
	letter-spacing: -0.05rem;
}

/* 「実現したいアウトカム」ラベル（白背景・左寄せ） */
.page-materiality .table-kpi th .title-box {
	display: inline-block;
	background: #fff;
	font-weight: normal;
	text-align: center;
	margin: 0.5rem 0 0.6rem;
	padding: 0.2em 1.5em;
}

/* 取り組み項目（灰色の丸） */
.page-materiality .table-kpi ul.circleFill {
	list-style: none;
	padding-left: 0;
	margin: 0 0 10px;
}

.page-materiality .table-kpi ul.circleFill li {
	position: relative;
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.1;
	letter-spacing: -0.05rem;
	margin-left: 10px;
	padding: 0.5em 0.5em 0 0.8em;
}

.page-materiality .table-kpi ul.circleFill li::before {
	content: "";
	position: absolute;
	left: calc(0.8em - 18px);
	top: 10px;
	width: 0.7em;
	height: 0.7em;
	border-radius: 50%;
	background: #666;
}

.page-materiality .table-kpi sup {
	top: 0;
}

/* マテリアリティごとの色 */
.page-materiality .table-kpi th.t_ygreen { background: #eaf7e5; }
.page-materiality .table-kpi th.t_ygreen h4 { background: #38a608; }
.page-materiality .table-kpi th.t_ygreen .title-box,
.page-materiality .table-kpi th.t_ygreen p { color: #38a608; }

.page-materiality .table-kpi th.t_green { background: #dbe7dc; }
.page-materiality .table-kpi th.t_green h4 { background: #288a5d; }
.page-materiality .table-kpi th.t_green .title-box,
.page-materiality .table-kpi th.t_green p { color: #288a5d; }

.page-materiality .table-kpi th.t_lblue { background: #dfe9f4; }
.page-materiality .table-kpi th.t_lblue h4 { background: #499bdb; }
.page-materiality .table-kpi th.t_lblue .title-box,
.page-materiality .table-kpi th.t_lblue p { color: #499bdb; }

.page-materiality .table-kpi th.t_blue { background: #dfe9f4; }
.page-materiality .table-kpi th.t_blue h4 { background: #3c6b90; }
.page-materiality .table-kpi th.t_blue .title-box,
.page-materiality .table-kpi th.t_blue p { color: #3c6b90; }

/* スマホ時は表を横スクロール（blockparts.css の .horizontal-scroll は991px以下で有効）。
   blockparts.css のスマホ用 padding・文字サイズは旧ページに合わせて打ち消す */
@media (max-width: 991px) {
	.page-materiality .horizontal-scroll .my-custom-table {
		min-width: 750px;
	}

	.page-materiality .table-kpi th {
		padding: 0.7em;
		font-size: 0.875rem;
	}

	.page-materiality .table-kpi td {
		padding: 0.7em 1.5em;
		font-size: 0.875rem;
	}
}


/* ステークホルダーエンゲージメント（stakeholder.html）：主なステークホルダーの表
   旧ページ（旧 style.css の table.typeA・ul.circleFill ＋ 旧 common/css/sustainability.css の #stakeholder table.typeA.table01）と同じ装飾にする。
   罫線の色は製品ページの表に合わせ、blockparts.css の .my-custom-table（#ccc）のまま */

.page-stakeholder .table-stakeholder col.w20 { width: 20%; }
.page-stakeholder .table-stakeholder col.w40 { width: 40%; }

.page-stakeholder .table-stakeholder th,
.page-stakeholder .table-stakeholder td {
	padding: 1em;
	text-align: left;
	vertical-align: middle;
	color: #333;
}

/* 左列（ステークホルダー名）は白背景・太字 */
.page-stakeholder .table-stakeholder th {
	background: #fff;
	font-weight: bold;
}

/* 見出し行はグレー背景・中央 */
.page-stakeholder .table-stakeholder tr.head th {
	background: #f0f0f0;
	text-align: center;
}

/* セル内の p（common-5.css の section p { line-height: 2.2!important } を上書きするため !important） */
.page-stakeholder .table-stakeholder p {
	margin: 0;
	line-height: 1.6 !important;
}

/* 取り組み項目（緑の丸） */
.page-stakeholder .table-stakeholder ul.circleFill {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.page-stakeholder .table-stakeholder ul.circleFill li {
	position: relative;
	font-size: 1rem;
	line-height: 1.3;
	margin-left: 10px;
	padding: 0.5em 0.5em 0.1em 2em;
}

.page-stakeholder .table-stakeholder ul.circleFill li::before {
	content: "";
	position: absolute;
	left: calc(2em - 40px);
	top: 11px;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	background: #14A83B;
}

/* スマホ時は表を横スクロール（blockparts.css の .horizontal-scroll は991px以下で有効）。
   blockparts.css のスマホ用 padding・文字サイズは旧ページに合わせて打ち消す */
@media (max-width: 991px) {
	.page-stakeholder .horizontal-scroll .my-custom-table {
		min-width: 750px;
	}

	.page-stakeholder .table-stakeholder th,
	.page-stakeholder .table-stakeholder td {
		padding: 1em;
		font-size: 1rem;
	}
}


/* SDGsへの取り組み（sdgs.html）
   旧ページ（旧 style.css / style-renewal.css / common/css/sustainability.css）の装飾を移植 */

/* 画像を幅70%で中央表示（旧 .w70）。スマホは全幅（/sustainability/ 配下共通） */
@media (min-width: 768px) {
	main .col-lg-9 .img-w70 {
		width: 70%;
	}
}

/* 画像を幅60%で中央表示（旧 img.w60）。スマホは全幅（/sustainability/ 配下共通） */
@media (min-width: 768px) {
	main .col-lg-9 .img-w60 {
		width: 60%;
	}
}

/* SDGsへの取り組み：17目標ごとのブロック */
.page-sdgs .sdgs-item {
	margin-bottom: 2.5rem;
}

/* 目標名の見出し（緑のグラデーションの丸付き。旧 h3.typeCircle） */
.page-sdgs h3.typeCircle {
	position: relative;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1.3;
	margin: 0 0 0.6rem;
	padding: 0 0.5em 0.5em 1.6em;
	border: none;
	background: none;
}

.page-sdgs h3.typeCircle::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: linear-gradient(135deg, #ceeebe 0%, #ceeebe 49%, #8ad49d 49%, #14a83b 50%, #14a83b 100%);
}

/* 関連ページへのボタン（/ir/plan.html と同じ btn btn-primary btn-wide w-100）
   アイコン横の狭い列に縦に並べるため、btn-wide の上マージン（blockparts.css 2rem）と左右 6.5rem の余白を詰める。
   右側は矢印（common-5.css の .btn-primary::after：right 20px）と文字が重ならないよう広めに確保 */
.page-sdgs .sdgs-item .btn-wide {
	margin: 0 0 10px;
	padding: 1rem 3rem 1rem 1.5rem !important;
	/* common-5.css の .btn { min-width: 280px } が効くと、iPad mini 等（768px前後）で
	   col-9 の幅（約250px）を超えて隣の列に重なるため、列幅に合わせて縮められるようにする */
	min-width: 0;
}

/* 高さを下げたため、矢印（common-5.css の .btn-wide::after は top: 25px 固定）をボタンの縦中央に配置。
   ホバー時の右への動き（scale(0.5) translateX(20px)）はそのまま */
.page-sdgs .sdgs-item .btn-wide::after {
	top: 50% !important;
	transform: translateY(-50%) scale(0.5);
}

/* 文字色は黒（common-5.css の .btn-primary は緑 !important）。ホバー時は白のまま */
.page-sdgs .sdgs-item .btn-primary {
	color: #000 !important;
}

.page-sdgs .sdgs-item .btn-primary:hover {
	color: var(--bs-white) !important;
}

.page-sdgs .sdgs-item .btn-wide:hover::after {
	transform: translateY(-50%) scale(0.5) translateX(20px);
}

/* ブロック内の本文（パートナーシップ） */
.page-sdgs .sdgs-item p {
	margin-bottom: 10px;
}

/* スマホ時：目標名の見出しは H2（blockparts.css の h2.my-h2-text：991px以下で 1.125rem）と同じ文字サイズ */
@media (max-width: 991px) {
	.page-sdgs h3.typeCircle {
		font-size: 1.125rem;
	}
}


/* 環境への取り組み TOP（environment/index.html）・社会への取り組み TOP（society/index.html）・ガバナンス TOP（governance/index.html） */

/* 各ページへのボタン（/ir/plan.html と同じ btn btn-primary btn-wide w-100 を2列で並べる）
   列間は row g-3 で取るため btn-wide の上マージン（blockparts.css 2rem）をなくし、
   左右 6.5rem の余白は半幅の列に収まらないため詰める（右は矢印と文字が重ならないよう広めに確保） */
.page-env-index .menu-env .btn-wide,
.page-society-index .menu-society .btn-wide,
.page-governance-index .menu-governance .btn-wide {
	/* 片方だけ文字が2行になっても、横に並ぶボタンの高さを揃え、文字は上下中央に */
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	margin: 0;
	padding-left: 1.5rem !important;
	padding-right: 3rem !important;
}

/* 文字が2行になっても矢印がずれないよう、矢印（common-5.css の .btn-wide::after は top: 25px 固定）を縦中央に配置 */
.page-env-index .menu-env .btn-wide::after,
.page-society-index .menu-society .btn-wide::after,
.page-governance-index .menu-governance .btn-wide::after {
	top: 50% !important;
	transform: translateY(-50%) scale(0.5);
}

/* 文字色は黒（common-5.css の .btn-primary は緑 !important）。ホバー時は白のまま */
.page-env-index .menu-env .btn-primary,
.page-society-index .menu-society .btn-primary,
.page-governance-index .menu-governance .btn-primary {
	color: #000 !important;
}

.page-env-index .menu-env .btn-primary:hover,
.page-society-index .menu-society .btn-primary:hover,
.page-governance-index .menu-governance .btn-primary:hover {
	color: var(--bs-white) !important;
}

.page-env-index .menu-env .btn-wide:hover::after,
.page-society-index .menu-society .btn-wide:hover::after,
.page-governance-index .menu-governance .btn-wide:hover::after {
	transform: translateY(-50%) scale(0.5) translateX(20px);
}

/* 社会への取り組み TOP・ガバナンス TOP：ボタンの文字は 1rem（common-5.css の .btn は 0.9375rem、991px以下は 0.975rem !important） */
.page-society-index .menu-society .btn,
.page-governance-index .menu-governance .btn {
	font-size: 1rem !important;
}


/* 環境方針・体制・目標（environment/ems.html） */

/* QVP+全社方針書のサムネイル：PCは本文の右に回り込み（旧 .pull-right.lpd20.bpd10）、スマホは中央 */
.page-env-ems .policy-thumb {
	text-align: center;
	margin: 0 auto 1.5rem;
	/* 旧ページと同じく画像の原寸（300px）＋ borderGrey の余白・枠線 */
	max-width: 314px;
}

@media (min-width: 768px) {
	.page-env-ems .policy-thumb {
		float: right;
		margin: 0 0 10px 20px;
	}
}

.page-env-ems .policy-thumb-title {
	font-size: 0.8rem;
	font-weight: bold;
	margin-bottom: 10px;
}

.page-env-ems .policy-thumb a {
	color: #333;
	text-decoration: none;
}

.page-env-ems .policy-thumb a:hover {
	color: #14A83B;
	text-decoration: underline;
}

.page-env-ems .policy-thumb-pdf {
	display: block;
	margin-top: 5px;
	font-size: 0.875rem;
}

/* 長期環境目標：薄緑ボックス内の目標（旧 h4.t_c.normal） */
.page-env-ems .designBox01 {
	display: flex;
	align-items: center;
	justify-content: center;
}

.page-env-ems .designBox01 p.goal {
	font-size: 1.3rem;
	text-align: center;
	line-height: 1.6 !important;
	margin: 0;
}

@media (max-width: 991px) {
	.page-env-ems .designBox01 p.goal {
		font-size: 1.125rem;
	}
}


/* 大気への排出に対する取り組み（environment/atmosphere.html） */

/* 温室効果ガス排出量の表：見出し・数値とも上下中央 */
.page-env-atmosphere .table-ghg th,
.page-env-atmosphere .table-ghg td {
	vertical-align: middle;
}

/* 表の下の注記は表に近づける（my-custom-table の下マージン 1rem を利用） */
.page-env-atmosphere .my-table-block + .noteListCount {
	margin-top: 0;
}

/* 太陽光発電量の推移グラフ（キャプションは中央・太字） */
.page-env-atmosphere .solar-graph {
	text-align: center;
	margin: 0;
}

.page-env-atmosphere .solar-graph figcaption {
	font-weight: bold;
	line-height: 1.6;
	margin-bottom: 1rem;
}


/* 環境配慮型製品の開発（environment/products.html） */

/* 分野ごとの小見出しの色（旧 common/css/ir.css の .color-tool / .color-injection / .color-food） */
.page-env-products .color-tool { color: #009933; }
.page-env-products .color-injection { color: #00B0EE; }
.page-env-products .color-food { color: #FF9933; }

/* 本文中の製品名（旧 span.bold・1.1rem） */
.page-env-products .product-name {
	font-weight: bold;
	font-size: 1.1rem;
}

/* 関連装置へのボタン（btn btn-primary）。旧 square_btnNarrow と同じく文字幅に合わせた小さめのボタン。
   段落内のリンクにかかる blockparts.css の下線・ホバー時の opacity は解除し、矢印（right 20px）と文字が重ならないよう右を広めに確保 */
.page-env-products a.btn-related {
	padding: 0.8rem 3.5rem 0.8rem 1.5rem;
	text-decoration: none;
}

.page-env-products a.btn-related:hover {
	opacity: 1;
}

.page-env-products a.btn-related::after {
	top: 50%;
	transform: translateY(-50%) scale(0.5);
}

.page-env-products a.btn-related:hover::after {
	transform: translateY(-50%) scale(0.5) translateX(20px);
}

/* リサイクル：製品名（旧 #csr .b_caption） */
.page-env-products .recycle-list .b_caption {
	text-align: center;
	font-weight: bold;
	margin-bottom: 0.5rem;
}

.page-env-products .recycle-list p.font_s {
	line-height: 1.8 !important;
}


/* TCFD提言に準拠した気候関連財務情報開示（environment/tcfd.html）
   旧ページの <style> ブロック・旧 style.css の table.typeA / typeB の装飾を移植 */

/* 表のタイトル（旧 h5：120%・太字） */
.page-env-tcfd h5.table-title {
	font-size: 1.1rem;
	font-weight: bold;
	line-height: 1.8;
	margin-bottom: 0.5rem;
}

/* 表の共通：列幅・配置・見出しセルの色 */
.page-env-tcfd .my-custom-table col.w5 { width: 5%; }
.page-env-tcfd .my-custom-table col.w9 { width: 9%; }
.page-env-tcfd .my-custom-table col.w22 { width: 22%; }
.page-env-tcfd .my-custom-table col.w45 { width: 45%; }

.page-env-tcfd .my-custom-table th,
.page-env-tcfd .my-custom-table td {
	vertical-align: middle;
}

.page-env-tcfd .my-custom-table .t_c { text-align: center; }
.page-env-tcfd .my-custom-table .t_r { text-align: right; }

.page-env-tcfd .my-custom-table th.t_lime { background: #ebf8e4; }
.page-env-tcfd .my-custom-table th.t_skyblue { background: #93d9e5; }

/* 表2：シナリオ分析結果 */
.page-env-tcfd .table-tcfd2 th {
	text-align: center;
	padding: 0.5em;
}

/* 区分の縦書き見出し（スマホも横スクロールのため縦書きのまま） */
.page-env-tcfd .table-tcfd2 th.vertical {
	writing-mode: vertical-rl;
	letter-spacing: 0.1em;
}

.page-env-tcfd .table-tcfd2 th.vertical span {
	display: inline-block;
}

/* 重要度評価（大・中・小）：中央・太字・色分け */
.page-env-tcfd .table-tcfd2 td.rank {
	text-align: center;
	font-weight: bold;
}

.page-env-tcfd .tx_red { color: #DC143C; }
.page-env-tcfd .tx_blue { color: #3973ac; }
.page-env-tcfd .tx_green { color: #5bb72d; }

/* 重要度評価の見出し（4℃／1.5℃ シナリオ） */
.page-env-tcfd .font_ss { font-size: 0.8rem; }
.page-env-tcfd .font_sss { font-size: 0.6rem; }

/* 当社の取組：緑の丸の箇条書きを表内用に詰める */
.page-env-tcfd .table-tcfd2 ul.circleFill {
	margin: 0;
	text-align: left;
}

.page-env-tcfd .table-tcfd2 ul.circleFill > li {
	padding: 0.2em 0 0.2em 1.6em;
	line-height: 1.5;
}

.page-env-tcfd .table-tcfd2 ul.circleFill > li::before {
	left: 0;
	top: 0.45em;
	width: 0.9em;
	height: 0.9em;
}

/* 箇条書き内の「・」リスト（旧 ul.dotList） */
.page-env-tcfd .table-tcfd2 ul.dotList {
	list-style: disc;
	padding-left: 1.2em;
	margin: 0.3em 0 0;
}

.page-env-tcfd .table-tcfd2 ul.dotList li {
	padding: 0;
	line-height: 1.5;
}

.page-env-tcfd .table-tcfd2 ul.dotList li::before {
	content: none;
}

/* 表3：温室効果ガス排出量（旧 table.typeB のデザイン：背景なし・下罫線のみ、中身の幅の表） */
.page-env-tcfd .table-tcfd3 {
	width: auto;
	table-layout: auto;
	line-height: 1.5;
}

.page-env-tcfd .table-tcfd3 th,
.page-env-tcfd .table-tcfd3 td {
	border: none;
	background: none;
	padding: 1em;
	vertical-align: top;
}

.page-env-tcfd .table-tcfd3 th,
.page-env-tcfd .table-tcfd3 td {
	font-weight: normal;
}

.page-env-tcfd .table-tcfd3 th {
	width: auto;
	border-bottom: 2px solid #999;
}

.page-env-tcfd .table-tcfd3 td {
	border-bottom: 1px solid #999;
}

/* 「企業による直接排出」：下罫線なし */
.page-env-tcfd .table-tcfd3 tr:nth-child(2) th {
	border-bottom: 0;
}

/* 「（内訳）」：上下中央・左右広めの余白（旧 .box_detail） */
.page-env-tcfd .table-tcfd3 tr:nth-child(3) th:first-child {
	padding: 1em 3em;
	text-align: center;
	vertical-align: middle;
}

/* 「Scope1」：上下 1px 罫線 */
.page-env-tcfd .table-tcfd3 tr:nth-child(3) th:nth-child(2) {
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
}

/* 最終行の数値：2px 罫線で締める */
.page-env-tcfd .table-tcfd3 tr:last-child td {
	border-bottom: 2px solid #999;
}

@media (max-width: 580px) {
	.page-env-tcfd .table-tcfd3 tr:nth-child(3) th:first-child {
		padding: 1em;
		width: 30%;
	}
}

/* スマホ時：表1・表2は横スクロール（blockparts.css の .horizontal-scroll は991px以下で有効） */
@media (max-width: 991px) {
	.page-env-tcfd .horizontal-scroll .my-custom-table {
		min-width: 750px;
	}
}


/* 社会への取り組み配下（society/*.html）
   旧ページ（旧 style.css / style-renewal.css / common/css/ir.css の #csr）の装飾を移植 */

/* 薄緑の背景ボックス（旧 #csr .designBox01：余白 30px 50px、480px以下は 15px） */
.page-society main .col-lg-9 .designBox01 {
	padding: 30px 50px;
}

@media (max-width: 480px) {
	.page-society main .col-lg-9 .designBox01 {
		padding: 15px;
	}
}

/* TOPICS ボックス（旧 #csr .csr_topics・.title_a・.title_b） */
.page-society .csr_topics {
	background-color: #EDF4E2;
	padding: 30px 50px;
	border-radius: 12px;
	border: 3px #e5e5e5 solid;
}

.page-society .csr_topics .title_a {
	color: #396;
	margin: 0 0 10px 0;
	font-size: 110%;
}

.page-society .csr_topics .title_b {
	color: #6C6;
	margin-bottom: 20px;
	font-size: 180%;
	font-weight: bold;
	line-height: 1.4;
}

/* 横並びの写真（旧 .flexBox.type2）：中央寄せ、キャプションは中央 */
.page-society .photo-row {
	text-align: center;
}

.page-society .photo-row figure {
	margin-bottom: 0;
}

.page-society .photo-row figcaption,
.page-society .photo-caption {
	text-align: center;
	margin-top: 0.5rem;
}

/* 図の下の注記（左寄せ・小さめ） */
.page-society .photo-note {
	font-size: 0.875rem;
	margin-top: 0.5rem;
}

/* 表（旧 table.typeA）：列幅・見出しと数値は上下中央 */
.page-society .table-society col.w10 { width: 10%; }
.page-society .table-society col.w20 { width: 20%; }
.page-society .table-society col.w30 { width: 30%; }
.page-society .table-society col.w50 { width: 50%; }

.page-society .table-society th,
.page-society .table-society td {
	vertical-align: middle;
}

/* 列幅は colgroup で決める（blockparts.css のスマホ時 th 幅 40% を解除） */
.page-society .table-society th {
	width: auto;
}

/* 階層別研修プログラム（旧 .table-program）：研修概要の箇条書きは左揃え（td は blockparts.css で中央揃え） */
.page-society .table-program ul.circleFill {
	margin: 0;
	text-align: left;
}

.page-society .table-program ul.circleFill li {
	padding: 0.3em 0 0.3em 1.6em;
	line-height: 1.5;
}

.page-society .table-program ul.circleFill li::before {
	left: 0;
	top: 0.55em;
	width: 0.9em;
	height: 0.9em;
}

/* 人権・コンプライアンス：カスタマーハラスメントに対する基本方針のセクション前後は 4rem
   （見出しの上マージン・最後の段落の下マージンは HTML 側で 0 にし、前後の余白はこのマージンで決める） */
.page-society-human-rights .section-harassment {
	margin: 4rem 0;
}

/* 人権・コンプライアンス：人権に関する教育の実施のセクション上は 4rem（見出しの上マージンは HTML 側で 0） */
.page-society-human-rights .section-education {
	margin-top: 4rem;
}


/* ガバナンス配下（governance/*.html）
   旧ページ（ページ内 <style>・旧 common/css/sustainability.css）の装飾を移植 */

/* 知的財産：グラフのタイトル（旧 h5：120%・太字） */
.page-governance-ip h5.graph-title {
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.6;
	margin-bottom: 1.5rem;
}

/* 知的財産：グラフ下の囲み（旧 .box_topics） */
.page-governance .box_topics {
	background-color: #EDF4E2;
	padding: 1.5rem;
	border-radius: 12px;
	border: 3px #e5e5e5 solid;
}

/* 知的財産：写真のキャプション（中央） */
.page-governance-ip figure figcaption {
	margin-top: 0.5rem;
}

/* リスクマネジメント（governance/risk.html）：旧 common/css/ir.css の #risk・旧 sustainability.css の h4.bk_lgray を移植 */

/* 見出し横の注記「（2026年3月末現在）」（旧 .font_m） */
.page-governance-risk h3 .font_m {
	font-size: 0.875rem;
}

/* 主要なリスク：薄緑の囲みは余白 10px（旧 #risk #sectionD .designBox01） */
.page-governance-risk #sectionD .designBox01 {
	padding: 10px;
}

/* 主要なリスクの一覧：PCは3列、600px以下は1列（旧 ul.list-risk li の inline-block・幅 32.5%） */
.page-governance-risk ul.list-risk {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0;
}

.page-governance-risk ul.list-risk li {
	font-size: 0.96rem;
}

@media (max-width: 600px) {
	.page-governance-risk ul.list-risk {
		grid-template-columns: 1fr;
	}
}

/* リスクごとの見出し（旧 h4.bk_lgray：灰色背景） */
.page-governance-risk h4.bk_lgray {
	background: #efefef;
	padding: 0.5em;
	font-size: 1.125rem;
	font-weight: bold;
	line-height: 1.5;
	margin-bottom: 1rem;
}

/* 発生可能性・影響度のラベル（旧 #risk .iconArea / .iconPoss / .iconImpact） */
.page-governance-risk .iconArea {
	display: block;
	margin: 0.6em 0 0 0;
}

.page-governance-risk .iconPoss,
.page-governance-risk .iconImpact {
	display: inline-block;
	font-size: 0.9rem;
	font-weight: normal;
	color: #fff;
	padding: 3px 12px;
	white-space: nowrap;
}

.page-governance-risk .iconPoss { background: #489393; }
.page-governance-risk .iconPoss.moderate { background: #6CC; }
.page-governance-risk .iconPoss.low { background: #93dbdb; }

.page-governance-risk .iconImpact { margin-left: 2px; background: #5b89b7; }
.page-governance-risk .iconImpact.moderate { background: #6699cc; }
.page-governance-risk .iconImpact.low { background: #93b7db; }

/* リスクごとの本文は左右に余白（旧 #risk .box-risk-detail p） */
.page-governance-risk .box-risk-detail p {
	padding: 0 15px;
}

/* リスクマネジメント：580px以下では見出し横の注記を改行（旧 #risk h3 span） */
@media (max-width: 580px) {
	.page-governance-risk h3 .font_m {
		display: block;
	}
}


/* コーポレート・ガバナンス（governance/overview.html）
   旧ページの <style> ブロック・旧 common/css/sustainability.css / ir.css の #governance を移植 */

/* 見出し横の注記「（2026年3月末現在）」（旧 .font_m） */
.page-governance-overview h4 .font_m {
	font-size: 0.875rem;
	font-weight: normal;
}

/* 小見出し（旧 #governance h5：1.1rem・太字）・さらに下の小見出し（旧 h6：120%・太字） */
.page-governance-overview h5.sub-title {
	font-size: 1.1rem;
	font-weight: bold;
	margin-bottom: 1em;
}

.page-governance-overview h6.sub-title-s {
	font-size: 1.2rem;
	font-weight: bold;
	margin-bottom: 10px;
}

/* ページ内リンク（旧 nav.pageNavSub：薄緑の帯・白丸に下向き矢印。デザインは旧ページのまま） */
.page-governance-overview nav.pageNavSub {
	margin: 3rem 0;
	padding: 1rem 1.5rem 0.2rem;
	background: #ebf1de;
	font-size: 1rem;
}

.page-governance-overview nav.pageNavSub ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.page-governance-overview nav.pageNavSub li {
	position: relative;
	display: inline-block;
	padding: 0 15px 12px 26px;
}

.page-governance-overview nav.pageNavSub li::before {
	content: '';
	width: 18px;
	height: 18px;
	background: #fff;
	border: 1px solid #14A83B;
	border-radius: 50%;
	position: absolute;
	top: -16px;
	left: 0;
	bottom: 0;
	margin: auto;
}

.page-governance-overview nav.pageNavSub li::after {
	content: '';
	width: 6px;
	height: 6px;
	border: 0;
	border-top: solid 2px #14A83B;
	border-right: solid 2px #14A83B;
	transform: rotate(135deg);
	position: absolute;
	top: -18px;
	left: 6px;
	bottom: 0;
	margin: auto;
}

.page-governance-overview nav.pageNavSub li a {
	color: #333;
	text-decoration: none;
}

/* ホバー時は pfv-btn-list（blockparts.css の .pfv-btn-list li a:hover）と同じく opacity 0.7。
   丸い矢印アイコン（li の ::before / ::after）も一緒に薄くするため li ごと指定 */
.page-governance-overview nav.pageNavSub li:has(a:hover) {
	opacity: 0.7;
}

/* 表（旧 table.typeA）：列幅・配置 */
.page-governance-overview .table-gov col.w7 { width: 7%; }
.page-governance-overview .table-gov col.w10 { width: 10%; }
.page-governance-overview .table-gov col.w15 { width: 15%; }
.page-governance-overview .table-gov col.w20 { width: 20%; }
.page-governance-overview .table-gov col.w30 { width: 30%; }
.page-governance-overview .table-gov col.w40 { width: 40%; }
.page-governance-overview .table-gov col.w50 { width: 50%; }

/* 旧 typeA と同じく見出し・本文とも左上揃え。列幅は colgroup で決める（blockparts.css のスマホ時 th 幅 40% を解除） */
.page-governance-overview .table-gov th,
.page-governance-overview .table-gov td {
	vertical-align: top;
}

.page-governance-overview .table-gov th {
	width: auto;
}

/* コーポレート・ガバナンス体制早見表：PC 時は見出し幅 40% */
@media (min-width: 992px) {
	.page-governance-overview .table-gov-quick th {
		width: 40%;
	}
}

.page-governance-overview .table-gov td {
	text-align: left;
}

/* 見出しは中央（旧 #governance .table01 th / .table02 th）、数値は右揃え（旧 #governance .table02 td） */
.page-governance-overview .table-gov.th-center th {
	text-align: center;
}

.page-governance-overview .table-gov.td-right td {
	text-align: right;
}

/* セル単位の配置（旧 .t_c / .t_l / .v_m） */
.page-governance-overview .table-gov th.t_c,
.page-governance-overview .table-gov td.t_c {
	text-align: center;
}

.page-governance-overview .table-gov th.t_l,
.page-governance-overview .table-gov td.t_l {
	text-align: left;
}

.page-governance-overview .table-gov .v_m {
	vertical-align: middle;
}

/* 役員の概要（旧 table01）：見出し・本文とも上下中央 */
.page-governance-overview .table-gov-wide th,
.page-governance-overview .table-gov-wide td {
	vertical-align: middle;
}

/* 出席状況・期待する分野の見出し（旧 .font_ss / .font_sss） */
.page-governance-overview .table-gov th.font_ss {
	font-size: 0.8rem;
}

.page-governance-overview .table-gov th.font_sss {
	font-size: 0.7rem;
	letter-spacing: -0.09rem;
	padding: 0.5em 0.2em;
}

/* 社外・独立・委員会のマーク（旧 .tx_bl / .tx_pk / .tx_ye）、期待する分野の丸（旧 .tx_green・1.2rem） */
.page-governance-overview .tx_bl { color: #316ab4; }
.page-governance-overview .tx_pk { color: #ea6176; }
.page-governance-overview .tx_ye { color: #f08200; }
.page-governance-overview .tx_green { color: #6C3; }
.page-governance-overview .fa-circle::before { font-size: 1.2rem; }
.page-governance-overview .rpd5 { padding-right: 5px; }
.page-governance-overview .lpd10 { padding-left: 10px; }

/* 各機関の構成：人数のアイコン（旧 .keyColor / .blueColor / .lpd1 / .caption） */
.page-governance-overview .keyColor { color: #14A83B; }
.page-governance-overview .blueColor { color: #0298c5; }
.page-governance-overview .lpd1 { padding-left: 1px; }

.page-governance-overview .table-gov p.caption {
	font-size: 0.9rem;
	margin: 0;
}

/* 各機関の構成：委員の役職・氏名（旧 .list-name） */
.page-governance-overview .list-name {
	list-style: none;
	padding: 0;
	margin: 0;
}

.page-governance-overview .list-name-item {
	display: flex;
	align-items: center;
	margin-bottom: 0.3em;
}

.page-governance-overview .list-name .position {
	width: 8.1rem;
	flex-shrink: 0;
	text-align: left;
	padding-left: 1em;
}

.page-governance-overview .list-name .name {
	text-align: left;
}

/* 表内の緑の丸の箇条書き（td の右揃え・中央揃えの影響を受けないよう左揃え） */
.page-governance-overview .table-gov ul.circleFill {
	margin: 0;
	text-align: left;
}

.page-governance-overview .table-gov ul.circleFill li {
	padding: 0.3em 0 0.3em 1.6em;
	line-height: 1.5;
}

.page-governance-overview .table-gov ul.circleFill li::before {
	left: 0;
	top: 0.55em;
	width: 0.9em;
	height: 0.9em;
}

/* 役員報酬内容：区切り線（旧 #governance tr.double_line / tr.dotted_line） */
.page-governance-overview .table-gov tr.double_line {
	border-top: 3px double #8e8e8e;
}

.page-governance-overview .table-gov tr.dotted_line {
	border-top: 2px dotted #8e8e8e;
}

/* 役員の概要：横スクロール時の最小幅（列が多いため） */
@media (max-width: 991px) {
	.page-governance-overview .horizontal-scroll .table-gov-wide {
		min-width: 900px;
	}
}

/* 役員報酬内容：スマホ（横スクロール時）は項目名が細かく折り返さないよう、列幅を中身に合わせ、
   改行は HTML の <br> の位置だけにする */
@media (max-width: 991px) {
	.page-governance-overview .table-gov-pay {
		table-layout: auto;
	}

	.page-governance-overview .table-gov-pay th,
	.page-governance-overview .table-gov-pay td {
		white-space: nowrap;
	}
}

/* コーポレート・ガバナンス強化施策のあゆみ（旧 table.typeB.table-history：罫線なし・下線のみ、奇数行は灰色。デザインは旧ページのまま） */
.page-governance-overview .table-history {
	width: 100%;
	border-collapse: collapse;
	text-align: left;
	line-height: 1.5;
}

.page-governance-overview .table-history col.w20 { width: 20%; }

.page-governance-overview .table-history tr:nth-child(odd) {
	background-color: #f0f0f0;
}

.page-governance-overview .table-history th,
.page-governance-overview .table-history td {
	padding: 1em;
	vertical-align: top;
	border-bottom: 1px solid #999;
}

.page-governance-overview .table-history th {
	padding: 1.5rem 2rem;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
}

.page-governance-overview .table-history ul.circleFill {
	margin: 0;
}

.page-governance-overview .table-history ul.circleFill li {
	padding: 0.2em 0 0.2em 1.8em;
}

.page-governance-overview .table-history ul.circleFill li::before {
	top: 0.45em;
}

/* 灰色の丸（旧 ul.circleFill.grey） */
.page-governance-overview ul.circleFill.grey li::before {
	background: #999;
}

@media (max-width: 767px) {
	.page-governance-overview .table-history th {
		padding: 1rem;
	}
}

/* 取締役会の実効性評価：灰色の見出し（旧 h5.bk_lgray.normal・130%） */
.page-governance-overview h5.bk_lgray {
	background: #efefef;
	padding: 0.5em;
	font-size: 1.3rem;
	font-weight: normal;
	line-height: 1.5;
}

/* アンケート内容の箇条書きは行間を詰める（旧 ul.list-narrow） */
.page-governance-overview ul.list-narrow li {
	padding-top: 0.1em;
	padding-bottom: 0.1em;
}

.page-governance-overview ul.list-narrow li::before {
	top: 0.45em;
}

/* 番号付きリスト（旧 ul.list03：decimal） */
.page-governance-overview ol.list03 {
	padding-left: 2.5rem;
}

.page-governance-overview ol.list03 li {
	padding: 0.5em;
}

/* 社外役員の独立性に関する基準のボタン（v2 の btn btn-primary）。文字は v2 標準の緑・ホバー時は白。
   矢印はボタン右端から 20px、ホバー時の動きは sdgs.html の関連ページボタン（.page-sdgs .sdgs-item .btn-wide）と同じ。
   矢印（common-5.css の .btn[target="_blank"]:after は absolute・top: 21px 固定）は絶対配置をやめ、
   ボタンを横並び（inline-flex）にして文字と矢印を上下中央で揃える（文字が折り返しても中央のまま） */
.page-governance-overview a.btn-criteria {
	display: inline-flex;
	align-items: center;
	min-width: 0;
	/* 高さは environment/products.html の関連装置ボタンに合わせる
	   （.page-env-products a.btn-related の上下 0.8rem は common-5.css の .btn の padding !important に負けており、実際の表示は上下 1.5rem） */
	padding: 1.5rem 20px 1.5rem 1.5rem !important;
}

/* 矢印の枠は画像（icon-arrow-green.svg：16×24px）と同じ大きさに固定。
   文字1行分の高さ（行の余白）が残ると画像が枠の中で下にずれるため、font-size・line-height も 0 にする */
.page-governance-overview a.btn-criteria::after {
	position: static;
	display: block;
	flex-shrink: 0;
	width: 16px;
	height: 24px;
	/* 縮小表示（scale 0.5）で見た目は 8×12px のため、上下 -6px でレイアウト上の高さも 12px にし、ボタンの高さを文字の行の高さで決める */
	margin: -6px 0 -6px 1rem;
	font-size: 0;
	line-height: 0;
	transform: scale(0.5);
}

/* ホバー時の動きは sdgs.html と同じ（scale(0.5) translateX(20px)）。
   別窓リンク用のアニメーション（common-5.css の .btn[target="_blank"]:hover::after の animation: arrow）は付けない */
.page-governance-overview a.btn-criteria:hover::after {
	transform: scale(0.5) translateX(20px);
	animation: none;
}

/* コーポレート・ガバナンス体制早見表：URL はスマホで枠からはみ出さないよう途中で改行 */
.page-governance-overview .table-gov td.td-url {
	overflow-wrap: anywhere;
	word-break: break-all;
}

/* 面談した株主・投資家の概要のグラフ（旧 img.w80：80%、480px以下は 90%） */
.page-governance-overview .img-w80 {
	width: 80%;
}

@media (max-width: 480px) {
	.page-governance-overview .img-w80 {
		width: 90%;
	}
}