@charset "utf-8";
@import url("./font.css");
@import url("./frame.css");

/* *********************************** html element */
body {
    margin: 0;
    padding: 0;
    scroll: auto;
    background-color: #E9ECEF;
}

div {
    font-size: 9pt;
    font-weight: normal;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

a {
    color: #333333;
    text-decoration: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

a:hover, a:active, a:focus {
    text-decoration: none;
}

dl, dt, dd, ol, ul, li {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    list-style-type: none;
    list-style: none;
}

table, tr, td {
    border-collapse: collapse;
    border-spacing: 0;
    padding: 0;
}

input[readonly=readonly], textarea[readonly=readonly], select[readonly=readonly]
, span.k-dropdown[readonly=readonly] .k-input {
    color: #777777;
    background: #f0f0f0 !important;
    cursor: default;
}

input[type=text], input[type=password], button {
    font-size: 9pt;
    ime-mode: active;
    height: 22px;
    border-radius: 2px;
    border: 1px solid #ccc;
    padding: 0 5px 0px 5px;
    margin: 0px;
    vertical-align: middle;
    box-sizing: border-box;
}

input[type=radio]+label, input[type=checkbox]+label {
    font-size: 9pt;
    cursor: pointer;
    margin-right:10px;
}
textarea {
    font-size: 9pt;
    vertical-align: middle;
    ime-mode: active;
    border-radius: 2px;
    border: 1px solid #ccc;
    padding: 2px 5px 2px 5px;
    margin: 0px 0px 0px 2px;
    vertical-align: middle;
    box-sizing: border-box;
    overflow: auto;
    ime-mode: active;
}

input[type=file] {
    font-size: 10pt;
    height: 24px;
    color: #666 font-size:12px;
    border: 1px solid #ccc;
    background-color: #F0F6F9;
    margin: 2px 0px 2px 0px;
    padding-left: 0px;
}

hr, button img {
    display: none;
}

img {
    border: 0;
    vertical-align: middle;
}

button {
    font: inherit;
    cursor: pointer;
    border: 1px solid #ccc;
    background: #fff;
}

button:focus {
    border-color: #3897e1;
    outline: none;
}


/* ******************************************* 기본 */
.c {
    text-align: center !important;
}

.l {
    text-align: left !important; padding-left:5px;
}

.r {
    text-align: right !important; padding-right:5px;
}

.plr {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.b {
    font-weight: bold !important;
}

.u {
    text-decoration: underline;
}

.color.red {
    color: red;
}

.color.blue {
    color: blue;
}

.color.green {
    color: green;
}

.color.black {
    color: black;
}

.hide {
    display: none;
}

.show {
    display: block;
}

.required:before {
    content: "*";
    display: inline-block;
    margin-right: 5px;
    color: red;
}

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

.numeric {
    text-align: right !important;
    padding-right: 5px !important;
}

.dot, .curr {
    text-align: right !important;
}

.filebox label {
    display: inline-block;
    color: #999;
    margin: 2px 0px 2px 2px;
    vertical-align: middle;
    padding-left: 5px;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius: 2px;
    width: 380px;
    height: 22px;
}

.filebox input[type=file] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.cursor-p {
    cursor: pointer;
}

/* ******************************** jQuery & jqGrid */
.no-block {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ui-jqgrid .ui-jqgrid-sortable {
    cursor: default;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    color: #2B2B2B;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
    color: #2B2B2B;
}
.ui-widget-header {
    border: 1px solid #aaa;
    background: #DEDEDE url("images/ui-bg_highlight-soft_15_DEDEDE_1x100.png") 50% 50% repeat-x;
}



/* ***************************************** 로딩바 */
#divLodingbar {
    position: absolute; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(192,208,244); /* Fallback color */
    background-color: rgba(192,208,244,0.3); /* Black w/ opacity */
    text-align: center;
}

#divLodingbar div {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
}

#divLodingbar span {
    display: inline-block;
    vertical-align: middle;
    width: 0;
    height: 100%;
}



/* ******************************************* 제목 */
.pop-title {
    margin:0px 0px 10px 0px;
    padding:0px 0px 2px 6px;
    font-size: 18px;
    font-weight: bold;
    color: #3D3D3D;
    border-bottom: 2px solid #596DA9;
}

.pop-title:before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border: 3px solid #1A1E6B;
    border-radius: 6px;
    margin-right: 3px;
}

.main_title {
    padding: 0px 0px 2px 10px;
    font-size: 20px;
    font-weight: bold;
    color: #3D3D3D;
}
.main_title:before{
    content:'';
    display: inline-block;
    width: 6px;
    height: 6px;
    border:4px solid #1A1E6B;
    margin-right: 3px;
}

