body {
	font-family: 'Noto Sans JP', sans-serif;
	color: #222222;
	/*width: 1920px;*/

	header {
		position: sticky;
		top: 0;
		left: 0;
		width: 100%;
		background-color: #fff;
		z-index: 1000;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
		padding: 1em 2.6%;

		.header-inner {
			display: flex;
			justify-content: space-between;
			align-items: flex-start;
			gap: 2em;
			flex-wrap: wrap;
		}
	}
	
	main {
		/* padding-top: 126px; */
	}
}

.clinic-logo {
	> h1 {
		font-size: 16px;
		white-space: nowrap;
	}
	
	> div {
		margin-top: 5px;
		display: flex;
		align-items: center;
		gap: 1rem;
	}
}

.clinic-hours {
	display: flex;
	gap: 1rem;
	
	& .tel {
	  font-size: 40px;
	}
}

.main-nav {
	.menu-button-container {
		display: none;
		height: 100%;
		width: 30px;
		cursor: pointer;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	#menu-toggle {
		display: none;
	}
	
	.menu-button::before {
		content: '';
		margin-top: -8px;
	}

	.menu-button::after {
		content: '';
		margin-top: 8px;
	}

	.menu-button,
	.menu-button::before,
	.menu-button::after {
		display: block;
		background-color: #222;
		position: absolute;
		height: 4px;
		width: 30px;
		transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1);
		border-radius: 2px;
	}

	#menu-toggle:checked + .menu-button-container .menu-button::before {
		margin-top: 0px;
		transform: rotate(405deg);
	}

	#menu-toggle:checked + .menu-button-container .menu-button {
		background: rgba(255, 255, 255, 0);
	}

	#menu-toggle:checked + .menu-button-container .menu-button::after {
		margin-top: 0px;
		transform: rotate(-405deg);
	}
	
	.menu {
		margin-top: 10px;
		display: flex;
		flex-direction: row;
		gap: 1em;
		
		> li {
			overflow: hidden;
			
			> tel {
				display: block;
			} 
		}
		
		a {
			align-items: center;
			text-decoration: none;
			color: #222;
			font-size: 16px;
			margin-right: 10px;
			
			&:after {
				content: "";
				display: inline-block;
				width: 7px;
				height: 7px;
				border-right: 2px solid #ED7713;
				border-bottom: 2px solid #ED7713;
				transform: rotate(45deg);
				margin-left: 0.4em;
				margin-bottom: 3px;
			}
		}
	}
}

.org1 {
	width: 96px;
	min-width: 4em;
	height: 65px;
	border-radius: 5px;
	background-color: #ED7713;
	font-size: 18px;
	color: #FFF;
	letter-spacing: 0.1em;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	flex-direction: column; 
}

