@charset "utf-8";
/************************************************************************
 * 파일명      : style.css
 * 설명        : 이러닝사이트 공통 스타일
 * 작성자      : 에듀스 개발팀
 * 작성일      : 2020-12-07
************************************************************************/

* {margin:0; padding:0; font-family:"NanumSquare","Noto Sans KR","맑은 고딕", "굴림", "굴림체", "돋움", "돋움체", Dotum, AppleGothic, Sans-serif; font-size:12px;outline:none;vertical-align:middle}
html {padding:0; margin:0; height:100%}
body{*word-break:break-all;
	-ms-word-break:break-all;
	line-height: 130%;
	height: 100%;
	color: #444444;}
input,button{color: #444444;}
h1,h2{margin:0; padding:0;}
h3,h4,h5,h6{margin:0; padding:0}

h3{font-weight: 400; color: #808080;padding:8px 0px}

img,fieldset,iframe{border:0 none;}
li{list-style:none;}
a{  selector-dummy:expression(this.hideFocus=true);	color:#525252;	text-decoration:none;}
a:hover{	color:#000;	text-decoration:none;}


/* Form */
em,address{font-style:normal;}
button,label{cursor:pointer;_cursor /**/:hand;}
button *{position:relative;}
button img{left:-3px;*left:auto;}
textarea{overflow:auto;font-family:'맑은 고딕'}
form	{margin:0; padding:0;}
input	{
	height:18px;
	padding:2px 4px;
	color:#7D7D7D;
	vertical-align:middle;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #B7B7B7;
	border-right-color: #E0E0E0;
	border-bottom-color: #E0E0E0;
	border-left-color: #B7B7B7;
	background-color: #FFF;
}
input[type="radio"] 	{
	border:none;
	background:#ffffff;
}
input[type="checkbox"] 	{
	border:none;
	background:#ffffff;    vertical-align: middle;
    margin-top: -1px;
    display: inline-block;margin-right:3px
}

textarea {
	border:1px solid #c3cece;
	background:#FFF;
	color:#444444;
	vertical-align: middle;
	margin: 0px;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 0;
	padding-left: 4px;
}
select	{
	vertical-align:middle;
	color:#444444;
	border: 1px solid #C8C8C8;
	
	font-size: 12px;
	padding: 1px;
}
html:first-child select{height:24px;padding-right:6px;}
input[type=image] {border-spacing:0px;border-style:none;padding:0px; border:0 none; vertical-align:middle;}


/* Common */
.nomar	{margin-top:0 !important;}
.nopad	{padding-top:0 !important;}
.btn {position:absolute}
.btn_more {position:absolute}

.cb { clear:both; height:0px; overflow:hidden; margin:0; padding:0 }
.fl { float:left; }
.fr { float:right; }
.dpInline { display:inline }
.dpNone {display: none;}
.hi1 { height:1px; }
.minus1 {font-size:90%;}
.radio, .checkbox {border:none;  background:none; padding:0 4px 0 0; margin:0;}

/* color */
.col_white{ color:#FFF}
.col_gray{ color:#919191}
.col_green{ color:#16929B}
.col_pink{ color:#FF4E73}

/* Button */
.btnBox .center {text-align:center;}

/* Padding */
.tpad1 { padding-top:1px; } .tpad3 { padding-top:3px; } .tpad5 { padding-top:5px; } .tpad7 { padding-top:7px; } .tpad10 { padding-top:10px; } .tpad12 { padding-top:12px; } .tpad15 { padding-top:15px; } .tpad20 { padding-top:20px; }
.tpad25 { padding-top:25px; } .tpad30 { padding-top:30px; } .tpad35 { padding-top:35px; } .tpad40 { padding-top:40px; } 
.tpad45 { padding-top:45px; } .tpad50 { padding-top:50px; } .tpad55 { padding-top:55px; } .tpad60 { padding-top:60px; } 
.bpad5 { padding-bottom:5px; } .bpad10 { padding-bottom:10px; } .bpad15 { padding-bottom:15px; } .bpad20 { padding-bottom:20px; } 
.bpad25 { padding-bottom:25px; } .bpad30 { padding-bottom:30px; } .bpad35 { padding-bottom:35px; } .bpad40 { padding-bottom:40px; } .bpad45 { padding-bottom:45px; } .bpad50 { padding-bottom:50px; }
.lpad5 { padding-left:5px; } .lpad7 { padding-left:7px; } .lpad10 { padding-left:10px; } .lpad12 { padding-left:12px; } .lpad15 { padding-left:15px; } .lpad20 { padding-left:20px; }
.lpad25 { padding-left:25px; } .lpad30 { padding-left:30px; } .lpad35 { padding-left:35px; } .lpad40 { padding-left:40px; } .lpad65 { padding-left:65px; } .lpad110 { padding-left:110px; } 
.rpad5 { padding-right:5px; } .rpad7 { padding-right:7px; } .rpad10 { padding-right:10px; } .rpad15 { padding-right:15px; } .rpad20 { padding-right:20px; }
.rpad25 { padding-right:25px; } .rpad30 { padding-right:30px; } .rpad35 { padding-right:35px; } .rpad40 { padding-right:40px; } 

/* Margin */
.tmargin5 { margin-top:5px; } .tmargin7 { margin-top:7px; } .tmargin10 { margin-top:10px; } .tmargin12 { margin-top:12px; } .tmargin14 { margin-top:14px; } .tmargin15 { margin-top:15px; } .tmargin18 { margin-top:18px; }.tmargin20 { margin-top:20px; }
.tmargin25 { margin-top:25px; } .tmargin28 { margin-top:28px; } .tmargin30 { margin-top:30px; } .tmargin35 { margin-top:35px; }
.tmargin38 { margin-top:38px; }
 .tmargin40 { margin-top:40px; } .tmargin50 { margin-top:50px; } .tmargin55 { margin-top:55px; } 
.lmargin3 { margin-left:3px; } .lmargin5 { margin-left:5px; } .lmargin10 { margin-left:10px; } .lmargin15 { margin-left:15px; } .lmargin20 { margin-left:20px; }
.lmargin25 { margin-left:25px; } .lmargin30 { margin-left:30px; } .lmargin35 { margin-left:35px; } .lmargin40 { margin-left:40px; } .lmargin45 { margin-left:45px; } .lmargin50 { margin-left:50px; }
.lmargin55 { margin-left:55px; } .lmargin60 { margin-left:60px; }
.bmargin5 { margin-bottom:5px; } .bmargin10 { margin-bottom:10px; } .bmargin15 { margin-bottom:15px; } .bmargin20 { margin-bottom:20px; }
.bmargin25 { margin-bottom:25px; } .bmargin30 { margin-bottom:30px; } .bmargin35 { margin-bottom:35px; } .bmargin40 { margin-bottom:40px; }
.rmargin5 { margin-right:5px; } .rmargin10 { margin-right:10px; } .rmargin15 { margin-right:15px; } .rmargin20 { margin-right:20px; }
.rmargin25 { margin-right:25px; } .rmargin30 { margin-right:30px; } .rmargin45 { margin-right:45px; }

/* Font-Size */
.fs11 { font-size:11px; }
.fs12 { font-size:12px; }
.fs15 { font-size:15px; }
.ls{letter-spacing:-1px}
.ls0{letter-spacing:0px}

/* Text-Align */
.txtCenter { text-align:center; }
.txtRight { text-align:right; }
.txtLeft { text-align:left!important; }
.justify { text-align:justify; }

/* Vertical-Align */
.vaTop { vertical-align:top; }
.vaMiddle{ vertical-align:middle; }
.vaBottom{ vertical-align:bottom; }

/* Paginate */
.paginate {
	padding:10px 0;
	text-align:center;
}
.paginate a img { border:none; vertical-align:middle; _vertical-align:top;}
.paginate a
  {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	_width /**/:18px;
	padding:2px 8px 3px 6px;
	color:#A6A6A6;
	text-decoration:none;
	line-height:normal;
	font-size:14px;
	background:url(/images/line_pg.gif) no-repeat left center;
}
.paginate a:hover { text-decoration:underline;}
.paginate strong { color:#f44f5f !important; font-weight:bold;font-size:16px;}
.paginate .first-child { background:none;}
.paginate a.pre,
.paginate a.next { padding:0; background:none !important;}
.paginate a.pre { margin:0 3px 0 -6px;}
.paginate a.next { margin:0 3px 0 -3px;}



.button{
	font:11px "맑은 고딕"; letter-spacing:-1px;

	/* A semi-transparent text shadow */
	text-shadow:1px 1px 0 rgba(255,255,255,0.4);
	
	/* Overriding the default underline styling of the links */
	text-decoration:none !important;
	white-space:nowrap;	
	display:inline-block;
	vertical-align:baseline;
	position:relative;
	cursor:pointer;
	padding:3px 5px 2px 5px;
	background:url(../images/btn_bg_basic.gif) repeat-x bottom left;

	
	/* Multiple backgrounds version. The background images
	   are defined individually in color classes */
	
	background-position:bottom left, top right, 0 0, 0 0;
	background-clip:border-box;
	
	/* Applying a default border raidus of 2px */
	
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	
	/* Animating the background positions with CSS3 */
	/* Currently works only in Safari/Chrome */
	
	-webkit-transition:background-position 1s;
	-moz-transition:background-position 1s;
	transition:background-position 1s;
}

.b_blue{padding:2px 8px 4px 8px;border:1px solid #0066cc;color:#0066cc;font-size:11px;vertical-align:middle}
.b_gray{padding:2px 8px 4px 8px;border:1px solid #a6a3a7;color:#a6a3a7;font-size:11px;vertical-align:middle}
.b_black{padding:2px 8px 4px 8px;border:1px solid #6f6b70;color:#555256;font-size:11px;vertical-align:middle}
.b_red{padding:2px 8px 4px 8px;border:1px solid #ff3300;color:#ff3300;font-size:11px;vertical-align:middle}

.b_green{padding:2px 8px 4px 8px;border:1px solid #007b53;color:#007b53;font-size:11px;vertical-align:middle}


.button:hover{background:url(/images/btn_bg_basic_hover.gif) repeat-x top left;}
.button:active{bottom:0px;}


.button2{
	color:#FFFFFF;
	font:11px "맑은 고딕"; letter-spacing:-1px;

	/* A semi-transparent text shadow 
	text-shadow:1px 1px 0 rgba(255,255,255,0.4);*/
	
	/* Overriding the default underline styling of the links */
	text-decoration:none !important;
	white-space:nowrap;	
	display:inline-block;
	vertical-align:baseline;
	position:relative;
	cursor:pointer;
	padding:1px 5px 4px 5px;
	background-color:#0066cc;

	
	/* Multiple backgrounds version. The background images
	   are defined individually in color classes */
	
	background-position:bottom left, top right, 0 0, 0 0;
	background-clip:border-box;
	
	/* Applying a default border raidus of 2px */
	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	
	/* Animating the background positions with CSS3 */
	/* Currently works only in Safari/Chrome */
	
	-webkit-transition:background-position 1s;
	-moz-transition:background-position 1s;
	transition:background-position 1s;
}

.b_blue2{border:1px solid #0066cc;color:#FFFFFF;font-size:13px;vertical-align:middle;padding:3px 9px 5px 9px}

.button2:hover{color:#FFFFFF}
.button2:active{color:#FFFFFF}

input[type=text],input[type=password]{border:1px solid #b5b5b5;font-family:'맑은 고딕';}
input[type=text]:focus,input[type=password]:focus,textarea:focus{border:1px dashed #325778;}
input[type=text].error,input[type=password].error, textarea.error{
  border:1px solid red;background-color:#fdf9fb;
}

label.error{
  color:red;
  float:left;
}

.no-drag
{
  -ms-user-select: none; 
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

.mt7{margin-top:7px}
.mt8{margin-top:8px}
.mt10{margin-top:10px}
.mt12{margin-top:12px}
.mt15{margin-top:15px}
.mt80{margin-top:80px}
.mt35{margin-top:35px}
.mt40{margin-top:40px}
.mt46{margin-top:46px}

.red{color:red}

.length_css{color:red;margin-left:5px;line-height:12px;margin-right:3px}