/*共通*/
.pc {
	display: none;
	@media screen and (min-width: 768px) { display: block; }
}
.lottekasai-lp header, .metrogreen-lp header, .sunland-lp header {
	background-color: transparent;
	flex-direction: row-reverse;
	p.link a { color: #ffffff; }
}
.sunland-lp footer {
	padding-bottom: 65px;
	@media screen and (min-width: 768px) {　padding-bottom: 0;　}
}
main section.visual {
	width: 100%;
	aspect-ratio: 16 / 9;
	padding: 0;
	background-color: #ffffff;
	position: relative;
	iframe {
		width: 100%;
		height: 100%;
	}
}
main section.pagetitle {
	background: url(../img/common/bg-title.png) no-repeat center / cover;
	padding: 100px 5% 60px;
	margin-top: -65px;
	@media screen and (min-width: 768px) {
		padding: 230px 40px 115px;
		margin-top: -118px;
	}
	h1 {
		color: #ffffff;
		font-weight: 700;
		font-size: 9vw;
		text-align: left;
		line-height: 1;
		@media screen and (min-width: 768px) {
			font-size: 312.5%;
			max-width: 1200px;
			margin: 0 auto;
		}
	}
}
.lottekasai-lp footer section, .metrogreen-lp footer section, .sunland-lp footer section {
	padding: 5px 0;
	gap: 0;
	background-color: rgb(0, 0, 0);
	color: #ffffff;
	text-align: center;
}
.lottekasai main, .metrogreen main {
	section.visual::before {
		content: "";
		display: block;
		width: 100vw;
		height: 65px;
		@media screen and (min-width: 768px) { height: 118px; }
	}
}
/*ロッテ葛西校*/
.lottekasai main .facility, .lottekasai-lp main .facility {
	background: url(../img/lp/bg-kasai.png) no-repeat center / cover;
	text-align: center;
	position: relative;
	h2, p {
		font-size: 6vw;
		font-weight: 900;
		line-height: 1.3;
		margin-bottom: 30px;
		@media screen and (min-width: 768px) { font-size: 187.5%; }
		strong {
			font-size: 150%;
			@media screen and (min-width: 768px) { font-size: 200%; }
		}
	}
	> p {
		font-weight: 500;
		letter-spacing: -1px;
	}
	dl {
		border: 1px solid #ffffff;
		border-radius: 10px;
		@media screen and (min-width: 768px) {
			max-width: 640px;
			margin: 0 auto;
		}
		dt {
			background-color: #db124c;
			width: fit-content;
			padding: 5px 3em;
			margin: -20px auto 10px;
			font-size: 4vw;
			border-radius: 25px;
			@media screen and (min-width: 768px) {
				font-size: 187.5%;
				padding: 5px 5em;
			}
		}
		dd {
			padding: 0 20px 20px;
			p {
				font-size: 4.5vw;
				margin-bottom: 10px;
				@media screen and (min-width: 768px) { font-size: 187.5%; }
				strong {
					@media screen and (min-width: 768px) { font-size: 150%; }
				}
			}
			ul {
				display: grid;
				gap: 10px;
				grid-template-columns: 1fr 1fr;
				line-height: 1;
				@media screen and (min-width: 768px) { font-size: 125%; }
				li {
					color: #db124c;
					background-color: #ffffff;
					border-radius: 10px;
					padding: 20px 0;
					font-size: 6vw;
					font-weight: 700;
					@media screen and (min-width: 768px) { font-size: 225%; }
					strong { font-size: 150%; }
				}
			}
		}
	}
}
.lottekasai main .campaign, .lottekasai-lp main .campaign {
	background-color: #3333cc;
	text-align: center;
	h2 {
		font-weight: 900;
		font-size: 7.5vw;
		margin-bottom: 40px;
		line-height: 1.2;
		color: #ffda03;
		@media screen and (min-width: 768px) {
			font-size: 312.5%;
			margin-bottom: 60px;
		}
	}
	> ul {
		display: grid;
		gap: 10px;
		@media screen and (min-width: 768px) {
			grid-template-columns: repeat(3, 1fr);
			max-width: 1200px;
			margin: 0 auto;
		}
		li {
			background-color: #ffda03;
			color: #3333cc;
			border-radius: 10px;
			font-weight: 900;
			padding: 15px;
			font-size: 6vw;
			line-height: 0.9;
			margin-bottom: 0;
			@media screen and (min-width: 768px) {
				font-size: 187.5%;
				padding: 20px;
				line-height: 1;
			}
		}
	}
}
.lottekasai main .campaign > ul > li:first-of-type strong, .lottekasai-lp main .campaign > ul > li:first-of-type strong {
	font-size: 430%;
	@media screen and (min-width: 768px) { font-size: 475%; }
}
.lottekasai main .campaign > ul > li:nth-of-type(2) strong, .lottekasai-lp main .campaign > ul > li:nth-of-type(2) strong {
	font-size: 330%;
	@media screen and (min-width: 768px) { font-size: 400%; }
}
.lottekasai main .campaign > ul > li ul, .lottekasai-lp main .campaign > ul > li ul {
	display: grid;
	gap: 5px;
	margin-top: 10px;
	li {
		padding: 10px;
		background-color: #3333cc;
		color: #ffda03;
		gap: 5px;
		font-size: 4.5vw;
		font-weight: 600;
		border-radius: 30px;
		line-height: 1;
		@media screen and (min-width: 768px) { font-size: 60%; }
		strong {
			font-size: 125%;
			font-weight: 600;
		}
	}
}

.lottekasai main .plan, .lottekasai-lp main .plan,
.lottekasai main section.junior, .lottekasai-lp main section.junior,
.metrogreen main .plan, .metrogreen-lp main .plan {
	background-color: #ffffff;
	color: #333333;
	span {
		display: block;
		font-size: 75%;
	}
	.note {
		font-size: 100%;
		color: #db124c;
		line-height: 1.3;
	}
	.rule {
		font-weight: 700;
		font-size: 87.5%;
		display: grid;
		grid-template-columns: repeat(2, auto);
		gap: 10px;
		justify-content: center;
		margin: 20px auto 0;
		li a {
			border: 1px solid #666666;
			background: #ffffff;
			padding: 10px 1em;
			&::after {
				content: url(../img/common/ico-pgtop.svg);
				transform: rotate(90deg);
				display: inline-block;
				width: 1.5em;
				height: 1.5em;
				vertical-align: middle;
				margin-left: 0.5em;
			}
		}
	}
	article {
		h2 {
			text-align: center;
			+ p {
				font-size: 4.5vw;
				font-weight: 700;
				@media screen and (min-width: 768px) {
					font-size: 187.5%;
				}
			}
		}
		article {
			background-color: #f7f7e4;
			padding: 30px;
			margin-top: 30px;
			border-radius: 30px;
			@media screen and (min-width: 768px) {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				gap: 0 40px;
				padding: 60px;
			}
			h3, h4 {
				color: #4B9B1E;
				line-height: 1.3;
			}
			h3 {
				font-size: 6vw;
				font-weight: 900;
				margin-bottom: 15px;
				@media screen and (min-width: 768px) {
					font-size: 250%;
					grid-column: 1 / 3;
				}
			}
			h4 {
				font-size: 4vw;
				font-weight: 700;
				margin-top: 20px;
				text-align: left;
				@media screen and (min-width: 768px) {
					font-size: 150%;
					margin-bottom: 10px;
				}
			}
			p {
				font-size: 100%;
				text-align: left;
			}
			.link {
				text-align: center;
				font-weight: 700;
				font-size: 125%;
				margin: 20px 0;
				a {
					border: 1px solid #666666;
					background: #ffffff;
					padding: 10px 30px;
					&::after {
						content: url(../img/common/ico-pgtop.svg);
						transform: rotate(90deg);
						display: inline-block;
						width: 1.5em;
						height: 1.5em;
						vertical-align: middle;
						margin-left: 0.5em;
					}
				}
			}
			dl {
				display: grid;
				gap: 0 1em;
				grid-template-columns: auto 1fr;
				text-align: left;
			}
			ul {
				margin-top: 10px;
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				gap: 10px;
				text-align: center;
				line-height: 1.3;
				font-weight: 900;
				li a {
					background-color: #7bb23b;
					color: #ffffff;
					height: 100%;
					display: grid;
					place-items: anchor-center;
					border-radius: 26px;
					padding: 5px 0;
					span { font-size: 100%; }
				}
			}
			div h4:first-child {
				@media screen and (min-width: 768px) { margin-top: 0; }
			}
		}
	}
}
.lottekasai main .plan, .lottekasai-lp main .plan, .lottekasai main section.junior, .lottekasai-lp main section.junior {
	article  article div {
		background: #ffffff;
		padding: 20px;
		margin-top: 20px;
		border: 1px solid #7bb23b;
		border-radius: 20px;
	}
}
.metrogreen main .plan, .metrogreen-lp main .plan {
	article  article div:last-child {
		background: #ffffff;
		padding: 20px;
		margin-top: 20px;
		border: 1px solid #7bb23b;
		border-radius: 20px;
		@media screen and (min-width: 768px) { 
			grid-column: 1 / 3;
			margin: 30px auto 0;
		}
		p em {
			color: #db124c;
			font-style: normal;
			font-weight: 900;
		}
	}
}
.lottekasai main .plan article .regular, .lottekasai-lp main .plan article .regular {
	div:nth-of-type(1), div:nth-of-type(2) {
		background: transparent;
		padding: 0;
		margin-top: 0;
		border: 0;
		border-radius: 0;
	}
	div:nth-of-type(3), div:nth-of-type(4) {
		h4 { margin-top: 0; }
	}
	div:nth-of-type(3) {
		display: grid;
		grid-template-rows: auto auto 1fr;
		ul {
			@media screen and (min-width: 768px) { margin-top: auto; }
		}
	}
/*	> ul:first-of-type {
		grid-template-columns: auto;
		width: fit-content;
		margin: 0 auto 10px;
		li a { padding: 10px 1em; }
	}*/
	div p em {
		color: #db124c;
		font-style: normal;
		font-weight: 900;
	}
	p:last-child {
		margin-top: 10px;
		font-size: 100%;
	}
	> p, .note {
		@media screen and (min-width: 768px) {
			text-align: center;
			grid-column: 1/3;
		}
	}
	> ul {
		@media screen and (min-width: 768px) {
			grid-column: 1/3;
			padding: 0 25%;
		}
	}
}
.lottekasai main .plan article .debut, .lottekasai-lp main .plan article .debut {
	div {
		background: transparent;
		padding: 0;
		margin-top: 0;
		border: 0;
		border-radius: 0;
		h4 {
			margin-top: 20px;
		}
	}
	> ul {
		@media screen and (min-width: 768px) {
			grid-column: 1/3;
			padding: 0 25%;
			margin-top: 20px;
		}
	}
}
.lottekasai main .plan article .short-term, .lottekasai-lp main .plan article .short-term {
	> h4, > dl {
		@media screen and (min-width: 768px) {
			grid-column: 1 / 3;
			place-items: center;
			margin: 0 auto;
		}
	}
	> h4 { margin-top: 20px; }
	> ul {
		@media screen and (min-width: 768px) {
			grid-column: 1 / 3;
			padding: 0 25%;
		}
	}
}
.lottekasai main section.junior, .lottekasai-lp main section.junior {
	background-color: #d8f3f1;
	color: #333333;
	.rule li a {
		color: #333333;
		border-radius: 0;
		display: block;
		font-weight: 700;
	}
	h2 {
		font-weight: 900;
		font-size: 7.5vw;
		margin-bottom: 40px;
		line-height: 1.2;
		text-align: center;
		@media screen and (min-width: 768px) { font-size: 312.5%; }
	}
}
.lottekasai main .junior, .lottekasai-lp main .junior article {
	.junior-class {
		background-color: #ffffff;
		padding: 30px;
		margin-top: 30px;
		border-radius: 30px;
		text-align: left;
		@media screen and (min-width: 768px) {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 0 40px;
			padding: 60px;
		}
		h3 {
			color: #4B9B1E;
			font-weight: 900;
			font-size: 6vw;
			@media screen and (min-width: 768px) {
				font-size: 250%;
				text-align: center;
				grid-column: 1 / 3;
			}
		}
		h4 {
			font-weight: 700;
			font-size: 4vw;
			color: #4B9B1E;
			line-height: 1.3;
			margin: 20px 0 10px;
			@media screen and (min-width: 768px) { font-size: 150%; }
		}
		dl {
			display: grid;
			gap: 1em;
			grid-template-columns: auto 1fr;
			text-align: left;
			line-height: 1.3;
		}
		.link {
			text-align: center;
			font-weight: 700;
			font-size: 125%;
			margin: 20px 0;
			a {
				border: 1px solid #666666;
				background: #ffffff;
				padding: 10px 30px;
				&::after {
					content: url(../img/common/ico-pgtop.svg);
					transform: rotate(90deg);
					display: inline-block;
					width: 1.5em;
					height: 1.5em;
					vertical-align: middle;
					margin-left: 0.5em;
				}
			}
		}
		ul {
			@media screen and (min-width: 768px) { padding: 0; }
		}
	}
	p { font-size: 100%; }
	ul {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
		text-align: center;
		line-height: 1.3;
		font-weight: 700;
		margin-top: 10px;
		@media screen and (min-width: 768px) { padding: 0 25%; }
		li a {
			background-color: #7bb23b;
			color: #ffffff;
			font-weight: 900;
			height: 100%;
			display: grid;
			place-items: anchor-center;
			border-radius: 26px;
			padding: 14px 1em;
		}
	}
}
#time-table article, #time-table-junior article {
	background-color: #ffffff;
	padding: 20px;
	div {
		overflow-x: auto;
		padding: 10px 0;
		table {
			width: 100%;
			color: #333333;
			white-space: nowrap;
			line-height: 1.3;
		}
	}
}
#time-table article div table tr {
	th {
		padding: 5px 10px;
		text-align: center;
		vertical-align: middle;
		&:not(:last-child) { border-right: 1px dotted #000000; }
	}
	td {
		vertical-align: middle;
		padding: 5px 10px;
		&:not(:last-child) { border-right: 1px dotted #000000; }
	}
}
#time-table article div table.weekdays tr th {
	background-color: #3473a9;
	color: #ffffff;
}
#time-table article div table.holiday tr th {
	background-color: #ff3737;
	color: #ffffff;
}
#time-table article div table.holiday tr th.red {
	background-color: #ff3737 !important;
	color: #ffffff !important;
}
#time-table article div table.holiday tr th:nth-child(n+2) {
	background-color: #fbf5a6;
	color: #333333;
}
#time-table article div table tr td {
	&.abe { background-color: #ffb8df; }
	&.fujii { background-color: #b884fb; }
	&.kitai { background-color: #ffb74d; }
	&.fukuda { background-color: #5fdbb3; }
	&.ishikawa { background-color: #b3e3a0; }
	&.iura { background-color: #fcff2a; }
	&.udagawa { background-color: #f9d3ab; }
	&.takahashi { background-color: #72dfff; }
	&.suzuki { background-color: #7dc152; }
	&.matsumoto { background-color: #ff80fb; }
	&.tani { background-color: #bdf0ff; }
	&.hasegawa { background-color: #f5c847; }
	&.ogawa { background-color: #e99dd0; }
	&.kuwahara { background-color: #a9d08e; }
	&.maeda { background-color: #00b0f0; }
	&.okano { background-color: #f95b5b; }
	/*&.okano { background-color: #eb9797; }*/
}
.metrogreen #time-table article div table tr td {
	&.suzuki { background-color: #72dfff; }
	&.takahashi { background-color: #ffe272; }
	&.fukuda { background-color: #d9ebfb; }
	&.ishikawa { background-color: #ffc000; }
}
.metrogreen #time-table article div:last-child table { width: 18%; }
#general-school article ul li, #jonior-school article ul li {
	&::before {
		content: "● ";
		color: #7BB23B;
		font-size: 70%;
	}
	em {
		color: #db124c;
		font-weight: 700;
		font-style: normal;
	}
}
#general-rule article p {
	font-weight: 700;
	margin-bottom: 1em;
}
#general-rule article ol {
	display: grid;
	gap: 5px;
	list-style: decimal;
	padding-left: 1.5em;
	text-align: left;
}
#general-school article, #jonior-school article, #general-rule article, #philosophy article, #values article, #web article, #call article {
	padding: 20px;
	@media screen and (min-width: 768px) { padding: 60px; }
}
#web article, #call article {
	dl {
		@media screen and (min-width: 768px) {
			width: fit-content;
			margin: 0 auto;
		}
		dt {
			color: #4B9B1E;
			em {
				font-size: 150%;
				font-style: normal;
				font-weight: 400;
				margin-right: 1em;
			}
			&:not(:first-child)::before {
				content: "▼";
				color: #4B9B1E;
				display: block;
				width: 1em;
				margin: 0 auto;
			}
		}
	}
	.link {
		text-align: center;
		a {
			background-color: #7bb23b;
			color: #ffffff;
			font-weight: 900;
			border-radius: 26px;
			padding: 10px 1em;
			&::after { display: none; }
		}
	}
	p { text-align: center; }
}
#time-table article h2, #time-table-junior article h2, #philosophy article h2, #values article h2 {
	color: #4B9B1E;
	font-weight: 900;
	font-size: 6vw;
	line-height: 1.2;
	margin-bottom: 0.5em;
	@media screen and (min-width: 768px) { font-size: 250%; }
}
#philosophy article p {
	font-size: 125%;
	line-height: 2;
	&.name {
		text-align: right;
		margin-top: 1em;
	}
}
#values article dl {
	@media screen and (min-width: 768px) {
		max-width: 1000px;
		margin: 0 auto;
	}
	dt {
		font-size: 112.5%;
		line-height: 1.3;
		margin-bottom: 10px;
		em {
			font-style: normal;
			font-size: 150%;
			color: #4B9B1E;
			display: block;
			margin-bottom: 5px;
			@media screen and (min-width: 768px) {
				display: inline-block;
				margin-right: 10px;
			}
		}
	}
	dd:not(:last-child) { margin-bottom: 20px; }
}
.metrogreen main .schedule, .metrogreen-lp main .schedule, .sunland main .schedule, .sunland-lp main .schedule {
	background: url(../img/lp/bg-schedule.png) no-repeat center/cover;
	width: 100vw;
	h2 {
		text-align: center;
		font-weight: 900;
		font-size: 7.5vw;
		margin-bottom: 40px;
		@media screen and (min-width: 768px) {
			font-size: 312.5%;
			margin-bottom: 60px;
		}
	}
	div {
		overflow: auto;
		max-height: 60vh;
		@media screen and (min-width: 768px) {
			max-height: 600px;
			max-width: 1200px;
			margin: 0 auto;
		}
		table {
			white-space: nowrap;
			background-color: rgba(255, 255, 255, 0.4);
			border-top: none;
			border-bottom: none;
			th {
				background-color: rgb(0, 0, 0);
				text-align: center;
				padding: 5px 0;
				position: sticky;
				top: 0;
			}
		        td {
				text-align: left;
				padding: 0;
				ul li {
					font-size: 87.5%;
					background: rgba(75, 155, 30, 0.7);
					border-top: 1px solid #ffffff;
					padding: 10px;
					line-height: 1.2;
					&:last-child { border-bottom: 1px solid #ffffff; }
				}
		        }
		}
	}
	p.reserve {
		margin: 40px auto 0;
		text-align: center;
		a {
			color: #ffffff;
			background-color: #000000;
			font-size: 5.5vw;
			padding: 25px 3em;
			font-weight: 600;
			border-radius: 46px;
			@media screen and (min-width: 768px) {
				font-size: 187.5%;
				border-radius: 50px;
			}
			&::after {
				content: url(../img/common/ico-arrow.svg);
				display: inline-block;
				width: 1.5em;
				height: 1.5em;
				vertical-align: middle;
				margin-left: 0.5em;
			}
		}
	}
}
.lottekasai main .staff, .lottekasai-lp main .staff, .metrogreen main .staff, .metrogreen-lp main .staff, .sunland main .staff, .sunland-lp main .staff {
	background: url(../img/lp/bg-gray.png) no-repeat center/cover;
	color: #4B9B1E;
	h2 {
		font-weight: 900;
		font-size: 7.5vw;
		margin-bottom: 40px;
		text-align: center;
		@media screen and (min-width: 768px) {
			font-size: 312.5%;
			margin-bottom: 60px;
		}
	}
	article {
		> ul {
			font-weight: 700;
			display: grid;
			gap: 30px;
			grid-template-columns: repeat(2, 1fr);
			@media screen and (min-width: 768px) { grid-template-columns: repeat(4, 1fr); }
			li a {
				@media screen and (min-width: 768px) { font-size: 125%; }
				.photo {
					margin-bottom: 10px;
					img { border-radius: 50%; }
				}
				.photo + p::after {
					content: url(../img/common/ico-arrow-g.svg);
					display: inline-block;
					width: 1.5em;
					height: 1.5em;
					vertical-align: middle;
					margin-left: 0.5em;
				}
			}
		}
	}
}
.sunland-lp main .staff { background: #ffffff; }
.sunland-lp main section.staff article ul li:has(a[href="#staff78"]) { display: none;  /*一覧からJLPGAの写真の鈴木プロを非表示*/}
.pro-detail {
	padding: 20px;
	@media screen and (min-width: 768px) {
		display: grid;
		gap: 20px 40px;
		grid-template-columns: calc(25% - 20px) calc(75% - 20px);
		grid-template-rows: auto auto 1fr;
		padding: 40px;
	}
	> h2 {
		color: #CCFF33;
		font-weight: 600;
		font-size: 150%;
		margin: 30px 0 5px;
	}
	> p {
		font-weight: 600;
		font-size: 112.5%;
		@media screen and (min-width: 768px) {
			grid-column: 2 / 3;
			grid-template-rows: 2 /3;
		}
	}
	.movie {
		aspect-ratio: 16 / 9;
		margin-top: 20px;
		@media screen and (min-width: 768px) {
			grid-column: 2 / 3;
			grid-template-rows: 3 /4;
		}
		iframe {
			width: 100%;
			height: 100%;
		}
	}
	article {
		@media screen and (min-width: 768px) { grid-row: 1 / 4; }
		.photo {
			width: 70%;
			margin: 0 auto;
			img { border-radius: 50%; }
		}
		h2 {
			text-align: center;
			font-size: 7.5vw;
			font-weight: 600;
			@media screen and (min-width: 768px) { font-size: 125%; }
		}
		h3 {
			color: #CCFF33;
			font-weight: 600;
			font-size: 125%;
			margin: 30px 0 5px;
		}
		ul li::before {
			content: "●";
			display: inline-block;
			color: #CCFF33;
			font-size: 75%;
			margin-right: 0.5em;
		}
		p {
			margin-bottom: 5px;
			&::before {
				width: 10em;
				margin-bottom: 5px;
				display: block;
				text-align: center;
				font-size: 87.5%;
				margin-left: 5px;
				border-radius: 10px;
			}
		}
		p.lkg::before {
			content: "ロッテ葛西校";
			background-color: #ea656b;
		}
		p.sunland::before {
			content: "クラブサンランド";
			background-color: #6b7bf2;
		}
		p.metro::before {
			content: "メトログリーン校";
			background-color: #39afea;
		}
		p.note { font-size: 75%; }
	}
}
.lottekasai main .lesson, .lottekasai-lp main .lesson {
	color: #333333;
	background-color: #ffffff;
	h2 {
		font-size: 8vw;
		margin-bottom: 40px;
		font-weight: 900;
		text-align: center;
		@media screen and (min-width: 768px) {
			font-size: 312.5%;
			margin-bottom: 60px;
		}
	}
	ul {
		background-color: #f7f7e4;
		padding: 20px;
		font-size: 75%;
		text-align: left;
		display: grid;
		grid-template-columns: auto auto;
		gap: 0.5em 1em;
		width: fit-content;
		margin: -30px auto 0;
		@media screen and (min-width: 768px) { grid-template-columns: repeat(4, auto); }
		li::before {
			content: "■ ";
			color: #99cc66;
		}
	}
	h3 {
		font-size: 6.5vw;
		font-weight: 700;
		margin: 30px 0 10px;
		text-align: left;
		@media screen and (min-width: 768px) { font-size: 250%; }
	}
}
.lottekasai main .lesson figure, .lottekasai-lp main .lesson figure {
	overflow-x: auto;
	table {
		white-space: nowrap;
		@media screen and (min-width: 768px) { white-space: normal; }
		td {
			padding: 5px 10px;
			text-align: left;
			&:first-of-type::before {
				content: "■ ";
				color: #99cc66;
			}
		}
	}
}
.lottekasai main .lesson ul li.junior::before, .lottekasai-lp main .lesson ul li.junior::before, .lottekasai main .lesson figure table td.junior:first-of-type::before, .lottekasai-lp main .lesson figure table td.junior:first-of-type::before { color: #66ccba; }
.lottekasai main .lesson ul li.compe::before, .lottekasai-lp main .lesson ul li.compe::before, .lottekasai main .lesson figure table td.compe:first-of-type::before, .lottekasai-lp main .lesson figure table td.compe:first-of-type::before { color: #ff9966; }
.lottekasai main .lesson ul li.practice::before, .lottekasai-lp main .lesson ul li.practice::before, .lottekasai main .lesson figure table td.practice:first-of-type::before, .lottekasai-lp main .lesson figure table td.practice:first-of-type::before { color: #9999cc; }
.lottekasai main .lesson table tr:first-of-type, .lottekasai-lp main .lesson table tr:first-of-type {
	border-bottom: 2px solid rgb(0, 0, 0);
	color: #7bb23b;
	font-weight: 700;
	td:first-of-type::before { content: ""; }
}
.lottekasai-lp main .lesson p { margin-top: 60px; }
@media screen and (min-width: 768px) {
	.lottekasai main .lesson article:has(div), .lottekasai-lp main .lesson article:has(div) {
		display: flex;
		justify-content: center;
		gap: 60px;
		div {
			min-width: calc((100% - 120px) / 3);
			width: 80%;
		}
	}
}
.lottekasai main .access, .lottekasai-lp main .access, .metrogreen main .access, .metrogreen-lp main .access, .sunland main .access, .sunland-lp main .access {
	padding: 0;
	text-align: center;
	background-color: #ffffff;
	.map {
		background-color: #cccccc;
		position: relative;
		height: 300px;
		width: 100%;
		@media screen and (min-width: 768px) { height: 600px; }
		iframe {
			width: 100%;
			height: 100%;
		}
	}
	h2 {
		margin: 20px auto 10px;
		color: #4b9b1e;
		font-weight: 900;
		font-size: 6.5vw;
		line-height: 1;
		img { width: 300px; }
	}
	p {
		color: #333333;
		font-weight: 600;
		font-size: 87.5%;
		@media screen and (min-width: 768px) { font-size: 112.5%; }
	}
	.link {
		text-align: center;
		a {
			color: #333333;
			&::after { content: url(../img/common/ico-arrow-b.svg); }
		}
	}
}
.lottekasai-lp main .access, .metrogreen-lp main .access, .sunland-lp main .access {
	padding-bottom: 60px;
	@media screen and (min-width: 768px) { padding-bottom: 20px; }
}
.sunland-lp main section.access > h2 > img { width: 150px; }
.metrogreen main .facility, .metrogreen-lp main .facility, .sunland main .facility, .sunland-lp main .facility {
	text-align: center;
	h2, p {
		font-size: 6vw;
		font-weight: 900;
		line-height: 1.3;
		margin-bottom: 30px;
		@media screen and (min-width: 768px) { font-size: 187.5%; }
		strong {
			font-size: 150%;
			@media screen and (min-width: 768px) { font-size: 200%; }
		}
	}
	dl {
		border: 1px solid #ffffff;
		border-radius: 10px;
		@media screen and (min-width: 768px) {
			max-width: 640px;
			margin: 0 auto;
		}
		dt {
			background-color: #db124c;
			width: fit-content;
			padding: 5px 3em;
			margin: -20px auto 10px;
			font-size: 4vw;
			border-radius: 25px;
			@media screen and (min-width: 768px) {
				font-size: 187.5%;
				padding: 5px 5em;
			}
		}
		dd {
			padding: 0 20px 20px;
		        ul {
				display: grid;
				gap: 10px;
				grid-template-columns: 1fr 1fr;
				line-height: 1.3;
				li {
					color: #db124c;
					background-color: #ffffff;
					border-radius: 10px;
					padding: 20px 5px;
					font-size: 4vw;
					font-weight: 700;
					span { font-size: 75%; }
					@media screen and (min-width:768px) { font-size: 125%; }
				}
			}
		}
	}
}
.metrogreen main .facility, .metrogreen-lp main .facility { background: url(../img/lp/bg-metro.png) no-repeat center / cover; }
.sunland main .facility, .sunland-lp main .facility { background: url(../img/lp/bg-sunland.png) no-repeat center / cover; }
.metrogreen main .schedule div, .sunland-lp main .schedule div { height: auto; }
.sunland main .plan, .sunland-lp main .plan {
	background: rgb(150, 190, 0);
	article {
		@media screen and (min-width: 768px) {
			grid-template-columns: 1fr;
			width: 60%;
		}
	}
}
#cboxContent:has(.pro-detail) {
	background: transparent;
	color: #ffffff;
}
.metrogreen main .clinic, .metrogreen-lp main .clinic {
	color: #666666;
	margin: 0 auto;
	background-color: #ffffff;
	h2 {
		font-weight: 900;
		font-size: 7.5vw;
		margin-bottom: 40px;
		text-align: center;
		@media screen and (min-width: 768px) {
			font-size: 312.5%;
			margin-bottom: 60px;
		}
	}
	p.img {
		margin: 20px 0;
		@media screen and (min-width: 768px) {
			width: 80%;
			max-width: 600px;
			margin: 20px auto;
		}
		img { border-radius: 10px; }
	}
	ul {
		font-weight: 900;
		color: #4B9B1E;
		display: grid;
		gap: 10px;
		grid-template-columns: repeat(2, 1fr);
		line-height: 1.3;
		text-align: center;
		margin: 0 auto 20px;
		max-width: 800px;
		@media screen and (min-width: 768px) {
			font-size: 150%;
			grid-template-columns: repeat(3, 1fr);
		}
		li {
			background-color: #f7f7e4;
			padding: 1em;
			border-radius: 10px;
		}
	}
	p {
		font-size: 4vw;
		font-weight: 700;
		@media screen and (min-width: 768px) { font-size: 125%; }
	}
	table {
		margin: 20px auto 0;
		max-width: 600px;
		text-align: left;
	}
}

.lottekasai-lp, .metrogreen-lp{
	 > ul.float {
	 	grid-template-columns: repeat(2, 1fr);
	 	@media screen and (min-width: 768px) { grid-template-columns: 1fr; }
	 	li:last-child { display: none; }
	 }
}