#header{
	border-bottom:1px solid #ddd;
}

/* NAVIGATION : S */
#navigation{
	background:#262a2d;
}

#navigation ul{
	display:flex;
	align-items:center;
	height:60px;;
}

#navigation ul li{
	position:relative;
	color:#fff;
	font-size:16px;
	font-weight:500;
}

#navigation ul li + li{
	margin-left:16px;
	padding-left:16px;
}

#navigation ul li a{
	color:inherit;
}

#navigation ul li a:hover{
	color:#43a4ff;
	text-decoration:underline;
}

#navigation ul li + li:before{
	content:'';
	position:absolute;
	width:1px;
	height:14px;
	top:50%;
	background:#fff;
	left:0;
	margin-top:-7px;
	transform:rotate(35deg);
}


#navigation ul li.current{
	color:#43a4ff;
	font-weight:600;
}


'#container.bg_about{background:url('../images/bg_about.jpg') right center no-repeat; background-size:cover; background-attachment: fixed;}

/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
	@media (max-width: 1240px) {
		#navigation ul{
			height:50px;
		}
	}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */


/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		#container.bg_about .contents_wrap{background:rgba(255,255,255,0.5); backdrop-filter: blur( 8px );}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


/* NAVIGATION : E */



/* CONTENTS : S */
.contents_wrap{
	position:relative;
	padding:40px 0 40px 0;
	font-size:16px;
	min-height:calc(100vh - 154px);
	min-height:calc(100dvh - 154px);
}

.contents_wrap:after{
	content:'';
	position: absolute;
    right: 40px;
    bottom: 40px;
    width: 200px;
    height: 200px;
    background: url('../images/main_bg_logo.png') 0 0 no-repeat;
    background-size: contain;
    opacity: 0.1;
	z-index:-1;
}

.contents_wrap.lblue_bg{
	background:#f3f8fb;
}

.pagetitle {
	display:flex;
	align-items:flex-end;
	line-height:1;
	margin-bottom:40px;
}
.pagetitle h2{
	font-size:60px;
	font-weight:800;
	letter-spacing:-3px;
	line-height:1;
	margin-right:10px;
}
.pagetitle .txtsmall{
	font-size:24px;
	font-weight:700;
	line-height:1;
	padding-bottom:4px;
}
.pagetitle h2 .small{font-size:40px;}


.conttitle {
	margin-bottom:14px;
	font-size:30px;
	font-weight:700;
}

.txttitle{
	font-size:20px;
	font-weight:700;
}


/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
	@media (max-width: 1240px) {
		.contents_wrap{
			min-height:0;
		}
		.conttitle {
			font-size:24px;
		}

		.contents_wrap:after{
			width:100px;
			height:100px;
			right:20px;
		}
	}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */


/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.pagetitle{
			margin-bottom:40px;
		}

		.pagetitle h2{
			font-size:40px;
			letter-spacing:-2px;
			margin-right:4px;
		}

		.pagetitle .txtsmall{
			font-size:20px;
			font-weight:500;
			padding-bottom:2px;
		}

		.conttitle{
			font-size:20px;
		}
		.contents_wrap{
			padding:40px 0 120px 0;
		}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


/* ------------------------------------------------------------------ MEDIA 480px : S ------------------------------------------------------------------ */
	@media (max-width: 480px) {
		.pagetitle{
			flex-direction:column;
			align-items:flex-start;
		}
		
		.pagetitle h2{
			margin-right:0;
			margin-bottom:6px;
		}

		.txttitle{
			font-size:18px;
		}

		.contents_wrap:after{
			width:60px;
			height:60px;
		}
	}
/* ------------------------------------------------------------------ MEDIA 480px : E ------------------------------------------------------------------ */


.termbox_top{
	display:flex;
	padding:14px 0;
}

.termbox_top label{
	margin-left:auto;
}
.termbox_top .txttitle{
	margin:0;
}
.termbox_top .txttitle span{
	font-size:inherit;
	font-weight:inherit;
}

.termbox{
	background:#f5f5f5;
	padding:20px;
	border-radius:12px;
	height:200px;
	overflow-y:auto;
}

	
	/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
		@media (max-width: 768px) {
			.termbox_top{
				flex-direction:column;
				align-items: flex-start;
			}
			.termbox_top label{
				margin-left:0;
				margin-top:6px;
			}
		}
	/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


.confirm_row{
	display:flex;
}
.confirm_row .btngroup{
	display:flex;
}
.confirm_row .btngroup li + li{
	margin-left:8px;
}
.confirm_row .center{
	margin:0 auto;
}
.confirm_row .center .btncom{
	width:200px;
}
.confirm_row .full{
	width:100%;
}
.confirm_row .full li{
	flex:1;
}


/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.confirm_row .center{
			flex-direction:column;
			width:100%;
		}
		.confirm_row .btngroup li{
			width:100%;
		}
		.confirm_row .center .btncom{
			width:100%;
		}
		.confirm_row .btngroup li + li{
			margin-left:0;
			margin-top:8px;
		}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */

