section.panel {
	> picture {
		display: block;
		> img {
			width: 100%;
		}
	}

}
section.clinic {
	padding: 80px 5% min(80px,10vw) 5%;
	background: url(./image/clinic_bg.svg) , radial-gradient(circle at 50% 120%,#fff 70%, #fffac6 85%, #fffac6 95%);
	background-size: 100% ;
	background-position: 100% 0%;
	background-repeat: no-repeat;
	@media (width < 750px) {
		background: url(./image/clinic_bg.svg) , radial-gradient(circle at 50% 70%,#fff 70%, #fffac6 85%, #fffac6 95%);
		background-size: 100% ;
		background-position: 100% 0%;
		background-repeat: no-repeat;
	}
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> figure{
			text-align: center;
			@media (width < 700px) {
				width: 80%;
				margin-inline: auto;
			}
			> img {
				max-width: 100%;
			}
		}
		> h3 {
			margin-top: 20px;
			text-align: center;
			line-height: 1.4;
			font-weight: 500;
			color: #643f33;
			font-size: min(1.1rem, 5.0vw);
			font-weight: 500;
			@media (width < 700px) {
				font-size: min(1.0rem, 4vw);
				font-weight: 600;
				text-align: center;
				letter-spacing: -0.05em;
			}
		}
		> h1 {
			text-align: center;
			font-size: min(2.4rem, 8vw);
			line-height: 1.4;
			color: #643f33;
			font-weight: 500;
			@media (width < 700px) {
				font-size: min(1.8rem, 6.5vw);
				font-weight: 600;
			}
		}
		> h2 {
			margin-top: 40px;
			text-align: center;
			font-size: min(1.8rem, 6vw);
			line-height: 1.4;
			color: #ff6e82;
			font-weight: 500;
			letter-spacing: 0.1em;
			@media (width < 700px) {
				margin-top: 20px;
				font-size: min(1.8rem, 6.0vw);
				line-height: 1.4;
				font-weight: 600;
				text-align: center;
				letter-spacing: unset;
			}
		}
		> p {
			margin-top: 10px;
			text-align: center;
			font-size: min(1.1rem, 5vw);
			line-height: 2.0;
			font-weight: 500;
			color: #222;
			letter-spacing: 0.2em;
			@media (width < 700px) {
				margin-top: 20px;
				font-size: min(1.0rem, 4.0vw);
				line-height: 1.4;
				font-weight: 600;
				text-align: center;
				letter-spacing: 0.1em;
				> br {
					display: none;
				}
			}
		}
	}
}
section.effects {
	padding: min(80px,10vw) 5% min(80px,15vw) 5%;
	background: #fdf0f4;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> h2 {
			text-align: center;
			font-size: min(1.8rem, 5.5vw);
			line-height: 1.4;
			color: #464646;
			font-weight: 500;
			letter-spacing: 0.1em;
		}
		> p {
			margin-top: 10px;
			text-align: center;
			font-size: min(1.1rem, 5vw);
			line-height: 1.0;
			font-weight: 500;
			color: #ff6e82;
			letter-spacing: 0.2em;
		}
		> div {
			margin-top: 50px;
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			column-gap: 30px;
			@media (width < 700px) {
				grid-template-columns: repeat(1, 1fr);
				row-gap: 30px;
			}
			> article {
				filter: drop-shadow(0 0 3px #f09cb4);
				> div {
					padding-top: 40px;
					background-color: #fff;
					clip-path: polygon(40px 0, 100% 0, 100% calc(100% - 40px), calc(100% - 40px) 100%, 0 100%, 0 40px);
					 p {
						text-align: center;
						font-size: min(1.2rem, 5.5vw);
						line-height: 1.4;
						font-weight: 500;
						color: #464646;
						letter-spacing: 0.2em;
					}
					> figure {
						text-align: center;
						padding: 20px 30px 40px 30px;
						@media (width < 980px) {
							padding: 20px 20px 40px 20px;
						}
						@media (width < 700px) {
							padding: 20px 5% 40px 5%;
						}
						> img {
							max-width: 100%;
						}
					}
				}
			}
		}
	}
}
section.features {
	padding: min(80px,13vw) 5% min(80px,13vw) 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> div {
			display: flex;
			justify-content: center;
			align-items: end;
			column-gap: 10px;
			> h2 {
				text-align: center;
				font-size: min(1.8rem, 5.5vw);
				line-height: 1.0;
				color: #464646;
				font-weight: 500;
				letter-spacing: 0.1em;
			}
			> img {
				width: 24px;
			}
		}
		> p {
			margin-block: 20px;
			text-align: center;
			font-size: min(1.1rem, 5vw);
			line-height: 1.0;
			font-weight: 500;
			color: #ff6e82;
			letter-spacing: 0.2em;
		}
		> picture {
			text-align: center;
			> img {
				max-width: 100%;
			}
		}
	}
}
section.process {
	position: relative;
	padding: min(100px,15vw) 5% min(100px,15vw) 5%;
	background: #fef8f4;
	> div.bg {
		position: absolute;
		width: 100vw;
		height: 100%;
		top: 0;
		left: 0;
		background-color: #fdf1ea;
		clip-path: polygon(100% 0, 0% 100%, 100% 100%);
	}
	> div.block {
		position: relative;
		max-width: 1000px;
		margin-inline: auto;
		> h2 {
			text-align: center;
			font-size: min(1.8rem, 5.5vw);
			line-height: 1.4;
			color: #464646;
			font-weight: 500;
			letter-spacing: 0.1em;
		}
		> p {
			margin-top: 10px;
			text-align: center;
			font-size: min(1.1rem, 5vw);
			line-height: 1.0;
			font-weight: 500;
			color: #ff6e82;
			letter-spacing: 0.2em;
		}
		> article {
			background-color: #fff;
			margin-top: 30px;
			position: relative;
			margin-left: 65px;
			border-radius: 20px;
			border: 6px solid #ff6e82;
			&:nth-of-type(1) {
				margin-top: 60px;
			}
			&:nth-of-type(4) {
				> figure {
					@media (width < 700px) {
						transform: translateY(-50%);
						top: 50%;
					}
				}
			}
			@media (width < 500px) {
				margin-left: 45px;
			}
			> figure {
				position: absolute;
				transform: translateY(-50%);
				top: 50%;
				left: -65px;
				@media (width < 700px) {
					transform: unset;
					top: -6px;
				}
				@media (width < 500px) {
					left: -50px;
				}
				> img {
					width: 130px;
					@media (width < 500px) {
						width: 100px;
					}
				}
			}
			> div {
				padding: 20px 30px 15px 85px;
				@media (width < 550px) {
					padding: 20px 20px 15px 85px;
				}
				@media (width < 500px) {
					padding: 20px 20px 15px 60px;
				}
				> h3 {
					font-size: min(1.1rem, 5.5vw);
					line-height: 1.0;
					font-weight: 500;
					color: #ff6e82;
					letter-spacing: 0.2em;
				}
				> p {
					padding-top: 10px;
					font-size: min(1.0rem, 5vw);
					line-height: 1.8;
					font-weight: 500;
					color: #222;
					letter-spacing: 0.2em;
					text-align: justify;
				}
			}
		}
		> div {
			margin-top: 30px;
			margin-left: 65px;
			background-color: #f9d8c7;
			padding: 15px 20px;
			@media (width < 500px) {
				margin-left: 45px;
			}
			> p {
				text-align: center;
				font-size: min(1.1rem, 5.5vw);
				line-height: 1.3;
				font-weight: 500;
				color: #ff6e82;
				letter-spacing: 0.2em;
				@media (width < 700px) {
					text-align: justify;
					text-indent: -1.1em;
					padding-left: 1.1em;
				}
			}
		}
	}
}
section.fees {
	padding: min(80px,15vw) 5% min(80px,18vw) 5%;
	background-image: url(./image/fee_bg.webp);
	background-size: auto 100%;
	background-position: 100% 0%;
	background-repeat: no-repeat;
	@media (width < 1300px) {
		background-image: unset;
	}
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> h2 {
			text-align: center;
			font-size: min(1.8rem, 5.5vw);
			line-height: 1.4;
			color: #464646;
			font-weight: 500;
			letter-spacing: 0.1em;
		}
		> p {
			margin-top: 10px;
			text-align: center;
			font-size: min(1.1rem, 5vw);
			line-height: 1.0;
			font-weight: 500;
			color: #ff6e82;
			letter-spacing: 0.2em;
		}
		> div {
			width: 65%;
			margin-top: 30px;
			@media (width < 1300px) {
				width: 100%;
			}
			> p {
				font-size: min(1.0rem, 5.5vw);
				line-height: 1.5;
				font-weight: 500;
				color: #222;
				letter-spacing: 0.1em;
			}
			> article {
				min-height: 40px;
				padding-block: 20px;
				padding-inline: 10px;
				border-bottom: 1px solid #b5b5b5;
				&:nth-of-type(1) {
					margin-top: 40px;
				}
				&:last-of-type {
					border-bottom: unset;
				}
				@media (width < 550px) {
					padding: 10px 0;
				}
				> h3 {
					font-size: min(1.1rem, 6.5vw);
					line-height: 1.4;
					color: #464646;
					font-weight: 500;
					letter-spacing: 0.2em;
				}
				> p {
					font-size: min(1.1rem, 5vw);
					line-height: 1.3;
					color: #222;
					letter-spacing: 0.1em;
					font-weight: 500;
					> small {
						font-size: min(0.9rem, 5vw);
						color: #ff6e82;
						font-weight: 500;
					}
				}
				&.dot {
					display: grid;
					grid-template-columns: auto 1fr auto;
					align-items: center;
					@media (width < 550px) {
						grid-template-columns: 1fr auto;
						row-gap: 10px;
					}
					> p {
						justify-self: start;
						@media (width < 550px) {
							grid-column: 1/3;
						}
					}
					> div {
						min-width: 10px;
						border-bottom: 1px dotted #464646;
						margin: 0 10px;
						@media (width < 550px) {
							width: 35%;
							justify-self: end;
						}
                    }
				}
				> h4 {
					justify-self: end;
					font-size: min(1.1rem, 5vw);
					line-height: 1.4;
					color: #ff6e82;
					font-weight: 500;
					letter-spacing: 0.1em;
				}
			}
		}
		> figure {
			display: none;
			text-align: center;
			@media (width < 1300px) {
				padding-top: 30px;
				display: block;
			}
			> img {
				max-width: 100%;
				@media (width < 1300px) {
					width: 50vw;
				}
				@media (width < 570px) {
					width: 100%;
				}
			}
		}
	}
}
section.self {
	background-color: #fdf5f7;
	padding: min(80px,15vw) 5% min(80px,15vw) 5%;
	> div {
		background-color: #fff;
		border-radius: 20px;
		max-width: 1000px;
		margin-inline: auto;
		padding: 40px 20px;
		> div {
			max-width: 800px;
			margin-inline: auto;
			> h3 {
				font-size: min(1.1rem, 6.5vw);
				line-height: 1.4;
				color: #464646;
				font-weight: 500;
				letter-spacing: 0.2em;
			}
			> div {
				&:nth-of-type(n + 2) {
					padding-top: 20px;
				}
				> p {
					padding-left: 1em;
					color: #222;
					font-size: min(1.1rem,5vw);
					line-height: 1.6;
					font-weight: 500;
				}
				> div.scrolltable {
					margin-top: 10px;
					&.on {
						> div.guidance {
							display: block;
						}
					}
					> div.guidance {
						display: none;
						background-color: #ddd;
						font-size: 0.9rem;
						line-height: 1;
						color: #777;
						border-radius: 50px;
						padding-block: 3px;
						padding-inline: 10px;
					}
					> div.table {
						overflow: auto;
						> table {
							margin-top: 3px;
							width: 100%;
							border-collapse: collapse;
							> tbody {
								> tr {
									> th {
										background-color: #b4cde9;
										border-right: solid 1px #b5b5b5;
										border-bottom: solid 1px #b5b5b5;
										padding-block: 10px;
										padding-inline: 10px;
										color: #464646;
										font-size: min(1.1rem,5vw);
										line-height: 1.6;
										font-weight: 500;
										text-align: center;
										white-space: nowrap;
										&:nth-of-type(1) {
											background-color: #fdf5f7;
										}
										&:nth-of-type(2) {
											background-color: #f7cdd9;
										}
										&:nth-of-type(3) {
											background-color: #e3e3e3;
											border-right: none;
										}
									}
									> td {
										border: solid 1px #b5b5b5;
										padding-block: 10px;
										padding-inline: 10px;
										color: #464646;
										font-size: min(1.2rem,5.5vw);
										line-height: 1.6;
										text-align: center;
										white-space: nowrap;
										> small {
											font-size: min(0.9rem,5vw);
										}
										&:nth-of-type(1) {
											color: #ff6e82;
										}
										&:last-of-type {
											border-right: none;
										}
									}
								}
							}
						}
					}
				}
			}
			> p {
				font-size: min(0.9rem, 5vw);
				line-height: 1.3;
				color: #ff6e82;
				letter-spacing: 0.1em;
				font-weight: 500;
				&:nth-of-type(1) {
					padding-block: 15px 5px;
				}
			}
		}
	}
}
section.area {
	background-color: #fdf0f4;
	padding: min(80px,15vw) 5% min(80px,15vw) 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> h2 {
			text-align: center;
			font-size: min(1.8rem, 5.5vw);
			line-height: 1.4;
			color: #464646;
			font-weight: 500;
			letter-spacing: 0.1em;
		}
		> p {
			margin-top: 10px;
			text-align: center;
			font-size: min(1.1rem, 5vw);
			line-height: 1.0;
			font-weight: 500;
			color: #ff6e82;
			letter-spacing: 0.2em;
		}
		> h3 {
			margin-block: 30px 20px;
			font-size: min(1.1rem, 6.5vw);
			line-height: 1.4;
			color: #464646;
			font-weight: 500;
			letter-spacing: 0.2em;
			text-align: center;
		}
		> picture {
			display: flex;
            justify-content: center;
			> img {
				max-width: 100%;
			}
		}
	}
}
section.hours {
	padding: min(100px,15vw) 5% 0px 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> div {
			display: flex;
			column-gap: 20px;
			@media (width < 640px) {
				flex-flow: column;
			}
			> h3 {
				font-size: min(1.2rem, 5.5vw);
				line-height: 1.4;
				color: #222;
				font-weight: 500;
				letter-spacing: 0.1em;
				> span {
					color: #f09cb4;
					font-size: min(0.9rem, 5vw);
					vertical-align: text-top;
				}
			}
			> p {
				align-self: end;
				font-size: min(0.9rem, 4.5vw);
				line-height: 1.4;
				color: #e7404b;
				font-weight: 500;
				letter-spacing: 0.1em;
				@media (width < 500px) {
					text-indent: -1em;
					padding-left: 1em;

				}
			}
		}
		> article {
			display: grid;
			grid-template-columns: 100px 1fr;
			border-bottom: 1px solid #b5b5b5;
			padding-block: 10px;
			&:nth-of-type(1) {
				margin-top: 10px;
				border-top: 1px solid #b5b5b5;
			}
			> p {
				font-size: min(1.1rem, 5.0vw);
				line-height: 1.4;
				color: #464646;
				font-weight: 500;
				letter-spacing: 0.1em;
			}
		}
	}
}
section.access {
	padding: min(100px,15vw) 5% min(100px,15vw) 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		> h3 {
			font-size: min(1.2rem, 5.5vw);
			line-height: 1.4;
			color: #222;
			font-weight: 500;
			letter-spacing: 0.1em;
			> span {
				color: #f09cb4;
				font-size: min(0.9rem, 5vw);
				vertical-align: text-top;
			}
		}
		> div.block {
			display: grid;
			grid-template-columns: 1.6fr 1fr;
			column-gap: 10px;
			@media (width < 780px) {
				grid-template-columns: 1fr;
				row-gap: 30px;
			}
			> div {
				margin-top: 10px;
				align-self: center;
				@media (width < 920px) {
					align-self: end;
				}
				> h4 {
					font-size: min(1.1rem, 5.0vw);
					line-height: 1.4;
					color: #464646;
					font-weight: 500;
					letter-spacing: 0.1em;
					> small {
						font-size: min(0.8rem, 4vw);
						letter-spacing: 0px;
						line-height: 1.0;
					}
				}
				> article {
					display: grid;
					grid-template-columns: 100px 1fr;
					border-bottom: 1px solid #b5b5b5;
					padding-block: 10px;
					&:nth-of-type(1) {
						margin-top: 10px;
						padding-block: 15px;
						border-top: 1px solid #b5b5b5;
					}
					> p {
						font-size: min(1.1rem, 5.0vw);
						line-height: 1.4;
						color: #464646;
						font-weight: 500;
						letter-spacing: 0.1em;
					}
				}
			}
			> figure {
				align-self: end;
				text-align: center;
				> img {
					max-width: 100%;
				}
			}
		}
	}
}