.page-title {
    width: 100%;
    max-width:1000px;
    padding: 0px 0px 2px 10px;
    margin: 0px 0px 10px 0px;
    font-size: 20px;
    font-weight: bold;
    color: #3D3D3D;
    border-bottom: 2px solid #596DA9;
}
.page-title:before{
    content:'';
    display: inline-block;
    width: 6px;
    height: 6px;
    border:4px solid #1A1E6B;
    margin-right: 10px;
}
.page-title.btn {
    position: relative;
}
.page-title.btn>div {
    position: absolute;
    right: 0px;
    bottom: 3px;
}

.page-stitle {
    flex: 1;
    font-size: 16px;
    font-weight: bold;
    color: #3D3D3D;
    padding: 0px 0px 2px 10px;
    margin:10px 0px 0px 0px;
    width: 100%;
    max-width:1000px;
}
.page-stitle:before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border: 3px dashed #1A1E6B;
    border-radius: 6px;
    margin-right: 5px;
}
.page-stitle.btn {
    margin:13px 0px 0px 0px;
    position: relative;
}
.page-stitle.btn>div {
    position: absolute;
    right: 0px;
    bottom: 3px;
}


/* ******************************************* 버튼 */
button.fa {
    background: linear-gradient( to top, #EDF0F2, #fff );
    border:1px solid #AFB8BC;
    color:#000;
    padding: 2px 10px 2px 10px;
    cursor:pointer;
    height:18pt;
    font-size:9pt;
    vertical-align: middle;
}
button.btn-i{
    margin:0px -1px 0px -1px;
    padding: 0px 5px 0px 5px;
    height:24px;
    vertical-align: middle;
}
button.btn-s{
    margin:0px -1px 0px -1px;
    padding: 0px 4px 0px 4px;
}

button.btn-m{
    margin:0px -1px 0px 2px;
    padding: 1px 5px 1px 5px;
    height:22px;
}

button.btn-b{
    height:28px;
}
button:hover, button.btn-b:hover{
    background: linear-gradient( to bottom, #ebeff3, #fff );
}
button.fa, button.btn-i.fa, button.btn-s.fa, button.btn-m.fa, button.btn-b.fa{
    font-family: inherit;
}
button.fa:before, button.btn-b.fa:before, button.btn-i.fa:before, button.btn-s.fa:before, button.btn-m.fa:before {
    color: #2375d1;
    font-family: FontAwesome;
}
button>span {
    margin-left: 5px;
}
button:disabled {
    background: #f0f0f0 !important;
    cursor: default !important;
}

/* *********************************** 검색조건 영역 */
.pop-sch-group {
    width: 100%;
    border: 0px;
    margin: 2px 0px 2px 0px;
    table-layout: fixed;
}

.pop-sch-group th {
    height: 27px;
    border: 0px;
    font-weight: bold;
    text-align: right;
    vertical-align: middle;
    padding: 2px 10px 2px 10px;
}

.pop-sch-group td {
    height: 27px;
    border: 0px;
    vertical-align: middle;
    padding: 2px 4px 2px 0px;
}

.sch-group {
    background: linear-gradient( to top, #D1DCE5, #fff );
    border: 1px solid #778DA0;
    color: #000;
    width: 100%;
    max-width:1000px;
    padding: 0px 10px;
    margin-bottom: 2px;
    font-size:9pt;
}

table.tbl-sch {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-top: 2px;
    margin-bottom: 2px;
}

table.tbl-sch tr {
    border: 0px;
}

table.tbl-sch th {
    height: 27px;
    border: 0px;
    font-weight: bold;
    text-align: right;
    vertical-align: middle;
    padding: 2px 10px 2px 10px;
}

table.tbl-sch td {
    height: 27px;
    border: 0px;
    vertical-align: middle;
    padding: 2px 4px 2px 0px;
}


/* ************************************** 버튼 영역 */

.btn-grp {
    text-align: right;
    margin: 2px 0px 5px 0px;
    width: 100%;
    max-width:1000px;
}

.btn-grp table {
    width: 100%;
}
.btn-grp tr td:first-child {
    text-align: left;
}
.btn-grp .l {
    padding-left:0px
}
.btn-grp .r {
    padding-right:0px
}

.btn-grp button:first-child {
    margin-left: 0px;
}

#btnGridUp {margin-right:-3px; height:24px}
#btnGridDown {height:24px}

/* ************************************ 컨텐츠 영역 */
.top1 {
    border-collapse: separate;
    border-spacing: 1px;
    border-top:2px solid #596DA9;
    background-color:#D8DCDF;
    width: 1000px;
    margin-bottom: 10px;
    table-layout: fixed;
}

.top1 th {
    background-color: #eeeeee;
    text-align: center;
    height: 26px;
    color: #333333;
    font-size: 9pt;
    font-weight: bold;
}

.top1 td {
    background-color: #ffffff;
    padding: 0px 4px;
    text-align: left;
    font-size: 9pt;
    height: 26px;
    font-size:9pt;
}

.top1.view td, .top1 td.view  {
    padding: 0px 7px;
}

.top2 {
    border-collapse: separate;
    border-spacing: 1px;
    border-top:2px solid #596DA9;
    background-color:#D8DCDF;
    width: 1000px;
    margin-bottom: 10px;
    table-layout: fixed;
}

.top2 th {
    background-color: #eeeeee;
    text-align: right;
    height: 30px;
    padding-right: 10px;
    color: #333333;
    font-size: 9pt;
    font-weight: bold;
}

.top2 td {
    font-size:9pt;
    background-color: #ffffff;
    padding: 4px;
    text-align: left;
}

.top2.view td, .top2 td.view {
    padding: 7px;
    text-align: justify;
    font-size: 9pt;
}

.top3 {
    border-collapse: separate;
    border-spacing: 1px;
    border-top:2px solid #596DA9;
    background-color:#D8DCDF;
    width: 100%;
    margin-bottom: 10px;
}

.top3 th {
    background: linear-gradient( to top, #EEEEEE, #FCFCFC );
    text-align:center;
    height:28px;
    color:#2b2b2b;
    font-size:9pt;
    font-weight:bold;
}

.top3 td {
    background-color:#ffffff;
    height:28px;
    font-size:9pt;
}

.gth {
    background: linear-gradient( to top, #EEEEEE, #FCFCFC );
    text-align:center;
    color:#000000;
    font-size:9pt;
    font-weight:bold;
}

.annotation-waring {
    margin:8px 0px 8px 0px;
    padding:10px 30px 10px 30px;
    line-height:18px;
    border:1px solid #f4c0c0;
    border-radius:3px;
    background-color:#fffafa;
    color:#2e2e2e;
    text-align: justify;
}

.annotation-info {
    margin:8px 0px 8px 0px;
    padding:10px 30px 10px 30px;
    line-height:18px;
    border:1px solid #b0c6db;
    border-radius:3px;
    background-color:#f3f6ff;
    color:#2e2e2e;
    text-align: justify;
}

.annotation-note {
    margin:8px 0px 8px 0px;
    padding:10px 30px 10px 30px;
    line-height:18px;
    border:1px solid #cccccc;
    border-radius:3px;
    background-color:#f9f9f9;
    color:#2e2e2e;
    text-align: justify;
}









/***** 다이얼로그 *****/
.ui-dialog {
    background-color: snow;
}



@
-webkit-keyframes spin {to { -webkit-transform:rotate(360deg);
    transform: rotate(360deg);
}

}
@
keyframes spin {to { -webkit-transform:rotate(360deg);
    transform: rotate(360deg);
}

}
.msg-alert::before {
    top: 50%;
    left: -1px;
    color: #FFBBBB;
    font-size: 5pt;
    border-width: 0px 0px 1px 1px;
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
    position: absolute;
    content: "";
    width: 0.66em;
    height: 0.66em;
    background-color: inherit;
    border-style: solid;
}

.msg-alert {
    background: none #FFFFFF !important;
    position: relative;
    background: none #FFFFFF;
    border: 1px solid #FFBBBB;
    color: red;
    font-size: 8pt;
    height: 18px;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: inline-block;
    padding: 0px 5px 1px 5px;
    margin: 0px 0px 0px 5px;
    border-radius: 2px;
    -webkit-transform: rotate(45deg);
    box-sizing: inherit;
    vertical-align: middle;
}




/***/
.k-icon:not(.k-i-sort-asc-sm):not(.k-i-sort-desc-sm):not(.k-i-collapse):not(.k-i-expand), .k-tool-icon {
    position: unset !important;
}
.k-input, .k-textbox>.k-input  {
    border-width: 0px !important;
}
.k-grid td {
    white-space: nowrap;
}
.k-widget.k-textbox .k-input, .k-widget.k-datepicker .k-input, .k-widget.k-numerictextbox .k-input {
    padding: 0px 3px;
    text-indent: 0;
}
.k-widget.k-numerictextbox .k-input {
    text-align: right;
}
.k-icon:before:not(.k-i-close) {
    position: sticky !important;
}
.k-picker-wrap>.k-icon:before {
    position: static;
}
/* 에디터 스타일 조정 */
.top2 td.k-editor-toolbar-wrap {
    padding:0px;
}

.top2 td .k-editor {
    border-radius: 0px;
}