/*************************************************************** 웹 폰트 */
@font-face {
    font-family: 'NEXON_Lv2_Gothic';
    font-style: normal; font-weight: 300;
    src: url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic\ Light.ttf) format('truetype'),
    url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic\ OTF\ Light.otf) format('opentype');
}
@font-face {
  font-family: 'NEXON_Lv2_Gothic';
  font-style: normal; font-weight: 500;
  src: url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic.ttf) format('truetype'),
  url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic\ OTF.otf) format('opentype');
}
@font-face {
  font-family: 'NEXON_Lv2_Gothic';
  font-style: normal; font-weight: 700;
  src: url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic\ Medium.ttf) format('truetype'),
  url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic\ OTF\ Medium.otf) format('opentype');
}
@font-face {
  font-family: 'NEXON_Lv2_Gothic';
  font-style: normal; font-weight: 900;
  src: url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic\ Bold.ttf) format('truetype'),
  url(../font/NEXON_Lv2_Gothic_total/A_NEXON_Lv2_Gothic/NEXON\ Lv2\ Gothic\ OTF\ Bold.otf) format('opentype');
}

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

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
*{
    -webkit-box-sizing: border-box;
    -moz-box-size: border-box; 
    box-sizing: border-box;
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 500;
}
body {
   line-height: 1;
   font-family: "NEXON_Lv2_Gothic", sans-serif;
   width: 100%;
   /* height: 100%; */
   min-height: 100%;
   height: auto;
}
ol, ul {
   list-style: none;
}
blockquote, q {
   quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
   content: '';
   content: none;
}
table {
   border-collapse: collapse;
   border-spacing: 0;
}
th, h1, h2, h3, h4, h5, h6, th {font-weight:normal;}
fieldset legend {display:none;}
ul:after {clear: both;display: block;content: ''}
dl:after {clear: both;display: block;content: ''}
caption {display:none;}

/* text link */
a, a:link, a:active, a:hover {text-decoration:none;}
input, select {vertical-align:middle;}
h1,h2,h3,h4,h5,h6,p,span {word-break:break-all;}
button {border:0; padding:0; margin:0; cursor:pointer;}

*:focus {
  outline: none;
}


hr{
    margin: 0;
    border: 0;
    width: 100%;
    height: 1px;
    background-color: #DDDDDD;
}
hr.hhr{
    margin-top: 15px;
    margin-bottom: 25px;
}
pre{
    white-space: pre-wrap;
    word-break: break-all;
}
br{
    font-family: 'Dotum';
}

button{
    background-color: transparent;
}

a{
    color: #000;
    cursor: pointer;
}

