@charset "UTF-8";

/* ====================================
	企業行動憲章

	対象 : /corporate/info/vision/charter/
	       /corporate/info/vision/charter/ac/
	       /corporate/info/vision/charter/cr/
==================================== */

/* 本文の段落間 */
.content-lead__text+.content-lead__text {
	margin-block-start: 2em;
}

/* 改定履歴の注記 */
.charter-note {
	text-align: right;
}

/* 憲章・行動規範へのボタン */
.charter-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2rem 3rem;
	margin-block-start: 6rem;
}

/* 憲章本文の幅 */
.charter-body {
	max-inline-size: 860px;
	margin-inline: auto;
}

/* 憲章本文の段落 */
.charter-text {
	line-height: 1.8;
}

/* 憲章の各原則 */
.charter-section {
	margin-block-start: 2rem;
}

.charter-section__title {
	padding-block-end: 1rem;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.4;
}

.charter-list {
	padding-inline-start: 2.4rem;
	list-style: disc;
	line-height: 1.8;
}

.charter-list>li:not(:first-child) {
	margin-block-start: .3rem;
}

/* グループの定義 */
.charter-summary {
	margin-block-start: 5rem;
}

/* 行動規範の章見出し */
.ac-title {
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: .4em;
	padding-block: .2em;
	border-block-end: 1px dashed var(--gray-500);
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.4;
}

/* 行動規範の項番 */
.charter-body {
	counter-reset: ac-section;
}

.ac-section {
	margin-block-start: 3rem;
	counter-increment: ac-section;
}

.ac-section__title {
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: .4em;
	padding-block-end: 1rem;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.4;
}

.ac-section__title::before {
	content: counter(ac-section) ".";
}

/* 小見出しを持たない章の本文リスト */
.ac-title+.charter-list-paren {
	margin-block-start: 3rem;
}

/* 行動規範の本文リスト */
.charter-list-num {
	padding-inline-start: 2.4rem;
	list-style: decimal;
	line-height: 1.8;
}

.charter-list-num>li:not(:first-child) {
	margin-block-start: .3rem;
}

.charter-list-paren {
	counter-reset: paren;
	line-height: 1.8;
}

.charter-list-paren>li {
	position: relative;
	padding-inline-start: 3.2rem;
	counter-increment: paren;
	list-style: none;
}

.charter-list-paren>li::before {
	content: counter(paren) ")";
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
}

.charter-list-paren>li:not(:first-child) {
	margin-block-start: 1.6rem;
}

.charter-list-paren .charter-list {
	margin-block-start: .8rem;
}

/* 行動規範の目次 */
.charter-body {
	counter-reset: ac;
}

.ac-index__section {
	counter-increment: ac;
	margin-block-start: 3rem;
}

.ac-index__title {
	padding-block-end: 1rem;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.4;
}

/* 見出しのローマ数字 */
.ac-index__title a::before {
	content: counter(ac, upper-roman) '. ';
}

/* 行動規範のページネーション */
.pagination {
	margin-block-start: 8rem;
}

/* JS未実行時の余白 */
.pagination:empty {
	margin-block-start: 0;
}

.pagination__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .8rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pagination__list a,
.pagination__current {
	display: inline-block;
	min-inline-size: 2.2rem;
	padding: .5rem .4em;
	border: 1px solid var(--gray-500);
	font-size: 1.4rem;
	line-height: 1.4;
	text-align: center;
}

.pagination__current {
	background: var(--gray-700);
	color: var(--white);
}

.pagination__prev a,
.pagination__next a {
	display: grid;
	place-items: center;
	block-size: 100%;
}

.pagination__chevron {
	inline-size: .8rem;
	block-size: 1.2rem;
	background: currentColor;
	mask: var(--icon-chevron-right) no-repeat center / contain;
}

.pagination__prev .pagination__chevron {
	transform: rotate(180deg);
}

@media (hover:hover) and (pointer: fine) {

	.pagination__list a:hover {
		background: var(--gray-700);
		color: var(--white);
		text-decoration: none;
	}
}

@media print,
screen and (width >=768px) {

	.charter-section {
		margin-block-start: 4rem;
	}

	.charter-summary {
		margin-block-start: 8rem;
	}

	.ac-title {
		font-size: 2.6rem;
	}

	.ac-title+.charter-list-paren {
		margin-block-start: 5rem;
	}

	.ac-section {
		margin-block-start: 5rem;
	}

	.ac-index__section {
		margin-block-start: 4rem;
	}

	.pagination {
		margin-block-start: 10rem;
	}

	.pagination__list {
		gap: 1rem;
	}

	.pagination__list a,
	.pagination__current {
		min-inline-size: 3rem;
		padding: .6rem .5em;
		font-size: 1.8rem;
	}

	.pagination__chevron {
		inline-size: 1rem;
		block-size: 1.6rem;
	}
}