.sec1 {
	position: relative;
	height: calc(62.5vw + 170px);
	background: linear-gradient(to bottom, #fff 50%, #FFF8EA 50%);
	
	.kv-wrapper {
		position: relative;
		width: 100%;
		margin-bottom: 2em;
		overflow: hidden;
		
		.kv-bg {
			margin: 0 auto;
			width: 94.8%;
			height: 94.8%;
			object-fit: cover;
			display: block;
			border-radius: 30px;
		}
	}
	
	.catch-copy {
		position: absolute;
		top: 50%;
		left: 8%;
		transform: translateY(-50%);
		font-size: 3vw;
		color: white;
		line-height: 5vw;
		letter-spacing: 7.5px;
	  
		.ylw {
		  color: #FABB05;
		}
		.red {
		  color: #E94235;
		}
	}
}

.sec2 {
	top: 60vw;
	width: 100%;
	position: absolute;
	display: flex;
	justify-content: center;
	padding: 2em 0 2em;
	z-index: 100;
}

.sec3 {
	padding: 2em 0;
	
	.kv-wrapper {
		position: relative;
		width: 100%;
		overflow: hidden;
		
		.kv-bg {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
		}
		
		.kv-cont {
			width: 620px;
			max-width: 40%;
			position: absolute;
			top: 50%;
			left: 8%;
			transform: translateY(-50%);
			letter-spacing: 7.5px;
			
			& h2 {
				font-size: 38px;
			}
			& p {
				margin-block-start: 1em;
				line-height: 36px;
				font-size: 20px;
			}
			
		}
	}
}

.sec4 {
	padding: 2em 0;
	text-align: center;
	
	.wrapper {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		background-color: #FFF4C6;
		padding: 2em 0;
		gap: 1em;
		
		.wrapper-sub {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 1em;
		}
		
		.cont {
			margin: 1em;
			width: 290px;
			text-align: left;
			
			h4 {
				font-weight: bold;
				font-size: 24px;
				line-height: 33.6px;
			}
			img {
				margin: 1em 0;
			}
			p {
				height: 180px;
				line-height: 36px;
			}
			a {
				.div-link {
					width: 260px;
					height: 60px;
					border-radius: 5px;
					background-color: white;
					box-shadow: 0 0 5px rgba(0,0,0,0.3);
					display: flex;
					align-items: center;
					padding: 0 1.5em;
					font-weight: bold;
					font-size: 17px;
					line-height: 23px;
					
					.arrow {
						position: relative;
						width: 13px;
						height: 2px;
						margin-left: auto;
						background-color: #ED7713;

						&::after {
							content: '';
							position: absolute;
							top: 0;
							right: -5px;
							top: -4px;
							width: 0;
							height: 0;
							border-left: 8px solid #ED7713;
							border-top: 6px solid transparent;
							
						}
					}
				}
			}
		}
	}
}

.sec5 {
	padding: 2em 0;
	
	.div-map {
		iframe {
			width: 100%;
		}
	}
}

.sec6 {
	.wrapper {
		width: fit-content;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		padding: 2em 0;
		gap: 1em;
		
		.cont-txt {
			width: 452px;
			
			.clinic-hours {
				margin-top: .5em;
			}
			.clinic-address {
				margin-top: .5em;
			}
		}
	}
}

.sec7 {
	padding: 2em 0;
	.clinic-schedule {
		margin: 0 auto;
	}
	.div-nav {
		width: 700px;
		margin: 0 auto;
	}
}

.sec11 {
	.kv-wrapper {
		position: relative;
		width: 100%;
		overflow: hidden;
		
		.kv-bg {
			width: 90%;
			height: 100%;
			border-radius: 30px;
			margin: 1em auto;
			object-fit: cover;
			display: block;
		}
		
		.kv-cont {
			width: 90%;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			letter-spacing: 7.5px;
			text-align: center;
			
			& h2 {
				font-size: 6vw;
				color: white;
				text-shadow: 0 0 5px rgba(0,0,0,0.3);
			}
		}
	}
}

.sec13 {
	background-color: #FFF4C6;
	
	.div-zigzag {
		width: 100%;
		margin: 0 auto;
		
		.box {
			display: flex;
			flex-wrap: wrap;
			width: 100%;
			
			
			&:nth-child(2n+1) {
				flex-direction: row;
			}
			&:nth-child(2n) {
				flex-direction: row-reverse;
			}
			
			.div-txt {
				min-width:400px;
				width: 50%;
				padding: 2em 0;

				h3 {
					padding: 0 8% .5em;
					font-size: 38px;
				}
				p {
					padding: 0 8%;
					line-height: 30px;
					font-size: 18px;
					
				}
			}
			.div-img {
				min-width:400px;
				width: 50%;
				img {
					width: 100%;
				}
			}
		}
	}
}

.sec14 {
	margin: 2em 0;
	
	.cont-2col {
		width: 90%;
		max-width: 1280px;
		display: flex;
		flex-wrap: wrap;
		margin: 0 auto;
		gap: 4em;
		
		/*display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 4em;
		width: 90%;
		max-width: 1280px;
		margin: 0 auto;*/
		
		.item {
			max-width: 600px;
			margin: 0 auto;
			
			p {
				line-height: 36px;
				font-size: 20px;
			}
			img {
				width: 100%;

				margin-bottom: 1em;
			}
		}

	}
}

.sec15 {
	.wrapper {
		margin: 0 auto;
		max-width: 1430px;
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		gap: 2rem;
		flex-wrap: wrap;
		
		.cont-txt {
			margin: 0 auto;
			width: 380px;
			
			.clinic-hours {
				margin-top: .5em;
			}
			.clinic-address {
				margin-top: .5em;
			}
		}
		.clinic-schedule {
			margin: 0 auto;
		}
	}
}

.sec21 {
	
	.cont-doc {
		width: 90%;
		max-width: 1280px;
		margin: 0 auto 4em;
		display: flex;
		flex-wrap: wrap;
		gap: 1em 3em;
		
		.item {
			&.div-txt {
				width: 564px;
				
				h4 {
					font-size: 38px;
					margin-bottom: 1em;
					width: 550px;
				}
				p {
					line-height: 30px;
					font-size: 20px;
				}
			}
			&.div-img {
				width: 654px;
				text-align: center;
				img {
					margin-bottom: 1em;
				}
			}
		}

	}
	
	.div-member {
		width: 90%;
		max-width: 1191px;
		margin: 2em auto;
		
		img {
			width: 100%;
			border-radius: 50px;
		}
	}
}

.sec31 {
	.fee-txt {
		max-width: 760px;
		margin: 0 auto;
		
		p {
			font-size: 18px;
			line-height: 30px;
		}
	}
	
	.div-fee {
		max-width: 900px;
		width: 90%;
		margin: 2em auto;
		
		
		.fee-tbl {
			table-layout: fixed;
			width: 100%;
			font-size: 27px;
			
			thead {
				border-bottom: 4px solid #FF7600;
				th {
					padding: 20px;
					color: #FF7600;
					font-weight: 400;
				}
			}
			tbody {
				tr {
					border-bottom: 1.5px solid #CCC;
				}
				td {
					padding: 20px;
					font-weight: 400;
				}
			}
			tfoot {
				td {
					padding: 20px 15px;
					font-size: 18px;
				}
			}
			.rgt {
				text-align: right;
			}
			.note {
				font-size: 18px;
				font-weight: normal;
			}
			.crm {
				color: #FF2A2D
			}
			
		}
	}
}

.sec32 {
	.cases-txt {
		width: 70%;
		margin: 0 auto;
		font-size: 22px;
	}
	
	.div-case {
		width: 70%;
		margin: 2em auto;
		font-size: 22px;
		
		.org {
			color: #FF7600;
		}
		
		.div-img {
			img {
				width: 100%;
				margin: 1em auto;
			}
		}
		
		table {
			table-layout: fixed;
			width: 100%;
			
			tr {
				border-top: 1.5px solid #CCC;
			}
			td {
				padding: 16px;
			}
		}
	}
	
	.banner {
		width: 1344px;
		max-width: 90%;
		margin: 2em auto;
		img {
			width: 100%;
		}
	}
}

.sec-header {
	padding: 1em 0 2em;
	padding-top: 170px;
	margin-top: -150px;
	text-align: center;
	
	h3 {
		font-size: 37px;
		line-height: 57px;
	}
	
	h5 {
		font-size: 18px;
		color: #ED7713;
	}
}

.clinic-schedule {
	width: 892px;
	max-width: 95%;
	border-radius: 30px;
	background-color: #FFF;
	padding: 25px;
	box-shadow: 0 0 10px rgba(0,0,0,0.3);
	
	.schedule-tbl {
		max-width: 842px;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row-reverse;
		gap: 2rem;
		
		.tbl-clinic-hours {
			width: 443px;
			height: 133px;
			border-collapse: collapse;
			margin: auto;
			
			thead {
				height: 37px;
				background-color: #FFF4C6;
			}
			
			tbody {
				tr {
					border-bottom: 1px solid #D2D2D2;
				}
			}
			
			th, td {
				vertical-align: middle;
				text-align: center;
				padding: 0 .5em;
				white-space: nowrap;
				
				.dot {
					display: block;
					width: 16px;
					height: 16px;
					background-color: #ED7713;
					border-radius: 50%;
					margin: auto;
				}
				
				.tri {
					display: block;
					width: 0;
					height: 0;
					border-left: 9.23px solid transparent;
					border-right: 9.23px solid transparent;
					border-bottom: 16px solid #ED7713;
					margin: auto;
				}
				
				.lin {
					display: block;
					width: 16px;
					border-bottom: 1px solid #222222;
					height: 1px;
					margin: auto;
				}
			}
		}
		
		.clinic-features {
			width: 349px;
			margin: auto;
			
			.org2 {
				width: 349px;
				max-width: 100%;
				height: 37px;
				border-radius: 50px;
				background-color: #ED7713;
				font-size: 18px;
				color: #FFF;
				letter-spacing: 0.1em;
				display: flex;
				justify-content: center;
				align-items: center;
				text-align: center;
				flex-direction: column; 
			}
			
			.clinic-feat2 {
				margin-top: 1em;
				display: flex;
				justify-content: space-between;
			}
			
			.org3 {
				width: 108px;
				min-width: 5em;
				height: 73px;
				border-radius: 50px;
				background-color: #ED7713;
				font-size: 18px;
				color: #FFF;
				letter-spacing: 0.1em;
				display: flex;
				justify-content: center;
				align-items: center;
				text-align: center;
				flex-direction: column; 
			}
		}
	}
	.clinic-notes {
		margin-top: 1em;
		p {
		  font-size: 15px;
		  line-height: 20px;
		  letter-spacing: 1.8px;
		}
	}
}

.mov {
	display: none;
}

@media (max-width: 1161px) {
	.sec2 {
		top: calc(60vw + 100px);
	}
}

@media (max-width: 1024px) {
	.sec1 {
		height: calc(62.5vw);
	}
	
	.sec2 {
		position: static;
		background-color: #FFF8EA;
	}
	
	.sec3 {
		& .kv-wrapper {
			.kv-cont {
				margin-top: 2em;
				display: block;
				position: relative;
				max-width: 95%;
				transform: none;
				width: 85%;
				max-width: 85%;
			}
		}
	}
/*
}

@media (max-width: 768px) {
*/
	.header-inner {

		& .clinic-hours {
			display: none;
		}
	}
	.main-nav {
		.menu-button-container {
			display: flex;
			padding: 1em;
		}

		.menu {
			position: absolute;
			margin-top: 70px;
			left: 0;
			flex-direction: column;
			width: 100%;
			justify-content: center;
			align-items: center;
			gap: 0;
		}

		#menu-toggle ~ .menu li {
			height: 0;
			margin: 0;
			padding: 0;
			border: 0;
			transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
		}

		#menu-toggle:checked ~ .menu li {
			border: 1px solid #333;
			height: 2.5em;
			padding: 0.5em;
			transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
			&:not(:last-child) {
				border-bottom: none;
			}
		}

		.menu > li {
			display: flex;
			justify-content: center;
			margin: 0;
			padding: 0.5em 0;
			width: 100%;
			color: white;
			background-color: #ED7713;
		}
	}
	
	.sec7 {
		.div-nav {
			display: none;
		}
	}
}

