@charset "utf-8";
/*
Theme Name: aceone-kobetsu
Author: YES-REFORM CO., LTD.
*/

/* Body
========================================== */
html, body{
	width: 100%;
	font-size:62.5%;/*10px*/
}
body {
	color:var(--txt-color);
	line-height:1.8;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: 1.6rem;
	/*font-weight: 400;*/
	font-weight: 500;
	font-style: normal;
	font-optical-sizing: auto;
	letter-spacing: 0.02em;
}
@media screen and (max-width: 840px) {
	body{
		word-wrap:break-word;
		font-size: 1.6rem;}
}

/* header
========================================== */
.headerArea{
	z-index: 1000;
	position: fixed;
	top:0;
	left: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 80px;
	background: rgba(255, 255, 255, 0.8);
	/* animation: scrollAnime linear;
	animation-timeline: scroll(); */
}
/* @keyframes scrollAnime {
	0% {
		background: none;
	}
	5% {
		background: rgba(255, 255, 255, 0.8);
	}
	100% {
		background: rgba(255, 255, 255, 0.8);
	}
} */

.headerLogo{margin-left: 20px;}
.headerLogo img{max-width: 100%;height: auto;}

.headerArea .inner{
	display: flex;
	justify-content:flex-end;
	align-items: center;
	padding-right: 8em;
}
.gnav{padding-right: 2em;}
.gnav ul{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	list-style: none;}
.gnav ul li{
	margin: 0 1em;}
.gnav ul li a{
	line-height: 1.2;
	display: block;
	color: var(--txt-color);
	font-size: clamp(1.4rem, 1.6vw, 1.6rem);
	font-weight: 700;
	text-decoration: none;
	text-align: center;
	transition: 0.3s;
}
.gnav > ul > li > a{
	padding: 0.5em 0;
}
.gnav ul li a span {
	position: relative;
	display: inline-block;
	text-decoration: none;
}
.gnav ul li a span::after {
	position: absolute;
	bottom: -10px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background: var(--sub-color);
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
}
.gnav ul li a:hover span::after,
.gnav ul li.current a span::after{
	transform: scale(1, 1);
}
.gnav ul li a.non-bd:hover span::after{
	content: none;
}
.gnav .submenu {
	position: relative;
}
.gnav .submenu  a:hover span::after{
	background: none;
}
.gnav .submenu span{
	color: var(--txt-color);
	font-size: clamp(1.4rem, 1.6vw, 1.6rem);
	font-weight: 700;
}
.gnav .submenu > span{
	display: block;
	padding: 1em 0;
}
.gnav .submenu:hover .submenuBox {
	z-index: 1;
	visibility: visible;
	opacity: 1;
	transition: 0.5s;
}
.gnav .submenuBox {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 8px 0 12px;
	width: 8.5em;
	position: absolute;
	top: 100%;
	left: 50%;
	z-index: 0;
	visibility: hidden;
	transform: translateX(-50%);
	background-color: rgb(0 188 212 / 80%);
	border-radius: 10px;
}
.gnav .submenu-large > .submenuBox {
	width: 12.5em;
}
.gnav .submenuBox01{
	background-color: rgb(245 128 3 / 80%);
}
.gnav .submenuBox li {
	position: relative;
	display: flex;
	align-items: center;
	height: 40px;
	margin-bottom: 5px;
	border-right: none;
	border-bottom: 1px solid #fff;
}
.submenuBox li:hover {
	opacity: 0.8;
}
.gnav .submenuBox li a{
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	color: transparent;
}
.gnav .submenuBox li span{
	color: #fff;
}
.gnav .submenuBox li span::after {
	position: absolute;
	bottom: -3px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background: var(--sub-color);
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
}
.gnav ul li ul.submenuBox01 span::after {
	background: var(--main-color);
}
.gnav .submenuBox li:hover span::after{
	transform: scale(1, 1);
}
.spBtn{display: none}
.drawerMenu{display: none;}

