/**
 * Block editor / entry-content styles
 * block_css_pc.pdf @1440 (content band 960)
 *
 * Frontend: .column-single__content / .entry-content
 * Editor:   .editor-styles-wrapper
 */

:root {
	--jso-block-ink: #4c4b4b;
	--jso-block-dark: #263c5d;
	--jso-block-green: #7a9872;
	--jso-block-panel: #f9f7f5;
	--jso-block-muted: #929292;
	--jso-block-caution-bg: #fce4dc;
	--jso-block-caution: #f47a58;
	--jso-block-frame-outer: #f9f7f5;
	--jso-block-frame-inner: #efe5f4;
	--jso-block-frame-line: #c470e7;
	--jso-block-font: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "ヒラギノ角ゴ ProN", "Hiragino Sans", "Yu Gothic", "YuGothic", Meiryo, sans-serif;
}

.column-single__content,
.entry-content,
.editor-styles-wrapper {
	font-family: var(--jso-block-font);
	font-size: 16px;
	line-height: 1.9;
	color: var(--jso-block-ink);
}

.column-single__content > *,
.entry-content > *,
.editor-styles-wrapper .block-editor-block-list__layout > * {
	margin-top: 0;
	margin-bottom: 0;
}

.column-single__content > * + *,
.entry-content > * + *,
.editor-styles-wrapper .block-editor-block-list__layout > * + * {
	margin-top: 1.4em;
}

/* Headings — block_css_pc.pdf */
.column-single__content h1,
.entry-content h1,
.editor-styles-wrapper h1,
.column-single__content .wp-block-heading.is-style-default:where(h1),
.editor-styles-wrapper .wp-block-heading:where(h1) {
	font-family: var(--jso-block-font);
	font-size: 32px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: 0.02em;
	color: var(--jso-block-dark);
	margin: 1.6em 0 0.6em;
}

.column-single__content h2,
.entry-content h2,
.editor-styles-wrapper h2 {
	font-family: var(--jso-block-font);
	font-size: 28px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.02em;
	color: var(--jso-block-dark);
	margin: 2.2em 0 0.7em;
}

.column-single__content h3,
.entry-content h3,
.editor-styles-wrapper h3 {
	font-family: var(--jso-block-font);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.45;
	color: var(--jso-block-dark);
	margin: 2em 0 0.65em;
}

.column-single__content h4,
.entry-content h4,
.editor-styles-wrapper h4 {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--jso-block-dark);
	margin: 1.8em 0 0.55em;
}

.column-single__content h5,
.entry-content h5,
.editor-styles-wrapper h5 {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--jso-block-dark);
	margin: 1.6em 0 0.5em;
}

.column-single__content h6,
.entry-content h6,
.editor-styles-wrapper h6 {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--jso-block-dark);
	margin: 1.5em 0 0.45em;
}

.column-single__content > :first-child,
.entry-content > :first-child {
	margin-top: 0;
}

/* Paragraph / bold / link */
.column-single__content p,
.entry-content p,
.editor-styles-wrapper p {
	margin: 0;
	font-size: 16px;
	line-height: 1.9;
	color: var(--jso-block-ink);
}

.column-single__content p + p,
.entry-content p + p,
.editor-styles-wrapper p + p {
	margin-top: 1.4em;
}

.column-single__content strong,
.entry-content strong,
.editor-styles-wrapper strong {
	font-weight: 700;
	color: inherit;
}

