.wp-block-media-text {
	margin-block-start: var(--wp--preset--spacing--40);
	margin-block-end: var(--wp--preset--spacing--30);
	gap: var(--wp--preset--spacing--40);

	.wp-block-media-text__content {
		padding: 0;
	}

	.wp-block-media-text__media {
		img {
			display: block;
			margin-inline: auto;
		}
	}

	&.is-style-default {}

	&.is-style-greeting {
		grid-template-columns: 1fr 2fr;
		@media (width < 767px) {
			grid-template-columns: 1fr;
		}
		.wp-block-media-text {
			&__media {
				flex-basis: 35%;
				margin: 0;
				padding: 0;
				@media (width < 767px) {
					display: none;
				}
			}

			&__content {
				z-index: 1;
				margin-block-start: 0;
				margin-inline-end: -100%;
				@media (width < 767px) {
					margin-inline-end: 0;
				}
				p.is-style-default {
					font-size: 0.9rem;
					@media (width < 767px) {
						font-size: 1rem;
					}
					&.sub-name {
						font-size: 0.8rem;
						line-height: 1;
						margin-block-start: 3rem;

						+ p {
							margin-block-start: 1rem;
						}
					}

					&.main-name {
						font-size: 1.2rem;
						line-height: 1;
					}

					+ p {
						margin-block-start: 1rem;
					}
				}
			}
		}
	}

	&.is-style-member {
		grid-template-columns: 1fr 2fr;
		@media (width < 767px) {
			grid-template-columns: 1fr;
		}
		.wp-block-media-text {
			&__media {
				flex-basis: 35%;
				margin: 0;
				padding: 0;
				@media (width < 767px) {
					display: none;
				}
			}

			&__content {
				z-index: 1;
				margin-block-start: 0;
				@media (width < 767px) {
					margin-inline-end: 0;
				}
				p.is-style-default {
					font-size: 0.9rem;
					@media (width < 767px) {
						font-size: 1rem;
					}
					&.sub-name {
						font-size: 0.8rem;
						line-height: 1;
						margin-block-start: 3rem;

						+ p {
							margin-block-start: 1rem;
						}
					}

					&.main-name {
						font-size: 1.2rem;
						line-height: 1;
					}

					+ p {
						margin-block-start: 1rem;
					}
				}
			}
		}
	}

	&.is-style-inside {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
		@media (width < 767px) {
			flex-wrap: wrap;
		}
		.wp-block-media-text {
			&__media {
				flex-basis: 50%;
				margin: 0;
				padding: 0;
				@media (width < 767px) {
					flex-basis: 100%;
				}
				img {
					width: 100%;
					height: 300px;
					object-fit: contain;
					background-color: var(--wp--preset--color--primary);
				}
			}

			&__content {
				flex-basis: 50%;
				margin-block-start: 0;
				@media (width < 767px) {
					flex-basis: 100%;
				}
				p {
					margin-block-start: 1rem;
				}
			}
		}
	}

	&.is-style-youtube {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
		@media (width < 767px) {
			flex-wrap: wrap;
		}
		.wp-block-media-text {
			&__media {
				flex-basis: 50%;
				margin: 0;
				padding: 0;
				@media (width < 767px) {
					flex-basis: 100%;
				}
				a {
					position: relative;
					display: block;
					overflow: hidden;
					text-decoration: none;
					background-color: var(--wp--preset--color--light-01);
					border: 2px solid var(--wp--preset--color--dark-01);
					border-radius: 5px;

					&::after {
						position: absolute;
						top: 50%;
						right: 0;
						left: 0;
						color: var(--wp--preset--color--red);
						font-size: 3rem;
						font-family: var(--wp--preset--font-family--ionicons);
						text-align: center;
						transform: translateY(-50%);
						transition: all 0.5s var(--transition-easeout-quint);
						content: "";
					}

					&:hover {
						&::after {
							font-size: 4rem;
							transform: translateY(-50%);
						}
					}
				}

				img {
					width: 100%;
					object-fit: contain;
					opacity: 0.3;
				}
			}

			&__content {
				@media (width < 767px) {
					flex-basis: 100%;
				}
				flex-basis: 70%;
				align-self: center;
				margin-block-start: 0;

				h4 {
					display: block;
					width: 100%;
					padding: 0;
					border-top: 0;

					&::before {
						display: block;
						max-width: fit-content;
						padding: 0 0.5rem;
						color: var(--wp--preset--color--primary);
						font-size: 1.5rem;
						border-bottom: 2px solid var(--wp--preset--color--primary);
						margin-block-end: 0.5rem;
					}
				}
			}
		}
	}
}