.wp-block-group {
	> *:first-child {
		margin-block-start: 0;
	}

	> *:last-child {
		margin-block-end: 0;
	}

	&.is-style-default {
		&.has-background {
			padding-block: 4rem;
			@media (width < 768px) {
				padding-block: 2rem;
			}

			> .wp-block-group__inner-container {
				@media (width < 768px) {
					max-width: calc(100% - 2rem);
					margin-right: auto;
					margin-left: auto;
				}
			}
		}

		+ .wp-block-group.is-style-default {
			margin-block-start: 2rem;

			&.has-background {
				margin-block-start: 0;
			}
		}
	}

	&.is-style-member {
		@media (width < 768px) {
			display: grid;
			grid-template-columns: 1fr;

			.wp-block-media-text__media {
				width: max(200px, 50%);
				margin-inline: auto;
			}

			.wp-block-media-text__content {
				display: flex;
				flex-flow: column;
				align-items: center;
			}
		}
	}

	&.is-style-frontpage-link {
		display: flex;
		justify-content: center;
		width: var(--content-width);
		margin-left: calc(50% - var(--content-width) / 2);
		padding-block: 2rem;

		> .wp-block-group {
			width: 100%;
			max-width: var(--wp--style--global--content-size);
			@media (width < 768px) {
				max-width: calc(100% - 2rem);
			}
		}

		a {
			display: block;
			border: 1px solid var(--color-border);
			transition: 0.3s ease;

			img {
				width: 100%;
			}

			&:hover {
				opacity: 0.7;
			}
		}
	}

	&.is-style-frontpage-ashi {
		display: flex;
		justify-content: center;
		width: var(--content-width);
		margin-left: calc(50% - var(--content-width) / 2);
		padding-block: 4rem;

		> .wp-block-group {
			width: 100%;
			@media (width < 768px) {
				max-width: calc(100% - 2rem);
			}
		}

		.wp-block-columns {
			display: grid;
			grid-template-columns: 1fr 3fr;
			gap: 4rem;
			@media (width < 768px) {
				grid-template-columns: 1fr;
			}

			.wp-block-column {
				&:nth-of-type(1) {
					border-right: 2px solid var(--color-alto-10);
				}

				&:nth-of-type(2) {
					justify-content: flex-end;
				}
			}
		}

		.wp-block-image {
			img {
				@media (width < 768px) {
					width: 150px;
					margin-right: auto;
					margin-left: 0;
				}
			}
		}

		.wp-block-query {
			.wp-block-post-template {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				gap: 1rem;
				@media (width < 768px) {
					grid-template-columns: 1fr;
				}
			}

			.wp-block-post {
				position: relative;
				display: flex;
				gap: 1rem;
				align-items: center;
				padding: 1rem 1rem;
				background-color: var(--color-white);
				border: 1px solid var(--color-border);
				border-radius: 5px;
				transition: 0.3s ease;
				margin-block-start: 0;

				&:hover {
					opacity: 0.7;
				}
			}

			.wp-block-post-title {
				font-weight: 700;
				font-size: var(--font-size-xl);
				font-family: var(--font-family-serif);
				line-height: 1.5;

				a {
					display: flex;
					gap: 0.5rem;
					align-items: center;
					color: var(--wp--preset--color--primary);

					&::after {
						position: absolute;
						top: 0;
						left: 0;
						width: 100%;
						height: 100%;
						content: "";
					}
				}
			}

			.wp-block-post-date {
				color: var(--color-dark-02);

				time {
					display: block;
					font-size: var(--font-size-sm);
					line-height: 1;
				}
			}

			ion-icon {
				margin-left: auto;
			}
		}
	}

	&.is-style-history {
		padding-block: 2rem;
		position: relative;
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: flex-start;
		> p {
			width: 200px;
			background-color: white;
			border-radius: 1rem;
			text-align: center;
			z-index: 1;
			padding-block: 1rem;
			@media (width < 768px) {
				width: 100px;
			}
		}

		> .wp-block-group {
			padding-block-start: 1rem;
		}
		&::after {
			position: absolute;
			content: "";
			height: 100%;
			width: 2px;
			background-color: var(--wp--preset--color--alto-10);
			inset: 2rem 0 auto 100px;
			@media (width < 768px) {
				inset: 2rem 0 auto 50px;
			}
		}
	}

	&.is-style-study {
		@media (width < 768px) {
			justify-content: center;
		}
		.wp-block-button.hidden {
			display: none !important;
		}
	}
}