@charset "utf-8";

@import url("../lib/jquery.remodal.css");
@import url("../lib/MonthPicker.css");
@import url("../lib/jquery-ui.css");
@import url("../lib/jquery.dataTables.css");
@import url("../ui/ui.form.css");
@import url("../ui/ui.datatable.css");

/* CSS Document */
/* domfam Company by willy 2014_12_31 ver3.0  danboys@nate.com */

/* HTML5 RESET CSS Document */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;background:transparent;font-size:100%;vertical-align:middle;outline:0;-webkit-text-size-adjust:none}
html,body{width:100%;height:100%; -webkit-font-smoothing:antialiased;}

/* BODY 관련 색상조절 */
body,input,button,textarea{font-size:12px;line-height:1.5em;font-family:sans-serif; color:#000000}

h1,h2,h3,h4,h5,h6{font-size:12px;font-weight:normal;text-align:left}
article,aside,details,figcaption,figure,footer,header,menu,nav,section{display:block}
img,fieldset,iframe{border:0 none}
img{max-width:100%}
table,div{border-collapse:collapse}
select,textarea{border:1px solid #B7B6B6;background:#FFF;font-size:12px;color:#000;vertical-align:middle}
textarea{overflow:auto}
select,input,img,li{text-align:left;vertical-align:middle}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:normal;font-weight:normal}
ul,li,ol{list-style-type:none}
legend,caption{display:none}
blockquote:before,blockquote:after,q:before,q:after{content:' ';  }

@media all and (min-width:1024px) {
	body,input,button,textarea{ font-size:20px ;}
	select,textarea{font-size:20px }
}


/* LINK 관련 색상조절 */
a{margin:0;padding:0;background:transparent; vertical-align:baseline}
a:link,a:visited{color:#000;text-decoration:none;font-weight: 200;}
a:hover{text-decoration:underline;cursor:pointer}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;font-style:italic;font-weight:bold;color:#282828}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
hr{border-collapse:collapse}

/* skipnavi */
#accessibility,.skipnavi{visibility:hidden;overflow:hidden;position:absolute;width:0;height:0;font-size:0;line-height:0;text-indent:-9999px}

/* clearfix */
.clearfix:after{display:block;visibility:hidden;clear:both;height:0;content:'.'}
.clearfix{display:inline-block}

/* Hides from IE-mac \ */
*html .clearfix{height:1%}
.clearfix{display:block}

/* End hide from IE-mac */



/* /////////////////////////////////////////////////////////////////// */
/* //////////////////////////   global class   /////////////////////// */
/* ////////////한곳이 수정되면 사이트 전체가 수정되는 부분//////////// */
/* /////////////////////////////////////////////////////////////////// */

/* IR 시리즈 속성 정의 */
.ir{display:inline-block;overflow:hidden;text-indent:-5000px}

/* align 시리즈 속성 정의 */
.left{text-align:left !important}
.center{text-align:center !important}
.right{text-align:right !important}

/* none 시리즈 속성 정의 */
.none_bor{border:none !important}
.none_bg{background:none !important}
.none_dp{display:none !important}
.none_ma{margin:0 !important}
.none_pa{padding:0 !important}
.none_clear{clear:both !important}

/* font style 시리즈 속성 정의 */
.f_bold {font-weight: bold !important;}
.f_underline{text-decoration:underline !important}
.f_line_through{text-decoration:line-through !important}
.f_11{font-size:13px !important}
.f_letterspacing{ letter-spacing:-1px;}

/* font color 시리즈 속성 정의 */
.f_blue {color:#007ac3 !important;}
.f_darkblue {color:#005b91 !important;}
.f_red {color:#dd0000 !important;}


.bg_gray {background-color:#fafafa !important;}
.bg_green {background-color:#8dc919 !important;}

/* form 시리즈 속성 정의 */
input[type=tel]{margin:0;padding:0;border:0 none;appearance:none;-webkit-appearance:none;-moz-appearance:none;outline:none}
input[type=text]{margin:0;padding:0;border:0 none;appearance:none;-webkit-appearance:none;-moz-appearance:none;outline:none}
input.radio{display:block}
input.check{display:block}



a{text-decoration:none !important}

.block { display:block !important; }

hr.line_vertical {border-top: 1px solid #c9c9c9; border-bottom: 2px solid #FFF;; margin:0 0 15px 0; clear:both;}

.viewer img { max-width:100%; height:auto;}

/* //////////////////////////////////////////// */
/* //////////////   title class  ////////////// */
/* 사이트에서 사용되는 title메뉴들을 클래스 */
/* //////////////////////////////////////////// */


/* //////////////////////////////////////////// */
/* ///////////////   btn class  /////////////// */
/* 사이트에서 사용되는 btn메뉴들을 클래스 */
/* //////////////////////////////////////////// */

.btn {  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  display:inline-block; text-align:center; color:#fff; font-size: 1.1em; height:3em; line-height:3em; padding:0 1em; font-weight: bold; }
/* 타블렛용 버튼 */
@media all and (min-width:1024px) {
	.btn {   }
}

.btn_blue {color:#fff !important; background: #035568; }
.btn_red {color:#fff !important; background: #a90000 }
.btn_yellow {color:#fff !important; background: #c4c600 }
.btn_gray {color:#fff !important; background: #cbcbcb; }
.btn_black {color:#fff !important; background: #3c3c3c; }
.btn_disable {color:#fff !important; background: #999; }





/* //////////////////////////////////////////// */
/* ///////////////   tab class  /////////////// */
/* 사이트에서 사용되는 tab메뉴들을 클래스 */
/* //////////////////////////////////////////// */

.tabs { width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height:40px; display:inline-block; line-height:40px;}
.tabs ul {overflow:hidden;}
.tabs li { border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb;  float:left; background:#eee;}
.tabs li a {text-align: center; color:#b2b2b2; font-weight: bold; display:block; line-height: 38px; font-size: 1.1em;}
.tabs li.on {background:#fff;}
.tabs li.on a {color: #696969;}
.tabs_col2 li { width:50%;}
.tabs_col3 li { width:33%;}
.tabs_col4 li { width:25%;}


/* 타블렛용 탭메뉴 */
@media all and (min-width:768px) {
	.tabs {height:60px; }
	.tabs li a {line-height: 60px;}
}


/* //////////////////////////////////////////// */
/* /////////////   table class  /////////////// */
/* 사이트에서 사용되는 content부분의 table */
/* //////////////////////////////////////////// */

.table { position:relative;  border-bottom: 1px solid #FFF; margin-bottom: 15px; -webkit-overflow-scrolling: touch;}
.table .info {text-align:right; font-size: 12px; color:#007ac3; font-weight: bold;}
.table table {width: 100%; table-layout:fixed;}
.table thead th,
.table thead td { background: #fafafa; text-align:center; font-weight: bold; padding: 5px 0; min-height :28px; border-top: 1px solid #ececec; border-bottom: 1px solid #ececec;}
.table tbody td ,
.table tbody th { text-align:center; padding: 5px 0; min-height :28px;border-bottom: 1px solid #ececec;}

/* 텍스 정렬값 */
.table tbody td.left {text-align:left; }
.table tbody td.right {text-align:right; }

/* 테이블 보더 */
.table_border table { border: 1px solid #ececec;}
.table_border td { border: 1px solid #ececec;}
.table_border th { border: 1px solid #ececec;}

/* 테이블 가로 스크롤 */
.table_vertical_scroll { overflow:auto; }
.table_vertical_scroll table {table-layout:auto; }
.table_vertical_scroll th,
.table_vertical_scroll td {white-space:nowrap; padding: 5px 10px !important;}

/* 테이블 가로 스크롤 */
.table_nowrap td em {white-space:nowrap; text-overflow:ellipsis; overflow:hidden; width:100%; display:block;  }

/* 테이블 리스트 */
.table.table_list  { border-top: 1px solid #ececec;}
.table.table_list th {font-size: 0.9em;font-weight: bold;    background: #fafafa;}
.table.table_list td.desc {min-height:100px; text-align:left}

.table.table_schedule thead th {	background: #aae4f2; }
.table.table_schedule tbody tr:nth-child(odd) td {	background: #f2fcff; }
.table.table_schedule tbody tr:nth-child(even) td { background: #e5faff; }


 /* 테이블 공통 옵션 */
.table .must { color:#007ac3; }
.row_add a { display:block; margin:10px auto; }

.data_empty { text-align:center; font-size: 14px; color:#888888; font-weight: bold; padding-top:150px}


.table .btn { padding:0 1.5em; height: 2.3em; line-height: 2.3em; }
.table .btn_close {float:right; margin-right:5px}

.table .sum th,
.table .sum td {border: 0 none; background: #f6f6f6;}



/* //////////////////////////////////////////// */
/* //////////////   popup class  ////////////// */
/* 사이트에서 사용되는 popup 클래스 */
/* //////////////////////////////////////////// */

#bg_dim{display:none;position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000;opacity:0.5; z-index:1500;}
#alert_dim{position:fixed;top:0;left:0;width:100%;height:100%;background-color: rgba(0,0,0,0.8); z-index:1500;}
#loading_dim{position:fixed;top:0;left:0;width:100%;height:100%;background-color: rgba(0,0,0,0.6); z-index:1500;}
#loading_dim img {position:absolute; top:50%; margin-top:-13px; left:50%; margin-left:-13px; width:27px; height:27px;}

.popup {background-color: #fff;  display: none;   width:96%;  border-top: 3px solid #035568;  -webkit-box-sizing: border-box;   -moz-box-sizing: border-box;   box-sizing: border-box; padding-top: 10px;}
.popup .button.b-close { width:100%; height: 45px; line-height: 45px; font-size: 20px; text-align:center; color:#FFF; background: #035568; display:block;}
.popup .button.b-submit { width:100%; height: 45px; line-height: 45px; font-size: 20px; text-align:center; color:#FFF; background: #035568; display:block;}

.popup .btn {padding: 0 1em !important;   height: 2.5em !important;   line-height: 2.5em !important;}

.popup .btn.btn_search {width: 35px; height:35px !important;	background: url("../../images/btn_search.png") no-repeat 0 0; 	-webkit-background-size: 35px; background-size: 35px; border: none; text-indent: -5000em; 	 }



/* 타블렛용 탭메뉴 */
@media all and (min-width:1024px) {
	.popup .btn.btn_search {width: 55px; height:55px !important; -webkit-background-size: 55px; background-size: 55px;}
}


.popup_title {font-size: 1.5em; font-weight: bold; padding-top: 8px; display:block; padding-left: 0.5em;}
/* //////////////////////////////////////////// */
/* //////////////   area class  ////////////// */
/* 사이트에서 사용되는 area 클래스 */
/* //////////////////////////////////////////// */


/**
 * 검색영역
 * area_search
**/

.area_search { position:relative; padding-top: 8px; }

.area_search > p { padding:0 10px; height: 41px; line-height: 41px; margin-bottom: 8px;}
.area_search label { float:left; width:60px; text-align:right; margin-right: 10px; font-size: 0.9em; }
.area_search input,
.area_search select {float:left; border: 1px solid #d7d7d7; height: 40px; line-height: 40px;  padding-left: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.area_search .date input { width:100px; }

.area_search .select select {width:185px; margin-right: 5px; }

.area_search .name input {width:182px; margin-right: 7px;}
.area_search .name a {float:left; color:#656565; width:40px; height: 40px;}

.area_search .term_date input { width:96px; }
.area_search .term_date span {float:left; color:#656565}

.area_search .term_select select {width:86px; margin-right: 5px;}


@media all and (min-width:1024px) {
	.area_search label { width:80px; line-height: 60px; }

	.area_search > p {  float:left; height: 60px; line-height: 60px;  padding: 0px; -webkit-box-sizing: border-box; 	-moz-box-sizing: border-box; 	box-sizing: border-box;}
	.area_search input,
	.area_search select {height: 60px; line-height: 60px; }

	.area_search .date input {  width:185px}

	.area_search .select select {float:left; width:207px;}

	.area_search .name input {  width:284px}
	.area_search .name a {width:60px; height: 60px;}


	.area_search .term_date input { width:130px; }
	.area_search .term_select select {width:100px;  }
}



/**
 * 검색영역
 * area_write
**/

.area_write { position:relative; padding-top: 8px;}

.area_write:after {display:block;visibility:hidden;clear:both;height:0;content:'.'}

.area_write > p { padding:0 10px; height: 41px; line-height: 41px; margin-bottom: 8px; }
.area_write label { float:left; width:100px; text-align:left; margin-right: 5px; font-size: 0.9em; }
.area_write label.hidden { text-align:left; text-indent:-5000em;}
.area_write input,
.area_write select {float:left; border: 1px solid #d7d7d7; height: 40px; line-height: 40px;  padding-left: 10px;  box-sizing:border-box; -webkit-box-sizing:border-box;}

.area_write .date input { width:100px; }

.area_write .select select {width:180px;}

.area_write .name input {width:180px;}
.area_write .name a {float:left; color:#656565; width:40px; height: 40px;}

.area_write .text input {width:180px;	margin-right: 5px; }

.area_write .term_date input { width:87px; }
.area_write .term_date span {float:left; color:#656565}

.area_write .term_select select {width:86px; }

.area_write .term_datepicker input { width:180px; margin-right: 5px; }
.area_write .term_datepicker button { background: url(../../images/btn_calandar.png) no-repeat 0 0; background-size : 35px; -webkit-background-size : 35px; display:inline-block; width:35px; height :35px; border:0 none; text-indent:-5000em; cursor:pointer;}

.area_write .term_example {height:20px; }
.area_write .term_example label {height:20px;}
.area_write .term_example span {height:20px; display:inline-block; line-height:16px;}

.area_write .term_textarea textarea { width:175px; border :1px solid #d7d7d7}
/* .area_write block */
.area_write_block > p { float: none !important; width: 100% !important;
	margin-left: 10px;}

@media all and (min-width:1024px) {
	.area_write label { width:170px; line-height: 60px; }
	.area_write > p {  float:left; height: 60px; line-height: 60px;  padding: 0; width:33%; box-sizing:border-box; -webkit-box-sizing:border-box;}
	.area_write input, .area_write select {height: 60px; line-height: 60px; }

	.area_write .date input {  width:auto}
	.area_write .select select { width:234px;}

	.area_write .name input {  width:auto}
	.area_write .name a {width:60px; height: 60px;}

	/*.area_write .text input {width:auto;}*/

	.area_write .term_date input { width:111px; }
	.area_write .term_select select {width:100px;  }

	.area_write .term_datepicker input { width:174px  }
	.area_write .term_datepicker button  {background-size : 56px; -webkit-background-size : 56px; width:56px; height :56px;}

	.area_write .term_example {height:60px; }
	.area_write .term_example label {height:60px;}
	.area_write .term_example span {height:60px; display:inline-block; line-height:60px;}

	.area_write .term_textarea textarea { width:auto; border :1px solid #d7d7d7;   box-sizing: border-box;}
}


/* area_btn */
.area_btn { position:relative;height:3em;; }
.area_btn .left {position:absolute; top:0; left:0; }
.area_btn .left a {display:inline-block; margin-right: 10px; padding:0 1em; }
.area_btn .center { text-align:center; }
.area_btn .center a {display:inline-block; margin: 0 5px; padding:0 1em; }
.area_btn .right {position:absolute; top:0; right:0; }
.area_btn .right a {display:inline-block; margin-left: 10px; padding:0 1em; }


/* 타블렛용 버튼 */
@media all and (min-width:768px) {
}

/* //////////////////////////////////////////// */
/* //////////////   sprite class  ////////////// */
/* 사이트에서 사용되는 sprite 클래스 */
/* //////////////////////////////////////////// */

.sp {text-indent: -5000px; display:inline-block; }
.sp a {display:block; }

/* 공통영역 sprite */
.sp_common {background:url(../../images/sprite_common.png) no-repeat 0 0; -webkit-background-size: 200px; background-size: 200px; }
.sp_menu { background-position: 0 0;  width:22px; height: 18px;}
.sp_title { background-position: 0 -40px ;  height:11px;}
.sp_logo { background-position: -40px 0 ; width:40px; height:23px;}
.sp_note { background-position: -100px 0 ; width:20px; height:23px; margin-right:10px;}
.sp_main { background-position: 0 -60px ; width:13px; height:13px; margin-right:10px;}
.sp_search { background-position: -20px -60px ; width:13px; height:13px; margin-right:10px;}
.sp_noti { background-position: -40px -60px ; width:13px; height:13px; margin-right:10px;}
.sp_lock { background-position: -60px -60px ; width:13px; height:13px; margin-right:10px;}
.sp_btn_search { background-position: 0 -80px ; width:40px; height:40px;}
@media all and (min-width:1024px) {
	.sp_btn_search {-webkit-background-size: 300px; background-size: 300px; background-position: 0 -120px ; width:60px; height:60px;}
}

.sp_home {background:url(../../images/sprite_home.png) no-repeat 0 0; -webkit-background-size: 100px; background-size: 100px;width: 20px;height: 20px;}
.sp_box { background-position: 0 3px; }
.sp_boxing { background-position: -60px 3px ; }
.sp_notice { background-position: -80px 3px ;}
.sp_news { background-position: -120px 3px ;}
.sp_talk { background-position: -40px 3px ; }
.sp_write { background-position: 0 -40px ; }
.sp_pro { background-position: 0 -57px;}

.on .sp_box { background-position: 0 -80px; }
.on .sp_boxing { background-position: -40px -80px ; }
.on .sp_notice { background-position: -80px -80px ;}
.on .sp_news { background-position: -120px -80px ;}
.on .sp_talk { background-position: -160px -80px ; }
.on .sp_write { background-position: 0 -120px ; }
.on .sp_pro { background-position: 0 -120px ; }


.page_title .sp_home {-webkit-background-size: 200px; background-size: 200px; width:36px; height:31px;}
.page_title  .sp_box { background-position: 0 -160px; }
.page_title  .sp_boxing { background-position: -40px -160px ; }
.page_title  .sp_notice { background-position: -80px -160px ;}
.page_title  .sp_news { background-position: -120px -160px ;}
.page_title  .sp_talk { background-position: -160px -160px ; }
.page_title  .sp_write { background-position: 0 -200px ; }


@media all and (min-width:1024px) {

	.sp_home {width:20px; height:20px;}
	.sp_box { background-position: 0 0; }
	.sp_boxing { background-position: -60px 3px ; }
	.sp_notice { background-position: -80px 3px ;}
	.sp_news { background-position: -120px 3px ;}
	.sp_talk { background-position: -40px 3px ; }
	.sp_write { background-position: 0 -120px ; }
	.sp_pro { background-position: 0px -57px;}  /*판촉물 아이콘추가 20170607*/

	.on .sp_box { background-position: 0 -478px; }
	.on .sp_boxing { background-position: -119px -478px ; }
	.on .sp_notice { background-position: -239px -478px ;}
	.on .sp_news { background-position: -360px -478px ;}
	.on .sp_talk { background-position: -479px -478px ; }
	.on .sp_write { background-position: 0 -599px ; }
	.on .sp_pro { background-position: -0px -599px;} /*판촉물 아이콘추가 20170607*/


}


/* ////////////////////////////////////////////////////////////////// */
/* /////////////////////////   local class  ///////////////////////// */
/* ////////////////////특정 페이지에서만 사용된 코드 //////////////// */
/* ////////////////////////////////////////////////////////////////// */

/**
 * 인트로 
 * #intro
**/

#login { height:100%; position:relative; background: #dfeaec; padding:73px 12px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#login .logo { position:absolute; top:26px; left:13px;}
#login .login_box { border-top: 3px solid #035568; position:relative; z-index:100; height: 390px; margin-bottom: 32px;}
#login .login_box_bg {width: 100%; height: 515px; background: #FFF; z-index:10; position:relative; padding:0 15px; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; }
#login .login_box_shadow {content:""; display:block; width:100%; height: 515px; background: #dce4e8; position:absolute; z-index:0; top:12px; left:4px}

#login .login_box .copy {position:relative; text-align:center; padding-top: 52px; margin-bottom: 40px;}
#login .login_box .userid {border: 1px solid #c3c3c3;   height: 40px; margin-bottom: 9px; }
#login .login_box .userid input {height: 40px; line-height: 40px; padding:0 10px; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  }
#login .login_box .userpw {border: 1px solid #c3c3c3;  height: 40px; margin-bottom: 9px; }
#login .login_box .userpw input {height: 40px; line-height: 40px; padding:0 10px; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  }
#login .login_box .btn_login {margin-bottom: 30px;   }
#login .login_box .btn_login a { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height:40px; display:block; text-align:center; line-height:40px; color:#fff; font-size: 1.1em; }
#login .login_box .usersave { text-align:center;  }
#login .login_box .usersave input { margin-right: 3px;}
#login .login_box .usersave label { color:#035568; font-size: 13px;}

#login .btn_link {margin: 60px;  }
#login .btn_link a {width:49%; }
#login .btn_link a:first-child {margin-right: 2%;}

@media all and (min-width:1024px) {
	#login { padding:107px 32px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	#login .logo { position:absolute; top:42px; left:32px; width:195px;}
	#login .logo img { width:195px;}
	#login .btn_link {position:absolute; top:30px; right: 0px; width:270px; margin:0;}

	#login .login_box { height: 600px;}
	#login .login_box_bg {height: 587px;}
	#login .login_box_shadow {height: 587px; top:20px; left:11px;}
	#login .login_box .copy { position:absolute; top:213px; left:90px; width:250px; padding-top: 0; margin-bottom: 0; }
	#login .login_box .copy img{ width: 100%;}
	#login .login_box .form {position:absolute; top:173px; left:440px; width:450px;}


	#login .login_box .userid { height: 65px; margin-bottom: 15px; }
	#login .login_box .userid input {height: 65px; line-height: 65px;}
	#login .login_box .userpw {height: 65px; margin-bottom: 15px;}
	#login .login_box .userpw input { height: 65px; line-height: 65px; }
	#login .login_box .btn_login a { height: 65px; line-height: 65px; font-size: 24px;}
	#login .login_box .usersave input { transform : scale(2)}
	#login .login_box .usersave label { font-size: 22px;}
	#login .home_btn_area {position: absolute;top: 75px;right: 33px;}

}


#wrap {position:relative; min-height:300px;}
#header {position:relative;}
#header .menu { height: 42px; position:relative; }
#header .menu .aside { position:absolute; top:13px; left:15px; z-index:100;}
#header .menu .title { margin:0 auto ; position:relative; top:13px; text-align:center; width:163px;}
#header .menu .title img {width:100%; height:auto;}

#header .menu .logo {position: absolute; top:10px; right:12px;}

#header .info { position: relative;}
#header .info .user { height: 23px; background: #035568; padding:3px 15px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#header .info .user .part {float:left; color:#FFF;}
#header .info .user .name {float:right; color:#FFF;}

#header .info .log { height: 23px; background: #e4e4e4; padding:3px 15px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#header .info .log .vacation {float:left; color:#444;}
#header .info .log .connect {float:right; color:#444;}



#aside { position:absolute; top:0; left:0;width:100%;  z-index:500; display:none;  }
#aside .bg_dim {width:80%;  background: rgba(255,255,255,1); padding:28px 33px; -webkit-box-sizing: border-box ;-moz-box-sizing: border-box; box-sizing: border-box;}
#aside .black_dim {width:20%; position:absolute; top:0; right:0; height:100%;background: rgba(0,0,0,0.6); }
#aside .tit {margin-bottom: 15px; }
#aside .tit span {display:inline-block;}
#aside .tit em {padding-top: 2px; font-weight: bold; font-size: 14px; line-height: 16px;}
#aside li {margin-bottom: 15px; }
#aside li a {color:#747474; font-size: 13px }



#footer {height: 26px; background: #3c3c3c; text-align:center; color:#FFF; font-size: 10px; line-height: 26px; opacity:1 !important}


@media all and (min-width:1024px) {
	#header .menu { height: 60px;  }
	#header .menu .aside {top:17px; left:27px}
	#header .menu .title {width:244px; }
	#header .info .user { height: 40px; padding:3px 15px 0;}
	#header .info .log { height: 40px;}
	#aside { position:absolute; top:0; left:0; width:100%;  z-index:500; display:none;  }
	#aside .bg_dim {width:50%;  background: rgba(255,255,255,1); padding:70px 60px; -webkit-box-sizing: border-box ;-moz-box-sizing: border-box; box-sizing: border-box; min-height:768px}
	#aside .black_dim {width:50%; position:absolute; top:0; right:0; height:100%;background: rgba(0,0,0,0.6); }
	#aside .tit {margin-bottom: 26px; }
	#aside .tit em {  font-size: 1.2em; line-height: 1.2em;}
	#aside li {margin-bottom: 27px; }
	#aside li a {font-size: 1.05em;}

	#aside .cols1 { float:left; margin-right: 20px;}
	#aside .cols2 { float:left;}
}


#contents { position:relative; }

.home { position:relative; }
.home>ul>li { height: 80px; border-bottom: 1px solid #e6e6e6; position:relative;}
.home>ul>li>a {height:80px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display:block; padding:23px 15px; line-height: 34px; font-size: 16px; color:#515151; font-weight: bold;}
.home>ul>li>a .sp {display:inline-block; margin-right: 18px; }
.home>ul>li>a .count {position:absolute; top:28px; right:15px; color:#ee0072; font-size: 16px; line-height: 28px; font-weight: bold;}

.home>ul>li.active {height:auto;}
.home>ul>li.active a {color:#ef037f;}

.home>ul>li.on {height:auto;}
.home>ul>li.on a {color:#ef037f;}

/*
.home>ul>li div {display:none;}
.home>ul>li.on div {position:relative;  background: #fbfbfb; padding:28px 17px 10px; display:block; border-top: 1px solid #e6e6e6;}
.home>ul>li.on div li {margin-bottom: 18px;}
.home>ul>li.on div li a {display:block; overflow:hidden;  } 
.home>ul>li.on div li em {font-size: 14px; color:#3c3c3c; float:left; }
.home>ul>li.on div li span {color:#3c3c3c; font-size: 14px;  float:right;}
.home>ul>li.on div li span.count {color:#f1037f; }
*/


@media all and (min-width:1024px) {
	.home { padding:25px 25px 0 25px}
	.home>ul {overflow:hidden;}
	.home>ul>li { height: 260px; width:305px; border : 3px solid #035568; position:relative; float:left; margin-right:29px; margin-bottom: 25px; -webkit-box-sizing: border-box; 	-moz-box-sizing: border-box; 	box-sizing: border-box;}
/* 	.home>ul>li:nth-child(3n) { margin-right: 0;} */

	.home>ul>li>a {height: 254px; width:100%; color:#3c3c3c; padding:25px 27px; font-size: 20px;}
	.home>ul>li>a .sp { position:absolute; top:140px; left:25px;font-size: 20px; }
	.home>ul>li>a .count {font-size: 20px; color:#035568;}

	.home>ul>li.on {height:auto; background: #035568;}
	.home>ul>li.on a {color:#fff;}
	.home>ul>li.on .count {color:#fff;}
	#footer {height: 33px; background: #3c3c3c; text-align:center; color:#FFF; font-size: 10px; line-height: 33px;}

}



/* 서브페이지 타이틀 */
.page_title p {height: 43px; padding:5px 15px 0; line-height: 22px; font-weight: bold; border-bottom: 1px solid #e6e6e6; position:relative; background: #035568; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; color:#FFF; display: block;}
.page_title p >a { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display:block;   line-height: 34px; font-size: 16px; color:#fff; font-weight: bold;}
.page_title p >a .sp {display:inline-block; margin-right: 18px; }
.page_title p >a .count {position:absolute; top:7px; right:15px; color:#fff; font-size: 16px; line-height: 28px; font-weight: bold;}

@media all and (min-width:1024px) {
	.page_title p { height: 75px; position:relative; padding:18px 25px;}
	.page_title p >a {height:75px;  line-height: 34px; font-size: 25px; color:#fff;}
	.page_title p >a .sp {display:inline-block; margin-right: 15px; }
	.page_title p >a .count {position:absolute; top:22px; right:25px; color:#fff; font-size: 25px; line-height: 34px;}
}

/*나의 결재함 */
.my_box { position:relative; }
.my_box div {position:relative;  background: #fbfbfb; padding:28px 17px 10px;  border-top: 1px solid #e6e6e6;}
.my_box div li {margin-bottom: 18px;}
.my_box div li a {display:block; overflow:hidden;  }
.my_box div li em {font-size: 14px; color:#3c3c3c; float:left; }
.my_box div li span {color:#3c3c3c; font-size: 14px;  float:right;}
.my_box div li span.count {color:#f1037f; }
.my_box div li span.name {font-size: 14px;}



@media all and (min-width:1024px) {
	.my_box div { background: #fff; padding:22px 25px 0;}
	.my_box div li {margin-bottom: 30px;}
	.my_box div li a {display:block; overflow:hidden;  }
	.my_box div li em {font-size: 21px; color:#3c3c3c;  line-height: 23px; }
	.my_box div li span { font-size: 24px; }
	.my_box div li span.name {font-size: 21px;}
}


/*나의 결재함 */
.notice { position:relative; }
.notice div {position:relative;  background: #fbfbfb; }
.notice div ul {border-top: 1px solid #a0a0a0;}
.notice div li {  padding:10px 15px; border-bottom: 1px solid #a0a0a0;}
.notice div li a {display:block; overflow:hidden;  }
.notice div li em {color:#3c3c3c; float:left; width: 60%;white-space:nowrap; text-overflow:ellipsis; overflow:hidden;  }
.notice div li span {color:#3c3c3c; float:left; font-size: 0.9em;}
.notice div li span.date {width: 25%; text-align:center; }
.notice div li span.name {width: 15%; text-align:center;}




@media all and (min-width:1024px) {
	.notice div { background: #fff;  }
	.notice div li {padding:20px 25px;}

}

.more_bottom { padding:10px; text-align:center;}

@media all and (min-width:1024px) {
	.more_bottom { padding:20px}
	.more_bottom img {width:80px;}
}

#deptPop .table tbody tr:hover {
	background: #035568;	
	color: #fff;
}

#deptPop input {
    border: 1px solid #ddd;
    height: 1.7em;
    padding: 5px;
}

#deptPop .area_btn .btn {
    vertical-align: bottom;
}

#timePop select {
	width:100px;
    border: 1px solid #d7d7d7;
    height: 40px;
    line-height: 40px;
    padding-left: 10px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
#timePop .area_list{
    text-align: center;
    margin-bottom: 60px;
}

.ericchi {
	background: url( "../../images/ericchi_logo.png" ) 45% no-repeat;
   	border: none;
background-size: 64px 19px;
    cursor: pointer;
	
}

.helpy {
   		background: url( "../../images/helpy_logo.png" ) 45% no-repeat;
     border: none;
	background-size: 61px 42px;
     cursor: pointer;
}

.home_btn_area{
    position: absolute;
    top: 47px;
    right: 13px;
	
}
.home_btn {
    font-size: 11px;
    width: 119px;
    background: #035568;
    height: 26px;
    line-height: 26px;
    border-radius: 14px 14px 0px 0;
}

/*** 대시보드 Begin****/
.board-view {
	float: left;
    background: #fff;
    margin: 10px;
    width: 359px;
    border-bottom: 2px solid #035568;
    overflow: hidden;
}
.board-tit {
    border-bottom: 1px solid #ddd;
    background: #fff;
/*     padding: 10px; */
    font-size: 16px;
    font-weight: bold;
}
.board-tit span {
	padding: 10px;
}
.board-item {
    font-size: 12px;
    font-weight: 100;
    border-bottom: 1px solid #ddd;
    margin: 0 20px;	
    display: block;
}
.board-item span {
	margin-right: 10px;
}
.board-item span:last-child {
	float: right;
	margin-right: 0px;
}

.mainBoard {
	background: #F4F4F6;
    height: 100%;
	display: flex;
}
.board-section {
	width: 48%;
    display: inline-block;
    float: left;
}
.board-noti {
	padding: 4px 5px;
    font-size: 11px;
    color: #fff;
    background-color: #1d8ad2;
    border-radius: 2px;
}
.board-alert {
	padding: 4px 5px;
    font-size: 11px;
    color: #fff;
    background-color: #d51486;
    border-radius: 2px;
}
.board-holder {
    overflow-y: auto;
    width: 373px;
    height:170px;
    display: block;

}
.board-holder .board-item:last-child  {
	border-bottom: 0;
}

/* .board-tit { */
/* 	    background: url(/images/icon-toggle-up.png) no-repeat 98% center; */
/* } */

.ellipsis {
    display: inline-block;
    width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.board-tit .sub-tit {
    display: inline-block;
    /* height: 53px; */
    padding: 10px;
    width: 100%;
}
.board-tit .more {
    display: none;
}

.hp .board-holder {
	height: 326px;
}
.edas .board-holder {
	height: 218px;
}
.pmt .board-holder {
	height: 36px;
}
.cms .board-holder {
	height: 66px;
}
.ksa .board-holder {
	height: 0;
}
.oqs .board-holder {
	height: 143px;
}
.hp .board-item span:first-child,
.edas .board-item span:first-child,
.pmt .board-item span:first-child,
.cms .board-item span:first-child,
.ksa .board-item span:first-child,
.oqs .board-item span:first-child {
    width:70px;
	display: inline-block;
}

.board-tit {
	cursor: pointer;
}
.board-tit:hover,
.board-tit .board-item:hover {
	background-color: #fcfcfc;
}
.btn-arrow {
	width: 100%;
    /* height: auto; */
    padding: 14px 25px;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: bold;
    line-height: 20px;
    background: url(/images/icon-toggle-down.png) no-repeat right 30px transparent;
    padding: 25px;
}
.board-holder a.not-link{
    background-color: #fbfbfb;
    color: #ccc;
    cursor: not-allowed;
}
.ui-holder.header-search-holder {
	position: relative;
    width: 100%;
    height: 46px;
}
.header-search-holder input[type=text].tbox {
    padding: 20px;
    height: 100%;
    font-size: 16px;
    box-sizing: border-box;
    border-radius: 0;
/*     background: url(/images/icon-search-d.png) no-repeat 40px center; */
    background-size: 24px auto;
    border: 1px solid #ddd;
    width: 100%;
    line-height: 38px;
    background-color: #fff;
}
.header-search-holder .btn-search {
    overflow: hidden;
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 64px;
    height: 100%;
    text-indent: -9999px;
    background: url(/images/icon-search-d.png) no-repeat 20px center;
    background-size: 24px auto;
    border: 0;
    background-color: #048dad;
}


@media all and (max-width:800px) {

	.board-tit .sub-tit{
	    width: 69%;
	}
	.btn-arrow {
	    background: url(/images/icon-toggle-down.png) no-repeat right 25px transparent;
	}
	.board-tit .more {
	    display: inline-block;
	    width: 15%;
    	text-align: right;
	}
	.board-holder {
	    display: none;
	}
	.hp .board-holder,
	.edas .board-holder,
	.pmt .board-holder,
	.cms .board-holder,
	.oqs .board-holder,
	.ksa .board-holder,
	.board-holder {
    	overflow-y: visible;
	    width: 100%;
	    height: 100%;
	    margin: 15px 0px;
	}
	.board-section {
	    width: 100%;
	    display: inline-block;
	    float: left;
	}
	.board-view {
	    float: left;
	    background: #fff;
	    margin: 2px;
	    width: 100%;
	    border-bottom: 1px solid #fff;
	    overflow: hidden;
	}
	.board-tit {
	    border-bottom: 1px solid #ddd;
	    /* height: 48px; */
	    background: #fff;
	    font-size: 12px;
	    font-weight: bold;
	    /* line-height: 48px; */
	    /* border-bottom: 2px solid #035568; */
	}
	.board-tit span {
		padding: 16px;
	}
/* 	.board-tit {
	    background: url(/images/icon-toggle-down.png) no-repeat 98% center;
	} */
	
	.board-item {
	    font-size: 11px;
	    font-weight: 100;
	    padding: 5px 0;
	    /* height: 16px; */
	}
	
	.more {
		display: block;	
	}
 	.user_info_1 {
	    margin-bottom: 42px;
	}
	
	.ui-holder.header-search-holder {
	    position: absolute;
	    right: 0;
	    height: 46px;
	    left: 0px;
	    top: 110px;
	}
}