/* mobiletest-div */
.mobiletest-div{display:none;}

/* input box 안에 placeholder 색상 변경 설정 */
	::-webkit-input-placeholder { /* 크롬 4–56 */
	    color: #B6B6B6;
	}
	:-moz-placeholder { /* 파이어폭스 4–18 */
	   color: #B6B6B6;
	   opacity:  1;
	}
	::-moz-placeholder { /* 파이어폭스 19–50 */
	   color: #B6B6B6;
	   opacity:  1;
	}
	:-ms-input-placeholder { /* 인터넷 익스플로러 10+ */
	   color:  #B6B6B6;
	}
	::placeholder { /* 파이어폭스 51+, 크롬 57+ */
	   color: #B6B6B6;
	   opacity:  1;
	}
/* input box 안에 placeholder 색상 변경 설정 */

.readonly_input { background-color:#DBDBDB; }
.bold_title_18 {font-weight:900; font-size:18px; margin-bottom:5px;}
.bold_title_16 {font-weight:900; font-size:16px; margin-bottom:3px;}
.desc_15 {font-size:15px;}
.blank_15 {height:15px;}
.blank_5 {height:5px;}
.fltleft {float:left;}
b{font-weight: bold;}
.btn_img_check {width:20px; margin: 0 5px 0 0;}

.front_paging_active {background-color:#FEE233 !important;}

.creve-green{color:#00b8c6}

/*-------------------------------------------
//
//    CREATE BY RAON LABS CORP.
//    AUTHOR JONGHO JUHN
//    SINCE 06.02.2015
//
-------------------------------------------*/
@CHARSET "UTF-8";
@import url(font.css);
@import url(init.css);

/*-------------------------------------------
//
//  ANIMATION
//
-------------------------------------------*/
/*-------------------------------------------
//
//  LAYOUT
//
-------------------------------------------*/
/* html { font-size: 62.5%; 
-ms-content-zooming: none;
-ms-touch-action: pan-x pan-y;
overflow-y: hidden;
overflow-x: hidden;
} */

html, body { height: 100%; }
.table {
	display: table;
	table-layout: fixed;
	width: 100%;
	height: 100%;
}

.table-row {
	display: table-row;
	width: 100%;
	height: 100%;
}

.table-cell {
	display: table-cell;
	vertical-align: top;
}
/*-------------------------------------------
//
//  HEADER
//
-------------------------------------------*/
/*-------------------------------------------
//
//  NAVIGATION
//
-------------------------------------------*/
/*-------------------------------------------
//
//  SUB-GNB
//
-------------------------------------------*/
/*-------------------------------------------
//
//  SWIPE
//
-------------------------------------------*/
/*-------------------------------------------
//
//  BUTTON
//
-------------------------------------------*/
.btn  {
	display: inline-block;
}

.btn-type1 {
	display: block;
	width: 100%;
	height: 27px;
	background: #7d7a78;
	box-shadow: 0 3px 0 0 #373432;
	color: #FFF;
	border: 1px solid #181716;
	transition: all 0.3s;
	outline: none;
	border-radius: 3px;
}

.btn-type1:hover {
	background: #FFF;
	color: #19487C;
}

.btn-type1:active {
	transform: translateY( 3px );
	box-shadow: 0 0 0 0 #113257;
}

.btn-type2 {
	background: #FFF;
	padding: 5px 10px;
	color: #878682;
	border: 1px solid #878682;
	transition: all 0.3s;
	outline: none;
	border-radius: 3px;
}

.btn-type2:hover {
	background: #646160;
	color: #FFF;
}

.btn-type3 {
	background: #7d7a78;
	height: 27px;
	line-height: 27px;
	color: #FFF;
	border: 1px solid #19487C;
	box-shadow: 0 3px 0 0 #373432;
	transition: all 0.3s;
	outline: none;
	text-align: center;
	padding: 0 30px;
	border-radius: 3px;
}

.btn-type3:hover{
	background: #FFF;
	color: #878682;
}

.btn-type3:active {
	transform: translateY( 3px );
	box-shadow: 0 0 0 0 #113257;
}

.btn-search {
	display: block;
	width: 100%;
	height: 40px !important;
	line-height: 40px;
	background: #373432;
	color: #FFF;
	border: 2px solid #373432;
	transition: all 0.3s;
	font-size: 16px;
	border-radius: 3px;
	text-align: center;
}

.btn-search:hover {
	border: 2px solid #FFF;
	background: #646160;
}

.btn-logout {
	display: block;
	border: 1px solid #516881;
	color: #949290;
	background-color: #f5f5f2;
	background-image: url("../img/ico/ico_logout.png");
	background-repeat: no-repeat;
	background-position: left 15px center;
	height: 30px;
	line-height: 27px;
	padding: 0 15px 0 40px;
	border-radius: 3px;
	transition: all 0.2s;
}

.btn-logout:hover {
	background-color: #7d7a78;
	color: #FFF;
	background-image: url("../img/ico/ico_logout_on.png");
}

.btn-bookmark {
	display: block;
	color: #949290;
	height: 30px;
	line-height: 27px;
	font-size: 14px;
}
/*-------------------------------------------
//
//  LINK
//
-------------------------------------------*/
/*-------------------------------------------
//
//  ICON
//
-------------------------------------------*/
.ico {
	display: inline-block;
}

.ico.ico-person {
	width: 28px;
	height: 28px;
	background: url("../img/ico/ico_person.png") no-repeat center center;
}

.ico.ico-password {
	width: 28px;
	height: 28px;
	background: url("../img/ico/ico_password.png") no-repeat center center;
}

.ico.ico-arrow-r-type1 {
	width: 10px;
	height: 16px;
	background: url("../img/ico/ico_arrow_r_type1.png") no-repeat center center;
}
/*-------------------------------------------
//
//  LIST
//
-------------------------------------------*/
#attachList li {
	margin-bottom: 10px;
}

#attachList li:last-child{
	margin-bottom: 0;
}
/*-------------------------------------------
//
//  PANEL
//
-------------------------------------------*/
.panel-layer {
	display: none;
	position: fixed;
	width: 800px;
	height: 600px;
	top: 50px;
	left: 500px;
	background: #FFF;
	box-shadow: 0 0 10px 0 #000;
	
	-webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
    z-index: 100;
    border-radius: 5px;
}

.panel-layer .panel-header {
	background: #7d7a78;
	height: 40px;
	border-bottom: 2px solid #FFF;
	padding: 0 10px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.panel-layer .panel-header strong {
	display: block;
	line-height: 40px;
	color: #FFF;
	
	font-size: 16px;
}

.panel-layer .panel-header .btn-close {
	background: url("../img/btn/btn_close.png") no-repeat center center;
	width: 24px;
	height: 24px;
	margin-top: 7px;
}

.panel-layer .panel-content {
	padding: 10px;
}

.panel-layer .panel-content textarea {
	width: 100%;
	height: 300px;
	resize: none;
	border: 1px solid #A4BDD9;
	padding: 10px;
}
/*-------------------------------------------
//
//  BOX
//
-------------------------------------------*/
.search-box {}

.search-box .search-field {
	display: inline-block;
	border: 2px solid #19487c;
	background: #19487c;
	height: 30px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.search-box .search-field strong {
	display: inline-block;
	width: 90px;
	line-height: 26px;
	color: #FFF;
	vertical-align: top;
	text-align: center;
}

.search-box .search-field input,
.search-box .search-field select {
	display: inline-block;
	vertical-align: top;
	height: 26px;
	border: none;
	width: 125px;
	padding: 0 5px;
}
/*-------------------------------------------
//
//  HR
//
-------------------------------------------*/
/*-------------------------------------------
//
//  FORM-ELEMENTS
//
-------------------------------------------*/
/*--------------------------------------
//
//  BUTTON
//
--------------------------------------*/
/*--------------------------------------
//
//  INPUT
//
--------------------------------------*/
.input-type1 {
	width: 100%;
	height: 30px;
	border: 1px solid #c1c0bf;
	padding: 0 5px;
	border-radius: 3px;
}

.input-type2 {
	width: 100%;
	height: 30px;
	background: #FFF;
	border-radius: 3px;
	border: none;
	padding: 0 5px;
}
/*--------------------------------------
//
//  TEXTAREA
//
--------------------------------------*/
.textarea-type1 {
	border: 1px solid #c1c0bf;
	padding: 5px;
	height: 80px;
	border-radius: 3px;
}
/*--------------------------------------
//
//  SELECT
//
--------------------------------------*/
.select {
	position: relative;
	display: inline-block;
}

.select.select-type1 {
	border: 1px solid #19487c;
	height: 28px;
	line-height: 28px;
	width: 200px;
}

.select.select-type1 select {
	height: 28px;
	border: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 3;
	opacity: 0;
	cursor: pointer;
}

.select.select-type1 .txt {
	display: block;
	width: 100%;
	height: 100%;
	padding: 0 5px;
}

.select.select-type1 .ico-arrow {
	display: block;
	position: absolute;
	top: 0px;
	right: 0px;
	background: url("../img/ico/ico_arrow_b_type2.png") no-repeat center center;
	width: 29px;
	height: 28px;
}
/*--------------------------------------
//
//  CHECKBOX
//
--------------------------------------*/
/*--------------------------------------
//
//  RADIO BUTTON
//
--------------------------------------*/
/*--------------------------------------
//
//  LOADING
//
--------------------------------------*/
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes pulse {
  50% {
    background: white;
  }
}
@keyframes pulse {
  50% {
    background: white;
  }
}

.loader-box{
	position: fixed;
	top: 0;
	left: 0;
	background: rgba( 0, 0, 0, 0.5 );
	width: 100%;
	height: 100%;
	z-index: 999;
}

.loading {
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 50%;
	width: 50px;
	height: 50px;
  	margin-left: -25px;
  	margin-top: -25px;
	border: 0.25rem solid rgba(255, 255, 255, 0.2);
	border-top-color: white;
	-webkit-animation: spin 1.5s infinite linear;
			animation: spin 1.5s infinite linear;
}
.loading-double {
	border-style: double;
	border-width: .5rem;
}
/*--------------------------------------
//
//  TABLE
//
--------------------------------------*/
.tbl.tbl-type1 th {
	background: #7d7a78;
	color: #FFF;
	border-left: 1px solid #FFF;
	line-height: 1.5;
	padding: 7px 0;
	text-align: center;
}

.tbl.tbl-type1.underline th {
	border-bottom: 1px solid #FFF;
}

.tbl.tbl-type1 th:first-child {
	border-left: none;
}

.tbl.tbl-type1 th:last-child {
	border-right: 1px solid #FFF;
}

.tbl.tbl-type1 td {
	border: 1px solid #e9e7e5;
	padding: 7px 5px;
}

.tbl.tbl-type1 tbody tr:hover {
	background: #c9daee;
}

.tbl.tbl-type2 th {
	background: #7d7a78;
	color: #FFF;
	padding: 7px 10px;
	border-bottom: 1px solid #FFF;
	line-height: 1;
}

.tbl.tbl-type2 tr:last-child th {
	border-bottom: 1px solid #7d7a78;
}

.tbl.tbl-type2 td {
	border: 1px solid #e9e7e5;
	padding: 7px 5px;
}


.tbl.tbl-type3 th {
	background: #7d7a78;
	color: #FFF;
	padding: 5px 10px;
	border-left: 1px solid #FFF;
}

.tbl.tbl-type3 th:first-child {
	border-left: none;
}

.tbl.tbl-type3 th:last-child {
	border-right: 1px solid #FFF;
}

.tbl.tbl-type3 td {
	border: 1px solid #a4bdd9;
	padding: 5px 10px;
}
/*--------------------------------------
//
//  LIST
//
--------------------------------------*/
.search-list {
	position: absolute;
    background: #FFF;
    box-shadow: 0 0 5px 0 #000;
    border: 1px solid #999;
}

.search-list a {
	display: block;
    width: 100%;
    padding: 5px;
}

.search-list a:hover,
.search-list a:focus {
	background: #7d7a78;
	color: #FFF;
}
/*--------------------------------------
//
//  PAGINATION
//
--------------------------------------*/
.pagination {
	text-align: center;
}

.pagination a {
	display: inline-block;
	text-align: center;
	width: 29px;
	height: 30px;
	border: 1px solid #a7a3a0;
	border-left: none;
	line-height: 30px;
	vertical-align: top;
	color: #19487c;
	margin-right: -4px;
	font-weight: 300;
}

.pagination a.on {
	background: #a7a3a0;
	color: #FFF;
}

.pagination a:first-child {
	border-left: 1px solid #A4BDD9;
}

.pagination a.prev {
	background: url("../img/ico/ico_pagination_prev.png") no-repeat center center;
}

.pagination a.next {
	background: url("../img/ico/ico_pagination_next.png") no-repeat center center;
}

.pagination a.first {
	background: url("../img/ico/ico_pagination_first.png") no-repeat center center;
}

.pagination a.last {
	background: url("../img/ico/ico_pagination_last.png") no-repeat center center;
}
/*-------------------------------------------
//
//  POPUP
//
-------------------------------------------*/
/*-------------------------------------------
//
//  PAGES
//
-------------------------------------------*/


/*--------------------------------------
//
//  MAIN
//
--------------------------------------*/
.table.login .table-cell {
	height: 100%;
	vertical-align: middle;
}

.table.login .login-box {
	width: 400px;
	margin: -91px auto 0;
}

.table.login .login-box header h1 {
	font-size: 32px;
	text-align: center;
	font-weight: bolder;
	color: #aeaeae;
	background: url("../img/logo/logo.png") no-repeat center center;
	height: 91px;
}

.table.login .login-box article {
	background: #FFF;
	width: 100%;
	height: 260px;
	margin-top: 15px;
	border-radius: 15px;
	box-shadow: 0 0 15px 0 #666;
	padding-top: 50px;
}

.table.login .login-box article header h2 {
	text-align: center;
	font-size: 26px;
	font-weight: bold;
	color: #A1A1A1;
}

.table.login .login-box form {
	width: 270px;
	margin: 20px auto 0;
}

.table.login .login-box form label {
	display: block;
	border: 1px solid #a1a1a1;
	height: 30px;
}

.table.login .login-box form input:not([type='submit']) {
	display: inline-block;
	height: 100%;
	width: 240px;
	padding: 0 10px;
	line-height: 30px;
	border: none;
	background: none;
	border-left: 1px solid #a1a1a1;
}
/*--------------------------------------
//
//  SUB COMMON
//
--------------------------------------*/
.top-header {
	width: 100%;
	min-width: 1200px;
	height: 60px;
	background: #f5f5f2;
	position: absolute;
	top: 0;
	padding: 0 20px;
	z-index: 99;
}

.top-header h1 {
	width: 370px;
	height: 70px;
	line-height: 70px;
	font-size: 32px;
	color: #FFF;
	background: url("../img/logo/logo3.png") no-repeat left center;
	padding-left: 145px;
}

.top-header .btn-logout {
	margin-top: 15px;
}

.table.main {
	padding-top: 60px;
	width: 100%;
	min-width: 1200px;
}
.table.main .gnb {
	position: relative;
	width: 200px;
	height: 100%;
	padding: 40px 0;
	background: #7d7a78;
}

.table.main .gnb .ico-menu {
	position: absolute;
	width: 230px;
	height: 30px;
	top: 0;
	left: 0;
	background: #7d7a78 url("../img/ico/ico_list.png") no-repeat right 6px center;
	z-index: 1;
}

.table.main .gnb li {
	
}

.table.main .gnb li a {
	position: relative;
	display: block;
	padding: 10px 20px 10px 30px;
	color: #FFF;
	overflow: visible;
	zoom: 1;
}

.table.main .gnb li a:after {
	clear: both;
	content: '';
	display: block;
}

.table.main .gnb li a strong {
	display: inline-block;
	height: 16px;
	float: left;
}

.table.main .gnb li a span {
	float: right;
	transition: all 0.1s;
}

.table.main .gnb li a:hover,
.table.main .gnb li a:focus {
	background: #464443;
}

.table.main .gnb li a.active span {
	transform: rotate( 90deg );
}

.table.main .gnb li a.on {
	background: #323130;
}

.table.main .gnb li a.on em {
	position: absolute;
	display: block;
	width: 5px;
	height: 100%;
	top: 0;
	left: -5px;
	background: #FFF;
}

.table.main .gnb li ul li a:before {
	content: "- ";
}

.table.main .gnb li ul li a {
	text-indent: 10px;
	font-size: 12px;
}

.table.main .gnb li ul {
	overflow: hidden;
	height: 0;
	transition: height 0.3s;
}

.table.main .content-wrap {
	padding: 50px 30px 10px;
	position: relative;
	width: 100%;
}

.table.main .content-wrap h2 {
	font-size: 24px;
	color: #888;
	font-weight: 600;
}

.table.main .content-wrap h3 {
	font-size: 20px;
	font-weight: 600;
	color: #787878;
}

.table.main .content-wrap > article {
	background: #FFF;
	/* border: 1px solid #787878; */
	margin-top: 20px;
	padding: 10px;
}

.table.main .content-wrap > article > section {
	
}

.table.main .content-wrap .status-bar {
	position: fixed;
    top: -40px;
    width: 100%;
    height: 30px;
    background: rgba( 160, 227, 0, 0.4 );
    left: 0;
    line-height: 30px;
    z-index: 100;
}

.table.main .search-wrap {
	position: relative;
	
	width: 240px;
	height: 100%;
	background: #646160;
	padding: 40px 25px;
}

.table.main .search-wrap  header.title {
	position: absolute;
	top: 0;
	height: 35px;
	right: 0;
	width: 270px;
	z-index: 2;
}

.table.main .search-wrap  header.title h3 {
	height: 35px;
}

.table.main .search-wrap  header.title h3 a {
	color: #FFF;
	font-size: 16px;
	display: block;
	width: 100%;
	height: 35px;
	line-height: 35px;
	background: #646160 url("../img/ico/ico_search.png") no-repeat 7px center;
	padding: 0 0 0 45px;
}

.table.main .search-wrap strong {
	color: #FFF;
	display: block;
}

.table.main .search-wrap input,
.table.main .search-wrap select {
	display: block;
	margin-top: 5px;
	height: 28px;
	width: 100%;
}
/*--------------------------------------
//
//  FOOTER
//
--------------------------------------*/

/*-------------------------------------------
//
//  MEDIA PRINT
//
-------------------------------------------*/
@page a4sheet { size: 21.0cm 29.7cm } 
.a4 { page: a4sheet; page-break-after: always } 

@media print{
	header.top-header {
		display: none;
	}
	
	.table-cell.gnb {
		display: none;
	}
	
	.table-cell.content-wrap {
		padding: 0;
	}
	
	.table-cell.content-wrap > article table {
		width: 21.0cm !important;
	}
	
	.print100 {
		width: 21.0cm !important;
	}
	
	#btnPrint {
		display: none;
	}
}
/*
.panel-loading {
	opacity: 0.7;
    width: 100%;
    background-color: #5a5a5a;
    position: absolute;
    height: 100%;
    z-index: 999;
}
*/
/* 페이지 로딩 */
.panel-loading {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.80);
  z-index : 3000;
}
.wrap-loading {position:absolute; top:40%; height:92px; text-align:center;}
.panel-loader-circular {
  -webkit-animation: animateloader 1.5s linear infinite;
  -o-animation: animateloader 1.5s linear infinite;
  animation: animateloader 1.5s linear infinite;
  clip: rect(0, 80px, 80px, 40px);
  height: 80px;
  width: 80px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -40px;
  margin-left: -40px;
}
.panel-loader-circular:after {
  -webkit-animation: animateloader2 1.5s ease-in-out infinite;
  -o-animation: animateloader2 1.5s ease-in-out infinite;
  animation: animateloader2 1.5s ease-in-out infinite;
  clip: rect(0, 80px, 80px, 40px);
  content: '';
  border-radius: 50%;
  height: 80px;
  width: 80px;
  position: absolute;
}
@-webkit-keyframes animateloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(220deg);
  }
}
@keyframes animateloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(220deg);
  }
}
@keyframes animateloader2 {
  0% {
    box-shadow: inset #EC2B1D 0 0 0 17px;
    transform: rotate(-140deg);
  }
  50% {
    box-shadow: inset #EC2B1D 0 0 0 2px;
  }
  100% {
    box-shadow: inset #EC2B1D 0 0 0 17px;
    transform: rotate(140deg);
  }
}
@-webkit-keyframes animateloader2 {
  0% {
    box-shadow: inset #EC2B1D 0 0 0 17px;
    transform: rotate(-140deg);
  }
  50% {
    box-shadow: inset #EC2B1D 0 0 0 2px;
  }
  100% {
    box-shadow: inset #EC2B1D 0 0 0 17px;
    transform: rotate(140deg);
  }
}
/* 페이지 로딩 */