.lecture_wrap{display:flex; width:100%;}
.lecture_wrap .left_lo{flex:none; margin-right:80px;}
.lecture_wrap .left_lo a{display:block; position:relative; overflow:hidden; border-radius:10px;}
.lecture_wrap .left_lo a .ico{position:absolute; width:110px; height:110px; border-radius:100%; left:50%; top:50%; margin-left:-55px; margin-top:-55px; background:url('../images/ico_player_play.png') center center no-repeat rgba(255,255,255,0.2); box-shadow:0 0 20px rgba(0,0,0,0.5); backdrop-filter: blur( 5px ); transition:.2s;}
.lecture_wrap .left_lo a:hover .ico{background:url('../images/ico_player_play.png') center center no-repeat rgba(67,164,255,0.9); width:120px; height:120px; margin-left:-60px; margin-top:-60px;}
.lecture_wrap .left_lo a:before{content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.6);}
.lecture_wrap .left_lo .pic{width:500px;  border-radius:10px; overflow:hidden;}
.lecture_wrap .left_lo .pic img{width:100%; min-height:100%;}
.lecture_wrap .right_lo{flex:1;}
.lecture_wrap .list_info_point{border-radius:10px; margin-top:20px; padding:20px 10px; background:#f5f5f5; display:flex; flex-wrap:wrap;}
.lecture_wrap .list_info_point li{position:relative; width:50%; padding:10px 20px 10px 34px;}
.lecture_wrap .list_info_point li:before{content:''; position:absolute; left:20px; top:20px; width:4px; height:4px; border-radius:100%; background:#a8a8a8;}

.lecture_wrap .conttitle{padding-bottom:14px; margin-bottom:24px; border-bottom:1px solid #ddd;}

/* ------------------------------------------------------------------ MEDIA 1024px : S ------------------------------------------------------------------ */
@media (max-width: 1024px) {
	.lecture_wrap{display:block;}
	.lecture_wrap .left_lo .pic{width:100%;}
	.lecture_wrap .left_lo{margin-bottom:40px; margin-right:0;}
}
/* ------------------------------------------------------------------ MEDIA 1024px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.lecture_wrap .left_lo .pic{}
	.lecture_wrap .list_info_point li{width:100%;}
}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


/* ------------------------------------------------------------------ MEDIA 480px : S ------------------------------------------------------------------ */
@media (max-width: 480px) {
	.lecture_wrap .left_lo a .ico{transform:scale(0.6);}
}
/* ------------------------------------------------------------------ MEDIA 480px : E ------------------------------------------------------------------ */







/* LOGIN */
.member-wrap{ min-height:calc(100vh - 154px);;min-height:calc(100dvh - 154px);display:flex;align-items:center; justify-content: center;}
.member-wrap .member-box{position:relative; width:100%; max-width:600px;background: #fff;overflow:hidden; display: flex;flex-direction: column;justify-content: center; align-items:center; padding:60px 20px;}
.member-wrap .member-box .member-box-inner{width:100%;}
.member-wrap .logo{position:absolute; left:30px; top:30px;}
.member-wrap .logo img{width:220px;}

.member-wrap .boxtitle{display:flex;flex-direction:column; justify-content:center; margin-bottom:20px;}
.member-wrap .boxtitle .logo{display:flex; align-items:center; justify-content:center;}
.member-wrap .boxtitle .logo img{width:44px; margin-right:6px;}
.member-wrap .boxtitle .logo .txt{text-align:center; font-weight:600; font-size:20px; line-height:1.2; margin-top:8px; letter-spacing:-2px; color:#77787a;}
.member-wrap .boxtitle .title{ text-align:center; font-weight:600; font-size:60px; line-height:1; letter-spacing:-5px;}

.member-wrap .member-box .login-inplist{display:flex; flex-direction:column;}
.member-wrap .member-box .login-inplist li + li{margin-top:10px;}
.member-wrap .member-box .login-inplist input{width:100%; height:60px; font-size:18px; padding:0 20px 0 48px; border:0; border-bottom:1px solid #ccc; background:transparent;}
.member-wrap .member-box .login-inplist label{display:block; position:relative;}
.member-wrap .member-box .login-inplist .label-id:before,
.member-wrap .member-box .login-inplist .label-mail:before,
.member-wrap .member-box .login-inplist .label-pw:before{content:''; position:absolute; left:10px; top:50%; margin-top:-12px; border-radius:100%; width:24px; height:24px; z-index:1; background-color:#65757c; background-size:auto 12px; background-position:center center; background-repeat:no-repeat;}
.member-wrap .member-box .login-inplist .label-id:before{background-image:url('../images/login-ico-id.svg');}
.member-wrap .member-box .login-inplist .label-mail:before{background-image:url('../images/login-ico-mail.svg');}
.member-wrap .member-box .login-inplist .label-pw:before{background-image:url('../images/login-ico-pw.svg');}
.member-wrap .member-box .btn-confirm{margin-top:30px; width:100%;  border-radius:4px; background:#4099ed; border:0; height:60px; color:#fff; font-size:18px; font-weight:800;}


.member-wrap .member-box .login-inplist label .inp-pw-vis{position:absolute; right:10px; top:50%; margin-top:-10px; border:0; font-size:0; text-indent:-9999px; width:22px; height:20px; transition:opacity .2s;}
.member-wrap .member-box .login-inplist label.pw-visible .inp-pw-vis{background:url('../images/input-visible.png') 0 0 no-repeat; }
.member-wrap .member-box .login-inplist label.pw-hidden .inp-pw-vis{background:url('../images/input-hidden.png') 0 0 no-repeat; }
.member-wrap .member-box .login-inplist label.pw-visible input,
.member-wrap .member-box .login-inplist label.pw-hidden input{padding-right:40px;}

.member-wrap .member-box .login-inplist-bot{display:flex; justify-content:space-between; margin-top:20px;}
.member-wrap .member-box .login-inplist-bot .link-join{display:inline-flex; align-items:center;font-size:16px; font-weight:500; text-decoration: underline;}
.member-wrap .member-box .login-inplist-bot .link-join:before{content:''; display:block; background:url('../images/login-btn-join.svg') 0 0 no-repeat; background-size:contain; width:20px; height:20px; margin-right:8px;}
.member-wrap .member-box .login-inplist-bot .txt-phone{font-size:16px; color:var(--color-lgray);}

.member-wrap .txtlist-notice{background:#f6f9fb; border-radius:4px; padding:20px 30px; margin-top:30px;}
.member-wrap .txtlist-notice li + li{margin-top:6px;}
.member-wrap .txtlist-notice li{font-size:14px; padding-left:10px; position:relative; color:var(--color-lgray); word-break:auto-phrase;}
.member-wrap .txtlist-notice li:before{content:''; position:absolute; left:0; top:8px; width:4px; height:4px; background:var(--color-lgray); border-radius:100%;}


.member-wrap .member-box .socBtnGroup{display:flex;}
.member-wrap .member-box .socBtnGroup li{flex:1;}
.member-wrap .member-box .socBtnGroup li + li{margin-left:8px;}
.member-wrap .member-box .btn-naver:before,
.member-wrap .member-box .btn-kakao:before,
.member-wrap .member-box .btn-google:before{content:''; margin-right:8px; width:18px; height:18px; display:block;}
.member-wrap .member-box .btn-naver:before{background:url('/html/images/ico_logo_naver.png') 0 0 no-repeat; background-size:contain;}
.member-wrap .member-box .btn-kakao:before{background:url('/html/images/ico_logo_kakao.png') 0 0 no-repeat; background-size:contain;}
.member-wrap .member-box .btn-google:before{background:url('/html/images/ico_logo_google.png') 0 0 no-repeat; background-size:contain;}
.member-wrap .member-box .btn-naver{display:flex; align-items:center; justify-content:center; width:100%; border-radius:4px; background:#03cf5d; border:0; height:60px; color:#fff; font-size:18px; font-weight:500;}
.member-wrap .member-box .btn-kakao{display:flex; align-items:center; justify-content:center; width:100%; border-radius:4px; background:#fde811; border:0; height:60px; color:#000; font-size:18px; font-weight:500;}
.member-wrap .member-box .btn-google{display:flex; align-items:center; justify-content:center; width:100%; border-radius:4px; background:#fff; border:1px solid #ddd; height:60px; color:#000; font-size:18px; font-weight:500;}


/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
	@media (max-width: 1240px) {
		.member-wrap{ min-height:0;}
		.member-wrap .member-box{padding:80px 20px;}
		.member-wrap .boxtitle .title{font-size:50px;}
		.member-wrap .member-box .login-inplist input{font-size:15px;}
		.member-wrap .member-box .btn-confirm{font-size:15px; height:50px; margin-top:20px;}

		.member-wrap .member-box .btn-naver,
		.member-wrap .member-box .btn-kakao,
		.member-wrap .member-box .btn-google{height:50px; font-size:15px;}
		.member-wrap .member-box .btn-nave:beforer,
		.member-wrap .member-box .btn-kakao:before,
		.member-wrap .member-box .btn-google:before{width:14px; height:14px;}
	}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */


/* ------------------------------------------------------------------ MEDIA 480px : S ------------------------------------------------------------------ */
	@media (max-width: 480px) {
		.member-wrap .boxtitle .title{font-size:40px;}

		.member-wrap .member-box .socBtnGroup{display:block;}
		.member-wrap .member-box .socBtnGroup li + li{margin-left:0; margin-top:8px;}
	}
/* ------------------------------------------------------------------ MEDIA 480px : E ------------------------------------------------------------------ */

.page_done{text-align: center; padding:60px 0;}
.page_done .ico{text-align:center; margin-bottom:20px;}
.page_done .ico:before{content:''; display:block; margin:0 auto; width:86px; height:94px; background:url('../images/ico_done.png') 0 0 no-repeat; background-size:contain;}
.page_done .txtbig{font-size:30px; font-weight:800; margin-bottom:20px; line-height:1.2;}
.page_done .txtsmall{font-size:20px;}


.payment_table{text-align:left; width:100%; max-width:500px; margin:0 auto; margin-top:60px; border-top:1px solid #dcdcdc;}
.payment_table .row{border-bottom:1px solid #dcdcdc; padding:16px 0;}
.payment_table dl{display:flex; align-items:center; justify-content:space-between; padding:14px 0;}
.payment_table dl dt{color:#8d8d8d; flex:none; width:80px;}
.payment_table dl dd{}

.payment_table .pay_final{font-size:30px; font-weight:800; color:#4099ed; letter-spacing:-3px; line-height:1;}
.payment_table .pay_final span{font-size:18px; font-weight:500; margin-left:4px;}


/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.page_done .ico:before{width: 60px; height: 66px;}
		.page_done .txtbig{font-size:20px; margin-bottom:10px;}
		.page_done .txtsmall{font-size:16px;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


.sitemap_box:after{display: block;content: '';clear: both}
.sitemap_box dl{float: left;margin-bottom: 30px;padding-right: 30px;width:33.33%}
.sitemap_box dt a{
    display: block;
    border-top: 1px solid #000;
    border-bottom: 1px solid #E1E4E6;
    padding: 19px 10px 15px 10px;
    color: #4b65a2;
    font-size: 20px;
    color: #000;
    margin-bottom:10px;
	font-weight: 600;
}
.sitemap_box dd{
    display: block;
}
.sitemap_box dd a{
    color: #000;
    display:block;
    padding:5px 10px;
    font-size:16px;
}
.sitemap_box dd a:before{content:"- ";}


/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
    	.sitemap_box dl{float: none;padding-right:0px;width:100%}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */



.courselist{}
.courselist ul{display:flex; flex-wrap:wrap; margin-left:-40px;}
.courselist ul li{width:calc(33.33% - 40px); margin-bottom:40px; margin-left:40px;}
.courselist ul li .item{height:100%; display: flex; flex-direction: column;}
.courselist ul li .item .thumbnail{}
.courselist ul li .item .thumbnail .thumb_inner{padding-bottom:80%; border-radius:20px; background:#ddd; overflow:hidden; position:relative; background-image:url('../images/thumbnail_empty.png'); background-repeat:no-repeat; background-position:center center; background-size:cover;}
.courselist ul li .item .info{margin-top:20px; display: flex; flex-direction: column; flex:1;}
.courselist ul li .item .name{font-size:20px; font-weight:700; margin-bottom:6px;}
.courselist ul li .item .etc{display:flex; flex-wrap:wrap; margin-bottom:20px;}
.courselist ul li .item .etc .txt{position:relative; font-size:16px; color:#5b5b5b;}
.courselist ul li .item .etc .txt + .txt{margin-left:14px; padding-left:15px;}
.courselist ul li .item .etc .txt + .txt:before{content:''; position:absolute; left:0; top:50%; width:1px; height:12px; margin-top:-6px; background:#ddd;}
.courselist ul li .item .progress{display:flex; align-items:center; margin-top:auto;}
.courselist ul li .item .progress .value{margin-right:10px; flex:none; font-weight:800; color:#4099ed; font-size:18px;}
.courselist ul li .item .progress .bar{display:block; flex:1; border-radius:100px; height:8px; background:#ddd; overflow:hidden;}
.courselist ul li .item .progress .bar .fill{height:100%; border-radius:0 100px 100px 0; background:#4099ed;}

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.courselist ul li{width:calc(50% - 40px);}
}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 480px : S ------------------------------------------------------------------ */
@media (max-width: 480px) {
	.courselist ul{margin-left:0;}
	.courselist ul li{width:100%; margin-left:0;}
}
/* ------------------------------------------------------------------ MEDIA 480px : E ------------------------------------------------------------------ */


.courses_wrap{width:100%; border-top: 2px solid #000; border-bottom:1px solid #dcdcdc;}
.courses_wrap .top{width:100%; padding:80px 0; display:flex; justify-content:space-between;}
.courses_wrap .top .txtbox{}
.courses_wrap .top .txtbox .homename{font-size:26px; margin-bottom:20px; line-height:1.2; font-weight:600;}
.courses_wrap .top .txtbox .homename strong{font-weight:800;}
.courses_wrap .top .txtbox .title{display:flex; flex-wrap:wrap; line-height:1; font-size:100px; font-weight:600; letter-spacing:-4px; word-break: break-all;}
.courses_wrap .top .txtbox .title span{padding-top:10px; font-size:40px; letter-spacing:0px; font-weight:1000; margin-right:20px;}
.courses_wrap .top .infobox{flex:1; display:flex; flex-direction:column; justify-content:center; padding-left:40px; border-left:1px solid #ddd; margin-left:40px; max-width:600px; }
.courses_wrap .top .infobox .duration{font-size:20px;}
.courses_wrap .top .infobox .progress{display:flex; align-items:center; margin-top:20px;}
.courses_wrap .top .infobox .progress .value{margin-right:10px; flex:none; font-weight:800; color:#4099ed; font-size:24px; letter-spacing:-2px;}
.courses_wrap .top .infobox .progress .bar{display:block; flex:1; border-radius:100px; height:12px; background:#ddd; overflow:hidden;}
.courses_wrap .top .infobox .progress .bar .fill{height:100%; border-radius:0 100px 100px 0; background:#4099ed;}
.courses_wrap .top dl{display:flex; min-height:34px; font-size:18px; align-items:center;}
.courses_wrap .top dl dt{font-weight:700; width:100px; padding-right:14px; }
.courses_wrap .top dl dd{flex:1;}
.courses_wrap .top dl + dl{margin-top:10px;}


.courses_wrap .bot{flex:1; display: flex; flex-direction: column; justify-content: center;}
.courses_wrap .bot li + li{margin-top:20px;}
.courses_wrap .bot li.done dl{background:#f4faff; border-color:#bed4e9; color:#4099ed;}
.courses_wrap .bot li.done dl dd.title{color:#4099ed;}
.courses_wrap .bot dl{display:flex; align-items:center; background:#f5f5f5; border:1px solid #f5f5f5; padding:24px 30px; border-radius:10px;}
.courses_wrap .bot dl dt{font-size:30px; font-weight:700; line-height:1;}
.courses_wrap .bot dl dd.title{flex:1; color:#5f5f5f; font-size:20px; padding:0 40px;}
.courses_wrap .btn_view{display:inline-flex; align-items:center; border-radius:100px; background:#4099ed; height:40px; padding:0 20px; color:#fff; font-weight:600; font-size:16px;}
.courses_wrap .btn_view:before{content:''; margin-right:6px; width:14px; height:14px; background:url('../images/ico_course_play.png') 0 0 no-repeat; margin-right:6px;}
.courses_wrap .label_done{display:inline-flex; align-items:center; border-radius:100px; background:#d7ecff; height:40px; padding:0 20px; color:#6c8399; font-weight:600; font-size:16px;}
.courses_wrap .label_done:before{content:''; margin-right:6px; width:14px; height:14px; background:url('../images/ico_course_done.png') 0 0 no-repeat; margin-right:6px;}

.courses_wrap .bot .progress{display:flex; align-items:center; width:20%; margin-right:40px;}
.courses_wrap .bot .progress .value{margin-right:10px; flex:none; font-weight:800; color:#4099ed; font-size:18px; letter-spacing:-2px;}
.courses_wrap .bot .progress .bar{display:block; flex:1; border-radius:100px; height:8px; background:#ddd; overflow:hidden;}
.courses_wrap .bot .progress .bar .fill{height:100%; border-radius:0 100px 100px 0; background:#4099ed;}
/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
@media (max-width: 1240px) {
	.courses_wrap{display:block;}
	.courses_wrap .bot dl{padding:30px;}
}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.courses_wrap{ }
	.courses_wrap .top{padding:30px 0; display:block;}
	.courses_wrap .top .infobox{margin-left:0; margin-top:20px; max-width:100%; padding-top:20px; border-left:0; padding-left:0; border-top:1px solid #ddd;}
	.courses_wrap .top .infobox .progress{padding-top:20px; border-top:1px solid #ddd;}
	.courses_wrap .top .infobox .progress .value{font-size:20px;}
	.courses_wrap .top .infobox .progress .bar{height:10px;}
	.courses_wrap .top .txtbox .homename{font-size:18px; margin-bottom:10px;}
	.courses_wrap .top .txtbox .title{font-size:54px;}
	.courses_wrap .top .txtbox .title span{font-size:28px; margin-right:14px; padding-top:4px;}
	.courses_wrap .top dl{font-size:16px;}
	.courses_wrap .top dl dt{width:80px;}
	.courses_wrap .bot li + li{margin-top:14px;}
	.courses_wrap .bot dl{padding:14px;}
	.courses_wrap .bot dl dt{font-size:18px;}
	.courses_wrap .bot dl dd.title{font-size:16px; padding:0 20px;}
	.courses_wrap .btn_view{font-size:14px; height:30px; width:30px; justify-content: center; font-size:0; text-indent:-9999px; padding:0;}
	.courses_wrap .btn_view:before{margin-right:0;}
	.courses_wrap .label_done{font-size:14px; height:30px; width:30px; justify-content: center; font-size:0; text-indent:-9999px; padding:0;}
	.courses_wrap .label_done:before{margin-right:0;}
}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 480px : S ------------------------------------------------------------------ */
@media (max-width: 480px) {
	.courses_wrap .bot dl{position:relative; flex-wrap:wrap; padding:14px 60px 14px 14px;}
	.courses_wrap .bot .progress{width:100%; margin-right:0; margin-top:8px;}
	.courses_wrap .bot .btn{position:absolute; right:14px; top:50%; margin-top:-15px;}
}
/* ------------------------------------------------------------------ MEDIA 480px : E ------------------------------------------------------------------ */


.myinfo_wrap{
	width: 100%;
	/*
	border-top: 2px solid #000;
	padding:60px 0;
	*/
	display:flex;
}
.myinfo_wrap .left{
	flex:none;
	display:flex;
	flex-direction:column;
	width:360px;
	overflow:hidden;
	border-radius:20px;
	box-shadow:5px 5px 12px rgba(0, 0, 0, 0.04);
	padding:30px;
	background:#fff;
}

.myinfo_wrap .item.myinfo{
	background:#262a2d;
	color:#fff;
}

.myinfo_wrap .item.myinfo .pic{
	border-radius:100%;
	overflow:hidden;
	width:100%;
	max-width:200px;
	margin:0 auto;
}
.myinfo_wrap .item.myinfo .pic .pic_inner{
	padding-bottom:100%;
	background-color:#f5f5f5;
	background-size:cover;
	background-position:center center;
}
.myinfo_wrap .item.myinfo .info {
	
}
.myinfo_wrap .item.myinfo .info .info_top{
}
.myinfo_wrap .item.myinfo .info .info_top .name{
	font-size:30px;
	font-weight:600;
	line-height:1;
	margin-bottom:4px;
}
.myinfo_wrap .item.myinfo .info .info_top .birthday{
	font-size:16px;
	color:#939393;
}

.myinfo_wrap .item.myinfo .info .info_list {
	padding:20px 0;
}
.myinfo_wrap .item.myinfo .info .info_list dl{
	display:flex; 
	align-items:center;
	font-size:18px;
	word-break: break-all;
}
.myinfo_wrap .item.myinfo .info .info_list dl dt{
	font-weight:600;
	min-width:80px;
}
.myinfo_wrap .item.myinfo .info .info_list dl dd{
	color:#939393;
}
.myinfo_wrap .item.myinfo .info .info_list dl + dl{
	margin-top:10px;
}
.myinfo_wrap .item.myinfo .btn_edit_myinfo{
	margin-top:auto;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#4c5053;
	color:#fff;
	font-size:16px;
	height:50px;
	font-weight:600;
	border-radius:100px;
	transition:background .2s;
}
.myinfo_wrap .item.myinfo .btn_edit_myinfo:before{
	content:'';
	width:14px;
	height:14px;
	background:url('../images/ico_edit_myinfo.png') 0 0 no-repeat;
	margin-right:8px;
}
.myinfo_wrap .item.myinfo .btn_edit_myinfo:hover{
	background:#4099ed;
}

.myinfo_wrap .itemlist{
	flex:1;
	display:flex;
	flex-wrap:wrap;
	margin-top:-20px;
}

.myinfo_wrap .item{
	display:flex;
	flex-direction:column;
	width:calc(50% - 20px);
	margin-top:20px;
	margin-left:20px;
	box-shadow:5px 5px 12px rgba(0, 0, 0, 0.04);
	border-radius:20px;
	padding:30px;
	min-height:340px;
	background:#fff;
}

.myinfo_wrap .itemlist .infogroup .title{
	display:flex;
	align-items:center;
	font-size:24px;
	font-weight:800;
	padding-bottom:20px;
	line-height:1;
	flex:none;
}

.myinfo_wrap .itemlist .infogroup .title .btn_right{
	display:inline-flex;
	font-size:14px;
	font-weight:700;
	align-items:center;
	margin-left:auto;
	transition:color .2s;
}
.myinfo_wrap .itemlist .infogroup .title .btn_right:after{
	content:'';
	display:block;
	margin-left:6px;
	width:18px;
	height:18px;
	background:url('../images/m_mobilegnb_arrow_w.png') center center no-repeat #262a2d;
	border-radius:100%;
	background-size:5px;
	transition:background-color .2s;
}

.myinfo_wrap .itemlist .infogroup .title .btn_right:hover{
	color:#4099ed;
}

.myinfo_wrap .itemlist .infogroup .title .btn_right:hover:after{
	background-color:#4099ed;
}

.myinfo_wrap .itemlist .infogroup .empty{
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	border-top: 1px solid #ddd;
	color:#737373;
}


.myinfo_wrap .itemlist .infogroup .list01 {
	padding-top:20px;
	flex:1;
	border-top:1px solid #ddd;
}
.myinfo_wrap .itemlist .infogroup .list01 li {
	position:relative;
	padding-left:18px;
}

.myinfo_wrap .itemlist .infogroup .list01 li + li{
	margin-top:14px;
}
.myinfo_wrap .itemlist .infogroup .list01 li:before{
	content:'';
	position:absolute;
	left:0;
	top:50%;
	margin-top:-3px;
	width:6px;
	height:6px;
	border-radius:100px;
	background:#262a2d;
}
.myinfo_wrap .itemlist .infogroup .list01 li dl{
	display:flex;
	align-items:center;
	justify-content:space-between;
}
.myinfo_wrap .itemlist .infogroup .list01 li dt{
	flex:none;
	margin-right:auto;
}
.myinfo_wrap .itemlist .infogroup .list01 li dd{
	flex:1;
	color:#737373;
	text-align:right;
	padding-left:20px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}




.myinfo_wrap .itemlist .infogroup .list02 {
	padding-top:20px;
	flex:1;
	border-top:1px solid #ddd;
}
.myinfo_wrap .itemlist .infogroup .list02 li {
	padding-left:18px;
	position:relative;
}

.myinfo_wrap .itemlist .infogroup .list02 li + li{
	margin-top:6px;
}

.myinfo_wrap .itemlist .infogroup .list02 li:before{
	content:'';
	position:absolute;
	left:0;
	top:8px;
	width:6px;
	height:6px;
	border-radius:100px;
	background:#262a2d;
}

.myinfo_wrap .itemlist .infogroup .list02 li dl{

}
.myinfo_wrap .itemlist .infogroup .list02 li dt{
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
.myinfo_wrap .itemlist .infogroup .list02 li dd{
	font-size:14px;
	color:#737373;
}



.myinfo_wrap .itemlist .infogroup .list03 {
	flex:1;
	border-top:1px solid #ddd;
}
.myinfo_wrap .itemlist .infogroup .list03 li{
	padding:16px 0;
}
.myinfo_wrap .itemlist .infogroup .list03 li + li{
	border-top:1px solid #ddd;
}

.myinfo_wrap .itemlist .infogroup .list03 dl{
	display:flex;
	align-items:center;
}

.myinfo_wrap .itemlist .infogroup .list03 li dt{
	font-weight:600;
	width:70px;
	margin-right:20px;
	text-align:center;
	font-size:16px;
	flex:none;
}

.myinfo_wrap .itemlist .infogroup .list03 dd{
	flex:1;
}

.myinfo_wrap .itemlist .infogroup .progress{display:flex; align-items:center; margin-top:auto;}
.myinfo_wrap .itemlist .infogroup .progress .value{margin-right:4px; flex:none; font-weight:800; color:#4099ed; font-size:18px; width:50px;}
.myinfo_wrap .itemlist .infogroup .progress .bar{display:block; flex:1; border-radius:100px; height:8px; background:#ddd; overflow:hidden;}
.myinfo_wrap .itemlist .infogroup .progress .bar .fill{height:100%; border-radius:0 100px 100px 0; background:#4099ed;}


/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
@media (max-width: 1240px) {
	.myinfo_wrap .itemlist{margin-top:0; margin-left:20px;}
	.myinfo_wrap .item{width:100%; margin-left:0; margin-top:0;}
	.myinfo_wrap .itemlist .item + .item{margin-top:20px;}
}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.myinfo_wrap{display:block;}
	.myinfo_wrap .item.myinfo .info .info_list dl{font-size:16px;}
	.myinfo_wrap .itemlist{margin-left:0; margin-top:20px;}
	.myinfo_wrap .itemlist .item .list01 li dl{font-size:14px;}
	.myinfo_wrap .itemlist .item .list03 li dt{font-size:16px; width:60px;}
}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


.tab_type01{display:flex; margin-bottom:60px; border-bottom:1px solid #ddd;}
.tab_type01 li{flex:1; max-width:180px;;}
.tab_type01 li a{position:relative; padding:0 10px; display:flex; align-items:center; justify-content:center; height:80px; font-size:24px; font-weight:800; color:#737373; transition:color .2s;}
.tab_type01 li a:hover{color:#262a2d;}
.tab_type01 li.active a{color:#262a2d;}
.tab_type01 li.active a:before{content:''; position:absolute; bottom:-1px; width:100%; left:0; height:4px; background:#262a2d;}

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.tab_type01{margin-bottom:40px;}
		.tab_type01 li{max-width:100%;}
		.tab_type01 li a{font-size:18px; height:50px;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


.tab_type02{display:flex; margin-bottom:20px; border-bottom:1px solid #ddd;}
.tab_type02 li{flex:1;}
.tab_type02 li a{position:relative; padding:0 10px; display:flex; align-items:center; justify-content:center; height:60px; font-size:16px; font-weight:800; color:#737373; transition:color .2s;}
.tab_type02 li a:hover{color:#262a2d;}
.tab_type02 li.active a{color:#262a2d;}
.tab_type02 li.active a:before{content:''; position:absolute; bottom:-1px; width:100%; left:0; height:4px; background:#262a2d;}

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.tab_type02{margin-bottom:20px;}
		.tab_type02 li{max-width:100%;}
		.tab_type02 li a{font-size:14px; height:40px;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


.tab_type03{display:flex; margin-bottom:40px;}
.tab_type03 li{flex:1;}
.tab_type03 li + li{margin-left:10px;}
.tab_type03 li a{position:relative; padding:0 10px; display:flex; align-items:center; justify-content:center; height:60px; font-size:16px; font-weight:500; color:#737373; transition:border-color .2s, color .2s; border:1px solid #ddd; border-radius:4px;}
.tab_type03 li a:hover{color:#4099ed; border-color:#4099ed;}
.tab_type03 li.active a{color:#fff; background:#4099ed; border-color:#4099ed; font-weight:800;}

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.tab_type03{margin-bottom:40px;}
		.tab_type03 li{max-width:100%;}
		.tab_type03 li a{font-size:14px; height:40px;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */



.m_tablelist .title{margin-bottom:6px;}
.m_tablelist dl{display: inline-flex; margin-right: 24px; font-size:14px;}
.m_tablelist dl dt{flex:none; margin-right:14px; color:#8d8d8d;}
.m_tablelist dl dd{flex:1; word-break:break-all;}

.pagination{display:flex; justify-content:center; align-items:center; margin-top:40px;}
.pagination .prevlist{margin-right:20px; display:flex;}
.pagination .numblist{display:flex;}
.pagination .nextlist{margin-left:20px; display:flex;}
.pagination a{display:flex; align-items:center; justify-content:center; min-width:34px; height:34px; color:#737373; border-radius:100%; transition:background-color .2s;}
.pagination .prevlist a,
.pagination .nextlist a{font-size:0;}
.pagination a:hover{background-color:#f5f5f5;}
.pagination .numblist .active{background:#262a2d !important; color:#fff; font-weight:700;}
.pagination .first{background:url('../images/pagination_last.png') center center no-repeat; transform:rotate(180deg);}
.pagination .last{background:url('../images/pagination_last.png') center center no-repeat;}
.pagination .prev{background:url('../images/pagination_next.png') center center no-repeat; transform:rotate(180deg);}
.pagination .next{background:url('../images/pagination_next.png') center center no-repeat;}


/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
@media (max-width: 1240px) {
	.pagination{
		position:fixed;
		left:0; bottom:0;
		width:100vw;
		background:#f5f5f5;
		height:50px;
		z-index:10;
		padding:0 10px;
		margin-top:0;
	}
	.pagination a{width:30px; height:50px;}
	.pagination .numblist{display:none;}

	.pagination .m_numblist {flex:1; display:flex; align-items:center; justify-content:center; color:#8d8d8d;}
	.pagination .m_numblist span + span{margin-left:4px;}
	.pagination .m_numblist .current{font-weight:600; color:#000;}
}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */


.faq_table{border-top:2px solid #000;}
.faq_table li{border-bottom:1px solid #ddd;}
.faq_table .item{position:relative; padding:30px 60px 30px 20px; font-size:18px;}
.faq_table .row_Q{position:relative; padding-left:36px; font-weight:600;}
.faq_table .row_Q:before{content:''; width:26px; height:28px; background:url('../images/faq_q.png') 0 0 no-repeat; position:absolute; left:0; top:-3px;}
.faq_table .row_A{position:relative; padding-left:36px; display:none; margin-top:20px;}
.faq_table .row_A:before{content:''; width:26px; height:28px; background:url('../images/faq_a.png') 0 0 no-repeat; position:absolute; left:0; top:-3px;}
.faq_table .btn_toggle{position:absolute; width:24px; height:24px; right:20px; top:50%; margin-top:-12px; border:0; transition:transform .2s; background:url('../images/faq_toggle_btn.png') center center no-repeat;}
.faq_table li.active .btn_toggle{transform:rotate(180deg);}

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.faq_table .item{ font-size:16px; padding:20px 60px 20px 20px;}
		.faq_table .btn_toggle{right:10px;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */

.board_view{border-top:2px solid #000;}
.board_view .view_top{border-bottom:1px solid #ddd; padding:30px 20px;}
.board_view .view_top .title{font-size:24px; font-weight:700;}
.board_view .view_top .infolist{margin-top:14px; display:flex; flex-wrap:wrap;}
.board_view .view_top .infolist li{margin-right:20px; position:relative;}
.board_view .view_top .infolist li + li{padding-left:14px;}
.board_view .view_top .infolist li + li:before{content:''; position:absolute; left:0; top:50%; width:1px; height:14px; background:#ddd; margin-top:-7px;}
.board_view .view_top .infolist li dl{display:flex; font-size:16px; color:#737373;}
.board_view .view_top .infolist li dl dt{margin-right:10px;}
.board_view .view_top .infolist li dl dd{}

.board_view .view_body{padding:60px 20px; border-bottom:1px solid #ddd;}

.board_view .view_reply{border:1px solid #ddd; margin-top:20px;}
.board_view .view_reply .reply_top{background:#f5f5f5; text-align:center; padding:10px 20px; font-weight:600;}
.board_view .view_reply .reply_body{padding:20px}

.reply_title_textarea{width:100%; resize:none; height:42px; background: #f5f5f5; border:0; text-align:center; font-family:inherit; font-size:inherit; line-height:inherit; color:inherit;}
.reply_textarea{width:100%; resize:none; background:#fff; border:0; padding:20px; font-family:inherit; font-size:inherit; line-height:inherit; color:inherit;}

.page_bot_btngroup{display:flex; margin-top:30px;}
.page_bot_btngroup .center{margin:0 auto;}
.page_bot_btngroup .right{margin-left:auto;}

.view_pager{margin-top:40px; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; padding: 10px 0;}
.view_pager .item dl{display:flex; align-items:center; padding:14px 20px; font-size:18px;}
.view_pager .item dt{flex:none; position:relative; padding-left:24px; font-weight:700; margin-right:20px; min-width:80px;}
.view_pager .item dt:before{content:''; position:absolute; left:0; top:50%; margin-top:-4px; width:14px; height:8px; background:url('../images/faq_toggle_btn.png') center center no-repeat; margin-right:10px;}
.view_pager .item dd{flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.view_pager .prev .item dt:before{transform:rotate(180deg);}

.filebox{
	display:flex;
	padding:14px 20px;
}

.filebox .txt{
	font-weight:700;
	font-size:16px;
	margin-right:20px;
	padding:14px 0;
	flex:none;
}

.filebox .filelist{
	display:flex;
	flex-wrap:wrap;
	flex;1;
}
.filebox .filelist li{
	margin-right:6px;
	padding:4px 0;
}

.filebox .filelist li a{
	display:flex;
	align-items:center;
	justify-content:center;
	border:1px solid #ddd;
	border-radius:100px;
	padding:10px 20px;
	background:#fff;
	font-size:14px;
	transition:border-color .2s;
}
.filebox .filelist li a:hover{
	border-color:#262a2d;
	color:#262a2d;
}
.filebox .filelist li a:before{
	content:'';
	width:14px;
	height:14px;
	margin-right:6px;
	background:url('../images/ico_file.png') 0 0 no-repeat;
	flex:none;
}

.filebox + .view_body{padding-top:20px;}

.overlay_msg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    font-weight: bold;
}


/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.board_view .view_top{padding:20px 14px;}
		.board_view .view_top .title{font-size:18px;}
		.board_view .view_top .infolist{margin-top:8px;}
		.board_view .view_top .infolist li dl{font-size:14px;}
		.board_view .view_body{padding:30px 14px; font-size:14px;}

		.board_view .view_reply .reply_body{font-size:14px;}

		.view_pager{padding:0;}
		.view_pager li + li{border-top:1px solid #ddd;}
		.view_pager .item dl{font-size:16px; padding:14px;display:block;}
		.view_pager .item dt{margin-right:0; margin-bottom:4px;}

		.filebox{display:block; padding:20px 14px;}
		.filebox .txt{padding:0; margin-bottom:4px;}
		.filebox .filelist li a{padding:8px 14px;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


.about_wrap{padding:0 0 120px 0;}
.about_wrap .title{font-size:120px; font-weight:800; letter-spacing:-11px; line-height:0.9; margin-bottom:60px;}
.about_wrap .title strong{color:#4099ed;}
.about_wrap .txt{font-size:20px;}
.about_wrap .btn{display:inline-flex; align-items:center; justify-content:center; max-width:240px; width:100%; border-radius:4px; margin-top:80px; height:60px; padding:0 20px; font-weight:700; font-size:18px; color:#fff; background:#262a2d; transition:background .2s , box-shadow .2s;}
.about_wrap .btn:hover{background:#4099ed; box-shadow:5px 5px 20px rgba(0,0,0,0.2);}
.about_wrap .btn:before{content:''; width:14px; height:14px; background:url('../images/ico_edit_myinfo.png') 0 0 no-repeat;  margin-right:8px;}

/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
	@media (max-width: 1240px) {
		.about_wrap{padding:0 0 40px 0;}
		.about_wrap .title{font-size:60px; letter-spacing:-4px; line-height:0.9; margin-bottom:40px;}
		.about_wrap .txt{font-size:16px;}
		.about_wrap .btn{margin-top:40px; font-size:16px; height:50px; max-width:140px;}
	}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.about_wrap{padding:0 0;}
		.about_wrap .title{font-size:40px; letter-spacing:-4px; margin-bottom:20px;}
		.about_wrap .btn{max-width:100%;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */



.about_course_wrap{padding:0 0 120px 0;}
.about_course_wrap .titlebox{display:flex; align-items:flex-end; margin-bottom:60px}
.about_course_wrap .titlebox .title{font-size:120px; font-weight:800; letter-spacing:-11px; line-height:0.9;}
.about_course_wrap .titlebox .title strong{color:#4099ed;}
.about_course_wrap .titlebox .btn{margin-left:auto; display:inline-flex; align-items:center; justify-content:center; max-width:240px; width:100%; border-radius:4px; margin-top:80px; height:60px; padding:0 20px; font-weight:700; font-size:18px; color:#fff; background:#262a2d; transition:background .2s , box-shadow .2s;}
.about_course_wrap .titlebox .btn:hover{background:#4099ed; box-shadow:5px 5px 20px rgba(0,0,0,0.2);}
.about_course_wrap .titlebox .btn:before{content:''; width:14px; height:14px; background:url('../images/ico_edit_myinfo.png') 0 0 no-repeat;  margin-right:8px;}

/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
	@media (max-width: 1240px) {
		.about_course_wrap{padding:0 0 40px 0;}
		.about_course_wrap .titlebox{margin-bottom:40px;}
		.about_course_wrap .titlebox .title{font-size:60px; letter-spacing:-4px; line-height:0.9;}
		.about_course_wrap .titlebox .btn{margin-top:40px; font-size:16px; height:50px; max-width:140px;}
	}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.about_course_wrap{padding:0 0;}
		.about_course_wrap .titlebox{display:block; margin-bottom:20px;}
		.about_course_wrap .titlebox .title{font-size:40px; letter-spacing:-4px;}
		.about_course_wrap .titlebox .btn{max-width:100%; margin-top:20px;}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */



.about_course_wrap .itemlist{border-top:2px solid #000;}
.about_course_wrap .item{display:flex; padding:60px 0; border-bottom:1px solid #ddd;}
.about_course_wrap .item .col.left{padding-right:40px; flex:none; font-size:30px; width:240px; line-height:1;}
.about_course_wrap .item .col.right{flex:1;}


/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
	@media (max-width: 1240px) {
		.about_course_wrap .item{flex-direction:column;}
		.about_course_wrap .item .col.left{
			width:100%;
			padding-right:0;
			margin-bottom:20px;
			font-size:24px;
			line-height:1.2;
		}
	}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.about_course_wrap .item{
			padding:30px 0;
		}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */

.about_course_wrap .item table{
	width:100%;
	border-radius:10px;
	border:1px solid #ddd;
	overflow:hidden;
	background:#fff;
}
.about_course_wrap .item table th,
.about_course_wrap .item table td{padding:20px 10px; word-break:auto-phrase;}
.about_course_wrap .item table thead th{background:#f5f5f5; padding:10px;}
.about_course_wrap .item table tbody tr + tr td{border-top:1px solid #ddd;}
/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
	@media (max-width: 768px) {
		.about_course_wrap .item table colgroup,
		.about_course_wrap .item table thead,
		.about_course_wrap .item table th,
		.about_course_wrap .item table td{display:none;}
		.about_course_wrap .item table .td_m_visible{
			display:block; 
			text-align:left;
			padding:20px;
			font-size:14px;
		}
		.about_course_wrap .item table .m_title{
			font-weight:bold;
			font-size:16px;
		}
		.about_course_wrap .item table .m_cat{
			font-size:14px;
			color:#737373;
			margin-bottom:10px;
		}
		.about_course_wrap .item table .m_subtitle{
			font-size:14px;
			color:#737373;
		}
		.about_course_wrap .item table .m_txt{
			font-size:14px;
			margin-top:20px;
		}
	}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */


.courselist_2{}
.courselist_2 .course_group{display:flex;}
.courselist_2 .course_group + .course_group{margin-top:30px;}
.courselist_2 .course_name{}
.courselist_2 .col_name{flex:none; flex:none; font-size:30px; width:240px; padding:10px 40px 10px 0; font-weight:300; line-height:1; color:#fff;}
.courselist_2 .col_itemlist{flex:1; display:flex; flex-wrap:wrap; margin-left:-20px;}
.courselist_2 .col_itemlist li{padding:10px 0px; width:calc(25% - 20px); margin-left:20px;}
.courselist_2 .col_itemlist .item{display:flex;flex-direction:column; min-height:110px;height:100%}
.courselist_2 .col_itemlist .item .titlebox{flex:1; background:#fff;border-radius: 6px 6px 0 0; padding:14px; box-shadow:5px 5px 2px rgba(0,0,0,0.1);}
.courselist_2 .col_itemlist .item .txtbig{font-weight:600; line-height:1; font-size:18px; margin-bottom:4px; color:#fff;}
.courselist_2 .col_itemlist .item .txtsmall{color:rgba(255,255,255,0.7);}
.courselist_2 .col_itemlist .item .btngroup{display:flex; flex:none;}
.courselist_2 .col_itemlist .item .btngroup .btn{flex:1; height:40px; text-decoration:underline; font-size:16px; display:flex; align-items:center; justify-content:center; font-weight:600;}
.courselist_2 .col_itemlist .item .btngroup .btn + .btn{margin-left:10px;}

.courselist_2 .course_group.blue .col_name{color: #4099ed;}
.courselist_2 .course_group.blue .col_itemlist .item .titlebox{background:#4099ed;}

.courselist_2 .course_group.black .col_name{color: #262a2d;}
.courselist_2 .course_group.black .col_itemlist .item .titlebox{background:#262a2d;}

.courselist_2 .course_group.gray .col_name{color: #787878;}
.courselist_2 .course_group.gray .col_itemlist .item .titlebox{background:#787878;}

.courselist_2 .course_group.green .col_name{color: #119083;}
.courselist_2 .course_group.green .col_itemlist .item .titlebox{display:flex; align-items:center; justify-content:center; background:#b8e5e0;}
.courselist_2 .course_group.green .col_itemlist .item .txtbig{color:#000; font-size:20px; text-align:center;}

/* ------------------------------------------------------------------ MEDIA 1240px : S ------------------------------------------------------------------ */
@media (max-width: 1240px) {
	.courselist_2 .course_group{display:block;}
	.courselist_2 .col_name{
		width: 100%;
		padding-right: 0;
		margin-bottom: 10px;
		font-size: 24px;
		line-height: 1.2;
		padding:0;
	}
}
/* ------------------------------------------------------------------ MEDIA 1240px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 1040px : S ------------------------------------------------------------------ */
@media (max-width: 1040px) {
	.courselist_2 .col_itemlist li{width:calc(25% - 20px);}
}
/* ------------------------------------------------------------------ MEDIA 1040px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 768px : S ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.courselist_2 .col_itemlist li{width:calc(50% - 20px);}
}
/* ------------------------------------------------------------------ MEDIA 768px : E ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ MEDIA 480px : S ------------------------------------------------------------------ */
@media (max-width: 480px) {
	.courselist_2 .col_itemlist {margin-left:0;}
	.courselist_2 .col_itemlist li{width:100%; margin-left:0;}
	.courselist_2 .col_itemlist .item{border-radius:12px;}
}
/* ------------------------------------------------------------------ MEDIA 480px : E ------------------------------------------------------------------ */



/* CONTENTS : E */