@charset "UTF-8";
/* CSS Document */
/* classArea */
header {
	background-color: #dbf2fa;
}
.classArea {
	background-color: #dbf2fa;
}
.classArea .inner {
	padding: 20px;
}

/* ttlArea */
.classArea .inner .ttlArea {
	text-align: center;
	padding: 80px 0;
}
.classArea .inner .ttlArea h1 {
	font-size: 46px;
	font-weight: 900;
	position: relative;
	padding-bottom: 16px;
}
.classArea .inner .ttlArea h1:before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 50px;
	height: 10px;
	background-color: #33c3d0;
}

/* btnArea02 */
.classArea .inner .btnArea02 ul {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.classArea .inner .btnArea02 ul li {
	width: calc(33.33% - 20px);
}
.classArea .inner .btnArea02 ul li a {
	display: block;
	background-color: #3454a0;
	line-height: 1.2;
	padding: 20px 0;
	border-radius: 50px;
	border: 2px solid #3454a0;
	text-align: center;
}
.classArea .inner .btnArea02 ul li a span {
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	position: relative;
}
.classArea .inner .btnArea02 ul li a span:before {
	content: "▼";
	position: absolute;
	top: 2px;
	right: -26px;
}
.classArea .inner .btnArea02 ul li a:hover {
	background-color: #777;
}

/* desc */
.classArea .inner .desc01,
.classArea .inner .desc02 {
	padding: 120px 0 20px;
}
.classArea .inner .desc03 {
	padding: 120px 0 60px;
}

/* 共通 */
.classArea .inner .desc h2 {
	font-size: 26px;
	font-weight: 900;
	color: #3454a0;
	padding: 6px 0 7px 16px;
	border-left: 8px solid #3454a0;
	line-height: 1;
}
.classArea .inner .desc ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 30px;
}
.classArea .inner .desc ul li {
	width: calc(50% - 30px);
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	padding-bottom: 30px;
}
.classArea .inner .desc ul li .left {
	width: calc(36%);
}
.classArea .inner .desc ul li .left .img {
	background-repeat: no-repeat;
	background-position: center center;
	aspect-ratio: 3/2;
	background-size: contain;
}
.classArea .inner .desc ul li .right {
	width: calc(64%);
	margin-left: 16px;
}
.classArea .inner .desc ul li .right .city {
	font-size: 16px;
	line-height: 1;
	font-weight: 700;
	display: inline-block;
	padding: 8px 20px;
	background-color: #fff;
	border: 1px solid #33c3d0;
	color: #33c3d0;
	border-radius: 50px;
	margin-bottom: 10px;
}
.classArea .inner .desc ul li .right h3 {
	font-size: 18px;
	font-weight: 700;
}
.classArea .inner .desc ul li .right p {
	padding-top: 10px;
	line-height: 1.2;
}