@media screen and (max-width:1280px){
	.gnav ul li{margin: 0 0.6em;}
	/* .gnav ul li a{font-size: 1.4rem;} */
}
@media screen and (max-width:1200px){
	.headerArea .inner {padding-right: 0;}
	.gnav {padding-right:1em;}
	.headerInfo .address{font-size: 1.2rem;}
}
@media screen and (max-width:1124px){
	.headerInfo .address{display: none;}
	.headerInfo .tel {display: block;width: 7em;}
	.headerInfo .tel .number{
		display: block;
		font-size:1.8rem;}
	.headerInfo .tel .hours{display: block;}
	/* .gnav ul li a{font-size: 1.3rem;} */
}
@media screen and (max-width:840px){
	.headerArea{position: absolute;background: none;border: none;height: 50px;}
	.headerLogo{
		margin-left: 10px;
		width: 60%;
		max-width: 190px;
		filter: drop-shadow(1px 1px 0 #fff);
	}
	.headerLogo img{width: 100%;}
	.headerInfo,
	.gnav{display: none;}
	.drawerMenu{}
	.drawerMenu{
		display: block;
		overflow-y: scroll;
		position: fixed;
		top: 0;
		right: -80%;
		padding:70px 20px 60px;
		width: 80%;
		height: 100%;
		background-color:#fff;
		border-left: 1px solid var(--border-color);
		transition: 0.5s;
	}
	.drawerMenu.open{right: 0;}

	.drawerMenu::-webkit-scrollbar{width: 10px;}
	.drawerMenu::-webkit-scrollbar-track{background: #fff;}
	.drawerMenu::-webkit-scrollbar-thumb {background: #fff;}
	.gnavSp{
		margin-bottom: 40px;
		padding:1em 10px;
		border-top: 1px solid var(--main-color);
		border-bottom: 1px solid var(--main-color)}

	.gnavSp li{}
	.gnavSp li a{
		display: block;
		position: relative;
		padding: 0.4em 1em;
		color: var(--txt-color);
		font-optical-sizing: auto;
		font-size: 1.5rem;
		font-weight: 600;
		text-decoration: none;
		text-align: center;
		line-height: 1.4;
	}
	.gnavSp li a:hover{text-decoration: underline;}
	.gnavSp-item.non-link{
		margin: 1.5em 0;
	}
	/* .gnavSp-item.non-link > a{
		width: fit-content;
		margin: 0 auto 0.5em;
		padding: 0.1em 2em;
		background-color: var(--sub-color);
		color: #fff;
		border-radius: 3em;
	} */
	.gnavSp-item.non-link > span{
		display: block;
		width: fit-content;
		margin: 0 auto 0.5em;
		padding: 0 2em;
		background-color: var(--sub-color);
		color: #fff;
		border-radius: 3em;
	}
	/* .gnavSp-item.non-link.toContact > a{
		background-color: var(--main-color);
	} */
	.gnavSp-item.non-link.toContact > span{
		background-color: var(--main-color);
	}
	.gnavSp li .gnavSp-secondaryItem a {
		font-size: 0.9em;
	}
	.gnavSp-secondaryItem a > span {
		position: relative;
		display: inline-block;
	}
	.gnavSp-secondaryItem a > span::before {
		content: "";
		display: inline-block;
		width: 1em;
		height: 1px;
		position: absolute;
		top: 50%;
		right: calc(100% + 0.5em);
		background-color: var(--txt-color);
		transform: translateY(-50%);
	}
	.spHeaderLogo{margin-bottom: 20px;text-align: center;}
	.spHeaderLogo img{
		width: 140px;height: auto;
	}
	.spAddress{
		margin-bottom: 10px;
		line-height: 1.2;
		font-size: 1.4rem;
		text-align: center;}
	.spTel{text-align: center;color: var(--txt-color);font-size: 1.4rem;}
	.spTel a{
		display: block;
		position: relative;
		font-weight: bold;
		font-size: 2.4rem;
		text-decoration: none;
		color:var(--main-color)
	}
	.spTel a > span {
		display: inline-block;
		position: relative;
	}
	.spTel a > span::before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0.6em;
    right: calc(100% + 0.2em);
    width: 0.8em;
    height: 0.8em;
    background-image: url(./images/classroom_tel_icon.png);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
	}
	.spBtn{
		position:fixed;
		top: 0;
		right: 0;
		display: inline-block;
		width: 50px;
		height:50px;
		padding: 20px 13px 15px;
		background-color: var(--main-color);
		cursor: pointer;
		z-index: 2000;
	}
	.spBtn::after{
		position: absolute;
		left: 0;
		top: 3px;
		content: "MENU";
		text-align: center;
		width: 50px;
		font-size: 8px;
		color: #fff;
	}
	.spBtn.open::after{content: "CLOSE";}

	.spBtn div {position: relative;}
	.spBtn span {
		display: block;
		position: absolute;
		height: 2px;
		width: 100%;
		background:#fff;
		left: 0;
		-webkit-transition: .3s ease-in-out;
		-moz-transition: .3s ease-in-out;
		transition: .3s ease-in-out;
	}
	.spBtn span:nth-child(1) {top: 0;}
	.spBtn span:nth-child(2) {top: 8px;}
	.spBtn span:nth-child(3) {top: 16px;}
	.spBtn.open span:nth-child(1) {
		top: 8px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.spBtn.open span:nth-child(2) {
		width: 0;
		left: 50%;
	}
	.spBtn.open span:nth-child(3) {
		top: 8px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
}


/* mv
========================================== */
.mvWrap{
	position: relative;
	padding-top: 80px;
	overflow: hidden;
}
.mvSlider img{width: 100%;height: auto;}
.mvWrap .swiper-slide img {
	width: 100%;
	height: 100%;
	aspect-ratio: 1600/760;
	object-fit: cover;
}
.mvWrap .swiper-pagination{
	left: 50%!important;
	transform: translate(-50%, -50%);
}
.mvWrap .swiper-pagination-bullet {
	width: min(7vw, 5em);
	height: 0.5em;
	margin: 0 min(1.5vw, 0.8em)!important;
	background-color: var(--point-color);
	border-radius: 0;
	opacity: 1;
}
.mvWrap .swiper-pagination-bullet-active {
	background-color: var(--sub-color);
}
.mvWrap .mvInner{
	z-index: 10;
	position: absolute;
	left: 5%;
	bottom: 5%;
	margin: 0 auto;
}
.mvWrap .mvInner .mvText p{
	width: fit-content;
	margin-top: 0.3em;
	color: #fff;
	background-color: var(--sub-color);
	font-size: clamp(2.8rem, 4vw, 4rem);
	font-weight: 700;
	line-height: 1.5;
}
.mvWrap .mvInner .mvText .txt p:first-child {
	padding-right: 0.5em;
}
.mvWrap .mvInner .mvText .txt p:nth-child(2) {
	padding-left: 0.5em;
}
.mvWrap .mvInner .mvText p.sub{
	margin-top: 0.5em;
	padding-left: 0.5em;
	color: var(--txt-color);
	background-color: #fff;
	font-size: clamp(2.6rem, 3vw, 3rem);
}
.mvNote{
	position: absolute;
	right: 1.2vw;
	bottom: 1.2vw;
	padding: 0em 0.7em;
	background-color: rgba(0, 188, 212, 0.3);
	color: #fff;
	font-size:  2vw;
	font-weight: 700;
	border: min(0.4vw, 3px) solid #fff;
	z-index: 10;
}
.submvWrap{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 80px;
	background: url(./images/submv_bg.png) no-repeat;
	background-size: cover;
	aspect-ratio: 160 / 40;
}
.submvWrap h2{
	font-size: clamp(2.0rem, 2vw, 3.4rem);
	font-weight: 700;
	color: var(--sub-color);
}
.submvWrap .ttl{
	font-size: clamp(2.0rem, 2vw, 3.4rem);
	font-weight: 700;
	text-align: center;
	line-height: 1.3;
	color: var(--sub-color);
}

.pcImg{display: block}
.tabletImg{display: none;}

@media screen and (max-width:1200px){

	/* .mvWrap .mvInner{
		left: 1em;
		bottom: 12vw;
		width: 100%;
	} */
	/* .mvWrap .mvInner .mvText p{
		margin-top: 1%;
	}
	.mvWrap .mvInner .mvText p.sub{
		margin-top: 2%;
	} */
}
@media screen and (max-width:840px){
	.mvWrap{
		padding-top: 50px;
	}
	.mvWrap .mvInner{
		left: 0.5vw;
		bottom: 1vw;
		width: 100%;
	}
	.mvWrap .mvInner .mvText{
		padding: 1em;
	}
	.mvWrap .mvInner .mvText p {
		font-size: clamp(2rem, 4.2vw, 3.6rem);
	}
	.mvWrap .mvInner .mvText p.sub{
		font-size: clamp(1.8rem, 3vw, 3.2rem);
	}

}
@media screen and (max-width:599px){
	.mvWrap .swiper-slide img {
		aspect-ratio: 768/1100;
	}
	.pcImg{display: none;}
	.tabletImg{display: block;}
	.mvWrap .mvInner{
		bottom: 12vw;
	}
	.mvWrap .mvInner .mvText p {
		font-size: clamp(2rem, 6vw, 3.6rem);
	}
	.mvWrap .mvInner .mvText p.sub{
		font-size: clamp(1.8rem, 4.8vw, 3.2rem);
	}
	.mvNote{
		bottom: 2vw;
		font-size:  4vw;
		border: min(0.7vw, 3px) solid #fff;
	}
	/* .mvWrap .mvInner .mvText p{
		font-size: 2rem;
	}
	.mvWrap .mvInner .mvText p.sub{
		font-size: 1.6rem;
	} */
	.submvWrap{
		margin-top: 50px;
	}
}


/* sidebnr
========================================== */
.sideBnr{
	position: fixed;
	top:120px;
	right: 0;
	z-index: 100;
}
.sideBnr a{
	position: relative;
	/* display: block;
	padding: 0 2.4em 0 0.8em; */
	display: flex;
	justify-content: center;
	align-items: center;
	width: 4em;
	height: 36em;
	background-color:var(--main-color);
	color: #fff;
	font-size: 1.6rem;
	font-weight: 700;
	letter-spacing: 2px;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	-o-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	border-radius: 20px 0 0 20px;
	box-sizing: border-box;
	text-align: center;
	text-decoration: none;
	transition: .3s;
	max-height:16em; /*IE対策*/
	transition: 0.3s;
	border: 2px solid #fff;
	border-right: none;
	box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
	}
.sideBnr li.estimate{margin-top: 10px;}
.sideBnr li.estimate a{background-color: var(--sub-color);}
.sideBnr a:hover,
.sideBnr li.estimate a:hover{background-color:var(--point-color); color: var(--txt-color);}

@media screen and (max-width:1200px){
	.sideBnr a{font-size: 1.6rem;}
}
@media screen and (max-width:840px){
	.sideBnr{
		display: flex;
		top: auto;
		left: 0;
		bottom: 0;}
	.sideBnr li{width: 50%;}
	.sideBnr li.estimate{margin-top:0;}
	.sideBnr li a{
		width: 100%;
		letter-spacing: 0;
		display: block;
		height: auto;
		padding: 1em;
		font-size: 1.5rem;
		max-height:auto;
		border-radius: 0;
		-ms-writing-mode: horizontal-tb;
		-webkit-writing-mode: horizontal-tb;
		-o-writing-mode: horizontal-tb;
		writing-mode: horizontal-tb;
		border: none;
	}
	.sideBnr li.estimate a{border-left: 0;height: auto;}
}
@media screen and (max-width:599px){
	.sideBnr li a{
		padding:0.8em 0;
		font-size: 1.5rem;}
}


/* contents
========================================== */
.contents{
	overflow: hidden;
	margin:0 auto;
	width:100%;}
.contents p+p{margin-top: 1.5em;}
.Inner{
	margin:0 auto;
	padding: 0;
	max-width: 1024px;}
.subInner {
	margin: 50px auto 100px;
	padding: 0;
	max-width: 1024px;
}
.Inner p.txt {
	text-align: center;
	font-size: clamp(1.6rem, 2vw, 1.8rem);
}
.topMain .featureArea .Inner,
.topMain .courseArea .Inner,
/* .topMain .successArea .Inner, */
/* .topMain .trialArea .Inner, */
.topMain .classroomArea .Inner,
.topMain .supportArea .Inner{
	max-width: 1200px;
}

.pc{display: block;}
.pc1{display: block;}
.pcOnly{display: block;}
.smOnly{display: none;}
.tablet,
.sp,
.sp320,
.sp360{display: none;}
.mb20{margin-bottom: 20px;}
.mb80{margin-bottom: 80px;}
.mb100{margin-bottom: 100px;}

@media screen and (max-width:1200px){
	.Inner,.subInner{
		width: 100%;
		padding: 0 30px;}
}
@media screen and (max-width:1000px) {
	.pc1 {display: none;}
	.tablet {display: block;}
}
@media screen and (max-width:840px){
	.pcOnly {display: none;}
	.sp{display: block;}
}
@media screen and (max-width:599px){
	.Inner{padding: 0 20px;}
	.subInner{
		margin-bottom: 50px;
		padding: 0 20px;
	}
	.pc{display: none;}
	.smOnly{display: block;}
	.tablet{display: none;}
	.mb80{margin-bottom: 40px;}
	.mb100{margin-bottom: 50px;}
}
@media screen and (max-width:360px) {
	.sp360 {display: block;}
}
@media screen and (max-width:320px) {
	.sp320 {display: block;}
}


/* subcontents
========================================== */
.subcontents .Intro{
	margin: 50px auto 100px;
	text-align: center;
}
.subcontents .Intro100{
	margin: 100px auto;
}
.subcontents .Intro h2 {
	margin: 25px auto;
	font-size: clamp(2rem, 3vw, 2.6rem);
	font-weight: 600;
	color: var(--sub-color);
	line-height: 1.6;
}
.subcontents .topTxt h3 {
	margin: 25px auto;
	font-size: clamp(2rem, 2vw, 2.6rem);
	font-weight: 600;
	color: var(--sub-color);
	line-height: 1.6;
}
.subcontents .Intro h2 p{
	display: block;
	font-size: clamp(2rem, 3vw, 2.2rem);
}
.subcontents .Intro h2 .subTxt{
	display: block;
	font-size: clamp(2rem, 3vw, 2.6rem);
}
.subcontents .Intro h2 span.point{
	color: var(--pink01-color);
}
.subcontents .Intro p,
.subcontents .topTxt p {
	font-size: clamp(1.6rem, 2vw, 1.8rem);
}
.subcontents .topTxt {
	margin-bottom: 50px;
	text-align: center;
}
.subcontents .introductionTxt p {
	font-size: clamp(1.6rem, 2vw, 1.8rem);
}
.subcontents .introductionTxt {
	margin-bottom: 50px;
	text-align: center;
}
.subcontents ul.Important li {
	position: relative;
	margin-bottom: 1em;
	padding-left: 1.1em;
	font-weight: 600;
	line-height: 1.6;
}
.subcontents ul.Important li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.5em;
	width: 10px;
	height: 10px;
	border-radius: 10px;
	background: var(--sub-color)
}
.subcontents ul.Important a {
	color: var(--main-color);
	text-underline-offset: 5px;
}
.subcontents p.Point {
	width: fit-content;
	margin: 2em auto 0;
	padding: 0.8em 1em;
	font-weight: 600;
	/* color: #fff;
	background-color: var(--main-color); */
	text-align: center;
	border-radius: 10px;
	line-height: 1.7;
	color: var(--main-color);
	background-color: transparent;
}

@media screen and (max-width:1200px) {
	.subcontents .Intro {
		width: 100%;
		padding: 0 30px;
	}
}

@media screen and (max-width:840px) {
	.subcontents .introductionTxt {
		text-align: left;
	}
	.subcontents p.Point{
		text-align: left;
	}
}
@media screen and (max-width:599px) {
	.subcontents .Intro {
		margin: 50px auto;
		padding: 0 20px;
	}
	.subcontents .Intro100{
		margin: 80px auto 50px;
	}
	.subcontents .topTxt {
		margin-bottom: 30px;
	}
	.subcontents .introductionTxt {
		margin-bottom: 30px;
	}
	.subcontents p.Point{
		margin: 2em auto 0;
	}
}

/* bnrArea
========================================== */
.bnrArea{
	background-color: var(--bg01-color);
	padding: 110px 0 0;
}
.bnr_item {
	max-width: 620px;
	margin: 0 auto;
}
.bnr_item img {
	width: 100%;
}
@media screen and (max-width:599px){
	.bnrArea{
		padding: 60px 0 0;
	}
}

/* feature
========================================== */
.featureArea{
	background-color: var(--bg01-color);
	padding: 80px 0 90px;
}
.featureArea .ttlMain::before{
	top: 40%;
}
.featureList{
	margin-top: 30px;
	row-gap: 1em;
}
.featureList div{
	width: 23.5%;
}
.topFeatureList{
	max-width: 1024px;
	margin: 0 auto;
}
.topFeatureList .imgWrap{
	width: 42%;
	max-width: 80px;
	margin: 0 auto;
	padding: 0;
	border: none;
}
.topFeatureList .imgWrap img{
	width: 100%;
}


@media screen and (max-width:840px){
	.featureList div{
		width: 48%;
	}
	/* .featureList dl dd br{
		display: none;
	} */
}
@media screen and (max-width:599px){
	.featureArea{
		padding: 50px 0;
	}
	.featureList{
		margin-top: 0px;
	}
	.featureList div{
		width: 48%;
		margin-top: 10px;
	}
	.featureList div:last-child{
		margin-bottom: 0;
	}
}
@media screen and (max-width:420px) {
	.featureList div{
		width: 100%;
		margin-top: 0px;
	}
}
@media screen and (max-width:360px) {
	.featureList div {
		width: 100%;
	}
}


/* course
========================================== */
.courseArea {
	padding: 80px 0;
}
.courseList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 3em 0 0;
}
.courseList div{
	position: relative;
	width: 31.2%;
	padding: 1.2em 1.2em 2.2em;
	background: #fff;
	border-radius: 10px;
	text-align: center;
}
.courseList div::before{
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 35px;
	height: 35px;
	border-radius: 5px 0 5px 0;
}
.courseList div::after{
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;
	border: 0;
	border-top: solid 3px #fff;
	border-right: solid 3px #fff;
	transform: rotate(45deg);
	position: absolute;
	right: 14px;
	bottom: 12px;
	margin: auto;
}
.courseList div:first-child{
	border: 3px solid var(--green-color);
	background: var(--green-bg-color);
}
.courseList div:first-child::before{
	background: var(--green-color);
}
.courseList div:nth-child(2){
	border: 3px solid var(--pink-color);
	background: var(--pink-bg-color);
}
.courseList div:nth-child(2)::before {
	background: var(--pink-color);
}
.courseList div:nth-child(3){
	border: 3px solid var(--blue-color);
	background: var(--blue-bg-color);
}
.courseList div:nth-child(3)::before {
	background: var(--blue-color);
}
.courseList div a{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.courseList div:hover{
	opacity: 0.5;
	transition: all 0.3s ease;
}
.courseList div dl dt{
	margin: 0.2em auto 1em;
	font-size: clamp(2rem, 2vw, 2.6rem);
	font-weight: 700;
	line-height: 1.5;
}
.courseList div dl dt span{
	padding: 0 0.2em;
	display: inline-block;
	line-height: 1.3;
}
.courseList div:first-child dl dt span {
	border-bottom: 2px solid var(--green-color);
}
.courseList div:nth-child(2) dl dt span {
	border-bottom: 2px solid var(--pink-color);
}
.courseList div:nth-child(3) dl dt span {
	border-bottom: 2px solid var(--blue-color);
}
.courseList div dl dd{
	font-size: clamp(1.4rem, 1.6vw, 1.6rem);
	/* font-size: 1.6rem; */
	line-height: 1.5;
}
.courseList div dl dd:last-child{
	margin-top: 1.4em;
}
.courseList div dl dd img {
	width: 100%;
}
.topCourseList dd img {
	border-radius: 10px;
}
.courseSupport{
	position: relative;
	margin-top: 130px;
	padding: 3.4em 2.5em 2.8em;
	border: 3px solid var(--main-color);
	border-radius: 10px;
}
.topCourseSupport {
	background-color: #fef6ef;
}
.courseSupport h3{
	position: absolute;
	top: -5%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	font-weight: 700;
}
.courseSupport h3 span{
	display: inline-block;
	position: relative;
	margin-bottom: 10px;
	color: var(--main-color);
}
.courseSupport h3 span::before,
.courseSupport h3 span::after{
	content: '';
	position: absolute;
	top: 15px;
	width: 25px;
	height: 3px;
	box-sizing: border-box;
	background-color: var(--main-color);
}
.courseSupport h3 span::before{
	right: calc(100% + 0.3em);
	transform: rotate(60deg);
}
.courseSupport h3 span::after{
	left: 100%;
	transform: rotate(-60deg);
}
.courseSupport h3 p{
	padding: 0 0.9em;
	font-size: clamp(2rem, 3vw, 2.6rem);
	color: #fff;
	background: var(--main-color);
	border-radius: 3em;
}
.courseSupportList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.courseSupportList ul{
	width: 31%;
}
.courseSupportList ul li{
	text-align: center;
}
.courseSupportList ul li img{
	width: 100%;
}
.topCourseSupport .courseSupportList ul li img{
	border-radius: 10px;
}
.courseSupportList ul li.txt{
	position: relative;
	width: 90%;
	margin: -10px auto 0;
	padding: 0.6em;
	font-size: min(2.6vw, 2.2rem);
	font-weight: 700;
	color: #fff;
	background: var(--sub-color);
	border-radius: 6px;
	line-height: 1.4;
	z-index: 1;
}

@media screen and (max-width:840px) {
	.courseList div{
		padding: 1.2em 0.8em 2em;
	}
	/* .courseList div dl dd:last-child br{
		display: none;
	} */
}
@media screen and (max-width:599px) {
	.courseArea{
		padding: 50px 0;
	}
	.courseList div{
		width: 100%;
		margin-bottom: 20px;
	}
	.courseList div dl dd:last-child {
		margin-top: 1.2em;
	}
	.courseList.sub{
		margin: 0;
	}
	.courseSupport{
		margin-top: 80px;
		padding: 3.4em 1.5em 1em;
	}
	.courseSupport h3{
		width: 80%;
		top: -2%;
	}
	/* .courseSupport h3 span::before{
		left: 0;
	}
	.courseSupport h3 span::after{
		right: 0;
	} */
	.courseSupportList ul{
		width: 100%;
		margin-bottom: 20px;
	}
	.courseSupportList ul li.txt{
		font-size: 1.8rem;
	}
}
@media screen and (max-width:320px) {
	.courseSupport h3{
		width: 90%;
	}
	.courseSupport h3 p{
		font-size: 2.4rem;
	}
}


/* success
========================================== */

.pageLinkArea{
	padding: 2em 0;
}
.pageLinkList{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	column-gap: 0.5em;
	row-gap: 0.8em;
}
.pageLinkItem {
	width: calc((100% - 1em * 3) / 4);
	min-width: 250px;
	max-width: 300px;
}
.pageLinkItem a {
	display: block;
	padding: 1em 0;
	background-color: var(--sub-color);
	box-sizing: border-box;
	color: #fff;
	font-size: clamp(1.5rem, 2.3vw, 1.8rem);
	font-weight: bold;
	border: 2px solid #fff;
	border-radius: 35px;
	text-align: center;
	text-decoration: none;
	letter-spacing: 1px;
	line-height: 1.3;
	transition: .3s;
	box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
}
.pageLinkItem a span{
	display: inline-block;
	position: relative;
}
.pageLinkItem a span::after{
	content: "";
	display: inline-block;
	position: absolute;
	top: 30%;
	left: calc(100% + 0.6em);
	transform: rotate(45deg) translateY(-50%);
	width: 0.6em;
	height: 0.6em;
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
	transition: 0.2s all;
}
.pageLinkItem a:hover{
	border: 2px solid var(--sub-color);
	background: #fff;
	color: var(--sub-color);
}
.pageLinkItem a:hover span::after{
	top: calc(30% + 0.3em);
	border-bottom: 2px solid var(--sub-color);
	border-right: 2px solid var(--sub-color);
}

.successArea{
	padding: 50px 0 70px;
	background: var(--sub-color);
}
.voiceSuccessArea{
	padding: 80px 0 90px;
}
.topSuccessArea .Inner {
	max-width: 920px;
}
.successImg{
	margin-bottom: 50px;
	/* width: 100%;
	padding-top: 50px;
	aspect-ratio: 120 / 74;
	background: url(./images/success_bg.png) no-repeat;
	background-size: contain; */
}
.successImg img{
	width: 100%;
}
.successArea h2{
	text-align: center;
}
.successArea h2 span{
	font-size: clamp(2.2rem, 2vw, 2.6rem);
	font-weight: 700;
}
.successArea h2 span:first-child{
	color: var(--pink01-color);
}
.successArea h2 span:last-child{
	padding: 0.2em 1em;
	background: var(--sub-color);
	color: #fff;
	border-radius: 25px;
}
.successArea h2 p{
	width: 628px;
	height: 87px;
	margin: 0.5em auto;
	font-size: 4rem;
	font-weight: 700;
	color: #fff;
	background: url(./images/success_ttl_bg.png) no-repeat center;
	background-size: contain;
	line-height: 2.2;
}
.successList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 0 60px;
}
.topSuccessArea .successList {
	padding: 0;
}
.successList dl{
	position: relative;
	width: 31%;
	padding: 1em 1.4em;
	background: #fff;
	border-radius: 10px;
	font-weight: bold;
	line-height: 1.6;
}
.topSuccessArea .successList dl{
	width: 32%;
	padding: 1em 1em;
	text-align: center;
}
.successList dl dd{
	margin-bottom: 2em;
	font-size: clamp(1.4rem, 2vw, 1.6rem);
	font-weight: 700;
	letter-spacing: 1px;
}
.successList dl dt{
	position: absolute;
	margin-bottom: 1em;
	bottom: 0;
	right: 1.5em;
	font-size: clamp(1.4rem, 2vw, 1.6rem);
	color: var(--pink01-color);
}

@media screen and (max-width:1200px) {
	.successArea h2{
		margin-top: -3%;
	}
	.successArea h2 p{
		width: 100%;
		height: fit-content;
		font-size: 3.6rem;
	}
}
@media screen and (max-width:890px) {
	.successArea h2{
		margin-top: -6%;
	}
}
@media screen and (max-width:840px) {
	.successArea h2{
		margin-top: -12.5%;
	}
	.successArea h2 span:first-child {
		color: #fff;
	}
	.successList{
		flex-direction: column;
		row-gap: 1em;
		padding: 0;
	}
	.topSuccessArea .successList dl{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}
}
@media screen and (max-width:599px) {
	.successArea{
		padding: 100px 0 50px;
	}
	.successArea.topSuccessArea{
		padding: 50px 0;
	}
	.voiceSuccessArea{
		padding: 50px 0;
	}
	.successArea h2 span{
		font-size: 1.8rem;
	}
	.successArea h2{
		margin-top: -35%;
	}
	.successArea h2 p{
		font-size: clamp(2.4rem, 2vw, 2.6rem);
		background-size: 100%;
		margin: 5px auto;
	}
	.successArea h2 span:first-child{
		line-height: 1.4;
	}
	.successArea h2 span:last-child{
		font-size: 1.5rem;
	}
	.successImg{
		margin-bottom: 20px;
	}
	.successList dl{
		width: 100%;
		margin-bottom: 10px;
	}
}
@media screen and (max-width:360px) {
	.successArea h2{
		margin-top: -40%;
	}
	.successArea h2 p{
		line-height: 2.5;
	}
	.successArea h2 span{
		font-size: 1.6rem;
	}
	.successArea h2 span:last-child{
		font-size: 1.5rem;
	}
}
@media screen and (max-width:320px) {
	.successArea h2 {
		margin-top: -48%;
	}
	.successArea h2 p {
		font-size: 2rem;
	}
	.successArea h2 span:last-child {
		font-size: 1.3rem;
	}
}

/* 合格体験記 */
.successExperienceList{
	display: flex;
	flex-wrap: wrap;
	column-gap: 3%;
	row-gap: 2.5em;
}
.successExperienceItem{
	width: calc((100% - 3%) / 2);
}
.successExperienceItem a{
	display: block;
	height: 100%;
	text-decoration: none;
}
.successExperienceItem a:hover .cardWrap{
	opacity: 0.9;
}
.successExperience .cardWrap{
	display: flex;
	align-items: flex-start;
	column-gap: 1em;
	row-gap: 1.6em;
	position: relative;
	height: 100%;
	padding: 1.2em 1.4em;
	background-color: #fff;
	border-radius: 10px;
	transition: all 0.2s;
}
.successExperience .cardImg{
	width: 40%;
}
.successExperience .cardImg img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	border: 1px solid #ccc;
	background: #eee;
}
.successExperience .cardDesc{
	display: flex;
	flex-direction: column;
	width: calc((100% - (40% + 1em)));
	height: 100%;
}
.successExperience .cardCategory{
	width: fit-content;
	margin-bottom: 0.6em;
	padding: 0em 0.8em;
	background-color: var(--sub-color);
	color: #fff;
	font-size: 1.4rem;
	line-height: 1.6;
	border-radius: 3em;
}
.successExperience .cardCategory.elementary{
	background-color: var(--green-color);
}
.successExperience .cardCategory.junior{
	background-color: var(--pink-color);
}
.successExperience .cardCategory.high{
	background-color: var(--blue-color);
}
.successExperience .cardTtl{
	margin-bottom: 0.6em;
	color: var(--txt-color);
	font-size: 1.8rem;
}
.successExperience .cardTtl > span{
	display: inline-block;
	position: relative;
	margin-left: 1.5em;
	line-height: 1.4;
}
.successExperience .cardTtl > span::before{
	content: "";
	display: inline-block;
	position: absolute;
	top: 0.15em;
	right: calc(100% + 0.4em);
	width: 1.2em;
	height: 1.2em;
	background-image: url(./images/icon_sakura.png);
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}

.successExperience .cardTxt{
	color: var(--txt-color);
	line-height: 1.4;
}
.successExperience .cardPerson{
	margin-top: 1em;
	color: var(--txt-color);
	font-size: 0.9em;
	line-height: 1.4;
	text-align: right;
}
.successExperience .cardPerson span{
	position: relative;
	display: inline-block;
}
.successExperience .cardPerson span::before{
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	right: calc(100% + 0.3em);
	width: 1.5em;
	height: 2px;
	background-color: var(--txt-color);
}
.successExperience .cardBtnArea{
	display: flex;
	align-items: flex-end;
	flex-grow: 1;
	margin-top: 1.6em;
}
.successExperience .cardBtn{
	width: fit-content;
	margin-left: auto;
	padding: 0 1.8em 0 1em;
	background-color: var(--sub-color);
	color: #fff;
	border: 1px solid var(--sub-color);
	border-radius: 3em;
	transition: all 0.2s;
}
.successExperience .cardBtn span{
	position: relative;
	display: inline-block;
}
.successExperience .cardBtn span::before{
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	left: calc(100% + 0.4em);
	transform: translateY(-50%);
	border-top: 6px solid transparent;
	border-left: 10px solid #fff;
	border-bottom: 6px solid transparent;
	transition: all 0.2s;
}
.successExperienceItem a:hover .cardBtn{
	background-color: #fff;
	color: var(--sub-color);
}
.successExperienceItem a:hover .cardBtn span::before{
	border-left: 10px solid var(--sub-color);

}

@media screen and (max-width:840px) {
	.successExperience .cardWrap{
		flex-direction: column;
	}
	.successExperience .cardImg{
		width: 100%;
		max-width: 500px;
		height: 32vw;
		margin: 0 auto;
	}
	.successExperience .cardDesc{
		width: 100%;
	}
}
@media screen and (max-width:599px) {
	.successExperienceList{
		row-gap: 1.6em;
	}
	.successExperienceItem{
		width: 100%;
		max-width: 400px;
		margin: 0 auto;
	}
	.successExperience .cardWrap{
		row-gap: 1em;
		padding: 1em;
	}
	.successExperience .cardImg{
		height: 62vw;
	}
	.successExperience .cardTtl{
		font-size: 1.6rem;
	}
	.successExperience .cardTxt{
		font-size: 1.4rem;
	}
	.successExperience .cardPerson{
		font-size: 1.4rem;
	}
	.successExperience .cardBtn span{
		font-size: 1.4rem;
	}
}

/* 合格体験記 modal */
.modal{}
.modal .modalBg{
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.3);
	z-index: -1005;
	opacity: 0;
	visibility: hidden;
	transition: all 0.2s;
}
.modal.is-active .modalBg{
	z-index: 1005;
	opacity: 1;
	visibility: visible;
}
.modalContent{
	position: fixed;
	inset: 0;
	width: 90%;
	max-width: 850px;
	height: 72vh;
	margin: auto;
	background: var(--bg01-color);
	border-radius: 10px;
	overflow-y: scroll;
	z-index: -1050;
	opacity: 0;
	visibility: hidden;
	transition: all 0.2s;
}
.modal.is-active .modalContent{
	z-index: 1050;
	opacity: 1;
	visibility: visible;
}
.modalCloseBtn{
	display: inline-block;
	position: absolute;
	top: 1.8em;
	right: 6%;
	width: 2.5em;
	height: 2.5em;
}
.modalCloseBtn > span{
	display: inline-block;
	width: 100%;
	height: 2px;
	background: rgba(255,255,255,0.7);
	position: absolute;
	top: 50%;
}
.modalCloseBtn > span:first-child{
	transform: rotate(45deg);
	left: 0;
}
.modalCloseBtn > span:last-child{
	transform: rotate(-45deg);
	right: 0;
}
.modalInner{
	padding: 2.2em 2em;
	background-color: var(--bg01-color);
	border-radius: 10px;
}
.modalDesc{
	padding: 2em;
	background-color: #fff;
	border-radius: 10px;
}
.modalTtl{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	column-gap: 1em;
	row-gap: 0.3em;
	margin-bottom: 1.5em;
	padding-bottom: 0.2em;
	font-size: 2.4rem;
	line-height: 1.4;
	border-bottom: 1px solid var(--sub-color);
}
.modalTtl .person{
	font-size: 0.7em;
}
.modalHeading{
	margin-bottom: 1.8em;
	padding-left: 1em;
	font-size: 2rem;
	line-height: 1.5;
	border-left: 0.3em solid var(--sub-color);
}
.modalImg{
	max-width: 600px;
	margin: 0 auto 2.8em;
}
.modalImg img{
	width: 100%;
	border: 1px solid #ccc;
}
.modalLower{
	padding: 1.2em 1em;
	border-top: 1px solid var(--sub-color);
	border-bottom: 1px solid var(--sub-color);
}
.modalLower h4{}
.modalLower p .marker{
  background-image: linear-gradient(0deg, rgba(255, 242, 98, 0.8) 0.42em, transparent 0.42em);
	font-weight: 600;
}