.column-single__content a,
.entry-content a,
.editor-styles-wrapper a {
	color: var(--jso-block-ink);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.column-single__content a:hover,
.entry-content a:hover {
	color: var(--jso-block-dark);
}

/* 注釈 — paragraph style */
.column-single__content .is-style-jso-annotation,
.entry-content .is-style-jso-annotation,
.editor-styles-wrapper .is-style-jso-annotation {
	font-size: 13px;
	line-height: 1.7;
	color: var(--jso-block-ink);
}

/* Quote */
.column-single__content .wp-block-quote,
.entry-content .wp-block-quote,
.editor-styles-wrapper .wp-block-quote,
.column-single__content blockquote,
.entry-content blockquote {
	margin: 2em 0;
	padding: 40px 42px 36px;
	background: var(--jso-block-panel);
	border: 0;
	border-left: 4px solid var(--jso-block-green);
	border-radius: 0;
	box-sizing: border-box;
}

.column-single__content .wp-block-quote p,
.entry-content .wp-block-quote p,
.editor-styles-wrapper .wp-block-quote p,
.column-single__content blockquote p,
.entry-content blockquote p {
	font-size: 16px;
	line-height: 1.9;
	color: var(--jso-block-ink);
}

.column-single__content .wp-block-quote cite,
.entry-content .wp-block-quote cite,
.editor-styles-wrapper .wp-block-quote cite,
.column-single__content blockquote cite,
.entry-content blockquote cite {
	display: block;
	margin-top: 1.4em;
	font-size: 13px;
	font-style: normal;
	line-height: 1.4;
	color: var(--jso-block-muted);
	text-align: right;
}

/* Lists */
.column-single__content ul,
.entry-content ul,
.editor-styles-wrapper ul {
	margin: 1.2em 0;
	padding-left: 0;
	list-style: none;
}

.column-single__content ul > li,
.entry-content ul > li,
.editor-styles-wrapper ul > li {
	position: relative;
	padding-left: 1.35em;
}

.column-single__content ul > li::before,
.entry-content ul > li::before,
.editor-styles-wrapper ul > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.72em;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--jso-block-green);
}

.column-single__content ol,
.entry-content ol,
.editor-styles-wrapper ol {
	margin: 1.2em 0;
	padding-left: 1.6em;
	list-style: decimal;
}

.column-single__content ol > li::marker,
.entry-content ol > li::marker,
.editor-styles-wrapper ol > li::marker {
	color: var(--jso-block-green);
	font-weight: 700;
}

.column-single__content li + li,
.entry-content li + li,
.editor-styles-wrapper li + li {
	margin-top: 0.55em;
}

.column-single__content ul ul,
.column-single__content ol ol,
.column-single__content ul ol,
.column-single__content ol ul,
.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul {
	margin-top: 0.45em;
}

/* 注意補足 — group style */
.column-single__content .is-style-jso-caution,
.entry-content .is-style-jso-caution,
.editor-styles-wrapper .is-style-jso-caution {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 2em 0;
	padding: 18px 24px;
	background: var(--jso-block-caution-bg);
	border-radius: 2px;
	color: var(--jso-block-caution);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.6;
	box-sizing: border-box;
}

.column-single__content .is-style-jso-caution::before,
.entry-content .is-style-jso-caution::before,
.editor-styles-wrapper .is-style-jso-caution::before {
	content: "!";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 1.15em;
	height: 1.15em;
	border: 1.5px solid currentColor;
	border-radius: 50%;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}

.column-single__content .is-style-jso-caution p,
.entry-content .is-style-jso-caution p,
.editor-styles-wrapper .is-style-jso-caution p {
	margin: 0;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}

.column-single__content .is-style-jso-caution > * + *,
.entry-content .is-style-jso-caution > * + * {
	margin-top: 0.4em;
}

/* Separator */
.column-single__content hr,
.entry-content hr,
.editor-styles-wrapper hr,
.column-single__content .wp-block-separator,
.entry-content .wp-block-separator,
.editor-styles-wrapper .wp-block-separator {
	border: 0;
	border-top: 1px solid var(--jso-block-green);
	margin: 2.2em 0;
	background: none;
	height: 0;
	max-width: none;
}

.column-single__content .wp-block-separator.is-style-wide,
.entry-content .wp-block-separator.is-style-wide {
	max-width: none;
	width: 100%;
}

/* Image / figure / caption */
.column-single__content .wp-block-image,
.entry-content .wp-block-image,
.editor-styles-wrapper .wp-block-image,
.column-single__content figure,
.entry-content figure {
	margin: 2em 0;
}

