@charset "utf-8";
body, a {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);    overflow-x: hidden;}

/* header-side ----------------------------------------------------------------------------------  */
#wrap-side{ z-index:3000;position:fixed;right:-200px;top:0px;width:200px;height:100%;
			background:#fff;border-left:1px solid #DDD;overflow-y:auto;overflow-x:hidden}
.gnb-side { background-color:#fff; }
.gnb-side li{ 
		border-top: 1px solid #393942;
		border-bottom: 1px solid #4f5058;
	    line-height:36px;}
.gnb-side li:first-child a { border-top: none; }
.gnb-side li:last-child a{ border-bottom: none; }
.gnb-side ul li:last-child a { border: none; }
.gnb-side li a {
	text-decoration: none;
	font-family: 'NanumBarunGothic';
	font-weight: 700;
	font-size: 14px;
	padding: 2px 0 2px 8px;
	border: none;
	color: #000;
	text-shadow: 1px 1px 1px rgba(0,0,0,.6);
}
.gnb-side li:hover > a { color: #000; }
.gnb-side ul { display: none;}
.gnb-side li:hover > ul { display: block;}
.gnb-side ul li{ line-height:30px; background-color:#737373; border: none; border-bottom: 1px solid #4f5058;}

.gnb-side ul li a {
	width: 188x;
	padding: 2px 0 2px 16px;
	margin: 0;
	font-family: NanumBarunGothic, Arial, sans-serif;
	font-weight: 400;
	font-size: 11px;
	border: none;	
}





#wrap {position:relative;background:#fff;} 

.topLink-wrap {position:relative;height:30px;width:100%;background:#ececec;}
.topLink-txt{float:left;width:58%;height:70px;text-algin:center;}

#topLink-logout {display:inline;}
#topLink-mypage {display: none;}

.topLink-kcpi {
    background: #565656;
    display: block;
    width: auto;
    float: left;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.topLink-kcpi-txt {
    display: inline-block;
    cursor: pointer;
    height: 15px;
    font-size: 13px;
    color: #fff !important;
    padding: 9px 20px 6px;
    font-weight: 400;
}

/* SUB-Menu  ---------------------------------------------------------------------------------------------------------------------------------------2020.05.29*/
.sub-content	{
	 float: left;
	 width: 100%;max-width:870px;
	 min-height:550px;
	}

.sub-menu {
    float: left;
    width: 200px;    
    height: 100%;
    box-sizing: border-box;
    margin-right: 30px;
    padding-bottom: 100px;
}

.sub-menu .tit {
    position: relative;
    width: 100%;
    height: 100px;
    line-height: 100px;
    background: url(../images/common/sub-menu-bg-02.png) no-repeat 0 0;
    background-size: 100% auto;
    background-size: cover;
    color: #fff;
    font-size:16pt; font-weight:bold;
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


.sub-menu > ul > li > a {
    display: block;
    line-height: 140%;
    font-size: 15px;
    letter-spacing: -1px;
    padding: 15px 25px 15px 15px;
    color: #000;
    border-bottom: 1px solid #dfdfdf;
    background-image: url(../images/common/sub-menu-arrow-03.png);
    background-repeat: no-repeat;
    background-position: 175px center;
}

.sub-menu > ul > li > a.over {
    background-color: #767676;
    background-image: url(../images/common/sub-menu-arrow-04.png);
    color: #fff;
}

.sub-line-bg {	overflow:hidden;	background:url(../images/common/sub-line-bg.png) repeat-y 0 0;}

/* SUB-Menu  ---------------------------------------------------------------------------------------------------------------------------------------2020.05.29*/


/* LNB */
.topLink-lnb {padding-top:6px;}
.topLink-lnb li {display:inline;
								border-left:1px solid #ccc;
								padding-right:5px; padding-left:10px; color:#333;font-size:14px; }
.topLink-lnb li.none {border: none;}
.topLink-lnb li a {color:#333;}
.topLink-lnb li a:link {color:#333; text-decoration:none;}
.topLink-lnb li a:visited {color:#333; text-decoration:none;}
.topLink-lnb li a:hover {color:#c20324; text-decoration:none;}
.topLink-lnb li a:active {color:#c20324; text-decoration:none;}


.topNavi-wrap {position:relative;height:110px;width:100%;border-bottom:1px solid #ccc;z-index:1;background:#fff;}
#header-navi .topNavi-mobile-gnb {display:none;}
#header-navi .topLogo {padding-top:10px;position:relative;width:200px;}

#topNavi-gnb-wrap{position:absolute;width:100%;top:80px; }


#topNavi-gnb li {float:left;list-style:none;width:25%;text-align:center; 
	background: url(../images/common/lnb_cut.gif) no-repeat right 2px;}
#topNavi-gnb li.none {background: none;}

#topNavi-gnb li a {box-sizing:border-box; display:inline-block; text-align:center; color:#333; font-size:14pt; font-weight:bold; padding: 2px 0 10px 0;  }
#topNavi-gnb li a:link {color:#333; text-decoration:none;}
#topNavi-gnb li a:hover {color:#6c57a4 !important; background:url(../images/common/lnb_on_bg.gif) repeat-x 0px 26px;}
#topNavi-gnb li a:active {color:#6c57a4; text-decoration:none;}
#topNavi-gnb li a:current {color:#6c57a4; text-decoration:none;}
#topNavi-gnb li a.on {color:#6c57a4; text-decoration:none;}

#topNavi-gnb > li > ul { border:1px solid #ccc; 
    width: 100%;
    height: 320px;
    padding: 10px 0 0 0;  
    margin-top:-5px;   
}

#topNavi-gnb > li > ul > li {
	float:none;   
	background: none;
	width: 100%; 
    padding: 0;
    font-size:14px; font-weight:400;
}
#topNavi-gnb > li > ul > li a {	box-sizing:border-box; display:inline-block; text-align:center; color:#333; font-size:14px; font-weight:400;}
#topNavi-gnb > li > ul > li a:hover {color:#000 !important; background:none;}
#topNavi-gnb > li > ul.sub-list-1 {background-color: #f7e0c7;}
#topNavi-gnb > li > ul.sub-list-2 {background-color: #cee9da;}
#topNavi-gnb > li > ul.sub-list-3 {background-color: #f7e0c7;}
#topNavi-gnb > li > ul.sub-list-4 {background-color: #cee9da;}



.spot-sub { height: 180px;    margin-top: 0;    position: relative;    text-align: center;
}

.spot-sub-bg-01 {	background:url(../images/common/sub-bg-01.png) 50% 50%;background-size: cover;}
.spot-sub-bg-02 {	background:url(../images/common/sub-bg-02.png) 50% 50%;background-size: cover;}
.spot-sub-bg-03 {	background:url(../images/common/sub-bg-03.png) 50% 50%;background-size: cover;}
.spot-sub-bg-04 {	background:url(../images/common/sub-bg-04.png) 50% 50%;background-size: cover;}
.spot-sub-bg-05 {	background:url(../images/common/sub-bg-05.png) 50% 50%;background-size: cover;}

.spot-sub-container {
	
}

.sub-Title {    padding-top: 50px;    font-size: 38px;    color: #fff;    font-weight: 600;    margin: 0px;}

.menuTitle { position:relative; min-width:320px; height:50px; border-bottom:2px solid #f4f4f4; margin-bottom:30px ;}
.route { position:absolute; top:0; left:0; height:30px; background:url(../images/common/bullet_snb.png) no-repeat 0 -120px; font-size:16pt; font-weight:bold; padding-top:15px}
.menuTitle span { position:absolute; top:20px;; right:15px; font-size:10pt; }

#subNavi-box {width:100%;background:#6c57a4;}
#subNavi-wrap {width:100%;max-width:1100px;margin:0 auto;}
.subNavi-list ul li {margin:0 10px;}
.subNavi-list ul li:before {left:-10px;}
.subNavi-list ul li:first-child {margin-left:15px;}
.subNavi-list li a span {font-size:11px;padding-top:10px;padding-bottom:10px;}

@-webkit-keyframes viewConSub {
	0% {opacity:0;}
	100% {opacity:1;}
}
@keyframes viewConSub {
	0% {opacity:0;}
	100% {opacity:1;}
}


/* Container */ 
#container { width:100%;  min-height:550px; margin:0 auto; background:#f6f7f9;
			position:relative; display:block; }
#container:after {content:""; display:block; clear:both;}

.work { position:relative; width:100%; max-width:1100px;margin: 0 auto;}  


/* #footer-addr */
#footer-wrap {width:100%; background:#ececec;border-top:1px solid #ccc;height:70px;}
#footer-addr {word-break:keep-all;font-size:12px;} 

#footer-addr .footer-logo {display:block;padding:15px 0;width:200px;}
#footer-addr .addr {display:block;padding:12px 0;line-height:200%;}

#footer-addr .privacy {position:absolute; top:20px; right:0; width:300px; text-align:right;font-size:1em; }
#footer-addr .privacy li {display:inline; margin:0 5px; border-right:1px solid #ccc; padding-right:10px;}
#footer-addr .privacy li.none {border:none;}
#footer-addr .privacy li a {color:#999;}
#footer-addr .privacy li a:link {color:#999; text-decoration:none;}
#footer-addr .privacy li a:visited {color:#999; text-decoration:none;}
#footer-addr .privacy li a:hover {color:#f80; text-decoration:none;}
#footer-addr .privacy li a:active {color:#f80; text-decoration:none;}





/* #메인화면구성 */
.m-top25 {margin-top:25px;}
#top-m-25 {padding-top:25px;}

#m-spot-container {width: 100%;background:#fff;overflow: hidden;box-sizing: border-box;}
#spot-slides-box{ position: relative; float: left;  width: 67%; }

#spot-banner-box { float: left;  width: 33%;  }
#spot-banner-box ul { overflow: hidden; }
#spot-banner-box ul li { float: left;width: 50%; list-style: none; padding: 0px;height: 180px;}
#spot-banner-box ul li.sb1 {background:#f6901e;}
#spot-banner-box ul li.sb2 {background:#009345;}
#spot-banner-box ul li.sb3 {background:#6c57a4;}
#spot-banner-box ul li.sb4 {background:#626262;}
#spot-banner-box ul li.sb5 {background:#626262;}
#spot-banner-box ul li.sb6 {background:#626262;}

#spot-banner-box ul li.sb1 a { display: inline-block;box-sizing:border-box; width: 100%;    padding: 110px 10px 10px 10px;            
    	background: url(../images/common/ico-07.png);     background-repeat: no-repeat;     background-position:  center 30px;    	    
    	font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:center; color: #fff;    font-size: 12pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;}
			
#spot-banner-box ul li.sb2 a { display: inline-block;box-sizing:border-box; width: 100%;    padding: 110px 10px 10px 10px;            
    	background: url(../images/common/ico-08.png);     background-repeat: no-repeat;     background-position:  center 30px;    	    
    	font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:center; color: #fff;    font-size: 12pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;}
			
#spot-banner-box ul li.sb3 a { display: inline-block;box-sizing:border-box; width: 100%;    padding: 125px 10px 10px 10px;            
    	background: url(../images/common/ico-09.png);     background-repeat: no-repeat;     background-position:  center 30px;    	    
    	font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:center; color: #fff;    font-size: 12pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;}
			
#spot-banner-box ul li.sb4 a { display: inline-block;box-sizing:border-box; width: 100%;    padding: 125px 10px 10px 10px;            
    	background: url(../images/common/ico-10.png);     background-repeat: no-repeat;     background-position:  center 30px;    	    
    	font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:center; color: #fff;    font-size: 12pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;}

#spot-banner-box ul li.sb5 a { display: inline-block;box-sizing:border-box; width: 100%;    padding: 125px 10px 10px 10px;            
    	background: url(../images/common/ico-06-on.png);     background-repeat: no-repeat;     background-position:  center 30px;    	    
    	font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:center; color: #fff;    font-size: 12pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;}

#spot-banner-box ul li.sb6 a { display: inline-block;box-sizing:border-box; width: 100%;    padding: 125px 10px 10px 10px;            
    	background: url(../images/common/ico-11.png);     background-repeat: no-repeat;     background-position:  center 30px;    	    
    	font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:center; color: #fff;    font-size: 12pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;}




#spot-banner-box ul li.sb1 a:hover,#spot-banner-box ul li.sb2 a:hover,#spot-banner-box ul li.sb3 a:hover,#spot-banner-box ul li.sb4 a:hover ,#spot-banner-box ul li.sb5 a:hover  {-webkit-transform:scale(1.10);-ms-transform:scale(1.10);transform:scale(1.10)}


#m-course-container {width: 99%;background:#fff;border:1px solid #ccc;}
#m-course-box {padding: 0 25px 50px 25px;}
#m-prog-container {width: 100%;}


.prog-box { position:relative;overflow:hidden;vertical-align:middle;display:inline-block;width:240px;height:260px;padding:0;}
.prog-img { text-align:center;border:1px solid #cdcdcd;height:170px;overflow:hidden;background-size:cover;}
.prog-img img:hover  {-webkit-transform:scale(1.10);-ms-transform:scale(1.10);transform:scale(1.10)}
.prog-dept {font-weight:400; text-align:left; font-size:11px; margin:5px 0; color:#898989;
			padding:10px 10px 1px;
			text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.prog-title {    white-space: normal;    line-height: 25px;    -webkit-line-clamp: 2;    height: 50px;
    text-align: left;    word-wrap: break-word;    display: -webkit-box;    -webkit-box-orient: vertical;padding-left:10px;
    font-weight:600;    font-size: 17px;    color: #666;    overflow: hidden;    text-overflow: ellipsis;    
}
.prog-date {font-weight:400; text-align:center; font-size:12px; margin:5px 0}

.prog-img-title { margin:0;padding:2px 4px 0;height:20px;line-height:20px;vertical-align:top;display:inline-block;
			text-align:left;
			font-size:16px;			
		    color: #fff !important;		    
		    position:absolute;left:10px;top:35px;
		    text-shadow:3px 3px 3px rgb(0,0,0);
 }
 .prog-img-keyword {font-size:12px;}
.prog-img-info { margin:0;padding:0;height:30px;width:70px;line-height:30px;display:inline-block;
			font-size:11pt;			
			background: #000;
		    color: #fff !important;	
		    font-weight:600;    
		    position:absolute;left:2px;top:2px;
 }
 
#m-prog-container .bx-wrapper .bx-controls-direction a {position: absolute;margin-top: 1px;margin-right: 22px;outline: 0; 
			text-indent: -9999px;z-index:1999;color:#000;}
#m-prog-container .bx-wrapper .bx-prev {
		right: 25px;padding: 5px 0 0 9px; 
		width:14px;height:20px;
		border:1px solid #e3e7ee;
		background-color:#fff;
		background: url('../images/common/bg_form2.png') no-repeat 1px 1px;
		cursor:pointer;
		}
#m-prog-container .bx-wrapper .bx-next {
		right: 1px;padding: 5px 0 0 9px; 
		width:14px;height:20px;
		border:1px solid #e3e7ee;
		background-color:#fff;
		background: url('../images/common/bg_form2.png') no-repeat -14px 1px;
		cursor:pointer;} 
 


#m-banner-container {width: 100%;background:#fff;border:1px solid #ccc;box-sizing: border-box;padding: 25px ; overflow: auto;}
#m-banner-container h3 { color: #222222; font-size: 22px; font-weight: normal; letter-spacing: -0.05em; }
#m-banner-container  ul li{float:left ; width:32%; margin: 0 2% 0 0 ; }


#m-banner-container  ul li.op-list-01 {}
#m-banner-container  ul li.op-list-02 {}
#m-banner-container  ul li.op-list-03 {margin-right:0;}
#m-banner-container  ul li.op-list-04 {margin-top:20px;}
#m-banner-container  ul li.op-list-05 {margin-top:20px;}
#m-banner-container  ul li.op-list-06 {margin-top:20px;margin-right:0;}

#m-banner-container  ul li.op-list-01 a {  display: inline-block;box-sizing:border-box; width: 100%;    height: 76px; padding: 30px 30px 0 80px;            
    background: url(../images/common/ico-01.png);     background-repeat: no-repeat;     background-position: 15px center;
    border:1px solid #dbd8d3; background-color:#eae7e2;    
    font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:right; color: #555;    font-size: 16pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;  }
#m-banner-container  ul li.op-list-02 a {  display: inline-block;box-sizing:border-box; width: 100%;    height: 76px; padding: 30px 30px 0 80px;            
    background: url(../images/common/ico-02.png);     background-repeat: no-repeat;     background-position: 15px center;
    border:1px solid #dbd8d3; background-color:#eae7e2;    
    font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:right; color: #555;    font-size: 16pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;  }
#m-banner-container  ul li.op-list-03 a {  display: inline-block;box-sizing:border-box; width: 100%;    height: 76px; padding: 30px 30px 0 80px;            
    background: url(../images/common/ico-03.png);     background-repeat: no-repeat;     background-position: 15px center;
    border:1px solid #dbd8d3; background-color:#eae7e2;    
    font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:right; color: #555;    font-size: 16pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;  }   
#m-banner-container  ul li.op-list-04 a {  display: inline-block;box-sizing:border-box; width: 100%;    height: 76px; padding: 10px 30px 0 80px;            
    background: url(../images/common/ico-04.png);     background-repeat: no-repeat;     background-position: 15px center;
    border:1px solid #dbd8d3; background-color:#eae7e2;    
    font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:right; color: #555;    font-size: 10pt;    font-weight: 700;    line-height: 30px;    letter-spacing: -0.01em;  }
#m-banner-container  ul li.op-list-05 a {  display: inline-block;box-sizing:border-box; width: 100%;    height: 76px; padding: 30px 30px 0 80px;            
    background: url(../images/common/ico-05.png);     background-repeat: no-repeat;     background-position: 15px center;
    border:1px solid #dbd8d3; background-color:#eae7e2;    
    font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:right; color: #555;    font-size: 16pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;  }    
#m-banner-container  ul li.op-list-06 a {  display: inline-block;box-sizing:border-box; width: 100%;    height: 76px; padding: 30px 30px 0 80px;            
    background: url(../images/common/ico-06.png);     background-repeat: no-repeat;     background-position: 15px center;
    border:1px solid #dbd8d3; background-color:#eae7e2;    
    font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:right; color: #555;    font-size: 16pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;  }
    
#m-banner-container  ul li.op-list-01 a:hover { background: url(../images/common/ico-01-on.png);     background-repeat: no-repeat;     background-position: 15px center;color:#fff; background-color:#626262;}  
#m-banner-container  ul li.op-list-02 a:hover { background: url(../images/common/ico-02-on.png);     background-repeat: no-repeat;     background-position: 15px center;color:#fff; background-color:#626262;}
#m-banner-container  ul li.op-list-03 a:hover { background: url(../images/common/ico-03-on.png);     background-repeat: no-repeat;     background-position: 15px center;color:#fff; background-color:#626262;}
#m-banner-container  ul li.op-list-04 a:hover { background: url(../images/common/ico-04-on.png);     background-repeat: no-repeat;     background-position: 15px center;color:#fff; background-color:#626262;}
#m-banner-container  ul li.op-list-05 a:hover { background: url(../images/common/ico-05-on.png);     background-repeat: no-repeat;     background-position: 15px center;color:#fff; background-color:#626262;}
#m-banner-container  ul li.op-list-06 a:hover { background: url(../images/common/ico-06-on.png);     background-repeat: no-repeat;     background-position: 15px center;color:#fff; background-color:#626262;}

.banner-tel {font-family: 'NotoSansKR Medium','NanumBarunGothic';    text-align:right; color: #555;    font-size: 20pt;    font-weight: 700;    line-height: 22px;    letter-spacing: -0.01em;  }
.banner-tel  a:hover {color:#fff;}    
#btn-side {display:none;position:absolute; top:14px; right:14px;  width:70%; text-align:right;}

/* 페이지타이틀 ----------------------------------------------------------------------------------  */

.my-menu { visibility: hidden;    position: absolute;    top: 36px;    right: 4px;    width: 100px;    height: auto;
    background: #1a7496;    border: 1px solid hsla(0,0%,100%,.2);    border-radius: 4px;    margin: 0;    z-index: 10;    opacity: 0;
    transition: opacity .15s ease;    padding: 8px 32px;    z-index:10000;
}

.my-menu-open {    opacity: 1;    visibility: visible;}

.my-menu-item {	border-bottom: 1px solid hsla(0,0%,100%,.2);    list-style: none;    margin: 0;}

.my-menu-item:last-child {    border-bottom: none;    opacity: .5;}

.my-menu-link {    text-decoration: none;    font-family: Lato;    font-size: 12px;    font-weight: 700;    padding: 18px 0;
    letter-spacing: .17em;    text-transform: uppercase;    color: #fff;    text-align: left;    display: block;    line-height: 15px;    background: transparent;
    outline: none;    cursor: pointer;    width: 100%;}

.slidesjs-slide img { background-size:cover;}


/* 과정안내 ----------------------------------------------------------------------------------  */
.course-list {     width: 100%;    border-top: 1px solid #626262;    border-bottom: 2px solid #626262; }

.course-list  > li {border-top: 1px solid #d7d7d7;     width: 100%; vertical-align: top;}

.course-img {position:relative; width: 100%;  max-width: 25%;  display: inline-block;    vertical-align: top;    margin: 20px 0px;    verflow:hidden; border: 1px solid #efefef;}
.course-img img {verflow:hidden;background-size:cover;}
.course-img img:hover  {-webkit-transform:scale(1.10);-ms-transform:scale(1.10);transform:scale(1.10);}

.course-img-view {position:relative; width: 100%;  max-width: 25%;  display: inline-block;    vertical-align: top;    margin: 20px 0px;    verflow:hidden; border: 1px solid #efefef;}
.course-img-view img {verflow:hidden;background-size:cover;}
#course-heart:hover  {-webkit-transform:scale(1.10);-ms-transform:scale(1.10);transform:scale(1.10);}



.course-cont { width: 100%;     max-width: 70%;     margin-left: 20px;     display: inline-block;    } 
.course-title  p { font-size: 16pt;    font-weight:700;  margin: 20px 10px;   }
.course-title  span { font-size: 11pt;    line-height: 120%;    color: #333;    display: inline-block;  margin: 10px 20px 15px; }

.course-info  p { font-size: 13pt;    font-weight:700;  margin: 2px 10px 0;    
	background:url(../images/common/bullet_snb.png) no-repeat -200px 2px;text-indent: 30px; }
.course-info  span { font-size: 11pt;    line-height: 120%;    color: #333;   display: inline-block;margin:5px 40px 15px;}

.course-dday { margin:0;padding:0;height:30px;width:75px;line-height:30px;display:inline-block; text-align:center;
			font-size:16px;					background: #000;		    color: #fff !important;font-weight:600; position:absolute;left:2px;top:2px;
 }
 .course-inter { margin:0;padding:0;height:30px;width:30px;line-height:30px;display:inline-block; text-align:center; position:absolute;right:4px;bottom:4px;
 }

/* 과정목차 ----------------------------------------------------------------------------------  */
.wh400hidden {display:inline}
.wh400View {display:none}
	
.cont-list { margin: 0 auto; }
.cont-list .cont-ul li { padding:31px 20px 10px 90px;border-bottom:1px solid #ccc; font-size:20pt; font-weight:bold;line-height:1;}
.cont-list .cont-ul li:last-child {border-bottom:0 solid #ccc;}
.cont-list .cont-ul li .info { font-size:11px;color:#555;font-family: 'NanumBarunGothic';}
.cont-list .cont-ul li .preview {position: relative;float: right;top:-40px;}
.cont-list .cont-ul li .study {position: relative;float: right;top:-40px;padding-right:10px;}


.no_1 { background:url(../images/common/classList_no.png) no-repeat 20px 30px;}
.no_2 { background:url(../images/common/classList_no.png) no-repeat 20px -70px;}
.no_3 { background:url(../images/common/classList_no.png) no-repeat 20px -170px;}
.no_4 { background:url(../images/common/classList_no.png) no-repeat 20px -270px;}
.no_5 { background:url(../images/common/classList_no.png) no-repeat 20px -370px;}
.no_6 { background:url(../images/common/classList_no.png) no-repeat 20px -470px;}
.no_7 { background:url(../images/common/classList_no.png) no-repeat 20px -570px;}
.no_8 { background:url(../images/common/classList_no.png) no-repeat 20px -670px;}
.no_9 { background:url(../images/common/classList_no.png) no-repeat 20px -770px;}
.no_10 { background:url(../images/common/classList_no.png) no-repeat 20px -870px;}
.no_11 { background:url(../images/common/classList_no.png) no-repeat 20px -970px;}
.no_12 { background:url(../images/common/classList_no.png) no-repeat 20px -1070px;}
.no_13 { background:url(../images/common/classList_no.png) no-repeat 20px -1170px;}
.no_14 { background:url(../images/common/classList_no.png) no-repeat 20px -1270px;}
.no_15 { background:url(../images/common/classList_no.png) no-repeat 20px -1370px;}
.no_16 { background:url(../images/common/classList_no.png) no-repeat 20px -1470px;}
.no_17 { background:url(../images/common/classList_no.png) no-repeat 20px -1570px;}
.no_18 { background:url(../images/common/classList_no.png) no-repeat 20px -1670px;}
.no_19 { background:url(../images/common/classList_no.png) no-repeat 20px -1770px;}
.no_20 { background:url(../images/common/classList_no.png) no-repeat 20px -1870px;}
.no_21 { background:url(../images/common/classList_no.png) no-repeat 20px -1970px;}
.no_22 { background:url(../images/common/classList_no.png) no-repeat 20px -2070px;}
.no_23 { background:url(../images/common/classList_no.png) no-repeat 20px -2170px;}
.no_24 { background:url(../images/common/classList_no.png) no-repeat 20px -2270px;}
.no_25 { background:url(../images/common/classList_no.png) no-repeat 20px -2370px;}
.no_26 { background:url(../images/common/classList_no.png) no-repeat 20px -2470px;}
.no_27 { background:url(../images/common/classList_no.png) no-repeat 20px -2570px;}
.no_28 { background:url(../images/common/classList_no.png) no-repeat 20px -2670px;}
.no_29 { background:url(../images/common/classList_no.png) no-repeat 20px -2770px;}
.no_30 { background:url(../images/common/classList_no.png) no-repeat 20px -2870px;}


/* 페이지타이틀 ----------------------------------------------------------------------------------  */
.sub-title-box {width:100%;min-height:40px;background:url(../images/common/bullet_snb.png) no-repeat 0 -120px;}
.sub-title {float:left;width:85%;font-size:1.6rem; font-weight:bold;margin-top:18px;min-height:40px;}
.sub-date {float:right;width:15%;text-align:right; font-size:10pt;margin-top:24px;}



.hidden-br2 {display:none}

/* 1100 보다 큰경우 ----------------------------------------------------------------------------------  */
@media (min-width:1100px){
	#m-spot-container{position:relative;height:360px !important;z-index:0;}
	
	#slides {display: none;position:relative; height:360px !important; }
	
	a.slidesjs-play, a.slidesjs-stop {display: block;position:absolute;bottom:1px;width:10px;height:20px;text-align:center;text-indent:-9999px;background:url(../images/common/btn_slider.png) no-repeat;z-index:1001;} 
   	a.slidesjs-play { left:700px; background-position: -77px -67px; }
	a.slidesjs-stop { left:700px; background-position: -67px -67px; }
			
   	#slides .slidesjs-navigation {margin-top:3px;}
	#slides .slidesjs-previous, 
	#slides .slidesjs-next {display:none;}
	
	#slides .slidesjs-stop {margin-right: 5px;float: left;}
	
	.slidesjs-pagination { position:absolute;margin: 6px 0 0;bottom:10px;z-index:999;left:300px;}
	.slidesjs-pagination li {float: left; margin: 0 1px; }
	.slidesjs-pagination li a {display: block; width: 13px; height: 0; padding-top: 12px; background-image: url(../images/common/btn_slider.png); background-position: -34px -54px; float: left; overflow: hidden;}		
	.slidesjs-pagination li a.active,.slidesjs-pagination li a:hover.active {width: 30px; background-position:0px -41px; }
	.slidesjs-pagination li a:hover {  background-position:-34px -54px;}
	}

/* 799 크고 1100 보다 작은경우 ----------------------------------------------------------------------------------  */
@media (min-width: 799px) and (max-width: 1099px) {
	.slidesjs-slide img {position: absolute; top:0; left: 0;	width: 100%;height: 100%;}
}

/* 640 크고 1100 보다 작은경우 ----------------------------------------------------------------------------------  */
@media (min-width: 641px) and (max-width: 1099px) {


		/*slide*/
		#m-spot-container{position:relative;height:100%;z-index:0;}
		
		#slides {display: none;position:relative;height:100%;}
		
		a.slidesjs-play, a.slidesjs-stop {display: block;position:absolute;bottom:1px;width:10px;height:20px;text-align:center;text-indent:-9999px;background:url(../images/common/btn_slider.png) no-repeat;z-index:1001;} 
    	a.slidesjs-play { left:1500px; background-position: -77px -67px; }
		a.slidesjs-stop { left:1500px; background-position: -67px -67px; }
		
		#slides .slidesjs-stop {margin-right: 5px;float: left;}
		
		.slidesjs-pagination { position:absolute;margin: 6px 0 0;bottom:10px;z-index:999;left:920px;}
		.slidesjs-pagination li {float: left; margin: 0 1px; }
		.slidesjs-pagination li a {display: block; width: 13px; height: 0; padding-top: 12px; background-image: url(../images/common/btn_slider.png); background-position: -34px -54px; float: left; overflow: hidden;}		
		.slidesjs-pagination li a.active,.slidesjs-pagination li a:hover.active {width: 30px; background-position:0px -41px; }
		.slidesjs-pagination li a:hover {  background-position:-34px -54px;}
				
		.footer-addr {margin:0 10px 10px;}		
    }

/* 1100  보다 작은경우 ----------------------------------------------------------------------------------  */
@media (max-width: 1100px) 
{	
	.sub-menu {display:none;}
	.sub-line-bg {background:url(../images/common/sub-line-bg-none.png) repeat-y 0 0;}
	.sub-content	{width:95%; max-width:1050px; margin-left:15px;margin-right:15px;}
}

@media screen and (max-width:980px){
	#footer-addr .addr{width:100%; font-size:11px; text-align:center;margin: 0 auto;line-height:125%; padding-top:45px;}	
	#footer-addr .footer-logo {display:none;}
	}
/* 800  보다 작은경우 ----------------------------------------------------------------------------------  */
@media screen and (max-width:799px){
	
	#topLink-logout {display:none;}
	#topLink-mypage {display: inline;}
	
	
	#header-navi .topLink-txt ,#selMenuPath {display:none;}
	#top-m-25 {padding-top:0;}
	#btn-side {display:inline;}
	
	#topNavi-gnb-wrap  {display:none;} 
	.topNavi-wrap{height:60px;}	
	.topLogo img {width:108px;}
	#header-navi .topLogo {padding-left:10px;padding-top:15px;}
	
	#wrap-side {display:block; -webkit-box-sizing:border-box; box-sizing:border-box; position:fixed; top:0; right:-65%; z-index:2000; width:65%; height:100%; text-align:left;}
	#wrap-side.on {-webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0);}	
	#wrap-side {-webkit-transition:all .4s ease-out; transition:all .4s ease-out;}
	
	#gnb-side  li { float:none; width:100%;}
	#gnb-side  li {border-bottom:1px solid #cdcdcd;background: #dedede;}
	#gnb-side  li:first-child {border-top:1px solid #cdcdcd;}

	#gnb-side li a {padding:5px 5px 5px 10px; font-weight:700;  text-align:left; font-size:12pt;vertical-align:sub;}
		
	
	#gnb-side .gnb-side-sub li {background: #ededed;}
	#gnb-side .gnb-side-sub li a {text-align:left; font-size:10pt;font-weight:400; padding:5px 0 5px 20px;vertical-align:sub;}
	
	
	.my-menu {top:30px;}
	
	
	#spot-slides-box{ width: 100%; }

	#spot-banner-box {width: 100%;  }
	
	.hidden-br {display:none}		
	#m-banner-container  ul li{width:49%; margin: 0 2% 0 0 ; }
	
	#m-banner-container  ul li.op-list-01 {}
	#m-banner-container  ul li.op-list-02 {margin-right:0;}
	#m-banner-container  ul li.op-list-03 {margin-top:15px;margin-right:2%;}
	#m-banner-container  ul li.op-list-04 {margin-top:15px; margin-right:0;}
	#m-banner-container  ul li.op-list-05 {margin-top:15px;}
	#m-banner-container  ul li.op-list-06 {margin-top:15px;margin-right:0;}
	
	
	.spot-sub {height:100px;}
	.sub-Title 	{padding-top:30px;font-size:20pt;}
	
	.cont-list ul li {padding:20px 10px 10px 90px; font-size:1.2rem; font-weight:bold}	
	.cont-list .cont-ul li .preview {top:-20px;}
	.cont-list ul li .preview img{width:36px;}
	
	.cont-list .cont-ul li .study {top:-20px;}
	.cont-list ul li .study img{width:36px;}
	
	.sub-title-box {min-height:30px;}
	.sub-title {margin-top:8px;font-size:1.2rem; }
	.sub-date {font-size:11px; }
	
	.cont-list .cont-ul li { font-size:18pt;}
	.btn {	font-size:12pt }	
	.btn-small { font-size: 8pt; }
    .btn-large {  font-size: 14pt;}
	
}

/* 640  보다 작은경우 ----------------------------------------------------------------------------------  */
@media (max-width: 640px) 
{
		.hidden-br2 {display:inline}
		.tab-box-fix li a {font-size:9pt;}
     	.spot-sub {height:60px;}
		.sub-Title 	{padding-top:20px;font-size:14pt;}
		/*slide*/
		#m-spot-container{position:relative;height:100%;z-index:0;}
		
		#slides {display: none;position:relative;height:100%;}
		
		.slidesjs-play, .slidesjs-stop,  .slidesjs-previous, .slidesjs-next {display: none;}
				
    		
		.slidesjs-pagination { position:absolute;margin: 6px 0 0;bottom:10px;z-index:999;left:920px;}
		.slidesjs-pagination li {float: left; margin: 0 1px; }
		.slidesjs-pagination li a {display: block; width: 13px; height: 0; padding-top: 12px; background-image: url(../images/common/btn_slider.png); background-position: -34px -54px; float: left; overflow: hidden;}		
		.slidesjs-pagination li a.active,.slidesjs-pagination li a:hover.active {width: 30px; background-position:0px -41px; }
		.slidesjs-pagination li a:hover {  background-position:-34px -54px;}
	
		.footer-addr {margin:0 10px 10px;}		
		#user-info {font-size:12px;}
		
		.course-img { max-width: 280px;margin: 10px auto 0; display: block;}
		.course-img-view { max-width: 280px;margin: 10px auto 0; display: block;}

		.course-cont{max-width:95%;}		
	   .pageInfo  {display:none}
	   
	   .rBoard .r-chk,	
		.rBoard .r-file,	
		.rBoard .r-nm,	
		.rBoard .r-date2,
		.rBoard .r-hit {display:none;}
		.rBoard th {font-size:11px;}	
		
		.cont-list .cont-ul li { font-size:16pt;}
	
}


@media screen and (max-width:399px){
	
	#m-banner-container  ul li{width:100%; margin: 0 0 0 0 ; }
	
	#m-banner-container  ul li.op-list-01 {}
	#m-banner-container  ul li.op-list-02 {margin-top:10px;}
	#m-banner-container  ul li.op-list-03 {margin-top:10px;}
	#m-banner-container  ul li.op-list-04 {margin-top:10px;}
	#m-banner-container  ul li.op-list-05 {margin-top:10px;}
	#m-banner-container  ul li.op-list-06 {margin-top:10px;}
	
	.cont-list .cont-ul li .study {display:none}
	.cont-list .cont-ul li {font-size:14pt}
	.cont-list .cont-ul li {padding:31px 10px 10px 90px}
	.wh400hidden {display:none}
	.wh400View {display:inline}
	
	.rBoard .r-chk,
	.rBoard .r-num,
	.rBoard .r-file,
	.rBoard .r-nm,
	.rBoard .r-date,
	.rBoard .r-date2,
	.rBoard .r-w760,
	.rBoard .r-hit {display:none;}
	.rBoard th {font-size:11px;}
		
	
	}
	
