/* 스크린확장/축소 */ ul.scrn_h_box {display:inline-block; vertical-align:middle; width:20px; font-size:0; position:relative; margin-left:20px;} ul.scrn_h_box li {position:absolute; top:50%; left:0; transform:translateY(-50%); cursor:pointer; line-height:100%; transition:all .3s;} ul.scrn_h_box li i {display:inline-block; cursor:pointer; transition:all .3s;font-size:20px; color:#000;} ul.scrn_h_box li.high {} ul.scrn_h_box li.low {display:none;} ul.scrn_h_box li.high.hidden {display:none;} ul.scrn_h_box li.low.hidden {display:block;} ul.scrn_f_box {position:fixed; bottom:0; right:0; width:60px; height:60px; font-size:0; z-index:10;} ul.scrn_f_box li {position:absolute; top:0; left:0; width:100%; height:100%; cursor:pointer; transition:all .3s; } ul.scrn_f_box li i {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:20px; color:var(--screen_icon); opacity:0; transition: all .3s;} ul.scrn_f_box li:hover i {opacity:1;} ul.scrn_f_box li.exp_all {} ul.scrn_f_box li.cmp_all {display:none;} ul.scrn_f_box li.exp_all.hidden {display:none;} ul.scrn_f_box li.cmp_all.hidden {display:block;} .sort_box ul.scrn_f_box {display:inline-block; vertical-align:middle; width:20px; height:30px; font-size:0; position:relative; margin-left:20px;} .sort_box.map ul.scrn_f_box {z-index:10;} .sort_box ul.scrn_f_box li {position:absolute; top:50%; left:0; transform:translateY(-50%); cursor:pointer; line-height:100%; transition:all .3s;} .sort_box ul.scrn_f_box li i {display:inline-block; cursor:pointer; font-size:20px; color:var(--screen_icon); transition: all .3s;} .sort_box.map ul.scrn_f_box li i {color:red; z-index:100000000;} .sort_box ul.scrn_f_box li.exp_all {} .sort_box ul.scrn_f_box li.cmp_all {display:none;} .sort_box ul.scrn_f_box li.exp_all.hidden {display:none;} .sort_box ul.scrn_f_box li.cmp_all.hidden {display:block;} /* 컨텐츠내 탭 */ ul.view_kind {display:inline-block; vertical-align:middle; width:50%; font-size:0; text-align:left;} ul.view_kind li {display:inline-block; vertical-align:middle; width: auto; margin-right:5px;} ul.view_kind li.on {} ul.view_kind li a {display:block; line-height:30px; font-size: 11px; text-align: center; color:var(--kind_menu); background: var(--kind_menu_bg); transition: all .3s; position: relative; border-radius:35px; padding:0 35px;} ul.view_kind li a span {position: relative;} ul.view_kind li:last-child {margin:0;} ul.view_kind li:last-child a {/*border-right:0;*/background: rgba(0,0,0,0.11);} ul.view_kind li a:hover {background: rgba(0,0,0,0.15);} ul.view_kind li.on a {background:var(--kind_menu_bg_on); color:var(--kind_menu_on); border:0; transition: all .3s;} ul.view_kind li.on a span {} ul.view_kind li.on a span:after {content: ""; position: absolute; bottom: -12px; left: 50%; transform:translateX(-50%); border-left:4px solid transparent; border-right: 4px solid transparent; border-top:5px solid #3d96cb; opacity: 0;} /* 기본감싸기 / 타이틀 */ .default_wrap {position:relative; padding:35px; z-index:1;} .dw_hdbx {position:relative; font-size:0; transition:all .3s; height: 80px; background:var(--bg_dw_hdbx); width:calc(100% - 300px);} .dw_hdbx.full {width:100%;} .dw_hdbx .spc_icon_btn {position:absolute; top:50%; right:0; transform:translateY(-50%); border:1px solid red; font-size:20px; color:red; display:none;} .dw_hdbx .dh_wrp {position:relative; top:50%; left:0; transform:translateY(-50%); width: 100%; padding:0 35px; font-size:0;} .dw_hdbx .dh_wrp h2, .dw_hdbx .dh_wrp > span, .dw_hdbx .dh_wrp p {display:inline-block; vertical-align: middle; line-height:110%; position: relative;} .dw_hdbx .dh_wrp h2 {width: calc(100% - 20px); font-size:18px; font-family: 'Noto Sans KR'; font-weight:500; padding-left: 10px;color:var(--bg_title_h2); letter-spacing:-0.05em;transition:all .3s;} .dw_hdbx .dh_wrp h2 span {display:inline-block; padding-left:5px; font-size:0; vertical-align:bottom;} .dw_hdbx .dh_wrp h2 span:before {content:"(";} .dw_hdbx .dh_wrp h2 span:after {content:")";} .dw_hdbx .dh_wrp h2 span em {display:inline-block; vertical-align:bottom; padding-left:5px;font-family:NanumBarunGothic, sans-serif; font-weight:normal;letter-spacing:0;font-size:13px; font-style:normal; line-height:100%; color:var(--bg_title_h2_em);} .dw_hdbx .dh_wrp h2 span em:after {content:" >"; opacity:0.5;;} .dw_hdbx .dh_wrp h2 span em:last-child:after {display:none;} .dw_hdbx .dh_wrp p {font-size:12px; font-weight:normal; padding-top:5px; color:var(--bg_title_p);transition:all .3s; display:none;} .dw_hdbx .dh_wrp > span {width:20px; /*background:var(--bg_title_icon_bg);*/ border-radius:3px;transition:all .3s;} .dw_hdbx .dh_wrp > span:after {content:""; display:block; padding-top:100%;} .dw_hdbx .dh_wrp > span i {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:18px; color:var(--bg_title_icon);transition:all .3s;} .dw_hdbx ul.select_replace {position:relative; display:inline-block; vertical-align:middle;} .dw_hdbx ul.select_replace > li{display:inline-block; vertical-align:top; width:150px; margin-left:3px; font-size:0; position:relative;} .dw_hdbx ul.select_replace > li span{display:inline-block; width:100%; font-size:12px; line-height:35px; padding:0 15px; background:var(--bg_select_replace_span); border-radius:3px; color:var(--select_replace_txt);position:relative; transition:all .3s; cursor:pointer;} .dw_hdbx ul.select_replace > li span > i{position:absolute; top:50%; right:10px; transform:translateY(-50%); font-size:13px; color:var(--select_replace_i);} .dw_hdbx ul.select_replace > li ul.sr_kind{position:absolute; top:47px; left:0; width:100%;transition:all .3s; z-index:10; visibility: hidden; opacity: 0; background:var(--bg_sr_kind); border:1px solid var(--bg_sr_kind_out); padding:15px; border-radius:3px;max-height:300px; height:auto;} .dw_hdbx ul.select_replace > li ul.sr_kind.show{top:37px; transition:all .3s;opacity: 1; visibility: visible; } .dw_hdbx ul.select_replace > li ul.sr_kind {overflow-y:overlay;} .dw_hdbx ul.select_replace > li ul.sr_kind:: {-ms-overflow-style: none;} .dw_hdbx ul.select_replace > li ul.sr_kind::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .dw_hdbx ul.select_replace > li ul.sr_kind::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .dw_hdbx ul.select_replace > li ul.sr_kind li {position:relative; font-size:12px; color:var(--sr_kind_txt); transition:all .3s; cursor:pointer; padding:2px 0;} .dw_hdbx ul.select_replace > li ul.sr_kind li:hover {color:var(--sr_kind_txt_hover);} .dw_hdbx ul.select_replace > li ul.sr_kind li:before {content:"ㆍ";} /* .dw_hdbx ul.select_replace {position:absolute; top:50%; right:35px; transform:translateY(-50%); font-size:0; width:200px; z-index:10;} .dw_hdbx ul.select_replace > li{display:inline-block; vertical-align:top; width:calc(50% - 5px); margin-left:3px; font-size:0; position:relative;} .dw_hdbx ul.select_replace > li span{display:inline-block; width:100%; font-size:12px; line-height:35px; padding:0 15px; background:var(--bg_select_replace_span); border-radius:3px; color:var(--select_replace_txt);position:relative; transition:all .3s; cursor:pointer;} .dw_hdbx ul.select_replace > li span > i{position:absolute; top:50%; right:10px; transform:translateY(-50%); font-size:13px; color:var(--select_replace_i);} .dw_hdbx ul.select_replace > li ul.sr_kind{position:absolute; top:47px; left:0; width:100%;transition:all .3s; z-index:10; visibility: hidden; opacity: 0; background:var(--bg_sr_kind); border:1px solid var(--bg_sr_kind_out); padding:15px; border-radius:3px;max-height:300px; height:auto;} .dw_hdbx ul.select_replace > li ul.sr_kind.show{top:37px; transition:all .3s;opacity: 1; visibility: visible; } .dw_hdbx ul.select_replace > li ul.sr_kind {overflow-y:overlay;} .dw_hdbx ul.select_replace > li ul.sr_kind:: {-ms-overflow-style: none;} .dw_hdbx ul.select_replace > li ul.sr_kind::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .dw_hdbx ul.select_replace > li ul.sr_kind::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .dw_hdbx ul.select_replace > li ul.sr_kind li {position:relative; font-size:12px; color:var(--sr_kind_txt); transition:all .3s; cursor:pointer; padding:2px 0;} .dw_hdbx ul.select_replace > li ul.sr_kind li:hover {color:var(--sr_kind_txt_hover);} .dw_hdbx ul.select_replace > li ul.sr_kind li:before {content:"ㆍ";} */ .dw_hdbx .sprt_wrap {position:absolute; top:50%; right:35px; transform:translateY(-50%); z-index: 10; font-size:0;} .dw_hdbx .sprt_wrap > img {display:inline-block; vertical-align:middle; width: 35px; border-radius: 3px; margin-left:5px;} .dw_hdbx .site_pick_box {display:inline-block; vertical-align:middle; position:relative; width: 270px;} .dw_hdbx .pick_now {position: relative;} .dw_hdbx .pick_now h3 {position:relative; /*font-family: 'Noto Sans KR';*/ font-weight: normal; letter-spacing: 0em; font-size:13px; line-height:35px; padding:0 20px; background:var(--pick_h3_bg); color:var(--pick_h3); border-radius:3px; cursor:pointer; overflow:hidden;} .dw_hdbx .pick_now h3 i {position:absolute; top:50%; right:15px; transform:translateY(-50%); color:var(--pick_h3_icon); font-size:15px;} .dw_hdbx .pick_now h3 em {position:absolute; top:0; left:0; background: var(--bg_sck_tab_on); color:#fff; line-height: 35px; font-family:NanumBarunGothic, sans-serif; font-weight:normal;letter-spacing:0;font-size:11px; padding:0 15px; font-style: normal; display:none;} .dw_hdbx .pick_list {position:absolute; top:35px; left:0; width:100%; visibility: hidden; opacity: 0; transition: all .3s; background: var(--bg_menu_sel_list); z-index:5; border-radius:7px; overflow:hidden;} .dw_hdbx .pick_list.show {opacity: 1; top: 40px; visibility: visible;} .dw_hdbx .pl_wrp {position:relative; max-height:300px; height:auto; } .dw_hdbx .pl_wrp {overflow-y:overlay;} .dw_hdbx .pl_wrp:: {-ms-overflow-style: none;} .dw_hdbx .pl_wrp::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .dw_hdbx .pl_wrp::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .dw_hdbx ul.sel_group {position:relative; padding:20px; counter-reset:li;transition:all .3s; border-top: 1px dashed var(--bg_menu_line);} .dw_hdbx ul.sel_group:first-child {border:0;} .dw_hdbx ul.sel_group li {display:inline-block; width:100%; font-size:12px; position:relative; color:var(--bg_menu_company);} .dw_hdbx ul.sel_group li:hover {color:var(--bg_menu_company_hover);} .dw_hdbx ul.sel_group li.area {padding:0 0 5px 0;} .dw_hdbx ul.sel_group li.area > h4 {display:inline-block; vertical-align:middle; position:relative; width:100%; font-size:13px; color:var(--bg_menu_area); font-weight: normal;transition:all .3s;} .dw_hdbx ul.sel_group li.nm {cursor:pointer;} .dw_hdbx ul.sel_group li.nm:before {content:counter(li)"."; counter-increment:li; display:inline-block; padding-right:3px; color:#777; font-family:tahoma;} .dw_hdbx ul.sel_group li > em {position:absolute; top:50%; right:0; transform:translateY(-50%); width:4px; height:4px; border-radius:100%;} .dw_hdbx ul.sel_group li:hover > span {color:var(--bg_menu_company_hover); transition: all .3s;} @media screen and (max-width: 1800px){ .dw_hdbx {width:100%;} } /* 정렬방식 */ .sort_box {position:relative; font-size:0; text-align:left; padding:35px 35px 0 35px; margin-bottom:-25px; z-index:10;} .sort_box.map {} ul.sort_list {display:inline-block; vertical-align:middle; width:50%; text-align:right;font-size:0;} ul.sort_list li {display:inline-block; vertical-align:middle;} ul.sort_list li.on {} ul.sort_list li a {display:block; padding:0px 15px; border-right:1px solid var(--bg_sort_menu_line); line-height: 30px; transition:all .3s;} ul.sort_list li:last-child a {border:0;} ul.sort_list li.on a {background:var(--bg_sort_menu_on); border-radius:35px;padding:0px 10px 0px 17px; border:0; transition:all .3s;} ul.sort_list li a span, ul.sort_list li a i {display:inline-block; vertical-align:middle; line-height:100%;} ul.sort_list li a span {font-size:11px; color:var(--bg_sort_menu); letter-spacing:-0.05em; transition:all .3s;} ul.sort_list li a i {font-size:15px; color:var(--bg_sort_menu_icon); padding-left:5px; display:none; transition:all .3s;} ul.sort_list li.on a span {color:#fff;} ul.sort_list li.on a i {color:#fff; display:inline-block;} /* 업체별 기본 정렬 */ ul.care_box {position:relative; font-size:0;} ul.care_box.short {} ul.care_box.onlyone {} ul.care_box > li {display:inline-block; vertical-align:top; width:calc(16.6666% - 6px); margin:3px; background:var(--bg_sta_box); border:0px solid #b8c4cf !important; border-radius:10px; overflow:hidden; transition:all .3s;} ul.care_box > li:hover {border-color:#5494cf;} ul.care_box > li.warning1 {background:var(--bg_sta_warn1); border:1px solid #c54a36; transition: all .3s;} ul.care_box > li.warning2 {background:var(--bg_sta_warn2); border:1px solid #b5a704; transition: all .3s;} ul.care_box > li.warning3 {background:var(--bg_sta_warn3); border:1px solid #b99f61; transition: all .3s;} ul.care_box > li.stop {background:var(--bg_sta_stop); border:1px solid #bfbfbf; transition: all .3s;} ul.care_box.onlyone > li {width:100% !important; margin:0 !important;} ul.care_box > li a {position:absolute; top:0; left:0; width:100%; height:100%;} ul.care_box > li a i {position:absolute; top:50%; right:25px; transform:translateY(-50%); font-size:20px; color:var(--bg_sta_box_head_arrow); opacity:0; transition:all .3s;} ul.care_box > li .cb_head {position:relative; background:var(--bg_sta_box_head); padding:25px; transition:all .3s;} ul.care_box > li .cb_head:hover {background:var(--bg_sta_box_head_hover); transition: all .3s;} ul.care_box > li .cb_head:hover a i {right:15px; opacity:1;} ul.care_box > li .cb_head h3, ul.care_box > li .cb_head p {display:inline-block; width:100%; line-height:100%; font-weight:normal; transition:all .3s;} ul.care_box > li .cb_head h3 {font-size:16px; font-family: 'Noto Sans KR';font-weight: 700;letter-spacing: -0.05em;color:var(--bg_sta_box_head_h3);transition:all .3s;text-overflow: ellipsis; white-space: nowrap; overflow:hidden;} ul.care_box > li .cb_head p {font-size:13px; font-family: 'GmSansB';;padding-top:7px; /*font-weight:bold;*/ color:var(--bg_sta_box_head_p); transition: all .3s;} ul.care_box > li .cb_head p span {font-size:11px;font-weight:normal; color:var(--bg_sta_box_head_span); transition: all .3s;font-family:tahoma;} ul.care_box > li .cb_head p em {display:inline-block; background:#333; color:#fff; font-style:normal; font-size:11px; padding:2px 4px; border-radius:3px; margin-right:5px; display:none;} ul.care_box > li .cb_head > span {position:absolute; top:15px; right:15px; font-size:11px; padding:1px 4px; border-radius:3px; display:none;transform:translateY(0%); transition:all .3s;} ul.care_box > li .cb_head:hover > span {transform:translateY(-35%); opacity:0;} ul.care_box > li .cb_head:hover h3 {color:var(--bg_sta_box_head_h3_hover); transition: all .3s;} ul.care_box > li .cb_head:hover p {color:var(--bg_sta_box_head_p_hover); transition: all .3s;} ul.care_box > li .cb_rest {position:relative; font-size:0;} ul.care_box > li .cb_rest > div {display:inline-block; vertical-align:top; position:relative;} ul.care_box > li .cb_rest .basic {position:absolute; top:0; left:0; height:100%;width:100px; border-top:1px solid #eee; } ul.care_box > li .cb_rest .basic:after {/*content:""; display:block; padding-top:100%;*/} ul.care_box > li .cb_rest .basic .bs_wrp {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%;} ul.care_box > li .cb_rest .basic .bs_wrp h4, ul.care_box > li .cb_rest .basic .bs_wrp p {display:inline-block; width:100%; line-height:100%; text-align:center; position:relative;} ul.care_box > li .cb_rest .basic .bs_wrp h4 {font-size:11px; letter-spacing:-0.05em; color:var(--bg_sta_box_bs_wrp_h4); font-weight:normal;transition:all .3s;} ul.care_box > li .cb_rest .basic .bs_wrp p {font-size:20px; font-family: 'GmSansB';padding-bottom:10px; color:#0089db;} ul.care_box > li .cb_rest .basic .bs_wrp p span {font-size:11px;font-weight:normal; display:inline-block; color:var(--bg_sta_box_bs_wrp_span); padding-bottom:5px; width:100%; transition: all .3s; line-height:100%;font-family:tahoma;} ul.care_box > li .cb_rest .other {width:100%; padding-left:100px; } ul.care_box > li .cb_rest .other ul.rinfo {position:relative; font-size:0; } ul.care_box > li .cb_rest .other ul.rinfo li {display:inline-block; vertical-align:top; width:50%; padding:15px; border:1px solid #eee; border-width:1px 0 0 1px; position:relative;} ul.care_box > li .cb_rest .other ul.rinfo li h4, ul.care_box > li .cb_rest .other ul.rinfo li p {display:inline-block; width:100%; line-height:100%;} ul.care_box > li .cb_rest .other ul.rinfo li h4 {font-size:11px; letter-spacing:-0.05em; font-weight:normal; color:#999;} ul.care_box > li .cb_rest .other ul.rinfo li p {font-size:15px; padding-top:7px; color:var(--bg_sta_box_other_p); font-family: 'GmSansB';} ul.care_box > li .cb_rest .other ul.rinfo li p span {font-size:10px;font-weight:normal; position:absolute; bottom:13px; right:10px; display:inline-block; color:var(--bg_sta_box_other_span);transition:all .3s;font-family:tahoma;} ul.care_box > li .cb_rest .basic, ul.care_box > li .cb_rest .other ul.rinfo li {border-color:var(--bg_sta_box_line);transition:all .3s;} ul.care_box > li.warning1 a i {color:#fff;} ul.care_box > li.warning1 .cb_head {background:var(--bg_sta_box_warn_head); transition: all .3s;} ul.care_box > li.warning1 .cb_head:hover {background:var(--bg_sta_box_warn_head_hover); transition: all .3s;} ul.care_box > li.warning1 .cb_head h3 {color:#fff;} ul.care_box > li.warning1 .cb_head p {color:#fff;} ul.care_box > li.warning1 .cb_head p span {color:rgba(255,255,255,0.55);} ul.care_box > li.warning1 .cb_head p em {background:#d70000;} ul.care_box > li.warning1 .cb_head > span {display:block; background:rgba(0,0,0,0.3); color:rgba(255,255,255,0.85);} ul.care_box > li.warning1 .cb_rest .basic .bs_wrp h4 {color:var(--bg_sta_box_warn_bs_wrp_h4); transition: all .3s;} ul.care_box > li.warning1 .cb_rest .basic .bs_wrp p {color:var(--bg_sta_box_warn_bs_wrp_p); transition: all .3s;} ul.care_box > li.warning1 .cb_rest .basic .bs_wrp p span {color:var(--bg_sta_box_warn_bs_wrp_span); transition: all .3s;} ul.care_box > li.warning1 .cb_rest .other ul.rinfo li h4 {color:var(--bg_sta_box_warn_other_h4); transition: all .3s;} ul.care_box > li.warning1 .cb_rest .other ul.rinfo li p {color:var(--bg_sta_box_warn_other_p); transition: all .3s;} ul.care_box > li.warning1 .cb_rest .other ul.rinfo li p span {color:var(--bg_sta_box_warn_other_span); transition: all .3s;} ul.care_box > li.warning1 .cb_rest .basic, ul.care_box > li.warning1 .cb_rest .other ul.rinfo li {border-color:var(--bg_sta_warn1_line); transition: all .3s;} ul.care_box > li.warning2 a i {color:#fff;} ul.care_box > li.warning2 .cb_head {background:var(--bg_sta_box_warn_head); transition: all .3s;} ul.care_box > li.warning2 .cb_head:hover {background:var(--bg_sta_box_warn_head_hover); transition: all .3s;} ul.care_box > li.warning2 .cb_head h3 {color:#fff;} ul.care_box > li.warning2 .cb_head p {color:#fff;} ul.care_box > li.warning2 .cb_head p span {color:rgba(255,255,255,0.55);} ul.care_box > li.warning2 .cb_head p em {background:#d70000;} ul.care_box > li.warning2 .cb_head > span {display:block; background:rgba(0,0,0,0.3); color:rgba(255,255,255,0.85);} ul.care_box > li.warning2 .cb_rest .basic .bs_wrp h4 {color:var(--bg_sta_box_warn_bs_wrp_h4); transition: all .3s;} ul.care_box > li.warning2 .cb_rest .basic .bs_wrp p {color:var(--bg_sta_box_warn_bs_wrp_p); transition: all .3s;} ul.care_box > li.warning2 .cb_rest .basic .bs_wrp p span {color:var(--bg_sta_box_warn_bs_wrp_span); transition: all .3s;} ul.care_box > li.warning2 .cb_rest .other ul.rinfo li h4 {color:var(--bg_sta_box_warn_other_h4); transition: all .3s;} ul.care_box > li.warning2 .cb_rest .other ul.rinfo li p {color:var(--bg_sta_box_warn_other_p); transition: all .3s;} ul.care_box > li.warning2 .cb_rest .other ul.rinfo li p span {color:var(--bg_sta_box_warn_other_span); transition: all .3s;} ul.care_box > li.warning2 .cb_rest .basic, ul.care_box > li.warning2 .cb_rest .other ul.rinfo li {border-color:var(--bg_sta_warn2_line); transition: all .3s;} ul.care_box > li.warning3 a i {color:#fff;} ul.care_box > li.warning3 .cb_head {background:var(--bg_sta_box_warn_head); transition: all .3s;} ul.care_box > li.warning3 .cb_head:hover {background:var(--bg_sta_box_warn_head_hover); transition: all .3s;} ul.care_box > li.warning3 .cb_head h3 {color:#fff;} ul.care_box > li.warning3 .cb_head p {color:#fff;} ul.care_box > li.warning3 .cb_head p span {color:rgba(255,255,255,0.55);} ul.care_box > li.warning3 .cb_head p em {background:#695118;} ul.care_box > li.warning3 .cb_head > span {display:block; background:rgba(0,0,0,0.3); color:rgba(255,255,255,0.85);} ul.care_box > li.warning3 .cb_rest .basic .bs_wrp h4 {color:var(--bg_sta_box_warn_bs_wrp_h4); transition: all .3s;} ul.care_box > li.warning3 .cb_rest .basic .bs_wrp p {color:var(--bg_sta_box_warn_bs_wrp_p); transition: all .3s;} ul.care_box > li.warning3 .cb_rest .basic .bs_wrp p span {color:var(--bg_sta_box_warn_bs_wrp_span); transition: all .3s;} ul.care_box > li.warning3 .cb_rest .other ul.rinfo li h4 {color:var(--bg_sta_box_warn_other_h4); transition: all .3s;} ul.care_box > li.warning3 .cb_rest .other ul.rinfo li p {color:var(--bg_sta_box_warn_other_p); transition: all .3s;} ul.care_box > li.warning3 .cb_rest .other ul.rinfo li p span {color:var(--bg_sta_box_warn_other_span); transition: all .3s;} ul.care_box > li.warning3 .cb_rest .basic, ul.care_box > li.warning3 .cb_rest .other ul.rinfo li {border-color:var(--bg_sta_warn3_line); transition: all .3s;} ul.care_box > li.stop .cb_head {background:var(--bg_sta_box_stop_head); transition: all .3s;} ul.care_box > li.stop .cb_head:hover {background:var(--bg_sta_box_stop_head_hover); transition: all .3s;} ul.care_box > li.stop .cb_head h3 {color:var(--bg_sta_box_stop_head_h3); transition: all .3s;} ul.care_box > li.stop .cb_head p {color:var(--bg_sta_box_stop_head_p); transition: all .3s;} ul.care_box > li.stop .cb_head p span {color:var(--bg_sta_box_stop_head_span); transition: all .3s;} ul.care_box > li.stop .cb_head p em {background:#695118;} ul.care_box > li.stop .cb_head > span {display:block;background:red; color:rgba(255,255,255,1);} ul.care_box > li.stop .cb_rest .basic .bs_wrp p {color:#000;} ul.care_box > li.stop .cb_rest .basic .bs_wrp h4 {color:var(--bg_sta_box_stop_bs_wrp_h4); transition: all .3s;} ul.care_box > li.stop .cb_rest .basic .bs_wrp p {color:var(--bg_sta_box_stop_bs_wrp_p); transition: all .3s;} ul.care_box > li.stop .cb_rest .basic .bs_wrp p span {color:var(--bg_sta_box_stop_bs_wrp_span); transition: all .3s;} ul.care_box > li.stop .cb_rest .other ul.rinfo li h4 {color:#999;} ul.care_box > li.stop .cb_rest .other ul.rinfo li p {color:var(--bg_sta_box_stop_other_p); transition: all .3s;} ul.care_box > li.stop .cb_rest .other ul.rinfo li p span {color:var(--bg_sta_box_stop_other_span); transition: all .3s;} ul.care_box > li.stop .cb_rest .basic, ul.care_box > li.stop .cb_rest .other ul.rinfo li {border-color:var(--bg_sta_stop_line); transition: all .3s;} ul.area_pick_info {position:relative; font-size: 0; padding:5px 0 10px 15px;} ul.area_pick_info li {display: inline-block; vertical-align:middle; } ul.area_pick_info li span {display: inline-block; vertical-align:middle; line-height: 100%;} ul.area_pick_info li .bc_tit {font-size: 13px; color:var(--total_info_tit); transition: all .3s; } ul.area_pick_info li .bc_num {font-size: 13px; color:var(--total_info_cnt); transition: all .3s; padding-left:10px;} ul.area_pick_info li .bc_num em {display:inline-block; padding-left:3px; font-size: 11px; color:var(--total_info_em); font-style: normal; transition: all .3s;} @media screen and (max-width: 2500px){ ul.care_box > li {width:calc(20% - 6px);} } @media screen and (max-width: 2150px){ ul.care_box > li {width:calc(20% - 6px);} ul.care_box > li .cb_head {padding:15px;} ul.care_box > li .cb_rest .other ul.rinfo li {padding:10px 15px;} } @media screen and (max-width: 1800px){ ul.care_box > li {width:calc(33.3333% - 6px);} } @media screen and (max-width: 1500px){ ul.care_box > li {width:calc(50% - 6px);} } /* 좌메뉴 정렬 / 리스트그룹 */ ul.site_sort {position:relative; display:flex; background:var(--bg_menu);transition:all .3s;} ul.site_sort li {flex:1; font-size:13px; height:50px; line-height:50px; font-weight:bold; color:var(--bg_menu_txt); text-align:center; cursor:pointer;transition:all .3s;} ul.site_sort li.on {background:var(--bg_menu_on); color:var(--bg_menu_txt_on);transition:all .3s;} .area_contact {position:relative; display:inline-block; vertical-align:middle; } .area_contact h2 {display:none;} .area_all {display:none;} .site_li {position:relative; height:calc(100% - 40px); overflow-y:overlay; transition:all .3s; z-index:100;} .site_li.show {} .site_li:: {-ms-overflow-style: none;} .site_li::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .site_li::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .site_total {position:relative; height:40px; background:var(--bg_menu);transition:all .3s;} .site_total span {position:absolute; top:50%; transform:translateY(-50%); font-size:11px; color:#333; } .site_total span.tit {left:25px; color:var(--txt_total); transition: all .3s;} .site_total span.cnt {right:25px; color:var(--txt_total_cnt); transition: all .3s;} .site_li ul.site_group:last-child {border-bottom:0 !important;} ul.site_group {position:relative; padding:0 0 25px 0; background:var(--bg_menu_list); border-bottom:1px dashed var(--bg_menu_line);counter-reset:li;transition:all .3s;} ul.site_group li {display:inline-block; width:100%; font-size:0; position:relative;} ul.site_group li.area {padding:25px 25 10px 25;} ul.site_group li.all_marker { cursor: pointer; padding-bottom:0;} ul.site_group li.area > h3 {display:inline-block; vertical-align:middle; position:relative; width:100%; font-size:15px; color:var(--bg_menu_area);font-family: 'Noto Sans KR';font-weight: 500;letter-spacing: -0.05em;transition:all .3s;} ul.site_group li.area > h3 span {font-size:11px; display:inline-block; background:#333; min-width:15px; height:15px; line-height:15px; color:#fff; border-radius:3px; text-align:center; margin-right:5px; font-weight:normal; display:none;} ul.site_group li.area > .check {position:absolute; top:25px; right:15px; font-size:0;} ul.site_group li.area > .check span {display:inline-block; vertical-align:middle; width:15px; height:15px; line-height:15px; margin-left:3px; font-family:arial; font-size:11px; text-align:center; border-radius:100%;} ul.site_group li.area > .check span:first-child {margin:0;} ul.site_group li a {display:block; position:relative; padding:4px 25px;} ul.site_group li a > span {display:inline-block; width:100%; position:relative; font-size:15px; /*font-family: 'Noto Sans KR';font-weight: 500;letter-spacing: -0.05em;*/ color:var(--bg_menu_company); padding:0 10px 0 13px; text-indent:-7px;transition:all .3s;} ul.site_group li a > span:before {content:counter(li)"."; counter-increment:li; display:inline-block; padding-right:3px; color:#999; font-family:tahoma; font-size:12px; } ul.site_group li a > em {position:absolute; top:13px; right:22px; /*transform:translateY(-50%);*/ width:4px; height:4px; border-radius:100%;} ul.site_group li a:hover > span {color:var(--bg_menu_company_hover); transition: all .3s;} ul.site_group li.on a > span {color:var(--bg_menu_company_on);transition:all .3s;} .grp_bg1 {color:#fff; background:#c54a36;} .grp_bg2 {color:#fff; background:#cdc136;} .grp_bg3 {color:#fff; background:#b99f61;} .grp_bg4 {color:#fff; background:#e7e7e7;} /* 그래프리스트 */ ul.site_graph {position:relative; font-size:0;} ul.site_graph.onlyone {} ul.site_graph li {display:inline-block; vertical-align:top; width:calc(20% - 6px); margin:3; font-size:0; background:var(--bg_site_graph); border:0px solid #eee; border-radius:10px; overflow:hidden; position:relative; text-align:right;} ul.site_graph li.warning1 {background:var(--bg_site_graph_wrn1);} ul.site_graph li.warning2 {background:var(--bg_site_graph_wrn3);} ul.site_graph li.warning3 {background:var(--bg_site_graph_wrn2);} ul.site_graph li.stop {background:var(--bg_site_graph_stop);} ul.site_graph li:hover {border:0px solid #999; } ul.site_graph.onlyone li {width:100% !important; margin:0 !important;} ul.site_graph li .sg_info, ul.site_graph li .sg_gra {display:inline-block; vertical-align:middle;} ul.site_graph li .sg_info {position:relative; width:100%; background:var(--bg_site); text-align:left; padding:25px; transition:all .3s;} ul.site_graph li .sg_info:hover {/*padding-left:35px;*/} ul.site_graph li .sg_info a {position:absolute; top:0; left:0; width:100%; height:100%; z-index:1;} ul.site_graph li .sg_info a i {position:absolute; top:50%; right:45px; transform:translateY(-50%); font-size:20px; opacity:0; color:var(--bg_site_arrow);; transition:all .3s;} ul.site_graph li .sg_info a:hover i {right:35px; opacity:1;} ul.site_graph li .sg_info h3, ul.site_graph li .sg_info p, ul.site_graph li .sg_info .sta {display:inline-block; width:100%;} ul.site_graph li .sg_info h3 {font-size:15px; color:var(--bg_site_name); font-family:'Noto Sans KR';font-weight: 500;letter-spacing: -0.05em;} ul.site_graph li .sg_info p {font-size:12px; padding-top:5px; font-family:tahoma; color:#00729f; font-weight:bold;} ul.site_graph li .sg_info p span {font-size:11px; color:#999; font-weight:normal; display:inline-block; padding-left:3px;} ul.site_graph li .sg_info .sta {font-size:0; position:absolute; top:50%; right:25px; width:auto;transform:translate(0, -50%); transition:all .3s;} ul.site_graph li .sg_info:hover .sta {transform:translate(100%, -50%);; opacity:0;} ul.site_graph li .sg_info .sta span {display:inline-block; vertical-align:middle;} ul.site_graph li .sg_info .sta .tit {font-size:12px;background: #fff; border: 1px solid #eee; padding: 5px 7px; line-height: 100%; border-radius: 3px; display: none;} ul.site_graph li .sg_info .sta .icon {font-size:25px; padding-left:5px;} ul.site_graph li .sg_info .sta .icon.st1 {color:red;} ul.site_graph li .sg_info .sta .icon.st2 {color:red;} ul.site_graph li .sg_info .sta .icon.st3 {color:#555;} ul.site_graph li .sg_info .sta .icon.st4 {color:orange;} ul.site_graph li .sg_gra {width:100%; padding:25px 15px;} ul.site_graph li .sg_gra .graph_call {position:relative; height:200px;} ul.site_graph li .sg_gra canvas {display:inline-block !important; width:100% !important; height:auto !important; background:transparent !important;} ul.site_graph li.warning1 .sg_info {background:var(--bg_site_wrn1);} ul.site_graph li.warning2 .sg_info {background:var(--bg_site_wrn3);} ul.site_graph li.warning3 .sg_info {background:var(--bg_site_wrn2);} ul.site_graph li.stop .sg_info {background:var(--bg_site_stop);} @media screen and (max-width: 2500px){ ul.site_graph li {width:calc(25% - 6px);} } @media screen and (max-width: 1920px){ ul.site_graph li {width:calc(33.3333% - 6px);} } @media screen and (max-width: 1450px){ ul.site_graph li {width:calc(50% - 6px);} } /* 전국지도 */ .site_marker {position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; width:100%; height:100%;} .site_marker ul.view_kind {} .site_marker ul.view_kind li a {background: var(--kind_menu_bg_strong);} .site_marker ul.view_kind li.on a {background: var(--kind_menu_bg_strong_on);} .site_marker ul.st_status {position:absolute; top:90px; left:45px; width:50px; z-index:10;} .site_marker ul.st_status li {display:inline-block; vertical-align:middle; width:100%; color:var(--st_status_txt); font-size:12px;padding:3px 0;} .site_marker ul.st_status li span {display:inline-block; vertical-align:middle; width:15px; height:15px; border-radius:100%;} .mk_bg_0 {background:#2d77bd} .mk_bg_1 {background:#f37021} .mk_bg_2 {background:#e81e25} /* warning pop */ .warning_pop {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.6); visibility: hidden; backdrop-filter: blur(var(--blur_fileter)); opacity: 0; transition: all .3s; z-index:100000;} .warning_pop.show {opacity: 1; visibility: visible; } .warning_pop .real_msg {position:absolute; top:15px; right:15px; transform:translateX(100%); max-width:470px; width:calc(100% - 30px); height:calc(100% - 30px); overflow:hidden; opacity: 0; transition: all .3s; border-radius:15px;} .warning_pop.show .real_msg {transform:translateX(0); opacity: 1; } .warning_pop .real_msg .count_box {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:120px;font-family: 'GmSansB'; color:var(--biw_div); opacity:0.03; line-height:100%;} .warning_pop .real_msg .head_ar {position:relative; top:0; left:0; width: 100%; height: 140px; background:var(--warn_pop_head); border-bottom:1px solid var(--warn_pop_head_line); padding:35px; transition: all .3s;} .warning_pop .real_msg .head_ar .ha_w {position:relative; } .warning_pop .real_msg .head_ar h3 {display:inline-block; width:100%; font-size:18px; font-family: 'Noto Sans KR'; font-weight: 500; letter-spacing: -0.05em; color:var(--warn_pop_head_h3); transition: all .3s;} .warning_pop .real_msg .head_ar i {position:absolute; top:-15px; right:-10px; font-size:20px; cursor:pointer; color:var(--warn_pop_i); transition: all .3s; transform:rotate(0deg); z-index:1;} .warning_pop .real_msg .head_ar i:hover { transform:rotate(270deg);} .warning_pop .real_msg .head_ar p {display:inline-block; width:100%; padding:15px 0 0 0; font-size:11px; line-height:155%; color:var(--warn_pop_head_p); transition: all .3s;} .real_msg .content {position:relative; height: calc(100% - 205px); padding:0 0 35px 0; background:var(--warn_pop_content); transition: all .3s;} .real_msg .content {overflow-y:overlay;} .real_msg .content:: {-ms-overflow-style: none;} .real_msg .content::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .real_msg .content::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .real_msg ul.wrn_kind {position:relative; display:flex; padding:0;} .real_msg ul.wrn_kind li {flex:1; margin:0; border:1px solid var(--warn_pop_sta_line); border-width:0 1px 1px 0; position:relative;background:var(--warn_pop_sta_bg); transition: all .3s;} .real_msg ul.wrn_kind li:last-child {border-width:0 0 1px 0;} .real_msg ul.wrn_kind li:after {content:""; display: block; padding-top: 100%; } .real_msg ul.wrn_kind li .wr {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); } .real_msg ul.wrn_kind li i, .real_msg ul.wrn_kind li p, .real_msg ul.wrn_kind li span {display:inline-block; text-align:center; width:100%;} .real_msg ul.wrn_kind li i {font-size:15px;} .real_msg ul.wrn_kind li.wtp1 i {color:red;} .real_msg ul.wrn_kind li.wtp2 i {color:#c57800;} .real_msg ul.wrn_kind li.wtp3 i {color:#dbc344;} .real_msg ul.wrn_kind li.wtp4 i {color:#587c97;} .real_msg ul.wrn_kind li p {font-size:12px;padding: 4px 0 3px 0; color:var(--warn_pop_sta_tit); transition: all .3s;} .real_msg ul.wrn_kind li span {font-size:15px; font-weight:bold; color:var(--warn_pop_sta_cnt); font-family:tahoma; transition: all .3s;} .real_msg ul.wrn_kind li span em {font-size:12px; font-style:normal; color:#999; display:inline-block; padding-left:3px; display:none;} .real_msg h4 {font-size:13px; font-style:normal; color:var(--warn_pop_ment); display:inline-block; width:100%; margin-top:30px; padding:0 35px; font-weight:normal; position:relative; transition: all .3s;} .real_msg h4 span {color:var(--warn_pop_ment_cnt); transition: all .3s;} .real_msg h4 em {position:absolute; top:50%; right:35px; transform:translateY(-50%); font-style:normal; font-size:11px; color:var(--warn_pop_fail_cnt);} .real_msg ul.wrn_msg {position:relative; padding:15px 35px 0 35px; z-index:1; background:transparent;} .real_msg ul.wrn_msg li {display:inline-block; width:100%; border:0px solid #eee; border-radius:7px; padding:5px 0;position:relative;} .real_msg ul.wrn_msg li i, .real_msg ul.wrn_msg li p, .real_msg ul.wrn_msg li span {display:inline-block;} .real_msg ul.wrn_msg li i {position:absolute; top:50%; left:3px; transform:translateY(-50%); font-size:15px;} .real_msg ul.wrn_msg li.wtp1 i {color:red;} .real_msg ul.wrn_msg li.wtp2 i {color:#c57800;} .real_msg ul.wrn_msg li.wtp3 i {color:#dbc344;} .real_msg ul.wrn_msg li.wtp4 i {color:#587c97;} .real_msg ul.wrn_msg li p {font-size:12px; width:100%; text-align:left; padding-left:25px; color:var(--warn_pop_list); transition: all .3s;} .real_msg ul.wrn_msg li span {position:absolute; top:50%; right:0px; transform:translateY(-50%); font-size:11px; color:var(--warn_pop_list_date); font-family:tahoma; transition: all .3s;} .real_msg ul.wrn_btn_set {position:relative; display:flex;} .real_msg ul.wrn_btn_set li {flex:1;height: 65px; position:relative;} .real_msg ul.wrn_btn_set li a {display:block; position:absolute; top:0; left:0; width:100%; height:100%;} .real_msg ul.wrn_btn_set li a span {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);color:#fff; font-size:13px; text-align:center; width:100%;} .real_msg ul.wrn_btn_set li.ok a {background:#1a4f7c;} .real_msg ul.wrn_btn_set li.go a {background:#ad2c2c;} /* 알람코드 pop */ .code_pop {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.6); visibility: hidden; backdrop-filter: blur(var(--blur_fileter));opacity: 0; transition: all .3s; z-index:100000;} .code_pop.show {opacity: 1; visibility: visible; } .code_pop .cp_msg {position:absolute; top:15px; right:15px; transform:translateX(100%); max-width:470px; width:calc(100% - 30px); height:calc(100% - 30px); overflow:hidden; opacity: 0; transition: all .3s; border-radius:15px;} .code_pop.show .cp_msg {transform:translateX(0); opacity: 1; } .code_pop .cp_msg .head_ar {position:relative; top:0; left:0; width: 100%; height: 60px; background:var(--warn_pop_head); border-bottom:1px solid var(--warn_pop_head_line); padding:35px; transition: all .3s;} .code_pop .cp_msg .head_ar .ha_w {position: absolute; top:50%; left:0; transform:translateY(-50%); width: 100%;} .code_pop .cp_msg .head_ar h3 {display:inline-block; width:100%; font-size:15px; font-family: 'Noto Sans KR'; font-weight: 500; letter-spacing: -0.05em; color:var(--warn_pop_head_h3); transition: all .3s; padding-left: 30px;} .code_pop .cp_msg .head_ar i {position:absolute; top:50%; right:20px; transform:translateY(-50%) rotate(0deg); font-size:20px; cursor:pointer; color:var(--warn_pop_i); transition: all .3s; z-index:1;} .code_pop .cp_msg .head_ar i:hover { transform:translateY(-50%) rotate(270deg);} .cp_msg .content {position:relative; height: calc(100% - 60px); padding:25px; background:var(--warn_pop_content); transition: all .3s;} .cp_msg .content {overflow-y:overlay;} .cp_msg .content:: {-ms-overflow-style: none;} .cp_msg .content::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .cp_msg .content::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .cp_msg .content h4 {font-size:13px; font-style:normal; color:var(--warn_pop_ment); display:inline-block; width:100%; margin-bottom:10px; font-weight:normal; position:relative; transition: all .3s;} .cp_msg .content h4 span {color:var(--warn_pop_ment_cnt); transition: all .3s;} /* 그래프 요약 */ .total_info {position: relative; font-size: 0; margin:0px 0 15px 0;} .total_info ul.bd_cnt, .total_info ul.bd_color {display: inline-block; vertical-align: bottom; font-size: 0; } .total_info ul.bd_cnt {width:550px;} .total_info ul.bd_color {width:100%; text-align: right; padding-right:15px;} .total_info ul.bd_cnt li {display: inline-block; vertical-align:middle; width:25%; border-left: 0px solid rgba(0,0,0,0.06); padding-left: 15px;} .total_info ul.bd_cnt li span {display: inline-block; vertical-align:middle; line-height: 100%;} .total_info ul.bd_cnt li .bc_tit {width:80px; font-size: 12px; color:var(--total_info_tit); transition: all .3s;} .total_info ul.bd_cnt li .bc_num {width:calc(100% - 0px); font-size: 15px; color:var(--total_info_cnt); padding-top: 7px; transition: all .3s;} .total_info ul.bd_cnt li .bc_num em {display:inline-block; padding-left:3px; font-size: 11px; color:var(--total_info_em); font-style: normal; transition: all .3s;} .total_info ul.bd_color li {display: inline-block; vertical-align:middle; border-left: 3px solid red; text-align: center; padding-left:5px; line-height: 100%; margin-left:25px; } .total_info ul.bd_color li.normal {border-color: #1c86e7;} .total_info ul.bd_color li.warning {border-color: #d64c4c;} .total_info ul.bd_color li.stop {border-color: #8e8e8e;} .total_info ul.bd_color li span {display: inline-block; vertical-align:middle; line-height: 100%; border: 0px solid red;} .total_info ul.bd_color li .bc_t {font-size: 12px; color:var(--grp_info_tit); transition: all .3s;} .total_info ul.bd_color li .bc_n {font-size: 12px; color:var(--grp_info_cnt); padding-left:5px; font-family: tahoma; transition: all .3s;} /* 사이트요약정보 */ .short_client {position:absolute; top:0; left:0; width:100%; height:100%; border-radius:0; overflow:hidden; background:var(--dash_bg_color);transition: all .3s;} .short_client .sht_info {position:absolute; top:0; left:0; width:550px; height:100%; background:var(--bar_group_bg1); /*border-radius:var(--dash_radius);*/} .short_client .sht_info {overflow-y:overlay;} .short_client .sht_info:: {-ms-overflow-style: none;} .short_client .sht_info::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .short_client .sht_info::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .short_client .sht_map {position:absolute; top:0; right:0; width:calc(100% - 550px); height:100%; } ul.onlyone {position:relative; font-size:0;} ul.onlyone > li {display:inline-block; vertical-align:top; width:100%; border:0px solid #b8c4cf !important; border-radius:0; overflow:hidden; transition:all .3s;} ul.onlyone > li.warning1 {background:#c54a36; border:1px solid #c54a36;} ul.onlyone > li.warning2 {background:#cdc136; border:1px solid #b5a704;} ul.onlyone > li.warning3 {background:#b99f61; border:1px solid #b99f61;} ul.onlyone > li.stop {background:#fff4f4; border:1px solid #bfbfbf;} ul.onlyone > li a {position:absolute; top:0; left:0; width:100%; height:100%;} ul.onlyone > li a i {position:absolute; top:50%; right:25px; transform:translateY(-50%); font-size:20px; color:var(--bg_site_sh_arrow); opacity:0; transition:all .3s;} ul.onlyone > li .cb_head {position:relative; background:var(--bg_site_sh_head); padding:35px; transition:all .3s;} ul.onlyone > li .cb_head:hover {background:var(--bg_site_sh_head_hover);} ul.onlyone > li .cb_head:hover a i {right:15px; opacity:1;} ul.onlyone > li .cb_head h3, ul.onlyone > li .cb_head p, ul.onlyone > li .cb_head address {display:inline-block; width:100%; line-height:100%; font-weight:normal; transition:all .3s;} ul.onlyone > li .cb_head tel {display:inline-block; width:100%; line-height:100%; font-weight:normal; transition:all .3s;} ul.onlyone > li .cb_head h3 {font-size:18px; color:var(--bg_site_sh_h3);font-family: 'Noto Sans KR';font-weight: 700;letter-spacing: -0.05em;} ul.onlyone > li .cb_head p {font-size:13px; font-family:'GmSansB';padding-top:7px; /*font-weight:bold;*/ color:var(--bg_site_sh_p);} ul.onlyone > li .cb_head p span {font-size:11px;font-family:tahoma; font-weight:normal; color:var(--bg_site_sh_span);transition:all .3s;} ul.onlyone > li .cb_head p em {display:inline-block; background:#333; color:#fff; font-style:normal; font-size:11px; padding:2px 4px; border-radius:3px; margin-right:5px; display:none;} ul.onlyone > li .cb_head > span {position:absolute; top:15px; right:15px; font-size:11px; padding:1px 4px; border-radius:3px; color:#fff; transform:translateY(0%); transition:all .3s;} ul.onlyone > li .cb_head:hover > span {transform:translateY(-35%); opacity:0;} ul.onlyone > li .cb_head:hover h3 {color:var(--bg_site_sh_h3_hover);transition:all .3s;} ul.onlyone > li .cb_head:hover p {color:var(--bg_site_sh_p_hover);transition:all .3s;} ul.onlyone > li .cb_head > span.warn1 {background:red;} ul.onlyone > li .cb_head > span.warn2 {background:red;} ul.onlyone > li .cb_head > span.warn3 {background:red;} ul.onlyone > li .cb_head > span.stop {background:#999;} ul.onlyone > li .cb_head > address {font-size:13px; color:#333; font-style:normal; margin-top:20px; padding-left:15px; color:var(--bg_site_sh_addr); border-left:1px solid var(--bg_site_sh_addr_line);transition:all .3s; line-height:140%;} ul.onlyone > li .cb_head > address span {font-family:tahoma; display:inline-block; padding-top:5px; font-size:12px; width:100%; color:var(--bg_site_sh_addr_tel);transition:all .3s;} ul.onlyone > li .cb_rest {position:relative; font-size:0;} ul.onlyone > li .cb_rest > div {display:inline-block; vertical-align:top; position:relative;} ul.onlyone > li .cb_rest .basic {width:120px; border-top:1px solid #eee;} ul.onlyone > li .cb_rest .basic:after {content:""; display:block; padding-top:100%;} ul.onlyone > li .cb_rest .basic .bs_wrp {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%;} ul.onlyone > li .cb_rest .basic .bs_wrp h4, ul.onlyone > li .cb_rest .basic .bs_wrp p {display:inline-block; width:100%; line-height:100%; text-align:center; position:relative;} ul.onlyone > li .cb_rest .basic .bs_wrp h4 {font-size:11px; letter-spacing:-0.05em; color:var(--bg_site_bs_wrp_h4); font-weight:normal;} ul.onlyone > li .cb_rest .basic .bs_wrp p {font-size:20px; font-family:'GmSansB'; padding-bottom:10px; color:var(--bg_site_bs_wrp_p);} ul.onlyone > li .cb_rest .basic .bs_wrp p span {font-size:11px;font-weight:normal; font-family:tahoma; display:inline-block; color:var(--bg_site_bs_wrp_span); padding-bottom:7px; width:100%;transition:all .3s;} ul.onlyone > li .cb_rest .other {width:calc(100% - 120px); } ul.onlyone > li .cb_rest .other ul.rinfo {position:relative; font-size:0; } ul.onlyone > li .cb_rest .other ul.rinfo li {display:inline-block; vertical-align:top; width:50%; padding:15px; border:1px solid #eee; border-width:1px 0 0 1px; position:relative;} ul.onlyone > li .cb_rest .other ul.rinfo li h4, ul.onlyone > li .cb_rest .other ul.rinfo li p {display:inline-block; width:100%; line-height:100%;} ul.onlyone > li .cb_rest .other ul.rinfo li h4 {font-size:11px; letter-spacing:-0.05em; font-weight:normal; color:#999;} ul.onlyone > li .cb_rest .other ul.rinfo li p {font-size:18px; font-family:'GmSansB'; padding-top:7px; color:var(--bg_site_other_p); } ul.onlyone > li .cb_rest .other ul.rinfo li p span {font-size:10px;font-weight:normal; position:absolute; font-family:tahoma; bottom:13px; right:10px; display:inline-block; color:var(--bg_site_other_span);} ul.onlyone > li .sg_gra {display:inline-block; width:100%; padding:35px; border-top:1px solid #eee;} ul.onlyone > li .sg_gra, ul.onlyone > li .cb_rest .basic, ul.onlyone > li .cb_rest .other ul.rinfo li {border-color:var(--bg_site_line);transition:all .3s;} ul.onlyone > li .sg_gra ul.sht_now {position:relative; font-size:0; margin-top:25px;} ul.onlyone > li .sg_gra ul.sht_now li {display:inline-block; vertical-align:top; width:33.3333%; margin-top:15px; padding-left:20px; position:relative;} ul.onlyone > li .sg_gra ul.sht_now li:before {content:""; position:absolute; left:3px; top:0; height:42px; border-left:1px solid var(--db_etc_line); transition: all .3s;} ul.onlyone > li .sg_gra ul.sht_now li h3, ul.onlyone > li .sg_gra ul.sht_now li p {display:inline-block; vertical-align:top; width:100%;} ul.onlyone > li .sg_gra ul.sht_now li h3 {font-size:13px; color:var(--wt_info_txt); font-weight:normal; transition: all .3s;} ul.onlyone > li .sg_gra ul.sht_now li p {font-size:15px;padding-top:5px; color:var(--biw_div); transition: all .3s;} ul.onlyone > li .sg_gra ul.sht_now li p.color1 {color:#f48a00;} ul.onlyone > li .sg_gra ul.sht_now li p.color2 {color:#ff524a;} ul.onlyone > li .sg_gra ul.sht_now li p.color3 {color:#149d63;} ul.onlyone > li .sg_gra ul.sht_now li span {display:inline-block; font-size:11px;font-family:NanumBarunGothic, sans-serif; font-weight:normal; color:#777; letter-spacing:0em; line-height:180%;} ul.onlyone > li .sg_gra ul.sht_now li span.full {width:100%; padding-top:0px; color:#999; line-height:110%;} ul.onlyone > li .sg_gra .graph_money {position:relative; } ul.onlyone > li .sg_gra .graph_money:after {content:""; display:block; padding-top:60%;} ul.onlyone > li .sg_gra .gpb_bar_box {position:absolute; width:100%; height:100%;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar {position:absolute; bottom:0; width:100%; height:100%; font-size:0; display:flex;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li {flex:1; position:relative; border-right:1px solid var(--db_etc_line); transition: all .3s; } ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li.best {} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li.today {} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li.today:before {content: "Today"; position: absolute; top: -17px;left:50%; transform: translateX(-50%); background:var(--pick_today);color: #fff; font-size: 11px; font-family: tahoma; line-height: 100%; padding: 5px; border-radius: 3px; transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li.today:after {content: ""; position: absolute; top: 3;left:50%; transform: translateX(-50%); border-left: 5px solid transparent; border-right: 5px solid transparent; border-top:5px solid var(--pick_today);} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li:last-child {border:0; background:var(--last_bg_default); transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li h4 {position:absolute; bottom:0; left:50%; transform: translateX(-50%); height:35px; line-height:35px; font-size:11px; text-align:center; color:#999; font-family:tahoma; font-weight:normal; border-top:0px solid var(--db_etc_line_strong); transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li .bbx {position:absolute; top:0; left:0; width:100%; height:calc(100% - 35px);} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li .bar {position:absolute; bottom:0; left:50%; transform: translateX(-50%); width:50%; height:0; animation: bar_data 1s forwards; background:var(--graph_bg_default); border-radius:5px; transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li .bar:after {content: attr(data-tooltip); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding:7px 7px; background: #333; color: #fff; border-radius: 3px; opacity: 0; transition: opacity 0.3s; pointer-events: none; font-size:11px; text-align:center; line-height:100%;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li:hover .bar::after {opacity: 1;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li .bar em {position:absolute; top:-22px; left:50%; transform:translateX(-50%); line-height:100%: text-align:center; color:var(--wt_info_txt_span); font-style:normal; font-size:12px; font-family:tahoma; transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li .bar span {position:absolute; bottom:0; left:0; width:100%; height:50%; transform:translateY(-100%); animation: jump 2.5s forwards infinite; background: linear-gradient( to top, transparent, var(--graph_bg_light), transparent); transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li.best .bar {background:var(--graph_bg_best); transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li:last-child .bar {background:var(--graph_all_bg); transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_bar li:last-child .bar em {color:#0075dd; font-weight:bold;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_line {position:absolute; bottom:20; width:100%; height:calc(100% - 70px); font-size:0;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_line li {display:inline-block; width:100%; height:25%; position:relative; border-top:1px solid var(--db_etc_line_strong); transition: all .3s;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_line li:first-child {border:0;} ul.onlyone > li .sg_gra .gpb_bar_box ul.gp_line li span {position:absolute; bottom:0; left:0; font-size:11px; display:none;} @media screen and (max-width: 1260px){ .short_client .sht_info {width:470px; height:100%; left:0; top:0;} .short_client .sht_map {width:calc(100% - 470px);} } /* 페이지내 검색 */ .search_area {position:fixed; top:0; right:0; width:300px; height:100%; font-size:0;padding:0; background:var(--bg_left);transition: all .3s; z-index:1;} .search_area {overflow-y:overlay;} .search_area:: {-ms-overflow-style: none;} .search_area::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .search_area::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .search_area.full {} .search_area.space {} .search_area .sw_hdbx {position:relative; margin-bottom:25px;} .search_area .sw_hdbx h2 {display:inline-block; width:100%; position:relative; font-family: 'Noto Sans KR'; font-weight: 500; letter-spacing: -0.05em; font-size:18px;color:var(--sw_hdbx_h2); transition: all .3s;} .search_area .sw_hdbx p {display:inline-block; width:100%; position:relative; font-size:13px;color:var(--sw_hdbx_p); padding:10px 0 0 0; transition: all .3s;} .search_area.space > i {position:absolute; top:20px; right:20px; font-size:20px; color:var(--sw_hdbx_h2); display:none;} .search_area h3 {position:relative; font-weight:normal; font-size:13px; color:var(--search_area_h3); padding:0 2px 7px 2px; transition: all .3s;} .search_area .scr_wrp {display:inline-block; vertical-align:bottom; width:100%; position:relative;padding:135px 35px 35px 35px; font-size:0;/*background:var(--bg_scr_wrp);*/} .search_area .btn_wrap {display:inline-block; vertical-align:top; width:100%; position:relative; font-size:0;} .search_area .btn_wrap h2 {} .search_area .btn_wrap .btn_chng {display:inline-block; vertical-align:top;width:100%; position:relative; font-size:0; margin-bottom:25px;} .search_area .btn_wrap .btn_chng:last-child {/*margin:0;*/} .search_area ul.sck_tab {position:relative; font-size:0; display:inline-block; vertical-align:middle; width:100%;} .search_area ul.sck_tab.rst_b {margin-top:3px;} .search_area ul.sck_tab.full {} .search_area ul.sck_tab li{display:inline-block; vertical-align:top; font-weight:bold; font-size:12px; line-height:30px; width:40px; text-align: center; background:var(--bg_sck_tab); color:#999; border-radius:3px; cursor:pointer;font-weight:normal; transition:all .3s; margin-right:3px;} .search_area ul.sck_tab li:last-child{margin:0;} .search_area ul.sck_tab li.on {color:#fff; background:var(--bg_sck_tab_on);} .search_area ul.sb_kind {position:relative; font-size:0;} .search_area ul.sb_kind > li{display:inline-block; vertical-align:top; transition:all .3s;} .search_area ul.sb_kind > li ul.btn {position:relative; font-size:0;} .search_area ul.sb_kind > li ul.btn li {display:inline-block; vertical-align:top; font-weight:bold; font-size:12px; line-height:30px; width:40px; text-align: center; background:var(--bg_sck_tab); color:#999; border-radius:3px; cursor:pointer; font-weight:normal; transition:all .3s; margin-right:3px;} .search_area ul.sb_kind > li ul.btn li:last-child{margin:0;} .search_area ul.sb_kind > li ul.btn li.on {color:#fff; background:var(--bg_sck_tab_on);} .search_area ul.mcn_tab {position:relative; font-size:0;} .search_area ul.mcn_tab li{display:inline-block; vertical-align:top; width:100%; transition:all .3s; margin-bottom:5px; border-radius:3px; overflow:hidden;} .search_area ul.mcn_tab li:last-child{margin:0;} .search_area ul.mcn_tab li a{display:block; font-weight:bold; font-size:12px; line-height:45px; text-align: left; padding:0 15px; background:var(--bg_mcn_tab); color:var(--bg_mcn_tab_txt); transition:all .3s;} .search_area ul.mcn_tab li.on a {color:#fff; background:var(--bg_sck_tab_on);} .search_area .sg_date {display:inline-block; vertical-align:top; position:relative; font-size:0; width:100%;} .search_area .sg_date h2 {} .search_area .sg_date .date_box {display:inline-block; vertical-align:middle; width:100%; margin-bottom:5px; position:relative; font-size:15px;} .search_area .sg_date .date_box:last-child {margin:0;} .search_area .sg_date .date_box > span {position:absolute; top:50%; left:10px; transform:translateY(-50%); font-size:11px; color:#738b9a; font-weight:normal; z-index:1;} .search_area .sg_date .date_box input[type="date"] {position:relative; padding:0 30px 0 43px; width:100%; height:30px; color:#999; font-size: 11px; border:0; border-radius:3px; background:var(--bg_sck_tab);} .search_area .sg_date .date_box input[type="date"]::-webkit-clear-button, .search_area .sg_date .date_box input[type="date"]::-webkit-inner-spin-button {display:none;} .search_area .sg_date .date_box input[type="date"]::-webkit-calendar-picker-indicator {position:absolute; top:0; left:0; width:100%; height:100%; background:transparent; color:transparent; cursor:pointer; z-index:1;} .search_area .sg_date .date_box input[type="date"]::before {content:attr(data-placeholder); width:100%;} .search_area .sg_date .date_box input[type="date"]::after {content: '\f274'; font-family: "Font Awesome 5 Free"; font-weight: 700; font-size:13px; color:#999; transition:all .3s; position:absolute; top:50%; right:10px; transform: translateY(-50%);} .search_area .sg_date .date_box input[type="date"]:active::after, .search_area .sg_date .date_box input[type="date"]:hover::after {color:#888; transition:all .3s;} .search_area .sg_date .date_box input[type="date"]:valid::before {display:none;} .search_area .sg_date .date_box input[data-placeholder]::before {position:absolute; top:0; left:0; padding:11px 0 0 10px; background:#fff; color:#999; font-size:12px;} .search_area .sg_set {display:inline-block; vertical-align:top; width:200px; border:1px solid blue;position:relative; font-size:0;} .search_area .sg_set h3 {position:relative; font-size:15px;} .search_area ul.select_replace {display:inline-block; vertical-align:top;position:relative; font-size:0; width:100%; border:3px solid green;} .search_area ul.select_replace > li{display:inline-block; vertical-align:top; width:300px; border:1px solid red; font-size:0;} .search_area ul.select_replace > li span{display:inline-block; width:100%; border:1px solid red;font-size:15px; transition:all .3s;} .search_area ul.select_replace > li ul.sr_kind{display:inline-block; vertical-align:top; font-size:15px; transition:all .3s;} .search_area ul.select_replace > li ul.sr_kind li {position:relative; border:1px solid red; font-size:15px; transition:all .3s;} .search_area .act_btn_set {display:inline-block; vertical-align:top; width:100%; padding:30px 0 0 0; position:relative; font-size:0;} .search_area .sg_txt {position:relative; margin-top:25px; display:inline-block; vertical-align:top; width:100%;} .search_area .sg_txt .frm_wrp, .search_area .sg_txt > button {display:inline-block; vertical-align:middle; position:relative;transition:all .3s; } .search_area .sg_txt .frm_wrp {width:calc(100% - 38px); margin-right:3px;} .search_area .sg_txt .frm_wrp span {position:absolute; top:50%; left:10px; transform:translateY(-50%); font-size:12px; color:var(--dt_search_span); z-index:1;transition:all .3s;} .search_area .sg_txt .frm_wrp input {width:100%; height:35px; padding:0 15px; background:var(--dt_search_input_bg); border:none; border-bottom:0; font-size:13px; color:var(--dt_search_input); outline:none; transition:all .3s; border-radius:3px;} .search_area .sg_txt .frm_wrp input:focus {outline:none;background:var(--dt_search_input_bg_focus); transition:all .3s;} .search_area .sg_txt .frm_wrp input::placeholder {color: var(--fw_input_holder); font-size:11px;} .search_area .sg_txt .frm_wrp button {position:absolute; top:50%; right:0; transform:translateY(-50%); width:35px; height:35px; border:0; font-size:15px; background:transparent; color:var(--dt_search_button); cursor:pointer;} .search_area .sg_txt > button {width:35px; height:35px; font-size:15px; border:0; background:var(--dt_search_reset_bg); color:var(--dt_search_reset_txt); border-radius:3px; cursor:pointer; padding:0; text-align:center;} .search_area .sg_txt > button i {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);} .search_area .act_btn_set input:focus {outline:none;background:var(--dt_search_input_bg_focus); transition:all .3s;} .search_area .act_btn_set input::placeholder {color: var(--fw_input_holder); font-size:11px;} .search_area .act_btn_set button {display:inline-block; vertical-align:top; width:calc(50% - 6px); margin:0 3px; font-size:0; height:40px; border-radius:35px; border:0; cursor:pointer; transition:all .3s;} .search_area .act_btn_set button.search {background:#216087; color:#fff;} .search_area .act_btn_set button.search:hover {background:#217ab1;} .search_area .act_btn_set button.reset {background:#666; color:#fff;} .search_area .act_btn_set button.reset:hover {background:#555;} .search_area .act_btn_set button i, .search_area .act_btn_set button span {display:inline-block; vertical-align:middle; line-height:100%;} .search_area .act_btn_set button i {font-size:18px; padding-right:10px;} .search_area .act_btn_set button span {font-size:12px;} @media screen and (max-width: 1800px){ .search_area {position:relative; width:100%; height:auto; margin-bottom:15px; border-radius:7px;} .search_area .scr_wrp {padding:20px; } .search_area .sw_hdbx, .search_area h3 {display:none;} .search_area .btn_wrap {width:auto; margin:0 15px 0 0;} .search_area .btn_wrap .btn_chng {width:auto; margin:0 15px 0 0;} .search_area .btn_wrap .btn_chng:last-child {margin:0;} .search_area ul.sck_tab {width:auto;} .search_area ul.sck_tab.rst_b {margin:0 0 0 3px;} .search_area .sg_date {width:auto;} .search_area .sg_date .date_box {width:150px; margin:0 5px 0 0; } .search_area .sg_txt {width:100%; margin-top:5px;} .search_area .act_btn_set {position:absolute; top:50%; right:20px; transform:translateY(-50%); width:auto; padding:0; white-space:nowrap;} .search_area .act_btn_set button {height:30px; padding:0 15px; border-radius:3px; margin:0 0 0 3px; width:auto;} .search_area .act_btn_set button i {font-size:13px; padding-right:5px;} } /* 종합감시탭 */ ul.check_tab {position:fixed; top:102px; right:400px; display:flex; width:700px; z-index:100;} ul.check_tab li{flex:1; margin-right:5px; transition:all .3s; border-radius:3px; overflow:hidden;} ul.check_tab li:last-child{margin:0;} ul.check_tab li a{display:block; font-weight:bold; font-size:12px; line-height:35px; text-align: center; padding:0 10px; background:var(--bg_check_tab); color:var(--bg_check_tab_txt); transition:all .3s;} ul.check_tab li.on a {color:#fff; background:var(--bg_sck_tab_on);} @media screen and (max-width: 1500px){ ul.check_tab {position:relative; top:0; left:0; width:100%; padding-bottom:10px;} ul.check_tab li{margin:0 5px 5px 0; } ul.check_tab li a{line-height:45px;} } /* 테이블 기본 설정 */ .table_wrap {position: relative; top:0; left:0; width:calc(100% - 300px); height:calc(100% - 80px); padding: 35px;} .table_wrap {overflow-y:overlay;} .table_wrap:: {-ms-overflow-style: none;} .table_wrap::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .table_wrap::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .table_wrap.full {width:100%;} .table_wrap .sort_help {display:inline-block; width:100%; position:relative; font-size:0; padding-bottom:15px;} .table_wrap .sort_help.site {} .table_wrap .site_pick_box {display:inline-block; vertical-align:bottom; width:350px; position:relative; font-size:0;} .table_wrap .site_pick_box h2 {font-size:20px;} .table_wrap .site_pick_box .pick_now {position:relative;} .table_wrap .site_pick_box .pick_now h3 {position:relative; /*font-family: 'Noto Sans KR';*/ font-weight: normal; letter-spacing: 0em; font-size:13px; line-height:45px; padding:0 20px 0 85px; background:var(--pick_h3_bg); color:var(--pick_h3); border-radius:7px; cursor:pointer;} .table_wrap .site_pick_box .pick_now h3 i {position:absolute; top:50%; right:15px; transform:translateY(-50%); color:var(--pick_h3_icon); font-size:18px;} .table_wrap .site_pick_box .pick_now h3 em {position:absolute; top:50%; left:15px; transform:translateY(-50%); background: var(--bg_sck_tab_on); color:#fff; line-height: 100%; font-family:NanumBarunGothic, sans-serif; font-weight:normal;letter-spacing:0;font-size:11px; padding:5px; border-radius: 3px; font-style: normal;} .table_wrap .site_pick_box .pick_list {position:absolute; top:40px; left:0; width:100%; visibility: hidden; opacity: 0; transition: all .3s; background: var(--bg_menu_sel_list); z-index:5; border-radius:7px; overflow:hidden;} .table_wrap .site_pick_box .pick_list.show {opacity: 1; top: 50px; visibility: visible;} .table_wrap .site_pick_box .pl_wrp {position:relative; max-height:300px; height:auto; } .table_wrap .site_pick_box .pl_wrp {overflow-y:overlay;} .table_wrap .site_pick_box .pl_wrp:: {-ms-overflow-style: none;} .table_wrap .site_pick_box .pl_wrp::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .table_wrap .site_pick_box .pl_wrp::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .table_wrap .site_pick_box ul.sel_group {position:relative; padding:20px; counter-reset:li;transition:all .3s; border-top: 1px dashed var(--bg_menu_line);} .table_wrap .site_pick_box ul.sel_group:first-child {border:0;} .table_wrap .site_pick_box ul.sel_group li {display:inline-block; width:100%; font-size:12px; position:relative; color:var(--bg_menu_company);} .table_wrap .site_pick_box ul.sel_group li:hover {color:var(--bg_menu_company_hover);} .table_wrap .site_pick_box ul.sel_group li.area {padding:0 0 5px 0;} .table_wrap .site_pick_box ul.sel_group li.area > h4 {display:inline-block; vertical-align:middle; position:relative; width:100%; font-size:13px; color:var(--bg_menu_area); font-weight: normal;transition:all .3s;} .table_wrap .site_pick_box ul.sel_group li.nm {cursor:pointer;} .table_wrap .site_pick_box ul.sel_group li.nm:before {content:counter(li)"."; counter-increment:li; display:inline-block; padding-right:3px; color:#777; font-family:tahoma;} .table_wrap .site_pick_box ul.sel_group li > em {position:absolute; top:50%; right:0; transform:translateY(-50%); width:4px; height:4px; border-radius:100%;} .table_wrap .site_pick_box ul.sel_group li:hover > span {color:var(--bg_menu_company_hover); transition: all .3s;} .table_wrap .site_pick_rest {display:inline-block; vertical-align:bottom; width:100%; position:relative; text-align:left;} .table_wrap .sp_btn_wrap {display:inline-block; vertical-align:top;width:calc(100% - 400px); transition:all .3s; } .table_wrap .btn_df {display:inline-block; vertical-align:top;position:relative; font-size:12px; line-height:35px; color:#fff; padding:0 15px; border-radius:3px; cursor:pointer; margin-right:5px;} .table_wrap .btn_df.del {background:var(--bg_btn_df_del);} .table_wrap .btn_df.change {background:var(--bg_btn_df_change); border-radius:0 3px 3px 0;} .table_wrap .btn_df.add {background:var(--bg_btn_df_add); } .table_wrap .sel_wrap {display:inline-block; vertical-align:top;position:relative; } .table_wrap .sel_wrap ul.select_replace {position:relative; display:inline-block; vertical-align:middle;width:150px;} .table_wrap .sel_wrap ul.select_replace > li{display:inline-block; vertical-align:top; margin-left:3px; font-size:0; position:relative; width:100%;} .table_wrap .sel_wrap ul.select_replace > li span{display:inline-block; width:100%; font-size:12px; line-height:35px; padding:0 15px; background:var(--bg_select_replace_span); border-radius:3px; color:var(--select_replace_txt);position:relative; transition:all .3s; cursor:pointer;} .table_wrap .sel_wrap ul.select_replace > li span > i{position:absolute; top:50%; right:10px; transform:translateY(-50%); font-size:13px; color:var(--select_replace_i);} .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind{position:absolute; top:47px; left:0; width:100%;transition:all .3s; z-index:10; visibility: hidden; opacity: 0; background:var(--bg_sr_kind); border:1px solid var(--bg_sr_kind_out); padding:15px; border-radius:3px;max-height:300px; height:auto;} .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind.show{top:37px; transition:all .3s;opacity: 1; visibility: visible; } .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind {overflow-y:overlay;} .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind:: {-ms-overflow-style: none;} .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind li {position:relative; font-size:12px; color:var(--sr_kind_txt); transition:all .3s; cursor:pointer; padding:2px 0;} .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind li:hover {color:var(--sr_kind_txt_hover);} .table_wrap .sel_wrap ul.select_replace > li ul.sr_kind li:before {content:"ㆍ";} .table_wrap .site_pick_rest form {display:inline;} .table_wrap .site_pick_rest > ul.select_replace {display:inline-block; vertical-align:top;position:relative; font-size:0;} .table_wrap .site_pick_rest > ul.select_replace > li{display:inline-block; vertical-align:top; width:200px; text-align:left; position:relative; margin-left:5px; font-size:0; } .table_wrap .site_pick_rest > ul.select_replace > li:first-child {margin:0;} .table_wrap .site_pick_rest > ul.select_replace > li span{display:inline-block; width:100%; font-size:12px; line-height:35px; padding:0 15px; background:var(--bg_select_replace_span); border-radius:3px; color:var(--select_replace_txt);position:relative; transition:all .3s; cursor:pointer;} .table_wrap .site_pick_rest > ul.select_replace > li span > i{position:absolute; top:50%; right:10px; transform:translateY(-50%); font-size:13px; color:var(--select_replace_i);} .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind{position:absolute; top:47px; left:0; width:100%;transition:all .3s; z-index:10; visibility: hidden; opacity: 0; background:var(--bg_sr_kind); border:1px solid var(--bg_sr_kind_out); padding:15px; border-radius:3px;max-height:300px; height:auto;} .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind.show{top:37px; transition:all .3s;opacity: 1; visibility: visible; } .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind {overflow-y:overlay;} .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind:: {-ms-overflow-style: none;} .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind li {position:relative; font-size:12px; color:var(--sr_kind_txt); transition:all .3s; cursor:pointer; padding:3px 0;} .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind li:hover {color:var(--sr_kind_txt_hover);} .table_wrap .site_pick_rest > ul.select_replace > li ul.sr_kind li:before {content:"ㆍ";} .table_wrap .site_pick_rest > img {display:inline-block; vertical-align:top; height:35px; margin-left:15px; border-radius:3px; float: right;} .table_wrap .tb_out {position:relative; border-radius:10px; overflow:hidden; border:1px solid var(--tb_out);} .table_wrap .in_wrp {position:relative; border-radius:10px; border:0px solid var(--tb_out);} table.ga_data {width:100%; border-top:0px ; border-collapse:collapse; overflow: hidden; /*font-family: Noto Sans KR, sans-serif;*/ position:relative;} table.ga_data.left {} /*table.ga_data:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid red; z-index:1;}*/ table.ga_data tr {position:relative; overflow:hidden; background:var(--bg_ga_data_tr); transition:all .2s;} table.ga_data tr:hover {background: var(--bg_ga_data_tr_hover);} table.ga_data tr.avg {background:var(--bg_ga_data_tr_avg) !important;} table.ga_data tr.total {background:var(--bg_ga_data_tr_total) !important;} table.ga_data tr th, table.ga_data tr td {border:0px solid var(--bg_ga_data_line); border-width:0px 1px 1px 1px; vertical-align:middle; text-align:center; padding: 10px 5px; line-height: 130%; font-size: 13px;/* font-weight: 500;*/ position:relative; z-index:2; color:var(--bg_ga_data_td_color);} table.ga_data tr td.title_v {vertical-align:top;} table.ga_data.left .cpa {text-align:left !important; padding:13px;} /* table.ga_data tr th:first-child, table.ga_data tr td:first-child {border-width:0px 0px 1px 0px; } table.ga_data tr th:last-child, table.ga_data tr td:last-child {border-width:0px 0px 1px 1px; } table.ga_data tr:last-child td {border-width:0px 0px 0px 1px !important; } table.ga_data tr:last-child td:first-child {border-width:0px 0px 0px 0px !important; } */ table.ga_data tr th {background:var(--bg_ga_data_th); color:var(--bg_ga_data_th_color); font-weight:bold; padding:12px 5px;white-space: nowrap;} table.ga_data tr th a {color:var(--bg_ga_data_th_color_a);} table.ga_data tr th .sm {display:inline-block;/* width:100%; */ padding-left:3px; font-family: tahoma; font-size: 11px; color:var(--bg_ga_data_th_sm); font-weight:normal; line-height:100%;} table.ga_data tr th.cmp_name {font-size: 15px; padding: 20px 0; font-family: Noto Sans KR, sans-serif; color:var(--bg_ga_data_th_cmp); font-weight: 500; letter-spacing: -0.05em;} table.ga_data tr td span {display:inline-block; padding-left:7px; color:var(--bg_ga_data_td_span);} table.ga_data tr td span.error, table.ga_data tr td span.normal {font-size:0;} table.ga_data tr td span.error em, table.ga_data tr td span.normal em {font-size:16px; font-style:normal;} table.ga_data tr td span.error em {color:red;} table.ga_data tr td span.normal em {color:green;} table.ga_data tr td span.ic_bx {padding:0; color:var(--bg_ga_data_td_color);} table.ga_data tr .point {} table.ga_data tr .point:after {content:""; position:absolute; top:0; left: 0; width:2px; height: 100%; background:var(--bg_table_line); z-index: 1;} table.ga_data tr.line td {padding: 0 !important; height:2px !important; background: var(--bg_table_line);} table.ga_data tr.am {background: var(--bg_tb_am) !important;} table.ga_data tr.am td span {color:var(--bg_tb_am_span) !important;} table.ga_data tr.pm {background: var(--bg_tb_pm) !important;} table.ga_data tr.pm td span {color:var(--bg_tb_pm_span) !important;} table.ga_data tr.am:hover, table.ga_data tr.pm:hover {background: var(--bg_ga_data_tr_hover) !important;} table.ga_data tr td.warning {color:red !important;} table.ga_data tr td.check {color:#cb8820 !important;} table.ga_data tr td > i {display:inline-block; padding-right:5px;} table.ga_data tr td a {color:var(--bg_ga_data_tr_td_color_a); display:inline-block;} table.ga_data tr td a:hover {color:var(--bg_ga_data_tr_td_color_a_hover);} table.ga_data tr td a.site {color:var(--bg_ga_data_site_a);} table.ga_data tr td a.site:hover {color:var(--bg_ga_data_site_a_hover);} table.ga_data tr .hmc {background:var(--bg_ga_data_hmc);} table.ga_data tr .tmc {background:var(--bg_ga_data_tmc);} table.ga_data tr .arr_left {text-align:left;text-overflow: ellipsis; white-space: nowrap; overflow:hidden;} table.ga_data tr td:before {content:attr(data-text); font-size:11px; color:var(--bg_ga_data_data_text); padding-bottom:3px; width:100%; display:none;} table.ga_data.left tr td:before {content:; display:none !important;} table.ga_data tr td.none {height:150px !important; font-size:11px !important; text-align:center !important;} table.ga_data .hidden {} table.ga_data .hx {padding:5px 0 !important;} .short_data_box {position:relative; padding:15px 10px 0 10px; text-align:right; font-size:12px; color:var(--bg_title_h2);} .short_data_box span {display:inline-block; width:50px; text-align:left;} @media screen and (max-width: 1800px){ .table_wrap {width:100%;} table.ga_data .hidden {display:no ne;} } /* 테이블 sub */ table.ga_sub_tb {width:100%; border-top:1px solid var(--bg_ga_data_line); ; border-collapse:collapse; overflow: hidden; /*font-family: Noto Sans KR, sans-serif;*/ position:relative;} table.ga_sub_tb.left {} /*table.ga_sub_tb:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid red; z-index:1;}*/ table.ga_sub_tb tr {position:relative; overflow:hidden; background:var(--bg_ga_data_tr); transition:all .2s;} table.ga_sub_tb tr th, table.ga_sub_tb tr td {border:0px solid var(--bg_ga_data_line); border-width:0px 1px 1px 1px; vertical-align:middle; text-align:center; padding: 12px 5px; line-height: 130%; font-size: 12px;/* font-weight: 500;*/ position:relative; z-index:2; color:var(--bg_ga_data_td_color);} table.ga_sub_tb.left tr td {text-align:left; padding:10px;} table.ga_sub_tb tr th {background:var(--bg_ga_data_th); color:var(--bg_ga_data_th_color); font-weight:bold; } table.ga_sub_tb tr th a {color:var(--bg_ga_data_th_color_a);} table.ga_sub_tb tr td > i {display:inline-block; padding-right:5px;} table.ga_sub_tb tr td > em {font-style:normal; opacity:0.6; font-family:tahoma; font-size:11px; display:inline-block; padding-left:3px;} table.ga_sub_tb tr td a {color:var(--bg_ga_data_tr_td_color_a); display:inline-block;} table.ga_sub_tb tr td a:hover {color:var(--bg_ga_data_tr_td_color_a_hover);} /* 테이블 sub2 */ table.ga_sub_tb2 {width:100%; border-top:1px solid var(--bg_ga_data_line); border-radius:7px; border-collapse:collapse; overflow: hidden; /*font-family: Noto Sans KR, sans-serif;*/ position:relative;} table.ga_sub_tb2.left {} /*table.ga_sub_tb2:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid red; z-index:1;}*/ table.ga_sub_tb2 tr {position:relative; overflow:hidden; background:var(--wrn_detail_li_bg); transition:all .2s;} table.ga_sub_tb2 tr th, table.ga_sub_tb2 tr td {border:0px solid transparent; border-width:0px 1px 1px 1px; vertical-align:middle; text-align:center; padding: 12px 5px; line-height: 130%; font-size: 12px;/* font-weight: 500;*/ position:relative; z-index:2; color:var(--bg_ga_data_td_color);} table.ga_sub_tb2.left tr td {text-align:left; padding:10px;} table.ga_sub_tb2 tr th {background:var(--bg_ga_data_th); color:var(--bg_ga_data_th_color); font-weight:bold; } table.ga_sub_tb2 tr th a {color:var(--bg_ga_data_th_color_a);} table.ga_sub_tb2 tr td > i {display:inline-block; padding-right:5px;} table.ga_sub_tb2 tr td > em {font-style:normal; opacity:0.6; font-family:tahoma; font-size:11px; display:inline-block; padding-left:3px;} table.ga_sub_tb2 tr td a {color:var(--bg_ga_data_tr_td_color_a); display:inline-block;} table.ga_sub_tb2 tr td a:hover {color:var(--bg_ga_data_tr_td_color_a_hover);} /* 데이터내 검색 */ .dt_search {float:right; position:relative; top:0; right:0; width:400px; font-size:0; transition:all .3s;} .dt_search .box, .dt_search > button {display:inline-block; vertical-align:middle; position:relative;transition:all .3s; } .dt_search .box {width:calc(100% - 38px); margin-right:3px;} .dt_search .box span {position:absolute; top:50%; left:10px; transform:translateY(-50%); font-size:12px; color:var(--dt_search_span); z-index:1;transition:all .3s;} .dt_search .box input {width:100%; height:35px; padding:0 50px 0 90px; background:var(--dt_search_input_bg); border:none; border-bottom:0; font-size:13px; color:var(--dt_search_input); outline:none; transition:all .3s; border-radius:3px;} .dt_search .box input:focus {outline:none;background:var(--dt_search_input_bg_focus); transition:all .3s;} .dt_search .box input::placeholder {color: var(--fw_input_holder); font-size:11px;} .dt_search .box button {position:absolute; top:50%; right:0; transform:translateY(-50%); width:35px; height:35px; border:0; font-size:15px; background:transparent; color:var(--dt_search_button); cursor:pointer;} .dt_search > button {width:35px; height:35px; font-size:15px; border:0; background:var(--dt_search_reset_bg); color:var(--dt_search_reset_txt); border-radius:3px; cursor:pointer; padding:0; text-align:center;} .dt_search > button i {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);} /* 사이트추가/수정 레이어 */ .site_mask {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.7); visibility: hidden; opacity: 0; transition: all .3s; z-index:101;} .site_mask.show {opacity: 1; visibility: visible; } .site_mask > i {position:absolute; top:25px; right:25px; transform:translateX(-100%); color:#fff; font-size:22px; transition:all .3s;} .site_mask.show > i { transform:translateX(0);} .site_box {position:fixed; top:55%; left:50%; transform:translate(-50%, -50%); max-width:550px; width:calc(100% - 75px); height:calc(100% - 75px); visibility: hidden; opacity: 0; transition: all .3s; z-index:102; } .site_box.show {top:50%; visibility: visible; opacity: 1; } .site_box .st_head {position:relative; height:60px; background:var(--st_head_bg); border-bottom:1px solid var(--st_head_line); border-radius:15px 15px 0 0;} .site_box .st_head h3 {position:absolute; top:50%; left:0; transform:translateY(-50%); padding:0 25px; width:100%; font-weight:bold; font-size:15px; color:var(--st_head_h3);} .site_box .st_head i {position:absolute; top:50%; right:25px; transform:translateY(-50%) rotate(0deg); font-size:18px; color:var(--st_head_i); z-index:1; transition:all .3s; cursor:pointer;} .site_box .st_head i:hover { transform:translateY(-50%) rotate(270deg);} .site_box .st_content {position:relative; height:calc(100% - 125px); background:var(--st_content_bg);} .site_box .st_content {overflow-y:overlay;} .site_box .st_content:: {-ms-overflow-style: none;} .site_box .st_content::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .site_box .st_content::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .site_box ul.wrn_btn_set {position:relative; display:flex; border-radius:0 0 15px 15px; overflow:hidden;} .site_box ul.wrn_btn_set li {flex:1;height: 65px; position:relative;} .site_box ul.wrn_btn_set li a, .site_box ul.wrn_btn_set li button {display:block; position:absolute; top:0; left:0; width:100%; height:100%; border: 0; cursor: pointer;} .site_box ul.wrn_btn_set li a span, .site_box ul.wrn_btn_set li button span {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);color:#fff; font-size:13px; text-align:center; width:100%;} .site_box ul.wrn_btn_set li.ok a, .site_box ul.wrn_btn_set li.ok button {background:#1a4f7c;} .site_box ul.wrn_btn_set li.go a, .site_box ul.wrn_btn_set li.go button {background:#555;} .site_box input[type=file] {} .site_box input[type=file]::-webkit-file-upload-button { background:var(--fw_sbtn) !important;margin-top:9px; color:#fff; padding:0 10px; border:0 !important;min-width:75px; height:25px !important; border-radius:3px; font-size:11px; letter-spacing:-0.05em; cursor:pointer; transition:all .3s;} .site_box input[type=file]::-webkit-file-upload-button:hover { background:var(--fw_sbtn) !important;; transition:all .3s;} .site_box input[type=file]::-ms-value { width:auto; height: auto; border:1px solid #c0c0c0; padding:3px; margin: 0; outline:none; font-size:11px;} .site_box input[type=file]::-ms-value:hover { border:1px solid #006699; background: #ffff99; } .site_box input[type=file]::-ms-browse { width:auto; height: auto; border:1px solid #000000; color:white; border-radius:2px; padding:3px 10px; background:#6a6a6a; } .site_box input[type=file]::-ms-browse:hover { border:1px solid #0000ff; background:#0066ff; } /* 사이트 추가/수정 폼 */ ul.frm_wrap {position:relative; font-size:0;} ul.frm_wrap > li {display:inline-block; width:100%; border-bottom:1px dashed var(--fw_bg_line); position:relative; padding:25px;} ul.frm_wrap > li:last-child {border-bottom:0;} ul.frm_wrap > li:nth-child(even) {background:var(--fw_bg_even); } ul.frm_wrap > li:nth-child(odd) {background:var(--fw_bg_odd); } ul.frm_wrap > li .df_hdbx {position:relative; padding:0px 0 0px 5px; margin-bottom:10px;} ul.frm_wrap > li .df_hdbx h3 {position:relative; font-size:13px; line-height:130%; font-weight:bold; color:var(--fw_h3);} ul.frm_wrap > li .df_hdbx h3 span {position:absolute; top:5px; right:0; font-size:13px; line-height:130%; font-weight:bold; color:#000;} ul.frm_wrap > li .df_hdbx h3 strong {display:inline-block; margin-right:5px; color:#af0000; border-bottom:1px solid #af0000; font-weight:normal;} ul.frm_wrap > li .df_hdbx h3 i {font-style:normal; color:red;} ul.frm_wrap > li .df_hdbx h3 .mc_view {background:var(--graph_all_bg); color:#fff; padding:0; text-align:center; line-height:27px; width:90px; border-radius:35px; border:0 !important; position:absolute; top:-5px; right:0; font-size:11px; cursor:pointer;} ul.frm_wrap > li .df_hdbx h3 backup {background:var(--graph_all_bg); color:#fff; padding:0; text-align:center; line-height:27px; width:90px; border-radius:35px; border:0 !important; position:absolute; top:-5px; right:95px; font-size:11px; cursor:pointer;} ul.frm_wrap > li .df_hdbx p {position:relative; font-size:12px; line-height:150%; padding-top:0px; color:rgba(0,0,0,0.6); display:none;} ul.frm_wrap > li ul.frm_box {position:relative; width:100%; counter-reset:li; font-size:0;} ul.frm_wrap > li ul.frm_box.add_tx {margin-top:15px;} ul.frm_wrap > li ul.frm_box li {display:inline-block; vertical-align:middle; width:100%; position:relative; margin:2px 0; font-size:0;} ul.frm_wrap > li ul.frm_box.add_tx li {margin:5px 0;} ul.frm_wrap > li ul.frm_box li > span {position:absolute; top:50%; left:20px; transform:translateY(-50%); font-size:12px; color:var(--fw_span); z-index:1;} ul.frm_wrap > li ul.frm_box li > span.es {} ul.frm_wrap > li ul.frm_box li > span.es:before {content:""; position:absolute; top:calc(50% - 1px); left:-8px; transform:translateY(-50%); background:red; width:2px; height:2px;} ul.frm_wrap > li ul.frm_box li > em {position:absolute; top:50%; right:20px; transform:translateY(-50%); font-size:11px; z-index:1; font-style:normal;} ul.frm_wrap > li ul.frm_box li > button {position:absolute; top:50%; right:10px; transform:translateY(-50%); font-size:11px; z-index:1; font-style:normal; border:0; padding:10px 10px; line-height:100%; background:#333; color:#fff; border-radius:3px; cursor:pointer;} ul.frm_wrap > li ul.frm_box li > a {position:absolute; top:50%; left:30px; transform:translateY(-50%); width:30px; height:30px; background-size:cover !important; background-position:center center !important; border-radius:100%;} ul.frm_wrap > li ul.frm_box li > .mb_check {left:initial; right:10px; font-size:11px; padding:10px 15px; line-height:100%; color:#fff; border-radius:35px; cursor:pointer;} ul.frm_wrap > li ul.frm_box li > .mb_check.m_id {background:var(--fw_sbtn);} ul.frm_wrap > li ul.frm_box li > .mb_check.m_ur {background:red;} ul.frm_wrap > li ul.frm_box li > .tx_tit, ul.frm_wrap > li ul.frm_box li > .tx_con {position:relative; top:initial; left:initial; transform:none; font-size:13px; display:inline-block; vertical-align:middle;} ul.frm_wrap > li ul.frm_box li > .tx_tit {width:110px; padding-left:10px;color:rgba(0,0,0,0.6);} ul.frm_wrap > li ul.frm_box li > .tx_tit:before {content:"ㆍ";} ul.frm_wrap > li ul.frm_box li > .tx_con {width:calc(100% - 110px);color:rgba(0,0,0,1);} ul.frm_wrap > li ul.frm_box li.del {margin:10px 0;} ul.frm_wrap > li ul.frm_box li input {width:100%; height:45px; padding:0 15px 0 95px; border:0; background:var(--fw_input); font-size:12px; text-align:left; transition:all .3s; color:var(--fw_input_txt); border:1px solid var(--fw_input_out);border-radius:7px;} ul.frm_wrap > li ul.frm_box li input:focus {outline:none; background:var(--fw_input_hover); border-color:var(--fw_input_out); transition:all .3s;} ul.frm_wrap > li ul.frm_box li input::placeholder {color: var(--fw_input_holder); font-size:11px;} ul.frm_wrap > li ul.frm_box li input[type="checkbox"] + label.site {margin:0 0 0 100px; font-size:11px !important; color:var(--fw_input_txt) !important;} ul.frm_wrap > li ul.frm_box li .fix, ul.frm_wrap > li ul.frm_box li .fix:focus {background:var(--fw_input_fix); color:var(--fw_input_fix_txt); border:1px solid var(--fw_input_out_fix); cursor:not-allowed; } ul.frm_wrap > li ul.frm_box li.ment {font-size:12px; padding:20px 5px 7px 5px; color:var(--fw_ment); } ul.frm_wrap > li ul.frm_box li.map {display:inline-block;} ul.frm_wrap > li ul.frm_box li.map .pick, ul.frm_wrap > li ul.frm_box li.map input {display:inline-block; vertical-align:middle; position:relative;} ul.frm_wrap > li ul.frm_box li.map .pick {width:60px; top:0; left:0; transform:none; padding:0; line-height:40px; text-align:center; border-radius:3px 0 0 3px; background:var(--fw_sbtn);} ul.frm_wrap > li ul.frm_box li.map input {width:calc(100% - 60px) !important; height:40px; border-radius:0 3px 3px 0; padding:0 30px 0 15px; font-family:tahoma; font-size:11px; background:var(--fw_input_fix); color:var(--fw_input_fix_txt);} ul.frm_wrap > li ul.frm_box li.map .del {width:40px; height:100%; top:0; right:0px; left:initial; transform:none; padding:0; line-height:40px; text-align:center; background:none;} ul.frm_wrap > li ul.frm_box li.map .del i {font-size:20px; color:var(--map_del);} ul.frm_wrap .zip_num, ul.frm_wrap .zip_num:focus {background:var(--fw_sbtn); color:#fff; padding:0; text-align:center; line-height:30px; width:80px; border-radius:35px; border:0 !important; position:absolute; top:-5px; right:0; font-family:tahoma; font-size:11px; cursor:pointer;} ul.frm_wrap .zip_num:focus {border:1px solid #e9e9e9;} ul.frm_wrap .zip_num::placeholder {color: rgba(255,255,255,0.8); font-size:11px; font-family:NanumBarunGothic, sans-serif;} ul.frm_wrap > li .mcn_wrap {position:relative; margin-bottom:20px;} ul.frm_wrap > li .mcn_wrap:last-child {margin:0;} ul.frm_wrap > li .mcn_wrap h4 {position:relative; font-size:13px; line-height:130%; padding:0 0 5px 0; font-weight:normal; color:var(--mcn_wrap_h4);} ul.frm_wrap > li .mcn_wrap h4:before {content:"ㆍ";} ul.frm_wrap > li .mcn_wrap h4 span{display:inline-block; padding-left:5px; font-size:11px; color:var(--mcn_wrap_span); display:none;} ul.frm_wrap > li ul.rdo_set {position:relative; width:100%; font-size:0;} ul.frm_wrap > li ul.rdo_set.st1{} ul.frm_wrap > li ul.rdo_set.st2 {} ul.frm_wrap > li ul.rdo_set.st3 {} ul.frm_wrap > li ul.rdo_set.st4 {} ul.frm_wrap > li ul.rdo_set.st5 {} ul.frm_wrap > li ul.rdo_set.st6 {} ul.frm_wrap > li ul.rdo_set {position:relative; width:100%; font-size:0;} ul.frm_wrap > li ul.rdo_set li {display:inline-block; vertical-align:middle; width:calc(25% - 4px); height:35px; margin:2px; position:relative; line-height:100%;} ul.frm_wrap > li ul.rdo_set li input[type="radio"] + label {padding:0; width:100%; height:100%; position:relative; border:1px solid var(--mcn_rdo_out); border-radius:3px; overflow:hidden;} ul.frm_wrap > li ul.rdo_set li input[type="radio"] + label:before {content: ''; position:absolute; top:0; left:0; padding:0; width:100%; height:100%; text-align: center; background: var(--mcn_rdo_label); border:0; border-radius:0; transition:all .2s;} ul.frm_wrap > li ul.rdo_set li input[type="radio"] + label span {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; text-align:center; transition:all .2s; color:var(--mcn_rdo_span); font-size:12px; line-height:110%;} ul.frm_wrap > li ul.rdo_set li input[type="radio"] + label span em {display:inline-block; width:100%; font-style:normal; font-size:20px; line-height:110%; transition:all .2s;color:var(--mcn_rdo_em);} ul.frm_wrap > li ul.rdo_set li input[type="radio"]:checked + label {border-color:var(--mcn_rdo_out_chk);} ul.frm_wrap > li ul.rdo_set li input[type="radio"]:checked + label:after {top:5px; left:initial; right:3px; width:2px; height:2px; background:rgba(255,255,255,0.2); display:none;} ul.frm_wrap > li ul.rdo_set li input[type="radio"]:checked + label:before {background:var(--mcn_rdo_label_chk); } ul.frm_wrap > li ul.rdo_set li input[type="radio"]:checked + label span {color:var(--mcn_rdo_span_chk);} ul.frm_wrap > li ul.rdo_set li input[type="radio"]:checked + label span em {color:var(--mcn_rdo_em_chk);} ul.frm_wrap > li ul.rdo_set.st1 li {height:35px; } ul.frm_wrap > li ul.rdo_set.st2 li {height:35px; } ul.frm_wrap > li ul.rdo_set.st3 li {height:35px; } ul.frm_wrap > li ul.rdo_set.st4 li {height:35px; } ul.frm_wrap > li ul.rdo_set.st5 li {height:35px; } ul.frm_wrap > li ul.rdo_set.st6 li {height:35px; } ul.frm_wrap > li ul.chk_set {position:relative; width:100%; font-size:0;} ul.frm_wrap > li ul.chk_set.st1{} ul.frm_wrap > li ul.chk_set.st2 {} ul.frm_wrap > li ul.chk_set.st3 {} ul.frm_wrap > li ul.chk_set.st4 {} ul.frm_wrap > li ul.chk_set.st5 {} ul.frm_wrap > li ul.chk_set.st6 {} ul.frm_wrap > li ul.chk_set {position:relative; width:100%; font-size:0;} ul.frm_wrap > li ul.chk_set li {display:inline-block; vertical-align:middle; width:calc(25% - 4px); height:35px; margin:2px; position:relative; line-height:100%;} ul.frm_wrap > li ul.chk_set li input[type="checkbox"] + label {padding:0; width:100%; height:100%; position:relative; border:1px solid var(--mcn_chk_out); border-radius:3px; overflow:hidden; background:none;} ul.frm_wrap > li ul.chk_set li input[type="checkbox"] + label:before {content: ''; position:absolute; top:0; left:0; padding:0; width:100%; height:100%; text-align: center; background: var(--mcn_chk_label); border:0; border-radius:0; transition:all .2s;} ul.frm_wrap > li ul.chk_set li input[type="checkbox"] + label span {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; text-align:center; transition:all .2s; color:var(--mcn_chk_span); font-size:12px; line-height:110%;} ul.frm_wrap > li ul.chk_set li input[type="checkbox"] + label span em {display:inline-block; width:100%; font-style:normal; font-size:20px; line-height:110%; transition:all .2s;color:var(--mcn_rdo_em);} ul.frm_wrap > li ul.chk_set li input[type="checkbox"]:checked + label {border-color:var(--mcn_chk_out_chk);} ul.frm_wrap > li ul.chk_set li input[type="checkbox"]:checked + label:after {top:5px; left:initial; right:3px; width:2px; height:2px; background:rgba(255,255,255,0.2); display:none;} ul.frm_wrap > li ul.chk_set li input[type="checkbox"]:checked + label:before {background:var(--mcn_chk_label_chk); } ul.frm_wrap > li ul.chk_set li input[type="checkbox"]:checked + label span {color:var(--mcn_chk_span_chk);} ul.frm_wrap > li ul.chk_set li input[type="checkbox"]:checked + label span em {color:var(--mcn_chk_em_chk);} ul.frm_wrap > li ul.chk_set.st1 li {height:35px; } ul.frm_wrap > li ul.chk_set.st2 li {height:35px; } ul.frm_wrap > li ul.chk_set.st3 li {height:35px; } ul.frm_wrap > li ul.chk_set.st4 li {height:35px; } ul.frm_wrap > li ul.chk_set.st5 li {height:35px; } ul.frm_wrap > li ul.chk_set.st6 li {height:35px; } .default_btn_wrap {position:relative; padding:35px 20px 50px 20px; font-size:0; text-align:center;} .default_btn_wrap input {display:inline-block; vertical-align:middle; margin:0 5px; width:200px; height:55px; font-size:13px; background:#333; color:#fff; border-radius:35px; border:0; cursor:pointer; transition:all .3s;} .default_btn_wrap input.list {background:var(--dbw_list_bg); color:var(--dbw_list);} .default_btn_wrap input.save {background:var(--dbw_save_bg); color:var(--dbw_save);} .default_btn_wrap input.save:hover {background:var(--dbw_save_bg_hover);} /* 카카오맵 터치컨트롤 */ .sht_map .cover {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); opacity: 1; visibility: visible; z-index:10;} .sht_map .cover.hidden {visibility: hidden; opacity: 0; transition: all .3s;} .sht_map .cover .cv_pos {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; text-align:center;} .sht_map .cover .cv_pos i, .sht_map .cover .cv_pos span {display:inline-block; width:100%;} .sht_map .cover .cv_pos i {font-size:50px; color:#fff; padding-bottom:15px;} .sht_map .cover .cv_pos span {font-size:11px; color:rgba(255,255,255,0.7);} .sht_map .fix_btn {position:absolute; top:15px; right:15px; background:#ed0000; color:#fff; line-height:30px; padding:0 15px 0 10px;visibility: hidden; opacity: 0; font-size:0px; transition: all .3s; border-radius:35px;} .sht_map .fix_btn.show {opacity: 1; visibility: visible; z-index:10;} .sht_map .fix_btn i, .sht_map .fix_btn span {display:inline-block; vertical-align:middle;} .sht_map .fix_btn i {font-size:16px; color:#fff; padding-right:5px;} .sht_map .fix_btn span {font-size:11px; color:#fff;} .sht_map .fix_bg {position:absolute; top:0; left:0; background:rgba(0,0,0,0.4); width:100%; height:100%;visibility: hidden; opacity: 0; transition: all .3s;} .sht_map .fix_bg.show {opacity: 1; visibility: visible; z-index:10;} .sht_map .fix_bg .act_btn {position:absolute; top:15px; right:15px; background:#348909; color:#fff; line-height:30px; padding:0 15px 0 10px;font-size:0px; transition: all .3s; border-radius:35px; visibility: hidden; opacity: 0; z-index:1;} .sht_map .fix_bg.show .act_btn {opacity: 1; visibility: visible;} .sht_map .fix_bg .act_btn i, .sht_map .fix_bg .act_btn span {display:inline-block; vertical-align:middle;} .sht_map .fix_bg .act_btn i {font-size:16px; color:#fff; padding-right:5px;} .sht_map .fix_bg .act_btn span {font-size:11px; color:#fff;} /* 카카오맵 api */ .kakao_api {position:absolute !important; top:0; left:0; width:100%; height:100%; overflow:hidden;} .kakao_api .mouse {position:absolute; top:3px; left:3px; font-size:12px; line-height:100%; text-align:left; color:rgba(0,0,0,0.8); text-align:right; z-index:2; background:rgba(255,255,255,0.8); padding:7px; border-radius:3px; transition: all .3s;} .kakao_api .mouse i {display:inline-block; vertical-align:middle; font-size:20px; padding:0 !important; margin:0 !important; line-height:12px;} .kakao_api .mouse span {float:none !important; display:inline-block !important; width:auto !important; vertical-align:middle;padding-top:2px;} .kakao_api .info_box {position:absolute; bottom:45px; left:50%; transform:translateX(-50%); width: 300px; text-align: left;border-radius: 7px ; background:#fafafa; overflow:hidden; transition: all .3s;} .kakao_api .info_box h3 {position:relative; padding:10px 30px 10px 15px; font-size:13px; color:#333; font-weight:bold; background:#f5f3f3; text-overflow: ellipsis; white-space: nowrap; overflow:hidden; transition: all .3s;} .kakao_api .info_box h3 i {position:absolute; top:50%; right:7px; transform:translateY(-50%); color:red; font-size:20px;} .kakao_api .info_box ul.detail {position:relative; padding:15px; font-size:0; white-space:normal !important;} .kakao_api .info_box ul.detail li {display:inline-block; width:100%; font-size:11px; color:#888; margin-top:7px; line-height:120%;text-overflow: ellipsis; white-space: nowrap; overflow:hidden; transition: all .3s;} .kakao_api .info_box ul.detail li:first-child {margin:0;} .kakao_api .info_box ul.detail li.url {width:auto; height:auto; margin:10px 0 0 0;} .kakao_api .info_box ul.detail li.url a {display:block; background:#fafafa; color:#888; padding:7px 7px; border-radius:3px; transition: all .3s;} .kakao_api .marker {position:absolute; bottom:20px; left:50%; transform:translateX(-50%); width: 170px; text-align: left;border-radius:7px ; font-size:0; transition: all .3s;} .kakao_api .marker:after {content:""; position:absolute; bottom:-6px; left:50%; transform:translateX(-50%); border-left:10px solid transparent; border-right:10px solid transparent; border-top:10px solid #ddd;} .kakao_api .marker h3 {position:relative; padding:10px; font-size:12px; color:var(--maker_color_h3); font-weight:normal; background:rgba(0,0,0,0.07); text-overflow: ellipsis; white-space: nowrap; overflow:hidden; transition: all .3s; border-radius:7px 7px 0 0;} .kakao_api .marker > i {position:absolute; top:0px; right:-5px; transform:translateY(-50%); color:var(--maker_color_h3); font-size:13px; width:15px; height:15px; line-height:15px; background:var(--maker_color_circle); text-align:center; border-radius:100%; z-index:1;transition: all .3s;} .kakao_api .marker ul.detail {position:relative; padding:10px; font-size:0; white-space:normal !important;} .kakao_api .marker ul.detail li {display:inline-block; vertical-align:middle; width:100%; font-size:11px; color:var(--maker_color_li); margin-top:2px; line-height:100%;text-overflow: ellipsis; white-space: nowrap; overflow:hidden; transition: all .3s; font-family:tahoma; font-weight:normal; letter-spacing:0.05em;} .kakao_api .marker ul.detail li span {display:inline-block; vertical-align:middle; width:45px; font-family:NanumBarunGothic, sans-serif; letter-spacing:0em; opacity:0.7;} .kakao_api .marker ul.detail li:first-child {margin:0;} .kakao_api .marker ul.detail li.url {width:auto; height:auto; margin:10px 0 0 0;} .kakao_api .marker ul.detail li.url a {display:block; background:var(--maker_site_bg); color:var(--maker_site_color); padding:7px 7px; border-radius:3px; transition: all .3s;} .kakao_api .marker.mk_bg_0 {background:var(--maker_color_invert0);transition: all .3s;} .kakao_api .marker.mk_bg_1 {background:var(--maker_color_invert1);transition: all .3s;} .kakao_api .marker.mk_bg_2 {background:var(--maker_color_invert2);transition: all .3s;} .kakao_api .marker.mk_bg_0:after {border-top:10px solid var(--maker_color_invert0);transition: all .3s;} .kakao_api .marker.mk_bg_1:after {border-top:10px solid var(--maker_color_invert1);transition: all .3s;} .kakao_api .marker.mk_bg_2:after {border-top:10px solid var(--maker_color_invert2);transition: all .3s;} /* 게시판 리스트 */ .ga_bd_wrap {position:relative; padding:0 35px 35px 35px; max-width:1300px; left:0; right:0; margin:0 auto;} .ga_bd_head {position:relative; padding:35px 5px 15px 5px;} .ga_bd_head p {display:inline-block; vertical-align:bottom; width:calc(100% - 110px); line-height:100%; font-size:12px; color:var(--ga_bd_head);} .ga_bd_head p span {color:var(--ga_bd_head_span);} .ga_bd_head .admin_ct_bx {display:none;} .ga_bd_head .btn_write {display:inline-block; vertical-align:bottom; width:110px; text-align:center;} .ga_bd_head .btn_write a {display:block; padding:10px 0; background:var(--ga_bd_write_bg); color:var(--ga_bd_write); font-size:13px; line-height:100%; border-radius:35px;} ul.ga_board {position:relative; font-size:0; border:1px solid var(--tb_out); border-radius:7px; overflow:hidden;} ul.ga_board.consulting {} ul.ga_board li {display:inline-block; vertical-align:middle; width:100%; color:var(--bg_ga_data_td_color); background:var(--bg_ga_board_li); transition:all .3s; position:relative; border-bottom:1px solid var(--bg_ga_data_line);} ul.ga_board li:last-child {border:0;} ul.ga_board li:hover {background:var(--bg_ga_board_li_hover);} ul.ga_board li a {display:inline-block; vertical-align:middle; color:var(--bg_ga_data_tr_td_color_a); transition:all .3s;} ul.ga_board li a:hover {color:var(--bg_ga_data_tr_td_color_a_hover);} ul.ga_board li > span {display:inline-block; vertical-align:middle; } ul.ga_board li > .date {width:90px; font-family:tahoma; font-size:11px; opacity:0.7; text-align:center;} ul.ga_board li > .title {width:calc(100% - 270px); font-size:13px; padding:15px; border:1px solid var(--bg_ga_data_line); border-width:0 1px; transition:all .3s;} ul.ga_board li > .name {width:90px; font-size:11px; opacity:0.7; text-align:center;border:1px solid var(--bg_ga_data_line); border-width:0 1px 0 0;} ul.ga_board li > .hit {width:90px; font-family:tahoma; font-size:11px; opacity:0.7; text-align:center;} ul.ga_board li > .title em {display:inline-block; line-height:100%; background: #0084f5; font-size: 11px; font-style:normal; margin-left:3px; transition: all .3s; color: #fff; padding:3px; border-radius:3px;} ul.ga_board.consulting li > .date {width:90px; font-family:tahoma; font-size:11px; opacity:0.7; text-align:center;} ul.ga_board.consulting li > .title {width:calc(100% - 430px); font-size:13px; padding:15px; border:1px solid var(--bg_ga_data_line); border-width:0 1px; transition:all .3s;} ul.ga_board.consulting li > .name {width:250px; font-size:12px; opacity:0.7; text-align:center;border:1px solid var(--bg_ga_data_line); border-width:0 1px 0 0;} ul.ga_board.consulting li > .hit {width:90px; font-family:tahoma; font-size:11px; opacity:0.7; text-align:center;} ul.ga_board li.none {border-bottom:0; font-size:12px; text-align:center; padding:100px 0;} .ic_new {display:inline-block; vertical-align:middle; background:var(--ic_new); padding:0 !important; line-height:100% !important; margin:0 5px 0 0;} .ic_new:before {content:"N"; font-size:11px; font-family:tahoma; color:#fff; text-align:center; display:inline-block;width:13px; line-height:13px;} .ga_bd_search {position:relative; text-align:center; padding:35px 15px 0 15px;} .ga_bd_search .gbs_pos {display:inline-block; max-width:500px; width:100%; font-size:0;} .ga_bd_search .gbs_pos select, .ga_bd_search .gbs_pos .frm, .ga_bd_search .gbs_pos .reset {display:inline-block; vertical-align:middle; position:relative; transition:all .3s;} .ga_bd_search .gbs_pos select {width:80px; height:40px;} .ga_bd_search .gbs_pos select {border-radius:3px; border:0; background:var(--ga_bd_search_sel) url('/images/sel_arr.gif') no-repeat right 13px center; cursor:pointer; color:var(--ga_bd_search_sel_txt);} .ga_bd_search .gbs_pos select option {background:var(--ga_bd_search_op_bg); color:var(--ga_bd_search_op_txt);} .ga_bd_search .gbs_pos .frm {width:calc(100% - 126px); margin:0 3px} .ga_bd_search .gbs_pos .frm span {position: absolute; top: 50%; left: 10px; transform: translateY(-50%); font-size: 12px; color: var(--dt_search_span); z-index: 1; transition: all .3s;} .ga_bd_search .gbs_pos .frm input {width: 100%; height: 40px; padding: 0 50px 0 90px; background: var(--dt_search_input_bg); border: none; border-bottom: 0; font-size: 13px; color: var(--dt_search_input); outline: none; transition: all .3s;border-radius: 3px;} .ga_bd_search .gbs_pos .frm input:focus {outline:none;background:var(--dt_search_input_bg_focus); transition:all .3s;} .ga_bd_search .gbs_pos .frm button {position:absolute; top:50%; right:0; transform:translateY(-50%); width:35px; height:35px; border:0; font-size:15px; background:transparent; color:var(--dt_search_button); cursor:pointer; transition:all .3s;} .ga_bd_search .gbs_pos .reset {width:40px; line-height:40px; font-size:15px; border:0; background:var(--dt_search_reset_bg); color:var(--dt_search_reset_txt); border-radius:3px; cursor:pointer; padding:0; text-align:center; transition:all .3s;} .ga_bd_skip {position:relative; text-align:center; margin-top:35px;} .ga_bd_skip > ol.skip_pos {display:inline-block; font-size:0; max-width:1260px; width:100%; padding:0 15px; position:relative; } .ga_bd_skip > ol.skip_pos > li {display:inline-block; vertical-align:middle; margin:0 5px; font-size:13px; line-height:100%;} .ga_bd_skip > ol.skip_pos > li a {display:block; padding:0; transition:all .3s; color:var(--skip_pos_li_a);} .ga_bd_skip > ol.skip_pos > li a:hover {transition:all .3s;color:var(--skip_pos_li_a_hover);} .ga_bd_skip > ol.skip_pos > li a.pg_al:after {content: '\f048'; font-family: "Font Awesome 5 Free"; font-weight: 700;} .ga_bd_skip > ol.skip_pos > li a.all_l:after {content: '\f049'; font-family: "Font Awesome 5 Free"; font-weight: 700; } .ga_bd_skip > ol.skip_pos > li a.pg_ar:after {content: '\f051'; font-family: "Font Awesome 5 Free"; font-weight: 700; } .ga_bd_skip > ol.skip_pos > li a.all_r:after {content: '\f050'; font-family: "Font Awesome 5 Free"; font-weight: 700; } .ga_bd_skip > ol.skip_pos > li a.pg_al.not, .ga_bd_skip > ol.skip_pos > li a.pg_ar.not {color:var(--skip_pos_li_a_not); cursor:default;} .ga_bd_skip > ol.skip_pos > li ol.page_no {display:inline-block; font-size:0; padding:0 5px;} .ga_bd_skip > ol.skip_pos > li ol.page_no li {display:inline-block; vertical-align:middle; min-width:20px; line-height:20px; margin:0 3px;font-size:12px; font-family:tahoma;} .ga_bd_skip > ol.skip_pos > li ol.page_no li a {display:block; color:var(--page_no_a); text-align:center;} .ga_bd_skip > ol.skip_pos > li ol.page_no li a:hover {color:var(--page_no_a_hover); } .ga_bd_skip > ol.skip_pos > li ol.page_no li.now, .ga_bd_skip > ol.skip_pos > li ol.page_no li.now:hover {color:var(--page_no_now); background:var(--page_no_now_bg); border-radius:3px;} /* 게시판 내용보기 */ .view_bbs_default {display:inline-block; width:100%; text-align:center; position:relative; padding:15px 15px 35px 15px;} .view_bbs_default .vbd_pos {display:inline-block; max-width:900px; width:100%; position:relative; } .view_bbs_default .vbd_pos .bd_titbx {display:inline-block; width:100%; position:relative; padding:50px 50px 0 50px; text-align:left;} .view_bbs_default .vbd_pos .bd_titbx h2 {display:inline-block; width:100%; position:relative; line-height:120%; font-size:22px; font-family: Noto Sans KR, sans-serif; font-weight: 500; color:var(--bd_view_h2); letter-spacing:-0.05em;} .view_bbs_default .vbd_pos .bd_titbx > span {display:inline-block; width:100%; padding:15px 5px 0 5px; position:relative; line-height:100%; font-size:12px; font-family:tahoma; color:var(--bd_view_span);} .view_bbs_default .vbd_pos .content {display:inline-block; width:100%; text-align:center; min-height:300px; margin-top:0px; padding:0; border-radius:15px; background:var(--bd_view_bg); position:relative; overflow:hidden;} .view_bbs_default .vbd_pos .content > span {display:inline-block; width:100%; text-align:center; } .view_bbs_default .vbd_pos .content > span img {width:100%;} .view_bbs_default .vbd_pos .content .pic {position:relative; padding:50px 50px 0 50px;} .view_bbs_default .vbd_pos .content .txt {position:relative; top:0; left:0; right:0; max-width:800px; width:auto; text-align:left; width:100%; font-size:15px; line-height:180%; color:var(--bd_view_txt); margin:35px auto; padding:0 50px; display:inline-block; word-wrap: break-word;} ul.down_file_box {position:relative; font-size:0; text-align:right; padding:0 50px 50px 50px;} ul.down_file_box li {display:inline-block; vertical-align:middle; border-radius:35px; border:1px solid var(--bd_down_out); background:var(--bd_down_bg);} ul.down_file_box li a {display:block; font-size:0; line-height:100%; padding:8px 17px; text-align:left; } ul.down_file_box li a span {display:inline-block; vertical-align:middle; font-style:normal; line-height:100%;font-size:12px; color:#777; transition:all .3s;} ul.down_file_box li a .name {color:var(--bd_down_name);} ul.down_file_box li a:hover .name {color:red;} ul.down_file_box li a .size {color:var(--bd_down_size); font-family:tahoma; font-size:11px; padding-left:10px;} .bd_view_btn_box {display:inline-block; width:100%; text-align:center;} .bd_view_btn_box ul.bvb_pos {display:inline-block; width:100%; padding:30px 0 0 0; font-size:0;} .bd_view_btn_box ul.bvb_pos li {display:inline-block; max-width:100px; width:calc(25% - 6px); margin:0 3px; } .bd_view_btn_box ul.bvb_pos.spc li {max-width:250px;} .bd_view_btn_box ul.bvb_pos li a {width:100%; display:block; padding:13px 0; background:var(--bd_btn_bg); color:var(--bd_btn_txt); font-size:12px;transition: all .2s; border-radius:35px; line-height:100%;} .bd_view_btn_box ul.bvb_pos li a:hover {background:var(--bd_btn_bg_hover);} /* 게시판 글쓰기 */ .ga_bd_write_box {position:relative; text-align:center;padding:35px 15px;} .ga_bd_write_box ul.bwb_form {display:inline-block; max-width:600px; width:100%; background:var(--bwb_form_bg); padding:35px; border-radius:15px;} .ga_bd_write_box ul.bwb_form > li {display:inline-block; width:100%; position:relative; margin-top:5px; text-align:left;} .ga_bd_write_box ul.bwb_form > li:first-child {margin-top:0 !important; padding-top:0 !important;} .ga_bd_write_box ul.bwb_form > li.title {margin:0; font-size:13px; text-align:left; padding:25px 0 5px 5px; color:var(--bwb_form_title); font-weight:bold;} .ga_bd_write_box ul.bwb_form > li.title em {font-style:normal; font-size:11px; display:inline-block; padding-left:5px;} .ga_bd_write_box ul.bwb_form > li.title em span {color:red;} .ga_bd_write_box ul.bwb_form > li > span {position:absolute; top:50%; left:15px; transform:translateY(-50%); font-size:12px; z-index:1; color:var(--bwb_form_span);} .ga_bd_write_box ul.bwb_form > li > input, .ga_bd_write_box ul.bwb_form > li > select, .ga_bd_write_box ul.bwb_form > li > textarea {width:100%; border:1px solid var(--bwb_form_bx_out); background:var(--bwb_form_bx_bg); font-size:12px; text-align:left; transition:all .2s; color:var(--bwb_form_bx); border-radius:3px;} .ga_bd_write_box ul.bwb_form > li > input:focus, .ga_bd_write_box ul.bwb_form > li > textarea:focus {outline:none; background:var(--bwb_form_bg_focus); border:1px solid var(--bwb_form_out_focus) !important; transition:all .2s;} .ga_bd_write_box ul.bwb_form > li > input::placeholder {color: rgba(0,0,0,0.3); font-size:11px;} .ga_bd_write_box ul.bwb_form > li > input {height:45px; padding:0 15px 0 100px;} .ga_bd_write_box ul.bwb_form > li > input.add_frm {padding:0 15px; margin-top:3px;} .ga_bd_write_box ul.bwb_form > li > input.b1 {background:#f5f3f3;} .ga_bd_write_box ul.bwb_form > li > input.b2 {background:#fafafa;} .ga_bd_write_box ul.bwb_form > li > textarea {height:200px; padding:15px; line-height:180%;} .ga_bd_write_box ul.bwb_form > li > textarea {overflow-y:overlay;} .ga_bd_write_box ul.bwb_form > li > textarea:: {-ms-overflow-style: none;} .ga_bd_write_box ul.bwb_form > li > textarea::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .ga_bd_write_box ul.bwb_form > li > textarea::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .ga_bd_write_box ul.bwb_form > li > select {height:45px !important; padding:0 15px; background: var(--ga_bd_search_sel) url('/images/sel_arr.gif') no-repeat right 13px center;color:var(--ga_bd_search_sel_txt);} .ga_bd_write_box ul.bwb_form > li > select:focus {outline:none; background: var(--ga_bd_search_sel) url('/images/sel_arr.gif') no-repeat right 13px center; border:0; transition:all .2s;} .ga_bd_write_box ul.bwb_form > li > select option {background:var(--ga_bd_search_op_bg); color:var(--ga_bd_search_op_txt);} .ga_bd_write_box ul.bwb_form > li > .txt_style {display:inline-block; width:100%; height:0; overflow:hidden; } .ga_bd_write_box .w_btn_wrp {display:inline-block; width:100%; font-size:0; margin-top:25px;} .ga_bd_write_box .w_btn_wrp input, .ga_bd_write_box .w_btn_wrp button {display:inline-block; vertical-align:middle; border:0; background:var(--w_btn_wrp_btn_bg); color:var(--w_btn_wrp_btn); cursor:pointer; padding:15px 0; text-align:center; width:150px; margin:0 2px; border-radius:35px; font-size:13px;} .ga_bd_write_box .w_btn_wrp input.list {background:var(--w_btn_wrp_btn_bg_list);} ul.board_attatch {position:relative; padding:0 !important;} ul.board_attatch li {display:inline-block; width:100%; font-size:0; margin-top:5px; position:relative;} ul.board_attatch li:first-child {margin:0;} ul.board_attatch li .att_box, ul.board_attatch li label {display:inline-block; vertical-align:middle; font-size:0; position:relative;} ul.board_attatch li .att_box i, ul.board_attatch li .att_box span {display:inline-block; vertical-align:middle; font-size:0; text-align:center; color:var(--board_attatch_no);} ul.board_attatch li .att_box {width:40px;} ul.board_attatch li .att_box i {width:50%; font-size:15px;} ul.board_attatch li .att_box span {width:50%; font-size:11px; font-family:tahoma; text-align:left;} ul.board_attatch li .att_box:hover i {color:red;transition:all .2s; } ul.board_attatch li label {width:calc(100% - 40px); border-radius:3px; overflow:hidden;} ul.board_attatch li label [type=file] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; opacity:0; } ul.board_attatch li label span {position:absolute; top:0; left:0; width:40px; height:100%; text-align:center; background:var(--board_attatch_bg); color:var(--board_attatch_txt); line-height:35px; font-size:11px; transition:all .2s; cursor:pointer;} ul.board_attatch li label span:hover {background:var(--board_attatch_bg_hover); color:var(--board_attatch_txt_hover); transition:all .2s;} ul.board_attatch li label .box_15, ul.board_attatch li label .box_35 {display:inline-block; width:100%; height:35px; padding:0 15px 0 50px; border:1px solid var(--bwb_form_bx_out); background:var(--bwb_form_bx_bg); font-size:11px; color:var(--bwb_form_bx); text-align:left; transition:all .2s;} ul.board_attatch li .old_box {position:relative; width:100%; text-align:right; font-size:0;} ul.board_attatch li .old_box .old_file, ul.board_attatch li .old_box .del_btn {display:inline-block; vertical-align:middle; cursor:pointer; transition:all .2s; margin:5px 0 2px 0;} ul.board_attatch li .old_box .old_file {width:calc(100% - 35px); border:0; background:transparent; text-align:right; padding:0 10px; font-size:11px; color:red; text-overflow:ellipsis; white-space:nowrap;} ul.board_attatch li .old_box .del_btn {width:35px; height:25px; border:0; background:var(--old_box_del); color:#eee; font-size:11px; border-radius:3px;} ul.board_attatch li .old_box .del_btn:hover {background:red; color:#ffffff;} /* 계측장비 상세내역 */ .md_box_wrap {position:relative; margin-top:35px;/*background:var(--md_box_exp);*/} .md_box {display:inline-block; vertical-align:top; position:relative;} .md_box.exp {width:50%;} .md_box.exp.spc1 {width:40%;} .md_box.exp .basic {display:inline-block; vertical-align:top; width:100%; position:relative;} .md_box.exp .basic.ar1 {} .md_box.exp .basic.ar2 {/* background:var(--md_box_ar2_bg); border:1px solid var(--bg_ga_data_line); border-width:0 1px;*/} .md_box.grp {width:50%; padding:0 0 0 35px;} .md_box .mb_set {position:relative; border-bottom:0px solid #eee; margin-bottom:30px;} .md_box .mb_set:last-child {} .md_box h2 {position:relative; font-size:15px; color:var(--md_box_h2); font-weight:bold; margin-bottom:10px;} .md_box h2 > .sta_icon {position:absolute; top:50%; right:0; transform:translateY(-50%); font-size:0;} .md_box h2 > .sta_icon .si {display:inline-block; vertical-align:middle; font-size:0; padding-left:7px; font-weight:normal;} .md_box h2 > .sta_icon .si i, .md_box h2 > .sta_icon .si span {display:inline-block; vertical-align:middle;} .md_box h2 > .sta_icon .si i {font-size: 15px;} .md_box h2 > .sta_icon .si span {font-size: 12px; padding-left:3px;} .md_box h2 > .sta_icon .si.nor {color:green;} .md_box h2 > .sta_icon .si.wrn {color:red;} .md_box ul.wrn_detail {position:relative; font-size: 0; margin-top:15px;} .md_box ul.wrn_detail li {display: inline-block; vertical-align: middle; width:100%; margin-bottom:5px; background:var(--wrn_detail_li_bg); padding:15px; border-radius:7px; position: relative; } .md_box ul.wrn_detail li:last-child {margin:0;} .md_box ul.wrn_detail li.code_info {cursor:pointer;} .md_box ul.wrn_detail li span {display: inline-block; vertical-align: middle; position: relative; font-size: 12px; color:var(--wrn_detail_span);} .md_box ul.wrn_detail li span:before {content:"ㆍ";} .md_box ul.wrn_detail li i {position: absolute; top: 50%; right:15px; transform: translateY(-50%); font-size: 15px; color:green;} .md_box ul.wrn_detail li i.pop {right:35px; color:orange;} .md_box ul.wrn_detail li.code_info:hover span {color:red;} .md_box ul.wrn_detail li.warning i {color:red;} .md_box .grp_head {position:relative;} .md_box .grp_pos {position:relative; height:450px; margin-top:15px;background:var(--wrn_detail_li_bg); border-radius:7px; padding:35px;} .md_box .grp_pos .graph_call {height:100%;} .md_box .grp_pos canvas {display:inline-block !important; width:100% !important; height:auto !important; background:transparent !important;} .md_box .ch_rlt {position:relative; margin-top:0px;} .md_box ul.select_replace {position:absolute; top:-40px; right:0; font-size:0;} .md_box ul.select_replace > li{display:inline-block; vertical-align:top; text-align:left; position:relative; margin-left:5px; font-size:0; } .md_box ul.select_replace > li:first-child {margin:0;} .md_box ul.select_replace > li.main{width:180px;} .md_box ul.select_replace > li.sub{width:80px;} .md_box ul.select_replace > li span{display:inline-block; width:100%; font-size:12px; line-height:35px; padding:0 15px; border-radius:3px; color:var(--select_replace_txt);position:relative; transition:all .3s; cursor:pointer;} .md_box ul.select_replace > li.main span{background:var(--bg_select_replace_main);} .md_box ul.select_replace > li.sub span{background:var(--bg_select_replace_sub);} .md_box ul.select_replace > li span > i{position:absolute; top:50%; right:10px; transform:translateY(-50%); font-size:13px; color:var(--select_replace_i);} .md_box ul.select_replace > li ul.sr_kind{position:absolute; top:47px; left:0; width:100%;transition:all .3s; z-index:10; visibility: hidden; opacity: 0; padding:15px; border-radius:3px;max-height:300px; height:auto;} .md_box ul.select_replace > li ul.sr_kind.show{top:37px; transition:all .3s;opacity: 1; visibility: visible; } .md_box ul.select_replace > li.main ul.sr_kind{background:var(--bg_select_replace_main);} .md_box ul.select_replace > li.sub ul.sr_kind{background:var(--bg_select_replace_sub);} .md_box ul.select_replace > li ul.sr_kind {overflow-y:overlay;} .md_box ul.select_replace > li ul.sr_kind:: {-ms-overflow-style: none;} .md_box ul.select_replace > li ul.sr_kind::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .md_box ul.select_replace > li ul.sr_kind::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .md_box ul.select_replace > li ul.sr_kind li {position:relative; font-size:12px; color:var(--sr_kind_txt); transition:all .3s; cursor:pointer; padding:3px 0;} .md_box ul.select_replace > li ul.sr_kind li:hover {color:var(--sr_kind_txt_hover);} .md_box .result_wrap {position: relative; margin-top:0px; } @media screen and (max-width: 2000px){ .md_box.exp {width:40%;} .md_box.grp {width:60%;} .md_box ul.wrn_detail {} } @media screen and (max-width: 1800px){ .md_box_wrap {margin-top:20px;} } /* 계측장비 아이콘리스트 */ ul.icon_dp {position:relative; text-align:center; margin-top:10px; font-size:0;} ul.icon_dp li {display:inline-block; vertical-align:middle; width:100%; position:relative; margin-bottom: 5px; background: var(--wrn_detail_li_bg); padding: 15px; border-radius: 7px; text-align:left; position: relative;/* border-radius:15px; background:var(--icon_dp_bg); border:1px solid var(--bg_ga_data_line);*/} ul.icon_dp li:last-child {margin:0;} /*ul.icon_dp li:after {content:""; display:block; padding-top:100%;}*/ ul.icon_dp li .id_wrp {position:relative; } ul.icon_dp li i, ul.icon_dp li h3, ul.icon_dp li p, ul.icon_dp li em {display:inline-block; vertical-align:middle; line-height:100%; transition:all .3s;} ul.icon_dp li i {width:20px; text-align:center; font-size:20px;color:var(--icon_dp_i);} ul.icon_dp li h3 {width:calc(100% - 160px); padding-left:10px; font-weight:bold; font-size:13px; color:var(--icon_dp_h3); } ul.icon_dp li h3 span {/*display:inline-block; width:100%; padding-top:3px; font-size:12px;*/ opacity:0.8; } ul.icon_dp li p {width:80px;font-size:13px; text-align:right; font-family:tahoma; color:var(--icon_dp_p);} ul.icon_dp li em {width:60px; text-align:right;font-size:11px; opacity:0.6; font-style:normal; color:var(--icon_dp_p);} /* 각사이트 정보수정 */ .care_my_site {position:relative; max-width:600px; width:100%; left:0; right:0; margin:auto;} .care_my_site .cms_pos {position:relative;border-radius:15px; overflow:hidden;} .care_my_site .cms_pos .save_btn {position:relative;background:#1a4f7c; color: #fff; display:block; font-size: 13px; text-align:center; padding:25px 0; border:0; width:100%;} .care_my_site input[type=file] {} .care_my_site input[type=file]::-webkit-file-upload-button { background:var(--fw_sbtn) !important;margin-top:9px; color:#fff; padding:0 10px; border:0 !important;min-width:75px; height:25px !important; border-radius:3px; font-size:11px; letter-spacing:-0.05em; cursor:pointer; transition:all .3s;} .care_my_site input[type=file]::-webkit-file-upload-button:hover { background:var(--fw_sbtn) !important;; transition:all .3s;} .care_my_site input[type=file]::-ms-value { width:auto; height: auto; border:1px solid #c0c0c0; padding:3px; margin: 0; outline:none; font-size:11px;} .care_my_site input[type=file]::-ms-value:hover { border:1px solid #006699; background: #ffff99; } .care_my_site input[type=file]::-ms-browse { width:auto; height: auto; border:1px solid #000000; color:white; border-radius:2px; padding:3px 10px; background:#6a6a6a; } .care_my_site input[type=file]::-ms-browse:hover { border:1px solid #0000ff; background:#0066ff; } /* 페이지 skip */ .edu_pps_set {position:relative; text-align:center; margin-top:25px;} .edu_pps_set > ol.skip_pos {display:inline-block; font-size:0; padding-top:0px; width:100%; position:relative; } .edu_pps_set > ol.skip_pos li {display:inline-block; vertical-align:middle; font-size:13px; line-height:100%;} .edu_pps_set > ol.skip_pos li a {display:block; padding:5px 7px; transition:all .3s; color:var(--bg_ga_data_td_color);} .edu_pps_set > ol.skip_pos li a.pg_al:after {content: '\f048'; font-family: "Font Awesome 5 Free"; font-weight: 700;} .edu_pps_set > ol.skip_pos li a.all_l:after {content: '\f049'; font-family: "Font Awesome 5 Free"; font-weight: 700; } .edu_pps_set > ol.skip_pos li a.pg_ar:after {content: '\f051'; font-family: "Font Awesome 5 Free"; font-weight: 700; } .edu_pps_set > ol.skip_pos li a.all_r:after {content: '\f050'; font-family: "Font Awesome 5 Free"; font-weight: 700; } .edu_pps_set > ol.skip_pos li a.pg_al.not, .edu_pps_set > ol.skip_pos li a.pg_ar.not {color:var(--bg_ga_data_td_color); opacity:0.3; cursor:default;} .edu_pps_set > ol.skip_pos li.bd_list_btn {position:absolute; top:35px; right:0; } .edu_pps_set > ol.skip_pos li.bd_list_btn a {display:block; padding:0 10px; width:100px; line-height:40px; background:#333; transition:all .3s; color:#fff; border-radius:35px;} .edu_pps_set > ol.skip_pos li ol.page_no {display:inline-block; font-size:0; padding:0 15px;} .edu_pps_set > ol.skip_pos li ol.page_no li {display:inline-block; vertical-align:middle; margin:0 3px;font-size:12px; font-family:tahoma;} .edu_pps_set > ol.skip_pos li ol.page_no li a {display:block; color:var(--bg_ga_data_td_color); padding:5px 8px; border-radius:3px;} .edu_pps_set > ol.skip_pos li ol.page_no li.now, .edu_pps_set > ol.skip_pos li ol.page_no li.now:hover {color:#fff; background:#216087; padding:5px 8px; border-radius:3px;} /* 경보알람상세 코드 리스트 */ .detail_view_box {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.6); visibility: hidden; opacity: 0; transition: all .3s; z-index:100000;} .detail_view_box.show {opacity: 1; visibility: visible; } .detail_view_box .dvb_pos {position:absolute; top:15px; right:15px; transform:translateX(100%); max-width:470px; width:calc(100% - 30px); height:calc(100% - 30px); overflow:hidden; opacity: 0; transition: all .3s; border-radius:15px;} .detail_view_box.show .dvb_pos {transform:translateX(0); opacity: 1; } .detail_view_box .dvb_pos .head_ar {position:relative; top:0; left:0; width: 100%; height: 90px; background:var(--warn_pop_head); border-bottom:1px solid var(--warn_pop_head_line); padding:35px; transition: all .3s;} .detail_view_box .dvb_pos .head_ar .ha_w {position: absolute; top:50%; left:0; transform:translateY(-50%); width: 100%;} .detail_view_box .dvb_pos .head_ar h3 {display:inline-block; width:100%; font-size:15px; font-family: 'Noto Sans KR'; font-weight: 500; letter-spacing: -0.05em; color:var(--warn_pop_head_h3); transition: all .3s; padding-left: 30px;} .detail_view_box .dvb_pos .head_ar p {display:inline-block; width:100%; font-size:12px; color:var(--warn_pop_head_h3); transition: all .3s; padding:5px 0 0 30px; opacity:0.5} .detail_view_box .dvb_pos .head_ar i {position:absolute; top:0; right:20px; transform:rotate(0deg); font-size:20px; cursor:pointer; color:var(--warn_pop_i); transition: all .3s; z-index:1;} .detail_view_box .dvb_pos .head_ar i:hover { transform:rotate(270deg);} .detail_view_box ul.detail_txt {position:relative; height: calc(100% - 90px); padding:25px; background:var(--warn_pop_content); transition: all .3s;} .detail_view_box ul.detail_txt {overflow-y:overlay;} .detail_view_box ul.detail_txt:: {-ms-overflow-style: none;} .detail_view_box ul.detail_txt::-webkit-scrollbar {background: transparent; width:2px; height:2px; border-radius:15px;} .detail_view_box ul.detail_txt::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); border-radius:15px; } .detail_view_box ul.detail_txt li {display:inline-block; width:100%;/* border-bottom:1px solid var(--bg_ga_data_line); background: var(--bg_ga_data_tr);*/ padding:5px; transition:all .3s;} .detail_view_box ul.detail_txt li:hover {background: var(--bg_ga_data_tr);} .detail_view_box ul.detail_txt li sn, .detail_view_box ul.detail_txt li tm, .detail_view_box ul.detail_txt li cod {display:inline-block; vertical-align:middle; font-size:11px; font-family:tahoma; color:var(--bg_ga_data_td_color);} .detail_view_box ul.detail_txt li sn {width:40px; text-align:center;} .detail_view_box ul.detail_txt li tm {width:calc(100% - 140px); padding-left:15px; color:var(--bg_title_h2);} .detail_view_box ul.detail_txt li cod {width:100px; text-align:right; color:var(--bg_ga_data_th_color_a);} /* 그래프 - 바 기본 */ .graph_power_bar {position:relative; height:100%; padding:0;} .gpb_bar_box {position:relative; height:100%;} .gpb_bar_box ul.gp_bar {position:absolute; bottom:0; width:100%; height:calc(100% - 50px); font-size:0; display:flex;} .gpb_bar_box ul.gp_bar li {flex:1; position:relative; border-right:1px solid var(--db_etc_line); transition:all .3s;} .gpb_bar_box ul.gp_bar li.best {} .gpb_bar_box ul.gp_bar li.today {} .gpb_bar_box ul.gp_bar li.today:before {content: "Today"; position: absolute; top: -17px;left:50%; transform: translateX(-50%); background:var(--pick_today);color: #fff; font-size: 11px; font-family: tahoma; line-height: 100%; padding: 5px; border-radius: 3px; transition:all .3s;} .gpb_bar_box ul.gp_bar li.today:after {content: ""; position: absolute; top: 3;left:50%; transform: translateX(-50%); border-left: 5px solid transparent; border-right: 5px solid transparent; border-top:5px solid var(--pick_today); transition:all .3s;} .gpb_bar_box ul.gp_bar li:last-child {border:0; background:var(--last_bg_default); transition:all .3s;} .gpb_bar_box ul.gp_bar li h4 {position:absolute; bottom:0; left:50%; transform: translateX(-50%); height:35px; line-height:35px; font-size:11px; text-align:center; color:#999; font-family:tahoma; font-weight:normal; border-top:0px solid var(--db_etc_line_strong); transition:all .3s;} .gpb_bar_box ul.gp_bar li .bbx {position:absolute; top:0; left:0; width:100%; height:calc(100% - 35px);} .gpb_bar_box ul.gp_bar li .bar {position:absolute; bottom:0; left:50%; transform: translateX(-50%); width:50%; height:0; animation: bar_data 1s forwards; background:var(--graph_bg_default); border-radius:5px; transition:all .3s;} .gpb_bar_box ul.gp_bar li.today .bar:before {content: ""; position: absolute; top: 5px; left:50%; transform: translateX(-50%); border-bottom: 5px solid rgba(255,2552,255,0.15); border-left: 3px solid transparent; border-right: 3px solid transparent;} .gpb_bar_box ul.gp_bar li .bar:after {content: attr(data-tooltip); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding:7px 7px; background: #333; color: #fff; border-radius: 3px; opacity: 0; transition: opacity 0.3s; pointer-events: none; font-size:11px; text-align:center; line-height:100%; transition:all .3s;} .gpb_bar_box ul.gp_bar li:hover .bar::after {opacity: 1;} .gpb_bar_box ul.gp_bar li .bar em {position:absolute; top:-22px; left:50%; transform:translateX(-50%); line-height:100%: text-align:center; color:var(--wt_info_txt_span); font-style:normal; font-size:11px; font-family:tahoma;} .gpb_bar_box ul.gp_bar li .bar span {position:absolute; bottom:0; left:0; width:100%; height:50%; transform:translateY(-100%); animation: jump 2.5s forwards infinite; background: linear-gradient( to top, transparent, var(--graph_bg_light), transparent); transition:all .3s;} .gpb_bar_box ul.gp_bar li.best .bar {background:var(--graph_bg_best); transition:all .3s;} .gpb_bar_box ul.gp_bar li:last-child .bar {background:var(--graph_all_bg); transition:all .3s;} .gpb_bar_box ul.gp_bar li:last-child .bar em {color:#0075dd; font-weight:bold;} .gpb_bar_box ul.gp_line {position:absolute; bottom:20; width:100%; height:calc(100% - 70px); font-size:0;} .gpb_bar_box ul.gp_line li {display:inline-block; width:100%; height:25%; position:relative; border-top:1px solid var(--db_etc_line_strong); transition:all .3s;} .gpb_bar_box ul.gp_line li:first-child {border:0;} .gpb_bar_box ul.gp_line li span {position:absolute; bottom:0; left:0; font-size:11px; display:none;} @media screen and (max-width: 2000px){ .gpb_bar_box ul.gp_bar {height:calc(100% - 20px);} .gpb_bar_box ul.gp_line {height:calc(100% - 40px);} } @media screen and (max-width: 1160px){ .graph_power_bar {height:400px;} } /* 사이트정보 상세보기 */ .machine_view {position: relative; } .machine_view h2 {font-size: 18px; font-family: Noto Sans KR, sans-serif; font-weight: 500;position:fixed; top:0; left:0; right:0; max-width: 1000px; width:100%; line-height:60px; height:60px; margin:0 auto; background:#fafafa; border-bottom:1px solid #eee; z-index:10; letter-spacing:-0.05em; padding:0 20px 0 70px;} .machine_view h2 img {position:absolute; top:calc(50% + 2px); left:20px; width:38px; transform:translateY(-50%);} .machine_view p {font-size: 11px; padding: 15px 0 0 5px; position:relative; text-align:right; color:#c36868; border-top:1px solid #333;} .machine_view .cdv_wrap {position:relative;left: 0; right: 0; margin:0 auto; max-width: 1000px; width: 100%; padding:75px 20px 20px 20px;} table.cmp_data_view {width:100%; border-top:0 solid #333 ; border-collapse:collapse; overflow: hidden; width: 100%;} table.cmp_data_view.spr {width:100%; border-top:2px solid #333 ; border-collapse:collapse; overflow: hidden; position:relative;} table.cmp_data_view tr {position:relative; overflow:hidden; transition:all .2s;} table.cmp_data_view tr th, table.cmp_data_view tr td {border:0px solid #ddd; border-width:1px 1px 1px 1px; vertical-align:middle; text-align:left; padding: 0 10px; height: 30px;line-height: 130%; font-size: 12px; position:relative; z-index:2; color:#003f77; font-weight:normal;} table.cmp_data_view tr th{width: 100px;background:rgba(0,0,0,0.05); color:#555; text-align:center !important; font-weight:bold;} table.cmp_data_view tr td{width: calc(33% - 33px); max-width:250px;} table.cmp_data_view tr th:first-child {border-width: 1px 1px 1px 0;} table.cmp_data_view tr td:last-child {border-width: 1px 0 1px 1px;} table.cmp_data_view.spr tr th{width: 100px !important;} table.cmp_data_view.spr tr td{width: calc(25% - 25px) !important;} table.cmp_data_view .sec_tit {font-size: 13px; background: transparent; padding:0 !important; border-width: 0px 0 !important; border-color: #333; font-weight:bold; color:#000;text-align:left !important;} table.cmp_data_view .sec_tit.first {border-width:0 0 0px 0 !important;} table.cmp_data_view .sec_tit .ttttt {position:relative; border:1px solid red;padding: 20px 0 5px 0; border:1px solid #333; border-width:1px 0;} table.cmp_data_view .sec_tit.first .ttttt {border-width:0 0 1px 0;} table.cmp_data_view em {float:right; font-style:normal; font-size:11px; color:#999;} .prt_bg_area {position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity:0;} .prt_bg_area > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 400px; width: auto; opacity: 0.08;} .prt_btn_area {position: fixed; top: 0; left: 0; right: 0; margin: auto; max-width: 1000px; width: 100%; height:0; z-index:1000;} .prt_btn_area button {position: absolute; top: 20px; right: 60px; border:0; background:transparent; cursor:pointer;} .prt_btn_area button i {font-size:20px; color:#555; transition:all .3s;} .prt_btn_area button:hover i {color:#000;} .prt_btn_area > i {position: absolute; top: 20px; right: 20px; font-size:22px; cursor:pointer;} .att_box_info {position:relative; font-size:0;background:#fff; } .att_box_info .att_call_wrp {position:relative; font-size:0;} .att_box_info .att_call {position:relative; margin-top:20px; border:1px solid #eee;text-align:center; display:inline-block; vertical-align:middle; width:100%;} .att_box_info .att_call.file3, .att_box_info .att_call.file4 {width:calc(50% - 10px);} .att_box_info .att_call.file3 {margin-right:10px;} .att_box_info .att_call.file4 {margin-left:10px;} .att_box_info .att_call img {max-width:900px; width:auto; max-height:900px; height: auto; object-fit:contain;} .att_box_info .att_call .no_img {position:relative; height:350px;} .att_box_info .att_call .no_img span {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:12px; color:#333;} @media print { .page_break { overflow:hidden; height:1px; page-break-before: always; } .att_call { page-break-inside: avoid; } .machine_view {position: relative;} .machine_view h2 {font-size: 15px; font-family: Noto Sans KR, sans-serif; font-weight: 500;position:relative; top:0; left:0; right:0; max-width: 1000px; width:100%; line-height:20px; height:20px; margin:0 auto; background:#fff; border:0; z-index:10;letter-spacing:-0.05em; padding:0 0 0 40px;} .machine_view h2 img {position:absolute; top:calc(50% + 2px); left:0; width:30px; transform:translateY(-50%);} .machine_view p {font-size: 9px; padding: 10px 0 0 10px; position:relative; text-align:right; color:#c36868; border-top:1px solid #333;} .machine_view .cdv_wrap {position:relative;left: 0; right: 0; margin:0 auto; max-width: 1000px; width: 100%; padding:0;} table.cmp_data_view {width:1010px; border-top:0 solid #333 ; border-collapse:collapse; overflow: hidden; position:relative;} table.cmp_data_view.spr {width:100%; border-top:2px solid #333 ; border-collapse:collapse; overflow: hidden; position:relative;} table.cmp_data_view tr {position:relative; overflow:hidden; transition:all .2s;} table.cmp_data_view tr th, table.cmp_data_view tr td {border:0px solid #999; border-width:1px 1px 1px 1px; vertical-align:middle; text-align:left; font-weight: 500; padding: 0 5px; height: 27px;line-height: 130%; font-size: 10px;/* font-weight: 500;*/ position:relative; z-index:2; color:#003f77;} table.cmp_data_view tr th{width: 100px;background:rgba(0,0,0,0.2); color:#555; text-align:center !important; font-weight:bold;} table.cmp_data_view tr td{width: calc(33% - 33px); max-width:250px;} table.cmp_data_view tr th:first-child {border-width: 1px 1px 1px 0;} table.cmp_data_view tr td:last-child {border-width: 1px 0 1px 1px;} table.cmp_data_view.spr tr th{width: 100px !important;} table.cmp_data_view.spr tr td{width: calc(25% - 25px) !important;} table.cmp_data_view .sec_tit {font-size: 10px; font-weight: 500; background: transparent; border-width: 0 0 !important; border-color: #999; color:#333; text-align:left !important;} table.cmp_data_view .sec_tit.first {border-width:0 0 1px 0 !important;} table.cmp_data_view .sec_tit.first {border-width:0 0 0px 0 !important;} table.cmp_data_view .sec_tit .ttttt {position:relative; border:1px solid red;padding: padding: 13px 0 5px 0;; border:1px solid #333; border-width:1px 0;} table.cmp_data_view .sec_tit.first .ttttt {border-width:0 0 1px 0;} table.cmp_data_view em {float:right; font-style:normal; font-size:9px; color:#999;} .prt_bg_area {position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity:1;} .prt_bg_area > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 400px; width: auto; opacity: 0.08;} .prt_btn_area button {display:none;} .prt_btn_area > i {display:none;} .att_box_info {position:relative; font-size:0;background:#fff; } .att_box_info .att_call_wrp {position:relative; font-size:0;} .att_box_info .att_call {position:relative; margin-top:20px; border:1px solid #eee;text-align:center; display:inline-block; vertical-align:middle; width:100%;} .att_box_info .att_call.file3, .att_box_info .att_call.file4 {width:calc(50% - 10px);} .att_box_info .att_call.file3 {margin-right:10px;} .att_box_info .att_call.file4 {margin-left:10px;} .att_box_info .att_call img {max-width:900px; width:auto; max-height:900px; height: auto; object-fit:contain;} .att_box_info .att_call .no_img {position:relative; height:350px;} .att_box_info .att_call .no_img span {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:12px; color:#333;} } /* 사이트 장비등록 */ .site_mc_wrap {position:relative; left:0; right:0; margin:auto; max-width:100%; width:100%; } .site_mc_wrap h2 {position:relative; font-size:20px; font-family: 'Noto Sans KR'; font-weight: 500;line-height:130%; color:#000; letter-spacing:-0.05em;padding:35px 35px 0 35px;} .site_mc_wrap h2 span {display:inline-block; font-weight: 800; color:#000; padding-left:5px; } .site_mc_wrap ul.wrn_btn_set {position:relative; display:flex; padding:35px 30px; border-top:1px solid #e9e9e9;} .site_mc_wrap ul.wrn_btn_set li {flex:1;height: 65px; position:relative; margin:0 5px;} .site_mc_wrap ul.wrn_btn_set li button {position:absolute; top:0; left:0; width:100%; height:100%; border:0; cursor:pointer; border-radius:35px;} .site_mc_wrap ul.wrn_btn_set li button span {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);color:#fff; font-size:15px; text-align:center; width:100%;} .site_mc_wrap ul.wrn_btn_set li.ok button {background:#1a4f7c;} .site_mc_wrap ul.wrn_btn_set li.cancel button {background:#999;} ul.frm_machine {position:relative; font-size:0;} ul.frm_machine > li {display:inline-block; width:100%; border-bottom:1px dashed #999; position:relative; padding:35px;} ul.frm_machine > li:last-child {border-bottom:0;} ul.frm_machine > li .df_hdbx {position:relative; padding:0px 0 0px 5px; margin-bottom:10px;} ul.frm_machine > li .df_hdbx h3 {position:relative; font-size:17px; font-family: 'Noto Sans KR'; font-weight: 500;line-height:130%; color:#000; margin-bottom:-10px;} ul.frm_machine > li .df_hdbx h3 span {position:absolute; top:5px; right:0; font-size:13px; line-height:130%; font-weight:bold; color:#333;} ul.frm_machine > li .df_hdbx h3 strong {display:inline-block; margin-right:5px; color:#af0000; border-bottom:1px solid #af0000; font-weight:normal;} ul.frm_machine > li .df_hdbx h3 i {font-style:normal; color:red;} ul.frm_machine > li .df_hdbx p {position:relative; font-size:12px; line-height:150%; padding-top:0px; color:rgba(0,0,0,0.6); display:none;} ul.frm_machine > li ul.frm_box {position:relative; width:100%; counter-reset:li; font-size:0; padding:0 2px;} ul.frm_machine > li ul.frm_box.add_tx {margin-top:15px;} ul.frm_machine > li ul.frm_box li {display:inline-block; vertical-align:middle; width:100%; position:relative; margin:2px 0; font-size:0;} ul.frm_machine > li ul.frm_box.add_tx li {margin:5px 0;} ul.frm_machine > li ul.frm_box.cut li {width:calc(50% - 2px);} ul.frm_machine > li ul.frm_box.cut li:nth-child(odd) {margin-right:2px;} ul.frm_machine > li ul.frm_box.cut li:nth-child(even) {margin-left:2px;} ul.frm_machine > li ul.frm_box li > span {position:absolute; top:50%; left:10px; transform:translateY(-50%); font-size:12px; color:#555; z-index:1;} ul.frm_machine > li ul.frm_box li > span.es {} ul.frm_machine > li ul.frm_box li > span.es:before {content:""; position:absolute; top:calc(50% - 1px); left:-8px; transform:translateY(-50%); background:red; width:2px; height:2px;} ul.frm_machine > li ul.frm_box li > em {position:absolute; top:50%; right:20px; transform:translateY(-50%); font-size:11px; z-index:1; font-style:normal; color:#777;} ul.frm_machine > li ul.frm_box li > button {position:absolute; top:50%; right:10px; transform:translateY(-50%); font-size:11px; z-index:1; font-style:normal; border:0; padding:10px 10px; line-height:100%; background:#333; color:#fff; border-radius:3px; cursor:pointer;} ul.frm_machine > li ul.frm_box li > a {position:absolute; top:50%; left:30px; transform:translateY(-50%); width:30px; height:30px; background-size:cover !important; background-position:center center !important; border-radius:100%;} ul.frm_machine > li ul.frm_box li > .mb_check {left:initial; right:10px; font-size:11px; padding:10px 15px; line-height:100%; color:#fff; border-radius:35px; cursor:pointer;} ul.frm_machine > li ul.frm_box li > .mb_check.m_id {background:#333;} ul.frm_machine > li ul.frm_box li > .mb_check.m_ur {background:red;} ul.frm_machine > li ul.frm_box li > .tx_tit, ul.frm_machine > li ul.frm_box li > .tx_con {position:relative; top:initial; left:initial; transform:none; font-size:13px; display:inline-block; vertical-align:middle;} ul.frm_machine > li ul.frm_box li > .tx_tit {width:110px; padding-left:10px;color:rgba(0,0,0,0.6);} ul.frm_machine > li ul.frm_box li > .tx_tit:before {content:"ㆍ";} ul.frm_machine > li ul.frm_box li > .tx_con {width:calc(100% - 110px);color:rgba(0,0,0,1);} ul.frm_machine > li ul.frm_box li.del {margin:10px 0;} ul.frm_machine > li ul.frm_box li input {width:100%; height:40px; padding:0 15px 0 110px; background:#fff; font-size:12px; text-align:left; transition:all .3s; color:#0081ef; border:1px solid #ddd;border-radius:3px;} ul.frm_machine > li ul.frm_box li input:focus {outline:none; background:#fff; border-color:#999; transition:all .3s;} ul.frm_machine > li ul.frm_box li input::placeholder {color: #ddd; font-size:11px;} ul.frm_machine > li ul.frm_box li input:disabled {border:3px solid var(--site_disabled) !important; cursor:not-allowed; font-weight:bold; color:var(--site_disabled); font-size:13px; background:var(--site_disabled_bg);} ul.frm_machine > li ul.frm_box li input[type="checkbox"] + label.site {margin:0 0 0 100px; font-size:11px !important; color:#000 !important;} ul.frm_machine > li ul.frm_box li .fix, ul.frm_machine > li ul.frm_box li .fix:focus {background:#fefff3; color:#333; border:1px solid #333; cursor:not-allowed; } ul.frm_machine > li ul.frm_box li.ment {font-size:12px; padding:20px 5px 7px 5px; color:#333; } ul.frm_machine > li ul.frm_box li.map {display:inline-block;} ul.frm_machine > li ul.frm_box li.map .pick, ul.frm_machine > li ul.frm_box li.map input {display:inline-block; vertical-align:middle; position:relative;} ul.frm_machine > li ul.frm_box li.map .pick {width:60px; top:0; left:0; transform:none; padding:0; line-height:40px; text-align:center; border-radius:3px 0 0 3px; background:#333;} ul.frm_machine > li ul.frm_box li.map input {width:calc(100% - 60px) !important; height:40px; border-radius:0 3px 3px 0; padding:0 30px 0 15px; font-family:tahoma; font-size:11px; background:#fefff3; color:#333;} ul.frm_machine > li ul.frm_box li.map .del {width:40px; height:100%; top:0; right:0px; left:initial; transform:none; padding:0; line-height:40px; text-align:center; background:none;} ul.frm_machine > li ul.frm_box li.map .del i {font-size:20px; color:red;} ul.frm_machine > li .mcn_grp {position:relative; margin-top:20px;} ul.frm_machine > li .mcn_wrap {position:relative;} ul.frm_machine > li .mcn_wrap:last-child {margin:0;} ul.frm_machine > li h4 {position:relative; font-weight:bold;line-height:130%; font-size:13px; line-height:130%; padding:0 0 2px 6px; color:#000;} ul.frm_machine > li h4 span{display:inline-block; padding-left:5px; font-size:11px; color:#333; display:none;} ul.frm_machine > li ul.chk_set {position:relative; width:100%; font-size:0;} ul.frm_machine > li ul.chk_set.st1{} ul.frm_machine > li ul.chk_set.st2 {} ul.frm_machine > li ul.chk_set.st3 {} ul.frm_machine > li ul.chk_set.st4 {} ul.frm_machine > li ul.chk_set.st5 {} ul.frm_machine > li ul.chk_set.st6 {} ul.frm_machine > li ul.chk_set {position:relative; width:100%; font-size:0;} ul.frm_machine > li ul.chk_set li {display:inline-block; vertical-align:middle; width:calc(25% - 4px); height:40px; margin:2px; position:relative; line-height:100%;} ul.frm_machine > li ul.chk_set li input[type="radio"] + label {padding:0; width:100%; height:100%; position:relative; border:1px solid #ddd; border-radius:3px; overflow:hidden;} ul.frm_machine > li ul.chk_set li input[type="radio"] + label:before {content: ''; position:absolute; top:0; left:0; padding:0; width:100%; height:100%; text-align: center; background: #eee; border:0; border-radius:0; transition:all .2s;} ul.frm_machine > li ul.chk_set li input[type="radio"] + label:after {content:"\e929"; position:absolute; top:50%; left:10px; font-size:20px; font-family: xeicon !important; opacity:0; color:#fff; background:none; width:0; height:0;transform: translateY(-50%);} ul.frm_machine > li ul.chk_set li input[type="radio"] + label span {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; text-align:center; transition:all .2s; color:#000; font-size:13px; line-height:110%;} ul.frm_machine > li ul.chk_set li input[type="radio"] + label span em {display:inline-block; width:100%; font-style:normal; font-size:20px; line-height:110%; transition:all .2s;color:#fff;} ul.frm_machine > li ul.chk_set li input[type="radio"]:checked + label {border-color:#555;} ul.frm_machine > li ul.chk_set li input[type="radio"]:checked + label:after {opacity:0.6;} ul.frm_machine > li ul.chk_set li input[type="radio"]:checked + label:before {background:#555; } ul.frm_machine > li ul.chk_set li input[type="radio"]:checked + label span {color:#fff;} ul.frm_machine > li ul.chk_set li input[type="radio"]:checked + label span em {color:#fff;} ul.frm_machine > li ul.chk_set li input[type="radio"]:disabled + label {border-color:#f4f4f4 !important; cursor:not-allowed; } ul.frm_machine > li ul.chk_set li input[type="radio"]:disabled + label:before {background:#f4f4f4 !important;} ul.frm_machine > li ul.chk_set li input[type="radio"]:disabled + label span {color:rgba(0,0,0,0.2);} ul.frm_machine > li ul.chk_set li input[type="radio"]:checked:disabled + label {border:3px solid var(--site_disabled) !important;} ul.frm_machine > li ul.chk_set li input[type="radio"]:checked:disabled + label:before { background:var(--site_disabled_bg) !important;} ul.frm_machine > li ul.chk_set li input[type="radio"]:checked:disabled + label span {color:var(--site_disabled); font-weight:bold;} ul.frm_machine > li ul.chk_set li input[type="checkbox"] + label {padding:0; width:100%; height:100%; position:relative; border:1px solid #ddd; border-radius:3px; overflow:hidden; background:none; margin:0;} ul.frm_machine > li ul.chk_set li input[type="checkbox"] + label:before {content: ''; position:absolute; top:0; left:0; padding:0; width:100%; height:100%; text-align: center; background: #eee; border:0; border-radius:0; transition:all .2s;} ul.frm_machine > li ul.chk_set li input[type="checkbox"] + label:after {content:"\e929"; position:absolute; top:50%; left:10px; font-size:20px; font-family: xeicon !important; opacity:0; color:#fff;transform: translateY(-50%);} ul.frm_machine > li ul.chk_set li input[type="checkbox"] + label span {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; text-align:center; transition:all .2s; color:#333; font-size:12px; line-height:110%;} ul.frm_machine > li ul.chk_set li input[type="checkbox"] + label span em {display:inline-block; width:100%; font-style:normal; font-size:20px; line-height:110%; transition:all .2s;color:#fff;} ul.frm_machine > li ul.chk_set li input[type="checkbox"]:checked + label {border-color:#0067b3;} ul.frm_machine > li ul.chk_set li input[type="checkbox"]:checked + label:after {opacity:0.6;} ul.frm_machine > li ul.chk_set li input[type="checkbox"]:checked + label:before {background:#0067b3; } ul.frm_machine > li ul.chk_set li input[type="checkbox"]:checked + label span {color:#fff;} ul.frm_machine > li ul.chk_set li input[type="checkbox"]:checked + label span em {color:#fff;} ul.frm_machine > li ul.chk_set.st1 li {height:40px; } ul.frm_machine > li ul.chk_set.st2 li {height:40px; } ul.frm_machine > li ul.chk_set.st3 li {height:40px; } ul.frm_machine > li ul.chk_set.st4 li {height:40px; } ul.frm_machine > li ul.chk_set.st5 li {height:40px; } ul.frm_machine > li ul.chk_set.st6 li {height:40px; } ul.frm_machine > li ul.chk_set {position:relative; width:100%; font-size:0;} ul.frm_machine > li ul.chk_set.st1{} ul.frm_machine > li ul.chk_set.st2 {} ul.frm_machine > li ul.chk_set.st3 {} ul.frm_machine > li ul.chk_set.st4 {} ul.frm_machine > li ul.chk_set.st5 {} ul.frm_machine > li ul.chk_set.st6 {} ul.frm_machine > li select {height:40px !important; padding:0 15px 0 100px; border:1px solid #e9e9e9; background:#fff url('/images/sel_arr.gif') no-repeat right 13px center; font-size:12px; text-align:left; transition:all .2s; color:#0081ef; border-radius:3px;} ul.frm_machine > li select:focus {outline:none; border:1px solid #999; transition:all .2s;} ul.frm_machine > li select:disabled {border:3px solid var(--site_disabled) !important; cursor:not-allowed; color:var(--site_disabled); font-weight:bold; background:var(--site_disabled_bg); opacity:1; font-size:13px;} /* 인버터상태요약 서클 */ ul.sta_circle {position:relative; font-size:0; padding:0 0 5px 10px;} ul.sta_circle li {display:inline-block; vertical-align:middle; font-size:0; margin-right:10px;} ul.sta_circle li:last-child {margin:0;} ul.sta_circle li span {font-size:15px;} ul.sta_circle li x {font-size:13px; display:inline-block; padding-left:3px; color:var(--bg_ga_data_th_color);} ul.sta_circle li.tit {font-size:12px; color:var(--bg_ga_data_th_color); font-weight:bold;} ul.sta_circle li.normal span {color:green;} ul.sta_circle li.error span {color:red;} /* 게시판 댓글 임시 */ /* 댓글수 및 권한이 없다 표시 - 댓글 기본내용css */ .cmt_li_return {display:inline-block; width:100%; padding:0 0 40px 10px; margin-bottom:30px; border-bottom:1px solid #eeeeee;} .cmt_li_return .title {display:inline-block; width:calc(100% - 120px); text-align:left; text-overflow: ellipsis; white-space: nowrap; overflow:hidden; line-height:150%; color:black;font-family:Noto Sans KR, sans-serif; font-weight:500; font-size:25px; letter-spacing:-0.05em; padding-right:10px;} .cmt_li_return .title a {color:black;} .cmt_li_return .title span {color:red; margin-right:10px;} .cmt_li_return .btn {display:inline-block; width:120px; text-align:center; background:#464646; font-size:11px; padding:10px 0; color:white;border:0px solid red;} .bd_cmt_blk {display:inline-block; width:100%; padding:50px 0 0 0;} .cmt_li_count {display:inline-block;; width:100%; padding-bottom:10px; text-align:left; font-size:13px;} .cmt_li_count span {color:red;} .cmt_li_no_p {display:inline-block; width:100%; background:#fafafa; padding:25px 0px; border:1px solid #eeeeee; border-width:1px 0; font-size:13px; margin:15px 0 0 0; display:none;} .cmt_wrp {display:inline-block; width:100%;} .cmt_li_df1 {float:left; width:100%; background:var(--bd_view_bg) ; margin-top:15px; padding:30px; color:#6a6a6a; border-radius:7px; position:relative; z-index:3;} .cmt_li_df2 {float:right; width:calc(100% - 50px); background:#f4f4f4; padding:30px; margin-top:5px; color:#6a6a6a; border-radius:7px; position:relative; z-index:2;} .cmt_li_df2:before, .cmt_li_df2:after {content:""; position:absolute; left:-25px; border:1px solid #f4f4f4; width:25px;} .cmt_li_df2:before {top:-15px; height:calc(50% + 15px);border-width:0 0 1px 1px;} .cmt_li_df2:after {bottom:0; height:50%;border-width:0 0 0px 1px;} .cmt_li_df2:last-child:after {border-width:0 !important;;} .cmt_li_df2.no_tree:after {display:none;} .cmt_li_memo {text-align:left; font-size:13px; line-height:180%; color:var(--fw_input_txt);} .cmt_li_bx {display:inline-block; text-align:left; width:100%; margin-bottom:20px; color:var(--bd_view_h2);} .cmt_li_bx .name {font-size:15px;} .cmt_li_bx .rcnd {font-size:11px; margin-left:5px; opacity:0.6;} .cmt_li_bx .date {font-size:11px; font-family:tahoma; margin-left:5px; opacity:0.6;} .cmt_li_bx .ip {font-size:11px; font-family:tahoma; margin-left:5px; opacity:0.6; display:none;} .cmt_li_bx .tool {float:right;} .cmt_li_bx .tool i {display:inline-block; font-size:16px; margin-left:5px;} .cmt_li_bx .tool img {height:15px; padding-left:5px;} /* 댓글의 댓글 추가표시 css */ .cmt_li_adbx {display:inline-block; width:100%; text-align:left; margin-top:10px;} .cmt_li_adbx .cnt {display:inline-block; font-size:11px; color:black; padding-top:5px; color:#8B8B8B;} .cmt_li_adbx .no {font-weight:bold; color:#ed366c;} .cmt_li_adbx .btn {float:right; font-size:11px; border:0px; background:#fff; border:1px solid #eee; color:#000; padding:8px 15px; line-height:100%; border-radius:35px; cursor:pointer; transition:all .3s;} .cmt_li_adbx .btn:hover {background:#fff;border:1px solid #ddd;} /* 댓글 폼css */ .cmt_fm_ipbxk {display:inline-block; width:100%; padding:30px; background:var(--bwb_form_bg); text-align:center; position:relative; z-index:4; border-radius:7px; margin-top:7px;} .cmt_fm_ipbxk.mg-t {margin-top:25px;} .cmt_fm_ipbxk.mg-t1 {margin:10px 0;} .cmt_fm_ipbxk .title {display:inline-block; width:100%; text-align:left; font-size:15px; margin-bottom:10px; color:var(--bd_view_h2);} .cmt_fm_ipbxk .info {display:inline-block; width:100%;height:0; overflow:hidden;} .cmt_fm_ipbxk ul.info {display:inline-block; width:100%; margin-bottom:5px; text-align:left; border:0px solid red; position:relative; text-align:left;} .cmt_fm_ipbxk ul.info li {display:inline-block; width:100%; position:relative; margin:3px 0 0 0;} .cmt_fm_ipbxk ul.info li span {position:absolute; top:50%; left:15px; transform:translateY(-50%); font-size:12px; color:#333; z-index:1;} .cmt_fm_ipbxk ul.info li input {width:100%; height:45px; padding:0 15px 0 70px; border:1px solid #eee; color:#000; background:#fff; font-size:12px; transition:all .2s; border-radius:7px; position:relative;} .cmt_fm_ipbxk textarea {width:100%; height:100px; padding:15px; background:var(--bwb_form_bx_bg) !important; border:1px solid var(--bwb_form_bx_out) !important;color:var(--bwb_form_bx); font-size:12px; text-align:left; transition:all .2s; border-radius:7px; position:relative;} .cmt_fm_ipbxk ul.info li input:focus, .cmt_fm_ipbxk textarea:focus {outline:none; overflow-y:overlay; transition:all .2s; } .cmt_fm_ipbxk textarea:: {-ms-overflow-style: none;} .cmt_fm_ipbxk textarea::-webkit-scrollbar {background: transparent; width:5px; height:5px; border-radius:15px;} .cmt_fm_ipbxk textarea::-webkit-scrollbar-thumb {background:rgba(0,0,0,0); border-radius:15px; transition:all .3s;} .cmt_fm_ipbxk textarea:hover::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); transition:all .3s;} .cmt_fm_ipbxk .save {display:inline-block; width:auto; line-height:100%; border:0px; background:#4e4e4e; font-size:13px; color:#fff; line-height:100%; cursor:pointer; border-radius:35px; padding:13px 25px; margin-top:15px; transition:all .2s;} .cmt_fm_ipbxk .save:hover {background:#000; transition:all .2s;} /* 댓글더보기 및 페이지스킵영역css */ .cmt_sp_ar {float:left; border-top:0px solid #eeeeee; width:100%; margin:0;} .cmt_sp_tilnk {display:inline-block; padding:10px 30px; color:black; background:#757575; color:white; font-size:11px;} .cmt_sp_tilnk:hover {background:#656465;} .cmt_sp_pos {display:inline-block; margin:0px 0; font-size:0; height:0;}