.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}
@media (max-width: 640px) {
	.top-kv figure {
		margin: 0;
		line-height: 0;
		position: relative;
	}
	.top-kv picture img {
		display: block;
		width: 100%;
		height: auto;
		border-radius: 2.5rem;
	}
	.kv-details-link {
		position: absolute;
		display: block;
		z-index: 2;
		top: 93.2%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 55.5%;
		height: 7.5%;
		border-radius: 50px;
	}
	.kv-details-link:hover {
		background-color: rgba(
			255,
			255,
			255,
			0.25
		); 
	}
	.top-kv ul {
		list-style: none;
		padding: 0 16px;
		margin: 4rem auto 0;
		display: flex;
		justify-content: center;
		gap: 0.25rem;
		flex-wrap: nowrap; 
	}
	.top-kv ul li {
		margin: 0;
		flex: 1; 
		max-width: 12rem; 
		min-width: 0; 
	}
	.top-kv ul a {
		display: block; 
		width: 100%; 
		aspect-ratio: 1 / 1; 
		border-radius: 50%;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
		transition: transform 0.2s ease, box-shadow 0.2s ease;
		overflow: hidden; 
	}
	.top-kv ul a:hover {
		transform: translateY(-3px);
		box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
	}
	.top-kv ul a img {
		display: block;
		width: 100%; 
		height: 100%; 
		object-fit: cover; 
	}
	.top-about {
		margin-top: 5rem;
		padding: 0 16px;
	}
	.top-about .heading-1 {
		font-size: 2.6rem;
		font-weight: 700;
		color: #3a3550;
		text-align: center;
		margin-bottom: 2rem;
	}
	.top-about__visual {
		margin: 0; 
	}
	.top-about__visual img {
		border-radius: 2rem;
		display: block;
		width: 100%;
		height: auto;
	}
	.top-about__body {
		margin: 24px 0 0 0;
	}
	.top-about__body dd {
		margin: 0;
		font-size: 1.3rem;
		line-height: 1.9;
		color: #333;
	}
	.top-about ul {
		list-style: none;
		padding: 0;
		width: 80%; 
		margin: 3rem auto 0; 
		display: flex;
		flex-direction: column; 
		gap: 1.6rem; 
	}
	.top-about ul li {
		margin: 0;
	}
	.top-about ul a {
		display: block;
		padding: 1rem;
		border-radius: 12px; 
		color: #fff; 
		text-decoration: none;
		font-size: 1.7rem;
		line-height: 1.4;
		text-align: center;
		transition: opacity 0.2s ease;
	}
	.top-about ul a:hover {
		opacity: 0.85; 
	}
	.top-about ul a span {
		display: block;
		font-size: 2.1rem;
		font-weight: 700;
	}
	.top-about ul li:first-child a {
		background-color: #6b67a0; 
	}
	.top-about ul li:last-child a {
		background-color: #498606; 
	}
	.top-plan {
		margin-top: 3rem;
		padding: 4rem 4rem 2rem; 
		background-color: #6b67a0;
		box-sizing: border-box; 
	}
	.top-plan .heading-1 {
		font-size: 2.6rem;
		font-weight: 700;
		color: #fff; 
		text-align: center;
		margin: 0 0 2.5rem 0; 
	}
	.top-plan ul {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-direction: column; 
		gap: 2rem; 
	}
	.top-plan ul img {
		display: block;
		width: 100%;
		height: auto;
		border-radius: 1.7rem; 
	}
	.top-plan > div > a {
		display: block;
		margin-top: 5rem;
		padding: 1.5rem;
		border-radius: 12px;
		background-color: #e8e6f2; 
		color: #6d558d; 
		font-weight: 700; 
		text-align: center;
		text-decoration: none;
		font-size: 1.8rem;
		border: 1px solid rgba(109, 85, 141, 0.26); 
		box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14); 
		transition: opacity 0.2s;
	}
	.top-plan > div > a:hover {
		opacity: 0.85; 
	}
	.top-plan > div > a span {
		display: block;
		font-size: 1.5rem;
		color: #6d558d; 
		opacity: 0.9;
		margin-top: 0.5rem;
	}
	.top-plan p {
		margin-top: 5rem;
		color: #fff;
		font-size: 1.3rem;
		text-align: center;
		line-height: 1.8;
		opacity: 0.9;
	}
	.top-plan p b {
		color: #f69f00; 
	}
	.top-access {
		padding: 3rem 16px 5rem; 
	}
	.top-access .heading-1 {
		font-size: 2.6rem;
		font-weight: 700;
		color: #3a3550;
		text-align: center;
		margin: 0 0 2.5rem 0; 
	}
	.top-access .gmap iframe {
		width: 100%;
		aspect-ratio: 4 / 5;
		border: 3px solid #6b67a0; 
		border-radius: 2rem;
		box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
	}
	.top-access .wrap {
		margin-top: 2.5rem; 
		text-align: center;
	}
	.top-access .wrap img {
		display: block;
		margin: 0 auto 1.5rem; 
		max-width: 400px;
		width: 90%;
	}
	.top-access address {
		font-style: normal; 
		font-size: 1.5rem;
		line-height: 1.9;
		color: #333;
	}
	.top-access address a {
		color: #a91b50; 
		text-decoration: none;
		font-weight: 700;
	}
} 
@media (min-width: 641px) {
	.top-about,
	.top-plan,
	.top-access {
		border-top: 1px solid #e8e6f2;
		padding-top: 18px;
		margin-top: 24px;
	}
	.top-about .heading-1,
	.top-plan .heading-1,
	.top-access .heading-1 {
		font-size: clamp(2rem, 4.3vw, 3rem) !important;
		line-height: 1.35 !important;
		font-weight: 800 !important;
	}
	.top-kv figure {
		width: min(1120px, 96%);
		margin: 6px auto 18px;
		line-height: 0;
	}
	.top-kv picture img {
		display: block;
		width: 100%;
		height: auto;
		border-radius: 2.4rem;
		box-shadow: 0 10px 26px rgba(0, 0, 0, 0.1);
	}
	.top-kv > figure {
		position: relative;
	}
	.kv-details-link {
		position: absolute;
		display: block;
		z-index: 2;
		top: 81.92%;
		left: 78%;
		width: 33.5%;
		height: 12%;
		transform: translate(-50%, -50%);
		border-radius: 50px;
	}
	.kv-details-link:hover {
		background-color: rgba(255, 255, 255, 0.5);
	}
	.top-kv ul {
		width: min(1120px, 96%);
		padding: 0 !important; 
		margin: clamp(14px, 2vw, 22px) auto 0 !important;
		list-style: none !important;
		display: flex;
		justify-content: center;
		gap: clamp(10px, 2.4vw, 28px);
		flex-wrap: wrap;
	}
	.top-kv ul li {
		list-style: none !important;
	}
	.top-kv ul li::marker {
		content: "";
	}
	.top-kv ul li::before {
		content: none !important;
	}
	.top-kv ul a {
		width: clamp(12rem, 14vw, 16rem);
		height: clamp(12rem, 14vw, 16rem);
		border-radius: 50%;
		background: #fff;
		box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
		overflow: hidden;
		transition: transform 0.2s ease, box-shadow 0.2s ease;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		padding: 0;
	}
	.top-kv ul a:hover {
		transform: translateY(-3px);
		box-shadow: 0 14px 30px rgba(0, 0, 0, 0.16);
	}
	.top-kv ul a img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.top-about .container {
		width: min(1120px, 96%);
		margin: 0 auto;
	}
	.top-about .heading-1 {
		text-align: center;
		margin: 0 0 18px;
	}
	.top-about .wrap {
		display: grid;
		grid-template-columns: 46% 1fr;
		gap: clamp(14px, 2.2vw, 28px);
		align-items: center; 
	}
	.top-about__visual img {
		border-radius: 1.6rem;
		width: 100%;
		height: auto;
		display: block;
	}
	.top-about__body dd {
		margin: 0;
		font-size: 1.3rem;
		line-height: 1.95;
		color: #333;
	}
	.top-about ul {
		width: min(900px, 96%);
		margin: 18px auto 0;
		list-style: none !important; 
		padding: 0 !important;
		display: flex;
		flex-direction: row;
		justify-content: center;
		flex-wrap: wrap;
		gap: 14px;
	}
	.top-about ul li {
		list-style: none !important;
	}
	.top-about ul li::marker {
		content: "";
	}
	.top-about ul li::before {
		content: none !important;
	}
	.top-about ul a {
		display: grid; 
		grid-template-rows: auto auto;
		row-gap: 0.25rem; 
		align-content: center;
		justify-items: center; 
		text-align: center; 
		padding: 0.95rem 1.6rem 1.05rem;
		border-radius: 16px; 
		color: #fff;
		text-decoration: none;
		box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08);
		min-width: clamp(200px, 36vw, 300px); 
		transition: filter 0.2s ease;
	}
	.top-about ul a {
		font-size: 1.4rem;
		line-height: 1.25;
		opacity: 0.95;
		letter-spacing: 0.02em;
	}
	.top-about ul a span {
		display: block;
		margin-top: 0.1rem;
		font-size: clamp(1.9rem, 1.7vw, 2.4rem); 
		font-weight: 800;
		line-height: 1.15;
	}
	.top-about ul li:first-child a {
		background: #6b67a0;
	} 
	.top-about ul li:last-child a {
		background: #498606;
	} 
	.top-about ul a:hover {
		filter: brightness(1.05);
		opacity: 1;
	}
	.top-plan {
		background: #6b67a0; 
		padding: 38px 0 24px;
	}
	.top-plan .heading-1 {
		color: #fff;
		margin: 0 auto 18px; 
	}
	.top-plan ul {
		width: min(900px, 96%); 
		margin: 0 auto;
		list-style: none;
		padding: 0;
		display: grid;
		grid-template-columns: repeat(
			2,
			minmax(0, 1fr)
		); 
		gap: 20px; 
	}
	.top-plan ul li a {
		display: block;
	}
	.top-plan ul img {
		display: block;
		width: 100%;
		height: auto;
		border-radius: 1.4rem;
	}
	.top-plan ul li:nth-child(3) {
		grid-column: 1 / span 2; 
		width: 100%;
		max-width: 450px; 
		margin: 20px auto 0; 
	}
	.top-plan > div {
		margin-top: clamp(32px, 3.4vw, 44px);
		width: min(500px, 78%); 
		margin-left: auto !important;
		margin-right: auto !important;
	}
	.top-plan > div::before {
		display: none !important;
	}
	.top-plan > div > a {
		display: block;
		text-align: center !important;
		text-decoration: none;
		border-radius: 16px !important;
		background: #e8e6f2 !important;
		color: #6d558d !important;
		border: 1px solid rgba(109, 85, 141, 0.26) !important;
		box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14) !important;
		font-weight: 800;
		font-size: 1.8rem;
		padding: 1rem 1.6rem !important;
	}
	.top-plan > div > a span {
		display: block;
		font-size: 1.5rem;
		opacity: 0.95;
		color: #6d558d !important;
	}
	.top-plan p {
		width: min(1120px, 96%);
		margin: 40px auto 0; 
		color: #fff;
		font-size: 1.4rem;
		line-height: 1.8;
		opacity: 0.9;
	}
	.top-plan p b {
		color: #f69f00;
	}
	.top-access .container {
		width: min(1120px, 96%);
		margin: 0 auto;
	}
	.top-access .heading-1 {
		text-align: center;
		margin: 0 0 18px;
	}
	.top-access .gmap iframe {
		width: 100%;
		aspect-ratio: 16 / 9;
		border: 3px solid #6b67a0;
		border-radius: 1.6rem;
		box-shadow: 0 10px 26px rgba(0, 0, 0, 0.1);
	}
	.top-access .wrap {
		margin-top: 18px;
		display: grid;
		grid-template-columns: 320px 1fr;
		gap: 16px;
		align-items: center;
	}
	.top-access .wrap img {
		max-width: 320px;
		width: 100%;
		height: auto;
		display: block;
		margin: 0;
	}
	.top-access address {
		font-style: normal;
		font-size: 1.6rem;
		line-height: 1.95;
		color: #333;
	}
	.top-access address a {
		color: #a91b50;
		font-weight: 800;
		text-decoration: none;
	}
	@media (min-width: 641px) {
		.top-plan > div {
			margin-left: auto !important;
			margin-right: auto !important;
			text-align: center !important;
		}
		.top-plan > div > a {
			text-align: center !important;
		}
	}
	@media (min-width: 641px) and (max-width: 1023px) {
		.top-plan .heading-1 {
			text-align: center !important;
			width: min(1120px, 96%) !important;
			margin: 0 auto 16px !important;
		}
		.top-plan p {
			text-align: right !important;
			width: min(1120px, 96%) !important;
			margin: 22px auto 0 !important;
		}
	}
	@media (min-width: 1024px) {
		.top-plan .heading-1 {
			text-align: center !important;
			width: min(1120px, 96%) !important;
			margin: 0 auto 18px !important;
		}
		.top-plan p {
			text-align: right !important;
			width: min(1120px, 96%) !important;
			margin: 26px auto 0 !important;
		}
		.top-plan > div > a {
			border-radius: 16px !important;
			background: #e8e6f2 !important;
			color: #6d558d !important;
			border: 1px solid rgba(109, 85, 141, 0.26);
			box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14);
		}
		.top-plan > div > a span {
			color: #6d558d !important;
		}
	}
	.top-kv ul a {
		width: 14rem; 
		height: 14rem;
	}
	@supports (container-type: inline-size) {
		.top-kv ul {
			container-type: inline-size;
			container-name: kvnav;
			width: min(1120px, 96%);
		}
		.top-kv ul a {
			--kv-btn-min: 140px; 
			--kv-btn-max: 300px; 
			width: clamp(var(--kv-btn-min), 20cqw, var(--kv-btn-max));
			height: clamp(var(--kv-btn-min), 20cqw, var(--kv-btn-max));
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
		}
		@container kvnav (min-width: 1120px) {
			.top-kv ul a {
				width: var(--kv-btn-max);
				height: var(--kv-btn-max);
			}
		}
		.top-kv ul a,
		.top-kv ul a span {
			font-size: clamp(1.2rem, 1.2cqw, 1.5rem);
			font-weight: 800;
		}
		.top-kv ul {
			gap: clamp(16px, 2.4cqw, 28px);
		}
	}
}