@charset "utf-8";
.wrapper{margin:auto; width:82%}
*{margin:0; padding:0; font-family:'Malgun Gothic', '맑은고딕', 'Noto Sans KR', 'Nanum Gothic', sans-serif}
html,body,div,object,iframe,h1,h2,h3,h4,h5,h6,p,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,canvas,details,figcaption,summary,time,mark,audio,video{margin:0; padding:0; font-family:'Malgun Gothic', '맑은고딕', 'Noto Sans KR', 'Nanum Gothic','나눔고딕', sans-serif; font-size:15px; line-height:150%; list-style-type:none; text-decoration:none; color:#484848 }
img{max-width:100%}
body{min-width:320px}

/***** covid *****/
.main .visual.covid19:before{content:''; position:absolute; left:0; right:0; top:25px; width:100%; height:200px; background:url(/edu/images/covid19.png) center top no-repeat; z-index:2;}
.main .visual.covid19:after{content:''; position:absolute; left:0; right:0; top:0; width:100%; height:100%; min-height:515px; background:rgba(0,0,0,.8); z-index:1;}
.main .visual.covid19 .txt{position:absolute; left:0; right:0; top:250px; text-align:center; margin:auto; width:100%; max-width:530px; word-break:keep-all; z-index:3; padding:5%; border-radius:10px; background:#fff;}
.main .visual.covid19 .txt p {margin-bottom:20px; font-size:17px;}
.main .visual.covid19 .txt .tit{font-size:28px; margin-bottom:35px; font-weight:600; }
.main .visual.covid19 .txt span {color:#eb4550; font-weight:600;}
.main .visual.covid19 .txt .con2 {padding-top:20px; border-top:1px dashed #ccc;}
.main .visual.covid19 .txt .con2 .sbtn {background-color:#eb4550; border-radius:30px; margin-top:15px;}

/***** inc *****/
#gnb{position:absolute; top:40px; right:25px}
#gnb ul li{margin:3px 3px; border:1px solid #222}
#gnb ul li a{display:block; text-align:center; padding:0px 5px 2px; width:70px; font-size:14px}
#gnb ul li.login a{background:#222; color:#fff}
#gnb ul li.logout a{background:#222; color:#fff}
.main #gnb{top:25px}
.btn_goTop a{display:block; padding:20px 10px; text-align:center; background:#333; font-size:18px; color:#fff; text-decoration:none}

/***** main *****/
.main{background:#fff}
.main .wrap{position:absolute; width:100%; min-width:340px; height:100%}
.main .visual{position:fixed; left:0px; width:44%; height:100%; background:url(/edu/images/visual.jpg) no-repeat center center}
.main .visual p.slogan{margin-top:250px; text-align:center}
.main #contents{position:absolute; right:0px; width:56%; height:100%; min-width:640px; background:rgba(255,255,255,.8)}
.main #contents h1{padding-top:79px; text-align:center; word-break:keep-all; font-size:36px; line-height:140%; font-weight:normal; color:#111; letter-spacing:-3px}
.main #contents p.txt{text-align:center; margin:20px 0px; padding-bottom:35px; font-size:18px; color:#333; background:url(/edu/images/arr.png) no-repeat center bottom}
.main #contents .dongbox{position:relative; margin:auto; padding:6%; width:380px; border:5px solid #000}
.main #contents .dongbox:after,
.main #contents .dongbox:before{display:block; content:''; position:absolute; width:49px; height:49px; background-repeat:no-repeat; background-position:center center}
.main #contents .dongbox:after{top:-20px; right:-20px; background-image:url(/edu/images/boxbgT.png)}
.main #contents .dongbox:before{bottom:-20px; left:-20px; background-image:url(/edu/images/boxbgB.png)}
.main #contents .dongbox ul{clear:both; padding:10px 0px; overflow:hidden}
.main #contents .dongbox ul>li{position:relative; float:left}
.main #contents .dongbox ul>li:after{display:block; content:'/'; position:absolute; top:10px; left:-5px; font-size:18px}
.main #contents .dongbox ul>li:first-child:after{display:none}
.main #contents .dongbox ul>li>a{display:block; padding:7px 30px; font-size:18px; color:#333}


/***** sub *****/
body{background:#f0f0f0}
header{background:#fff}
header h1{padding:55px 100px; text-align:center}
header h1 a{font-weight:normal; font-size:35px; color:#111; letter-spacing:-3px}
header .wrapper{position:relative}

#detail_con{padding:70px 0px; background:url(/edu/images/sub_visual.gif) no-repeat right top}
h4{margin-top:50px; margin-bottom:10px; font-size:24px; color:#111; font-weight:normal}
.tbox{margin:10px 0px; padding:20px; border:1px solid #333}
.point{color:#b92323}
/*** 메뉴 ***/
.navBox{padding:0px 0%; margin-bottom:55px}
.navBox:after{display:block; content:''; clear:both}
.navBox nav ul{float:left; width:49.5%; overflow:hidden}
.navBox nav ul li{float:left; width:33%; margin-right:.3%; background:#f0f0f0}
.navBox nav ul li a{display:block; position:relative; height:78px; text-align:center; border:1px solid #333; letter-spacing:-1px; word-break:keep-all}
.navBox nav ul li a p{position:absolute; top:50%; transform:translateY(-49%); width:100%; font-size:18px}
.navBox nav ul li.select{background:#ce3939}
.navBox nav ul li.select a{border-color:#aa2727}
.navBox nav ul li.select a p{font-weight:bold; color:#fff}
/*** 검색박스 ***/
.donglec_search{position:relative; background:#fff; margin:0px .6% 20px}
.donglec_search form{position:relative; padding-right:140px; overflow:hidden}
.donglec_search div.search_condition{float:left; overflow:hidden; width:65%}
.donglec_search div.search_condition>div{position:relative; float:left; padding:19px 0px 22px; box-sizing:border-box}
.donglec_search div.search_condition div.lec_dong{width:20%; padding:20px}
.donglec_search div.search_condition div.lec_dong:after{display:block; content:''; position:absolute; right:0px; top:50%; transform:translateY(-50%);  width:1px; height:18px; background:#d9d9d9}
.donglec_search div.search_condition div.lec_target{width:30%}
.donglec_search div.search_condition div.lec_target:after{display:block; content:''; position:absolute; right:0px; top:50%; transform:translateY(-50%);  width:1px; height:18px; background:#d9d9d9}
.donglec_search div.search_condition div select{padding:10px 40px 10px 20px; width:100%;  border:0px; font-size:18px; appearance:none; -moz-appearance:none; -webkit-appearance:none;  background:url(/edu/images/select_arr.gif) no-repeat 88% center}
.donglec_search div.search_condition div select::-ms-expand{display:none}
.donglec_search div.search_condition div.lec_term{width:50%; position:relative; padding:20px 0px 0px 105px}
.donglec_search div.search_condition div.lec_term p.tit{position:absolute; left:20px; top:24px; font-size:18px;}
.donglec_search div.search_condition div.lec_term input[type=text]{text-align:center; height:43px; line-height:43px; border:2px solid #eee; 
font-size:18px; width:43%; box-sizing:border-box}
.donglec_search div.search_condition div.lec_cate{margin:0px 2% 0px 5%; width:30%}
.donglec_search div.search_condition div.lec_cate:after{display:block; content:''; position:absolute; right:0px; top:50%; transform:translateY(-50%);  width:1px; height:18px; background:#d9d9d9}
.donglec_search div.search_condition div.lec_cate+div.lec_term{width:60%}
.donglec_search div.lecname{float:right; width:35%; height:100%}
.donglec_search div.lecname input[type=text]{border:0px; padding:0px 5%; height:82px; line-height:82px; width:90%; font-size:18px; color:#666; background:#f9f9f9; border-left:1px solid #eee}
.donglec_search div.lecname input[type=submit]{position:absolute; top:0px; right:0px; width:140px; height:100%; font-size:18px; font-weight:bold; color:#fff; background:#666; border:0px}

.donglec_list ul:after{display:block; content:''; clear:both}
.donglec_list>ul>li{position:relative; float:left; margin:.6%; width:23.8%; background:#fff; box-shadow:0px 1px 2px rgba(0,0,0,.15);}
.donglec_list>ul>li:hover{box-shadow:0px 2px 10px rgba(0,0,0,.3)}
.donglec_list>ul>li.close{opacity:.7}
.donglec_list>ul>li a{text-decoration:none}
.donglec_list>ul>li dl{padding:0px 10%; height:100%; border:3px solid transparent; box-sizing:border-box}
.donglec_list>ul>li dl:hover{border-color:#aa2727}
.donglec_list>ul>li dl dt{padding:0px 5px; height:110px; border-bottom:1px solid #d9d9d9; overflow:hidden}
.donglec_list>ul>li dl dt p{position:relative; top:50%; transform:translateY(-50%); color:#111; font-size:21px; word-break:keep-all}
.donglec_list>ul>li dl dt p.longletter{font-size:18px; letter-spacing:-1px}
.donglec_list>ul>li dl dt p.longH{line-height:130%}
.donglec_list>ul>li dl dd{padding:20px 0px}
.donglec_list>ul>li dl dd ul li{position:relative; padding-left:10px; text-overflow:ellipsis; white-space:nowrap}
.donglec_list>ul>li dl dd ul li:after{display:block; content:''; position:absolute; left:3px; top:50%; transform:translateY(-38%); width:3px; height:3px; background:#333}
.donglec_list>ul>li dl dd ul li p{display:inline-block; vertical-align:top}
.donglec_list>ul>li dl dd ul li p.q{min-width:55px}
.donglec_list>ul>li dl dd ul li p.letter3{letter-spacing:7px; max-width:55px}
.donglec_list>ul>li dl dd ul li p.letter2{letter-spacing:28px; max-width:55px}
/*
.donglec_list .lec_state{margin-left:8px; padding:1px 8px 3px; font-weight:bold; font-size:14px; border-radius:30px}
.donglec_list .lec_state.state1{color:#b92323; border:2px solid #b92323}
.donglec_list .lec_state.state2{color:#3d49b8; border:2px solid #3d49b8}
.donglec_list .lec_state.state3{color:#444; border:2px solid #444}
.donglec_list .lec_state.state4{color:#366438; border:2px solid #366438}
.donglec_list .lec_btn{display:inline-block; padding:0px 15px 2px; border-radius:60px; background:#ddd}
.donglec_list .lec_btn.btn1{background:#b92323; color:#fff}
.donglec_list .lec_btn.btn2{background:#3d49b8; color:#fff}
.donglec_list .lec_btn.btn3{background:#888; color:#fff}
.donglec_list .lec_btn.btn4{background:#366438; color:#fff}
*/

.lec_state{margin-left:8px; padding:1px 8px 3px; font-weight:bold; font-size:14px; border-radius:30px}
.lec_state.state1{color:#b92323; border:2px solid #b92323}
.lec_state.state2{color:#3d49b8; border:2px solid #3d49b8}
.lec_state.state3{color:#444; border:2px solid #444}
.lec_state.state4{color:#366438; border:2px solid #366438}
.lec_btn{display:inline-block; padding:0px 15px 2px; border-radius:60px; background:#ddd}
.lec_btn.btn1{background:#b92323; color:#fff}
.lec_btn.btn2{background:#3d49b8; color:#fff}
.lec_btn.btn3{background:#888; color:#fff}
.lec_btn.btn4{background:#366438; color:#fff}

.donglec_list.mylec>ul>li{width:48.8%}
.donglec_list.mylec>ul>li.once{width:100%; margin:0px}
.donglec_list.mylec>ul>li dl dd{padding:20px 0px 30px}
.donglec_list.mylec>ul>li dl dd ul li{padding:5px 0px 5px 10px; border-top:1px dotted #ddd}
.donglec_list.mylec>ul>li dl dd ul li:first-child{border-top:0px}
.donglec_list.mylec .lec_state{margin-left:0px; font-size:15px}

/***** program *****/
.btn{padding:12px 15px; min-width:85px; border-radius:0px; border:0px !important}
input.btn{padding:10px 50px}
.btn.btn_ok{background:#b92323; border:1px solid #b92323}
.btn:hover{box-shadow:none !important; border:0px}
.sbtn{padding:3px 10px 5px; background:#666; border:0px; color:#fff; border-radius:0px; text-decoration:none}
.sbtn:hover{text-decoration:none}
.sbtn:hover:after{display:none}

/*
.sbtn { display:inline-block; position:relative; margin-bottom:3px; padding:1px 10px; min-width:55px; line-height:20px;  background-color:#f3f3f3; transition:all .2s ease; font-size:14px; border:1px solid #dbdbdb; border-radius:3px; overflow:visible; }
.sbtn:hover { background-color:#fff; color:#f3692b; }
.sbtn:hover:after { display:block; content:''; position:absolute; top:-4px; left:-1px; width:100%; height:100%; border:1px solid #f3692b; border-radius:4px; background-color:#f3692b; z-index:-1; }*/

.btnBox{}

table.general_board thead th{padding:15px 5px; background:none}
table.general_board tbody td{padding:15px 0px}
form table.general_board{background:#fff}
.board_title{padding:30px 5px 10px}
.board_title p.state{top:5px; left:5px; right:auto}
.board_view p.sblet{font-size:24px; color:#111}
/*** 페이징 ***/
.paging{margin-top:40px}
.paging a{width:40px; height:40px; line-height:40px; font-weight:normal; font-size:18px; border:1px solid #d8d8d8}
.paging a.page_btn{width:40px; height:40px; border:0px}
.paging a.page_btn.first{background:url(/edu/images/btn_first.png) no-repeat center center}
.paging a.page_btn.prev{background:url(/edu/images/btn_prev.png) no-repeat center center}
.paging a.page_btn.next{background:url(/edu/images/btn_next.png) no-repeat center center}
.paging a.page_btn.last{background:url(/edu/images/btn_last.png) no-repeat center center}
.paging a.select{background:#333; border-color:#111}
.paging.paging_mb>div{font-size:18px; max-width:150px}
.paging input[type=text]{padding:0px 5px; height:35px; line-height:35px; font-size:18px}
.paging input[type=submit]{padding:0px 10px; height:35px; line-height:35px; font-size:18px}
.board_write{background:#fff}


/**************************************************************************************************************************/

@media screen and (max-width:1600px){ 
	.wrapper{width:92%}	
}

@media screen and (max-width:1400px){ 
	html,body,div,object,iframe,p,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,canvas,details,figcaption,summary,time,mark,audio,video{margin:0; padding:0; font-family:'Nanum Gothic','나눔고딕', sans-serif; font-size:14px; line-height:150%; list-style-type:none; text-decoration:none; color:#484848 }
	.navBox{margin-bottom:8px}
	.navBox nav ul{float:none; width:80%}
	.navBox nav ul li a{height:70px}
	
	.donglec_search{margin-top:40px}
	.donglec_search div.search_condition{width:100%}
	.donglec_search div.search_condition>div{padding-top:10px !important; padding-bottom:10px !important}
	.donglec_search div.lecname{width:100%; border-left:0px; border-top:1px solid #eee}
	.donglec_search div.search_condition div.lec_term p.tit{top:16px}
	.donglec_search div.lecname input[type=text]{height:60px; line-height:60px}
	.donglec_list>ul>li{margin:.6%; width:32.1%}
	.donglec_list>ul>li dl dt{height:94px}
	.donglec_list>ul>li dl dt p{font-size:19px}
}
@media screen and (max-width:1200px){
	.donglec_list>ul>li{margin:.5%; width:49%}
}
@media screen and (min-width:801px){ 
	.dp_mb{display:none}
	.pc_block{display:block}
}
@media screen and (max-width:800px){ 
	.dp_pc{display:none}
	.mb_block{display:block}

	.main .visual.covid19 {position:relative; height:850px;}
	.main .visual.covid19:before {top:-25px;}
	.main .visual.covid19 .txt {top:200px;}
	
	#gnb{position:absolute; top:13px; right:10px}
	#gnb ul li{}
	#gnb ul li.logout a,
	#gnb ul li.login a{padding:38px 0px 3px; width:60px; background:url(/edu/images/ic_login.png) no-repeat center 8px; font-size:14px; color:#333}
	#gnb ul li.teacher{display:none}
	.main #gnb{top:25px; right:0px; width:100%}
	.main #gnb ul{text-align:center; letter-spacing:-5px}
	.main #gnb ul li{display:inline-block !important; position:relative; margin:0px; letter-spacing:0px}
	.main #gnb ul li:after{display:block; content:''; position:absolute; left:-3px; top:7px; width:2px; height:13px; background:#000}
	.main #gnb ul li:first-child:after{display:none}
	.main #gnb ul li a{padding:3px 3px 5px; background:none !important; color:#222 !important; font-weight:bold}
	#gnb ul li.logout a{width:76px}
	/* 메뉴버튼 클릭시 gnb보이게 
	#gnb p{position:absolute; right:-10px; top:-5px; z-index:999}
	.main #gnb p{right:-10px; top:-10px}
	#gnb p a{display:block; width:50px; height:50px; text-indent:-5000px}
	#gnb p a:after{display:block; content:''; position:absolute; top:15px; left:10px; width:30px; height:2px; background:#111; box-shadow:0px 10px 0px #111, 0px 20px 0px #111}
	#gnb ul{display:none; position:fixed; top:0px; right:0px; width:120px; height:100%; background:rgba(0,0,0,.95); z-index:998; transition:all ease .5s}
	#gnb ul li{margin:0px; border:0px; border-top:1px solid #333}
	#gnb ul li:last-child{border-bottom:1px solid #333}
	#gnb ul li:first-child{margin-top:65px}
	#gnb ul li a{display:block; text-align:center; padding:30px 0px; width:100%; font-size:14px; color:#fff; background:transparent !important}
	#gnb.close p{position:fixed; right:10px; top:10px; height:100%; z-index:999}
	#gnb.close p a:before,
	#gnb.close p a:after{display:block; content:''; position:absolute; top:22px; left:10px; width:40px; height:2px; background:#fff; transform:rotate(45deg); box-shadow:none}
	#gnb.close p a:before{transform:rotate(-45deg)}	
	*/

	.main .visual{width:100%}
	.main .visual p.slogan{display:none}
	.main #contents{position:relative; padding-bottom:60px; width:100%; min-width:100%; background:rgba(255,255,255,.5)}
	.main #contents h1{padding:70px 12% 0px; font-size:28px; font-weight:normal; color:#000; letter-spacing:-1px}
	.main #contents p.txt{font-size:17px}
	.main #contents p.txt>span{display:inline-block; padding:0px 30px 2px; background:#333; color:#fff; border-radius:80px}
	.main #contents .dongbox{margin:auto; padding:6% 5%; width:80%; border:3px solid #000; background:rgba(255,255,255,.7)}	
	.main #contents .dongbox:after,
	.main #contents .dongbox:before{display:none}
	.main #contents .dongbox ul{padding:0px}
	.main #contents .dongbox ul>li:after{top:7px; font-size:17px}
	.main #contents .dongbox ul>li>a{padding:7px 15px; font-size:17px}
	
	header h1{padding:20px 10px; text-align:left; width:220px}
	header h1 a{font-size:21px; font-weight:bold; letter-spacing:-0.5px; line-height:130%}
	#detail_con{padding:30px 0px; background-image:none}
	.navBox nav ul{float:none; width:100%}
	.navBox nav ul li a p{font-size:17px; line-height:20px}
	.donglec_search form{padding-right:80px}
	.donglec_search div.search_condition div select{padding:8px 30px 8px 8px; font-size:15px}
	.donglec_search div.search_condition>div.lec_dong{width:50%; padding:5px}
	.donglec_search div.search_condition>div.lec_target{width:50%}
	.donglec_search div.search_condition>div.lec_term{display:none}
	
	.donglec_search div.lecname{width:100%; border-top:0px; border-left:1px solid #eee}
	.donglec_search div.lecname input[type=text]{font-size:15px; height:50px; line-height:50px}
	.donglec_search div.lecname input[type=submit]{width:80px; font-size:16px}

	/*
	.donglec_search form{padding-left:90px; padding-right:80px}
	.donglec_search div.search_condition{position:absolute; left:0px;  width:90px}
	.donglec_search div.search_condition>div.lec_dong{width:100%; padding:20px 0px}
	.donglec_search div.search_condition div select{padding:5px 10px !important; font-size:15px}
	.donglec_search div.search_condition>div.lec_dong:after{display:none}
	.donglec_search div.search_condition>div.lec_target{display:none}
	.donglec_search div.search_condition>div.lec_term{display:none}
	.donglec_search div.search_condition div.lec_cate{margin:0px; width:100%}
	.donglec_search div.search_condition div.lec_cate:after{display:none}

	.donglec_search div.lecname{width:100%; border-top:0px; border-left:1px solid #eee}
	.donglec_search div.lecname input[type=text]{font-size:15px; height:50px; line-height:50px}
	.donglec_search div.lecname input[type=submit]{width:80px; font-size:16px}*/

	.donglec_list>ul>li{margin:0%; width:100%; background:transparent; box-shadow:none; border-bottom:1px solid #ddd}	
	.donglec_list>ul>li:hover{box-shadow:none}
	.donglec_list>ul>li dl{padding:10px 0px}
	.donglec_list>ul>li dl:after{display:none}
	.donglec_list>ul>li dl dt{padding:5px; height:auto; border:0px}
	.donglec_list>ul>li dl dt p{top:0%; transform:translateY(0); font-size:16px !important; font-weight:bold !important; line-height:150% !important}
	.donglec_list>ul>li dl dd{padding:0px 5px 5px}
	.donglec_list>ul>li dl dd ul li{display:none}
	.donglec_list>ul>li dl dd ul li.period{display:block}
	.donglec_list>ul>li dl dd ul li.time{display:block}
	.donglec_list>ul>li dl dd ul li .lec_state{margin-left:5px}
/*	.donglec_list>ul>li.close{opacity:.6} */
	.donglec_list>ul>li.close dt p{color:#666}
	.donglec_list.mylec>ul>li{margin-top:10px; width:100%; background:#fff}
	.donglec_list.mylec>ul>li dl{padding:20px 20px 0px}
	.donglec_list.mylec>ul>li dl dd{padding-bottom:20px}
	.donglec_list.mylec>ul>li dl dd ul li{display:block}
	.donglec_list.mylec>ul>li dl dd ul li:first-child{border-top:0px}
	.donglec_list.mylec .lec_state{margin-left:0px; font-size:15px}
	.donglec_list>ul>li dl dd ul li:after{top:10px}

  /* 정보 보일때 
	.donglec_list>ul>li{margin:.5%; width:49%}
	.donglec_list>ul>li dl{padding:0px 5%}
	.donglec_list>ul>li dl dt{padding:5% 5px; height:auto}
	.donglec_list>ul>li dl dt p{top:0%; transform:translateY(0); font-size:18px; font-weight:bold}
	.donglec_list>ul>li dl dd{padding:5% 0px}
	.donglec_list>ul>li dl dd ul li,
	.donglec_list>ul>li dl dd ul li p{line-height:130%}
	.donglec_list>ul>li dl dd ul li .lec_state{margin-left:5px}*/

	.paging a{width:30px; height:30px; line-height:30px; font-size:15px}
	.paging a.page_btn{width:25px; height:30px; line-height:30px; }
}
@media screen and (max-width:480px){
	.navBox select{padding:10px 10px; width:100px; font-size:16px}
	.navBox div.lecname input[type=text]{font-size:16px}
	.navBox div.lecname input[type=submit]{right:-60px; width:60px; font-size:16px}
	 /* 정보 보일때 
	.donglec_list>ul>li{margin:1% 0%; width:100%}*/

	.main .visual.covid19{height:600px; padding-bottom:50px;}
	.main .visual.covid19:before{height:140px; background-size:450px;}
	.main .visual.covid19 .txt{top:110px; width:auto;}
	.main .visual.covid19 .txt .tit {margin-bottom:20px; font-size:18px;} 
	.main .visual.covid19 .txt p {font-size:14px;}
}
@media screen and (max-width:435px){
	.main .visual.covid19{height:510px;}
	.main .visual.covid19:before{height:115px; background-size:370px;}
	.main .visual.covid19 .txt {top:85px;} 
	.main .visual.covid19 .txt .tit {margin-bottom:13px; }
	.main .visual.covid19 .txt p {margin-bottom:10px; font-size:12px;}
}