/* desc01 */
.classArea .inner .desc01 ul li .left .o_img01 {
	background-image: url("../img/class/o_img01.jpg");
}
.classArea .inner .desc01 ul li .left .o_img02 {
	background-image: url("../img/class/o_img02.jpg");
}
.classArea .inner .desc01 ul li .left .o_img03 {
	background-image: url("../img/class/o_img03.jpg");
}
.classArea .inner .desc01 ul li .left .o_img04 {
	background-image: url("../img/class/o_img04.jpg");
}
.classArea .inner .desc01 ul li .left .o_img05 {
	background-image: url("../img/class/o_img05.jpg");
}
.classArea .inner .desc01 ul li .left .o_img06 {
	background-image: url("../img/class/o_img06.jpg");
}
.classArea .inner .desc01 ul li .left .o_img07 {
	background-image: url("../img/class/o_img07.jpg");
}
.classArea .inner .desc01 ul li .left .o_img08 {
	background-image: url("../img/class/o_img08.jpg");
}
.classArea .inner .desc01 ul li .left .o_img09 {
	background-image: url("../img/class/o_img09.jpg");
}
.classArea .inner .desc01 ul li .left .o_img10 {
	background-image: url("../img/class/o_img10.jpg");
}
.classArea .inner .desc01 ul li .left .o_img11 {
	background-image: url("../img/class/o_img11.jpg");
}
.classArea .inner .desc01 ul li .left .o_img12 {
	background-image: url("../img/class/o_img12.jpg");
}
.classArea .inner .desc01 ul li .left .o_img13 {
	background-image: url("../img/class/o_img13.jpg");
}
.classArea .inner .desc01 ul li .left .o_img14 {
	background-image: url("../img/class/o_img14.jpg");
}
.classArea .inner .desc01 ul li .left .o_img15 {
	background-image: url("../img/class/o_img15.jpg");
}
.classArea .inner .desc01 ul li .left .o_img16 {
	background-image: url("../img/class/o_img16.jpg");
}
.classArea .inner .desc01 ul li .left .o_img17 {
	background-image: url("../img/class/o_img17.jpg");
}
.classArea .inner .desc01 ul li .left .o_img18 {
	background-image: url("../img/class/o_img18.jpg");
}
.classArea .inner .desc01 ul li .left .o_img19 {
	background-image: url("../img/class/o_img19.jpg");
}
.classArea .inner .desc01 ul li .left .o_img20 {
	background-image: url("../img/class/o_img20.jpg");
}
.classArea .inner .desc01 ul li .left .o_img21 {
	background-image: url("../img/class/o_img21.jpg");
}
.classArea .inner .desc01 ul li .left .o_img22 {
	background-image: url("../img/class/o_img22.jpg");
}
.classArea .inner .desc01 ul li .left .o_img23 {
	background-image: url("../img/class/o_img23.jpg");
}
.classArea .inner .desc01 ul li .left .o_img24 {
	background-image: url("../img/class/o_img24.jpg");
}
.classArea .inner .desc01 ul li .left .o_img25 {
	background-image: url("../img/class/o_img25.jpg");
}
.classArea .inner .desc01 ul li .left .o_img26 {
	background-image: url("../img/class/o_img26.jpg");
}
.classArea .inner .desc01 ul li .left .o_img27 {
	background-image: url("../img/class/o_img27.jpg");
}
.classArea .inner .desc01 ul li .left .o_img28 {
	background-image: url("../img/class/o_img28.jpg");
}
.classArea .inner .desc01 ul li .left .o_img29 {
	background-image: url("../img/class/o_img29.jpg");
}
.classArea .inner .desc01 ul li .left .o_img30 {
	background-image: url("../img/class/o_img30.jpg");
}
.classArea .inner .desc01 ul li .left .o_img31 {
	background-image: url("../img/class/o_img31.jpg");
}
.classArea .inner .desc01 ul li .left .o_img32 {
	background-image: url("../img/class/o_img32.jpg");
}
.classArea .inner .desc01 ul li .left .o_img33 {
	background-image: url("../img/class/o_img33.jpg");
}
.classArea .inner .desc01 ul li .left .o_img34 {
	background-image: url("../img/class/o_img34.jpg");
}
.classArea .inner .desc01 ul li .left .o_img35 {
	background-image: url("../img/class/o_img35.jpg");
}
.classArea .inner .desc01 ul li .left .o_img36 {
	background-image: url("../img/class/o_img36.jpg");
}
.classArea .inner .desc01 ul li .left .o_img37 {
	background-image: url("../img/class/o_img37.jpg");
}
.classArea .inner .desc01 ul li .left .o_img38 {
	background-image: url("../img/class/o_img38.jpg");
}
.classArea .inner .desc01 ul li .left .o_img39 {
	background-image: url("../img/class/o_img39.jpg");
}
.classArea .inner .desc01 ul li .left .o_img40 {
	background-image: url("../img/class/o_img40.jpg");
}
.classArea .inner .desc01 ul li .left .o_img41 {
	background-image: url("../img/class/o_img41.jpg");
}
.classArea .inner .desc01 ul li .left .o_img42 {
	background-image: url("../img/class/o_img42.jpg");
}
.classArea .inner .desc01 ul li .left .o_img43 {
	background-image: url("../img/class/o_img43.jpg");
}
.classArea .inner .desc01 ul li .left .o_img44 {
	background-image: url("../img/class/o_img44.jpg");
}
.classArea .inner .desc01 ul li .left .o_img45 {
	background-image: url("../img/class/o_img45.jpg");
}
.classArea .inner .desc01 ul li .left .o_img46 {
	background-image: url("../img/class/o_img46.jpg");
}
.classArea .inner .desc01 ul li .left .o_img47 {
	background-image: url("../img/class/o_img47.jpg");
}
.classArea .inner .desc01 ul li .left .o_img48 {
	background-image: url("../img/class/o_img48.jpg");
}
.classArea .inner .desc01 ul li .left .o_img49 {
	background-image: url("../img/class/o_img49.jpg");
}
.classArea .inner .desc01 ul li .left .o_img50 {
	background-image: url("../img/class/o_img50.jpg");
}
.classArea .inner .desc01 ul li .left .o_img51 {
	background-image: url("../img/class/o_img51.jpg");
}
.classArea .inner .desc01 ul li .left .o_img52 {
	background-image: url("../img/class/o_img52.jpg");
}
.classArea .inner .desc01 ul li .left .o_img53 {
	background-image: url("../img/class/o_img53.jpg");
}
.classArea .inner .desc01 ul li .left .o_img54 {
	background-image: url("../img/class/o_img54.jpg");
}
.classArea .inner .desc01 ul li .left .o_img55 {
	background-image: url("../img/class/o_img55.jpg");
}
.classArea .inner .desc01 ul li .left .o_img56 {
	background-image: url("../img/class/o_img56.jpg");
}
.classArea .inner .desc01 ul li .left .o_img57 {
	background-image: url("../img/class/o_img57.jpg");
}
.classArea .inner .desc01 ul li .left .o_img58 {
	background-image: url("../img/class/o_img58.jpg");
}
.classArea .inner .desc01 ul li .left .o_img59 {
	background-image: url("../img/class/o_img59.jpg");
}
.classArea .inner .desc01 ul li .left .o_img60 {
	background-image: url("../img/class/o_img60.jpg");
}
.classArea .inner .desc01 ul li .left .o_img61 {
	background-image: url("../img/class/o_img61.jpg");
}
.classArea .inner .desc01 ul li .left .o_img62 {
	background-image: url("../img/class/o_img62.jpg");
}
.classArea .inner .desc01 ul li .left .o_img63 {
	background-image: url("../img/class/o_img63.jpg");
}
.classArea .inner .desc01 ul li .left .o_img64 {
	background-image: url("../img/class/o_img64.jpg");
}
.classArea .inner .desc01 ul li .left .o_img65 {
	background-image: url("../img/class/o_img65.jpg");
}
.classArea .inner .desc01 ul li .left .o_img66 {
	background-image: url("../img/class/o_img66.jpg");
}
.classArea .inner .desc01 ul li .left .o_img67 {
	background-image: url("../img/class/o_img67.jpg");
}
.classArea .inner .desc01 ul li .left .o_img68 {
	background-image: url("../img/class/o_img68.jpg");
}
.classArea .inner .desc01 ul li .left .o_img69 {
	background-image: url("../img/class/o_img69.jpg");
}
.classArea .inner .desc01 ul li .left .o_img70 {
	background-image: url("../img/class/o_img70.jpg");
}
.classArea .inner .desc01 ul li .left .o_img71 {
	background-image: url("../img/class/o_img71.jpg");
}
.classArea .inner .desc01 ul li .left .o_img72 {
	background-image: url("../img/class/o_img72.jpg");
}
.classArea .inner .desc01 ul li .left .o_img73 {
	background-image: url("../img/class/o_img73.jpg");
}
.classArea .inner .desc01 ul li .left .o_img74 {
	background-image: url("../img/class/o_img74.jpg");
}
.classArea .inner .desc01 ul li .left .o_img75 {
	background-image: url("../img/class/o_img75.jpg");
}
.classArea .inner .desc01 ul li .left .o_img76 {
	background-image: url("../img/class/o_img76.jpg");
}
.classArea .inner .desc01 ul li .left .o_img77 {
	background-image: url("../img/class/o_img77.jpg");
}
.classArea .inner .desc01 ul li .left .o_img78 {
	background-image: url("../img/class/o_img78.jpg");
}