@media screen and (max-width:599px) {
	.modalInner{
		padding: 1em;
	}
	.modalDesc{
		padding: 1.2em 0.8em;
	}
	.modalTtl{
		font-size: 1.6rem;
	}
	.modalHeading{
		font-size: 1.6rem;
	}
	.modalImg{
		margin: 0 auto 1.8em;
	}
	.modalLower{
		padding: 1em 0;
		font-size: 1.4rem;
	}
}

/* 生徒さんの声・保護者様の声 */
.successVoiceList{
	display: flex;
	flex-wrap: wrap;
	column-gap: 3%;
	row-gap: 2.5em;
}
.successVoiceItem{
	display: flex;
	align-items: flex-start;
	column-gap: 0.5em;
	row-gap: 1em;
	width: calc((100% - 3%) / 2);
}
.successVoiceImg{
	width: 25%;
}
.successVoiceImg img{
	width: 100%;
}
.successVoiceDesc{
	width: calc(100% - (25% + 0.5em));
	padding: 1.2em 1.5em 2.5em 3.3em;
	background: #000;
	background-image: url(./images/success/bg_fukidashi_top_color.jpg),url(./images/success/bg_fukidashi_bottom_color.jpg),url(./images/success/bg_fukidashi_middle_color.jpg);
  background-size: contain,contain,contain;
  background-position: top center,bottom center,center center;
  background-repeat: no-repeat,no-repeat,repeat-y;
}
.successVoiceList-parent .successVoiceDesc{
	background-image: url(./images/success/bg_fukidashi_top.jpg),url(./images/success/bg_fukidashi_bottom.jpg),url(./images/success/bg_fukidashi_middle.jpg);
}
.successVoiceHeading{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 0.5em;
	margin-bottom: 0.65em;
	color: var(--main-color);
	font-size: 2rem;
	font-weight: 600;
}
.successVoiceHeading .school{
	font-size: 0.8em;
}
.successVoiceBody h4{
	margin-bottom: 0.8em;
	padding-bottom: 0.35em;
	font-size: 1.8rem;
	font-weight: 600;
	line-height: 1.5;
	border-bottom: 4px dotted var(--sub-color);
}
.successVoiceBody p{
	line-height: 1.5;
}
@media screen and (max-width:840px) {
	.successVoiceList{
		row-gap: 1.2em;
	}
	.successVoiceImg{
		width: 18%;
	}
	.successVoiceDesc{
		width: calc(100% - (18% + 0.5em));
		padding: 1em 6vw 2em 10vw;
		background-image: url(./images/success/bg_fukidashi_top_color_sp.jpg),url(./images/success/bg_fukidashi_bottom_color_sp.jpg),url(./images/success/bg_fukidashi_middle_color_sp.jpg);
	}
	.successVoiceList-parent .successVoiceDesc{
		background-image: url(./images/success/bg_fukidashi_top_sp.jpg),url(./images/success/bg_fukidashi_bottom_sp.jpg),url(./images/success/bg_fukidashi_middle_sp.jpg);
	}
	.successVoiceItem{
		width: 100%;
	}
	.successVoiceHeading{
		font-size: 1.6rem;
	}
	.successVoiceBody h4{
		font-size: 1.6rem;
	}
	.successVoiceBody p{
		font-size: 1.4rem;
	}
}

