@CHARSET "UTF-8";

/* -------------------------------------- */
/* ページタイトル/コンテナ (cttl01-box) */
/* -------------------------------------- */
.cttl01-box{
	width:90%;
	margin:0 auto;
	position:relative;
}
.cttl01-box.first{
	margin-top:70px;
}
.cttl01-box > div{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	align-items:center;
	width:100%;
	margin:2.0em auto 0;
	padding:0.5em;
	border-radius:20px 20px 0 0;
	color:#fff;
}
.cttl01{
	font-size:1.3em;
}

/* -------------------------------------- */
/* 講座セクション (sbb01) */
/* -------------------------------------- */
.sbb01{
	margin-top:0;
	padding:2.5em 0 1.5em;
}
.sbb01 img{
	border-radius:10px;
}
.sbb01 > article{
	width:95%;
	margin:0 auto;
	position:relative;
}
.sbb01 > article > span{
	position:absolute;
	left:0;
	top:-3.0em;
	color:#fff;
	border-radius:40px;
	padding:0.3em 1.0em;
	font-size:1.3em;
}
.sbb01 > article > div{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	align-items:center;
	width:100%;
	margin:0 auto 2.0em;
	padding:1.0em;
	background-color:#fff;
	border-radius:20px;
}
.sbb01 > article > div > div:nth-child(1), .sbb01 > article > div > div:nth-child(2){
	padding:1.0em 0.5em;
	width:100%;
}
.sbb01 > article > div > div:nth-child(2) > table{
	width:100%;
	border-collapse:separate;
	border-spacing:5px;
}
.sbb01 > article > div > div:nth-child(2) > table th{
	color:#fff;
	width:20%;
	text-align:center;
	vertical-align:middle;
	padding:0.2em 0;
}
.sbb01 > article > div > div:nth-child(2) > table td{
	vertical-align:middle;
	font-weight:300;
	width:80%;
	font-size:0.8em;
}

/* -------------------------------------- */
/* 講座の説明部分 (sbb01-box / sbb01-txt) */
/* -------------------------------------- */
.sbb01-box{
	width:95%;
	margin:0 auto;
}
.sbb01-txt{
	width:95%;
	margin:0.5em auto;
	font-weight:300;
}

/* -------------------------------------- */
/* 背景色/ヘッダー色 (講座ごと) */
/* -------------------------------------- */
/* 注意:jbg01/jbg02は重複定義があったため、最後の定義を優先します */
.ebg01{
	background-color:#FFE1BE;
}
.ebg02{
	background-color:#FC8328;
}
.jbg01{
	background-color:#CCE7EC;
}
.jbg02{
	background-color:#2A9BE6;
}
.hbg01{
	background-color:#C2E8CB;
}
.hbg02{
	background-color:#019F5E;
}

/* -------------------------------------- */
/* 見出しスタイル (smkttl01, smkttl02, smkttl03) */
/* -------------------------------------- */
/* smkttl01は青(#2A9BE6) */
.smkttl01{
	font-weight:bold;
	font-size:1.2em;
	margin:1.0em 0;
	text-align:center;
	background-color:#2A9BE6;
	padding:0.5em;
	border-radius:15px 15px 0 0;
}
.smkttl01 span, .hi-smkttl01 span{
	color:#fff;
}

/* smkttl02はオレンジ(#FC8328) */
.smkttl02{
	font-weight:bold;
	font-size:1.2em;
	margin:1.0em 0;
	text-align:center;
	background-color:#FC8328;
	padding:0.5em;
	border-radius:15px 15px 0 0;
}
.smkttl02 span, .hi-smkttl02 span{
	color:#fff;
}

/* smkttl03は緑(#019F5E) */
.smkttl03{
	font-weight:bold;
	font-size:1.2em;
	margin:1.0em 0;
	text-align:center;
	background-color:#019F5E;
	padding:0.5em;
	border-radius:15px 15px 0 0;
}
.smkttl03 span, .hi-smkttl03 span{
	color:#fff;
}

