@charset "UTF-8";

html, body {
	width: 100%;
	height: 100%;
}

body {
	font-family: 'KoPub Dotum';
	font-size: 12px !important;
	font-weight: 400;
	margin: 0;
	padding: 0;
}
.wrap-loading{
    z-index: 9999;
    position: fixed;
    padding: auto;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.1);
    bottom: 0;
}
.loader {
    position: absolute;
    top: 50%;
    left: 55%;
    margin-top: -50px;
    margin-left: -50px;
    border: 10px solid #f3f3f3;
    border-radius: 50%;
    border-top: 10px solid #3498db;
    width: 50px;
    height: 50px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
div.main-wrapper {
	min-width: 960px !important;
	margin: 0 auto !important;
	padding: 20px;
	box-sizing: border-box;
}

input[type="date"]::-webkit-clear-button {
 -webkit-appearance: none;
  display: none;
}

.input-group .input-group-no-style{
	border: none !important;
	background-color: transparent !important;
} 

div#header table, div.main-wrapper {
	min-width: 960px !important;
	margin: 0 auto !important;
}
div.main-wrapper #wrapper{
	height: 640px;
}
.width100 {
	width: 100%;
}

.text-center{
	text-align: center !important;
}

.pd0{
	padding: 0px !important;
}

.pd5{
	padding: 5px !important;
}

.pdr0{
	padding-right: 0px !important;
}

.pdl0{
	padding-left: 0px !important;
}
.mg0{
	margin: 0px !important;
}
.mgb5{
	margin-bottom: 5px !important;
}
.mgb10{
	margin-bottom: 10px !important;
}
.mgt5{
	margin-top: 5px !important;
}

.mgt10{
	margin-top: 10px !important;
}

/*----------------------------------------------------------------------------*/
/*  header */
/*----------------------------------------------------------------------------*/
div.top {
	text-align: center;
	margin: 15px auto;
}

.navbar-header-container{
	background-color: #f8f8f8;
}
.navbar-header-container .navbar{
	margin-bottom: 0px;
	border: none !important;
}

.nav > li > a{
	color: #767676;
}

.navbar{
	margin-bottom: 0px;
}
.title-bar{
	padding: 10px 15px;
}

.category {
	float: right;
	color: #999;
}

.title {
	color: #767676;
	font-size: 18px;
	font-weight: 700
}

/*로그인페이지*/
#loginForm {
	width: 100%;
	height: 100%;
	background-image: url('./../image/admin/admin-background-img.png');
}

#loginForm .form-container {
	width: 90%;
    height: 280px;
    text-align: center;
    background-color: #fff;
    box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
    padding: 2em 0.75em 1.5em 0.75em;
    border-radius: 5px;
    vertical-align: middle;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /* margin: auto; */
	margin-top: 80px;
    margin-left: auto;
    margin-right: auto;
	border: 2px solid #5f8237;
	border-radius: 20px;
}

#loginForm .form-container2 {
	width: 90%;
    height: 140px;
    text-align: center;
    background-color: #38bbaa;
    box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
    padding: 1.5em 0.75em 1.5em 0.75em;
    border-radius: 5px;
    vertical-align: middle;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /* margin: auto; */
	margin-top: 370px;
    margin-left: auto;
    margin-right: auto;
	border: 2px solid #5f8237;
	border-radius: 20px;
	font-weight: bold;
}

#loginForm .line-container {
	padding: 1em;
	position: relative;
}

#loginForm .line-container .material-icons {
	position: absolute;
	margin-top: 5px;
	left: 0.8em;
	font-size: 30px;
	color: #444;
}

#loginForm .line-container input[type=text],
#loginForm .line-container input[type=password] {
	height: 30px;
	width: 77%;
	padding-left: 3px;
	border: none;
	border-bottom: 1px solid #9e9e9e;
	border-radius: 0;
	outline: none;
	font-size: 1.2em;
	color: #222;
	margin: 0 0 0 1.8em;
	box-shadow: none;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}