/* 合格実績 */
.successResult{
	border: 2px solid var(--sub-color);
	border-radius: 10px;
}
.successResultArea{
	margin: 80px auto 90px;
}
.successResultTtl{
	padding-top: 0.5em;
}
.successResultTtl img{
	width: 100%;
}
.successResultContent{
	padding: 0 2em 2em;
}
.successResultSec + .successResultSec{
	margin-top: 50px;
}
.successResultSec .secTtl{
	width: 100%;
	margin-bottom: 0.5em;
	background-color: var(--sub-color);
	color: #fff;
	font-size: clamp(2rem, 2.8vw, 2.2rem);
	font-weight: 600;
	text-align: center;
	border-radius: 3em;
}
.successResultGroup{
	position: relative;
}
.successResultGroup + .successResultGroup{
	margin-top: 2em;
}
.successResultGroup .secList{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	column-gap: 1em;
	row-gap: 0.5em;
	width: calc(100% - 1.25em);
	min-height: 8em;
	margin-left: auto;
	padding: 1.4em 1em 1.4em 2em;
	background-color: var(--bg01-color);
	border-radius: 10px;
}
.successResultGroup .secHeading{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	height: 7em;
	padding: 0 0.15em;
	background-color: #fff;
	color: var(--sub-color);
	font-size: clamp(1.4rem, 2.1vw, 1.8rem);
	writing-mode: vertical-rl;
	text-align: center;
	border: 1px solid var(--sub-color);
	border-radius: 3em;
}
.successResultGroup .secItem{
	width: calc((100% - 1em) / 2);
	line-height: 1.4;
}
.successResultGroup .secItem > span{
	display: inline-block;
	position: relative;
	margin-left: 1.5em;
}
.successResultGroup .secItem > span .small{
	font-size: 0.9em;
}
.successResultGroup .secItem > span::before{
	content: "";
	display: inline-block;
	position: absolute;
	top: 0.25em;
	right: calc(100% + 0.4em);
	width: 1em;
	height: 1em;
	background-image: url(./images/icon_sakura.png);
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}
@media screen and (max-width:840px) {
	.successResultContent{
		padding: 0 1.2em 1.2em;
	}
}
@media screen and (max-width:599px) {
	.successResultArea{
		margin: 50px auto;
	}
	.successResultSec .secTtl {
		margin-bottom: 1.2em;
	}
	.successResultGroup .secList{
		min-height: auto;
		padding: 1.2em 1em 1.2em 1.5em;
	}
	.successResultGroup .secItem{
		width: 100%;
		font-size: 1.4rem;
	}
	.successResultGroup + .successResultGroup{
		margin-top: 1.2em;
	}
}

/* trial
========================================== */
.trialArea{
	padding: 50px 0 70px;
	background: url(./images/trial_bg.png) no-repeat;
	background-size: cover;
}
.trialArea h2{
	margin-bottom: 1.6em;
}
.trialArea h3{
	margin: 1em auto;
	color: var(--main-color);
	font-size: clamp(2rem, 2vw, 2.6rem);
	font-weight: bold;
	text-align: center;
}
.trialList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	row-gap: 1em;
	/* align-items: center; */
	counter-reset: num;
}
/* .trialList div{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30%;
	padding: 2.5em 0 2.5em;
	border: 1px solid var(--sub-color);
	border-radius: 10px;
	background-color: #fff;
	counter-increment: num;
} */
.trialList .trialItem{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30%;
	padding: 2.5em 0 2.5em;
	border: 1px solid var(--sub-color);
	border-radius: 10px;
	background-color: #fff;
	counter-increment: num;
}
.trialList .trialBox{
	position: relative;
	display: flex;
	justify-content: stretch;
	align-items: stretch;
	width: 30%;
	padding: 1.5em 1.8em 1.8em;
	border: 1px solid var(--sub-color);
	border-radius: 10px;
	background-color: #fff;
	counter-increment: num;
}
/* .trialList .trialBox{
	align-items: stretch;
	padding: 1.5em 0 2.5em;
} */
/* .trialList div:nth-child(2){
	padding: 1.5em 0 1.5em 7em;
} */
/* .trialList div::before{
	counter-increment: number 1;
	content: counter(num, decimal-leading-zero) ".";
	position: absolute;
	left: 0.8em;
	padding-right: 1em;
	vertical-align: middle;
	font-family: "Jost", sans-serif;
	font-size: 4rem;
	color: var(--main-color);
	font-weight: 500;
} */
.trialList .trialItemTtl::before{
	counter-increment: number 1;
	content: counter(num, decimal-leading-zero) ".";
	position: absolute;
	top: 50%;
	right: calc(100% + 0.4em);
	transform: translateY(-50%);
	font-family: "Jost", sans-serif;
	font-size: clamp(2.4rem, 4vw, 4rem);
	color: var(--main-color);
	font-weight: 500;
}
.trialList div::after {
	content: '';
	width: 20px;
	height: 20px;
	border: 0;
	border-top: solid 4px var(--main-color);
	border-right: solid 4px var(--main-color);
	border-radius: 2px;
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	right: -10%;
	bottom: 0;
	margin: auto;
}
.trialList div:last-child::after {
	content: none;
}
/* .trialList div p {
	display: inline-block;
	font-size: clamp(2rem, 2vw, 2.6rem);
	font-weight: 700;
	line-height: 1;
} */
/* .trialList div span{
	display: block;
	margin-top: 0.6em;
	padding: 0.2em 0.5em 0.3em 1em;
	font-size: clamp(1.3rem, 1.6vw, 1.4rem);
	background-color: var(--main-color);
	color: #fff;
	border-radius: 15px;
	line-height: 1.4;
	font-weight: 600;
} */
.trialList .trialListCaption{
	display: block;
	margin-top: 0.6em;
	padding: 0.2em 0.2em 0.2em 0.8em;
	font-size: clamp(1.3rem, 1.6vw, 1.4rem);
	background-color: var(--main-color);
	color: #fff;
	border-radius: 15px;
	line-height: 1.4;
	font-weight: 600;
}
.trialItemTtl {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-right: -2em;
	font-size: clamp(2rem, 2vw, 2.6rem);
	font-weight: 700;
	line-height: 1;
}
.trialBoxTtl {
	margin-bottom: 1em;
	font-size: clamp(2.2rem, 2.6vw, 2.6rem);
	font-weight: 700;
	line-height: 1;
}
.trialBoxTtl .txt {
	display: flex;
	align-items: center;
	column-gap: 0.5em;
}
.trialBoxTtl .num {
	font-family: "Jost", sans-serif;
	font-size: clamp(2.4rem, 3.6vw, 3.6rem);
	color: var(--main-color);
	font-weight: 500;
}

@media screen and (max-width:1000px) {
	/* .trialList div,
	.trialList div:nth-child(2){
		padding-left: 5em;
	} */
	/* .trialList div::before{
		font-size: clamp(2.4rem, 4vw, 4rem);
	} */
}
@media screen and (max-width:840px) {
	/* .trialList div{
		padding-left: 4.5em;
	} */
	/* .trialList div:nth-child(2) {
		padding: 1.5em 0em 1.5em 4.5em;
	} */
	.trialList div::before{
		left: 0.5em;
	}
	/* .trialList div span {
		padding: 0.1em 0.1em 0.1em 0.5em;
	} */
	.p-classroom_trialList{
		flex-direction: column;
		row-gap: 1.8em;
	}
	.trialList .trialBox{
		width: 100%;
	}
}
@media screen and (max-width:599px) {
	.trialArea{
		padding: 50px 0;
	}
	.trialList div{
		width: 100%;
		/* margin-bottom: 10px;
		padding-left: 7em; */
	}
	.trialList .trialItem{
		width: 100%;
		padding: 1.8em 0;
	}

	/* .trialList div:nth-child(2){
		padding: 2em 1.5em 2em 7em;
	} */
	.trialList div::before{
		left: 0.8em;
	}
	.trialList div::after{
		content: none;
	}
	/* .trialList div span{
		display: inline-block;
		margin-top: 0;
		margin-left: 0.5em;
	} */
	/* .trialListTtl {
		flex-direction: row;
	} */
}


/* faq
========================================== */
.faqArea {
	padding: 50px 0 70px;
	background:var(--bg01-color);
}
.faqArea h2 {
	margin-bottom: 1.6em;
}
.faqList{
	margin-top: 50px;
}
.faqArea .accordion{
	width: 100%;
	margin-bottom: 20px;
	border-radius: 10px;
	border: 1px solid var(--sub-color);
	background-color: #fff;
}
/* .faqArea .accordion summary {
	display: flex;
	align-items: center;
	position: relative;
	padding: 0.8em 1.8em;
	color: var(--txt-color);
	font-size: clamp(1.8rem, 2vw, 2rem);
	font-weight: 700;
	cursor: pointer;
	line-height: 1.5;
} */
.faqArea .accordion summary::-webkit-details-marker {
	display: none;
}
/* .faqArea .accordion summary::before{
	content: 'Q.';
	margin-right: 0.5em;
	font-family: "Jost", sans-serif;
	font-size: clamp(2.4rem, 4.7vw, 4rem);
	font-weight: 600;
	color: var(--sub-color);
} */
/* .faqArea .accordion summary::after {
	content: '';
	position: absolute;
	right: 1.8em;
	transform: translateY(-25%) rotate(45deg);
	width: 20px;
	height: 20px;
	margin-left: 10px;
	border-bottom: 5px solid var(--sub-color);
	border-right: 5px solid var(--sub-color);
	border-radius: 2px;
	transition: transform .3s;
} */
/* .faqArea .accordion .accordionHeading {
	display: flex;
	align-items: center;
	position: relative;
	padding: 1.4em 3.2rem;
	color: var(--txt-color);
	font-size: clamp(1.8rem, 2vw, 2rem);
	font-weight: 700;
	cursor: pointer;
	line-height: 1.5;
} */
.faqArea .accordion .accordionHeading {
	display: flex;
	align-items: flex-start;
	column-gap: 0.5em;
	position: relative;
	padding: 1.4em 3.2rem;
	color: var(--txt-color);
	font-size: clamp(1.8rem, 2vw, 2rem);
	font-weight: 700;
	cursor: pointer;
	line-height: 1.5;
}
/* .faqArea .accordion .accordionHeading > span{
	display: inline-block;
	position: relative;
	margin-left: 6rem;
} */
.faqArea .accordion .accordionHeading .head{
	color: var(--sub-color);
	font-family: "Jost", sans-serif;
	font-size: 3.2rem;
	font-weight: 600;
	line-height: 0.8;
}
/* .faqArea .accordion .accordionHeading > span::before{
	content: 'Q.';
	display: inline-block;
	position: absolute;
	top: 0;
	right: calc(100% + 0.3em);
	color: var(--sub-color);
	font-family: "Jost", sans-serif;
	font-size: clamp(2.4rem, 4.7vw, 4rem);
	font-weight: 600;
	line-height: 0.7;
}
.faqArea .accordion[open] summary::after {
	transform: rotate(225deg);
}*/
.faqArea .accordion .accordionHeading::after {
	content: '';
	position: absolute;
	top: 40%;
	right: 1.8em;
	transform: translateY(-25%) rotate(45deg);
	width: 20px;
	height: 20px;
	margin-left: 10px;
	border-bottom: 4px solid var(--sub-color);
	border-right: 4px solid var(--sub-color);
	border-radius: 2px;
	transition: transform .3s;
}
.faqArea .accordion[open] .accordionHeading::after {
	transform: rotate(225deg);
}
/* .faqArea .accordion p{
	display: flex;
	align-items: center;
	position: relative;
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 0 2em 1.5em 6.4em;
	color: #333333;
	line-height: 1.6;
	transition: transform .5s, opacity .5s;
}
.faqArea .accordion[open] p{
	transform: none;
	opacity: 1;
} */
.faqArea .accordion .accordionBody{
	display: flex;
	align-items: flex-start;
	column-gap: 0.5em;
	position: relative;
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 0 2em 1.5em 6.4em;
	color: #333333;
	line-height: 1.6;
	transition: transform .5s, opacity .5s;
}
.faqArea .accordion[open] .accordionBody{
	transform: none;
	opacity: 1;
}
/* .faqArea .accordion p::before{
	content: 'A.';
	position: absolute;
	top: 0;
	left: 0.9em;
	margin-right: 0.5em;
	font-family: "Jost", sans-serif;
	font-size: clamp(2.6rem, 5vw, 4.2rem);
	font-weight: 600;
	color: var(--main-color);
	line-height: 1;
} */
.faqArea .accordion .accordionBody{
	display: flex;
	align-items: flex-start;
	column-gap: 0.8em;
	position: relative;
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 0.8em 3.4rem 1.5em 3.4rem;
	line-height: 1.8;
	transition: transform .5s, opacity .5s;
}
.faqArea .accordion[open] .accordionBody{
	transform: none;
	opacity: 1;
}
.faqArea .accordion .accordionBody .head{
	color: var(--main-color);
	font-family: "Jost", sans-serif;
	font-size: 3.2rem;
	font-weight: 600;
	line-height: 0.8;
}

