@import "parts/s-site2023.css";

.s-site2023 {
	.s-site2023__title {}

	.s-site2023__content {
		padding-block: clamp(48px, 12vw, 100px);
		line-height: 1.5;
		overflow-wrap: break-word;
	}
}


/* 括弧付き数字 */
@counter-style paren-decimal {
	system: extends decimal;
	prefix: "(";
	suffix: ") ";
}

/* 括弧付き英数 */
@counter-style paren-lower-alpha {
	system: extends lower-alpha;
	prefix: "(";
	suffix: ") ";
}

/* 丸付き数字：20まで */
@counter-style circled-decimal {
	system: fixed;
	symbols: ① ② ③ ④ ⑤ ⑥ ⑦ ⑧ ⑨ ⑩ ⑪ ⑫ ⑬ ⑭ ⑮ ⑯ ⑰ ⑱ ⑲ ⑳;
	suffix: " ";
}

/* 丸付き英数：Zまで */
@counter-style circled-upper-alpha {
	system: fixed;
	symbols: Ⓐ Ⓑ Ⓒ Ⓓ Ⓔ Ⓕ Ⓖ Ⓗ Ⓘ Ⓙ Ⓚ Ⓛ Ⓜ Ⓝ Ⓞ Ⓟ Ⓠ Ⓡ Ⓢ Ⓣ Ⓤ Ⓥ Ⓦ Ⓧ Ⓨ Ⓩ;
	suffix: " ";
}

/* 箇条書き::marker：□ */
@counter-style square-outline {
	system: cyclic;
	symbols: "□";
	suffix: " ";
}


/* ============================
 *  Main Content
 * ============================ */
main {

	:is(h1, h2, h3, h4, h5, h6) {
		letter-spacing: 0.05em;
	}

	*+ :is(h1, h2, h3, h4, h5, h6) {
		margin-block-start: 4em;
	}

	:is(ol, ul) {
		margin-block: 1em 2em;
	}

	li {
		margin-block: 0.5em;
	}

	/* 2階層目の<ol>：括弧付き数字 */
	:is(ol, ul)>li>ol {
		list-style-type: paren-decimal;
	}

	/* 3階層目の<ol>：大文字アルファベット */
	:is(ol, ul)>li>:is(ol, ul)>li>ol {
		list-style-type: upper-alpha;
	}

	/* 4階層目の<ol>：小文字アルファベット */
	:is(ol, ul)>li>:is(ol, ul)>li>:is(ol, ul)>li>ol {
		list-style-type: lower-alpha;
	}

	/* 2階層目の<ul>：○ */
	:is(ol, ul)>li>ul {
		list-style-type: circle;
	}

	/* 3階層目の<ul>：■ */
	:is(ol, ul)>li>:is(ol, ul)>li>ul {
		list-style-type: square;
	}

	/* 4階層目の<ul>：□ */
	:is(ol, ul)>li>:is(ol, ul)>li>:is(ol, ul)>li>ul {
		list-style-type: square-outline;
	}

	.text-end {
		text-align: right;
	}

	.supplementary {
		display: grid;
		gap: 0.5em;
		margin-block-start: 4em;

		.supplementary-title {}

		.supplementary-date {}

		.supplementary-versions {
			list-style-type: none;
			padding-inline-start: 0;
		}

		a {
			color: royalblue;
			text-decoration: underline;
		}

		a:hover {
			color: cornflowerblue;
		}
	}
}