.column-single__content .wp-block-image img,
.entry-content .wp-block-image img,
.editor-styles-wrapper .wp-block-image img,
.column-single__content img,
.entry-content img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	border-radius: 2px;
}

.column-single__content .wp-block-image figcaption,
.entry-content .wp-block-image figcaption,
.editor-styles-wrapper .wp-block-image figcaption,
.column-single__content figcaption,
.entry-content figcaption {
	margin-top: 10px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--jso-block-muted);
	text-align: right;
}

/* Embed / video */
.column-single__content .wp-block-embed,
.entry-content .wp-block-embed,
.editor-styles-wrapper .wp-block-embed,
.column-single__content .wp-block-video,
.entry-content .wp-block-video {
	margin: 2em 0;
}

.column-single__content .wp-block-embed iframe,
.entry-content .wp-block-embed iframe,
.editor-styles-wrapper .wp-block-embed iframe,
.column-single__content .wp-block-video video,
.entry-content .wp-block-video video {
	width: 100%;
	height: auto;
	border: 0;
}

/* Table — header row (default) / left header (is-style-jso-table-col)
 * block_css_pc.pdf: 枠線は常に緑。th の color:#fff で currentColor 枠が白くならないよう分離。
 */
.column-single__content .wp-block-table,
.entry-content .wp-block-table,
.editor-styles-wrapper .wp-block-table {
	margin: 2em 0;
	overflow-x: auto;
}

.column-single__content .wp-block-table table,
.entry-content .wp-block-table table,
.editor-styles-wrapper .wp-block-table table,
.column-single__content table,
.entry-content table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--jso-block-green);
	border-color: var(--jso-block-green);
	font-size: 15px;
	line-height: 1.5;
}

.column-single__content .wp-block-table td,
.entry-content .wp-block-table td,
.editor-styles-wrapper .wp-block-table td,
.column-single__content td,
.entry-content td,
.column-single__content .wp-block-table th,
.entry-content .wp-block-table th,
.editor-styles-wrapper .wp-block-table th,
.column-single__content th,
.entry-content th {
	padding: 16px 12px;
	border-width: 1px;
	border-style: solid;
	text-align: center;
	vertical-align: middle;
}

.column-single__content .wp-block-table td,
.entry-content .wp-block-table td,
.editor-styles-wrapper .wp-block-table td,
.column-single__content td,
.entry-content td {
	color: var(--jso-block-ink);
	background: #fff;
}

.column-single__content .wp-block-table th,
.entry-content .wp-block-table th,
.editor-styles-wrapper .wp-block-table th,
.column-single__content th,
.entry-content th {
	background: var(--jso-block-green);
	color: #fff;
	font-weight: 700;
}

/* ヘッダーセクション無し（すべて td）のとき先頭行を見出し行にする */
.column-single__content .wp-block-table:not(.is-style-jso-table-col) table:not(:has(th)) tr:first-child td,
.entry-content .wp-block-table:not(.is-style-jso-table-col) table:not(:has(th)) tr:first-child td,
.editor-styles-wrapper .wp-block-table:not(.is-style-jso-table-col) table:not(:has(th)) tr:first-child td {
	background: var(--jso-block-green);
	color: #fff;
	font-weight: 700;
}

/* WP core の border:1px solid（currentColor）打ち消し。見出し行(first-child)は除外 */
.column-single__content .wp-block-table table tr:not(:first-child) th,
.column-single__content .wp-block-table table tr:not(:first-child) td,
.entry-content .wp-block-table table tr:not(:first-child) th,
.entry-content .wp-block-table table tr:not(:first-child) td,
.editor-styles-wrapper .wp-block-table table tr:not(:first-child) th,
.editor-styles-wrapper .wp-block-table table tr:not(:first-child) td {
	border-color: var(--jso-block-green) !important;
}