/* .faqArea .accordion .accordionBody > span{
	display: inline-block;
	position: relative;
	margin-left: 6rem;
} */
/* .faqArea .accordion .accordionBody > span::before{
	content: 'A.';
	position: absolute;
	top: 0;
	right: calc(100% + 0.3em);
	font-family: "Jost", sans-serif;
	font-size: clamp(2.6rem, 5vw, 4.2rem);
	font-weight: 600;
	color: var(--main-color);
	line-height: 0.7;
} */

.faqListBtn{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 10px 50px 20px;
}
.faqListBtn li {
	position: relative;
	width: 31%;
}

@media screen and (max-width: 840px) {
	.faqArea .accordion summary{
		padding: 0.8em 5em 0.8em 1.8em;
	}
	.faqArea .accordion p{
		padding: 0 2em 1.5em 5.3em;
	}
	.faqArea .accordion p::before{
		left: 0.9715em;
	}
	.faqListBtn{
		flex-direction: column;
		row-gap: 1.2em;
	}
	.faqListBtn li{
		width: 100%;
		max-width: 260px;
		margin-bottom: 0;
	}
}
@media screen and (max-width:599px) {
	.faqArea {
		padding: 50px 0;
	}
	.faqArea .accordion p {
		padding-left: 6em
	}
	.faqArea .accordion p::before {
		left: 0.6em;
	}
	.faqArea .accordion .accordionHeading {
		padding: 1.4em 3rem 1.4em 1.2rem;
	}
	.faqArea .accordion .accordionBody {
		padding: 0.5em 1.3rem 1.4em 1.3rem;
	}
	.faqArea .accordion .accordionHeading::after {
		right: 1em;
		width: 14px;
		height: 14px;
	}
}
@media screen and (max-width:390px) {
	/* .faqArea .accordion summary{
		padding: 0.8em 4em 0.8em 1em;
	}
	.faqArea .accordion summary::before{
		margin-right: 0.3em;
	} */
}


/* classroom
========================================== */
.classroomArea{
	padding: 80px 0 70px;
	background: url(./images/classroom_bg.png);
	background-size: contain;
}
.classroomArea h2{
	margin-bottom: 1.6em;
}
.classroomList{
	display: flex;
	justify-content: space-between;
	column-gap: min(3.3vw, 4em);
	row-gap: 1.8em;
	/* flex-wrap: wrap; */
}
.classroomList .room img{
	width: 100%;
	border-radius: 12px;
}
/* .classroomList div{
	width: 50%;
} */
.classroomList .room{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	row-gap: 1.2em;
	width: calc((100% - min(3.3vw, 4em)) / 2);
	/* padding-top: 14px; */
}
.classroomList .roomUpper{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-grow: 1;
}
.classroomList .room h3 .inner{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	/* margin-bottom: 1.4em; */
	text-align: center;
}
.classroomList .room h3 span.main{
	display: block;
	width: fit-content;
	margin: 0 auto;
	padding-left: 0.3em;
	font-size: clamp(2.4rem, 3.5vw, 4rem);
	font-weight: bold;
	color: #fff;
	line-height: 1.4;
	background: var(--pink01-color);
}
.classroomList .room h3 span.small{
	display: block;
	width: fit-content;
	margin: 0 auto;
	padding: 0.1em 0.3em;
	font-size: clamp(1.6rem, 1.6vw, 1.8rem);
	font-weight: bold;
	color: #fff;
	line-height: 1.4;
	background: var(--pink01-color);
	margin-bottom: 5px;
}
.classroomList .map{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	row-gap: 1.2em;
	width: calc((100% - min(3.3vw, 4em)) / 2);
}
.classroomList .mapUpper{
	flex-grow: 1;
}
.classroomList .map h3{
	margin-bottom: 0.3em;
	font-size: clamp(2rem, 2.3vw, 2.8rem);
	font-weight: 700;
	line-height: 1;
}
.classroomList .map ul{
	line-height: 1.4;
}
.classroomList .map .address{
	font-size: clamp(1.6rem, 2vw, 1.8rem);
	font-weight: 600;
}
.classroomList .map .tel{
	display: flex;
	column-gap: 0.5em;
	position: relative;
	font-family: "Jost", sans-serif;
	font-size: clamp(2.2rem, 2.8vw, 3.2rem);
	/* font-size: 3.2rem; */
	font-weight: 500;
	color: var(--main-color);
}
.classroomList .map .tel .num{
	padding-left: 1em;
}
.classroomList .map .tel .info > span{
	padding-left: 2rem;
	font-size: clamp(2rem, 2vw, 2.6rem);
	color: var(--txt-color);
}
.classroomList .map .tel .num{
	display: inline-block;
}
.classroomList .map .tel .num::before{
	content: '';
	position: absolute;
	top: 0.3em;
	left: 0;
	width: 0.8em;
	height: 100%;
	background: url(./images/classroom_tel_icon.png) no-repeat;
	background-size: contain;
}
.classroomList .map .gmap{
	width: 100%;
	aspect-ratio: 536 / 372;
	border-radius: 12px;
	border: 1px solid #eee;
}
.classroomList .map .gmap iframe{
	width: 100%;
	height: 100%;
	border-radius: 10px;
}
.classroomBtn{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 50px auto 70px;
}
.classroomBtn div{
	position: relative;
	width: 31%;
}
.classroomBtn a::after{
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;
	border: 0;
	border-top: solid 2px var(--txt-color);
	border-right: solid 2px var(--txt-color);
	transform: rotate(45deg) translateY(-0.9em);
	position: absolute;
	top: 50%;
	right: 1.2em;
	margin: auto;
	transition: .3s;
}
.classroomBtn a:hover::after{
	right: 0.8em;
}
.classroomBtn div a span {
	position: relative;
	display: block;
	padding: 0 1.2em 0.8em 0.8em;
	font-size: min(2.1vw, 1.6rem);
	text-decoration: none;
}
.classroomBtn a span::before {
	position: absolute;
	bottom: -2px;
	left: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--main-color);
}
.classroomBtn a span::after {
	position: absolute;
	bottom: -2px;
	left: 0;
	content: '';
	width: 100%;
	height: 2px;
	background: var(--main-color);
	transform-origin: left top;
	transform: scale(0, 1);
	transition: transform .3s;
}
.classroomBtn a:hover span::after {
	transform: scale(1, 1);
}
.classroomBtn a {
	display: block;
	position: relative;
	font-weight: 700;
	color: var(--txt-color);
	text-decoration: none;
}
.classroomcontactBtn-large {
	max-width: 850px;
	margin: 0 auto 80px;
}
.classroomcontactBtn-large a {
	display: block;
}
.classroomcontactBtn-large a img {
	width: 100%;
}
@media screen and (max-width:1200px) {
	.classroomList .room {
		padding-top: 0;
	}
	/* .classroomList .room h3 span {
		width: 100%;
		font-size: clamp(2.6rem, 2vw, 3.8rem);
	} */
	/* .classroomList .map {
		padding-left: 2em;
	} */
	/* .classroomList .map h3{
		margin-bottom: 10px;
		font-size: clamp(2.8rem, 2vw, 3.4rem);
	} */
	/* .classroomList .map .tel {
		font-size: clamp(2.4rem, 3.2vw, 3.2rem);
		flex-direction: column;
	} */

}
@media screen and (max-width:840px) {
	.classroomList {
		flex-direction: column;
	}
	/* .classroomList .room h3 span {
		padding-left: 0;
	} */
	.classroomList .map .tel .info > span{
		padding-left: 0.5em;
	}
	/* .classroomList .map .gmap{
		margin-top: 15px;
		padding-bottom: 70%;
	} */
	/* .classroomList div{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	} */
	.classroomList .room{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}
	.classroomList .map{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}
	.classroomList .map .tel {
		flex-direction: column;
		margin-top: 0.3em;
	}
}
@media screen and (max-width:599px) {
	.classroomArea {
		padding: 50px 0;
		background-size: cover;
	}
	.classroomList div {
		width: 100%;
	}
	.classroomList .room h3 span.small{
		padding: 0.2em 0 0.2em 0.4em;
		line-height: 1.4;	
	}
	/* .classroomList .room{
		margin-bottom: 30px;
	}
	.classroomList .room h3{
		margin-bottom: 10px;
	}
	.classroomList .map{
		padding-left: 0;
	} */

	.classroomBtn{
		margin-bottom: 30px;
	}
	.classroomBtn div{
		width: 100%;
		margin-bottom: 20px;
	}
	.classroomBtn div a span {
		font-size: 1.6rem;
	}
	.classroomcontactBtn-large {
		margin: 0 auto 40px;
	}
	
}
@media screen and (max-width:360px) {
	/* .classroomList .map h3{
		font-size: 2.6rem;
	} */
}
@media screen and (max-width:320px) {
	.classroomList .room h3 span{
		font-size: 2.2rem;
	}
	/* .classroomList .map h3 {
		font-size: 2.2rem;
	} */
	.classroomList .map .tel .info > span{
		padding-left: 0;
		display: block;
	}
}


/* support
========================================== */
.supportArea{
	padding: 80px 0 70px;
}
.supportArea .ttlMain::before {
	top: 80%;
}
.supportArea h2 {
	margin-bottom: 1.6em;
}
.supportList{
	justify-content: center;
	column-gap: calc((100% - 31% * 3) / 2);
	row-gap: 1.8em;
	margin-top: 30px;
}
.supportList div{
	width: 31%;
	padding: 2.2em 1em 2em;
}

@media screen and (max-width:840px) {
	.supportList{
		column-gap: calc(100% - 48% * 2);
	}
	.supportList div{
		width: 48%;
	}
}
@media screen and (max-width:599px) {
	.supportArea{
		padding: 50px 0
	}
	/* .supportList{
		margin: 20px auto 0;
		padding-bottom: 0;
	} */
	.supportList div{
		width: 100%;
	}
	.supportList div:last-child{
		margin-bottom: 0;
	}
}


/* junior
========================================== */

/* feature
------------------------------------------ */
.juniorfeatureArea .listType01 dl dt{
	margin-bottom: 1em;
	text-decoration: underline 3px solid var(--main-color);
}
.juniorfeatureArea .listType01 dl dt span::before {
	content: none;
}
.juniorfeatureArea .listType01 dl dd{
	text-align: left;
}

/* course
------------------------------------------ */
.juniorcourseArea{
	/* margin: 100px auto 90px; */
	margin: 80px auto 90px;
}
.juniorcourseArea .listType02 ul {
	align-items: flex-start;
}
.juniorcourseArea .listType02 ul li:first-child {
	width: 34%;
}
.juniorcourseArea .listType02 ul li:last-child {
	width: 62%;
}
.juniorcourseArea .listType02 ul li dd {
	font-size: 1.6rem;
}
@media screen and (max-width:599px){
	.juniorcourseArea{
		margin: 50px auto;
	}
	.juniorcourseArea .listType02 ul li:first-child {
		width: 100%;
	}
	.juniorcourseArea .listType02 ul li:last-child {
		width: 100%;
	}
}

/* support
------------------------------------------ */
.juniorsupportArea{
	padding: 80px 0 65px;
	background: url(./images/juniorsupportArea_bg.png);
	background-size: contain;
}
.juniorsupportList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.juniorsupportList dl{
	position: relative;
	width: 31%;
	padding: 20px;
	border-radius: 10px;
	background-color: var(--sub-color);
	transition: all 0.2s;
}
.juniorsupportList dl dd{
	width: 100%;
}
.juniorsupportList dl dd img{
	width: 100%;
}
.juniorsupportList dl dt{
	position: relative;
	margin-top: 20px;
	text-align: center;
	font-size: clamp(1.8rem, 2.8vw, 2.4rem);
	font-weight: 600;
	color: #fff;
	line-height: 1.4;
}
.juniorsupportList dl dt::after{
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;
	border: 0;
	border-top: solid 3px #fff;
	border-right: solid 3px #fff;
	transform: rotate(45deg);
	position: absolute;
	right: 0.5em;
	margin: auto;
	transition: 0.3s;
}
.juniorsupportList dl:hover dt::after{
	right: 10px;
}
.juniorsupportList dl a{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 999;
}
.juniorsupportList dl:hover{
	opacity: 0.5;
}

