/* CLINICページスタイル */
.display__none {
	display: none;
}

.clinic-wrap {}

.clinic-area {
	margin-bottom: min(80px, 16vw);
	display: flex;
	flex-wrap: wrap;
	gap: min(20px, 5.33vw) min(60px, 5.33vw);
	justify-content: flex-start;

	@media screen and (max-width: 899px) {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
}

.clinic-area__btn {
	flex: 0 1 150px;

	@media screen and (max-width: 899px) {}


	a {
		display: block;
		border: solid 1px var(--primary-color);
		line-height: 1;
		text-align: center;
		padding: 1em .2em;
		font-size: 0.875rem;
		transition: all .3s;

		@media (hover: hover) {
			&:hover {
				transition: all .3s;
				background-color: var(--primary-color);
				color: var(--color-white);
			}
		}

		@media (hover: none) {
			&:active {
				transition: all .3s;
				background-color: var(--primary-color);
				color: var(--color-white);
			}
		}
	}
}

.area-block {
	&+& {
		margin-top: min(88px, 16vw);
	}
}

.area-block__title {
	h2 {
		/* 375px-899px:20px-22px */
		font-size: clamp(1.25rem, 1.161rem + 0.38vw, 1.375rem);
		margin: 0 auto 1.115em;
		padding-bottom: 1.115em;
		font-weight: 400;
		border-bottom: 3px solid var(--primary-color);
	}
}

.area-block__title-inner {}

.clinic-block {
	display: flex;
	align-items: flex-start;
	gap: 10px;

	&+& {
		border-top: 2px dotted var(--primary-color);
		margin-top: min(29px, 5.07vw);
		padding-top: min(29px, 5.07vw);
	}

	@media screen and (max-width: 899px) {
		display: block;
	}

}

.clinic-block__name {
	width: 30%;
	margin: 0;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.6;
	transition: all .3s;

	@media screen and (max-width: 899px) {
		width: 100%;
		margin-bottom: .417em;
	}


	@media (hover: hover) {
		&:hover {
			transition: all .3s;
			opacity: .7;
		}
	}

	@media (hover: none) {
		&:active {
			transition: all .3s;
			opacity: .7;
		}
	}

}

.clinic-block__name a[href]:not([href=""]) {
	text-decoration: underline;
}

.clinic-block__name a[href=""] {
	pointer-events: none;
	cursor: default;
}

.clinic-block__info {
	width: 51%;

	@media screen and (max-width: 899px) {
		width: 100%;
		margin-bottom: min(20px, 5.33vw);
	}
}

.clinic-block__info__inner {
	/* 375px-899px:14px-16px */
	font-size: clamp(0.875rem, 0.786rem + 0.38vw, 1rem);

	p {
		font-size: 1em;
		line-height: 1.6;
		display: inline-block;

		@media screen and (max-width: 899px) {
			line-height: 1.8;
		}
	}
}

.clinic-block__info__zip {
	&::before {
		content: "〒";
	}
}

.clinic-block__info__address {}

.clinic-block__info__tel {}

.clinic-block__info__tel-num {}

.clinic-block__online {
	width: 19%;
	display: flex;

	@media screen and (max-width: 899px) {
		width: 100%;
	}

	.wp-block-button {
		flex: 1 1 auto;

		a {
			display: block;
			width: min(190px, 50.67vw, 100%);
			background-color: var(--primary-color);
			color: var(--color-white);
			line-height: 1;
			font-size: 0.812rem;
			padding: .625em .2em;
			text-align: center;
			margin-left: auto;


			@media screen and (max-width: 899px) {
				margin: 0;
				line-height: 1.5;
			}

			@media (hover: hover) {
				&:hover {
					transition: all .3s;
					opacity: .7;
				}
			}

			@media (hover: none) {
				&:active {
					transition: all .3s;
					opacity: .7;
				}
			}
		}
	}
}