#loginForm #login_btn{
	width: 230px !important;
}
#loginForm #login_btn:focus,
#loginForm #login_btn:active{
	border-color: #ccc !important;
}
/* 
#loginForm #login_btn {
	background-color: #ff8f00;
	color: #fff;
	border: 0;
	width: 230px !important;
	height: 40px;
	line-height: 40px;
	font-size: 18px;
	margin: 0 auto !important;
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0
		rgba(0, 0, 0, 0.12);
	background-image: url('textures/highlight.png');
	background-image: none,
		-webkit-linear-gradient(top, #ff8f00 0, #fe761b 100%);
	background-image: none,
		-moz-linear-gradient(top, #ff8f00 0, #fe761b 100%);
	background-image: none, -o-linear-gradient(top, #ff8f00 0, #fe761b 100%);
	background-image: none,
		linear-gradient(to bottom, #ff8f00 0, #fe761b 100%);
	background-position: 50% 50%;
}

#loginForm #login_btn:hover {
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0
		rgba(0, 0, 0, 0.12), 0 2px 30px 0 rgba(0, 0, 0, 0.12);
	background-image: url('textures/highlight.png');
	background-image: none,
		-webkit-linear-gradient(top, #fe761b 0, #e15613 100%);
	background-image: none,
		-moz-linear-gradient(top, #fe761b 0, #e15613 100%);
	background-image: none, -o-linear-gradient(top, #fe761b 0, #e15613 100%);
	background-image: none,
		linear-gradient(to bottom, #fe761b 0, #e15613 100%);
} */

/* 페이지 레이아웃 */
.main-wrapper .left-content{
	height: 640px;
	overflow: auto; 
	padding: 10px;
}
.main-wrapper .left-content-xs{
	height: 400px;
	overflow: auto; 
	padding: 10px;
} 
.main-wrapper .right-content-xs{
	padding: 10px;
	border-left: 1px solid lightgrey;
	min-height: 400px;
}
.main-wrapper .right-content{
	padding: 10px;
	border-left: 1px solid lightgrey;
	min-height: 640px;
}
.pagination-sm > li > a, .pagination-sm > li > span{
	padding: 5px !important;
}
.panel .panel-body{
	padding: 10px 10px 0px 10px;
}
.panel-default > .panel-heading a{
	color: inherit;
}
.panel .panel-body table{
	margin-top: 5px;
}
.radio-padding-box{
	padding: 0px 10px !important;
}

.content-title{
	padding: 7px 0px 0px 0px !important;
}
.panel .content-box-title{
	border-bottom: 1px solid #ddd; 
	padding: 0px 10px !important;
}
.detail-content-title{
	padding: 3px 0px 0px 0px !important;
}
.btn-detail-content{
	padding: 0px 0px 4px 0px !important;
}
.table-wrapper-lg{
	height: 580px;
	overflow: auto;
}
.table-wrapper-md{
	height: 530px;
	overflow: auto;
}
.table-wrapper-sm{
	height: 500px;
	overflow: auto;
}
.table-wrapper-xs{
	height: 350px;
	overflow: auto;
}
.main-wrapper .right-content .row,
.modal .panel .row{
	margin-bottom: 10px;
} 

.modal-header{
	font-size: 15px;
    background-color: rgba(229, 229, 229, 0.24);
    font-weight: bold;	
}
.modal-header .btn-test{
	position: absolute;
    top: 11px;
}
table{
	margin-bottom: 0px !important;
}
table .table-header{
	background-color: #eee;
	font-weight: 700;
}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{
	word-break: break-word;
}
.max-width-xs{
	width: 80px;
}

.max-width-sm{
	width: 120px;
}

.max-width-md{
	width: 500px;
}

.radio-inline{
	margin-top: 7px !important;
}
input[type="radio"], input[type="checkbox"]{
	margin-top: 0px !important;
}
.modal-dialog,
.modal-dialog,
.modal-dialog{
	width: 700px;
	
}
.modal-body .content-table,
.modal-body .content-table,
.modal-body .content-table{
	border-right: 1px solid lightgrey;
	height: 400px;
    overflow: auto;
}
.nav-pagination{
	background-color: #eee;
}

.nav-pagination ul{
	margin: 5px 0px 0px 0px;
}
#divUserAttr .panel{
	padding: 10px 0px 0px 0px !important;
	margin: 2px 0px;
}
#divUserAttr .use-attr-order .panel{
	background-color: #ffffd9;
	border: solid 2px red;
	margin: 0px !important;
}
#divUserAttr .panel .user-attr-remove{
	border: none;
    background-color: transparent;
    position: absolute;
    right: 15px;
    top: 8px;
}

/* 트리 속성 */
ul.fancytree-container, ul.fancytree-container:focus {
	border: none !important;
	outline: none !important;
}
ul.fancytree-container{
	font-size: 12px !important;
}
ul.fancytree-container li{
	padding: 3px 0 0 !important;
}

#addItemModal .modal-dialog{
	margin-top: 0;
  margin-bottom: 0;
  height: 90vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}