/* desc02 */
.classArea .inner .desc02 ul li .left .h_img01 {
	background-image: url("../img/class/h_img01.jpg");
}
.classArea .inner .desc02 ul li .left .h_img02 {
	background-image: url("../img/class/h_img02.jpg");
}
.classArea .inner .desc02 ul li .left .h_img03 {
	background-image: url("../img/class/h_img03.jpg");
}
.classArea .inner .desc02 ul li .left .h_img04 {
	background-image: url("../img/class/h_img04.jpg");
}
.classArea .inner .desc02 ul li .left .h_img05 {
	background-image: url("../img/class/h_img05.jpg");
}
.classArea .inner .desc02 ul li .left .h_img06 {
	background-image: url("../img/class/h_img06.jpg");
}
.classArea .inner .desc02 ul li .left .h_img07 {
	background-image: url("../img/class/h_img07.jpg");
}
.classArea .inner .desc02 ul li .left .h_img08 {
	background-image: url("../img/class/h_img08.jpg");
}
.classArea .inner .desc02 ul li .left .h_img09 {
	background-image: url("../img/class/h_img09.jpg");
}
.classArea .inner .desc02 ul li .left .h_img10 {
	background-image: url("../img/class/h_img10.jpg");
}
.classArea .inner .desc02 ul li .left .h_img11 {
	background-image: url("../img/class/h_img11.jpg");
}
.classArea .inner .desc02 ul li .left .h_img12 {
	background-image: url("../img/class/h_img12.jpg");
}
.classArea .inner .desc02 ul li .left .h_img13 {
	background-image: url("../img/class/h_img13.jpg");
}
.classArea .inner .desc02 ul li .left .h_img14 {
	background-image: url("../img/class/h_img14.jpg");
}