@media (max-width: 468px) {
	img {
		max-width: 100%;
	}

	.clinic-logo {
		display: inline-block;
		width: calc(100vw - 90px);
	}

	.clinic-logo,
	.clinic-hours {
		> p {
			font-size: .9rem;
		}
	}

	.clinic-hours {
		& .tel {
			font-size: 1.1rem;
			margin-top: .5rem;
			display: block;
		}
	}

	.main-nav {
		.menu {
			margin-top: 90px;
		}
	}

	.sec1 {
		.catch-copy {
			line-height: 180%;
			font-size: 1.2rem;
		}
	}

	.clinic-schedule {
		padding: .5em 1em;
	}

	.clinic-schedule {
		.schedule-tbl {
			padding-top: 1em;
			padding-bottom: 1em;
		}
	}

	.sec3 {
		& .kv-wrapper {
			.kv-cont {
				display: block;
				position: relative;
				max-width: 95%;
				transform: none;
				
				& h2 {
					font-size: 1.5rem;
				}
				
				& p {
					font-size: 1rem;
					padding: 0 1em;
					line-height: 115%;
				}
			}
		}
	}

	.sec4 {
		& .wrapper {
			& .cont {
				margin-bottom: 2em;

				p {
					margin-block-end: 1em;
					line-height: 180%;
					height: fit-content;
				}
			}
		}
	}

	.sec6 {
		.wrapper {
			width: 100%;
		}
	}
}