.smk02ttl03{
	font-size:1.3em;
	margin:1.0em 0 0.3em 0;
}
.smk02ttl03.el{color:#FC8328;}
.smk02ttl03.ju{color:#2A9BE6;}
.smk02ttl03.hi{color:#019F5E;}

/* -------------------------------------- */
/* テーブルスタイル (tbl01) */
/* -------------------------------------- */
.tbl01{
	width:100%;
	border-spacing:0;
	margin:0 auto 15px;
	font-size:0.8em;
}
.tbl01 th{
	border:1px solid #444;
	padding:0.5em 0.2em;
	vertical-align:middle;
	color:#fff;
}
.tbl01 td{
	border:1px solid #444;
	padding:0.5em 0.6em;
	background-color:#fff;
	vertical-align:middle;
}
.tbl01 th.tx_c, .tbl01 td.tx_c{
	text-align:center;
}
.tbl01 th.fw-n, .tbl01 td.fw-n{
	font-weight:normal;
}
.tbl01 th.fw-b, .tbl01 td.fw-b{
	font-weight:bold;
}
.tbl01 span{
	color:#4FB878;
}
.tbl01 .nowrap{
	white-space:nowrap; /* text-wrap:nowrap は非標準なため、nowrap を使用 */
}
.sp{
	display:block;
}

/* -------------------------------------- */
/* その他パーツ・非表示要素 */
/* -------------------------------------- */
.linkbtn01{
	display:block;
	margin:10px auto 0;
	text-align:center;
	color:#fff;
	border-radius:20px;
	width:90%;
	padding:0.3em;
}
#elem, #junior, #high{
	display:block;
	position:relative;
	top:-120px;
	visibility:hidden;
}
.end0805b{
	position:absolute;
	top:0;
	left:2.5%;
	width:95%;
	height:100%;
	background-color:white;
	opacity:0.6;
	z-index:1;
	border-radius:20px;
}
.end0805s{
	position:absolute;
	z-index:2;
	color:#fff;
	padding:1.0em 3.0em;
	border-radius:20px;
	font-size:1.3em;
	text-align:center;
}

/* -------------------------------------- */
/* 連絡先 (contact_box) */
/* -------------------------------------- */
.contact_btnbox{
	text-align:center;
}
.contact_box{
	text-align:center;
	display:inline-block;
	margin:1.0em;
	vertical-align:top;
}
.contact_box p{
	color:#009944;
}
.contact_box a, .contact_box span{
	background-color:#87C15C;
	display:inline-block;
	color:#FFFFFF;
	border-radius:9999px;
	padding:0.8em 0.3em;
	min-width:280px;
}
.contact_box p.close{
	color:#999999;
}
.contact_box span{
	background-color:#999999;
}
.contact_txt{
	margin-bottom:10px;
	color:#009944;
}


/* ====================================== */
/* PC (Media Queries) */
/* ====================================== */

/* 769px以上 */
@media only screen and (min-width:769px){
	/* ページタイトル/コンテナ */
	.cttl01-box > div{
		width:95%;
	}
	/* 講座セクション */
	.sbb01 > article > div{
		width:95%;
	}
	.sbb01 > article > div > div:nth-child(1){
		width:40%;
	}
	.sbb01 > article > div > div:nth-child(2){
		width:60%;
	}
	.sbb01 > article > div > div:nth-child(2) > table th{
		width:15%;
	}
	.sbb01 > article > div > div:nth-child(2) > table td{
		font-size:1.0em;
	}
	/* 連絡先 */
	.contact_box{
		margin:0;
	}
}

/* 900px以上 */
@media only screen and (min-width:900px){
	/* 講座の説明部分 見出し */
	.sbb01-box{
		width:95%;
	}
	.smkttl01, .smkttl02, .smkttl03{
		font-size:1.3em;
		text-align:left;
		background-color:initial;
		padding:initial;
	}
	/* smkttl01 (青) */
	.smkttl01{
		border-bottom:8px solid #2A9BE6;
	}
	.smkttl01 span{
		padding:10px 40px 0;
		background-color:#2A9BE6;
		border-radius:15px 15px 0 0;
		min-width:200px;
		display:inline-block;
		text-align:center;
	}
	/* smkttl02 (オレンジ) */
	.smkttl02{
		border-bottom:8px solid #FC8328;
	}
	.smkttl02 span{
		padding:10px 40px 0;
		background-color:#FC8328;
		border-radius:15px 15px 0 0;
		min-width:200px;
		display:inline-block;
		text-align:center;
	}
	/* smkttl03 (緑) */
	.smkttl03{
		border-bottom:8px solid #019F5E;
	}
	.smkttl03 span{
		padding:10px 40px 0;
		background-color:#019F5E;
		border-radius:15px 15px 0 0;
		min-width:200px;
		display:inline-block;
		text-align:center;
	}

	/* テーブルスタイル */
	.tbl01{
		width:100%;
		border-spacing:0;
		font-size:initial;
		margin:0 auto 20px;
	}
	.sp{
		display:none;
	}
}

/* 1000px以上 */
@media only screen and (min-width:1000px){
	/* ページタイトル/コンテナ */
	.cttl01-box{
		margin:8.0em auto 0;
		width:1000px;
	}
	.cttl01-box.first{
		margin-top:110px;
	}
	.cttl01{
		font-size:1.5em;
	}
	/* 講座セクション */
	.sbb01 > article{
		width:1000px;
	}
}