@media screen and (max-width:840px) {
	.juniorsupportList dl dt::after {
		right: -0.3em;
	}
	.juniorsupportList dl:hover dt::after{
		right: -0.3em;
	}
}
@media screen and (max-width:599px) {
	.juniorsupportArea{
		padding: 50px 0 40px;
	}
	.juniorcourseList.mb80{
		margin-bottom: 50px;
	}
	.juniorcourseList ul{
		margin-bottom: 20px;
		padding: 20px;
	}
	.juniorsupportList dl{
		width: 100%;
		margin-bottom: 20px;
	}
	.juniorsupportList dl dt{
		font-size: 2rem;
	}
}

/* time
------------------------------------------ */
.juniortimeArea{
	padding: 100px 0;
}
.juniortimeArea ul.Important {
	margin-left: 5em;
}
.juniortimeTable{
	margin-bottom: 30px;
}
.juniortimeTable .tableType01 th{
	padding: 0 0.5em;
	font-family: "Jost", sans-serif;
	font-size: clamp(2rem, 2vw, 2.2rem);
	font-weight: 400;
}

@media screen and (max-width:1000px) {
	.juniortimeArea ul.Important{
		margin-left: 0;
	}
}
@media screen and (max-width:599px) {
	.juniortimeArea{
		padding: 50px 0;
	}
}

/* price
------------------------------------------ */
.juniorpriceArea{
	padding: 100px 0 60px;
	background-color: var(--bg01-color);
}
.juniorpriceArea .topTxt{
	margin-bottom: 30px;
}
.juniorpriceArea ul.Important{
	width: fit-content;
	margin: 0 auto;
}
.juniorpriceList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 30px auto 50px;
}
.juniorpriceList ul{
	width: 48%;
}
.juniorpriceList_1 ul{
	width: 32.5%;
}
.juniorpriceList ul li:first-child{
	padding: 1em 0.5em;
	background-color: var(--sub-color);
	border-radius: 20px 20px 0 0;
	text-align: center;
}
.juniorpriceList ul li:first-child span{
	display: block;
	width: fit-content;
	margin: 0 auto;
	padding: 0.3em 1.5em;
	background-color: #fff;
	border-radius: 3em;
	color: var(--sub-color);
	font-size: clamp(1rem, 1.6vw, 1.6rem);
	line-height: 1.4;
}
.juniorpriceList ul li:first-child p{
	/* padding: 0.5em 0 0.5em; */
	font-size: clamp(2rem, 2.6vw, 2.2rem);
	font-weight: 600;
	color: #fff;
	line-height: 1.3;
}
.juniorpriceList ul li:last-child{
	padding: 1.4em 2em;
	background-color: #fff;
	border-radius: 0 0 20px 20px;
}
.juniorpriceList .tableType01 th{
	width: 40%;
	font-size: clamp(2rem, 2.8vw, 2.4rem);
	font-weight: 500;
	background-color: var(--main-color);
}
.juniorpriceList_1 .tableType01 th {
	font-size: clamp(1.8rem, 2vw, 2.2rem);
}
.juniorpriceList .tableType01 td {
	font-size: clamp(1.6rem, 2vw, 2rem);
	font-weight: bold;
	border-color: var(--main-color);
	color: var(--txt-color);
}
.juniorpriceList .tableType01 td span{
	padding-right: 0.1em;
	font-family: "Jost", sans-serif;
	font-size: clamp(2rem, 2vw, 2.4rem);
	font-weight: 500;
}
/* .juniorpriceList_1 .tableType01 td span {
	font-size: clamp(2.6rem, 2vw, 3.4rem);
} */

@media screen and (max-width:1000px){
	/* .juniorpriceList ul li:first-child span {
		padding: 0.3em;
		line-height: 1.4;
	} */
	.juniorpriceArea ul.Important {
		margin: 0 auto;
	}
	.juniorpriceList_1 li:first-child p{
		line-height: 1.2;
	}
	.juniorpriceList_1 ul li:last-child{
		padding: 0.5em;
	}
}
@media screen and (max-width:599px) {
	.juniorpriceArea {
		padding: 50px 0 30px;
	}
	.juniorpriceList{
		margin: 30px auto;
	}
	.juniorpriceList ul li:last-child {
		padding: 20px;
	}
	.juniorpriceList ul li:first-child span{
		font-size: 1.4rem;
	}
	.juniortimeTable{
		overflow-x: auto;
		display: block;
	}
	/* .juniorpriceList_1 .tableType01 th {
		font-size: clamp(2.2rem, 2vw, 2.6rem);
	} */
	/* .juniorpriceList_1 .tableType01 td span{
		font-size: clamp(3rem, 2vw, 3.4rem);
	} */
	.juniortimeTable .tableType01 th,
	.juniortimeTable .tableType01 td{
		white-space: nowrap;
	}
	.juniorpriceList ul{
		width: 100%;
	}
	.juniorpriceList_1 ul {
		width: 100%;
	}
	.juniorpriceList ul:first-child{
		margin-bottom: 20px;
	}
	.juniorpriceArea ul.Important{
		margin: 0;
	}
}

/* contact
------------------------------------------ */
.juniorcontactArea{
	padding: 100px 0 75px;
}
.juniorcontactBtn div img{
	width: 100%;
}
.juniorcontactBtn div:hover{
	opacity: 0.5;
	transition: .3s;
}
.juniorcontactBtn ul{
	display: flex;
	justify-content: center;
	/* justify-content: space-between; */
	flex-wrap: wrap;
	column-gap: 4%;
	margin-top: 65px;
}
.juniorcontactBtn ul li{
	width: 48%;
	aspect-ratio: 57 / 14;
	border-radius: 10px;
	transition: all 0.2s;
}
.juniorcontactBtn ul li.juniorcontactBtn-small-student{
	background: url(./images/juniorcontact_btn01.png) no-repeat;
	background-size: cover;
}
.juniorcontactBtn ul li.juniorcontactBtn-small-parent{
	background: url(./images/juniorcontact_btn02.png) no-repeat;
	background-size: cover;
}
.juniorcontactBtn ul li a{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	font-size: clamp(1.5rem, 2.1vw, 2.2rem);
	font-weight: 600;
	text-decoration: none;
	color: #fff;
}
.juniorcontactBtn ul li:hover{
	opacity: 0.5;
}
.juniorcontactBtn ul li a::after {
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;
	border: 0;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
	position: absolute;
	right: 1.2em;
	margin: auto;
	transition: .3s;
}
.juniorcontactBtn ul li a:hover::after{
	right: 1em;
}
.juniorcontactBtn ul li a span{
	padding-left: 4em;
	line-height: 1.4;
}

@media screen and (max-width:599px) {
	.juniorcontactArea{
		padding: 50px 0;
	}
	.juniorcontactBtn ul{
		margin-top: 20px;
	}
	.juniorcontactBtn ul li {
		width: 100%;
	}
	.juniorcontactBtn ul li:first-child{
		margin-bottom: 20px;
	}
	.juniorcontactBtn ul li a{
		font-size: min(3.6vw, 2.2rem);
	}
	.juniorcontactBtn ul li a span{
		padding-left: 6em;
	}
	/* .juniorcontactBtn ul li a::after {
		content: none;
	} */
}
@media screen and (max-width:320px){
	.juniorpriceList .tableType01 td span{
		font-size: 2.6rem;
	}
}


/* features
========================================== */

/* intro
------------------------------------------ */
.featuresintroList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 20px;
}
.featuresintroList dl{
	width: 25%;
}
.featuresintroList dl dt{
	position: relative;
	margin-bottom: 20px;
	padding: 1em 0em;
	color: #fff;
	font-size: clamp(1.6rem, 2vw, 2.4rem);
	font-weight: 700;
	background-color: var(--main-color);
}
.featuresintroList dl:nth-child(2) dt{
	background-color: var(--green-color);
}
.featuresintroList dl:nth-child(3) dt{
	background-color: var(--pink01-color);
}
.featuresintroList dl:last-child dt{
	background-color: var(--blue-color);
}
.featuresintroList dl dt::before{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 14px 0 14px 12px;
	border-color: transparent transparent transparent var(--main-color);
	position: absolute;
	top: calc(100% + 6px);
	left: calc(50% - 7px);
	bottom: 0;
	margin: auto;
	transform: rotate(90deg);
}
.featuresintroList dl:nth-child(2) dt::before{
	border-color: transparent transparent transparent var(--green-color);
}
.featuresintroList dl:nth-child(3) dt::before{
	border-color: transparent transparent transparent var(--pink01-color);
}
.featuresintroList dl:last-child dt::before{
	border-color: transparent transparent transparent var(--blue-color);
}
.featuresintroList dl dd{
	position: relative;
	font-size: clamp(1.8rem, 2vw, 2.2rem);
	font-weight: 700;
	color: var(--main-color);
}
.featuresintroList dl:nth-child(2) dd{
	color: var(--green-color);
}
.featuresintroList dl:nth-child(3) dd{
	color: var(--pink01-color);
}
.featuresintroList dl:last-child dd{
	color: var(--blue-color);
}
.featuresintroList dl dd > span{
	display: inline-block;
	position: relative;
}
.featuresintroList dl dd > span::before{
	content: "";
	position: absolute;
	top: 1em;
	right: 100%;
	width: 1.35em;
	height: 2px;
	transform: rotate(60deg);
	box-sizing: border-box;
	background-color: var(--main-color);
}
.featuresintroList dl dd > span::after{
	content: "";
	position: absolute;
	top: 1em;
	left: 100%;
	width: 1.35em;
	height: 2px;
	transform: rotate(-60deg);
	box-sizing: border-box;
	background-color: var(--main-color);
}
.featuresintroList dl:nth-child(2) dd > span::before,
.featuresintroList dl:nth-child(2) dd > span::after{
	background-color: var(--green-color);
}
.featuresintroList dl:nth-child(3) dd > span::before,
.featuresintroList dl:nth-child(3) dd > span::after{
	background-color: var(--pink01-color);
}
.featuresintroList dl:last-child dd > span::before,
.featuresintroList dl:last-child dd > span::after{
	background-color: var(--blue-color);
}

@media screen and (max-width:1000px) {
	.featuresInner {
		padding: 0;
	}
	.featuresintroList dl dd::before {
		left: 0;
	}
	.featuresintroList dl dd::after {
		right: 0;
	}
}
@media screen and (max-width:840px){
	.featuresintroList dl dd{
		font-size: clamp(1.4rem, 1.9vw, 1.6rem);
	}
}
@media screen and (max-width:599px){
	.featuresintroList dl {
		width: 50%;
		margin-bottom: 20px;
	}
	.featuresintroList dl dd{
		font-size: 1.5rem;
	}
}
@media screen and (max-width:360px) {
	.featuresintroList dl {
		width: 100%;
	}
}

/* kobetsuList
------------------------------------------ */
.kobetsuList div{
	justify-content: center;
	padding: 2em 3em 2.5em;
}
@media screen and (max-width:1000px) {
	.kobetsuList div {
		padding: 1.5em 1.3em 2em;
	}
}

/* support
------------------------------------------ */
.featuressupportList dl{
	width: 100%;
	margin-bottom: 40px;
	padding: 2em;
}
.featuressupportList.juniorsupportList dl:hover{
	opacity: 1;
}
.featuressupportList dl dt{
	margin: 0;
}
.featuressupportList dl dt::after {
	content: none;
}
.featuressupportList dl dd{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	background: #fff;
	margin-top: 20px;
	padding: 2em;
	border-radius: 10px;
}
.featuressupportList dl dd div:first-child{
	width: 30%;
}
.featuressupportList dl dd div:last-child {
	width: 70%;
	padding-left: 2em;
}
.featuressupportList dl dd p{
	line-height: 1.6;
}
.featuressupportList.juniorsupportList{
	flex-direction: column;
}

@media screen and (max-width:840px){
	.featuressupportList dl{
		padding: 2em 1em;
	}
	.featuressupportList dl dd p{
		margin-top: 0;
	}
}
@media screen and (max-width:599px){
	.featuressupportList dl{
		width: 100%;
		margin-bottom: 20px;
	}
	.featuressupportList dl dd{
		padding: 2em 1em;
	}
	.featuressupportList dl dd div:first-child,
	.featuressupportList dl dd div:last-child{
		width: 100%;
	}
	.featuressupportList dl dd div:first-child{
		margin-bottom: 20px;
	}
	.featuressupportList dl dd div:last-child{
		padding-left: 0;
	}
}

