@import url(https://fonts.googleapis.com/earlyaccess/jejugothic.css);
@import url(font.css);

body,html{font-size:12px;}
/*html { scrollbar-arrow-color: #C5E4F5;
        scrollbar-Track-Color: #F4F8FB;
        scrollbar-base-color: #F4F8FB;
        scrollbar-Face-Color: #C5E4F5;
        scrollbar-3dLight-Color: #C5E4F5;
        scrollbar-DarkShadow-Color: #C5E4F5;
        scrollbar-Highlight-Color: #C5E4F5;
        scrollbar-Shadow-Color: #C5E4F5}
 Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar {width:12px; height: 12px; border: 3px solid #fff; }
::-webkit-scrollbar-button{display: block; height: 10px; background:#F4F8FB;}
::-webkit-scrollbar-track {background: #F4F8FB; -webkit-border-radius: 3px; border-radius:3px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.2)}
::-webkit-scrollbar-thumb {height: 50px; width:50px; background: #C5E4F5; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.1)}

input[type="radio"]{border:0 none !important;width:13px;height:13px;}
input[type="checkbox"]{width:13px;height:13px;}
input[type=checkbox]:not(old),input[type=radio]:not(old) {
    width:30px;
    height: 20px;
    margin: 0;
    padding: 0;
    opacity: 0;
}
input[type=checkbox]:not(old)+label,input[type=radio]:not(old)+label {
    display: inline-block;
    margin-left: -28px;
    padding-left: 28px;
    background: url('/inno_resources/images/checks.png') no-repeat 0 0;
    line-height: 24px;
}

input[type=checkbox]:not(old):checked+label {
    background-position: 0 -24px;
}

input[type=radio]:not(old):checked+label {
    background-position: 0 -48px;
}

.options {
    display: block;
    padding-left: 10px;
}

.input_margin {
    margin: 5px 0 8px 0;
}

/*반응형메뉴*/
.clearout {

}


#flexiselDemo1 {
    display: none;
}

.nbs-flexisel-container {
    position: relative;
    float: left;
    height: 80px;
    width:79%;

}

.nbs-flexisel-nav-left,.nbs-flexisel-nav-right{display:block;}
.top_loginbtn{margin:15px 0 0 0;}