/* input[type=search] x버튼 없애기 */
input::-ms-clear,
input::-ms-reveal{
	display:none;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button,
input::-webkit-search-results-button,
input::-webkit-search-results-decoration{
	display:none;
}
/* input[type=number] 화살표 없애기
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/****************************** padding  */
.pd_0{
    padding: 0;
}
.pd_30{
    padding: 30px;
}
.plr_30{
    padding: 0 30px;
}
.pt_30{
    padding-top: 30px;
}
/****************************** margin  */
.mt_0{
    margin-top: 0;
}
.mt_5{
    margin-top: 5px;
}
.mt_10{
    margin-top: 10px;
}
.mt_20{
    margin-top: 20px;
}
.mt_30{
    margin-top: 30px;
}
.mt_60{
    margin-top: 60px;
}

.mb_5{
    margin-bottom: 5px;
}
.mb_7{
    margin-bottom: 7px;
}
.mb_10{
    margin-bottom: 10px;
}
.mb_15{
    margin-bottom: 15px;
}
.mb_20{
    margin-bottom: 20px;
}
.mb_30{
    margin-bottom: 30px;
}
.mb_40{
    margin-bottom: 40px;
}
.mb_50{
    margin-bottom: 50px;
}
.mb_60{
    margin-bottom: 60px;
}
.mr_10{
    margin-right: 10px;
}
/****************************** 텍스트 정렬 */
.t_left{
  text-align: left;
}
.t_right{
  text-align: right;
}
.t_center{
  text-align: center;
}

/****************************** float 지정 */
.f_left{
  float: left!important;
}
.f_right{
  float: right;
}

.c_left{
    clear: left;
}
.c_right{
    clear: right;
}
.c_both{
    clear: both;
}
/****************************** 배경색 지정 */
.bg_white{
    background-color: #FFFFFF;
}
/****************************** 글자색깔 지정 */
.co_fff{
	color: #ffffff;
}
.co_333{
	color: #333333;
}
.co_666{
	color: #666666;
}
.co_999{
	color: #999999;
}
.co_aaa{
    color: #AAAAAA;
}
/** wedream **/
.co_blue  {
    color: #5E78D0; 
}

/****************************** 글자크기, 무게 지정 */
.fs_12{
    font-family: 'NEXON_Lv2_Gothic';
    font-size: 12px;
    line-height: 14px;
}
.fs_13{
    font-family: 'NEXON_Lv2_Gothic';
    font-size: 13px;
    line-height: 15px;
}
.fs_14{
    font-family: 'NEXON_Lv2_Gothic';
    font-size: 14px;
    line-height: 16px;
}
.fs_16{
    font-family: 'NEXON_Lv2_Gothic';
    font-size: 16px;
    line-height: 18px;
}
.fs_20{
    font-family: 'NEXON_Lv2_Gothic';
    font-size: 20px;
    line-height: 23px;
}

.fw_9{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
}
.fw_7{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
}
.fw_5{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 500;
}
.fw_3{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 300;
}

/**************** a ***************/
a.link{
    text-decoration: underline;
    text-underline-position: under;
}


/**************** 버튼 ***************/
.btn{
    width: 100px;
    height: 40px;
    box-sizing: border-box;
    display: inline-block;
    border: 1px solid #2461BD;
    background-color: #2461BD;
    border-radius: 10px;
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    color: #FFFFFF;
    flex-shrink: 0;
}
button.btn,
button.btn:active,
button.btn:focus{
    outline: 0;
}
button.btn:hover{
    /*color:#fff*/
}
.btn.nw{
    width: auto;
    padding: 0 10px;
}
.btn.blue_ol{
    background-color: #F7F8FA;
    color: #2461BD;
}
.btn.blue_olbg{
    background-color: rgba(36,97,189,.3);
    color: #2461BD;
}
.btn.gray{
    border: 1px solid #737A85;
    background-color: #737A85;
}
.btn.gray_ol{
    border: 1px solid #737A85;
    background-color: #F7F8FA;
    color: #737A85;
}
.btn.white{
    border: 1px solid #FFFFFF;
    background-color: #FFFFFF;
    color: #2461BD;
}
.btn.small{
    height: 28px;
    padding: 5px 0 ;
    text-align: center;
}
td .btn.small{
    padding-top: 5px;
}
.btn.tab_btn{
    border: none;
    background-color: #FFFFFF;
    border-radius: 0;
    color: #737A85;
    width: auto;
    padding:10px;
}
.btn.tab_btn.small{
    padding: 0px 0 0 0;
}
.btn.tab_btn.ac{
    background-color: #737A85;
    color: #FFFFFF;
}
.btn.tab_btn.active{
    background-color: #737A85;
    color: #FFFFFF;
}
.btn.wd_100{
    width: 100%;
}
.rl0{
    border-radius: 0 10px 10px 0!important;
}
.rr0{
    border-radius: 10px 0 0 10px!important;
}

/*************** 인풋 ****************/
.inp_wrap{
    width: 100%;
    height: auto;   
    border: 1px solid #ccc;
    background-color: #FEFEFE;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    display: inline-block;
}
.inp_wrap.grid{
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    align-items: center;
}
.inp_wrap.tab{
    border: 1px solid #CCCCCC;
    background-color: #FFFFFF;
}
.inp_wrap.tab > hr{
    background-color: #ccc;
}
.inp_wrap.grid_4{
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr 1px 1fr;
    align-items: center;
}
.inp_wrap.grid_2{
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    align-items: center;
}
.inp_wrap.grid_auto{
    display: grid;
    align-items: center;
}
.inp_wrap.grid_auto > *{
    border-left: 1px solid #ddd;
}
.inp_wrap.grid_auto > *:first-child{
    border-left: 0;
}
.inp{
    width: 100%;
    height: 40px;
    border: none;
    background-color: #FEFEFE;
    padding: 0 10px;
    box-sizing: border-box;
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    color: #111111;
    border-radius: 0;
}
.inp.small{
    height: 26px;
    padding: 0 15px;
}
input::placeholder{
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    color: #999999;
}
.inp_wrap > hr{
    width: 1px;
    height: 100%;
    box-sizing: border-box;
    border: 0;
    background-color: #5E78D0;
}
.inp.calendar{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.333' height='18' viewBox='0 0 17.333 18'%3E%3Cg id='_007-calendar' data-name='007-calendar' transform='translate(-5.988)'%3E%3Cg id='그룹_357' data-name='그룹 357' transform='translate(5.988 0)'%3E%3Cpath id='패스_95' data-name='패스 95' d='M9.988,0a.669.669,0,0,0-.667.667v.667H8.375A2.389,2.389,0,0,0,5.988,3.72V15.613A2.389,2.389,0,0,0,8.375,18h12.56a2.389,2.389,0,0,0,2.387-2.387V3.72a2.389,2.389,0,0,0-2.387-2.387h-.947V.667a.667.667,0,0,0-1.333,0v.667h-8V.667A.669.669,0,0,0,9.988,0Zm8.667,2.667v.667a.667.667,0,0,0,1.333,0V2.667h.947A1.056,1.056,0,0,1,21.988,3.72V15.613a1.056,1.056,0,0,1-1.053,1.053H8.375a1.056,1.056,0,0,1-1.053-1.053V3.72A1.056,1.056,0,0,1,8.375,2.667h.947v.667a.667.667,0,1,0,1.333,0V2.667Z' transform='translate(-5.988 0)'/%3E%3Cpath id='패스_96' data-name='패스 96' d='M92.722,131.459a.66.66,0,0,0,.94,0l4.48-4.48a.667.667,0,0,0-.943-.943l-4.007,4.01-2.023-2.023a.667.667,0,1,0-.943.943Z' transform='translate(-85.352 -118.836)'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px);
    padding-right: 45px;
}
.textarea_wrap{
    width: 100%;
    height: 70px;   
    border: 1px solid #CCCCCC;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.inp_wrap.search_wrap{
    display: grid;
    grid-template-columns: calc(100% - 110px) 110px;
    border: none;
}
.inp_wrap.search_wrap .inp{
    border-radius: 10px 0 0 10px;
    border: 1px solid #CCCCCC;
    border-right: none;
    height: 30px;
}
.inp_wrap.search_wrap .btn{
    border-radius: 0 10px 10px 0;
    height: 30px;
}
.sort *{
    vertical-align: top;
}

/**** select ****/
.sel{
    width: 100%;
    height: 40px;
    box-sizing: border-box;
    background-color: #FEFEFE;
    border: 0;
    appearance: none;
    padding: 0 10px;
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    color: #111111;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.485' height='5.657' stroke='%23111' stroke-width='2' viewBox='0 0 8.485 5.657'%3E%3Cg id='arrow-down' transform='translate(120.915 -292.742) rotate(45)'%3E%3Cline id='선_3' data-name='선 3' x2='6' transform='translate(122.5 292.5)' fill='none'/%3E%3Cpath id='패스_74' data-name='패스 74' d='M0,0V5.673' transform='translate(127.5 287.5)' fill='none'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: calc(100% - 10px);
}
.sel.small{
    height: 26px;
}

/**************** 테이블 ***************/
.tab_section{
    width: 100%;
    height: auto;
    border: 1px solid #737A85;
    background-color: #FFFFFF;
    border-radius: 10px;
    overflow: hidden;
}
table.tab{
    width: 100%;
    height: auto;
    background-color: #FFFFFF;
}
/*table th a.arr{*/
/*    cursor: pointer;*/
/*    width: 14px;*/
/*    height: 14px;*/
/*    display: inline-block;*/
/*    vertical-align: top;*/
/*    line-height: 14px;*/
/*    transition: all .3s;*/
/*    transform-origin: center;*/
/*}*/
/*table th a.arr.ac{*/
/*    transform: rotate(180deg);*/
/*    */
/*}*/
table th a.arr{
    cursor: pointer;
    width: 14px;
    height: 14px;
    display: inline-block;
    vertical-align: top;
    line-height: 14px;
    /*transition: all .3s;
    transform-origin: center;*/
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='4.538' viewBox='0 0 6 4.538'%3E%3Cpath id='패스_3' data-name='패스 3' d='M3,1,6,5.538H0Z' transform='translate(6 5.538) rotate(-180)' fill='%23333'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    text-indent: -100000px;
    background-position: 50% 50%;
}
table th a.arr.ac{
    /*transform: rotate(180deg);*/
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='4.539' viewBox='0 0 6 4.539'%3E%3Cpath id='패스_3' data-name='패스 3' d='M3,4.539,6,0H0Z' transform='translate(6 4.539) rotate(-180)' fill='%23333'/%3E%3C/svg%3E%0A");
}
.tab th{
    height: 30px;
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
    font-size: 14px;
    line-height: 14px;
    white-space: nowrap;
    padding: 10px 5px;
    color: #737A85;
}
.tab td{
    height: 30px;
    padding:8px 5px;
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: #737A85;
    text-align: center;
    word-break: keep-all;
}
.tab td span.small{
    font-size: 10px;
    margin-left: 0px;
}
.tab.line td,
.tab.line th{
    border: 1px solid #ddd;
    border-collapse: collapse;
}
.tab.line td a.link{
    font-weight: 900!important;
    cursor: pointer;
}
.tab.line tr:first-child th,
.tab.line tr:last-child td{
    border-top: 0;
    border-bottom: 0;
}
.tab.line tr th:first-child,
.tab.line tr td:first-child{
    border-left: 0;
}
.tab.line tr th:last-child,
.tab.line tr td:last-child{
    border-right: 0;
}
.tab tr.line_ac{
    background-color: rgba(255, 0, 0, 0.075)!important;
    border-bottom: 1px solid rgba(255, 0, 0, 0.4);
    border-top: 1px solid rgba(255, 0, 0, 0.4);
}
/*.tab td:not(:last-child){
}
.tab tbody tr:not(:last-child){
}*/
.tab tbody tr:nth-child(odd){
    background-color: #F3F4FA;
}
.click_tab tbody tr:hover{
    background-color: rgba(255, 0, 0, 0.075);
    cursor: pointer;
}
.tab tbody tr.ac{
    background-color: rgba(255, 0, 0, 0.075);
}
.tab.row{
    border-top: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
}
.tab.row th,
.tab.row td{
    height: 50px;
    text-align: left;
    padding: 5px 15px;
}
.tab.row th{
    background-color: rgba(27, 79, 114, 0.1);
}
.tab.row tbody tr{
    background-color: #FFFFFF;
}

/**************** 그래프 ***************/
.row_graph_pack{
    width: 100%;
    /* display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: flex-start; */
}
.row_graph_pack .graph_name{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
    font-size: 10px;
    line-height: 12px;
    color: #111111;
    word-break: keep-all;
}
.graph_row{
    width: 100%;
    height: 60px;
    position: relative;
    padding: 14px 0;
}
.graph_row .white_back{
    width: 100%;
    height: 12px;
    overflow: hidden;
    border: none;
    background-color: #FFFFFF;
    padding: 0;
}
.graph_row .white_back .value_bar{
    width: 0;
    height: 100%;
    display: block;
    border: none;
    background-color: #2980B9;
    border-radius: 0 10px 10px 0;
    margin: 0;
    animation: move 1s;

    -moz-animation-duration: 1s;
    -webkit-animation-duration: 1s;
    -moz-animation-name: move;
    -webkit-animation-name: move;
}
@keyframes move {
    0%{
        width: 0;
    }
    auto{
        width: auto;
    }
}
.graph_row .white_back .value_bar.yellow{
    background-color: #F1C40F;
}
.graph_row .standard{
    position: absolute;
    top: 0;
    height: 100%;
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    align-items: center;
}
hr.column{
    width: 1px;
    height: 100%;
    border: none;
    background-color: #AAAAAA;
}
.graph_row .standard hr.column{
    height: 40px;
    margin-top: 1px;
}
.graph_row .standard:nth-child(1){
    left: -3.5px;
}
.graph_row .standard:nth-child(2){
    left: 25%;
}
.graph_row .standard:nth-child(3){
    left: 50%;
}
.graph_row .standard:nth-child(4){
    left: 75%;
}
.graph_row .standard:nth-child(1) hr,
.graph_row .standard:nth-child(5) hr{
    width: 2px;
    background-color: #111111;
}
.graph_row .standard .standard_num{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
    font-size: 11px;
    line-height: 12px;
    color: #737A85;
}
.type{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: space-between;
    align-items: center;
}
.type_name{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 10px;
    line-height: 12px;
    color: #737A85;
    text-align: center;
}
.type_name.co_blue{
   color: #2980B9; 
}
.type_name.co_yellow{
   color: #F1C40F; 
}

/**************** 라디오버튼 / 체크박스 ***************/
.rdo, .chk{
    position: relative;
}
.rdo input[type="radio"],
.chk input[type="checkbox"]{
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
    background-color: none;
}
.rdo input[type="radio"] + label,
.chk input[type="checkbox"] + label{
    display: inline-block;
    position: relative;
    padding-left: 26px;
}
.rdo input[type="radio"] + label:before{
    content: '';
    position: absolute;
    left: 0;
    top: -3px;
    width: 20px;
    height: 20px;
    border: 1px solid #D9D9D9;
    background-color: #FFFFFF;
    border-radius: 100px;
    box-sizing: border-box;
}
.rdo input[type="radio"]:checked + label:after{ 
    content: ''; 
    position:absolute; 
    left: 0;
    top: -3px;
    width: 20px;
    height: 20px;
    border: 1px solid #5E78D0;
    border-radius: 100px;
    box-sizing: border-box;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' fill='%235e78d0' viewBox='0 0 6 6'%3E%3Ccircle id='타원_20' data-name='타원 20' cx='3' cy='3' r='3'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: 50%;
}
.chk input[type="checkbox"] + label:before{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #D9D9D9;
    background-color: #FFFFFF;
    border-radius: 5px;
    box-sizing: border-box;
}
.chk input[type="checkbox"]:checked + label:after{ 
    content: ''; 
    position:absolute; 
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #5E78D0;
    border-radius: 5px;
    box-sizing: border-box;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9.921' height='7.093' stroke='%235e78d0' stroke-width='2' viewBox='0 0 9.921 7.093'%3E%3Cg id='그룹_399' data-name='그룹 399' transform='translate(120.915 -291.306) rotate(45)'%3E%3Cline id='선_3' data-name='선 3' x2='6' transform='translate(122.5 292.5)' fill='none'/%3E%3Cpath id='패스_74' data-name='패스 74' d='M0,0V7.7' transform='translate(127.5 285.469)' fill='%235e78d0'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: 50% calc(50% + 1px);
}
.rdo span, .chk span{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px; 
    color: #111111;
    white-space: nowrap;
}

/**************** 팝업 ***************/
.pop_wrap{
    position: fixed;
    width: 100%;
    height: 100%;
    min-height: 100%;
    box-sizing: border-box;
    background-color: rgba(255 , 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    overflow: hidden;
    z-index: 101;
    display: none;
}
.pop_wrap > div{
    position: relative;
    width: 100%;
    height: 100%;
}
.pop{
    width: 800px;
    /* min-height: 526px; */
    height: auto;
    position: absolute;
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.16);
    border-radius: 10px;
    left: calc(50% - 400px);
    top: /*calc(50% - 263px);*/ 50px!important;
    padding: 0 0px 0px;
    

}
.pop .legend_pm{
    width: 140px;
    margin-top: 0;
    display: inline-block;
}
.pop .chart{
    margin: 0 20px;
}
.pop.small{
    width: 600px;
    left: calc(50% - 300px);
}
.pop div:last-child{
    border-radius: 0 0 10px 10px;
}
.pop div.inp_wrap:last-child{
    border-radius: 10px;
}
.pop_head{
    width: 100%;
    height: 65px;
    display: grid;
    grid-template-columns: calc(100% - 60px) 40px;
    align-items: center;
    gap: 20px;
    padding: 0 20px;

}
.pop_wrap .map{
    margin-top: 0;
}
.pop_title{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
    font-size: 18px;
    line-height: 18px;
    color: #111111;
    width: 80%;
    display: inline-block;
}
.date{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    color: #999999;
}
.exit_pop{
    width: 50px;
    height: 50px;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 20px;
    position: absolute;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.485' height='8.485' stroke='%23111' stroke-width='2' viewBox='0 0 8.485 8.485'%3E%3Cg id='그룹_333' data-name='그룹 333' transform='translate(120.915 -292.742) rotate(45)'%3E%3Cline id='선_3' data-name='선 3' x2='10' transform='translate(122.5 292.5)' fill='none'/%3E%3Cline id='선_4' data-name='선 4' y2='10' transform='translate(127.5 287.5)' fill='none'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: 50%;
    flex-shrink: 0;
    right: -20px;
    top: -20px;
}
.pop_content{
    width: 100%;
    height: calc(100% - 106px);
    display: none;
}
.pop_content.block{
    display: block;
}
.pop_sub_title{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
    font-size: 12px;
    line-height: 13px;
    color: #111111;
}
.pop_filter{
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}
.pop_body{
    padding: 20px;
}

/**************** 페이징 ***************/
.paging{
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
    gap: 3px;
    margin-top: 15px;
}
.paging_btn{
    width: 35px;
    height: 35px;
    border: 1px solid #ddd;
    background-color: #FFFFFF;
    color: #aaa;
    border-radius: 10px;
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    background-repeat: no-repeat;
    background-position: 50%;
}
.paging_btn:hover{
    background-color: #E6E6E6;
    color: #2461BD;
}
.paging_btn:active,
.paging_btn.ac{
    border-color: #2461BD;
    color: #2461BD;
    background-color: rgba(35,89,160,.2);
}
.paging_btn.pre{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7.444' height='12.06' viewBox='0 0 7.444 12.06'%3E%3Cg id='arrarr' transform='translate(1.414 1.414)'%3E%3Cline id='line94' x1='4.616' y2='4.616' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3Cline id='line95' x1='4.616' y1='4.616' transform='translate(0 4.616)' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.paging_btn.pre:active{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7.599' height='12.518' stroke='%23FFF' stroke-width='2' viewBox='0 0 7.599 12.518'%3E%3Cg id='그룹_530' data-name='그룹 530' transform='translate(6.348 12.177) rotate(-135)'%3E%3Cline id='선_3' data-name='선 3' x2='8.495' transform='translate(0 0.518)' fill='none'/%3E%3Cpath id='패스_74' data-name='패스 74' d='M0,8.5V0' transform='translate(7.726 0)' fill='none'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.paging_btn.next{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7.444' height='12.06' viewBox='0 0 7.444 12.06'%3E%3Cg id='arrarr' transform='translate(1.414 1.414)'%3E%3Cline id='line94' x2='4.616' y2='4.616' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3Cline id='line95' y1='4.616' x2='4.616' transform='translate(0 4.616)' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.paging_btn.next:active{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7.599' height='12.518' stroke='%23FFF' stroke-width='2' viewBox='0 0 7.599 12.518'%3E%3Cg id='그룹_427' data-name='그룹 427' transform='translate(-294.67 -110.503) rotate(-45)'%3E%3Cline id='선_3' data-name='선 3' x2='8.495' transform='translate(122.5 295.477)' fill='none'/%3E%3Cpath id='패스_74' data-name='패스 74' d='M0,0V8.5' transform='translate(130.226 287.5)' fill='none'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.paging_btn.first{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.459' height='12.06' viewBox='0 0 14.459 12.06'%3E%3Cg id='arr' transform='translate(-1274.086 -3565.086)'%3E%3Cg id='arrarr' transform='translate(1275.5 3566.5)'%3E%3Cline id='line92' x1='4.616' y2='4.616' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3Cline id='line93' x1='4.616' y1='4.616' transform='translate(0 4.616)' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3C/g%3E%3Cg id='arrarr-2' data-name='arrarr' transform='translate(1282.515 3566.5)'%3E%3Cline id='line94' x1='4.616' y2='4.616' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3Cline id='line95' x1='4.616' y1='4.616' transform='translate(0 4.616)' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.paging_btn.last{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.459' height='12.06' viewBox='0 0 14.459 12.06'%3E%3Cg id='arr' transform='translate(1.414 1.414)'%3E%3Cg id='arrarr' transform='translate(7.015)'%3E%3Cline id='line92' x2='4.616' y2='4.616' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3Cline id='line93' y1='4.616' x2='4.616' transform='translate(0 4.616)' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3C/g%3E%3Cg id='arrarr-2' data-name='arrarr' transform='translate(0)'%3E%3Cline id='line94' x2='4.616' y2='4.616' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3Cline id='line95' y1='4.616' x2='4.616' transform='translate(0 4.616)' fill='none' stroke='%233263b7' stroke-linecap='square' stroke-width='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}

/*글자컬러*/
.text_color{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;;
}
.text_color.gray{
    color:#A0A5AC
}
.text_color.blue{
    color:#2980B9
}
.text_color.green{
    color:#16A085
}
.text_color.yellow{
    color:#F1C40F
}
.text_color.red{
    color:#D35400
}




/*검색영역탭*/
.btn_sort.ac,
.btn_sort2.ac,
.btn_sort3.ac{
    background-color: rgba(36,97,189,.3);
    color: #2461BD;
}
.sort_view,.sort_view2,.sort_view3{
    display: none!important;
}
.sort_view.ac,
.sort_view2.ac,
.sort_view3.ac{
    display: inline-block!important;
}

#page-loading {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 999;
    background-color: rgba(0,0,0,.4);
  }
  
  .three-balls {
    margin: 0 auto;
    width: 70px;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 45%;
  }
  
  .three-balls .ball {
    position: relative;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    display: inline-block;
    -webkit-animation: bouncedelay 2.0s infinite cubic-bezier(.62, .28, .23, .99) both;
    animation: bouncedelay 2.0s infinite cubic-bezier(.62, .28, .23, .99) both;
  }
  
  .three-balls .ball1 {
    -webkit-animation-delay: -.16s;
    animation-delay: -.16s;
  }
  
  .three-balls .ball2 {
    -webkit-animation-delay: -.08s;
    animation-delay: -.08s;
  }
  
  @keyframes bouncedelay {
    0% {
      bottom: 0;
      background-color: #03A9F4;
    }
    16.66% {
      bottom: 40px;
      background-color: #FB6542;
    }
    33.33% {
      bottom: 0px;
      background-color: #FB6542;
    }
    50% {
      bottom: 40px;
      background-color: #FFBB00;
    }
    66.66% {
      bottom: 0px;
      background-color: #FFBB00;
    }
    83.33% {
      bottom: 40px;
      background-color: #03A9F4;
    }
    100% {
      bottom: 0;
      background-color: #03A9F4;
    }
  }
  
  @-webkit-keyframes bouncedelay {
    0% {
      bottom: 0;
      background-color: #03A9F4;
    }
    16.66% {
      bottom: 40px;
      background-color: #FB6542;
    }
    33.33% {
      bottom: 0px;
      background-color: #FB6542;
    }
    50% {
      bottom: 40px;
      background-color: #FFBB00;
    }
    66.66% {
      bottom: 0px;
      background-color: #FFBB00;
    }
    83.33% {
      bottom: 40px;
      background-color: #03A9F4;
    }
    100% {
      bottom: 0;
      background-color: #03A9F4;
    }
  }
.content_center{
    width: 100%;
    height: auto;
    padding: 0 35px 80px;
    background-color: #F9F9F9;
}
.content_head{
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 75px;

}
.content_main_title{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
    font-size: 18px;
    line-height: 20px;
    color: #1D2B46;
}
.flow{
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-end;
    align-items: center;
}
.flow_text{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    color: #B8BED1;
}
.flow_text .co_navy{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 900;
    font-size: 14px;
    line-height: 16px;
    color: #1D2B46;
    margin-left: 3px;
}
.icon_btn.home{
    width: 30px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='17.592' fill='%23b8bed1' viewBox='0 0 18 17.592'%3E%3Cg id='Layer_2' data-name='Layer 2' transform='translate(-1 -1.499)'%3E%3Cpath id='패스_15' data-name='패스 15' d='M15.727,19.091H4.273A3.273,3.273,0,0,1,1,15.818V8.209A3.273,3.273,0,0,1,2.587,5.4L8.315,1.966a3.273,3.273,0,0,1,3.371,0L17.413,5.4A3.273,3.273,0,0,1,19,8.209v7.609a3.273,3.273,0,0,1-3.273,3.273ZM3.455,6.818a1.636,1.636,0,0,0-.818,1.391v7.609a1.636,1.636,0,0,0,1.636,1.636H15.727a1.636,1.636,0,0,0,1.636-1.636V8.209a1.636,1.636,0,0,0-.818-1.391L10.818,3.382a1.636,1.636,0,0,0-1.685,0Z' transform='translate(0)'/%3E%3Cpath id='패스_16' data-name='패스 16' d='M17.169,6.289,11.442,2.853a2.455,2.455,0,0,0-2.52,0L3.195,6.289A2.455,2.455,0,0,0,2,8.392V16a2.455,2.455,0,0,0,2.455,2.455H15.909A2.455,2.455,0,0,0,18.364,16V8.392a2.455,2.455,0,0,0-1.195-2.1Z' transform='translate(0 -0.006)'/%3E%3C/g%3E%3Ctext id='H' transform='translate(5 13)' fill='%23f9f9f9' font-size='9' font-family='GmarketSansBold, Gmarket Sans'%3E%3Ctspan x='0' y='0'%3EH%3C/tspan%3E%3C/text%3E%3C/svg%3E%0A");
}

/**************** 라디오버튼 / 체크박스 ***************/
.rdo, .chk{
    position: relative;
    height: 20px;
    /*overflow: hidden;*/
    display: inline-block;
}
.rdo input[type="radio"],
.chk input[type="checkbox"]{
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
    background-color: none;
}
.rdo input[type="radio"] + label,
.chk input[type="checkbox"] + label{
    display: inline-block;
    position: relative;
    padding-left: 26px;
    margin: 0 3px;
}
.rdo input[type="radio"] + label:before{
    content: '';
    position: absolute;
    left: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #D9D9D9;
    background-color: #FFFFFF;
    border-radius: 100px;
    box-sizing: border-box;
}
.rdo input[type="radio"]:checked + label:after{
    content: '';
    position:absolute;
    left: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #2a8f71;
    border-radius: 100px;
    box-sizing: border-box;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' fill='%232a8f71' viewBox='0 0 6 6'%3E%3Ccircle id='타원_20' data-name='타원 20' cx='3' cy='3' r='3'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: 50%;
}
.chk input[type="checkbox"] + label:before{
    content: '';
    position: absolute;
    left: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #D9D9D9;
    background-color: #FFFFFF;
    border-radius: 5px;
    box-sizing: border-box;
}
.chk input[type="checkbox"]:checked + label:after{
    content: '';
    position:absolute;
    left: 0;

    width: 20px;
    height: 20px;
    border: 1px solid #2a8f71;
    border-radius: 5px;
    box-sizing: border-box;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9.921' height='7.093' stroke='%232a8f71' stroke-width='2' viewBox='0 0 9.921 7.093'%3E%3Cg id='그룹_399' data-name='그룹 399' transform='translate(120.915 -291.306) rotate(45)'%3E%3Cline id='선_3' data-name='선 3' x2='6' transform='translate(122.5 292.5)' fill='none'/%3E%3Cpath id='패스_74' data-name='패스 74' d='M0,0V7.7' transform='translate(127.5 285.469)' fill='%235e78d0'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: 50% calc(50% + 1px);
}
.rdo span, .chk span{
    font-family: 'NEXON_Lv2_Gothic';
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    color: #111111;
    white-space: nowrap;
    vertical-align: top;
    margin: 0 3px 3px 3px;
}

#event_avg {
	display: grid; 
	grid-template-columns: repeat(6 , 1fr); 
	gap:10px;
}

#event_avg .pm_title{
	font-weight: 900;
}

#event_avg .range_left {
	text-align: left;
	color: #F1C40F;
	font-size: 13px; 
	font-weight: 900;
	
}

#event_avg div .count {
	color: rgb(75, 81, 149); 
	font-size: 13px; 
	font-weight: 900;
}