/* desc03 */
.classArea .inner .desc03 ul li .left .n_img01 {
	background-image: url("../img/class/n_img01.jpg");
}
.classArea .inner .desc03 ul li .left .n_img02 {
	background-image: url("../img/class/n_img02.jpg");
}
.classArea .inner .desc03 ul li .left .n_img03 {
	background-image: url("../img/class/n_img03.jpg");
}
.classArea .inner .desc03 ul li .left .s_img01 {
	background-image: url("../img/class/s_img01.jpg");
}
.classArea .inner .desc03 ul li .left .s_img02 {
	background-image: url("../img/class/s_img02.jpg");
}
.classArea .inner .desc03 ul li .left .s_img03 {
	background-image: url("../img/class/s_img03.jpg");
}
.classArea .inner .desc03 ul li .left .s_img04 {
	background-image: url("../img/class/s_img04.jpg");
}


/* btnArea */
.classArea .inner .btnArea {
	padding: 80px 0 120px;
}

@media screen and (max-width: 1000px) {
/* classArea */
	.classArea .inner {
		padding: 0 6vw;
	}
	
/* ttlArea */
	.classArea .inner .ttlArea {
		padding: 60px 0;
	}
	.classArea .inner .ttlArea h1 {
		font-size: 34px;
		padding-bottom: 10px;
	}
	.classArea .inner .ttlArea h1:before {
		height: 6px;
	}
	
/* btnArea02 */
	.classArea .inner .btnArea02 ul li {
		width: calc(33.33% - 6px);
	}
	.classArea .inner .btnArea02 ul li a span {
		font-size: 15px;
	}	
	
/* desc */
	.classArea .inner .desc01,
	.classArea .inner .desc02 {
		padding: 60px 0 20px;
	}	
	.classArea .inner .desc03 {
		padding: 60px 0 30px;
	}
	.classArea .inner .desc h2 {
		font-size: 22px;
		padding: 4px 0 7px 12px;
	}	
	.classArea .inner .desc ul li {
		width: calc(50% - 10px);
	}	
	.classArea .inner .desc ul li .right .city {
		font-size: 14px;
		padding: 6px 16px;
	}
	.classArea .inner .desc ul li .right h3 {
		font-size: 16px;
	}
	
/* btnArea */
	.classArea .inner .btnArea {
		padding: 40px 0 80px;
	}	
}	

@media screen and (max-width: 767px) {
/* ttlArea */
	.classArea .inner .ttlArea h1 {
		font-size: 30px;
	}	
	
/* btnArea02 */
	.classArea .inner .btnArea02 ul {
		display: block;
	}
	.classArea .inner .btnArea02 ul li {
		width: 100%;
		margin-bottom: 10px;
	}
	
/* desc */
	.classArea .inner .desc ul {
		display: block;
	}
	.classArea .inner .desc ul li {
		width: 100%;
	}
}	

@media screen and (max-width: 600px) {
/* ttlArea */
	.classArea .inner .ttlArea {
		padding: 30px 0 40px;
	}	
	.classArea .inner .ttlArea h1 {
		font-size: 26px;
	}
	
/* desc */
	.classArea .inner .desc01 {
		padding: 50px 0 10px;
	}	
	.classArea .inner .desc02,
	.classArea .inner .desc03 {
		padding: 20px 0 10px;
	}	
	.classArea .inner .desc h2 {
		font-size: 20px;
	}
	.classArea .inner .desc ul {
		padding-top: 26px;
	}
	.classArea .inner .desc ul li {
		display: block;
		padding-bottom: 36px;
	}
	.classArea .inner .desc ul li .left {
		width: 100%;
	}
	.classArea .inner .desc ul li .right {
		width: 100%;
		padding-bottom: 16px;
		margin-left: 0;
	}
	.classArea .inner .desc ul li .right .city {
		margin-bottom: 6px;
	}	
	.classArea .inner .desc ul li .right p {
		padding-top: 6px;
	}
	
/* btnArea */
	.classArea .inner .btnArea {
		padding: 10px 0 60px;
	}	
}