@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

/*全体の設定
---------------------------------------------------------------------------*/
body {
	background: #f5f5f5;
	color: #313131;
	margin: 0px;
	padding: 0px;
	font: 16px/1.6;
	font-family: "Arial","Noto Sans JP", sans-serif;
    font-feature-settings: "palt";
}
p{font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;}
.move{
position:relative;
width:100%;
padding-top:56.25%;

}
.move iframe{
position:absolute;
top:0;
width:100%;
height:100%;

}


/*ボタン*/


ul{
	margin-bottom:30px;
}
img {
	border: none;
	vertical-align: bottom;
	max-width: 100%;
}
input,textarea,select {
	font-size: 1em;
}
form {
	margin: 0px;
}


a {
	color: #555;	/*リンクテキストの色*/
	text-decoration: none;
}
a:hover {
	color: #006ddc;	/*マウスオン時の文字色（全体）*/
}
.main-btn a:hover img {
position : relative;
top : 3pt;
left : 3pt;
}

#container {
	width: 750px;	/*コンテナー幅*/
	background-color:#fff;
	border-left:1px solid #ccc;
	border-right: 1px solid #ccc;
	margin: 0 auto; }



.main-btn{
	text-align: center;
	margin-bottom: 20px;
}
.hogo{
	margin: 0 auto;
	font-size:90%;
	background-color:#eee;
	padding:20px;
	margin-bottom:20px;
	margin-top:20px;
}



h3.youtube_h{margin-top:1em;text-align:center;color:#0a50a7;font-size:2em;padding:20px 20px 0px 20px;}

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

	.hogo{
		font-size: 70%;
	}
}
.kiyaku {
	margin: 0 auto;
    height: auto;
    width: 80%;
    padding: 1em;
    font-size: 60%;
    color: #888;
    margin-bottom: 2%;

}
.kiyaku p{
	line-height: 1.6;
	font-size: 90%;
}
#form p{
	text-align: center;
	font-size: 110%;
    color: #363636;
    margin-top: 40px;
}






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

	.main-btn{
		width: 90%;
	    margin: 0 auto;
	    margin-bottom:20px;
	}
	#form p{
		font-size:  75%;
	}

}
section#naiyou .inner{
	margin-top: 10%;
	margin-bottom: 10%;
}
section#naiyou .inner .title{
	text-align: center;
	margin-top: 5%;
	margin-bottom: 6%;
}
section#naiyou .inner{
	text-align: center;
}

/* オンライン配信テキストコード2021/10/15 */
.naiyou-text, .img_text{
	margin: 20px 30px;
}
.naiyou-text img, .message img{
	float: right;
	margin-left: 3%;
	margin-bottom: 3%;
}
.naiyou-text p, .message p, .img_text p {
    line-height: 1.9;
    text-align: justify;
    color: #363636;
    margin-bottom: 3%;
    font-size: 18px;
}
.naiyou-text span.red, .voice-text span.red{
	font-weight: bolder;
    color: #d80011;
}
.naiyou-text span.red-big{
	font-weight: bolder;
    color: #d80011;
    font-size: 180%;
}
.naiyou-text span.under, .voice-text span.under{
	text-decoration: underline;
}
.naiyou-text span.gray{
	font-weight: bolder;
    color: #848484;
    font-size:  80%;
}
section#naiyou .line{
	text-align: center;
	margin-top: 5%;
}
.kansou{
	margin: 0 auto;
	width: 90%;
}
.kansou .title{
	background:#00a28a;
	color: white;
	padding: 10px 20px;
	margin-bottom: 3%;
}
.kansou .inner{
	padding:2%;
}
.kansou .inner p{
	margin-bottom:  26px;
	font-size: 85%;
	line-height: 1.8;
	text-align: justify;
}
.kansou .inner p span.big{
	font-size: 110%;
	font-weight: bold;
}
.kansou .inner p.color{
	color: #094990;
}
.live-text{
	margin-bottom: 70px;
}
.live-text p{
    margin-bottom: 30px;
}
.message{
	padding: 5%;
}
form{
	margin-top: 5%;
}
form input.button{
	width: 90%;
}

@media only screen and (max-width: 768px){
	.naiyou-text img, .message img{
		width: 45%;
	}
	section#naiyou .inner .title{
		margin: 0 auto;
		width: 95%;
		margin-bottom: 10%;
	}
	.naiyou-text ,.speaker_text{
		margin: 20px;
	}
	.naiyou-text p,  .message p{
		font-size: 16px;
	}
	.live-text{
		margin-bottom: 40px;
	}
	.live-text p{
		font-size: 85%;
	}
	.kansou .title{
		margin-bottom: 7%;
	}
	.kansou .inner p{
		font-size: 78%;
	}
	.voice-text p{
		font-size: 85%;
	}
	form input.button{
	width: 100%;
	}
}