.hidden-xs,.hidden-xs2{color:#fff;padding:0 10px;font-size:12px;display:inline-block;max-width:150px;line-height:14px;}

@media all and (max-width:1600px) {
     .nbs-flexisel-nav-left,.nbs-flexisel-nav-right{display:block;}
}

@media all and (max-width:1568px) {
    .nbs-flexisel-container {width:78%;}
    .l_padding {padding-left:0;}
}

@media all and (max-width:1510px) {
    .nbs-flexisel-container {width:75%;}
}

@media all and (max-width:1320px) {
    .nbs-flexisel-container {width:75%;}
}

@media all and (max-width:1213px) {
    .nbs-flexisel-container {width:74%;}
}

@media all and (max-width:1156px) {
    .nbs-flexisel-container {width:70%;}
}

@media all and (max-width:1058px) {
    .nbs-flexisel-container {width:68%;}
}

@media all and (max-width:1010px) {
    .nbs-flexisel-container {width:67%;}
}

@media all and (max-width:996px) {
    .nbs-flexisel-container {width:66%;}
}
@media all and (max-width:988px) {
    .nbs-flexisel-container {width:63%;}
    .l_padding {padding-left: 15px;}

}

@media all and (max-width:890px) {
    .nbs-flexisel-container {width:60%;}
}

@media all and (max-width:835px) {
    .nbs-flexisel-container {width:55%;}
}

/*모바일*/

@media all and (max-width:767px) {
    .nbs-flexisel-container {width:92%;}

    .main-header .navbar-custom-menu, .main-header .navbar-right {width:100%;height:30px;padding-top:0;text-align:right;background:#1e282c;line-height:30px;}
    .navbar-custom-menu .navbar-nav>li>a {padding-top:0;padding-bottom:0;line-height:30px;}
    .navbar-custom-menu .navbar-nav>li{float:left;}
    .top_loginbtn{margin:1px 0 0 0;}
    .hidden-xs{color:#fff;padding:0 10px;font-size:12px;display:inline-block;max-width:200px;line-height:14px;}
    .hidden-xs2{color:#fff;padding:0 10px;font-size:12px;display:inline-block;max-width:200px;line-height:14px;}
}

@media all and (max-width:572px) {
    .nbs-flexisel-container {width:88%;}

}

@media all and (max-width:463px) {
    .nbs-flexisel-container {width:85%;}
}

@media all and (max-width:336px) {
    .nbs-flexisel-container {width:80%;}
}

.nbs-flexisel-ul {
    position: relative;
    width:99999px;
    margin: 0px;
    padding: 0;
    list-style-type: none;
    text-align: center;
}

.nbs-flexisel-inner {
    position: relative;
    overflow: hidden;
    float: left;
    width:100%;
    height: 83px;
}

.nbs-flexisel-item {
    float: left;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    position: relative;
    line-height: 0px;
    width:80px;
}

.nbs-flexisel-item img {
    width:22px;
    cursor: pointer;
    position: relative;
}

.als-item {
    margin: 2px 0px 3px 0px;
    height: 78px;
    min-width:10px;
    font-size: 11px;
    text-align: center;
    line-height: 11px;
    color: #fff;
}

.als-item a {
    color: #616161;
}

.als-item a:hover,a:active,a:focus {
    color: #616161;
    font-weight:600;
}

.als-item b {
    line-height: 83px;
    color: #fff;
    font-size: 12px;
}

.als-itemSpace {
    margin: 2px 0px 3px 5px;
    height: 78px;
    max-width:29px;
    min-width:10px;
    font-size: 13px;
    text-align: center;
    line-height: 20px;
    color: #616161;
}

.idx {
    max-width:20px;
}

.line {
    background: url('/inno_resources/images/line.png');
    background-size: 2px 40px;
    background-repeat: no-repeat;
    background-position: 33px;
}

.als-item img {
    position: relative;
    vertical-align: middle;
    width:35px;
    margin: 3px 0 5px 0;
}

/*** Navigation ***/
.nbs-flexisel-nav-left,.nbs-flexisel-nav-right {
    padding: 0 0 0 6px;
    position: absolute;
    cursor: pointer;
    z-index: 4;
    top: 0;
    width:20px;
    height: 83px;
    line-height: 83px;
    background:#222D32;
    color: #fff;
}

.nbs-flexisel-nav-left {
    left: 0;
}

.nbs-flexisel-nav-left:before {
    content: "<"
}

.nbs-flexisel-nav-left.disabled {
    background-color:#222D32 !important;
}

.nbs-flexisel-nav-right {
    right: 0;
}

.nbs-flexisel-nav-right:before {
    content: ">"
}

.nbs-flexisel-nav-right.disabled {
    background-color: #222D32 !important;
}

/* main  */


/* popup 공퉁 */

.box-pd {
    padding: 1px 5px 1px 5px;
}

.box-bt {
    margin-bottom: 5px;
}

.pdl10 {
    padding-left: 10px;
}

.pop-body {
    padding: 5px 10px 5px 10px;
}

.pop-body .pop-linebox {
    height: 230px;
    background: #fff;
    border-radius: 5px;
}

.pop-body .pop-linebox .pop-itembox {
    background-color: white;
    height: 170px;
    overflow: auto;
    border: 1px solid #ddd;
}

.pop-itembox td{padding:3px 5px;}

.pop-body label,.pop-body p {
    font-size: 12px;
    font-family: 나눔고딕, NanumGothic, ng;
    font-weight: bold;
    color: #2c3b41;
}

.pop-btngroup {
    margin-top: 10px;
    float: left;
    width:100%;
}

.pop-btngroup2 {
    margin-top: 10px;
    width:100%;
}


.btn-black {
    font-size: 14px;
    font-family: 나눔고딕, NanumGothic, ng;
    font-weight: bold;
    background-color: #3C4E55;
    color: #fff;
}

.btn.btn-black.focus,.btn.btn-black:focus,.btn.btn-black:hover {
    background-color: #2F3E44;
    color: #fff;
}

.btn-gray {
    font-size: 14px;
    font-family: 나눔고딕, NanumGothic, ng;
    font-weight: bold;
    background-color: #ddd;
    color: #616161;
}

.btn.btn-gray.focus,.btn.btn-gray:focus,.btn.btn-gray:hover {
    background-color: #ddd;
    color: #616161;
}



.divFrame table {
    margin-bottom: 10px;
    padding: 0 15px 0 15px;
}

.divFrame th {
    background: #F4F8FB;
    color: #212121;
}

.dataTable>thead>tr>th,.dataTable>tbody>tr>th,.dataTable>tfoot>tr>th,.dataTable>thead>tr>td,.dataTable>tbody>tr>td,.dataTable>tfoot>tr>td
    {
    border: 1px solid #ddd;
}
.dataTable>thead>tr>th,.dataTable>tbody>tr>th,.dataTable>tbody>tr>td{padding:2px;text-align:center}
.dataTable>thead>tr>th,.dataTable>tbody>tr>th{color:#000;font-weight:bold;background:#f4f4f4}

.table_wrap {
    background: #fff;
    border-radius: 10px;
    padding: 10px 3px;
}

/* popup right box */
#chartFrameDl,#barChartDl0 {
    overflow: hidden;
}
.table_box {
    padding: 5px 0;
    background: #fff;
    border-radius: 5px;
    margin:10px 0;
    height:260px;
    font-size:9pt;
    overflow-y: auto;
    overflow-x:auto;
}
.left_con {
    padding: 5px 0;
    background: #fff;
    border-radius: 5px;
    overflow-y: auto;
    overflow-x: hidden;
    height: 525px;
}

.left_chart {
    width:600px;
    height: 500px;
    margin: 0 auto;
}

.left_side {
    padding: 10px;
}

.topbox_con {
    margin-bottom: -5px;
    background-color: white;
    border-radius: 5px;
    font-size: 10pt;
}
.topbox_con2 {
    background-color: white;
    border-radius: 5px;
    font-size: 10pt;
}

.leaf_con {
    margin-bottom: 0;
    height: 370px;
    overflow: auto;
    background-color: white;
    border-radius: 5px;
}

.rMateH5__Root {
    margin: 0 auto;
}

.side2{display:none;}

.side {
    position: absolute;
    top: 0;
    right: -200px;
    z-index: 999;
    width:200px;
    height: 100%;
    border-left: 1px solid #ddd;
    background: #fff;
}

#histoChartDl0 {
    overflow-x: hidden;
    overflow-y: auto;
}

.side .btn_close {
    position: absolute;
    top: 50%;
    left: -26px;
    margin-top: -46px;
    width:26px;
    height: 92px;
    cursor: pointer;
}

.side #side_right {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 11;
    height: 100%;
    overflow-y: auto;
    padding: 0;
}

.side .box {
    border-top: 0;
    box-shadow: none;
}

.side .box .nav-tabs-custom>.tab-content {
    padding: 0;
}

.side .col-md-12 {
    padding: 0;
}

/* param_set 변수설정 */
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 3px;
    color: black;
    text-align: left;
    vertical-align: middle;
}
.table>tbody>tr>td:hover, .table>tbody>tr>th:hover, .table>tfoot>tr>td:hover, .table>tfoot>tr>th:hover, .table>thead>tr>td:hover, .table>thead>tr>th:hover {
    cursor: pointer;
}
.btn-app{
    min-width:0px;
    height: auto;
    margin: 0 0 10px 0px;
}
.btn-app>.fa, .btn-app>.glyphicon, .btn-app>.ion{
    font-size: 25px;
}

.param_set .set_box {float: left; width:70%;}
.param_set .set_btn {float: right;text-align:right; width:30%;}
.param_set .btn_wrap {
    margin:22px 0 0 15px;
}

.param_set .btn_wrap .btn-app {
    padding: 8px 5px;
}

.param_set .btn_wrap2 {
    display:none;
    margin:22px 0 0 15px;
}

.param_set .btn_wrap2 .btn-app {
    padding: 8px 5px;
}

.param_set .set_box1 {float: left; width:55%;}
.param_set .set_box2 {float: right; width:43%;}

.param_set .table_scroll {
    width:90%;
    height: 200px;
    margin: 0 auto;
    overflow: scroll;
    background-color: #fff;
}

.param_set .table_wrap .align {
/*  padding: 3px 54px; */
    padding: 3px 38px;
}

/* bar_graph 막대그래프1 */
.bar_graph .table table-bordered table-striped table-hover table-chart {
    border-left: none;
    border-right: none;
}

/* cross_table 교차표 */
.cross_table .checkbox_wrap {
    border: 1px solid white;
    text-align: center;
    background: #fff;
    border-radius: 2px;
    height: 30px;
    line-height: 30px;
}

.table-align td{
    text-align: right;
}

.table-textAlign{
    text-align: right;
}

/* 미디어쿼리  */

/* @media all and (max-width:1736px) {
    .nbs-flexisel-inner {
        background: #2C3B41;
        max-width:none;
    }
    .control-sidebar {
        padding-top: 165px;
    }
}

@media all and (max-width:767px) {
    .nbs-flexisel-inner {
        background: #2C3B41;
        max-width:none;
    }
    .main-header .sidebar-toggle {
        padding: 15px;
    }
    .main-header .navbar-custom-menu,.main-header .navbar-right {
        padding-top: 0;
    }
    .sidebar-open .main-sidebar,.sidebar-open .left-side {
        margin-top: 117px;
    }
    .control-sidebar {
        padding-top: 217px;
    }
    .l_padding {
        padding-left: 15px;
    }
} */


#vMin {margin:0 0 0 10px;}
#vMin text {margin:0 0 0 8px;}
#vMax text {margin:0 0 0 8px;}
.main_font{font-weight:200;font-size:11px;}
.main_font:hover{font-weight:800;}
.font{font-family: 'Jeju Gothic', serif;font-weight:200;font-size:15px;}
.load_radio{margin-top:0;padding-left:5px;height:30px;line-height:30px;font-size:13px;}
.load_radio label {font-size: 12px;font-family: 나눔고딕, NanumGothic, ng;font-weight: bold;color: #2c3b41;}

/* 막대그래프 윈도우팝업 */
#window_pop{overflow-x:hidden;height:100%;min-height:0;}
#window_pop .pop-body {height:100%;padding:5px;}
#window_pop .pop-body .topbox_wrap {height:70%;width:98%;position:absolute;background:#fff;border-radius:5px;}
#window_pop .pop-body .topbox_wrap .topbox_con {position: absolute;height: 10%;width:100%;}
#window_pop .pop-body .topbox_wrap .left_con{clear:both;position: absolute;top: 10%;height: 90%;width:100%;}
#window_pop .pop-body .table_box {height:27%;width:98%;position:absolute;top:70%;}

/* 히스토그램 윈도우팝업 */
#window_pop .histo_pop {height:100%;}
#window_pop .histo_pop .topbox {position: absolute;width:98%;height:5%;right:0;float:right;display:inline-block;}
#window_pop .histo_pop .topbox_wrap2{background:#fff;border-radius:5px;position: absolute; width:98%;height: 13%;overflow: auto;}
#window_pop .histo_pop .topbox_wrap {height:59%;width:98%;position:absolute;top:14%;background:#fff;border-radius:5px;}
#window_pop .histo_pop .topbox_wrap .topbox_con {position: absolute;height: 15%;width:100%;}
#window_pop .histo_pop .topbox_wrap .left_con{clear:both;position: absolute;top: 15%;height: 85%;width:100%;}
#window_pop .histo_pop .table_box {height:27%;width:98%;position:absolute;top:71%;}

/* #window_pop .divFrame {min-width:500px;} */
#window_pop .slider {float: left;width:200px;height:60px;margin:0 20px 0 0;}
.select_1{width:225px; margin:0 0 0 15px;display: inline;}
.input_1{width:251px; margin:0 0 0 15px;display: inline;}
.input_2{width:90px; margin:0 0 0 15px;display: inline;}

.change_table1 tr {height:35px;line-height:35px;}
.change_btn{margin:0 0 0 20px;}
.change_input{width:150px; margin: 0 10px; display: inline;}
.change_h{overflow-y:auto; height:350px;}
.change_table2 {display:none;}
.histo_text{line-height:40px;height:40px;width:100%;font-family:나눔고딕, NanumGothic, ng;}
.histo_left{width:50%;max-width:300px;float: left;}
.histo_right{width:50%;float:left;}
.histo_right span {text-align: right;}

.graphwrap .sec1 .row {margin:0;}
.graphwrap .sec1_m {display:none;}
.graphwrap .sec1_m .row {margin:0;}
.graphwrap .sec1 .col_box3 {float:left;display:inline-block;text-align: center; width:28%;min-width:122px;margin:0 1%}
.graphwrap .sec1 .col_box4 {float:left;display:inline-block;text-align: center; width:20%;min-width:87px;margin:0 1%}
.graphwrap .sec1 .arrow_box {float:left;display:inline-block;text-align: center; margin-top: 60px;width:10%;}
.graphwrap .sec2{margin-bottom: 0; float: left; width:50%;}
.graphwrap .sec3{margin-top: 10px; margin-bottom: 0; float: left; width:50%; background:#fff; border-radius:10px;}
.graphwrap .sec1 .line_box4 {margin:0;}

@media screen and (max-width:720px){
    .param_set .set_box {float: left; width:60%;}
    .param_set .set_btn {float: right;text-align:right; width:40%;}
    .param_set .set_box1 {float: left; width:100%;}
    .param_set .table_scroll {height:100px;}
    .param_set .set_box2 {float: right; width:100%;margin:8px 0 0 0;}
    .param_set .set_box2 .table_wrap table {margin:0 auto;}
    .change_label{font-size:11px!important;}
    .change_btn{margin:0;}
    }

@media screen and (max-width:655px){
    .histo_input {width:120px;}
    }

@media screen and (max-width:613px){
    .bar_graph {padding:10px 0;}
    .change_input{width:100px; margin: 0 5px; display: inline;}
    }
@media screen and (max-width:535px){
    .bar_graph {padding:10px 0;}
    .ui-dialog .ui-dialog-content{padding:3px;}
    .select_1{width:225px; margin:0 0 0 5px;display: inline;}
    .input_1{width:251px; margin:0 0 0 5px;display: inline;}
    .input_2{width:80px; margin:0 0 0 5px;display: inline;}
    .bar_graph label {font-size: 12px;}
    .graphwrap .sec1 .line_box4{min-width:50px;margin:0;}
    .graphwrap .sec1 .line_box4 label {font-size:8px;}
    .histo_input {width:90px;}
    }
 @media screen and (max-width:480px){
    #window_pop {padding:35px 0 0 0;}
    /* 막대그래프 윈도우팝업 */
    #window_pop .pop-body {height:100%;padding:0;}
    #window_pop .pop-body .topbox_wrap {height:325px;width:98%;position:absolute;}
    #window_pop .pop-body .topbox_wrap .topbox_con {display:none;}
    #window_pop .pop-body .topbox_wrap .left_con{clear:both;position: absolute;top: 10%;height: 300px;width:100%;}
    #window_pop .pop-body .table_box {height:330px;width:98%;position:absolute;top:365px;}
    /* 히스토그램 윈도우팝업 */
    #window_pop .histo_pop .topbox {position: absolute;width:98%;height:5%;right:0;float:right;display:inline-block;}
    #window_pop .histo_pop .topbox_wrap2{background:#fff;border-radius:5px;position: absolute;top: 8%; width:98%;height: 13%;}
    #window_pop .histo_pop .topbox_wrap {height:54%;width:98%;position:absolute;top:22%;background:#fff;border-radius:5px;}
    #window_pop .histo_pop .topbox_wrap .topbox_con {display:none;}
    #window_pop .histo_pop .topbox_wrap .left_con{clear:both;position: absolute;top: 5%;height: 94%;width:100%;}
    #window_pop .histo_pop .table_box {height:27%;width:98%;position:absolute;top:71%;}
    #window_pop .histo_pop .side2 {display:block;position: absolute;top: -505px;z-index: 999;width:100%;height: 505px;border-left:none;border-bottom: 1px solid #ddd;background: #fff;}
    #window_pop .histo_pop .side2 .btn_close2 {position: absolute;top:504px;left:50%;margin-left:-45px;width:90px;height: 30px;cursor: pointer;}

    .graphwrap{padding:3px 0!important;}
    .bar_graph {padding:25px 0;}
    .side{display:none;}
    .side2 {display:block;position: absolute;top: -280px;z-index: 999;width:100%;height: 280px;border-left:none;border-bottom: 1px solid #ddd;background: #fff;}
    .side2 .btn_close2 {position: absolute;top:279px;left:50%;margin-left:-45px;width:90px;height: 30px;cursor: pointer;}
    .side2 #side_right {position: absolute;top: 0px;right: 0px;z-index: 11;height: 100%;overflow-y: auto;padding: 0;}
    .side2 .box {border-top: 0;box-shadow: none;}
    .side2 .box .nav-tabs-custom>.tab-content {padding: 0;}
    .side2 .col-md-12 {padding: 0;}
    .box-header {padding:3px 10px;}
    .box-body {padding:3px;}
    .form-group {margin-bottom:5px;}
    .nav-tabs-custom {box-shadow:none;}
    .param_set .set_box {float: left; width:60%;}
    .param_set .set_btn {float: right;text-align:right; width:40%;}
    .btn_wrap{display:none;}
    .param_set .btn_wrap2 {display:block;margin:22px 0 0 5px;}
    .select_1{width:200px; margin:0 0 0 3px;display: inline;}
    .input_1{width:225px; margin:0 0 0 3px;display: inline;}
    .input_2{width:80px; margin:0 0 0 3px;display: inline;}
    .topbox_wrap{background:#fff;border-radius:5px;height:300px;clear:both;}
    .change_input{width:80px; margin: 0 5px; display: inline;}
    .graphwrap .label_hidden {display:none;}
    .graphwrap .sec1 {display:none;}
    .graphwrap .sec1_m {display:block;}
    .pop-body .pop-linebox {background:none;height:253px;}
    .pop-body .cross_linebox {background:none;height:380px!important;}
    .pop-body .pop-linebox .pop-itembox {width:100%;height:67px;overflow-y:auto;margin:3px 0;}
    .graphwrap .sec2 .label_hidden{display:none;}
    .graphwrap .sec2 .checkbox {margin:0;}
    .graphwrap .sec3{margin-top:0; margin-bottom: 0; float: left; width:100%; background:#fff; border-radius:10px;}
    .pop-itembox ul {list-style: none;padding:0;}
    .pop-itembox ul li {height:30px;line-height:30px;border-bottom:1px #ddd dashed;}
    .pop-itembox ul li .item_1 {float:left;width:80%;padding:0 0 0 5px;}
    .pop-itembox ul li .item_2 {float:right;}
    .pop-itembox ul li .item_2 button {padding:0 10px; margin: 0 5px 0 0;}
    }
 @media screen and (max-width:445px){
    .ui-dialog .ui-dialog-content{padding:2px;}
    .select_1{width:160px; margin:0 0 0 2px;display: inline;}
    .input_1{width:185px; margin:0 0 0 2px;display: inline;}
    .input_2{width:65px; margin:0 0 0 2px;display: inline;}
    .table_temp2 .btn {padding:4px;}
    .sample {line-height: 45px;}
    .change_table1 {font-size: 11px;}
    .change_input{width:80px; margin: 0; padding:0; display: inline;}
    /* 히스토그램 윈도우팝업 */
    #window_pop .histo_pop .topbox {position: absolute;width:98%;height:30px;right:0;float:right;display:inline-block;}
    #window_pop .histo_pop .topbox_wrap2{background:#fff;border-radius:5px;position: absolute;top: 45px; width:98%;height: 160px;}
    #window_pop .histo_pop .topbox_wrap {height:330px;width:98%;position:absolute;top:215px;background:#fff;border-radius:5px;}
    #window_pop .histo_pop .topbox_wrap .topbox_con {display:none;}
    #window_pop .histo_pop .topbox_wrap .left_con{clear:both;position: absolute;top: 5%;height: 94%;width:100%;}
    #window_pop .histo_pop .table_box {height:200px;width:98%;position:absolute;top:550px;}
    .histo_input{width:60px;}
    .topbox_wrap2{height:160px;}
    .histo_text{height:80px;}
    .histo_left{width:100%;float: left;}
    .histo_right{width:100%;float:left;text-align: left;}
    .histo_right span {text-align: left;}
    }
@media screen and (max-width:380px){
    .ui-dialog .ui-dialog-content{padding:3px;}
    .select_1{width:130px; margin:0;display: inline;}
    .input_1{width:155px; margin:0;display: inline;}
    .input_2{width:63px; margin:0;display: inline;}
    .table_temp2 .btn {padding:2px;}
    }


/* 그래프제목수정 레이어팝업 */
.Pstyle {opacity: 0;display: none;position: relative;height:180px;width:300px;background-color: #fff;border-radius:5px;font-family: 나눔고딕, NanumGothic, ng;}
.Pcontent h3 {width:100%;height:40px;line-height:40px;background:#2F3E44;color:#fff;font-size:16px;border-radius:5px 5px 0 0;margin:0;padding:0 0 0 10px;}
.Pcontent div{width:100%;height:45px;padding:5px;margin:1px 0;}
.Pcontent div .left {float:left;width:21%;line-height:40px;font-size:14px;font-weight:600;text-align:center;}
.Pcontent div .right {float:left;width:75%;line-height:40px;}
.b-close {position: absolute;right: 16px;bottom: 10px;display: inline-block;cursor: pointer;}

/* 클립보드 레이어팝업 */
.Pstyle2 {opacity: 0;display: none;position: relative;padding:20px;width:300px;background-color: #fff;border-radius:5px;font-family: 나눔고딕, NanumGothic, ng;}
.Pstyle2 p {margin:0;font-size:15px;line-height:15px;text-align:center;}

/* sns공유 챠트 레이어팝업  */
.Sstyle {opacity: 0;display: none;position: relative;height:200px;width:560px;background-color: #fff;border-radius:5px;font-family: 나눔고딕, NanumGothic, ng;}
.Scontent h3 {width:100%;height:40px;line-height:40px;background:#2F3E44;color:#fff;font-size:16px;border-radius:5px 5px 0 0;margin:0;padding:0 0 0 10px;}
.Scontent div{padding:5px;margin:1px 0;}
.Scontent div .left {float:left;width:45%;height: 80%;line-height:40px; background-color: white;overflow: auto;border: 1px solid #ddd;}
.Scontent div .right {float:right;width:78%;height: 90%;line-height:20px; background-color: white;overflow: auto;border: 1px solid #ddd;}
#snsDiv{text-align:center}
#snsDiv a{margin:0 5px}
#snsDiv img{width:48px}

/* sns공유 설문결과 레이어팝업  */
.SurvSstyle {opacity: 0;display: none;position: relative;height:195px;width:450px;background-color: #fff;border-radius:5px;font-family: 나눔고딕, NanumGothic, ng;}
.SurvScontent h3 {width:100%;height:40px;line-height:40px;background:#2F3E44;color:#fff;font-size:16px;border-radius:5px 5px 0 0;margin:0;padding:0 0 0 10px;}
.SurvScontent div{padding:5px;margin:1px 0;}
.SurvScontent div .left {float:left;width:45%;height: 80%;line-height:40px; background-color: white;overflow: auto;border: 1px solid #ddd;}
.SurvScontent div .right {float:right;width:100%;height: 90%;line-height:20px; background-color: white;overflow: auto;border: 1px solid #ddd;}
#SurvSDiv{text-align:center}
#SurvSDiv a{margin:0 7px}
#SurvSDiv img{width:50px}


/* 집계표 피봇 레이어팝업 */
/* .Pstyle3 {opacity: 0;display: none;position: relative;height:80%;width:80%;background-color: #fff;border-radius:5px;font-family: 나눔고딕, NanumGothic, ng;}
.Pcontent3 {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: stretch;
    align-items: stretch;
    width:95%;
    height: 95%;
    background-color: #fff;
} */
/* .Pcontent3 h3 {width:100%;height:40px;line-height:40px;background:#2F3E44;color:#fff;font-size:16px;border-radius:5px 5px 0 0;margin:0;padding:0 0 0 10px;}
.Pcontent3 div{width:100%;height:45px;padding:5px;margin:1px 0;}
.Pcontent3 div .item-box{
    background-color: white;
    height: 80%;
    width:45%;
    overflow: auto;
    border: 1px solid #ddd;
    margin-top: 100px;
} */
.Pstyle3 {opacity: 0;display: none;position: relative;height:520px;width:500px;background-color: #fff;border-radius:5px;font-family: 나눔고딕, NanumGothic, ng;}
.Pstyle3 .Pcontent3 h3 {width:100%;height:40px;line-height:40px;background:#2F3E44;color:#fff;font-size:16px;border-radius:5px 5px 0 0;margin:0;padding:0 0 0 10px;}
.Pstyle3 .Pcontent3 div{padding:5px;margin:1px 0;}
.Pstyle3 .Pcontent3 div .left {float:left;width:45%;height: 80%;line-height:40px; background-color: white;overflow: auto;border: 1px solid #ddd;}
.Pstyle3 .Pcontent3 div .right {float:left;width:45%;height: 80%;line-height:40px; background-color: white;overflow: auto;border: 1px solid #ddd;}

.left_wrap {width:45%;float: left;}
.right_wrap {width:45%;float: left;}
.center {width:10%;text-align: center;float: left;}
.center .arrow_box {margin:100px 0 0 0!important;}
.box2 ul{list-style: none;padding:0;text-align: center;}
.box2 ul li {width:190px;height:30px;line-height: 30px;background:#E5EAF1;margin:10px auto;border:1px solid #B5C7E0;text-align: center; cursor: pointer;}
.box2 ul li.active {border:2px solid #000;}

.Pstyle4 {opacity: 0;display: none;position: relative;height:520px;width:250px;background-color: #fff;border-radius:5px;font-family: 나눔고딕, NanumGothic, ng;}
.Pstyle4 .Pcontent4 h3 {width:100%;height:40px;line-height:40px;background:#2F3E44;color:#fff;font-size:16px;border-radius:5px 5px 0 0;margin:0;padding:0 0 0 10px;}
.Pstyle4 .Pcontent4 div{padding:5px;margin:1px 0;}
.Pstyle4 .Pcontent4 div .left {float:left;width:45%;height: 80%;line-height:40px; background-color: white;overflow: auto;border: 1px solid #ddd;}
.Pstyle4 .Pcontent4 div .right {float:left;width:45%;height: 80%;line-height:40px; background-color: white;overflow: auto;border: 1px solid #ddd;}

.stat_popup4 {padding:10px!important;}
.stat_popup4 .box3 {text-align: center;border: 1px solid #ddd;}
.stat_popup4 .box3 .border {text-align: left;}

.filterBox {float:right;}
.filterBtn {border: 1px solid #000;border-radius: 3px;font-size: 10px;background: #EDEDED;width:20px;text-align: center;padding: 4px;}

.totalRange {width:200px; float: right;}
.totalRange .table>tbody>tr>th {text-align: center;background:#f3f6f7;color:#14556E;}
.totalBox {overflow: auto; clear: both;}
.totalBox .table>tbody>tr>th {text-align: center;background:#f3f6f7;color:#14556E;}
.totalBox .table>tbody>tr>td {text-align: right;}

.fontSettings {margin-left: 8px;}
.fontSettings .fontBtn {margin-right:5px;}
.fontSettings .fontBtn button {font-size: 15px !important;font-weight: bold;width:25px;height: 25px;text-align: center;}

.resultTable {
    padding: 5px 0;
    background: #fff;
    border-radius: 5px;
    margin:10px 0;
    font-size:9pt;
    overflow-y: auto;
    overflow-x:auto;
}

.wrap_responsive,.wrap_responsive .area_left,.wrap_responsive .area_right{overflow:hidden}
.wrap_responsive .area_left,.wrap_responsive .area_right{position:relative;float:left;width:22%;}
.wrap_responsive .area_right{float:right;width:76%;}
.wrap_responsive .area_right .area_graph{float:right;width:49.5%;;box-sizing:border-box; border: 1px solid #bebebe; background: #fff; }
.wrap_responsive .area_right .area_graph:first-child{float:left;}

.area_left.graph_condition{overflow:hidden}
.area_left.graph_condition .condi_area { margin-bottom: 5px; }
.area_left.graph_condition .condi_area div{margin: 0 0 2px}
.area_left.graph_condition .condi_area input, .area_left.graph_condition .condi_area select {width:158px}

.area_left.graph_condition .condi_area .condi_sel_area{position:relative;margin-bottom:10px;}
.area_left.graph_condition .condi_area .condi_sel_area input{position:absolute;width:auto !important;}

.fl_left{float:left;}
.fl_right{float:right;}
.wrap_half{width:49.5%;}

@media screen and ( max-width :800px) {
    .wrap_responsive .area_left,.wrap_responsive .area_right{float:none;width:100%}
    .wrap_responsive .area_left.graph_condition .condi_area,.wrap_responsive .area_left.graph_condition .condi_area.type02 div{overflow:hidden;float:left;width:50%;box-sizing:border-box}
    .area_left.graph_condition .condi_area { margin-bottom: 0px; }
    .wrap_responsive .area_left.graph_condition .condi_area.type02{width:100%}
    .wrap_responsive .area_left.graph_condition .condi_area label{ min-width:62px; width:auto; margin-right:10px;line-height:30px}
    .wrap_responsive .area_left.graph_condition .condi_area p{display:inline-block}
    .wrap_responsive .area_left.graph_condition .pop-btngroup{ float: none; width:100%;clear:both; margin-top:0 !important ;text-align:right}
    .wrap_responsive .area_left.graph_condition .pop-btngroup.btnwrap div{float:none ! important }
    #span_swor { position: absolute;  }
    .intro_txt { clear: both; border: 1px dashed #bebebe ; padding: 10px; background: #fff; margin-bottom: 3px; }
}

/* img radio selector css */
.cc-selector input{
    margin:0;padding:0;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none;
}
.dir_left{background-image:url(/inno_resources/images/tongramy/binormal_left.png) !important;}
.dir_both{background-image:url(/inno_resources/images/tongramy/binormal_both.png) !important;}
.dir_right{background-image:url(/inno_resources/images/tongramy/binormal_right.png) !important;}

.cc-selector input:active +.dir-cc{opacity: .9 !important;}
.cc-selector input:checked +.dir-cc{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
    background-position: 0;
}
.dir-cc{
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
    width:50px;height:31px;
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    -webkit-filter: brightness(1.8) grayscale(1) opacity(.7);
       -moz-filter: brightness(1.8) grayscale(1) opacity(.7);
            filter: brightness(1.8) grayscale(1) opacity(.7);
}
.dir-cc:hover{
    -webkit-filter: brightness(1.2) grayscale(.5) opacity(.9);
       -moz-filter: brightness(1.2) grayscale(.5) opacity(.9);
            filter: brightness(1.2) grayscale(.5) opacity(.9);
}

/** 3단계 관련 layout 수정건 **/
.pop-body.new{padding:0}
.wrap_area:after{content:'';display:block;clear:both}

.wrap_left{float:left;width:230px}
.wrap_right{float:right;width:calc(100% - 250px)}
.wrap_right label{display:block;text-align:center}

.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}

.mb5{margin-bottom:5px !important}
.mb10{margin-bottom:10px !important}
.mb15{margin-bottom:15px !important}
.mb20{margin-bottom:20px !important}
.mb25{margin-bottom:25px !important}

/** 800px 시작 **/
@media screen and (max-width:800px){
	
    /** common **/
    .fl_left,.fr_right{float:none}
    .wrap_half{width:100%}
    
	.wrap_responsive .area_left.graph_condition .condi_area div{position:relative}
	
    /** wrap style 기존  **/
    .wrap_responsive .area_left{margin-bottom:15px}
    .wrap_responsive .area_left.graph_condition .condi_area, .wrap_responsive .area_left.graph_condition .condi_area.type02 div{float:none;width:100%}
    .wrap_responsive .area_left.graph_condition .condi_area label{min-width:74px;line-height:27px}
    .wrap_responsive .area_left.graph_condition .condi_area #percentTxt{min-width:auto}
    .area_left.graph_condition .condi_area .condi_sel_area input[type="number"]{display:inline;position:relative;top:inherit !important;}
    .ui-dialog .ui-dialog-content p.intro_txt{margin-bottom:8px}
    
    /** tab style **/
    .ui-tabs .ui-tabs-nav{padding:1px}
    .ui-tabs .ui-tabs-nav li{width:calc(50% - 2px);margin:1px;font-size:14px;text-align:center;border-width:0}
    .ui-tabs .ui-tabs-nav li.ui-tabs-active{margin-bottom:1px;padding-bottom:0}
    .ui-tabs .ui-tabs-nav .ui-tabs-anchor{float:none;display:block}
    .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl{border-radius:0}    
    .ui-tabs .ui-tabs-panel{padding:1em}
    
    /** graph area **/
    .area_graph{float:none !important;margin-top:10px;width:calc(100% - 2px) !important}
    
    #span_swor{top:10px;left:260px}
}
/** 800px 끝 **/

/** 600px 시작 **/
@media screen and (max-width:600px){
    .wrap_left,.wrap_right{float:none;width:100%;box-sizing:border-box}
    .wrap_left{margin-bottom:15px;padding:5px 5px 15px;border-bottom:1px dashed #ccc}
    .wrap_left > div > div{float:none;padding-left:10px}
    .wrap_left > div > div:first-child{margin-top:5px !important}
    .wrap_left > div select,.wrap_left > div input[type="number"]{width:100% !important;margin-right:0 !important;box-sizing:border-box}
    .wrap_left.nomal > div select,.wrap_left.nomal > div input[type="number"]{width:auto !important;}
    .wrap_left .pop-btngroup div{float:none !important;text-align:center}
    
    /** wrap style 기존 **/
    .wrap_responsive .area_left.graph_condition .condi_area label{display:block}
    .wrap_responsive .area_left.graph_condition .condi_area #type_bern+label,.wrap_responsive .area_left.graph_condition .condi_area #percentTxt{display:inline-block}
        
    /** tab style **/
    .ui-tabs .ui-tabs-nav{padding:1px 1px 0}
    .ui-tabs .ui-tabs-nav li{float:none;width:100%;margin:0 0 1px;text-align:left}
    
    #span_swor{display:block;position:relative;top:inherit;left:inherit;margin:3px 0}
}
/** 600px 끝 **/


.title-change-div {
    position: relative;
    text-align: center;
}
.title-change-button {
    display: inline-block;
    padding: 5px 10px;
    line-height: 22px;
    color: #fff;
    font-size: 14px;
    border-radius: 5px;
    box-sizing: border-box;
    background-color: #273d57;
    text-align: center;
    border: none;
    cursor: pointer;
    position: absolute;
    left: 0;
}
.title-change-button i {
    font-style: normal;
}
.title-change-button:hover, .title-change-button:focus {
    background-color: #0c1723;
}
