.wp-block-heading {
}

h2.wp-block-heading {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--16);
	padding: var(--wp--preset--spacing--20) 0;
	border-bottom: 4px solid
		var(--wp--preset--color--custom-green);
	font-size: var(--wp--preset--font-size--x-large);

	&::before {
		content: "";
		width: 32px;
		height: 32px;
		background: url(../image/block/heading/-icon.png)
			no-repeat center center / contain;
		flex-shrink: 0;
	}
}

h3.wp-block-heading {
	padding: var(--wp--preset--spacing--20);
	border-bottom: 4px solid
		var(--wp--preset--color--custom-green);
	background: var(
		--wp--preset--color--custom-gray-more-light
	);
	font-size: var(--wp--preset--font-size--large);
}

h4.wp-block-heading {
	padding: var(--wp--preset--spacing--16)
		var(--wp--preset--spacing--20);
	background: var(--wp--preset--color--custom-orange-light);
	font-size: var(--wp--preset--font-size--semi-large);
}

.wp-block-list {
}

ul.wp-block-list {
	padding: var(--wp--preset--spacing--24);
	border: 4px solid
		var(--wp--preset--color--custom-gray-more-light);
	list-style: none;
}

ul.wp-block-list > li {
	list-style: none;
	padding-left: 18px;
	position: relative;
}

ul.wp-block-list > li::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--wp--preset--color--custom-green);
	position: absolute;
	top: 9px;
	left: 0;
}

ol.wp-block-list {
	padding: var(--wp--preset--spacing--24)
		var(--wp--preset--spacing--24)
		var(--wp--preset--spacing--24)
		var(--wp--preset--spacing--40);
	border: 4px solid
		var(--wp--preset--color--custom-gray-more-light);
}

.wp-block-quote {
	margin-left: 0;
	margin-right: 0;
	padding: var(--wp--preset--spacing--20)
		var(--wp--preset--spacing--60);
	border-left: 5px solid
		var(--wp--preset--color--custom-gray);
	background: var(
		--wp--preset--color--custom-gray-more-light
	);
	color: var(--wp--preset--color--custom-gray-dark);
	position: relative;

	&::before,
	&::after {
		content: "";
		position: absolute;
		top: var(--wp--preset--spacing--20);
		font-size: var(--wp--preset--font-size--x-large);
		font-weight: 700;
		color: var(--wp--preset--color--custom-gray);
		line-height: 1.4;
	}

	&::before {
		content: "“";
		left: var(--wp--preset--spacing--20);
	}

	&::after {
		content: "”";
		right: var(--wp--preset--spacing--20);
	}
}