/* contact
------------------------------------------ */
.featurescontactBtn{
	position: relative;
	width: 100%;
	max-width: 850px;
	margin-left: auto;
	margin-right: auto;
	transition: all 0.2s;
}
.featurescontactBtn:hover{
	opacity: 0.5;
}
.featurescontactBtn img{
	width: 100%;
}
.featurescontactBtn a{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
.featurescontactBtn ul{
	justify-content: center;
}
.juniorcontactBtn{
	position: relative;
	margin-left: auto;
	margin-right: auto;
}
.juniorcontactBtn img{
	width: 100%;
}
.featurescontactBtn a{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
/* .juniorcontactBtn ul{
	justify-content: center;
} */
.juniorcontactBtn-large {
	max-width: 850px;
	margin: 0 auto;
}
.juniorcontactBtn-large a {
	display: block;
}


/* success
========================================== */
.successArea.sub{
	margin: 80px auto 0;
}
.successList.sub{
	padding: 0;
}
.successList.sub dl{
	width: 48.5%;
	margin-bottom: 40px;
}
.successvoiceList{
	display: flex;
	flex-wrap: wrap;
	column-gap: 1em;
	row-gap: 1.6em;
}
.successvoiceItem{
	width: calc((100% - 1em * 2) / 3);
	background: #fff;
	border: 2px solid var(--sub-color);
	/* border: 1px solid var(--border-color); */
	border-radius: 10px;
}
.successvoiceList div{
	padding: 0;
}
.successvoiceItem dl{
	margin-bottom: 0;
	padding: 1.5em 1.5em 1.8em;
}
.successvoiceItem dl dt{
	margin: 0 auto 0.8em;
	text-align: left;
	font-size: clamp(2rem, 2.1vw, 2.2rem);
	font-weight: 700;
	line-height: 1.6;
	text-decoration: underline 3px solid var(--point-color);
	text-underline-offset: 5px;
}
.successvoiceList-parent .successvoiceItem dl dt{
	text-decoration: underline 3px solid var(--main-color);
}

.successvoiceItem dl dd{
	text-align: left;
	line-height: 1.6;
}
/* .successvoiceList.listType02_1 dl dt{
	padding-left: 0.5em;
} */
.successvoiceList.listType02_1 dl dt span{
	padding: 0;
}
.successvoiceList.listType02_1 dl dd{
	/* padding-left: 0.8em; */
	line-height: 1.5;
}
.successpassImg img{
	width: 100%;
}
.successArea.sub .successImg{
	max-width: 850px;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width:840px) {
	.successvoiceItem{
		width: calc((100% - 1em * 1) / 2);
	}
}
@media screen and (max-width:599px) {
	.successArea.sub {
		margin: 50px auto 0;
	}
	.successList.sub dl{
		width: 100%;
		margin-bottom: 20px;
	}
	/* .successvoiceList dl {
		padding: 1.5em 1.5em 2em;
	} */
	.successvoiceItem{
		width: 100%;
	}
}


/* classroom
========================================== */
.classroomimgList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	column-gap: 1.5em;
	row-gap: 1.5em;
}
.classroomimgList div{
	width: calc((100% - 1.5em * 2) / 3);
}
.classroomimgList div img{
	width: 100%;
	border-radius: 12px;
}
.trialArea.sub .trialList{
	align-items: stretch;
}
/* .trialArea.sub .trialList div,
.trialArea.sub .trialList div:nth-child(2){
	align-items: flex-start;
	padding: 2.4em 2em 2em;
} */
/* .trialArea.sub .trialList .trialListBox{
	align-items: flex-start;
	padding: 0 1.8em;
} */
.trialArea.sub .trialList div::before {
	top: 0.4em;
}
/* .trialArea.sub .trialList div dl dt,
.trialArea.sub .trialList div dl dd{
	width: 100%;
} */
/* .trialArea.sub .trialList div dl dt{
	display: inline-block;
	margin-bottom: 1.8em;
	padding-left: 3em;
	font-size: clamp(2.2rem, 2vw, 2.6rem);
	font-weight: 700;
	line-height: 1;
} */
/* .trialArea.sub .trialList div:nth-child(2) dl dt{
	margin-bottom: 0.5em;
} */
/* .trialArea.sub .trialList div dl dt span {
	margin-left: 5px;
	display: inline-block;
} */
.accessAreaMap{
	display: flex;
	justify-content: space-between;
	row-gap: 1.6em;
}
.accessAreaMap .gmap{
	width: calc(100% - (360px + 2em));
	aspect-ratio: 50/35;
}
.accessAreaMap .gmap iframe{
	width: 100%;
	height: 100%;
	border-radius: 10px;
}
.classroomTel{
	width: 360px;
}
.classroomTel ul li{
	font-size: clamp(1.5rem, 1.8vw, 1.6rem);
	font-weight: 600;
}
.classroomTel .time{
	margin-bottom: 1em;
}
.classroomTel ul li span.point{
	display: block;
	width: fit-content;
	margin-bottom: 0.5em;
	padding: 0.15em 1.2em 0.1em;
	font-size: 1.6rem;
	font-weight: 700;
	background-color: var(--main-color);
	color: #fff;
	border-radius: 3em;
}
.classroomTel ul li .num{
	padding: 0 3px;
	font-family: "Jost", sans-serif;
}
.classroomTel ul li.tel{
	line-height: 1.4;
}
.classroomTel ul li.tel a {
	position: relative;
	padding-left: 1em;
	font-family: "Jost", sans-serif;
	font-size: clamp(3rem, 2vw, 3.4rem);
	font-weight: 500;
	color: var(--main-color);
}
.classroomTel ul li.tel a::before {
	content: '';
	position: absolute;
	top: 1em;
	left: 0;
	width: 0.8em;
	height: 100%;
	background: url(./images/classroom_tel_icon.png) no-repeat;
	background-size: contain;
}
.classmessageList dl{
	padding: 60px;
}
.classmessageList .classmessageItem {
	display: flex;
	column-gap: 3em;
	row-gap: 1.5em;
	aspect-ratio: auto;
	background: url(./images/juniorcourseList_bg.png) no-repeat;
}
.classmessageList .classmessageItemImg {
	width: 40%;
	max-width: 300px;
	margin-bottom: 0;
}
.classmessageList .classmessageItemImg img {
	width: 100%;
}
.classmessageItemDesc {
	width: calc((100% - (40% - 3.5em)));
}


@keyframes infinity-scroll-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
.classimgScroll .scroll-infinity__wrap {
	display: flex;
	overflow: hidden;
}
.classimgScroll .scroll-infinity__list {
	display: flex;
	list-style: none;
	padding: 0
}
.classimgScroll .scroll-infinity__list--left {
	animation: infinity-scroll-left 120s infinite linear 0.5s both;
}
.classimgScroll .scroll-infinity__item {
	width: calc(100vw / 6);
}
.classimgScroll .scroll-infinity__item>img {
	width: 100%;
}

@media screen and (max-width:1000px) {
	/* .trialArea.sub .trialList div,
	.trialArea.sub .trialList div:nth-child(2){
		padding: 1.6em 2em 2em;
	} */
	/* .trialArea.sub .trialList div dl dt{
		padding-left: 2em;
	}
	.trialArea.sub .trialList div dl dt span{
		font-size: 1.6rem;
	} */
}
@media screen and (max-width:840px){
	/* .trialArea.sub .trialList div,
	.trialArea.sub .trialList div:nth-child(2){
		padding: 1.6em 1em 2em;
	}
	.trialArea.sub .trialList div dl dt{
		padding-left: 2.5em;
	}
	.trialArea.sub .trialList div:nth-child(2) dl dt{
		margin-bottom: 0.3em;
	} */
	.accessAreaMap{
		flex-direction: column;
	}
	.accessAreaMap .gmap{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}
	.classroomTel{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}
	.classmessageList dl{
		padding: 30px;
	}
	.classimgScroll .scroll-infinity__item {
		width: calc(100vw / 3);
	}
	.classmessageList .classmessageItem {
		flex-direction: column;
	}
	.classmessageList .classmessageItemImg {
		width: 100%;
		max-width: 300px;
		margin: 0 auto;
	}
	.classmessageList .classmessageItemDesc {
		width: 100%;
	}
}
@media screen and (max-width:599px){
	.classroomimgList div{
		width: 100%;
		max-width: 340px;
		margin: 0 auto;
	}
	/* .trialArea.sub .trialList div{
		margin-bottom: 20px;
		padding: 1.8em 20px 20px;
	}
	.trialArea.sub .trialList div:nth-child(2){
		padding: 1.2em 20px 20px;
	} */
	.trialArea.sub .trialList div::before{
		left: 0.6em;
	}
	.trialArea.sub .trialList div dl dt,
	.trialArea.sub .trialList div:nth-child(2) dl dt{
		margin-bottom: 0.8em;
	}
	.classimgScroll .scroll-infinity__item {
		width: calc(100vw / 1);
	}
}

.messageList{
	display: flex;
	flex-wrap: wrap;
	column-gap: 5%;
	row-gap: 2.5em;
	margin-bottom: 80px;
}
.messageItem{
	width: calc((100% - 5%) / 2);
	border: 1px solid var(--border-color);
	border-radius: 12px;
	background: url(./images/juniorcourseList_bg.png) no-repeat;
}
.messageItemWrap{
	display: flex;
	flex-direction: column;
	row-gap: 1.8em;
	padding: 2.2em;
}
.messageItemImage{
	width: 85%;
	margin: 0 auto;
}
.messageItemImage img{
	width: 100%;
	border-radius: 5px;
}
.messageItemTtl{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 0.5em;
	row-gap: 0.5em;
	margin-bottom: 0.8em;
	font-size: 2.2rem;
	line-height: 1.2;
}
.messageItemTtl .position{
	padding: 0.1em 0.7em 0.2em;
	background-color: var(--sub-color);
	color: #fff;
	font-size: 0.8em;
	border-radius: 3em;
}
.messageItemTxt{
	line-height: 1.6;
}

@media screen and (max-width:840px){
	.messageItemWrap{
		padding: 1.5em;
	}
	.messageItemImage{
		width: 100%;
		max-width: 400px;
	}
}

@media screen and (max-width:599px){
	.messageList{
		margin-bottom: 50px;
	}
	.messageItem{
		width: 100%;
	}
	.messageItemTtl{
		font-size: 2rem;
	}
}

/* news
========================================== */
.newsArea{
	padding: 50px 0 70px;
}
.newsArea h2{
	margin-bottom: 1.6em;
}
.newsList ul{
	display: flex;
	align-items: flex-start;
	margin-bottom: 15px;
	padding: 1em 0;
	border-bottom: 1px solid var(--sub-color);
}
.newsList ul li{
	padding: 0 1em;
}
.newsList ul li a{
	color: var(--txt-color);
	text-decoration: none;
}
.newsList ul li a:hover{
	text-decoration: 2px solid underline var(--point-color);
	text-underline-offset: 5px;
}
.newsList .date,
.newsInfo .date{
	font-family: "Jost", sans-serif;
	font-weight: 600;
	color: var(--sub-color);
	line-height: 2;
}
.newsList .category_list,
.newsInfo .category_list{
	display: flex;
	flex-wrap: wrap;
	column-gap: 0.6em;
	row-gap: 0.4em;
}
.newsList ul .category > a,
.newsList ul .category > span,
.newsInfo .category{
	display: inline-block;
	padding: 0 0.8em;
	color: #fff;
	font-size: 0.9em;
	font-weight: 600;
	background: var(--sub-color);
	border-radius: 3em;
	transition: all 0.2s;
}
.newsList .newsItem_info{
	display: flex;
	flex-wrap: wrap;
	column-gap: 1em;
	row-gap: 0em;
}
.newsList ul .category > a:hover {
	opacity: 0.5;
	text-decoration: none;
}
.newsInfo .category a{
	color: #fff;
	text-decoration: none;
	transition: all 0.2s;
}
.newsInfo .category a:hover{
	opacity: 0.5;
}
.newsList ul li.txt{
	width: 75%;
	padding: 0 1em;
	line-height: 1.6;
}
.newsArea .btnMore{
	padding-top: 10px;
}

/* news（下層ページ）
----------------------------------------------- */
.newsBox{
	margin-bottom: 50px;
	padding: 40px 30px;
	border: 1px solid var(--sub-color);
	box-sizing: border-box;
	border-radius: 10px;
}
.newsTtl{
	margin-bottom: 1.8em;
	padding: 0.3em 1em;
	font-weight: bold;
	font-size: clamp(1.8rem, 3vw, 2rem);
	background-color: var(--sub-color);
	color: #fff;
	border-radius: 10px;
}
.newsInfo{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding-left: 1em;
	margin-bottom: 1.2em;
}
.newsInfo .date{
	margin-right: 1em;
}
.newsTxt{
	padding-left: 1em;
	margin-bottom: 2em;
}
.newsSignature{
	padding: 1.5em;
	background: var(--blue-bg-color);
	border-radius: 10px;
}
.newsSignature .name{
	margin-bottom: 20px;
	font-weight: 500;
	font-size: 1.4rem;
}
.newsSignature .address {
	line-height: 1.6;
}
.newsSignature .address a{
	margin-right: 0.5em;
	font-family: "Jost", sans-serif;
	font-size: clamp(2.2rem, 3vw, 2.6rem);
	font-weight: 500;
	color: var(--main-color);
	text-decoration: none;
}
.newsSignature .name span{
	font-size: clamp(1.8rem, 2.3vw, 2rem);
	font-weight: 600;
}
/* .newsSignature .address span{
	font-size: 1.6rem;
} */
.newsSignature .tel{
	display: inline-block;
	position: relative;
}
.newsSignature .tel::before{
	content: '';
	display: inline-block;
	position: absolute;
	top: 0.8em;
	right: calc(100% + 0.3em);
	width: 0.8em;
	height: 0.8em;
	background-image: url(./images/classroom_tel_icon.png);
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}
@media screen and (max-width:1200px) {
	.newsList ul{
		display: block;
	}
	.newsList ul li.txt{
		width: 100%;
		padding: 0.5em 1em 0;
	}
	/* .newsList ul li.date,
	.newsList ul li.category{
		display: inline-block;
	} */
	.newsList ul li.date{
		padding-right: 0;
	}
}
@media screen and (max-width:599px){
	.newsArea {
		padding: 0 0 50px;
	}
	.topNewsArea {
		padding: 50px 0 50px;
	}
	.newsArea h2{
		line-height: 1;
	}
	.newsArea h2 p{
		margin-top: 0.6em;
	}
	.newsBox{
		margin-bottom: 30px;
		padding: 0;
		border: none;
	}
	.newsInfo,
	.newsTxt,
	.newsSignature span{
		padding-left: 0;
	}
	.newsSignature{
		padding: 1.2em 1em;
	}
	.newsSignature .address span{
		display: block;
	}
}


/* contact
========================================== */
.contactArea{
	margin-top: 80px;
}
.contactArea .trialList div{
	padding: 1.5em 1.5em 1.5em 7em;
	border: 2px solid var(--main-color);
}
.contactIntro .txt {
	font-size: clamp(1.6rem, 1.9vw, 1.8rem);
	text-align: center;
}
.contactList{
	line-height: 2;
}
.contactList_1{
	display: flex;
}
.contactTel{
	margin-top: 50px;
}
.contactBody {
	display: flex;
	flex-direction: column;
	row-gap: 0.5em;
	align-items: center;
}
.contactBodyList {
	display: flex;
	flex-wrap: wrap;
	/* flex-direction: column; */
	align-items: center;
	justify-content: center;
	column-gap: 1.2em;
	row-gap: 0.5em;
}
.contactTel .ttlType01 {
	font-size: min(4.5vw, 2.2rem);
	margin-bottom: 0.8em;
	padding: 0.6em 0.6em;
}
.contactTel h3{
	font-size: clamp(2.2rem, 3.6vw, 3rem);
	font-weight: 700;
	line-height: 2;
}
.contactTel ul{
	align-items: center;
}
.contactTel ul li{
	line-height: 1.4;
}
.contactTel ul li.tel a{
	position: relative;
	padding-left: 1em;
	font-family: "Jost", sans-serif;
	font-size: clamp(3rem, 2vw, 3.4rem);
	font-weight: 500;
	color: var(--main-color);
}
.contactTel ul li.tel a::before {
	content: '';
	position: absolute;
	top: 1em;
	left: 0;
	width: 0.8em;
	height: 100%;
	background: url(./images/classroom_tel_icon.png) no-repeat;
	background-size: contain;
}
.contactTel ul li.time{
	display: flex;
	align-items: center;

	color: var(--txt-color);
}
.contactTel ul li.time .num{
	font-family: "Jost", sans-serif;
	font-size: clamp(2rem, 2.6vw, 2.6rem);
	line-height: 1;
}
.contactTel ul li span{
	font-size: 1.6rem;
}
.contactTel ul li span:last-child{
	padding-left: 5px;
	font-weight: 600;
}
.contactTel ul li span.point{
	display: inline-block;
	padding: 0.15em 0.8em 0.2em;
	font-weight: 700;
	background-color: var(--main-color);
	border-radius: 20px;
	color: #fff;
}
.contactPrivacy{
	margin-top: 50px;
	margin-bottom: 30px;
	padding: 1em;
	border: 1px solid var(--bg02-color);
	text-align: center;
}
.contactPrivacy .txt{
	width: fit-content;
	margin: 0 auto;
	text-align: left;
}
.contactPrivacy h2{
	margin-bottom: 20px;
	font-size: 2rem;
	font-weight: 700;
}
.contactPrivacy p{
	line-height: 2;
}
.contactPrivacy p [type="checkbox"] {
	margin-right: 10px;
	margin-top: -4px;
}

@media screen and (max-width:1000px){
	.contactArea .trialList div{
		padding: 1.5em 1.5em 1.5em 5em;
	}
}
@media screen and (max-width:840px) {
	.contactArea .trialList div {
		padding: 1.5em 1.5em 1.5em 4em;
	}
	.contactIntro .txt {
		text-align: left;
	}
}
@media screen and (max-width:599px) {
	.contactArea .trialList div {
		padding: 1.5em 1.5em 1.5em 6em;
	}
	.contactPrivacy p{
		text-align: left;
	}
	.contactTel ul li.time {
		flex-direction: column;
		row-gap: 0.5em;
	}
}
@media screen and (max-width:360px) {
	.contactTel ul li.time{
		display: flex;
	}
}


/* sitemap
========================================== */
.sitemapList{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	margin-top: 50px;
}
.sitemapList ul{
	width: 35%;
}
.sitemapList ul li.set{
	padding: 1.2em 2em 0.6em;
	font-weight: 600;
}
.sitemapList ul li.set:hover {
	background-color: #fff;
}
.sitemapList ul li ul{
	margin-top: 1em;
	padding-left: 1em;
}
.sitemapList ul li ul{
	position: relative;
	width: 100%;
}

@media screen and (max-width: 1000px){
	.sitemapList ul {
		width: 45%;
	}
}
@media screen and (max-width: 840px){
	.sitemapList ul li ul{
		padding-left: 0;
	}
}
@media screen and (max-width: 599px){
	.sitemapList ul {
		width: 100%;
	}
}
@media screen and (max-width: 360px) {
	.sitemapList ul li a.br{
		line-height: 1.5;
	}
}


/* privacypolicy
========================================== */
.privacypolicyArea h2{
	overflow: hidden;
	letter-spacing: 1px;
	position: relative;
	line-height: 1.2;
	margin: 20px auto 10px;
	padding: 0.6em 0.8em;
	background-color: var(--sub-color);
	border-radius: 30px;
	color: #fff;
	font-weight: 700;
	font-size: clamp(1.8rem, 3vw, 2rem);
	text-align: center;
}
.privacypolicyArea div{
	padding: 0 1em
}
.privacypolicyArea p{
	margin-bottom: 10px;
}
.privacypolicyArea ul{
	padding-left: 1em;
}
.privacypolicyArea ul.nameList{
	margin-top: 20px;
	text-align: right;
}
.privacypolicyArea ul.nameList li.name{
	font-size: 1.8rem;
	font-weight: 600;
}


/* 共通
========================================== */
.postSlider{position: relative;padding-top: 50px!important;}
.postSlider ul li .imgBox {
	margin-bottom: 10px;
	box-sizing: border-box;
}
.postSlider ul li .imgBox img{
	width: 100%;
}
.postSlider ul li .imgBox a{
	display: block;
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}
.postSlider ul li .imgBox a::before{
	content: "";
	display: block;
}
.postSlider ul li .imgBox a img{
	z-index: 1;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	object-fit: cover;
	transition: 0.5s;
}
.postSlider ul li:hover .imgBox {border-color: var(--sub-color);}
.postSlider ul li .imgBox a:hover img{
	opacity: 1;
	transform: scale(1.1);}

.postSlider ul li p+p{margin-top: 1em;}
.postSlider ul li .ttl{line-height: 1.5;font-weight: 500;}
.postSlider ul li .place{font-size: 1.4rem;text-align: right;}


/* footer
========================================== */
footer{background-color: var(--bg01-color);}
.footerWrap{
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	padding: 100px 1em 60px;
	max-width: 1200px;
}
.footerInfo{
	margin-bottom: 20px;
	width: 400px;
}
.footerInfo .logo{width: 260px; margin-bottom: 20px;}
.footerInfo .logo img{width: 100%; height: auto;}
.footerInfo .txt{
	font-size: clamp(1.4rem, 1.9vw, 1.6rem);
	line-height: 1.5;
}
.footerInfo .tel{
	margin: 10px auto 20px;
	padding: 1.2em 0 1em;
	background: #fff;
	text-align: center;
	border-radius: 10px;
}
.footerInfo .tel a{
	font-family: "Jost", sans-serif;
	font-size: clamp(1.8rem, 2vw, 2.2rem);
	font-weight: 500;
	text-decoration: none;
}
.footerInfo .num{
	position: relative;
	display: inline-block;
	margin-right: -1em;
	font-size: clamp(3.2rem, 4vw, 4rem);
	line-height: 1;
	font-weight: 500;
}
.footerInfo .num span {
	display: inline-block;
	position: relative;
}
.footerInfo .num span::before{
	content: '';
	display: inline-block;
	position: absolute;
	right: calc(100% + 0.2em);
	top: 50%;
	transform: translateY(-50%);
	width: 0.8em;
	height: 0.8em;
	background: url(./images/f_tel_icon.png) no-repeat;
	background-position: center;
	background-size: contain;
}
.footerInfo .tel .info > span{
	position: relative;
	top: -2px;
	margin-right: 0.5em;
	padding: 0.15em 1em 0.1em;
	color: #fff;
	font-size: clamp(1.3rem, 1.6vw, 1.6rem);
	font-weight: 700;
	border-radius: 11.5px;
	background: var(--sub-color);
}
.footerNaviWrap{
	width: 50%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.footerNavi{margin-bottom: 20px;}
.footerNavi_l{
	width: 55%;
}
.footerNavi_r{
	width: 45%;
}
.footerNavi li{
	margin-bottom: 1em;
}
.footerNavi li ul{
	margin-top: 1em;
	padding-left: 1em;
}
.footerNavi li ul li{
	width: 100%;
}
.footerNavi li a{
	position: relative;
	display: block;
	padding-left: 1.5em;
	text-decoration: none;
	font-size: clamp(1.4rem, 1.6vw, 1.6rem);
	font-weight: 700;
	color: var(--txt-color);
	line-height: 1.5;
}
.footerNavi li a::before {
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;
	border: 0;
	border-top: solid 3px var(--sub-color);
	border-right: solid 3px var(--sub-color);
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
}
/* .footerNavi li ul li a{
	font-weight: 500;
} */
.footerNavi li ul li a::before {
	border-top: solid 3px var(--blue01-color);
	border-right: solid 3px var(--blue01-color);
}
.footerNavi li a:hover{
	text-decoration: underline;
	text-underline-offset: 5px;
}
.copyright{
	padding: 1em 0;
	text-align: center;
	font-size: 1.2rem;
	font-weight: 500;
	color: var(--sub-color);
}

@media screen and (max-width: 1200px) {
	.footerWrap{
		padding: 50px 30px 10px;
		width: 100%;
	}
}
@media screen and (max-width: 1024px) {
	.footerLink{display: block;text-align: center;}
	.footerLink li:first-child{margin-right: 0;margin-bottom: 20px;}
}
@media screen and (max-width: 1200px) {
	.footerInfo{
		width: 40%;
	}

	/* .footerInfo .logo{
		width: 80%;
	} */
	.footerInfo .tel{
		padding: 1.2em 1em 1em;
	}
	.footerNaviWrap {
		width: 55%;
	}
}
@media screen and (max-width: 840px) {
	.footerInfo {
		width: 36%;
	}
	.footerInfo .logo{
		width: 90%;
		margin-bottom: 30px;
	}
	.footerInfo .tel{
		margin-bottom: 10px;
		padding: 0.8em 0.5em 0.4em;
	}
	.footerInfo .num{
		font-size: clamp(2.4rem, 3.6vw, 4rem);
		margin-bottom: 0.2em;
	}
	.footerInfo .num::before{
		left: 0.3em;
		width: 25px;
		height: 100%;
		background-size: contain;
	}
	.footerNaviWrap{
		width: 60%;
	}
	.footerNavi li ul{
		padding-left: 1em;
	}
	.footerNavi li{
		margin-bottom: 0.8em;
	}
}
@media screen and (max-width: 599px) {
	.footerWrap {
		flex-direction: column;
		padding-bottom: 20px;
	}
	.footerInfo {
		order: 2;
		text-align: center;
		width: 100%;
	}
	.footerInfo .logo {
		width: 90%;
		max-width: 260px;
		margin: 0 auto 30px;
	}
	.footerInfo .tel{
		width: 80%;
		margin: 0.5em auto;		
	}
	.footerNaviWrap {
		order: 1;
		width: 100%;
		margin-bottom: 30px;
	}
	.footerNavi{
		width: 100%;
		margin-bottom: 0;
	}
}
@media screen and (max-width: 360px) {
	.footerInfo .tel {
		width: 90%;
	}
}
@media screen and (max-width: 320px) {
	.footerInfo .logo {
		width: 100%;
	}
	.footerInfo .tel {
		width: 100%;
	}
}


/* pageTop
========================================== */
#pageTop{
	position:fixed;
	line-height: 1;
	right:20px;
	bottom:20px;
	z-index: 100;}
#pageTop a{
	display: block;
	position:relative;
	padding:20px;
	background-color:var(--main-color);
	box-sizing: border-box;
	color:#fff;
	font-size: 1.2rem;
	text-decoration: none;
	transition: all .3s;
}
#pageTop a::before{
	position:absolute;
	content: "";
	top:17px;
	left:50%;
	margin-left: -4px;
	width: 8px;
	height: 8px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	transition: all .3s;
	}