#main {
clear:both;
margin: 0;}

.notice {
	width: 100%;
}
h2, h3, h4{
	text-align: center;
}
h2 {
	font-size:2rem;
	text-align: center;
	/*margin: 80px 0 40px 40px;
	border-left: 10px solid #0cb8df;
	padding-left: 10px;
	font-size: 200%;
	text-align: left;
	line-height: 1.4;
	color: #000;*/
}
h3{
	font-size:1.65rem;
}
h4{
	font-size: 1.2rem;
}
h2#shoukai{

	margin: 80px 0 40px 40px;
	border-left: 10px solid #0cb8df;
	padding-left: 10px;
	font-size: 200%;
	text-align: left;
	line-height: 1.4;
	color: #000;
}

.point { color: #eb6100;}



.order {
	width: 80%;
	margin: 0 auto 30px;
}


h1{
	text-align:center;
	color:#fff;
	font-size:42px;
	line-height:1.2;
	padding:0.5em;
}




/*-- 詳細部分 ---------------------------------*/

.youtube {
	width: 853px;
	margin: 0 auto;
	height: auto;
}



ul.image{
	list-style:none;
	display:block;
}

ul.image li{
	width:50%;
	float:left;
}



.table_form{
  margin: 0 auto;
  padding:0.5em;
  width:95%;
  border-top:1px solid #c0c0c0;
  }




/*画像設定
---------------------------------------------------------------------------*/


/*説明文
---------------------------------------------------------------------------*/



/* HTML特化記述 2021/10/14追加*/

/* 満足度アンケート */

.worksheet{
	width: 85%;
	display: inline-block;
	text-align: left;
	margin-bottom:20px;
}

.worksheet_text{
margin:2% 0;
line-height: 1.2;
font-size: 1.25em;
}
@media screen and (max-width:768px) {
	.worksheet_text {font-size: 0.88rem;}
}

.info_text{
	font-size: 0.9rem;
}
@media screen and (max-width:768px) {
.info_text{
	font-size: 0.6rem;
}
}

.ffs_text{
	font-feature-settings: "palt";
	font-size:1.6em;
	font-family:  "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	font-weight: midiam;
}
@media screen and (max-width:768px) {
	.ffs_text{
		font-size: 1.2rem;
	}
	}

/* 見出し */

.gd_title{
	background: linear-gradient(to bottom,#00a18c ,#00aa9a, #04c5c0 );
	padding:2.5% 0 2.5% 0;
	font-feature-settings: "palt";
	text-align: center;
	font-family:'Arial','ヒラギノ角ゴ','Hiragino Kaku Gothic Pro',sans-serif;
	font-weight: bold; line-height: 1;
	}
.gd_title_media{
	font-size: 5em;
}

.indent{
	margin-left: 2rem; text-indent: -2rem;
}
 .icon_wakaba{
    padding-bottom: 8px;
    margin-right: -5px;
	width: 5.5%;

}


@media screen and (max-width:768px) {
	.icon_wakaba{
		width: 7%;
		height: auto;
		padding: 1% 0.5% 0.8% 0;
		padding-left:-3px;
	}
}


.icon_wakaba_mini{
	width: 3.7%;
    padding-bottom: 8px;
    margin-right: -5px;

}

@media screen and (max-width:768px) {
	.icon_wakaba_mini{
		width: 5%;
		height: auto;
		padding: 1% 0.5% 0.8% 0;
		margin-left:1%;
	}
}

.text_italic{
	transform: skewX(-10deg);  display: inline-block;
}
/* 見出しend */
.yumincho{
	font-family: "游明朝", YuMincho, 'Yu Mincho',  serif;
}
/* 満足度 */
.font-contrast{
	text-align: center;
	font-family: "游明朝", YuMincho, 'Yu Mincho',  serif;

}
.catch {
	display: flex;
	align-items: center; /* 垂直中心 */
	justify-content: center; /* 水平中心 */
  }
  .catch:before, .catch:after {
	border-top: thin solid;
	content: "";
	width: 2.5em; /* 線の長さ */
  }
  .catch:before {
	margin-right: 0.8em; /* 文字の右隣 */
  }
  .catch:after {
	margin-left: 0.8em; /* 文字の左隣 */
  }

  /* 特典 */
  .tokuten_Contents{
	  padding-top:5%;
	  padding-bottom:2%;
  }
  .tokuten, .tokuten2, .tokuten3, .tokuten5{
	position: relative;
	font-feature-settings: "palt";
	line-height: 1;
	color:#fff;
	font-family: "游明朝", YuMincho, 'Yu Mincho',  serif;

}

/* 特典1 */


.tokuten text img, .message img{
  float: right;
  margin-left: 3%;
  margin-bottom: 3%;

}

.tokuten h2{
  position: absolute;
  top:20%;
  left:30%;
  z-index: 2;
}

/* 2 */
.tokuten2 h2{
	position: absolute;
	top:-5%;
	left:30%;
	z-index: 2;
	font-feature-settings: "palt";
  }
  

/* 3 */

.tokuten3 text img, .message img{
  float: right;
  margin-left: 3%;
  margin-bottom: 3%;
}
.tokuten3 h2{
  position: absolute;
  top:5%;
  left:30%;
  z-index: 2;
  font-feature-settings: "palt";
}


/* 5 */

.tokuten5 text img, .message img{
  float: right;
  margin-left: 3%;
  margin-bottom: 3%;
}
.tokuten5 h2{
  position: absolute;
  top:5%;
  left:30%;
  z-index: 2;
  font-feature-settings: "palt";
}
/* 講師 */
.speaker_media{
	margin-top:5%;
	margin-bottom: 4%;
}

.speaker_media h3{
	line-height: 0.9;
	margin:2% 0 1% 0;
	font-size: 1.5em;
	letter-spacing: -0.1rem;
}

.speaker_media h4{
	line-height: 1.2;
	margin:1.5% 0 1% 0;
	font-size:95%;
	letter-spacing: -0.05rem;
}
.speaker_text{
	margin:0 20px 0 20px ;
	margin-bottom: 3%;
	font-size: 1.1em;
	text-align: justify;
	font-family: "游明朝", YuMincho, 'Yu Mincho',  serif;
}

@media screen and (max-width: 768px) {
	/* スマホ用のCSS */
	.koushi_img img{
		width: 40%;
	}
	.speaker_media h3{
		font-size: 1.2em;
		margin-bottom:2%;
	}

	.speaker_media h4{
		font-size:80%;
	}
	.text_media{
		font-size: 1em;
	}
	.speaker_text{
		margin:0 20px 0 20px ;
		margin-bottom: 3%;
		font-size: 78%;
		text-align: justify;
	}
}
  /* 卒業生の声 */
  .voice_Contents{
	margin-top:7%;
	text-align: center;
}
.voice_name{
	font-size:1.65em;
}
.voice_font{

	font-feature-settings:"palt";
	margin-top:2%;
	margin-bottom:-1%;
	font-size:1.5rem;
	line-height: 1.2;
	color: #00a18c;
}
.voice_text{
	text-align: justify;
	margin: 20px 0;
	line-height: 1.8;

}

@media screen and (max-width: 768px) {
	/* スマホ用のCSS */
	.voice_name {
font-size:1.5em;
	}
	.voice_font{
	font-size:1.1em;
	}
	.voice_text{
	font-size:100%;
	margin: 12px 11px;
	letter-spacing: -0.05rem;
	
	}
	.voice_infomedia, .info_text{
		font-size:0.6em;
	}
}

/* HTML特化記述 *end/

/*吹き出し--------------------*/

/*ボタン設定
---------------------------------------------------------------------------*/

a.img-link:hover {
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
}

/*ボタン*/



/*フッター設定
---------------------------------------------------------------------------*/
footer {
	width:100%;
	height: auto;
	color: #fff;
	background-color: #00a28a;
	margin-top: 3.5rem;
}
.footer-inner{
	text-align: left;
}
.footer-inner a{
	padding: 5px;
    margin: 50px;
    color: #fff;
    padding-left: 30px;
}

.footer-inner a:hover{
	text-decoration: underline;
	}
.footer-inner ul{
	margin:0;
	padding:0;
	list-style: none;
}
.footer-inner li{
	padding: 8px 0;
	font-size: 120%;
	border-bottom: 1px solid #9bbdb5;
}
.footer-inner li:hover{
	opacity: 0.5;
}
.fotter-inner li:last-child::after{
	content: none;
}
.footer-inner span.copy{
	font-size: 80%;
}
footer p.copy{
	text-align: center;
	padding: 20px 0;
	font-size: 90%;
}

@media only screen and (max-width: 768px) {
	.footer-inner{
		text-align: center;
	}
	.footer-inner a{
		background: url(../img/listmark-arrow.png) no-repeat left 0 top 5px;
	}
	.footer-inner li{
		font-size: 150%;
	}
	footer .img-center{
		font-size: 120%;
	}
}






/*その他
---------------------------------------------------------------------------*/
.clear {
	clear: both;
}
.center { text-align: center;}
.left { text-align: left; }
.right { text-align: right; }


.alignleft{float:left;}
.alignright{float:right;
 margin-right:30px;}

/*リンク透明設定*/
a.img-link:hover {
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
}



#qa dt {
	font-size: 120%;
	font-weight: bold;
	background: url(../img/icon-q.jpg) no-repeat 2px 7px;
	padding: 10px 10px 5px 50px;
}

#qa dd {
    margin-bottom: 10px;
    padding: 10px 4px 5px 50px;
    background: url(../img/icon-a.jpg) no-repeat 2px 7px;
    border-bottom: 1px dashed #ccc;
    font-size: 100%;
}

