@charset "utf-8";
@import url("base.css");

.ttl h2 { font-size: 18px; text-align: center;}
.ttl h2 img { width: 72%; max-width: 450px;}
.ttl h2 span{ display: block; padding-top: 18px; letter-spacing: 0.1rem;}
@media (max-width: 481px) {
	.ttl h2 { font-size: 16px;}
	.ttl h2 span{ padding-top: 6px;}
}

.btn-more { width: 60%; max-width: 250px; margin: 0 auto;}
.btn-more a { display: block; width: 100%; padding: 10px 0; background: #000; border: solid 1px #000; border-radius: 50px;
 color: #fff; font-size: 18px; letter-spacing: 0.1rem; text-align: center; text-decoration: none; transition: 0.3s ease;
}
.btn-more a:hover { background: #fff; color: #000;}
@media (max-width: 481px) {
	.btn-more a { padding: 8px 0; font-size: 14px;}
}

#kv { background: #b1bcb4}
#kv h1 { text-align: center;}
#kv h1 img { width: 100%; max-width: 1400px;}
#kv h1 img.sp { display: none;}
@media (max-width: 801px) {
	#kv h1 img.pc { display: none;}
	#kv h1 img.sp { display: block;}
}

#lead .inner-sct { padding: 40px 0 80px;}
#lead .logo { width: 30%; max-width: 130px; margin: 0 auto 30px;}
#lead .logo img { width: 100%;}
#lead .ttl { margin-bottom: 30px;}
#lead .read p { font-size: clamp(16px, 2.4vw,22px); line-height: 2; text-align: center;}
@media (max-width: 1001px) {
}
@media (max-width: 801px) {
	#lead .read p span { display: block;}
}
@media (max-width: 481px) {
	#lead .inner-sct { padding: 40px 0;}
	#lead .logo { margin-bottom: 20px;}
	#lead .read p { font-size: 14px;}
}


#feature { background: #f3f3f3;}
#feature .inner-sct { padding: 80px 0;}
#feature .ttl { margin-bottom: 20px;}
#feature .ctn { display: flex; justify-content: space-between; flex-wrap: wrap; width: 88%; max-width: 1080px; margin: 0 auto; }
#feature .box { position: relative; width: 50%; padding: 30px 20px;}
#feature .box .icn { position: absolute; left: 8%; top: -8px; width: 80px;}
#feature .box .icn img { width: 100%;}
#feature .box dl { width: 100%; height: 100%; background: #fff; }
#feature .box dl dt { }
#feature .box dl dt img { width: 100%;}
#feature .box dl dd { padding: 20px 30px; font-size: 18px; letter-spacing: 0.05rem; line-height: 1.8;}
#feature .box dl dd span { display: block; margin-bottom: 20px;
 color: #6a876f; font-size: clamp(18px,2.4vw,26px); font-weight: 700; letter-spacing: 0.05rem; line-height: 1.4; text-align: center;
}
@media (max-width: 1001px) {
	#feature .box { padding: 30px 12px;}
	#feature .box dl dd { padding: 20px; font-size: 16px;}
	#feature .box dl dd span { margin-bottom: 12px;}
}
@media (max-width: 801px) {
	#feature .ctn { display: block; max-width: 600px;}
	#feature .box { width: 100%; padding: 30px 0;}
	#feature .box .icn { left: 5%;}
	#feature .box dl dd { font-size: 14px;}
}
@media (max-width: 481px) {
	#feature .inner-sct { padding: 40px 0;}
	#feature .box { padding: 17px 0 21px;}
	#feature .box .icn { width: 50px;}
	#feature .box dl dd { font-size: 13px;}
}


#course .inner-sct { padding: 80px 0;}
#course .ttl { margin-bottom: 40px;}
#course .ctn { width: 88%; max-width: 1024px; margin: 0 auto;}
#course .ctn ul { display: flex; justify-content: space-between;}
#course .ctn ul li { width: 48.5%;}
#course .ctn ul li a { display: block; width: 100%; max-width: 480px; margin: 0 auto; transition: 0.3s ease; color: #000; text-decoration: none;}
#course .ctn ul li a:hover { opacity: 0.8;}
#course .ctn ul li dl { width: 100%;}
#course .ctn ul li dl dt {}
#course .ctn ul li dl dt img { width: 100%; transition: 0.3s ease;}
#course .ctn ul li dl dd { position: relative; padding: 20px 0; padding-left: 40px; font-size: 16px;}
#course .ctn ul li dl dd:before { content: ''; display: block; width: 30px; height: 30px;
 position: absolute; left: 0; top: 23px;
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"><path d="M25,1c13.23,0,24,10.77,24,24s-10.77,24-24,24S1,38.23,1,25,11.77,1,25,1M25,0C11.19,0,0,11.19,0,25s11.19,25,25,25,25-11.19,25-25S38.81,0,25,0h0Z"/><polygon points="30.22 15.81 28.81 17.22 35.59 24 12 24 12 26 35.59 26 28.81 32.78 30.22 34.19 39.42 25 30.22 15.81"/></svg>');
 background-size: 100% 100%; background-repeat: no-repeat; background-position: 50% 50%;
}
#course .ctn ul li dl dd span { display: block; margin-bottom: 5px; font-size: clamp(15px,2.3vw,21px); font-weight: 700;}
@media (max-width: 1001px) {
	#course .ctn ul li dl dd { padding: 12px; font-size: 14px;}
}
@media (max-width: 641px) {
	#course .ttl { margin-bottom: 30px;}
	#course .ctn ul { display: block;}
	#course .ctn ul li { width: 100%; padding: 15px 0;}
	#course .ctn ul li dl dd span { font-size: 18px;}
}
@media (max-width: 481px) {
	#course .inner-sct { padding: 40px 0;}
	#course .ttl { margin-bottom: 6px;}
	#course .ctn ul li dl dd { padding: 10px 0px 0; padding-left: 40px;}
	#course .ctn ul li dl dd:before { top: 20px;}
	#course .ctn ul li dl dd span { margin-bottom: 2px; font-size: 16px;}
}