#pageTop:hover a{background-color: var(--sub-color);}
#pageTop:hover a::before{top:13px;}

@media screen and (max-width: 1200px) {
	#pageTop{
		right:0;}
}
@media screen and (max-width: 840px) {
	#pageTop{display: none!important}
}



/* breadcrumb
========================================== */
.breadcrumb{
	display: flex;
	align-items: center;
	padding-top: 1em;
	padding-bottom: 1em;
	margin: 0 auto;
	max-width: 1080px;
	line-height: 1;
}
.breadcrumb li{
	list-style-type: none;
	font-size: 1.4rem;
	font-weight: bold;
}
.breadcrumb li span{
	color: var(--sub-color);
}
.breadcrumb li:before {
	content: "/";
	padding: 0 1em;}
.breadcrumb li:first-child:before {content: none;}
.breadcrumb li a{
	text-decoration: none;
	color: #333;}
.breadcrumb li a:hover{text-decoration: underline;}

@media screen and (max-width: 1080px) {
	.breadcrumb{
		max-width: 100%;
		padding:1em 30px 1em;}
}
@media screen and (max-width: 840px) {
}
@media screen and (max-width: 599px) {
}
@media screen and (max-width: 599px) {
	.breadcrumb {
		padding: 1.2em 1em 1.2em;
	}
	.breadcrumb li{font-size: 1.2rem;}
}