/* Table — left header column */
.column-single__content .wp-block-table.is-style-jso-table-col td:first-child,
.column-single__content .wp-block-table.is-style-jso-table-col th:first-child,
.entry-content .wp-block-table.is-style-jso-table-col td:first-child,
.entry-content .wp-block-table.is-style-jso-table-col th:first-child,
.editor-styles-wrapper .wp-block-table.is-style-jso-table-col td:first-child,
.editor-styles-wrapper .wp-block-table.is-style-jso-table-col th:first-child {
	background: var(--jso-block-green);
	color: #fff;
	font-weight: 700;
	width: 25%;
}

.column-single__content .wp-block-table.is-style-jso-table-col thead th:not(:first-child),
.entry-content .wp-block-table.is-style-jso-table-col thead th:not(:first-child),
.editor-styles-wrapper .wp-block-table.is-style-jso-table-col thead th:not(:first-child) {
	background: #fff;
	color: var(--jso-block-ink);
	font-weight: 400;
}

/* 囲み枠 — group style（外ベージュ + 内破線） */
.column-single__content .is-style-jso-kakomi,
.entry-content .is-style-jso-kakomi,
.editor-styles-wrapper .is-style-jso-kakomi {
	position: relative;
	margin: 2.5em 0;
	padding: 80px 80px;
	background: var(--jso-block-frame-outer);
	border: 0;
	border-radius: 16px;
	box-sizing: border-box;
}

.column-single__content .is-style-jso-kakomi::after,
.entry-content .is-style-jso-kakomi::after,
.editor-styles-wrapper .is-style-jso-kakomi::after {
	content: "";
	position: absolute;
	inset: 40px;
	background: var(--jso-block-frame-inner);
	border: 1px dashed var(--jso-block-frame-line);
	border-radius: 8px;
	pointer-events: none;
	z-index: 0;
}

.column-single__content .is-style-jso-kakomi > *,
.entry-content .is-style-jso-kakomi > *,
.editor-styles-wrapper .is-style-jso-kakomi > * {
	position: relative;
	z-index: 1;
}

.column-single__content .is-style-jso-kakomi .wp-block-group__inner-container,
.entry-content .is-style-jso-kakomi .wp-block-group__inner-container,
.editor-styles-wrapper .is-style-jso-kakomi .wp-block-group__inner-container {
	position: relative;
	z-index: 1;
}

.column-single__content .is-style-jso-kakomi > *:first-child,
.entry-content .is-style-jso-kakomi > *:first-child {
	margin-top: 0;
}

.column-single__content .is-style-jso-kakomi > *:last-child,
.entry-content .is-style-jso-kakomi > *:last-child {
	margin-bottom: 0;
}

@media (max-width: 768px) {
	.column-single__content h1,
	.entry-content h1,
	.editor-styles-wrapper h1 {
		font-size: 28px;
	}

	.column-single__content h2,
	.entry-content h2,
	.editor-styles-wrapper h2 {
		font-size: 24px;
	}

	.column-single__content h3,
	.entry-content h3,
	.editor-styles-wrapper h3 {
		font-size: 20px;
	}

	.column-single__content h4,
	.entry-content h4,
	.editor-styles-wrapper h4 {
		font-size: 18px;
	}

	.column-single__content .wp-block-quote,
	.entry-content .wp-block-quote,
	.column-single__content blockquote,
	.entry-content blockquote {
		padding: 28px 28px 24px;
	}

	.column-single__content .is-style-jso-caution,
	.entry-content .is-style-jso-caution {
		padding: 14px 16px;
		font-size: 14px;
	}

	.column-single__content .is-style-jso-kakomi,
	.entry-content .is-style-jso-kakomi {
		padding: 48px 40px;
	}

	.column-single__content .is-style-jso-kakomi::after,
	.entry-content .is-style-jso-kakomi::after {
		inset: 15px;
		border-radius: 6px;
	}

	.column-single__content .wp-block-table th,
	.column-single__content .wp-block-table td,
	.entry-content .wp-block-table th,
	.entry-content .wp-block-table td {
		padding: 12px 8px;
		font-size: 13px;
	}
}