.wp-block-gallery {
	&.has-nested-images {
		display: grid;
		gap: 2rem;
		align-items: start;

		&.is-layout-flex {
			display: grid;
			flex-wrap: unset;
		}

		figure.wp-block-image:has(figcaption) {
			&::before {
				display: none;
				content: none;
				backdrop-filter: none;
				-webkit-mask-image: none;
				mask-image: none;
				height: auto;
				max-height: none;
			}

			figcaption,
			.wp-element-caption {
				background-image: none;
				-webkit-mask-image: none;
				mask-image: none;
			}
		}

		&.columns-2 {
			grid-template-columns: repeat(2, minmax(0, 1fr));

			> figure.wp-block-image:not(#individual-image):last-child:nth-child(odd) {
				grid-column: 1 / -1;

				img {
					aspect-ratio: 16 / 9;
				}
			}
		}

		&.columns-3 {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}

		@media (width <= 767px) {
			&.columns-2,
			&.columns-3 {
				grid-template-columns: 1fr;
			}
		}

		&.columns-2,
		&.columns-3 {
			> figure.wp-block-image:not(#individual-image) {
				display: flex;
				flex-direction: column;
				width: 100%;
				max-width: none;
				margin-block-start: 0;
				overflow: hidden;
				background-color: var(--wp--preset--color--white);
				border-radius: 5px;
				box-shadow: 1px 3px 10px -1px rgb(0 0 0 / 0.1);
				flex-grow: unset;
				flex-basis: auto;

				img {
					display: block;
					width: 100%;
					max-width: 100%;
					height: auto;
					aspect-ratio: 4 / 3;
					object-fit: cover;
					border-radius: 0;
				}

				figcaption,
				.wp-element-caption {
					margin: 0;
					padding: 1rem;
					color: var(--wp--preset--color--dark-01);
					font-size: var(--wp--preset--font-size--md);
					line-height: 1.6;
					text-align: left;
					text-shadow: none;
					position: static;
					background: var(--wp--preset--color--primary-light);
					background-image: none;
					border-block-start: 3px solid var(--wp--preset--color--primary);

					@media (width <= 767px) {
						padding: 0.75rem;
						font-size: var(--wp--preset--font-size--sm);
					}
				}
			}
		}
	}

	/* 旧形式ギャラリー（has-nested-images なし） */
	&:not(.has-nested-images) {
		display: grid;
		gap: 2rem;
		align-items: flex-start;

		&.columns-2 {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		&.columns-3 {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}

		@media (width <= 767px) {
			&.columns-2,
			&.columns-3 {
				grid-template-columns: 1fr;
			}
		}

		.wp-block-image {
			margin-block-start: 0;

			img {
				border-radius: 5px;
			}

			figcaption {
				margin-block-start: 0.5rem;
			}
		}
	}

	+ * {
		margin-block-start: 2rem;
	}
}
