@charset "utf-8";

/* -------------------------------------------------------------------------
	GUIDE
========================================================================= */
#guide {}
#guide section { text-align: center; }

#guide .pageTitle::before,
#guide .pageTitle::after {
	width: 30px;
	height: 30px;
	top: -2px;
	}
#guide .threeYearold .pageTitle::before,
#preschool .pageTitle::before {
	left: -45px;	
	background: url("../img/icon_fillflower.svg") no-repeat;
	}
#guide .threeYearold .pageTitle::after,
#preschool .pageTitle::after {
	right: -40px;	
	background: url("../img/icon_flower.svg") no-repeat;
	}
#afterclub .pageTitle::before {
	left: -45px;	
	background: url("../img/icon_star.svg") no-repeat;
	}
#afterclub .pageTitle::after {
	right: -35px;	
	background: url("../img/icon_triangles.svg") center no-repeat;
	}
#guide .pay .pageTitle::before {
	width: 28px;
	left: -55px;	
	background: url("../img/icon_squaredot.svg") no-repeat;
	}
#guide .pay .pageTitle::after {
	width: 30px;
	right: -50px;	
	background: url("../img/icon_circles.svg") center no-repeat;
	}
#guide .pageNavi {
	padding: 45px 0 45px;
	gap: 50px;
	text-align: center;
	}
#guide .pnSmall {
	display: flex;
	justify-content: center;
	font-size: var(--font-size-small);
	letter-spacing: 0;
	}

.fEmphasize {
	font-size: 2rem;
	line-height: 150%;
	}

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#guide .pageNavi { gap: 24px; }
}

	
/*  ---------------------------------------------------------*/
#guide .threeYearold { padding-top: 48px; }

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#guide .threeYearold { padding-top: 30px; }
}


/*  ---------------------------------------------------------*/
#guide .guideline { padding: 115px 0 80px; }

#guide .glText {
	padding-top: 40px;
	text-align: left;
	line-height: 190%;
	}
#guide .glList {
	width: 100%;
	margin-top: 40px;
	}
#guide .glList > tbody tr th {
	width: 13%;
	min-width: 80px;
	height: 40px;
	padding: 10px;
	background: var(--accent-color);
	color: #FFF;
	font-weight: 400;
	letter-spacing: 0.3rem;
	border-bottom: 1px solid #FFF;
	font-size: var(--font-size-med-large);
	}
#guide .glList > tbody tr:last-of-type th { border-bottom: 1px solid var(--accent-color); }
#guide .glList > tbody tr td {
	padding: 18px 0 18px 20px;
	border-bottom: 1px solid var(--accent-color);
	text-align: left;
	}
#guide .glList > tbody tr:first-of-type td,
#guide .glList > tbody tr:first-of-type th { border-top: 1px solid var(--accent-color); }

.listSimple {
	margin-left: 1.2em;
	text-indent: -1.2em;
	}
.timeWrapper {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 5px;
	}
.time { font-size: 2.5rem; }
.listKatakana { counter-reset: lk; }
.listKatakana > li {
	margin-left: 2em;
	counter-increment: lk;
	text-indent: -2em;
	}
.listKatakana > li::before { content: counter(lk, katakana)"）"; }


/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#guide .glText { padding-top: 20px; }
#guide .glList { margin-top: 30px; }
#guide .glList > tbody tr {
	display: flex;
	flex-direction: column;
	}
#guide .glList > tbody tr th,
#guide .glList > tbody tr td { width: 100%; }
#guide .glList > tbody tr th {
	height: auto;
	padding: 3px 0;
	border-bottom: none;
	letter-spacing: 0;
	}
#guide .glList > tbody tr td {
	padding: 10px 0 12px;
	border-bottom: none;
	}
#guide .glList > tbody tr:first-of-type td { border-top: 1px solid var(--accent-color); }
}


.money {
	vertical-align: text-bottom;
	font-size: 2.5rem;
	}
.noteList {
	margin-left: 1em;
	text-indent: -1em;
	line-height: 160%;
	}
.noteListSimple {
	margin-left: 1em;
	font-size: var(--font-size-small);
	text-indent: -1em;
	line-height: 160%;
	}


/*  ---------------------------------------------------------*/
#guide .pay { padding-top: 165px; }
#guide .pay .pageTitle { padding-bottom: 25px; }
#guide .pay :not(#guide .pageTitle,#guide .ptEng) { text-align: left; }
#guide .payMainWrapper {
	width: 100%;
	display: flex;
	text-align: left;
	gap: 100px;
	}

