*, *::after, *::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html {margin:0; padding:0;}
body {margin:0; padding:0;}

h2,dl,dt,dd,h3 {margin:0; padding:0;}
a {text-decoration:none;}
ul,li {list-style:none; margin:0; padding:0;}

.tbs-header { position: relative; width: 100%; height: 50px; }
.tbs-header-logo {
    position: absolute;
    display: inline-block;
    width: 190px;
    height: 50px;
    background: #1c7efb;
    top: 0;
    bottom: 0;
    left: 0;
}
.tbs-header-menu {
    position: absolute;
    display: inline-block;
    width: 300px;
    height: 50px;
    background: #1c4000;
    top: 0;
    bottom: 0;
    right: 0;
}


.reg-wrap { position: relative; width: 100%; padding-left: 190px; }
.reg-wrap .reg-left {
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    width:190px;
    min-height:100vh;
    background:#5380b5;
    transition:all 0.3s;
    border-right:solid 2px #413073;
}
.reg-wrap .reg-left h2 {height:70px; background:#413073; text-align:center;}
.reg-wrap .reg-left h2 img {margin-top:15px;}
.reg-wrap .reg-left dl {}
.reg-wrap .reg-left dl dt {padding:14px 0; text-align:center; background:#495390;}
.reg-wrap .reg-left dl dt span {display:block; padding:14px 0; font-size:12px; color:#fff;}
.reg-wrap .reg-left dl dt .span2 {display:block; padding:7px 0; font-size:12px; color:#fff;}

.reg-wrap .reg-left dl dd {text-align:left; background:#5380b5;}
.reg-wrap .reg-left dl dd + dd {border-top:solid 1px #413073;}
.reg-wrap .reg-left dl dd > a {
    /* display:block; padding-left:45px; line-height:40px; font-size:12px; color:#fff; text-decoration:none; */
    display: block; padding-left: 30px; line-height: 40px; font-size: 15px; color: #fff; text-decoration: none;
    background: url('../images/memu_arr.png') no-repeat left 20px center;
}
.reg-wrap .reg-left dl dd > a.home {font-size:0; background:url('../images/left_home.png') no-repeat center;}
.reg-wrap .reg-left dl dd.active,
.reg-wrap .reg-left dl dd.on,
.reg-wrap .reg-left dl dd:hover {background:#413073;}
.reg-wrap .reg-left dl dd.active > a,
.reg-wrap .reg-left dl dd.on > a {
    background:url('../images/memu_arr_active.png') no-repeat left 17px center;

}
.reg-wrap .reg-left dl dd.on > a.home {background:#413073 url('../images/left_home.png') no-repeat center;}
.reg-wrap .reg-left .handle {position:absolute; width:27px; height:27px; top:60%; right:-2px;}
.reg-wrap .reg-left .handle a {
    display:block; width:27px; height:27px; font-size:0;
    background:url('../images/left_handle.png') no-repeat right center;
}

/* 서브 메뉴 */
.reg-wrap .reg-left dl dd > ul {display:none; background:#495390; opacity:1;}
.reg-wrap .reg-left dl dd.active > ul {display:block;}
.reg-wrap .reg-left dl dd > ul li {border-top:dotted 1px #413073; text-align:left;}
/* .reg-wrap .reg-left dl dd > ul li a {display:block; font-size:11px; color:#aaa; height:39px; line-height:39px; padding-left:40px;} */
.reg-wrap .reg-left dl dd > ul li a {display: block; font-size: 14px; color: #aaa; height: 31px; line-height: 31px; padding-left: 22px;}
.reg-wrap .reg-left dl dd > ul li a.active,
.reg-wrap .reg-left dl dd > ul li a:hover {color:#c7f8fc; font-weight:400;}

/* 메뉴 열기/닫기 */
.reg-wrap.left-toggle {padding-left:20px;}
.reg-wrap.left-toggle .reg-left {left:-135px; border-right:solid 10px #413073;}
.reg-wrap.left-toggle .reg-left .handle {right:-35px;}
.reg-wrap.left-toggle .reg-left .handle a {
    background: transform rotate(180deg);
    -o-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}



/* 팝업 레이어 */
#popup {display:none; background:#fff; border:solid 2px #000;}
#popup .button.b-close {display:inline-block; height:10px;}
#popup .button.b-close span {display:inline-block; cursor:pointer; padding:0 15px 0; position:absolute; right:0;}


/* 테블릿 모드 */
@media all and (max-width:1024px) {
    .reg-wrap .reg-cont {padding:5px 5px 5px 5px !important;}
    .reg-wrap.left-toggle {padding-left:0;}
    .reg-wrap.left-toggle .reg-cont {padding:5px 5px 5px 5px !important;}
}



.clear {zoom:1;}
.clear:after {display:block; clear:both; content:"";}
.fl {float:left;}
.fr {float:right;}

/* input box */
.c-input {
    width: 100%;
    height: 20px;
    line-height: 17px;
    padding: 0 5px;
    border: solid 0px #bababa;
    background: #ffffff /*#f8f8f8*/;
    font-size: 11px;
    font-family: 'Nanum Gothic';
    color: black;
}
.p-input {
    width: 100%;
    height: 20px;
    line-height: 17px;
    padding: 0 5px;
    border: solid 0px #bababa;
    background: #ffffff;
    font-size: 11px;
    font-family: 'Nanum Gothic';
    color: black;
}
.c-input > .number-input {
    text-align: left;
}
.number-input {
    text-align: left;
}

.td9 .c-input {
    border: solid 0px #bababa;
}

/* textarea */
.c-text {width:100%; height:120px; padding:0 10px; border:solid 1px #bababa; background:#f8f8f8;}

/* 버튼 */
/*.btn {*/
/*    display:inline-block; width:auto; height:15px; line-height:15px; border:0; outline-style:none;*/
/*    font-size:10px; color:#fff; text-align:center; min-width:45px;*/
/*}*/
/*.td-button .btn {*/
/*    display:inline-block; width:auto; height:21px; line-height:21px; border:0; outline-style:none;*/
/*    font-size:10px; color:#fff; text-align:center;*/
/*}*/
/*.r-button .btn {*/
/*    display:inline-block; width:auto; height:25px; line-height:25px; border:0; outline-style:none;*/
/*    font-size:10px; color:#fff; text-align:center;*/
/*}*/
/*.r-butto .input {*/
/*    display:inline-block; width:100px; height:25px; line-height:25px; border:1px; outline-style:solid;*/
/*    font-size:10px; color:grey; text-align:center;*/
/*}*/
.btn-w-40 {width: 40px; display: inline-block; cursor: pointer; }
.btn-w-60 {width:60px; display: inline-block; cursor: pointer;}
.btn-w-70 {width:70px; display: inline-block; cursor: pointer;}
.btn-w-80 {width:80px; display: inline-block; cursor: pointer;}
.btn-w-90 {width:90px; display: inline-block; cursor: pointer;}
.btn-w-100 {width:100px; display: inline-block; cursor: pointer;}

.btn-c-413073 {background:#413073;}
.btn-c-495390 {background:#495390;}
.btn-c-5380b5 {background:#5380b5;}
.btn-c-9291c3 {background:#9291c3;}

.chkbx{	width:8px; height:8px; padding:0px;margin:0px;}

button:focus {
    border-color: rgba(229, 103, 23, 0.8);
    box-shadow: 0 1px 1px rgba(229, 103, 23, 0.075) inset, 0 0 8px rgba(229, 103, 23, 0.6);
    outline: 0 none;
}

/* margin-top */
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
.mt40 {margin-top:40px !important;}
.mt45 {margin-top:45px !important;}
.mt50 {margin-top:50px !important;}
.mt55 {margin-top:55px !important;}
.mt60 {margin-top:60px !important;}
.mt65 {margin-top:65px !important;}
.mt70 {margin-top:70px !important;}
.mt75 {margin-top:75px !important;}
.mt80 {margin-top:80px !important;}
.mt90 {margin-top:90px !important;}
.mt100 {margin-top:100px !important;}

.reg-wrap .reg-cont { padding:5px 5px 5px 5px;}

.reg-wrap .reg-cont .cont-top {position:relative;}
.reg-wrap .reg-cont .cont-top:after {display:block; clear:both; content:"";}
.reg-wrap .reg-cont .cont-top span {font-size: 15px; color: #333; font-weight: bold; float: left;}
.reg-wrap .reg-cont .cont-top .r-button {float:left; font-size:0; margin-left:30px;}
.reg-wrap .reg-cont .cont-top .r-button > * {display:inline-block; cursor:pointer;}
.reg-wrap .reg-cont .cont-top .r-button > * + * {margin-left:6px;}

.reg-wrap .reg-cont .api-top {position:relative;margin-bottom: 20px;}
.reg-wrap .reg-cont .api-top:after {display:block; clear:both; content:"";}
.reg-wrap .reg-cont .api-top span {font-size: 20px; color: #333; font-weight: bold; float: left;}
.reg-wrap .reg-cont .api-top .r-button {float:left; font-size:0; margin-left:30px;}
.reg-wrap .reg-cont .api-top .r-button > * {display:inline-block; cursor:pointer;}
.reg-wrap .reg-cont .api-top .r-button > * + * {margin-left:6px;}

/*span{float:left;}*/
.reg-wrap .reg-cont .cont-m {margin-top:5px;}
.reg-wrap .reg-cont .cont-m h3 {font-size:11px; color:#333;}

.reg-wrap .reg-cont .api-m    {margin-top:5px;}
.reg-wrap .reg-cont .api-m h3 {font-size:11px; color:#333;}
.reg-wrap .reg-cont .api-fn-name {margin-top:5px;}
.reg-wrap .reg-cont .api-fn-note {margin-top:5px;}
.reg-wrap .reg-cont .api-fn-sample {margin-top:5px;}

/* content style */
.reg-wrap .reg-content {
    /*height:100vh; */
    padding:5px 5px 5px 5px;
}
.content-main { background: white;}
.container .content-main { padding: 5px 20px 30px 20px;}
.container .content-main .content-top {position:relative;}
.container .content-main .content-top h2 { font-weight: bold; }
.container .content-main .content-top:after {display:block; clear:both; content:"";}
.container .content-main .content-top span {font-size: 15px; color: #333; font-weight: bold; float: left;}
.container .content-main .content-top .r-button {float:left; font-size:0; margin-left:30px;}
.container .content-main .content-top .r-button > * {display:inline-block; cursor:pointer;}
.container .content-main .content-top .r-button > * + * {margin-left:6px;}

.container .content-main .content-m {margin-top:20px;}
.container .content-main .content-m ul { color:#333;margin-left:25px;}
.container .content-main .content-m li { list-style-type: disc; color:#333;margin-top:7px;font-size: 16px; }

/* lay-1 */
.lay-1 .fl {width:100%;}

/* lay-2 */
.lay-2 .fl {width:48%;}
.lay-2 .fr {width:48%;}

/* lay-3 */
.lay-3 {font-size:0; text-align:center;}
.lay-3 > * {display:inline-block; font-size:10px;}
.lay-3 .fl {width:32%;}
.lay-3 .ct {width:32%; margin:0 auto;}
.lay-3 .fr {width:32%;}

/* 레이아웃 유형3 */
.reg3 .lay-1 > *,
.reg3 .lay-2 > *,
.reg3 .lay-3 > * {border:solid 1px #ccc;/* border */ min-height:50px;}
/* 검색테이블 */
.table2 {
    border-collapse: collapse;
    text-align: left;
    line-height: 0;
    border: 1px solid #ccc;
    border-left: 3px solid #369;
    margin-top: 5px;
    font-weight: bold;
    color: black;
}
.table2 h3 {font-size:11px; color:#333;font-family:'Nanum Gothic'}
.table2 th,
.table2 td {padding: 0px 0;}
.table2 th {padding-left:20px; font-size:11px; font-weight:bold; color:black;font-family:'Nanum Gothic'}
.table2 td {font-size:11px; font-weight:bold; color:black;font-family:'Nanum Gothic' }
.table2 td textarea{font-size:11px; font-weight:normal; color:black; font-family:'Nanum Gothic'}
.table2 td.td-text {padding-left:0; padding-right:0;}


.table3 {
    border-collapse: collapse;
    text-align: left;
    line-height: 0;
    border: 1px solid #ccc;
    border-left: 3px solid #369;
    margin-top: 5px;
    /* min-width: 1096px; */
    width: 100%;
}
.table3 h3 {font-size:11px; color:#333;}
.table3 th,
.table3 td {padding: 0px 0;}
.table3 th {font-size:11px; padding-left:20px; font-weight:bold; color:black;}
.table3 td {font-size:11px; font-weight:bold; color:black;}
.table3 td.td-text {padding-left:0; padding-right:0;}
.table3 td.td9 {padding-left:10px; padding-right:10px; text-align:left;}

.table3 tbody tr td .r-button {float: left; font-size: 0;}
.table3 tbody tr td .r-button > * {display: inline-block; cursor: pointer;}
.table3 tbody tr td .r-button > * + * {margin-left: 10px;}

.table5 {
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border: 1px solid #ccc;
    border-left: 3px solid #369;
    margin-top: 5px;
    /* min-width: 1096px; */
    width: 100%;
}
.table5 h3 {font-size:11px; color:#333;}
.table5 th, .table5 td {padding:0px 0;}
.table5 th {font-size:11px; padding-left:5px; font-weight:bold; color:black;}
.table5 td {font-size:11px; font-weight:bold; color:black;}

.table5 td.td-text {padding-left:0; padding-right:0;}

.datecombo {
    background-image: url('/images/calendar.png');
    background-repeat: no-repeat;
    background-size: 15px 15px;
    /* background-position: left left; */
    background-position: left;
    cursor: pointer;
    width: 110px;
    text-align: center;
    z-index: 1000;
}
#sdt, #edt {
    border: solid 0px #bababa;
    width: 110px;
}
/* =========================================================================== */
/*  Tbs Class                                                                  */
/* =========================================================================== */
.tbs-function {
    color : #041942;
    font-weight: bold;
}
.tbs-param {
    color : #293a01;
    font-weight: bold;
}
.tbs-type {
    color : #f31c6e;
}
.tbs-value {
    color : #171618;
}
.tbs-return {
    color : #547506;
    font-weight: bold;
}
.tbs-buttons {
    margin-top: 3px;
    margin-bottom: 7px;
}