.border1 { border:0; border-bottom: 1px dashed #666; margin: 1em 0; }
.border2 { border:0; border-bottom: 3px double #0075a9; margin-bottom: 1em; }

/*フォント設定
---------------------------------------------------------------------------*/
.under { text-decoration: underline; }
.red { color: #d80011; }
.murasaki { color:#6d308e; }
.ao { color: #1c639d; }
.kiro { color: #FF0; }
.gray { color: #666; }
.siro { color: #fff; }
.bold { font-weight: bold; }
.through { text-decoration: line-through; }
.yellow { background-color: #FF6; }
.magenta{color: #ed016d;}
.seminar-green{color: #00a18a;}

.justify { text-align: justify;}

.size10 { font-size:10px;}
.size12 { font-size: 12px;}
.size14 { font-size: 14px;}

.size105 { font-size:105%; }
.size110 { font-size:110%; }
.size130 { font-size:130%; }
.size150 { font-size:150%; }
.size200 { font-size:200%; }

.fnt18{font-size:18px;}

.bg-gray { background: #f5f5f5; padding:1em; }
.bg-white { background: #fff; padding: 1em; }
.bg-white p { border-bottom: 1px dashed #ccc; }

.pk {
	text-align: center;
	font-size: 16px;
	padding: 3px;
	color: #fff;
	background-color: #313131;
	margin-top:5px;
	margin-bottom:3px;
}

input { padding: 8px; font-size:140%;}
.send { padding: 10px; font-size:140%;}
select { padding: 8px;}

.tokutei_tbl , .about_tbl {
	width:80%;
	margin:20px auto;
}

.tokutei_tbl th ,  .about_tbl th {
	background:#eee;
	text-align:center;
	font-weight:normal;
	border:1px solid #ccc;
	padding:10px;
}

.tokutei_tbl td ,  .about_tbl td {
	border:1px solid #ccc;
	padding:10px;
}

ul.half{
	list-style:none;
	width:920px;
	margin:0 auto;
	padding:0;

}

ul.half li{
	float:left;
	max-width:455px;
	margin-right:7px;
	padding:0;


}

ul.half li:nth-child(2){
	margin-right:0;
}

dl.tbl_form dl,dt,dd {
margin: 0;
padding: 0;
}
dl.tbl_form{
background: #eee;

border: 1px solid #ccc;
border-top: none;
width: 80%;
margin:20px auto;
}
dl.tbl_form dt,dd {
padding: 6px;
}
dl.tbl_form dt {
border-top: 1px solid #ccc;
clear: left;
float: left;
width: 26%;
text-align:center;
line-height:2.5em;
}
dl.tbl_form dd {
background: #fff;
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
margin-left: 27%;
}

form h3{
	width:80%;
	background:#eee;
	text-align:center;
	margin:0 auto;
	padding:6px;
	font-weight:normal;
}

/* margin
---------------------------------------------------------------------------*/

.mt10 { margin-top: 10px;}
.mt20 { margin-top: 20px;}
.mt30 { margin-top: 30px;}
.mt40 { margin-top: 40px;}

.ml10 { margin-left: 10px; }
.ml20 { margin-left: 20px; }
.ml40 { margin-left: 40px; }
.ml60 { margin-left: 60px; }
.ml75 { margin-left: 75px; }
.ml80 { margin-left: 80px; }

.mr20 { margin-right: 20px; }
.mr400 { margin-right: 400px; }

.mb09 { margin-bottom: 9px; }

.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb80 { margin-bottom: 80px; }

.pt20 { padding-top: 20px; }
.pt40 { padding-top: 40px; }

.pb10 { padding-bottom: 10px; }
.pb40 { padding-bottom: 40px; }

.pl10 { padding-left: 10px; }
.pl30 { padding-left: 30px; }
.pl40 { padding-left: 40px; }

.pr10 { padding-right: 10px; }

.pd20{padding:20px;}
.pd30{padding:30px;}

.SPnone{display:block;}
.PCnone{display:none;}

@media screen and (max-width: 768px) {
/* スマホ用のCSS */
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
h3.youtube_h{
  margin-top:1em;
  text-align:center;
  color:#0a50a7;
  font-size:1.1em;
  padding:20px 20px 0px 20px;
}

.SPnone{display:none;}
.PCnone{display:block;}
img{
		max-width:100% !important;
}
img.alignright{
	width:40%;
}
img.w-adimg{
width:40%;
}
body{
font: 12px/1.6;
}
h2{
    font-size: 1.6rem;
}
h3{
    font-size: 1.21rem;
}

h1{
	text-align:center;
	color:#fff;
	font-size:145%;
	line-height:1.2;
	padding:5px;
}
h3.green{
	font-size:140%;
	padding:5px;}
#container {
	width:100%;
}
.hd_link{
	display:none;
}
header{
	height:auto;
}

footer{  /*mobile*/
	width:100%;
	min-width:100%;
	font-size: 60%;
	background: #00a28a;
}
.footer-inner{
		text-align: center;
	}
		.footer-inner li{
		font-size: 150%;
	}
		footer .img-center{
		font-size: 120%;
	}
.sankaku {
	display:none;
}

.notice2 {
	padding: 1.3em 1em;
	margin-bottom: 1em;
	font-size: 120%;
	line-height: 1.6;
	font-weight: normal;
}
.day_box{
}

.profile ,.day_box {
	padding:1em 0.5em;
}

.profile h3 ,.day_box h3{ line-height: 1.3;font-size:120%;border-left: 5px solid #0cb8df; padding-left: 15px;}
.profile h4 ,.day_box h4{ border-left: 5px solid #0cb8df; color:#333; padding-left: 15px;}


.size150 { font-size:120%; }
.size130 { font-size:105%; }
.size200 { font-size:140%; }

ul.half{
	list-style:none;
	width:100%;
	margin:0 auto;
	padding:0;
}

ul.half li{
	float:none;
	width:100%;
	margin:0 auto 5px;
}

ul.half li:nth-child(2){
	margin:0 auto 5px;
}



dl.tbl_form dl,dt,dd {
margin: 0;
padding: 0;
}

dl.tbl_form{
background: #eee;
border: 1px solid #ccc;
width: 100%;
}
dl.tbl_form dt,dl.tbl_form dd {
padding: 6px;
}

dl.tbl_form dd {
background: #fff;
}
input{
max-width:99%;
}
textarea{
max-width:99%;
}

blockquote { width:50%; margin:0 auto; }

dl.tbl_form{
border-top: none;
width: 90%;
}
dl.tbl_form dt {
border-top: 1px solid #ccc;
clear: none;
float: none;
width: 100%;
display:block;
}

dl.tbl_form dd {
border-left: none;
border-top: none;
margin-left: 0%;
float:none;
display:block;
text-align:center;
}

.tex05{
  text-size: 95%;
  padding-top: 0;
  }


}





/*=============================
 　　　　　　新しいフォーム
 =============================*/
 .main-btn-iframe{
	text-align: center;
	margin: 50px 0;
}
.main-btn-iframe input{
	padding: 8px;
    font-size: 140%;
    width: 50%;
    margin: 20px;
}
.main-btn-iframe select{
	width: 52%;
}
.main-btn-iframe .input-group-btn{
	width: 100%;
}
/*=============================
仮フォーム
 =============================*/




element.style {
    border-color: rgb(81, 150, 255);
    color: rgb(255, 255, 255);
    background-color: rgb(81, 150, 255);
}


/*メインコンテンツ
---------------------------------------------------------------------------*/
/*追加 ----------------------*/
.relative{
	position: relative;
}
.absolute p{
    position: absolute;
    font-size: 145%;
    font-weight: bold;
    line-height: 1.3;
    top: -10px;
    left: 90px;
	text-align: center;
}
.seireki{
	font-size: 95%;
}
.nen{
    font-size: 80%;
}
.text-center{
	display: none;
}
@media screen and (max-width: 768px) {
	.absolute p{
	font-size: 3vw;
    top: -1vw;
    left: 12vw;
	}

}
/*ここまで-------------------*/
#page-top {
    position: fixed;
    bottom: 1px;
    font-size: 100%;
    z-index: 100;
    left: calc(60% + 250px);
	top:30%;
}
  #page-top ul {
    list-style: none;
}
@media screen and (max-width: 980px){
#page-top {
    left: calc(60% + 15vw);
}
}
@media screen and (max-width: 768px){
#page-top ul.pc-none {
    display: flex;
    width: 100%;
    flex-direction: row;
    padding: 0;
    margin-bottom: -2px;
}
#page-top {
    left:0;
	top:initial;
	bottom: -46.3px;
	padding: 0;
}
#page-top ul {
	padding: 0;
}
}
.header_pc {

    padding: 0 15px;
    background: #fff;
    position: fixed;
    z-index: 9999;
    opacity: 0.98;
    box-shadow: 0px 5px 5px 0px rgb(0 0 0 / 10%);
    height: 45px;
  }
  .header_flex{
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .header_flex li{
    list-style: none;
	font-size: 14px;
	margin-right: 20px;
  }
  
.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 15px;
    background: #fff;
    z-index: 9999;
    opacity: 0.98;
    box-shadow: 0px 5px 5px 0px rgb(0 0 0 / 10%);
    height: 65px;
  }

  .logo {
	font-size: 24px;
  }
  .logo img{
	width: 120px;
  }
  
  /* ここから下がハンバーガーメニューに関するCSS */
	
  /* チェックボックスを非表示にする */
  .drawer_hidden {
	display: none;
  }
  
  /* ハンバーガーアイコンの設置スペース */
  .drawer_open {
    display: flex;
    height: 50px;
    width: 70px;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 100;
    cursor: pointer;
  }
  
  /* ハンバーガーメニューのアイコン */
  .drawer_open span,
  .drawer_open span:before,
  .drawer_open span:after {
	content: '';
	display: block;
	height: 3px;
	width: 25px;
	border-radius: 3px;
	background: #333;
	transition: 0.5s;
	position: absolute;
  }
  
  /* 三本線の一番上の棒の位置調整 */
  .drawer_open span:before {
	bottom: 8px;
  }
  
  /* 三本線の一番下の棒の位置調整 */
  .drawer_open span:after {
	top: 8px;
  }
  
  /* アイコンがクリックされたら真ん中の線を透明にする */
  #drawer_input:checked ~ .drawer_open span {
	background: rgba(255, 255, 255, 0);
  }
  
  /* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
  #drawer_input:checked ~ .drawer_open span::before {
	bottom: 0;
	transform: rotate(45deg);
  }
  
  #drawer_input:checked ~ .drawer_open span::after {
	top: 0;
	transform: rotate(-45deg);
  }
  .nav {
  display: flex;
  align-items: center;
  }
  /* メニューのデザイン*/
  .nav_content {
    width: 100%;
    position: fixed;
    top: 0;
    left: 100%;
    z-index: 99;
    background: #fff;
    transition: .5s;
    opacity: 0.95;
  }
  
  /* メニュー黒ポチを消す */
  .nav_list {
	list-style: none;
	font-size: 1rem;
    line-height: 3;
    margin: 50px 20px;
  }
  
  /* アイコンがクリックされたらメニューを表示 */
  #drawer_input:checked ~ .nav_content {
	left: 0;/* メニューを画面に入れる */
  }
  .only_sp{display: none;}
  @media screen and (max-width:768px) {
	.only_sp{display:flex;}
  .pc{display: none;}
  .header {
    height: 45px;
	padding: 0 6px;
  }
  .header_flex {
    gap: 12px;
	padding: 0;
}
  .header_flex li {
    margin-right: 0;
	font-size: 10px;
}
  .nav_list {
	font-size: 10px;
    margin:0;
  }
  .logo img{
	width: 90px;
  }
  }

  .wrapper{
    width: 90%;
    margin: 0 auto;

  }
  .tokuten{
	text-align: center;
	max-width: 90%;
  }
  .tokuten img{
	max-width: 90%;
  }
  .recommend{
	background-color: #EEEEEE;
	padding: 2.5rem 0 5rem 0;
  }
  .recomend-icon img{
width: 30%;
  }

  .topics {
    background-color: #effaf8;
    padding: 3.5rem 0 5rem 0;
}
  /* スクロール */


.loop_inner{margin: 3.5rem 0;}
.loop_wrap {
  display: flex;

  overflow: hidden;
}

.loop_wrap img {
  width: 100vw;
  height: 100%;
}
@keyframes loop {
  0% {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(100%);
  }
}

@keyframes loop2 {
  0% {
    transform: translateX(-200%);
  }
  to {
    transform: translateX(0);
  }
}
.loop_wrap img:first-child {
  animation: loop 120s -100s linear infinite;
}

.loop_wrap img:last-child {
  animation: loop2 120s -40s linear infinite;
}
/* フレックスボックス */
.flex{display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
flex-wrap: wrap;
gap: 20px 10px;
margin-top: 20px;
}
.flex .f46{
	width: 46%;
    margin: 0 auto;
    width: 46%;
    margin: 0 auto;
    border-radius: 5px;
    box-shadow: 0 0 5px 0 rgb(0 0 0 / 20%);
    background-color: #fff;
    padding: 20px 10px;
	text-align: center;
}
.flex .f46 p{
    padding: 0 8%;
}
@media screen and (max-width: 768px){
.flex{
gap: 10px;
margin-top: 20px;
}
.flex .f46{
	width: 48%;
    padding: 20px 10px 10px;
}
.flex .f46 p{
    padding: 0 10px;
}
}
/* table */
table {
    width: 100%;
	border-collapse: collapse;
    font-size: 100%;
    border-spacing: 0;
}
th {
    width: 25%;
    background: #ddd;
    font-weight: normal;
	border: 1px solid #bbb;
}
td {
    border: 1px solid #bbb;
    padding: 10px 20px 7px;
    line-height: 1.8;
    background: #fff;
}
.box-white, .topics_box{
    box-shadow: 0px 0px 15px rgb(0 0 0 / 10%);
    border-radius: 16px;
    background: #fff;
    padding: 2rem 0;
    text-align: center;
}
.topics_box img, .join_box img{
	width: 85%;
}
.join_box{
	box-shadow: 0px 0px 15px rgb(0 0 0 / 10%);
    border-radius: 16px;
    background: #fff;
	text-align: center;
	margin: 2.5rem 0 5rem 0;
	padding-bottom: 2rem;
	}
	.join_box img{
		margin-top: 3rem;
		}
.topics_box02 {
    width: 16px;
    height: 30px;
    background-color: #bee0da;
    margin: 0 auto;
}
.seminar, .faq, .voice, .speaker, .company_info, .company, .recommend, .topics, .step, .media{
    margin: 3.5rem 0;
}
.recommend h2, .topics h2{
	color: #00a18a;
}
/* Q&A */
div.qanda{margin: 2.8em 0;}
div.qanda{margin: 2.8em 0;}
p.q_text{font-size: 1.2em; line-height: 40px;font-weight: 900;padding-left:2.7em;
    text-indent:-2.7em;}
p.a_text{font-size:1em;
    margin-top: 1.8em;
    padding-left:3.2em;
    text-indent:-3.2em;
    line-height: 2;
}
p span.q_icon{
    background: dimgray;
    padding:5px 12px;
    font-size: 24px;
    /* border-radius: 10px; */
    color:#fff;
    margin-right:10px;
    line-height: 1em;
    font-weight: 900;
	border-radius: 8px;
}
p span.a_icon{
    background: #00a18a;
    padding:5px 12px;
    font-size: 24px;
    /* border-radius: 10px; */
    color:#fff;
    margin-right:10px;
    line-height: 1em;
    font-weight: 900;
	border-radius: 8px;
}
/* Q&Aここまで */

.btn {
    position: relative;
top: -15px;
    margin: 0 auto;
}
.btn a {
    display: block;
    cursor: pointer;
    width: 300px;
margin: 30px auto 0;
    padding: 20px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #ff453b;
    border-radius: 5px;
    box-shadow: 0 6px 0 #d0251c, 0 12px 0 rgba(0,0,0,0.2);
    -webkit-transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, -webkit-transform 0.3s;
    transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, transform 0.3s;
}
.btn a:hover {
    background-color: #ff574e;
    box-shadow: 0 3px 0 #d83a32, 0 6px 0px rgba(0,0,0,0.2);
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
}
.btn a:active {
    color: #ddd;
    background-color: #d83a32;
    box-shadow: 0 0 0 #d83a32, 0 0 0px rgba(0,0,0,0.2);
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    transition-duration: 0.1s;
}
.btn a {
	width: 85%;
    padding: 20px 0;
}
.line-btn a {
    display: block;
    cursor: pointer;
    max-width: 300px;
    margin: 30px auto 0;
    padding: 20px 50px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #06c755;
    border-radius: 5px;
    box-shadow: 0 6px 0 #059b42, 0 12px 0 rgb(0 0 0 / 20%);
    -webkit-transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, -webkit-transform 0.3s;
    transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, transform 0.3s;
    border-radius: 60px;
}
.line-btn a:hover {
    background-color: #06c755;
    box-shadow: 0 3px 0 #129c49, 0 6px 0px rgba(0,0,0,0.2);
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
}
.line-btn a:active {
    color: #ddd;
    background-color: #129c49;
    box-shadow: 0 0 0 #129c49, 0 0 0px rgba(0,0,0,0.2);
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    transition-duration: 0.1s;
}
span.kounyuu{font-size: 150%; font-weight: bold;}
.qa-container {
    display: flex;
    flex-wrap: wrap;
	align-items: baseline;
  }
  .qa-list{
	width: 33.33%;
  }
  
  .qa-list:not(:first-child) {
	margin-top: 10px;
  }
  
  .question-title {
	/* background:  #eaeef1; */
	cursor: pointer;
    font-size: 14px;
    padding: 10px 50px 0 10px;
	position: relative;
  }
  
  .question-title:before {
	position: absolute;
	display: inline-block;
	content: '';
	background-image: url(../img/q.png);
	width: 50px;/*画像の幅*/
	height: 50px;/*画像の高さ*/
	top: 18px;
	left:31px;
	background-repeat: no-repeat;
	font-size: 18px;
  }
  
  .question-title:after {
	position: absolute;
	display: block;
	content: '';
	top: 35%;
	right: 22px;
	width: 8px;
	height: 8px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	transform: rotate(135deg);
	transition: all .3s ease-in-out;
  }
  
  .question-title.open:after {
	transform: rotate(-45deg);
	top: 45%;
  }
  
  .answer-text {
	/* border-left: 1px solid #DDD;
	border-right: 1px solid #DDD;
	border-bottom: 1px solid #DDD; */
	display: none;
	padding: 14px 20px;
	position: relative;
	font-size: 14px;
  }
  
  .answer-text:before {
	position: absolute;
	display: block;
	content: '';
	top: 18px;
	left: 31px;
	display: inline-block;
	content: '';
	background-image: url(../img/a.png);
	width: 50px;/*画像の幅*/
	height: 50px;/*画像の高さ*/
	font-size: 18px;
	background-repeat: no-repeat;
  }
  .accordion {
	position: relative;
  }
  /* ボタン */
  .accordion-btn {
	background-color: #6495ed;
	border: 1px solid #6495ed;
	bottom: 0;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 18px;
	left: 0;
	margin: auto;
	padding: 5px 15px;
	position: absolute;
	right: 0;
	text-align: center;
	transition: all .2s;
	width: fit-content;
	z-index: 1;
  }
  /* 続きを読むボタンの表記 */
  .accordion-btn::after {
	content: "続きを読む";
  }
  /* ボタンhover時のスタイル */
  .accordion-btn:hover {
	background-color: #fff;
	color: #6495ed;
  }
  .accordion-text {
	overflow: hidden; /* テキストを隠す */
	position: relative;
  }
  /* 最初に見えてるテキストエリアの高さ */
  .accordion-text.is-hide {
	height: 100px;
  }
  /* テキストをグラデーションで隠す */
  .accordion-text::before {
	background: linear-gradient(
		180deg,
		rgb(255, 255, 255, 0) 0%,
		rgb(255, 255, 255, 1) 30%
	  );
	bottom: 0;
	content: "";
	height: 60px; /* グラデーションで隠す高さ */
	position: absolute;
	width: 100%;
  }
  /* 閉じるボタンの位置 */
  .accordion-btn.is-show {
	bottom: -3em;
  }
  /* 閉じるボタンの表記 */
  .accordion-btn.is-show::after {
	content: "閉じる";
  }
  /* 続きを見るボタンをクリックしたらテキストを隠しているグラデーションを消す */
  .accordion-btn.is-show + .accordion-text::before {
	display: none;
  }


@media screen and (max-width: 768px){
span.kounyuu{font-size: 120%;}
}
/* ボタンytb */
.ytb-btn{
	max-width: 480px;
    margin: 0 auto;
}
a.btn_graduates {
    display: flex;
    align-items: center;
    max-width: 520px;
    margin: 0 auto;
    padding: 1rem 4.2rem 1rem 4rem;
    border: 1px solid #313c61;
    background: #fff;
    color: #313c61;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 30px;
  }
  a.btn_graduates:hover {background-color: #313c61; color:#fff;}
  a.btn_graduates .b__text {
    display: block;
    flex-grow: 1;
    text-align: center;
    position: relative;
    padding-right: 15px;
  }
  a.btn_graduates .b__text::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: -12px;
    margin: auto;
    transform: rotate(45deg);
    border-top: 2px solid #313c61;
    border-right: 2px solid #313c61;
    box-sizing: border-box;
    width: 14px;
    height: 14px;
    transition: 0.3s;
  }
  a.btn_graduates:hover  .b__text::after{border-top: 2px solid #fff; border-right: 2px solid #fff;}
  .line-btn{
	text-align: center;
    margin: 2.5rem 0 4rem;
}

/* スクールcss */
.comparison_no{
	text-align: center;
}
.comparison_no img{
	text-align: center;
	max-width: 100px;
	margin-top: 20px;
}
.follow p{
	text-align: center;
}
.follow_no{
    padding: 2%;
    border-radius: 50px;
}
@media screen and (max-width: 768px){
.comparison_no img{
	max-width: 65px !important;
}
}
@media screen and (max-width:500px){
.qa-container {
    display: block;
  }
  .qa-list{
	width: 100%;
	margin: 10% 2%;
  }
}
.ydate{
    position: absolute !important;
    top: -21px !important;
    font-size: 240% !important;
    left: 93px !important;
}

@media screen and (max-width: 768px) {
	.absolute p{
		font-size: 4vw;
		top: 6vw;
		left: 9vw;
	}
	.ydate{
		position: absolute !important;
		top: -1.5vw !important;
		font-size: 4.5vw !important;
		left: 13vw !important;
	}	
}