#guide .paySubTitle,
#guide .glPriorityList > dt {
	margin-bottom: 15px;
	color: var(--accent-color);
	font-size: 2rem;
	font-weight: 500;
	text-align: left;
	}
#guide .payWrapper {
	display: flex;
	gap: 40px;
	text-align: left;
	}
#guide .payBox { width: 100%; }
#guide .pw2column { width: 100%; }
#guide .pw2column > div { width: 50%; }
#guide .pw2column .paySubTitle { margin-bottom: 10px; }
#guide ul.payList li {
	padding: 10px 10px 10px 1em;
	text-indent: -1em;
	}
#guide ul.payList li:not(:last-of-type) {
	background: linear-gradient(to right, #B3B3B3 4px, transparent 1px) left bottom / 7px 1px repeat-x;
	}
#guide ul.payList li::before,
#guide .glPriorityList > dd li::before {
	content: "●";
	color: var(--accent-color);
	}
#guide ul.payList li > .noteListSimple { padding: 5px 0; }
#guide ul.payList li > .noteListSimple li {
	padding: 0;
	background: none;
	}
#guide ul.payList li > .noteListSimple li::before { content: none; }
.money {
	vertical-align: top;
	font-size: 2rem;
	}
.noteListSimple {
	margin-left: 1em;
	font-size: var(--font-size-small);
	text-indent: -1em;
	text-align: left;
	line-height: 160%;
	}
ol.noteListSimple {
	margin-left: 2.5em;
	text-indent: -2.5em;
	list-style-type: none;
	counter-reset: count 0;
	}
ol.noteListSimple li::before {
	content: "（" counter(count) "）";
	counter-increment: count 1;
	}
#guide .payExemption ul.payList li { padding: 0 10px 5px 1em!important; }
#guide .payNote {
	margin: 20px auto 65px;
	padding: 22px 26px;
	text-align: left;
	background: #E0EFEF;
	}
#guide .payNote > dl { padding-top: 22px; }
#guide .payNote > dl dt { font-size: var(--font-size-small); }

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#guide .pay { padding-top: 75px; }
#guide .pay .pageTitle { padding-bottom: 15px; }
#guide .payMainWrapper {
	flex-direction: column;
	gap: 30px;
	}
#guide .payWrapper {
	flex-direction: column;
	gap: 30px;
	text-align: left;
	}
#guide .payBox { max-width: 100%; }
#guide .pw2column > div { width: 100%; }
.money {
	vertical-align: text-bottom;
	}
#guide .payNote {
	width: 101%;
	margin: 20px auto 40px;
	padding: 22px 5%;
	margin-left: -5.5%;
	}
}


/*  ---------------------------------------------------------*/
#afterclub { padding-top: 100px; }
#afterclub .acText,
#preschool .psText {
	padding: 25px 0 1em;
	font-size: var(--font-size-large);
	font-weight: 500;
	line-height: 220%;
	}
#afterclub .note {}
.fxlarge {
	font-size: 2.5rem;
	font-weight: 400;
	vertical-align: text-bottom;
	}
#afterclub .fxsmall {
	font-size: var(--font-size-xsmall);
	vertical-align: text-top;
	}

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#afterclub { padding-top: 60px; }
#afterclub .pageTitle { line-height: 150%; }
#afterclub .pageTitle::before,
#afterclub .pageTitle::after { top: 8px; }
#afterclub .ptEng { line-height: 100%; }
#afterclub .acText,
#preschool .psText {
	padding-top: 25px;
	font-size: var(--font-size-medium);
	text-align: left;
	}
#afterclub .note { text-align: left; font-size: 0.9em; }
#afterclub .separator { display: none; }
}


/*  ---------------------------------------------------------*/
#preschool { padding: 140px 0 80px; }
#preschool .psText { padding-bottom: 3em; }
#guide .courseName {
	padding: 12px 30px;
	display: inline-block;
	border-radius: 50px;
	background: var(--accent-color);
	color: #FFF;
	font-size: 3rem;
	font-weight: 500;
	line-height: 110%;
	}
#preschool .maimai { padding-top: 100px; }

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#preschool { padding: 70px 0; }
#preschool .psText { padding-bottom: 2em; }
#guide .courseName {
	width: calc((37.2% / 33.5) * 100);
	margin-left: -5.5%;
	padding: 12px 0;
	display: block;
	border-radius: 0;
	text-align: center;
	font-size: 2.6rem;
	line-height: 120%;
	}
#preschool .maimai { padding-top: 40px; }

}