#schedule { background: #f3f3f3;}
#schedule .inner-sct { padding: 80px 0;}
#schedule .ttl { margin-bottom: 30px;}
#schedule .ctn { width: 88%; max-width: 900px; margin: 0 auto 30px;}
#schedule .ctn ul li { padding: 10px 5px; border-bottom: dotted 1px #ccc;}
#schedule .ctn ul li:last-cihld { border-bottom: none;}
#schedule .ctn ul li time { display: inline-block; margin-right: 10px; line-height: 1.2;}
#schedule .ctn ul li span { display: inline-block; margin-right: 10px; padding: 0px 10px 2px; background: #c5a600; border-radius: 50px; line-height: 1.2; color: #fff;
}
#schedule .ctn ul li a { display: inline-block; margin-top: 5px; color: #000; text-decoration: none;}
#schedule .ctn ul li a:hover { text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px;}
@media (max-width: 1001px) {
}
@media (max-width: 801px) {
}
@media (max-width: 481px) {
	#schedule .inner-sct { padding: 40px 0;}
	#schedule .ttl { margin-bottom: 20px;}
	#schedule .ctn ul li { font-size: 14px;}
	#schedule .ctn ul li time { font-size: 12px;}
	#schedule .ctn ul li span { font-size: 12px;}
}


#voice .inner-sct { padding: 80px 0;}
#voice .ttl { margin-bottom: 30px;}
#voice .btn-more { margin-top: 30px;}
@media (max-width: 1001px) {
}
@media (max-width: 801px) {
}
@media (max-width: 481px) {
	#voice .inner-sct { padding: 40px 0;}
	#voice .ttl { margin-bottom: 12px;}
	#voice .btn-more { margin-top: 20px;}
}


#curriculum { background: #f3f3f3;}
#curriculum .inner-sct { padding: 80px 0;}
#curriculum .ttl {}
#curriculum .bloc { padding: 30px 0;}
#curriculum .ctn { width: 88%; max-width: 860px; margin: 0 auto;}
#curriculum .ctn .tit { position: relative; margin-bottom: 30px;}
#curriculum .ctn .tit h3 { position: relative; font-size: 26px; font-weight: 700; text-align: center;}
#curriculum .ctn .tit h3:after { content: ''; display: block; width: 100%; height: 2px; background: #6a876f; 
 position: absolute; left: 0; top: 50%; z-index: 1;
}
#curriculum .ctn .tit h3 span { position: relative; display: inline-block; padding: 0 20px; background: #f3f3f3; z-index: 2;}
#curriculum .ctn .txt { margin-bottom: 30px;}
#curriculum .ctn .txt p { letter-spacing: 0.075rem; line-height: 2.2;}
#curriculum .ctn .flex { display: flex; justify-content: space-between; width: 100%;}
#curriculum .ctn .point{ width: 460px;}
#curriculum .ctn .img { width: calc( 100% - 500px); max-width: 350px;}
#curriculum .ctn .point ul li { position: relative; margin-bottom: 5px; padding: 8px; padding-left: 60px; background: #fff;
 font-size: 18px; letter-spacing: 0.08rem; line-height: 1.4;
}
#curriculum .ctn .point ul li:before { content: ''; display: block; width: 12px; height: 12px; background: #c5a500; border-radius: 50%;
 position: absolute; left: 30px; top: 0.85em;
}
#curriculum .ctn .img figure img { width: 100%;}
@media (max-width: 1001px) {
}
@media (max-width: 801px) {
	#curriculum .ctn .point{ width: 380px;}
	#curriculum .ctn .img { width: calc( 100% - 400px);}
	#curriculum .ctn .point ul li { font-size: 16px;}
}
@media (max-width: 641px) {
	#curriculum .ctn .tit { margin-bottom: 20px;}
	#curriculum .ctn .txt p { line-height: 1.8;}
	#curriculum .ctn .flex { display: block;}
	#curriculum .ctn .point{ width: 100%; margin: 0 auto 30px;}
	#curriculum .ctn .img { width: 100%; margin: 0 auto;}
}
@media (max-width: 481px) {
	#curriculum .inner-sct { padding: 40px 0;}
	#curriculum .bloc { padding: 20px 0;}
	#curriculum .ctn .tit h3 { font-size: 17px;}
	#curriculum .ctn .tit h3:after { height: 1px;}
	#curriculum .ctn .tit h3 span { padding: 0 10px;}
	#curriculum .ctn .txt { margin-bottom: 20px;}
	#curriculum .ctn .txt p { font-size: 13px; letter-spacing: 0.05rem;}
	#curriculum .ctn .point ul li { margin-bottom: 3px; padding: 5px; padding-left: 40px; font-size: 14px;}
	#curriculum .ctn .point ul li:before { width: 10px; height: 10px; left: 15px; top: 0.85em;}
}