/* =========================================================
* 00. Charset / Imports
* ========================================================= */
@charset "utf-8";
@import url("https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css");
/* =========================================================
* 01. Tokens (:root variables)
* ========================================================= */
:root {
--neutraldarkdarkest: rgba(31, 32, 36, 1);
--neutraldarklight: rgba(113, 114, 122, 1);
--neutrallightlightest: rgba(255, 255, 255, 1);
--graygray-0: rgba(255, 255, 255, 1);
--op--run: #16A34A;
--op--wait: #0071fe;
--op--err: #dc2626;
--op--comm: #4b5563;
--card-border-color:#F3F4F6;
--card-border-radius:1.6rem;
}
/* =========================================================
* 02. Base / Global
* ========================================================= */
*{-webkit-font-smoothing:antialiased;box-sizing:border-box; font-size: 1.4rem; line-height: 1;}
html,body{margin:0; padding:0; box-sizing:border-box; height:100%; background-color:#F5F5F5; font-size:10px;font-family:'Pretendard',Helvetica; user-select: none;}
body{min-height:100dvh;}
body.is-modal-lock {position: fixed; width: 100%; overflow: hidden;}
html.is-layer-lock, body.is-layer-lock { overscroll-behavior: contain; }
input, select, button, textarea, optgroup{font-family:'Pretendard'}
button:focus-visible{outline:2px solid #4a90e2!important;outline:-webkit-focus-ring-color auto 5px!important;}
button {cursor: pointer;}
button > * {pointer-events: none;}
a{text-decoration:none;}
.web{display: none !important;}
/*input::-webkit-input-placeholder {font-style: italic;}
input:-ms-input-placeholder {font-style: italic;}
input::-ms-input-placeholder {font-style: italic;}*/
/* =========================================================
* 03. Inputs / Selects / Forms
* ========================================================= */
input::placeholder { color:#999999; font-size:1.4rem; opacity:1; }
input[class*="sch_"], select[class*="sch_"]{width: calc(100% - 4.6rem); height: 3.8rem; border: 1px solid #DFDFDF; border-radius: .5rem; padding: .5rem 1.6rem .5rem 4.6rem !important; background-image: url(../images/search.svg); background-repeat: no-repeat; background-position: center left 1.6rem;}
input[readonly], input[readonly="readonly"] {
border: 1px dashed #dfdfdf;
background: #f1f1f1;
}
.select:after{content:''; display: inline-block; width: 6px; height: 6px; border-right: 2px solid #999; border-bottom: 2px solid #999; transform: rotate(45deg); margin-left: 10px; margin-bottom: 2px; position: absolute; right: 1.5rem;}
.sch_select{position: relative;}
.sch_select::after{content: ''; display: inline-block; width: 6px; height: 6px; border-right: 2px solid #999; border-bottom: 2px solid #999; transform:rotate(45deg) translateY(-50%); margin-left: 10px; margin-bottom: 2px; position: absolute; top: 50%; right: 1.5rem;}
.sch_select::before{content: ''; background-image: url(../images/search.svg); display: inline-block; width: 2rem; height: 2rem; position: absolute; left: 1rem; top: 50%; transform: translate(0, -50%);}
.sch_select select{height: 3.8rem; padding: 0px 3rem 0 4rem;}
.sch-sel{background-image: url(../images/search.svg) !important; background-repeat: no-repeat !important; background-position: top 50% right 1rem !important;}
#pcSiteList { display:none; }
#pcSiteList.is-open { display:block; }
.hq-right .web{position:relative;}
#pcSiteList{position:absolute; right:0; top:calc(100% + 8px); z-index:9999; background:#fff;}
.swiper-button-next, .swiper-rtl .swiper-button-prev,
.swiper-button-prev, .swiper-rtl .swiper-button-next,
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{display: none !important;}
input:not([type="radio"],[type="checkbox"]),select, textarea, .dropzone{border:1px solid #DFDFDF; border-radius:5px;min-height: 3.8rem; padding: .5rem;}
input[class*="datePicker"]{font-size: 1.4rem; border: 1px solid #DFDFDF; border-radius: .5rem; padding: .5rem 4.6rem .5rem 1.6rem; background-image: url(../images/calendar.svg); background-repeat: no-repeat; background-position:center right 1.6rem;}
input[class*="datetimePicker"]{font-size: 1.4rem; border: 1px solid #DFDFDF; border-radius: .5rem; padding: .5rem 4.6rem .5rem 1.6rem; background-image: url(../images/calendar.svg); background-repeat: no-repeat; background-position:center right 1.6rem;}
/* =========================================================
* 04. Buttons
* ========================================================= */
.btn-st2{ background-color:#2b7fff; height: 3.8rem; padding: 1.15rem 1.7rem; box-sizing: border-box; position: relative; align-self: stretch; border-radius: 10px; color: #ffffff; font-size: 1.4rem; display: flex; justify-content: center; align-items: center;}
.btn-st3{ background-color:#8f8f8f; height: 3.8rem; padding: 1.15rem 1.7rem; box-sizing: border-box; position: relative; align-self: stretch; border-radius: 10px; color: #ffffff; font-size: 1.4rem; display: flex; justify-content: center; align-items: center;}
.btn-st8{background-color: #ffffff; color: #0071fe; border: 1px solid #0071fe;height: 3.8rem; padding: 1.15rem 1.7rem; box-sizing: border-box; position: relative; align-self: stretch; border-radius: 10px; font-size: 1.4rem; display: flex; justify-content: center; align-items: center;}
.btn-reset,
.sp-reset{height: 3.8rem; margin-left: 5px; padding: 1.15rem 1.5rem; box-sizing: border-box; position: relative; align-self: stretch; border-radius: 10px; color: #ffffff; font-size: 1.4rem; display: flex; justify-content: center; align-items: center; background-color: #868e96;}
.btn-reset:before,
.sp-reset:before{content:'\F33D'; font-family:remixicon; font-size: 2rem;}
/**/
/* =========================================================
* 05. Tabs (tbs / period)
* ========================================================= */
.tbs{display:flex;align-items:flex-start;justify-content:flex-end;gap:10px;position:relative;flex:1;/*flex-grow:1;*/}
.tbs__nav{display:flex; align-items:flex-start;padding:2px 2px;position:relative;background-color:#f3f4f6;border-radius:10px;border:1px solid;border-color:#fffefe33;}
.tbs__btn{box-sizing:border-box;display:flex; align-items:flex-start;padding:5px 12px;position:relative;border-radius:8px; font-weight: 500; color:var(--neutraldarklight);font-size:1.2rem;text-align:center;letter-spacing:0;line-height:16px;white-space:nowrap;cursor: pointer;}
.tbs__btn.is-active{background-color:#ffffff33;border-radius:8px; background-color: #ffffff; color:var(--neutraldarkdarkest);font-weight: 700;}
.tbs__panels{width: 100%; height: 100%;}
.tbs__panel {display: none; height: 100%;}
.tbs__panel .search-box{padding:0;}
.tbs__panel.is-active {display: block;}
.tbs__nav li{}
.tbs__nav li.active{border-radius:8px; background-color: #ffffff; color:var(--neutraldarkdarkest);font-weight: 700;}
.tbs + .tbs__panels .tbs__panel{ margin-top: 12px;}
.period-tab{display:flex; align-items:flex-start;padding:2px 2px;position:relative;background-color:#f3f4f6;border-radius:10px;border:1px solid;border-color:#fffefe33;}
.period-tab [data-period]{box-sizing: border-box; display: flex; align-items: flex-start; padding: 5px 12px; position: relative; border-radius: 8px; font-weight: 500; color: var(--neutraldarklight); font-size: 1.2rem; text-align: center; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.period-tab [data-period].active{border-radius: 8px; background-color: #ffffff; color: var(--neutraldarkdarkest); font-weight: 700;}
.period-content.active{display:block;}
.tbs.st1{all: unset; width:100%; display:flex;align-items:flex-start;justify-content:center;gap:10px;position:relative;flex:1;flex-grow:1;}
.tbs.st1 .tbs__nav{all: unset; display: flex; align-items: center; width:100%; height: 3.5rem; padding: 0 1rem;}
.tbs.st1 .tbs__btn{all: unset; cursor: pointer; font-weight: 600;font-size: 1.4rem; padding:1rem; height: 100%; color: #4a5565; text-align: center; letter-spacing: 0; line-height: 20px; white-space: nowrap;}
.tbs.st1 .tbs__btn.is-active{all: unset; cursor: pointer; font-size: 1.4rem; font-weight: 600; padding:.5rem 1rem 0; height: 3.5rem; color: #2b7fff; text-align: center;letter-spacing: 0;line-height: 20px;white-space: nowrap; border-bottom: 3px solid #2b7fff;}
.tbs.st1 + .tbs__panels{background: #F5F5F5;}
.site-inv-wrap .tbs.st1 .tbs__nav{padding:0 1rem;}
.site-inv-wrap .plant-detail_panels{padding:0 1rem 2rem; margin-top: -.5rem;}
.plant-detail-cont{}
.plant-detail-cont .content-wrap{gap: 1rem; padding:0;}
/*.plant-detail-cont .plant-detail_panels{padding: 0 1.6rem 1.5rem; margin-top: -.6rem;}*/
.plant-detail-cont .plant-detail_panels:has(.tbs__panel.is-active[data-tbs-panel="p-stat"]) {background:#F5F5F5;}
.siteDetail-panels .time .rev-st-bottom:before{display: none;}
.siteDetail-panels .time .rev-st-top{}
.siteDetail-panels .time .rev-st-bottom{background:#ffffff; border-top:none;}
.sd-titbox{padding:0 1rem;}
.sd-titbox h2{font-size: 2.5rem; font-weight: 600; }
.sd-titbox p{color:#6A7282; font-size:1.2rem;}
.h2box-box{display: flex; flex-direction: column; gap:1rem; margin-bottom: 1rem;}
.weather-boxwrap{display: flex; gap:.8rem}
.site-inv-wrap{display:flex; align-items:flex-start; gap:1rem;}
.site-inv-wrap > .swiper{flex:0 0 195px;}
.site-inv-wrap > .content-wrap{flex:1 1 auto; min-width:0;}
.site-inv-wrap .swiper-wrapper{flex-direction: column;}
.site-inv-wrap .inv-list-btns .inv-btn-all{width: auto !important;min-width: 14.4rem;display: flex;padding: 1rem;}
.inv-list-btns .swiper-slide:last-child{pointer-events:none;}
.site-inv-wrap .sheet__panel{min-height:35rem;}
.site-inv-wrap .sheet__panel .input-box{flex-direction: column;}
.site-inv-wrap .sheet__panel .input-box input{width:100%;}
.date-mob{display: flex; align-items: center; width: 100%; height: 3.8rem; border: 1px solid #DFDFDF; border-radius: .5rem; padding: .5rem 1.6rem .5rem 4.6rem; background-image: url(../images/search.svg); background-repeat: no-repeat; background-position: center left 1.6rem; font-size: 1.4rem;}
.p-info-card{width: calc(100% - 0rem); background: #fff; padding: 16px 16px 14px; display: flex; flex-direction: column; gap: 0.5em; padding-bottom: 2rem; background-color: #ffffff; border-radius: var(--card-border-radius); border: 1px solid var(--card-border-color); box-shadow: 0px 4px 20px -2px #0000000d;}
.site-card__grid.is-1col {display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 12px 18px;}
.p-info-card .attach-list .attach-items li{font-size:1.4rem;}
.siteDetail-panels .g3-utill{margin-top:2rem;}
.siteDetail-panels .g4-utㅑll{margin-bottom: 1rem;}
.siteDetail-panels .txt-box-display{padding:0;}
.siteDetail-panels .file-name{font-size:1.4rem;}
.siteDetail-panels .dropzone-wrap{margin:1rem 0;}
.stringDownloadBtn{display: flex; justify-content: flex-end;}
.elec-meterbox .btn-dw{width: 80.44px;}
/* MOBILE: 위아래 배치 */
/* =========================================================
* MEDIA: @media (max-width:768px){
* ========================================================= */
@media (max-width:768px){
.site-inv-wrap{flex-direction:column;}
.site-inv-wrap > .swiper{width:100%; flex:0 0 auto;}
.site-inv-wrap > .content-wrap{width:100%;}
.inv-list-btns .inv-btn-all{width: 9.6rem !important;}
.site-inv-wrap .swiper-wrapper{flex-direction: unset;}
}
/* PC: 세로 스와이프(위아래) */
/* =========================================================
* MEDIA: @media (min-width: 769px){
* ========================================================= */
@media (min-width: 769px){
/*.site-inv-wrap > .swiper{height: 360px;} !* 원하는 높이로 *!
.inv-list-btns.swiper{height: 360px;} !* swiper 컨테이너 높이 *!*/
.inv-list-btns .swiper-wrapper{flex-direction: column;} /* 세로 축 정합 */
}
/* Mobile: 가로 스와이프(좌우) */
/* =========================================================
* MEDIA: @media (max-width: 768px){
* ========================================================= */
@media (max-width: 768px){
.site-inv-wrap > .swiper{height: auto;}
}
.inv-list-btns.swiper{width:100%; padding:1.5rem 1rem;}
.inv-list-btns.swiper ul{list-style:none;padding:0;margin:0;}
.inv-list-btns{width:100%;overflow:hidden; padding: 0 1.6rem;}
.inv-list-btns .swiper-wrapper{display:flex;align-items:stretch;gap:.8rem;}
.inv-list-btns .swiper-slide{display:flex;justify-content:center;align-items:center;font-size:2rem;background:#fff;border:1px solid #ddd;border-radius:.5rem;width:auto!important;height:7rem;flex-shrink:0;padding:1rem;text-align:center;}
.inv-list-btns .inv-btn-all{width:9.6rem!important;background:#fff;font-weight:bold;font-size:1.4rem;border:1px solid #ddd;}
.inv-list-btns .swiper-slide:not(.inv-btn-all){width:auto!important;min-width:14.4rem;display:flex;background:#fff;padding:1rem;justify-content:space-between;}
.inv-list-btns .swiper-slide:not(.inv-btn-all):not(:last-of-type):hover{cursor:pointer;background:#F6F9FE;color:#0071fe;border:2px solid #0071fe;transition:border .4s,color .4s;}
.inv-list-btns .swiper-slide:not(.inv-btn-all).active{border:2px solid #0071fe;}
.inv-list-btns .swiper-slide:not(.inv-btn-all).active .tit{color:#0071fe;}
.inv-list-btns .swiper-wrapper li.active:last-of-type{border:none;}
.inv-list-btns .swiper-slide:last-of-type{border:none;background:transparent;}
.inv-list-btns .swiper-slide>.invrt-wrap{display:flex;height:100%;}
.inv-list-btns .swiper-slide>.invrt-wrap>.tit-box{display:flex;flex-direction:column;justify-content:space-between;}
.inv-list-btns .swiper-slide>.invrt-wrap>.tit-box .invert-p{display:flex;gap:.5rem;align-items:center;margin-right:1rem;}
.inv-list-btns .swiper-slide>.invrt-wrap>.tit-box>p{text-align:left;}
.inv-list-btns .swiper-slide>.invrt-wrap>.tit-box .tit{font-size:1.5rem;font-weight:700;}
.inv-list-btns .swiper-slide>.invrt-wrap>.tit-box .item01{font-size:1.2rem;color:#666;}
.inv-list-btns .swiper-slide>.invrt-wrap>.tit-box .item02{font-size:1.2rem;color:#999;}
.inv-list-btns .swiper-slide i{display:flex;justify-content:center;align-items:center;width:6rem;height:2rem;font-size:1.4rem;margin-top:-0.2em;}
.inv-list-btns .swiper-slide i.run{border:1px solid rgba(0,113,254,1);border-radius:50%;background:rgba(238,247,255,1);}
.inv-list-btns .swiper-slide i.run::before{content:'run';font-size:1.2rem;font-weight:700;color:rgba(0,113,254,1);}
.inv-list-btns .swiper-slide i.stop{border:1px solid rgba(237,23,26,1);border-radius:50%;background:rgba(255,248,248,1);}
.inv-list-btns .swiper-slide i.stop::before{content:'stop';font-size:1.2rem;font-weight:700;color:rgba(237,23,26,1);}
.inv-list-btns .inv-btn-all:hover{cursor:pointer;background:#F6F9FE;color:#0071fe;border:2px solid #0071fe;transition:border .4s,color .4s;}
.inv-list-btns .inv-btn-all.active{background:#0071fe;color:#fff;position:relative; width: auto !important;min-width: 14.4rem;display: flex;padding: 1rem;}
.inv-list-btns .inv-btn-all.active:hover{cursor:pointer;background:#F6F9FE;color:#0071fe;border:2px solid #0071fe;transition:border .4s,color .4s;}
.inverterDetail .tbs__panel.is-active{display: flex; flex-direction: column; gap: 1rem;}
/* */
.gen-trd-sch .sp-content {display: none;}
/* 열렸을 때 */
.gen-trd-sch.open .sp-content {display:flex;}
/* 실제 스크롤 영역 */
.gen-trd-sch .sp-body {height: 300px; overflow-y: auto;}
.sp-footer{display: flex; justify-content: flex-end; gap: 1rem;}
.sp-footer button{height: 3.8rem; padding: 1.15rem 1.5rem; box-sizing: border-box; position: relative; align-self: stretch; border-radius: 10px; color: #ffffff; font-size: 1.4rem; display: flex; justify-content: center; align-items: center;}
/* 클릭 영역 */
.sp-list-box{ background-color: #F6FAFE; border: 1px solid #E5E7EB; color:#797F84; padding:1rem; display: flex; gap: 0.5rem; flex-wrap: wrap;}
.gen-trd-sch .sp-top {cursor: pointer;font-size: 13px;display: inline-block;}
/* =========================================================
* 07. Tables
* ========================================================= */
table, td, th {outline: none;}
.tbl-wrap{width:100%;background:#fff;border:1px solid #e6e8ee;border-radius:6px; overflow:auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;}
.tbl-wrap table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;}
.tbl-wrap table th{position: sticky; top: 0; background:#f4f5f8;color:#666; font-size:1.4rem; font-weight:700; padding:1rem;font-size:13px;line-height:1.2; border-bottom:1px solid #e6e8ee;}
.tbl-wrap table td{padding:.4rem 1rem;font-size:1.4rem;color:#333; border-bottom:1px solid #f0f2f6; background:#fff; vertical-align:middle;}
.tbl-wrap .t-line{border-left:1px solid #f0f2f6;}
/*.tbl-wrap table tbody tr:last-child td{border-bottom:0;}*/
.siteErrorTable_mob table thead th{padding:.5rem;font-size:1.3rem;}
.siteErrorTable_mob table thead td{padding:.5rem;font-size:1.3rem;color:#333;line-height:1.35; border-bottom:1px solid #f0f2f6; background:#fff; vertical-align:middle;}
.full-tbl{width: calc(100% + 3.3rem); margin-left: -1.75rem; border-radius: 0; border-bottom: none;}
.tbl-wrap table th, .tbl-wrap table td{white-space:nowrap;o verflow:hidden; text-overflow:ellipsis; vertical-align: middle;height: 3.8rem;}
#siteErrorTable_mob td{padding:.5rem; white-space: unset;}
/* table -> stacked (mobile) */
.tb-style2{width:100%;border-collapse:separate;border-spacing:0;}
.tb-style2 colgroup{display:none;}
.tb-style2,.tb-style2 tbody,.tb-style2 tr,.tb-style2 th,.tb-style2 td{display:block;width:100%;}
.tb-style2 tr{padding:10px 0;border-bottom:1px solid #f0f2f6;}
.tb-style2 tr:last-child{border-bottom:0;}
.tb-style2 th{font-size:13px;color:#666;text-align:left;vertical-align:middle;font-weight:600;padding:0 0 8px;white-space:normal;}
.tb-style2 td{padding:0;}
.tb-style3{width:100%;border-collapse:separate;border-spacing:0;}
.tb-style3 colgroup{display:none;}
.tb-style3,.tb-style3 tbody,.tb-style3 tr,.tb-style3 th,.tb-style3 td{display:block;width:100%; width: 100%; flex-direction: column;}
.tb-style3 tr{padding: 1rem 1rem .5rem 1rem !important; display: inline-block;}
/*.tb-style3 tr{padding:10px 0;border-bottom:1px solid #f0f2f6;}*/
.tb-style3 tr:last-child{border-bottom:0;}
.tb-style3 th{all:unset; font-size:13px;color:#111;text-align:left;vertical-align:middle;font-weight:600;padding:0 0 8px;white-space:normal; border-bottom: none !important; background: #ffffff !important; min-height: auto !important; padding: 5px 14px !important;}
.tb-style3 td{padding:0;}
#dcTable thead{}
.t-r{color:#ED171A;font-weight:900;margin-left:2px;}
.point_txt{position:relative;margin:.4rem 0;padding-left:1.2rem;font-weight:500;color:#727272;line-height:1.6;font-size:1.4rem}
.point_txt:before{content:"*";position:absolute;left:0;top:0;color:#D00707}
.btn-wrap.st1{display: flex; gap: 1rem; justify-content: center;}
#siteDetailTableBodyMobile .gen-trend__body .row{border:none;}
.btn-st99 {color: #FFFFFF; background-color: rgba(0, 113, 254, 1);}
.btn-st99:hover {filter: brightness(0.85); /* 밝기를 85%로 낮춤 */ transition: filter 0.3s ease;}
.btn-dw{height: 3rem; border-radius: 0.7rem; border: 1px solid #8F9098; background: url(../images/download_2.svg) no-repeat 7px center; padding: .5rem 1rem .5rem 2rem; font-size:1.4rem; display: flex; align-items: center;}
/* =========================================================
* 08. Status / Badges / Icons
* ========================================================= */
[class^="st-ic"]{border-radius:6rem; border:1px solid #999999; background-color: #f6f6f6; padding:.3rem .3rem; min-width:5rem; display: inline-flex; justify-content: center; align-items: center;}
[class^="st-ty01-ic"]{display: inline-flex; align-items: center; gap: .5rem;}
[class^="st-ty01-ic"]:before{content:''; display: inline-block; width: 1rem; height: 1rem; border-radius: 50%;}
[class^="st-ty02-ic"]{display: flex; justify-content: center; position: relative;}
[class^="st-ty02-ic"]:before{content:''; display: inline-block; width: 4px; height: 4.3rem; position: absolute; left: -10px; top: -10px; border-radius: 5px 0 0 5px;}
[class^="st-ty03-ic"]{display: inline-flex; align-items: center; gap: .5rem; padding: .3rem 2rem; background-color: #f0f0f0; border-radius: 5rem;}
[class^="st-ty03-ic"]:before{content: ''; display: inline-block; width: 1rem; height: 1rem; border-radius: 50%;}
.st-ic.ok{background-color:#f5fff3; color:#23890b; border-color: #23890b}
.st-ic.error{background-color: #fff8f8; color:#ED171A; border-color:#ED171A;}
.st-ic.wait{background-color: #f6f6f6; color:#0071FE; border-color:#0071FE;}
.st-ic.comm{background-color: #fffcf3; color:#999999; border-color:#999999;}
[class^="st-ty"].ok:before{background-color:#23890b;}
[class^="st-ty"].error:before{background-color:#ED171A;}
[class^="st-ty"].wait:before{background-color: #0071FE;}
[class^="st-ty"].comm:before{background-color:#999999;}
.form_check {height: 2rem; display: inline-block; position: relative; z-index: 0; padding-left: 2.5rem; padding-top: .5rem; vertical-align: top; cursor: pointer;}
.form_check label { cursor: pointer; }
.form_check label::before { position: absolute; left: 0; top: 0.1rem; z-index: -2; width:2rem; height:2rem; border: 1px solid #ddd; border-radius:.3rem; background-color: #fff; content: ''; }
.form_check label::after { position: absolute; top: auto; left: auto; right: auto; left: 0; top: 0.1rem; z-index: -1; width: 2rem; height: 2rem; border-radius:.3rem; color: #ffffff; content: '\f00c';font-family: 'Font Awesome 6 Free'; font-weight: 900; text-align: center; line-height: 2rem; opacity: 0; -webkit-transition: all 0.2s; transition: all 0.2s; }
.form_check input { position: absolute; left: 0; top: 0; opacity: 0; }
/*.form_check input:focus + label::before { outline: 1px dotted #000; }*/
.form_check input:checked + label::after { opacity: 1; background: #0071fe;}
.form_check:last-child { margin-right: 0; }
.form_check.st1 {height:4rem; padding-left: 5rem; vertical-align: middle;}
.form_check.st1 label::before {width: 4rem; height: 4rem; border-radius:50%;}
.form_check.st1 input:checked + label::before {background-color:#01a2d0;}
.form_check.st1 label{display: flex; align-items: center; height: 4rem;font-size: 2rem;}
.form_check.st1 label *{ font-size:2rem;}
.form_check.st1 label > div{display: flex; align-items: baseline;}
.form_check.st1 label > div span{margin-right:.5rem;}
.form_check.st1 label span{color:rgba(1, 162, 208, 1)}
.form_check.st1 label::after {font-size: 2.6rem; display: flex; justify-content: center; align-items: center; z-index: -1; width: 4rem; height: 4rem; color: #dfdfdf; opacity: 1;}
.form_check.st1 input:checked + label::after {color:#ffffff;}
/* s:트리메뉴*/
.menu-tree-container { border:1px solid #ddd; border-radius:.25rem; padding:1rem; background:#fff; }
.menu-tree-list { list-style:none; padding-left:0; column-count:3; column-gap:1.5rem; }
.menu-tree-list > .menu-group { break-inside:avoid-column; -webkit-column-break-inside:avoid; margin-bottom:3rem;padding: 2rem;background: #f4f8fa; border-radius: .5rem; }
.submenu-list { list-style:none; padding-left:1rem; margin-top:.3rem; }
.submenu-list > .level-2 { display:block; padding:.2rem .6rem; margin:2rem 0 .6rem 0; border-left:1px solid #ccc; border-radius:.25rem; break-inside:avoid-column; -webkit-column-break-inside:avoid; }
.submenu-list > .level-3 { margin:.25rem 0 .25rem 2rem; padding-left:1rem; border-left:1px dashed #ddd; line-height:1.3; }
.menu-tree-list input[type="checkbox"] { margin-right:5px; cursor:pointer; vertical-align:middle; }
.menu-tree-list label { cursor:pointer; font-weight:500; font-size:1.3rem; vertical-align:middle; }
.menu-tree-container::-webkit-scrollbar { width:6px; }
.menu-tree-container::-webkit-scrollbar-thumb { background:#ccc; border-radius:3px; }
.menu-tree-container::-webkit-scrollbar-thumb:hover { background:#aaa; }
/*loading*/
/* =========================================================
* 09. Loading
* ========================================================= */
.loading{display:none;}
.loading .dimd{width: 100%; height: 100%; position: fixed; top: 0; left: 0;background-color:rgba(0,0,0,0.8);z-index:300;}
.loading .loading_img { width:50px; height:50px; display:grid; border-radius:50%; -webkit-mask:radial-gradient(farthest-side,#0000 40%,#000 41%); background: linear-gradient(0deg, rgba(255, 255, 255, .4) 50%, #ffffff 0) center / 4px 100%, linear-gradient(90deg, rgba(255, 255, 255, .4) 50%, rgba(255, 255, 255, .4) 0) center / 100% 4px; background-repeat: no-repeat; animation: s3 1s infinite steps(12);position: absolute;top: calc(50% - 25px);left: calc(50% - 25px);z-index:301; }
.loading .loading_img::before { content:""; grid-area:1/1; border-radius:50%; background:inherit; opacity:0.915; transform:rotate(30deg); }
.loading .loading_img::after { content:""; grid-area:1/1; border-radius:50%; background:inherit; opacity:0.83; transform:rotate(60deg); }
/*login*/
/* =========================================================
* 10. Login / Join
* ========================================================= */
.lyt-sub {display:flex; justify-content:center; align-items:center; width:100%; height:100%; min-height:60rem; font-size: 1.6rem; }
.lyt-sub.bg { background:#f9f9f9; }
.lyt-sub.st01 { flex-direction:column; }
.lyt-sub.st01 .login.fnb { background:#f4f4f4; width:100%; position:absolute; bottom:0; display:flex; justify-content:center; }
.lyt-sub.st01 .login.fnb ul { display:flex; justify-content:space-between; width:48rem; }
.lyt-sub.st01 .login.fnb a { padding:2rem; display:inline-block; }
/* 탭바 기본: 하단 고정 */
/* =========================================================
* 11. Tabbar
* ========================================================= */
.tabbar{ position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; transform: translate3d(0,0,0); transition: transform .18s ease; will-change: transform; padding-bottom: env(safe-area-inset-bottom);}
/* 숨김 상태 */
.tabbar.is-hide{transform: translate3d(0, 110%, 0);}
/*!* 내부 스크롤 컨테이너가 있을 때만 *!
#main, .content-wraper{
-webkit-overflow-scrolling: touch;
}*/
.login_form {background-color:transparent;border:none;width:100%; border-radius: 1.6rem; padding: 4rem; display: flex; flex-direction: column; gap: 4rem; font-size: 1.4rem;}
.login_form input{width:100%;}
.login_form .login-utill a{padding:1rem 1rem;display:inline-block;}
.login_form .login-utill a,
.login_form .login-utill button{font-size: 1.4rem;}
.login_form .login-submit button{padding:1.5rem 1rem!important;}
.login_form h1.login { font-weight:normal; display:flex; flex-direction:column; align-items:center; }
.login_form h1.login:before { content:''; display:inline-block; background:url(../images/qcellhanwha_2x.png) no-repeat center center; background-size:contain; width:18.7rem; height:7.3rem; }
.login_form h1.login span { overflow:hidden; position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0; clip:rect(0,0,0,0); }
.pw-box{position: relative;}
.pw-toggle{ position:absolute; right:10px; bottom:0; transform:translateY(-50%); width:24px; height:24px; cursor:pointer; border:none; background-size:20px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M8 11.9994C8 14.2086 9.79086 15.9994 12 15.9994C12.7286 15.9994 13.4117 15.8046 14 15.4643L8.42015 10.2129C8.15128 10.7506 8 11.3573 8 11.9994Z' fill='%23C6C6C6'/%3E%3Cpath d='M3 5L20 21' stroke='%23C6C6C6' stroke-width='1.6' stroke-linecap='round'/%3E%3Cpath d='M16 17.2682C14.8258 17.7193 13.4859 17.9991 12 17.9991C7 17.9991 3 14.1657 2.5 11.9991C3.00465 10.9057 4.09505 9.3878 5.71979 8.15234' stroke='%23C6C6C6' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M9.69727 6.26126C10.4173 6.09414 11.1855 6 12.0005 6C17.2005 6 20.5005 9.83333 21.5005 12C21.2807 12.9522 20.4816 14.2263 19.1878 15.3555' stroke='%23C6C6C6' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.6173 9.00445C10.9838 8.82449 11.3906 8.70994 11.8234 8.67733C13.6258 8.54155 15.1959 9.87843 15.3304 11.6633C15.3747 12.252 15.2574 12.8159 15.0155 13.3121' stroke='%23C6C6C6' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center; }
#passwd[type="text"] + button{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") no-repeat center;}
/*
.pw-toggle.active { background-size:20px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") no-repeat center; }
*/
.login-info,
.member_join { display:flex; flex-direction:column; gap:1.6rem; }
.login-info .un-line,
.member_join .un-line { text-decoration-color:#dddddd; text-decoration-thickness:.01rem; }
.login-info .input-box,
.member_join .input-box { position:relative; width:100%; display:flex; flex-direction:column; gap:1rem; }
.login-info .input-box label,
.member_join .input-box label { order:1; }
.login-info .input-box input,
.member_join .input-box input {width: 100%; padding: 1.13rem 10px; box-sizing: border-box; border: 1px solid #cccccc; border-radius: .5rem;}
.login-info .input-box > input,
.login-info .input-box > div,
.member_join .input-box > input,
.member_join .input-box > div { order:2; }
.login-info .input-box input[id="userId"]:focus-within label:after,
.member_join .input-box input[id="userId"]:focus-within label:after { content:''; font-size:1.4rem; margin-left:1rem; }
.login-info .input-box input[id="userId"]:not(:placeholder-shown) ~ label:after,
.member_join .input-box input[id="userId"]:not(:placeholder-shown) ~ label:after { content:''; font-size:1.4rem; margin-left:1rem; }
.login-info .input-box .fld,
.member_join .input-box .fld { display:flex; gap:1rem; }
.login-info .input-box .fld input,
.member_join .input-box .fld input { flex:1; }
.login-info .input-box.vcode-box,
.member_join .input-box.vcode-box { display:none; }
.login-info .check-box,
.member_join .check-box { display:flex; margin-top:1rem; gap:1.3rem; }
.login-info .login-submit,
.member_join .login-submit { display:flex; flex-direction:column; gap:1rem; }
.login-info .login-submit button,
.member_join .login-submit button { width:100%; padding:1rem 2rem; height:4.2rem; border-radius: .5rem; display:flex; justify-content:center; align-items:center; }
.login-info .login-submit button.st02,
.member_join .login-submit button.st02 { background:#293b5d; }
.login-info .login-submit button.st03,
.member_join .login-submit button.st03 { background:#4D6EDB; }
.login-info .login-submit button.st04,
.member_join .login-submit button.st04 { background:#ffffff; border:1px solid #d8d8d8; color:#333333; }
.login-info .login-submit button.st04:hover,
.member_join .login-submit button.st04:hover { background-color:#01a2d0; border:1px solid transparent; color:#ffffff; animation:all .5s; }
.login-info .login-submit button.st05,
.member_join .login-submit button.st05 { background:#01a2d0; border:1px solid transparent; }
.login-info .login-submit button.st05:hover,
.member_join .login-submit button.st05:hover { background-color:#ffffff; border:1px solid #01a2d0; color:#333333; animation:all .5s; }
.login-info .login-submit button.st06,
.member_join .login-submit button.st06 { background:linear-gradient(90deg,#0229A0,#25A8BA,#2CB7B4); }
.login-info .login-utill,
.member_join .login-utill { margin-top:1.9rem; padding-top:3.2rem; border-top:1px solid #EAEAEA; }
.login-info .login-utill.st1,
.member_join .login-utill.st1 { padding:0; border-top:none; margin-top:0; }
.login-info .login-utill > div .btn-join,
.member_join .login-utill > div .btn-join { display:flex; justify-content:center; align-items:center; width:100%; border-radius:.5rem; border:1px solid #0071fe; background:#ffffff; color:#0071fe; height:4.2rem; }
.login-info .login-utill > div ul,
.member_join .login-utill > div ul { display:flex; gap:2rem; margin-top:1.9rem; border-top:1px solid #EAEAEA; padding-top:1rem; }
.login-info .login-utill > div ul li,
.member_join .login-utill > div ul li { flex:none; }
.login-info .login-utill ul,
.member_join .login-utill ul { display:flex; justify-content:center; }
.login-info .login-utill ul li,
.member_join .login-utill ul li { flex:1; text-align:center; }
.login-info .hp-code,
.member_join .hp-code { position:relative; flex:1; }
.login-info .hp-code .time,
.member_join .hp-code .time { position:absolute; top:50%; right:8px; color:#ed171a; transform:translate(0,-50%); }
.auth-box{display:flex; gap:.5rem; flex-wrap: wrap;}
.auth-box .auth-chk input{overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0 none; clip: rect(0, 0, 0, 0);}
.auth-box .auth-chk label{font-size: 1.4rem; border:1px solid #dddddd; border-radius:2rem; padding:.5rem 1.12rem; display: inline-flex; justify-content: center; align-items: center; cursor: pointer;}
.auth-box .auth-chk input:checked + label{background-color:#0071fe; border-color:#0071fe; color: #ffffff;}
.member_join .inp_wrap{display: flex; gap: 1rem;}
.member_join .inp_wrap .item03{flex:1;}
.refer{display: block; position: relative; padding-left:1rem; margin-top: 1rem; color: #9A9EA7; font-size:1.2rem; line-height: 1.4rem; font-weight: 500;}
p.refer::before { content: '※'; position: absolute; top: 0; left: 0;}
.period-content{display: none;}
#addressSearchModalContent>div,
#addressSearchModalContent>div>iframe{width:100% !important;}
.blk-hd{display:flex;height:39.99px;align-items:center; justify-content: space-between; gap:7.99px;position:relative;align-self:stretch;width:100%;}
.sec-ttl{position:relative; height:27.96px; display: flex; align-items: center;}
.sec-ttl .ttl-lb{position:relative;left:1px;width:159px;height:28px;display:flex; align-items: center;}
.sec-ttl .txt{margin-top:-1.1px; height:1.4rem; font-weight:700;color:#707070;font-size:1.4rem;letter-spacing: .05rem; line-height:14px;white-space:nowrap; display: flex; align-items: center;}
.sec-ttl .txt button{margin-left:1rem;}
.pagenation{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top: 1rem; margin-bottom: 1.5rem;}
.pagenation .page-link,
.pagenation .page-num{min-width:35px;height:35px;padding:0 12px;border:1px solid #E5E7EB;background:#fff;color:#6B7280;border-radius:10px;font-size:16px;font-weight:600;line-height:1;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;user-select:none;transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease;}
.pagenation .page-group{display:flex;align-items:center;gap:10px;}
.pagenation .page-link:hover:not(.disabled),
.pagenation .page-num:hover:not(.active){background:#F9FAFB;border-color:#D1D5DB;color:#374151;}
.pagenation .page-num.active{background:#1D4ED8;border-color:#1D4ED8;color:#fff;box-shadow:0 6px 14px rgba(29,78,216,.18);}
.pagenation .page-link.disabled{opacity:.45;pointer-events:none;cursor:default;}
.pagenation .material-icons-round{font-size:20px;line-height:1;vertical-align:middle;}
.pagenation .page-link:focus-visible,
.pagenation .page-num:focus-visible{outline:2px solid rgba(29,78,216,.35);outline-offset:2px;}
.pagenation .page-info{display:none;}
.mob + .pagenation .page-link{border:1px solid transparent}
/* 카드 폭이 좁을 때(JS가 .is-compact를 붙임) */
.pagenation.is-compact{gap:12px;}
.pagenation.is-compact .page-group{display:none;}
.pagenation.is-compact .page-info{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:auto;
height:44px;
padding:0 10px;
color:#6B7280;
font-size:14px;
font-weight:600;
white-space:nowrap;
}
/* 페이지네이션도 줄어들 수 있게 */
.pagenation { min-width: 0; }
/* 숫자 묶음이 넘치면 줄바꿈/압축(원하면) */
.pagenation { flex-wrap: wrap; row-gap: 6px; }
.pagenation .page-group { flex-wrap: wrap; }
.pagenation .page-info { white-space: nowrap; }
/* =========================================================
* MEDIA: @media (max-width:768px){
* ========================================================= */
@media (max-width:768px){
/*.pagenation[data-ui="web"]{display:none;}
.pagenation[data-ui="mob"]{display:flex;}*/
.pagenation .page-group{display:none;}
.pagenation .page-info{display: flex;}
}
.pagenation[data-ui="mob"]{display:none;}
.pagenation[data-ui="web"]{display:flex;}
/* =========================================================
* 06. Cards / Layout
* ========================================================= */
.card{width: 100%; background: #fff; border-radius: 16px; border: 1px solid #f3f4f6; box-shadow: 0 4px 20px -2px #0000000d; padding:1.5rem;}
.card header{padding:0; height: auto; display: flex; justify-content: space-between;}
.main .card{padding-top:0;}
/**/
#wrap{display:flex;flex-direction:column;min-width:375px; width:100%; /*height: 100vh;*/ align-items:flex-start; position:relative;background-color:#f3f4f6;}
/*#wrap{background-image: url(../images/sample/sample2.png); background-repeat: no-repeat; background-position:-17px 9px;}*/
#wrap.subst-1{background-color:#ffffff;}
.content-wraper > header{position:relative;align-self:stretch;display: flex;justify-content: space-between;align-items: center;width:100%;height:56px;border-bottom:1px solid #e8e8e8;padding:0 1rem;}
body.sub01 .content-wraper{background-color:#ffffff;}
main{width:100%;}
main header{border-bottom:none;}
.board-info-desc{display: flex; flex-direction: column; gap: 1rem; align-items: end; justify-content: space-between;}
.board-list-l{}
.board-list-r{}
.board-info-desc .btn-wrap{display: flex; gap: .5rem;}
.board-info-desc button.btn-st2,
.board-info-desc button.btn-st8{height:3.3rem}
.btn-excelwrap{display: flex; gap:.5rem;}
.content-wrap{display: flex; flex-direction: column; align-items: flex-start; gap: 25px; padding: 0px 0px 10px;}
.top_utill{display: flex; justify-content: flex-end; align-items: center; gap: 1.2rem; position: absolute; right: 1rem; z-index: 1; top: 50%; transform: translateY(-50%);}
.top_utill li{display: flex; align-items: center; width:2.2rem; height: 2.5rem;}
.top_utill li.item03{width:3.2rem; height: 3.2rem;justify-content: center;}
.top_utill li>div{display: inline-block; width: 2.2rem; height: 2.5rem; background-repeat: no-repeat; background-position: center;position: relative;}
.top_utill li > div a{display: inline-block; width: 100%; height: 100%;position: relative;}
.top_utill li > div a#goMyPage:before{content: ''; position: absolute; background-color: #F3F4F6; width: 3.2rem; height: 3.2rem; display: inline-block; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%;}
.top_utill .item01{display:none;}
.top_utill .item01 > div{background-image: url(../images/tutill01.svg);}
.top_utill .item02 > div{background-image: url(../images/tutill02.svg);}
.top_utill .item03 > div{background-image: url(../images/tutill03.svg);}
.top_utill .item04{display:none;}
.top_utill .item04 > div{ background-image: url(../images/logout_01.svg);}
/* =========================================================
* 12. Header / GNB
* ========================================================= */
.hq-header i.logo{display: inline-block; background-image: url(../images/qcell_logo.svg); background-position: center; background-size: contain; background-repeat: no-repeat; width: 10rem; height: 3rem;}
.hq-header{position: relative; width: 100%; padding: 1rem 2rem; background:#fff;border-bottom:1px solid #e9ecef; display: flex; flex-direction: column; height: auto; gap:1rem;}
.hq-header__inner{width:100%; height: 44rem; display: flex; justify-content: space-between; align-items: center; position: relative;}
.hq-header__inner .hd-home{display: flex; align-items: center;}
.alram:after{content:''; width:.8rem; height:.8rem; display: inline-block; border-radius:50%; background-color: #D72424;position: absolute; top:0px; left: 1.2rem;}
/*
.hq-header__inner{width:100%; height:72px;padding:0 28px;display:flex;align-items:center; justify-content: space-between; gap:28px;}
*/
.agree-webcard h3{margin-bottom:6.5rem; font-size: 4.8rem; font-weight: 600;}
.pg-tit{overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0 none; clip: rect(0, 0, 0, 0);}
.hq-header__inner > div{display: flex;gap: 6rem;align-items: center; z-index: 11;}
.hq-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#111;min-width:max-content;}
.hq-brand__mark{width:34px;height:34px;display:block;}
.hq-brand__text{font-size:22px;font-weight:800;letter-spacing:-0.4px;}
.mh-gnb__toggle{flex:0 0 auto;border:1px solid #dde3ec;background:#fff;border-radius:10px;height:38px;padding:0 12px;font-weight:700;cursor:pointer}
/* gnb (PC 기본) */
/*.mh-gnb{position:relative}
.mh-gnb__panel{position:absolute; max-width:1200px;margin:0 auto; top: -24px;}
.mh-gnb__list{list-style:none;margin:0;padding:0;display:flex;align-items:stretch;gap:5px}
.mh-gnb__item.M300{position:relative;min-width:3rem}
.mh-gnb__item.M340{min-width:11rem;}
.mh-gnb__item.M230{min-width:12rem}
.mh-gnb__item.M800{min-width:7rem;}
.mh-gnb__item.M900{min-width:11rem;}
.mh-gnb__item{position:relative;min-width:9rem;display: flex; flex-direction: column;
align-items: center;}
.mh-gnb__link{display:inline-flex;align-items:center;height:44px;padding:0 6px;text-decoration:none;color:#111;font-weight:600; position: relative;}
.mh-gnb__link.is-active:after{content: '';
position: absolute;
width: calc(100% + 1.58rem);
height: 3px;
background: var(--op--wait);
left: -8px;
bottom: -15px;
border: 1px solid var(--op--wait);}*/
/*!* ===== mobile accordion ===== *!
@media (max-width:1024px){
.mh-gnb__list{flex-direction:column;align-items:stretch;gap:0;border:1px solid #e6e8ee;border-radius:14px;overflow:hidden;}
.mh-gnb__link{justify-content:space-between;border-bottom:1px solid #eef0f3;border-radius:0;padding:14px 14px;background:#fff;}
.mh-gnb__item:last-child > .mh-gnb__link{border-bottom:0;}
.mh-gnb__sub{position:static;min-width:0;border:0;border-top:1px solid #eef0f3;border-radius:0;box-shadow:none; padding:8px 12px 12px;}
}*/
.tabbar-menu .mh-gnb__list{display: flex; flex-direction: column; gap: 0;}
.tabbar-menu .mh-gnb__list li{position: relative;}
.tabbar-menu .mh-gnb__item {width: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center;}
.tabbar-menu .mh-gnb__panel{}
#footer .mh-gnb__item:hover>.mh-gnb__link,
#footer .mh-gnb__item.is-active>.mh-gnb__link{color:#2b4bff}
.mh-gnb__item.M700{display: none !important;}
.tabbar-menu .mh-gnb__item.M800{}
.tabbar-menu .mh-gnb__item.M800:before,
.tabbar-menu .mh-gnb__item.M900:before{content: '\f105'; font-family: fontawesome; display: inline-block; width: auto; height: auto; font-size:1.4rem; vertical-align: middle; line-height: 1; margin-left: auto; font-weight: 500; transition: transform .3s; opacity: 1; background-color: transparent; z-index: 2; position: absolute; right: 1rem; top: 1.2rem; transform:rotate(90deg);}
.tabbar-menu .mh-gnb__item.M800.is-open:before,
.tabbar-menu .mh-gnb__item.M900.is-open:before{transform:rotate(-90deg);}
.tabbar-menu #gnb .mh-gnb__sub{display: none;}
.tabbar-menu #gnb .mh-gnb__item.is-open > .mh-gnb__sub{display: block;}
.tabbar-menu .mh-gnb__item{display: flex; flex-direction: column; align-items: flex-start;}
.tabbar-menu .mh-gnb__sub{}
.tabbar-menu .mh-gnb__sub li{}
.tabbar-menu .mh-gnb__sub li a{padding: 10px 8px; display: inline-block; font-size: 1.4rem;}
.mh-gnb__backdrop{position:fixed;inset:0;background:transparent}
/* ========== Mobile: 드로어 + 아코디언 ========== */
.hq-header .mh-gnb{display: none;}
.tabbar-menu .mh-gnb__link{font-size: 1.4rem;}
.tabbar-menu .mh-gnb.is-open .mh-gnb__panel{transform:translateX(0)}
.tabbar-menu .mh-gnb__top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px;border-bottom:1px solid #e8edf4}
.tabbar-menu .mh-gnb__title{font-size:15px}
.tabbar-menu .mh-gnb__close{border:1px solid #dde3ec;background:#fff;border-radius:10px;height:34px;padding:0 10px;font-weight:700;cursor:pointer}
.tabbar-menu .mh-gnb__list{flex:1 1 auto;overflow:auto;flex-direction:column;gap:0;padding:8px}
.tabbar-menu .mh-gnb__item{border-bottom:1px solid #eef2f7;min-width:0}
.tabbar-menu .mh-gnb__link{width:100%;justify-content:space-between;padding:1rem;}
.tabbar-menu .mh-gnb__sub{position:static;min-width:0;border:0;box-shadow:none;padding:0 10px 12px;display:none}
.hq-right{display:flex;align-items:center;gap:14px;min-width:max-content;position: absolute; right:3.2rem;}
.hq-right .openSheetBtn{width: 2rem; height: 2rem; display: inline-block;background-image: url(../images/search-top.svg); position: absolute; right:5rem;}
.hq-right .openSheetBtn span{display: none;}
.hq-actions{display:flex;align-items:center;gap:10px;}
.hq-iconbtn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:#666;border-radius:10px;cursor:pointer;}
.hq-iconbtn svg{width:18px;height:18px;}
.hq-iconbtn:hover{background:#f3f5f7;color:#333;}
.hq-search{position:relative;}
.hq-search__icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:#9aa0a6;}
.hq-search__icon svg{width:18px;height:18px;display:block;}
.hq-search__input{width:260px;height:38px;padding:0 12px 0 40px;border:1px solid #e6e8eb;border-radius:10px;outline:none;font-size:14px;color:#222;}
.hq-search__input::placeholder{color:#9aa0a6;}
.hq-search__input:focus{border-color:#cfd4da;box-shadow:0 0 0 3px rgba(0,0,0,0.04);}
.range-ui {position: relative;}
.range-ui .range-view {width: 100%; cursor: pointer; background: #fff;}
.range-ui .bz-dd {position: absolute; inset: 0; opacity: 0;}
/* =========================================================
* MEDIA: @media (max-width:1024px){
* ========================================================= */
@media (max-width:1024px){
.hq-nav__list{gap:18px;}
.hq-search__input{width:210px;}
}
/* =========================================================
* MEDIA: @media (max-width:860px){
* ========================================================= */
@media (max-width:860px){
.hq-nav{display:none;}
}
.weather-boxwrap{}
.weather-boxwrap i#sky_data{background: url(../images/wi-st004.png);}
.weather-boxwrap li{display: flex; align-items: center;}
.weather-boxwrap span{color:#6A7282; font-size:1.2rem}
.weather-boxwrap i{display: inline-block; width: 2rem; height: 2rem; background-repeat: no-repeat;}
.ic-sr{background: url(../images/sunrise.svg);}
.ic-ss{background: url(../images/sunset.svg);}
.sd-titbox{display: flex; flex-direction: column; gap:.5rem;}
.sd-titbox.card{box-shadow: unset; padding:0 1rem; border:unset; }
.weather-wrapper{display: flex; flex-direction: column; gap:.5rem;}
body:not(.main):not(.join-step-member) .content-wraper{display:flex;flex-direction:column;gap:1rem;}
body:not(.main) .content-wraper.st1 .tbl-wrap{}
body:not(.main) .content-wraper .contents.st2{display: flex; flex-direction: column; gap: 1rem;}
body:not(.main) .content-wraper .contents .body-sys{display: flex; flex-direction: column; gap: 1rem;}
body:not(.main) .content-wraper > .contents{padding:1rem 2rem;}
.contents.item1{display: flex; flex-direction: column; gap: 1rem;padding: 0 2rem 4rem;}
form#frm_00{display: flex; flex-direction: column; gap: 1rem;}
.main .content-wraper{display: flex; flex-direction: column; gap:2rem;}
#main .content-wraper .inner-1,
#main .content-wraper .inner-2{ display:flex; flex-direction: column; width:100%; gap:2rem; padding: 0 1rem;}
.gen-st{min-width: 355px; display:flex;flex-direction:column; height:192px; align-items:flex-start;padding:15px;position:relative;align-self:stretch;width:100%; flex:0 0 auto;border-radius:15px;overflow:hidden;box-shadow:0px 4px 6px -4px #0000001a,0px 10px 15px -3px #0000001a;background:linear-gradient(117deg,rgba(35,83,247,1) 0%,rgba(32,81,244,1) 100%);}
/* =========================================================
* 13. Units (t-unit)
* ========================================================= */
.gen-st [class*="t-unit-"]:after{position: absolute; bottom: 0; left: 11rem;}
.gen-st .sec-ttl .ttl-lb{align-items: unset;}
.gen-st .sec-ttl .txt{margin-top:-1.1px; color:#ffffff;}
.gen-st [class*="t-unit-"]:after{color:rgba(255,255,255,.8);}
.gen-st-tab{color: #ffffff; display: flex; flex-direction: column; height: calc(100% - 1.5rem); justify-content: space-around;margin-top:.5rem;}
.gen-st-tab .ico{display: inline-block; width: 4.1rem; height: 4.1rem; background-repeat: no-repeat; background-position: center;}
.gen-st-tab > div{display: flex; gap:2.5rem; align-items: center;}
.gen-st-tab .item01{}
.gen-st-tab .item01 .ico{background-image: url(../images/realTimeActivePowerTimeHour.svg);}
/*.gen-st-tab .item01 .ico .material-symbols-outlined {font-variation-settings:'FILL' 0, 'wght' 200, 'GRAD' 0, 'opsz' 24; font-size: 4.1rem}*/
.gen-st-tab .item01 .txt{font-weight:700;color:#ffffff;font-size:5rem;letter-spacing:0;line-height:4rem;display:flex;justify-content: flex-end; align-items: baseline; width: 11rem;}
.gen-st-tab .txt{position:relative;}
.gen-st-tab .item02{display: flex; margin-top: 0rem;align-items: self-end;}
.gen-st-tab .item02 .ico{background-image: url(../images/realTimeActivePowerValHour.svg); background-position-y:1.2rem;}
.gen-st-tab .item02 .ico .material-symbols-outlined {font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 200, 'opsz' 40;font-size: 4.1rem; transform: scaleX(-1);}
.gen-st-tab .item02 .txt{font-weight:400;color:#ffffff;font-size:2.5rem;letter-spacing:0; line-height: 2rem; display: flex; align-items: baseline;justify-content: flex-end; width: 11rem;}
.gen-st .tbs{display:flex;align-items:flex-start;justify-content:flex-end;gap:10px;position:relative;flex:1;flex-grow:1;}
.gen-st .tbs__nav{display:flex;width:112.09px;height:30px;align-items:flex-start;padding:2px 2px 0px;position:relative;background-color:#ffffff1a;border-radius:10px;border:1px solid;border-color:#fffefe33;}
.gen-st .tbs__btn{box-sizing:border-box;display:flex;width:35.05px;height:24px;align-items:flex-start;padding:4px 12px;position:relative;border-radius:8px; font-weight: 500; color:#ffffff;font-size:1.2rem;text-align:center;letter-spacing:0;line-height:16px;white-space:nowrap;}
.gen-st .tbs__btn.is-active{box-sizing:border-box;display:flex;width:35.05px;height:24px;align-items:flex-start;padding:4px 12px;position:relative;background-color:#ffffff33;border-radius:8px;}
.gen-st .tbs__btn.is-active {background: rgba(255, 255, 255, .2); color: #fff;}
.gen-st .tbs__panels{width: 100%; margin-bottom: -1.5rem;}
.gen-st .tbs__panel {display: none; margin-top:0px;}
.gen-st .tbs__panel.is-active {display: block;}
[class*="t-unit-"]:after{content:''; font-weight:400;color:#6a7282;font-size:1.4rem;letter-spacing:0;line-height:1.4rem;white-space:nowrap; margin-left: .5rem;}
.t-unit-time:after{content:'시간'}
.t-unit-kwh:after{content:'kWh'}
.t-unit-kw:after{content:'kW'}
.t-unit-kwp:after{content:'kWp'}
.t-unit-mwh:after{content:'MWh'}
.t-unit-gwh:after{content:'GWh'}
.t-unit-kdalla:after{content:'원'}
.t-unit-smp:after{content:'원/kWh'}
.t-unit-rec:after{content:'원/REC'}
.t-unit-gaeso:after{content:'개소'}
.t-unit-per:after{content:'%'}
.tunit-current{display: none;}
.t-unit-temp:after{content:'℃'}
.search-box{display: flex; flex-direction: column; gap: 1rem; padding:0 1rem;}
.search-box input{width:100%; height:3.8rem;}
.search-box .search-group{display: flex;flex-direction: column; gap: 1rem;}
.search-box .search-item{display: flex; gap: 1rem; flex-direction: column; align-items: flex-start;}
.search-box .search-item .input-box{width: 100%; display: flex;flex-direction: column; gap: .5rem; align-items: flex-start;}
.search-box .search-item .input-box span,
.search-box .search-item .input-box span input{width: 100%;}
.search-box .search-item .input-box.type1{flex-direction: row;}
.search-box .search-item label{white-space: nowrap; font-size: 1.4rem; color:#8b93a1;}
#searchSiteName{width:100%;}
.search-box .btn-wrap {display: flex; gap: .5rem; width: 100%;}
.search-box .btn-wrap a,
.search-box .btn-wrap button{width:100%;}
.search-box.st1 .search-item{flex-direction: row;}
form#frm_00 .search-box{padding:0;}
.search-item.st1{flex-direction: column; align-items: flex-start;}
.mob-bzdd, .mob-bzdd > span, .mob-bzdd > span input{width: 100%;}
.inverterDetail .tbl-util{width: 100%; display: flex; justify-content: space-between; flex-direction: row-reverse; margin: 1rem 0;}
.str-info-content .tbl-util,
.error-info-content .tbl-util{display: flex; flex-direction: row; gap: 1rem;justify-content: flex-end;}
.sselect-wrap{}
.sselect-wrap .sselect-head{height: 3.8rem; border: 1px solid #d5d9e0; border-radius: .5rem; padding: .5rem 1.6rem .5rem 4.6rem; background-image: url(../images/search.svg); background-repeat: no-repeat; background-position: center left 1.6rem; display: flex; align-items: center;color:#999999; font-size:1.4rem; }
.sselect-wrap .sselect-box{display: none; position: absolute; z-index: 1; background: #ffffff; padding: 1rem 0; right: 0;}
.sselect-wrap .sselect-list{height: 24rem; overflow-y: auto;}
.sselect-wrap.active .sselect-box{display: block;}
.sselect{position:relative;}
.top-sselect {display: flex; flex-direction: column; gap: 1rem;}
.top-sselect .sselect-search-wrap{position: relative; border: 1px solid #DFDFDF; border-radius: .5rem;}
.top-sselect .sselect-search-wrap input{display: inline-block; width: 100%; height: 100%; border: none;}
.top-sselect .sselect-clear{position: absolute; right: 0}
#site-select-wrap .sheet__body{height: 40rem; padding: 1rem;}
.top-sselect .sselect-list{display: flex; flex-direction: column; gap: 1rem; border: 1px solid #d5d9e0; border-radius: .5rem; margin-top: .5rem;}
.top-sselect .sselect-list li{}
.topsearch-box{}
.topsearch-box .sselect-clear{display: none;}
.topsearch-box .sselect-box {width: 100%;}
.topsearch-box .sselect-list{gap:0;}
.topsearch-box .sselect-list li{padding:1rem;}
.rev-st{min-width:355px;height:201px; overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;position:relative;align-self:stretch;gap:1rem;}
.rev-st-bottom{width: 100%; position: relative; background: #f9fafb; padding: 1.4rem 1rem 1rem 1.4rem;}
.rev-st.card{padding:0;}
.rev-st> div:first-of-type{height:9.4rem; width: 100%; display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 1.5rem; background-image: url('../images/rev-st-bg.svg'); background-repeat: no-repeat; background-position: bottom 9px right 20px;;}
.rev-st .blk-hd,
.rev-st .rev-st-top{padding:1.5rem 0.5rem 0rem 1.5rem;}
.rev-st-top{}
.rev-st-top .txt{position:relative;width:fit-content;margin-top:-1px;font-weight:700;color:#000;font-size:30px;letter-spacing:0;line-height:30px;white-space:nowrap;}
.rev-st-bottom:before{content: ''; width: .6rem; height: .6rem; display: inline-block; border: 1px solid #F4F4F4; border-top-width: 1px; border-left-width: 1px; background: #f9fafb; position: absolute; color: transparent; top: -.4rem; left: 2rem; transform: rotate(45deg)}
.rev-st-cont{display:flex;height:38px;align-items:center;justify-content:space-between;padding:5px 10px 5px 2.5px;position:relative;align-self:stretch;width:100%;}
.rev-st-cont .tit{font-weight:500;color: #aeaeae;font-size: 16px;letter-spacing: 0;line-height: 16px;white-space: nowrap;}
.rev-st-cont .val{}
.rev-st-cont .val .txt{font-weight: 700; color: #373737; font-size: 18px; letter-spacing: 0; line-height: 24px; white-space: nowrap;}
.smprec-wrap{gap:20px;align-self:stretch;width:100%;flex:0 0 auto;display:flex;align-items:flex-start;position:relative; flex: 1 1 0; min-width: 0;}
.smprec-box{height: 12rem; display: flex; flex-direction: column; gap: 1.8rem; justify-content: space-between; padding: 8px 13px 15px; flex: 1; background: #ffffff; border-radius: var(--card-border-radius); border: 1px solid var(--card-border-color); box-shadow: 0px 4px 20px -2px #0000000d;}
.smprec-box .blk-hd{height:4.3rem; gap: 0;}
.smprec-box .blk-hd .sec-ttl{display: flex; align-items: center;}
.smprec-cont{display:flex;flex-direction:column;align-items:flex-end;position:relative;align-self:stretch;width:100%;flex:0 0 auto;}
.smprec-val{position:relative; display:flex; align-items: baseline; justify-content:center; font-weight:700; color:#101727; font-size:24px; line-height:36px; white-space:nowrap;}
.smprec-trend{font-weight: 600; font-size: 14px; text-align: right; letter-spacing: 0; line-height: 16px; white-space: nowrap; display: flex;}
.smprec-trend.t-unit-kdalla:after{font-weight: 600; color: inherit; font-size: 14px; text-align: right; letter-spacing: 0; line-height: 16px; white-space: nowrap;margin-left: 0;display: flex; align-items: baseline; justify-content: end;margin-left:.2rem;}
.smprec-trend:after{display: inline-block; margin-right: 2px;}
.smprec-trend.up{color:#fa2b36;}
.smprec-trend.up:before{content:'▲';margin-right: 5px;}
.smprec-trend.down{color:#005EB8}
.smprec-trend.down:before{content:'▼';margin-right: 5px;}
.smprec-trend.ep{color:#101727;}
.smprec-trend.ep:before{content:'−';margin-right: 5px;}
.smprec-wrap .tbs{display:flex;align-items:flex-start;justify-content:flex-end;/* gap:10px; */position:relative;flex:1;flex-grow:1;}
.smprec-wrap .tbs__nav{display:inline-flex; width: auto; height:24px;align-items:center;justify-content:center;padding:2px 2px 0;position:relative;flex:0 0 auto;background:#f3f4f6;border-radius:10px;}
.smprec-wrap .tbs__btn{box-sizing:border-box;display:inline-flex;height:20px; font-size: 1.4rem; color:#495565; align-items:center;justify-content:center;padding:0 6px;position:relative;flex:0 0 auto;border-radius:8px;}
.smprec-wrap .tbs__btn.is-active{background:#2b7fff; border-radius:8px; color:#ffffff;}
.site-st{display: flex; flex-direction: column; gap: 0.5em; padding-bottom: 2rem;background-color:#ffffff; border-radius:var(--card-border-radius); border:1px solid var(--card-border-color); box-shadow:0px 4px 20px -2px #0000000d;}
.site-st .blk-hd{padding:3rem 1.4rem; display: flex; justify-content: space-between; align-items: center;}
.site-st-total{}
.site-st-total .val{font-size: 2rem; font-weight: 600;}
.site-st-cont{display: flex; flex-direction: row; padding: 0rem 1.5rem; gap: 1rem; flex-wrap: nowrap; width: 100%;}
.site-st-cont .active{border-radius: 8px; /*border: 1.5px solid #0071FE !important; background-color: #eef6ff !important;*/box-shadow: 0px 0px 0px 3px #0071fe inset}
.site-st-cont > div{display: flex; gap: .5rem; flex: 1; flex-direction: column; align-items: center; padding-bottom: 1rem;background-color:#ffffff; border-radius:var(--card-border-radius); border:1px solid var(--card-border-color); box-shadow:0px 4px 20px -2px #0000000d;}
.site-st-cont-hd{display: flex; flex-direction: column; gap: 1.5rem; width: 100%; padding: 1rem 0;}
.site-st-cont-hd .site-st-icobox{display: flex; flex-direction: column; align-items: center; gap: 1rem;}
.site-st-ico{width: 10px; height: 10px; display: inline-block; border-radius: 50%;}
.site-st-txt{color:#6B7280; font-size:1.2rem; font-weight:bold}
.site-st-cont-val{text-align: center; font-size: 2rem; font-weight: 600;}
.site-st-cont .progress{display: flex; flex-direction: column; height: 8px; position: relative; width: calc(100% - 2.5rem); background-color: #e5e7eb; border-radius: 33554400px;}
.site-st-cont .progress-bar{height:100%; background-color: #2b7fff; border-radius: 33554400px;}
.site-st-cont .progress-bar[style="width: 0%;"]{width:100% !important; background-color: #daeafe;}
.site-st-cont-hd.st1 .site-st-ico{background-color:var(--op--run)}
.site-st-cont-hd.st2 .site-st-ico{background-color:var(--op--wait)}
.site-st-cont-hd.st3 .site-st-ico{background-color:var(--op--err)}
.site-st-cont-hd.st4 .site-st-ico{background-color:var(--op--comm)}
.site-st-cont-hd.st1 .site-st-cont-val{color:var(--op--run)}
.site-st-cont-hd.st2 .site-st-cont-val{color:var(--op--wait)}
.site-st-cont-hd.st3 .site-st-cont-val{color:var(--op--err)}
.site-st-cont-hd.st4 .site-st-cont-val{color:var(--op--comm)}
.plant-lst{border: 1px solid #dddddd; border-radius: 1.6rem;}
.plant-lst .blk-hd{/*padding-left: 1.4rem;*/ /*padding-top: 1rem;*/}
.plant-lst .gen-trd-cont{width: 100%; display: flex; flex-direction: column; padding:.5rem 0 1rem}
.gen-trd-cont .gen-trd-sch{}
.plant-lst.gen-trd-cont .plant-lst-cont{}
.plant-lst .plant-lst-cont.mob{padding:0; display: flex; flex-direction: column; gap: .5rem;}
.plant-lst-items{display: flex; justify-content: space-between;align-items:flex-end;gap:8px;padding:10px;position:relative;align-self:stretch;width:100%;flex:0 0 auto;background-color:#ffffff;border-radius:10px;border:1px solid;border-color:#f2f4f6;}
.plant-lst-hds{display:inline-flex;align-items:flex-start;gap:10px;position:relative;align-self:stretch;flex:1}
.plant-lst-st{padding-top: .5rem;}
.plant-lst-st .item{width: 15px; height: 15px;border-radius:50%;}
.plant-lst-st .item.status-normal{background-color:var(--op--run);}
.plant-lst-st .item.status-standby{background-color:var(--op--wait);}
.plant-lst-st .item.status-fault{background-color:var(--op--err);}
.plant-lst-st .item.status-comm{background-color:var(--op--comm);}
.plant-lst-info{display: flex; flex-direction: column; gap: .5rem;}
.plant-lst-info .heading{font-weight: 600; color: #101727; font-size: 16px; letter-spacing: 0; line-height: 24px; white-space: nowrap;}
.plant-lst-meta{display: flex; gap: 1rem;}
.plant-lst-meta .plant-lst-add{font-weight: 400; color: #697282; font-size: 12px; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-lst-meta .plant-lst-vol{font-weight: 400; color: #697282; font-size: 12px; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-lst-meta .plant-lst-vol > div:after{font-weight: 400; color: #697282; font-size: 12px; letter-spacing: 0; line-height: 10px; white-space: nowrap;}
.plant-lst-conts{display: inline-flex; flex-direction: column; justify-content: space-around; align-items: flex-start; gap: 10px; position: relative; align-self: stretch; flex: .7;1}
.plant-cont-vol{display: flex; gap:1.5rem; width: 100%; justify-content: space-between;}
.plant-time,
.plant-kwh{display: flex;}
.plant-time > span,
.plant-kwh > span{font-weight: 500; color: #333333; font-size:1.8rem; text-align: right; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-time > span:after,
.plant-kwh > span:after{font-weight: 400; color: #99a1af; font-size: 9px; text-align: right; letter-spacing: 0; line-height: 9px; white-space: nowrap;}
.plant-progress{display: flex; gap: .5rem; align-items: center; width: 100%;}
.plant-progress .pct-bar{display:flex;flex-direction:column;height:8px;align-items:flex-start; position:relative;align-self:stretch;width:100%;background-color:#e5e7eb;border-radius:33554400px;overflow:hidden;}
.plant-progress .progress-bar{width: 100%; background-color: #e5e7eb; border-radius: 33554400px;}
.plant-progress .pct-bar{background-color:#2b7fff;}
.plant-progress .progress-txt{font-size: 1rem; line-height: 1rem; color: #99A1AF;}
.plant-lst-cont table{width:100%;border-collapse:separate;border-spacing:0;background:#ffffff;font-size: 1.4rem;}
.plant-lst-cont thead th{padding:1.4rem 1.6rem;font-size:1.2rem;font-weight:600;color:#6b7280;background:#F8FAFC;border-bottom:1px solid #e5e7eb;text-align:center; vertical-align: middle;}
.plant-lst-cont thead th:nth-child(n+2){text-align:center;}
.plant-lst-cont tbody tr{border-bottom:1px solid #f1f5f9;}
.plant-lst-cont tbody td{padding:1.4rem 1.6rem;vertical-align:middle; border-bottom: 1px solid #F1F5F9;}
.plant-lst-cont tbody td:nth-child(n+2){text-align:center;font-variant-numeric:tabular-nums;}
.plant-lst-cont .site{display:flex;gap:1rem;align-items:flex-start;}
.plant-lst-cont .dot{width: 1.7rem;height: 1.7rem;border-radius:50%;margin-top:.4rem;flex:0 0 auto;}
.plant-lst-cont .dot.run{background-color: var(--op--run);}
.plant-lst-cont .dot.wait{background-color: var(--op--wait);}
.plant-lst-cont .dot.err{background-color: var(--op--err);}
.plant-lst-cont .dot.comm{background-color: var(--op--comm);}
.plant-lst-cont .site-txt{display: flex; flex-direction: column; gap: .6rem;}
.plant-lst-cont .site-name{font-weight:700;color:#111827;}
.plant-lst-cont .site-sub{font-size:1.2rem;color:#6b7280;}
.plant-lst-cont .site-sub b{font-weight:600;color:#374151;}
.plant-lst-cont .rate{display:flex;flex-direction:column;align-items:center;gap:.6rem;}
.plant-lst-cont .bar{position: relative;width:12rem;height: 1rem;background:#eaf2ff;border-radius:999px;overflow:hidden;}
.plant-lst-cont .bar i{position: absolute;display: inline-block;height: 100%;left: 0;background-color: #2b7fff;}
.plant-lst-cont .bar>span{display:block;height:100%;background:#10b981;border-radius:999px;}
.plant-lst-cont .pct{font-size:1.2rem;font-weight:600;color:#374151;}
.plant-lst-cont .bar[data-value="0"]>span{width:100%!important;background:#daeafe;}
.plant-lst-cont .status-normal{background:#22c55e;}
.plant-lst-cont .status-standby{background:#0071fe;}
.plant-lst-cont .status-fault{background:#dc2626;}
.plant-lst-cont .status-comm{background:#6b7280;}
.plant-lst-items{display: flex; justify-content: space-between;align-items:flex-end;gap:8px;padding:10px;position:relative;align-self:stretch;width:100%;flex:0 0 auto;background-color:#ffffff;border-radius:10px;border:1px solid;border-color:#f2f4f6;}
.plant-lst-hds{display:inline-flex;align-items:flex-start;gap:10px;position:relative;align-self:stretch;flex:1}
.plant-lst-st{padding-top: .5rem;}
.plant-lst-st .item{width: 15px; height: 15px;border-radius:50%;}
.plant-lst-st .item.status-normal{background-color:var(--op--run);}
.plant-lst-st .item.status-standby{background-color:var(--op--wait);}
.plant-lst-st .item.status-fault{background-color:var(--op--err);}
.plant-lst-st .item.status-comm{background-color:var(--op--comm);}
.plant-lst-info{display: flex; flex-direction: column; gap: .5rem;}
.plant-lst-info .heading{font-weight: 600; color: #101727; font-size: 16px; letter-spacing: 0; line-height: 24px; white-space: nowrap;}
.plant-lst-meta{display: flex; gap: 1rem;}
.plant-lst-meta div{flex:1;}
.plant-lst-meta .plant-lst-add{font-weight: 400; color: #697282; font-size: 12px; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-lst-meta .plant-lst-vol{font-weight: 400; color: #697282; font-size: 12px; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-lst-meta .plant-lst-vol > div:after{font-weight: 400; color: #697282; font-size: 12px; letter-spacing: 0; line-height: 10px; white-space: nowrap;}
.plant-lst-conts{display: inline-flex; flex-direction: column; justify-content: space-around; align-items: flex-start; gap: 10px; position: relative; align-self: stretch; flex: .7;1}
.plant-cont-vol{display: flex; gap:1.5rem; width: 100%; justify-content: space-between;}
.plant-time,
.plant-kwh{display: flex;}
.plant-progress{display: flex; gap: .5rem; align-items: center; width: 100%;}
.plant-progress .pct-bar{display:flex;flex-direction:column;height:8px;align-items:flex-start; position:relative;align-self:stretch;width:100%;background-color:#e5e7eb;border-radius:33554400px;overflow:hidden;}
.plant-progress .progress-bar{width: 100%; background-color: #e5e7eb; border-radius: 33554400px;}
.plant-progress .pct-bar{background-color:#2b7fff;}
.plant-progress .progress-txt{font-size: 1rem; line-height: 1rem; color: #99A1AF;}
.gen-trd{display: flex; flex-direction: column; border: 1px solid #dddddd; border-radius: 1.6rem;}
/*.gen-trd .blk-hd{padding: 3.5rem 1.5rem 2.7rem 0;}*/
.gen-trd .blk-hd{padding: 1.5rem 0rem 1.5rem 0;}
.gen-trd .gen-trd-cont{}
.gen-trd .chart-box{position: relative; width: 100%;}
.chart-box #siteLineChart div:nth-of-type(2){z-index: 9 !important;;}
.plant-lst{min-width:300px;gap:0;padding:15px;flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;position:relative;align-self:stretch;width:100%;background-color:#ffffff;border-radius:16px;border:1px solid;border-color:#f3f4f6;box-shadow:0px 4px 20px -2px #0000000d;}
.plant-lst-search{display: flex; gap:.5rem; width: 100%; margin-bottom: 1.5rem;}
.plant-lst-search .ri-loop-right-line{font-weight: 100;}
.plant-lst-search .ri-loop-right-line:before{font-family: 'remixicon'; font-size: 1.4rem;}
.siteListResetBtn{}
.siteListResetBtn .ri-loop-right-line:before{font-family: 'remixicon'; font-size: 1.4rem;}
.plant-lst-cont{display:flex;flex-direction:column;align-items:flex-start;gap:5px;position:relative;align-self:stretch;width:100%;flex:0 0 auto;}
.plant-lst-search input{flex:1;}
.plant-lst,.gen-trd{gap:1rem;}
.plant-lst .txt-point{font-size: 1.3rem; color: #878787; margin-left: 1rem;}
.plant-lst .won-mark{margin-left: .5rem; position: relative;}
.plant-lst .won-mark:hover:before{content: '발전소명 클릭시 상세로 이동합니다';color: #878787; position: absolute; left: 2.3rem; width: 17rem; font-size: 1.2rem;font-weight: 500;}
.plant-lst .won-mark.hide:before {display: none !important;}
.gen-trd{min-width:355px;/* gap: .9rem; */padding:16px 15px 15px;flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;position:relative;align-self:stretch;width:100%;background-color:#ffffff;border-radius:16px;border:1px solid;border-color:#f3f4f6;box-shadow:0px 4px 20px -2px #0000000d;}
.gen-trd-cont{width:100%; display: flex; flex-direction: column;}
.gen-trd-cont .gen-trd-sch{display: flex; justify-content: space-between; width: 100%; gap: .5rem;}
.gen-trd-cont .gen-trd-sch .btn-sm1{display: none;}
.gen-trd-cont .gen-trd-sch .select-panel{position:relative; display: flex; flex: 1; height: 3.8rem;}
.gen-trd-cont .gen-trd-sch .select-panel,
.gen-trd-cont .gen-trd-sch .select-panel > div,
.gen-trd-cont .gen-trd-sch .select-panel .gen-trd-sch .sp-top {width:100%;}
.gen-trd-cont .gen-trd-sch .select-panel .web{width: 100%;}
.gen-trd-cont .gen-trd-sch .select-panel .sp-content{position: absolute; top: 5rem; width: 100%; background: #ffffff; z-index: 1; flex-direction: column; gap: 1rem; border: 1px solid #E5E7EB; border-radius: 1rem; padding: 1rem;}
.gen-trd-cont .gen-trd-sch .select-panel .sp-content ul{display: flex; flex-direction: column; gap: 0.85rem;}
.gen-trd-cont .gen-trd-sch .sp-top{display: flex; width: 100%;}
.gen-trd-cont .gen-trd-sch .sp-top input:not([type="checkbox"]){width:100%; height: 3.8rem;}
.gen-trd-cont .plant-lst-cont{width: 100%; margin-left: 0;padding: 1rem;}
.gen-trd-cont .plant-lst-cont li{font-size:1.4rem; display: flex; align-items: center;}
.gen-trd-cont .plant-lst-cont li .form_check{height:auto; min-height: 2rem; display: flex; align-items:self-start;}
.gen-trd-cont .plant-lst-cont li .form_check label{display: flex; min-height: 2rem; align-items: center;}
.gen-trd-cont .plant-lst-cont li .form_check label > div{display: flex; align-items: center; position: relative; padding-left: 2.3rem; line-height: 1.4;}
.gen-trd-cont .plant-lst-cont li .form_check .dot{margin-top: 1px; position: absolute; left: 0; top: .2rem; width: 1.5rem; height: 1.5rem; border-radius: 1rem;}
.gen-trd-cont .btn-apply{background-color: #2b7fff;}
.gen-trd-cont .btn-reset{background-color: #868e96;}
.gen-trd-cont .btn-reset:before{content:'\F33D'; font-family:remixicon; font-size: 2rem;}
.gen-trd .blk-hd .tbs{}
.sp-search-listitem{background-color: #F6FAFE; border: 1px solid #E5E7EB; color: #797F84; padding: 1rem; display: none; gap: 1rem; flex-wrap: wrap; font-size: 1.4rem;}
.won-mark, .help{background:url(../images/help.png) no-repeat;display: inline-block; width: 1.7rem; height: 1.7rem;}
/*.sp-search-listitem .tag-remove{display: none;}*/
/*.won-mark, .help{position: relative; margin-left: .1rem; cursor: pointer; font-size: 1.3rem; line-height: 1; font-weight: 500; width: 2rem; height: 2rem; display: inline-flex; justify-content: center; align-items: center;}
.won-mark:after, .help:after{content: ''; border: 2px solid #dddddd; display: inline-flex; width: 2rem; height: 2rem; justify-content: center; align-items: center; border-radius: 2rem; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}*/
.won-mark:hover, .help:hover{color:var(--op--wait);}
.won-mark:hover:after, .help:hover:after{border-color: var(--op--wait);}
#siteLineChart img{width:100%; height:400px;}
.p-stat-cont{display: flex; flex-direction: column; gap: 1rem;}
.p-stat-item01{display: flex; flex-direction: column; gap:1rem;}
.p-stat-cont .card__hd{border-bottom: none; align-items: flex-start;}
.p-stat-cont .card__bd.time{height: 100%;}
.p-stat-cont .card__ttl{font-weight: 500; color: #707070; font-size: 14px; letter-spacing: 0; line-height: 14px; white-space: nowrap;}
.p-stat-cont .site-st-total .val{position:relative;font-weight:700;color:#2e2e2e;font-size:20px;text-align:right;letter-spacing:0;line-height:16px;}
.inv-stat{height: 1.9rem;}
.inv-stat .rev-st-top .txt{margin-top:-5px;}
.inv-stat .rev-st-bottom{padding:0;}
.inv-stat .out-txt span:before{left: -.6rem}
.inv-stat .site-st-cont-hd{}
.inv-stat .rev-st-cont{padding: 5px 10px;}
.inv-stat .site-st-cont{padding:0;}
.inv-stat .site-st-cont-st{width:10px;height:10px;border-radius:999px;display: inline-block;}
.inv-stat .site-st-cont-hd.st1 .site-st-cont-st{background:#16a34a;}
.inv-stat .site-st-cont-hd.st2 .site-st-cont-st{background:#2563eb;}
.inv-stat .site-st-cont-hd.st3 .site-st-cont-st{background:#ef4444;}
.inv-stat .site-st-cont-hd.st4 .site-st-cont-st{background:#6b7280;}
.inv-stat .site-st-cont > div{padding-bottom: 1.3rem;}
.inv-stat .site-st-cont-hd > div:not(.site-st-cont-val){display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 1rem;}
.inv-stat .site-st-cont-hd{padding: 1.3rem 0 0;}
.inv-stat .site-st-cont{width: auto; font-size: 1.4rem; font-weight: 600; color: #6B7280;}
.time .rev-st-cont{all:unset; display: flex; flex-direction: column; align-items: flex-start;}
.time .rev-st-cont .val{margin-top:1.2rem;}
.time .rev-st-cont .val .txt{font-weight: 500; color: #707070; font-size: 14px; letter-spacing: 0; line-height: 14px; white-space: nowrap;}
.time .rev-st-cont .val .txt{margin-top: -1px; font-weight: 700; color: #000; font-size: 30px; letter-spacing: 0; line-height: 30px; white-space: nowrap;}
.gen-time-wrap .rev-st-bottom{padding: 1.4rem 0;}
.gen-time-wrap .tbs__panel.is-active{display: flex; flex-direction: column; gap: 1rem;}
.p-stat-cont .out-wrap{}
.p-stat-cont .out{margin-top: .7rem; position: relative; height: 8.6rem;}
.p-stat-cont .out-txt{display: flex; align-items: baseline; gap: 1rem;}
.p-stat-cont .out-txt p{font-size:3rem; font-weight: 700; padding-top: 1rem; }
.p-stat-cont .out-txt span{font-size: 1.2rem; color: #6A7282; position: relative;}
.p-stat-cont .out-txt span:before{content:'/'; position: absolute; left: -0.7rem;}
.p-stat-cont .out-chart{width:12.8rem; height:12.8rem; position: absolute; right: 0; top: -3rem;}
.p-stat-cont .p-stat-item01 .card:last-of-type{height: 19rem; display: flex; flex-direction: column; justify-content: space-between; gap: 1rem;}
.rev-est{display: flex; flex-direction: column; gap: 1.5rem; background-image: url(../images/rev-st-bg.svg); background-repeat: no-repeat; background-position: bottom 9px right 20px;}
.rev-est .rev-st-top{margin-bottom:1rem; margin-top:.5rem;}
.rev-est .rev-st-bottom{margin: 0px -15.5rem -1.5rem -1.5rem; padding: 1.5rem; width: calc(100% + 3rem); height: calc(100% - 5rem); border-radius: 0 0 16px 16px;}
.rev-est .rev-est{padding: 5px 0 5px 10px;}
.p-stat-item02{display: flex; flex-direction: column; align-items: flex-start; gap: 15px; padding: 15px; position: relative; align-self: stretch; width: 100%; flex: 0 0 auto; background-color: #ffffff; border-radius: 16px; border: 1px solid; border-color: #f3f4f6; box-shadow: 0px 4px 20px -2px #0000000d;}
.p-stat-item02 .card__hd{display: flex;justify-content: space-between; width: 100%;align-items: center;}
.gen-trend-wrap{display: flex; flex-direction: column; gap:2rem; width: 100%;}
.gen-trend-wrap .gen-trend-chart{flex: 2;}
.gen-trend-wrap .gen-trend-tblwrap{flex:1; display: flex; flex-direction: column; gap: 1rem;}
.gen-trend-wrap .gen-trend-tblwrap header{font-size:1.8rem;color: #707070; background: url(../images/calendar.svg) no-repeat center left; padding-left: 3rem;height: 3.2rem; display: flex; align-items: center;}
.gen-trend-tbl.card{padding:0;}
.gen-trend-tbl .gen-trend__head{display: grid; grid-template-columns: 1fr 1fr 1fr; background: #f6f8fb; font-weight: 700; border-bottom: 1px solid #e7edf3; position: sticky; top: 0; z-index: 5;}
.gen-trend__head .col{padding: 12px 10px; display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 1.4rem;}
.gen-trend__head .unit{display: block; font-size: 11px; font-weight: 600; color: #7b8794; margin-top: 2px;}
.gen-trend__body{overflow-y: auto; position: relative;}
.gen-trend__body .row{display: grid; grid-template-columns: 1fr 1fr 1fr; /*border-bottom: 1px solid #eef2f6;*/ background: #fff;}
.gen-trend__body .row:last-child{border-bottom:0;}
.gen-trend__body .col{padding: 12px 10px; text-align: center;}
.gen-trend__body .time{position: relative; text-align: left; font-weight: 600; color: #6f7a86; padding: 12px 0 12px 10px;}
.gen-trend__body .time::before{content:""; position:absolute; left:20px; top:0; bottom:0; width:2px; background:#f1f1f1; opacity:.9;}
.gen-trend__body .dot{position:absolute; left:16px; top:50%; transform:translateY(-50%); width:10px; height:10px; border-radius:50%; background:#1f78ff; box-shadow:0 0 0 3px #eaf2ff;}
.gen-trend__body .txt{margin-left: 2.8rem;}
.gen-trend__body .val{font-weight:500; color:#656f7b;}
#siteDetailTableBodyMobile{height:20.5rem; font-size:1.4rem;}
#siteLineChart{width: 100%; height: 25rem; display: flex;justify-content: center;align-items: center;}
.inv-info-item02{display: flex; flex-direction: column; gap: 1rem; margin-top: 2rem;}
.inv-info-item02 .info-box{display: flex;}
.inv-info-item02 .info-box select{width:100%;}
.inv-info-item02{}
.inp-safety-manager{display: flex; gap: 1rem; }
#wrap.totallist-3-wrap{background-color: #ffffff;}
.totalList3-cont.totalList3{padding:0 1rem; display: flex; flex-direction: column; gap:1.5rem; position: relative; padding-top: 5rem;}
.totalList3-cont.totalList3 .btn-boxwrap {position: absolute; top: 0; right: 1rem;}
.plant-kpi-box{display: flex; flex-wrap: wrap; gap:1rem;}
.plant-kpi-box > .item{width: 100%; display: flex; gap: 1rem;}
.plant-kpi-box > .item > div{flex: 0 0 calc(50% - 5px);box-sizing: border-box;}
.plant-kpi-box .card{display: flex; flex-direction: column; gap:12px;}
.plant-kpi-box .card header{all:unset; font-weight: 500; color: #707070; font-size: 14px; line-height: 14px; white-space: nowrap;display: flex; justify-content: space-between; align-items: flex-end;}
.plant-kpi-box .kpi-capacity{height: 100%; display: flex; justify-content: end; flex-direction: column; align-items: end;}
.plant-kpi-box .kpi-capacity p{font-weight: 700; color: #101727; font-size: 24px; letter-spacing: 0;line-height: 36px; white-space: nowrap;}
.plant-kpi-box .kpi-capacity-site {font-weight: 400; color: #6a7282; font-size: 12px; letter-spacing: 0; line-height: 12px;}
.plant-kpi-box .diff span{font-weight: 600; font-size: 14px; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-kpi-box .diff.down{color: #155dfc;}
.plant-kpi-box .diff.up{color: #dc2626;}
.plant-kpi-box .diff{color: #6b7280;}
.tbl-wrap.totallist-3-mob{border:none;}
.tbl-wrap.totallist-3-mob > div{display: flex; flex-direction: column; gap: 1rem;}
.tbl-wrap.totallist-3{overflow:unset;}
.totallist-3 .tbl .site{display: flex; gap: 1rem; align-items: flex-start;}
.totallist-3 .tbl td{height:7.6rem;}
.totallist-3 .tbl .status-dot{}
.totallist-3 .tbl .site-name{white-space: normal !important; word-break: keep-all; overflow-wrap: anywhere; flex:1 1 0; }
.totallist-3 .tbl .rate-wrap{display: flex; flex-direction: column; gap:.6rem;}
.totallist-3 .tbl .rate-wrap > rate-wrap{font-size: 1.2rem; font-weight: 600; color: #374151;}
.totallist-3-wrap .layer-pop .layer-box {border-radius: 0;}
.totallist-3-wrap .layer-pop .layer-head{display: flex; align-items: center; justify-content: space-between;margin-bottom: 0;}
.totallist-3-wrap .layer-pop .modal-close{background: #333333; color: #ffffff; width: 100%; height: 4rem; position: absolute; bottom: 0; z-index: 1;}
.totallist-3-wrap .layer-pop .layer-head .modal-close{all:unset;}
.totallist-3-wrap .map-status-dashboard{width: calc(100% - 4rem); left: 50%; transform: translateX(-50%);}
.totallist-3-wrap [data-modal="modal3"] > div:not(.header){padding-bottom: 0;}
.totallist-3-wrap .map-search-control{justify-content: space-between;}
.totallist-3-wrap .ol-zoom{top: 3.5em; left: .5em;}
.map-status-item{justify-content: space-between; padding: .5rem}
.map-status-item > div{display: flex; align-items: center; flex-direction: column; gap: .5rem;}
.map-status-item > div p{font-size: 1.2rem;}
#constructTopModal .tbl-wrap{height:25rem; overflow: auto;}
.p-info-cont th, .p-info-cont td{font-size:1.4rem;}
.p-info-cont td{padding-left:1rem;}
.p-info-cont td> div{display: flex; justify-content: space-between; width:100%;}
.dropzone{border: 1px solid #DFDFDF !important; border-radius: 5px;}
.p-info-cont input{height:3.8rem;}
.p-info-cont .dropzone-wrap .dropzone{width: 19.1rem; height: 3.8rem; min-height: unset; padding: 0;}
.p-info-cont .dropzone-wrap .dropzone:before{content:'업로드'; font-size: 1.4rem; font-weight: 500;}
.p-info-cont .dropzone-wrap .dz-default{display: none;}
.member_join table button{width:125px; padding: 1rem;}
.member_join table input,
.member_join .hp-code-wrap{flex:1;}
.main-lyt1 .member_join [class^="btn-st"]{width:140px;}
.member_join .email-input-group{width:100%; flex-direction:column;}
.member_join .email-input-group #emailSelector{width:110px;}
.error-msg[data-msg*="."]{display:inline-block; margin-top:0.5rem; color:#ed171a}
form[name="frm_00"]{display: flex; flex-direction: column; gap: 1rem;}
form[name="frm_00"] .card + .btn-wrap{margin-top:2rem;}
.email-input-group > input#emailUser { width:100%; }
.email-input-group > div { position:relative; width:100%; display:flex; align-items:center; gap:6px; }
.email-input-group .at-mark { white-space:nowrap; }
.email-input-group #emailDomain { flex:1; width: 100%; }
.email-input-group #emailSelector{/*position:absolute; left: calc(100% + 1rem); top:0; width: 145px;*/}
.member_join [class^="btn-st"] {width: 11rem;}
.email-input-group { position:relative; display:flex; align-items:center; gap:12px; width:60%;}
.email-input-group.ew100p{width:calc(100% - 155px);}
.email-input-group.ew90p{width:calc(90% - 155px);}
.email-input-group > div { position:relative; width:100%; display:flex; align-items:center; gap:6px; flex: 1;}
.email-input-group .at-mark { white-space:nowrap; }
.email-input-group #emailDomain { flex:1; width: 100%; }
.dropzone-wrap{display: flex; flex-direction: column; gap: 1rem;}
.dz-preview{display: flex; gap: .5rem; align-items: center; position: relative; flex-direction: column; align-items: flex-start;}
.dz-preview .dz-image{width: 5rem; height: 5rem; border: 1px solid #f0f2f6;}
.dz-preview .dz-details{display: flex; flex-direction: column-reverse; gap: .3rem; flex-direction: column-reverse;}
.dz-preview .dz-filename span{font-size: 1.4rem; font-weight: 500;}
.dz-preview .dz-success-mark,
.dz-preview .dz-error-mark{display: none;}
.dz-preview .btns{position: absolute; right: 0; display: flex; gap: 1rem;}
.dropzone.dz-clickable{display: flex; flex-direction: column;}
/*.dz-clickable:after{content: '첨부할 파일을 여기에 끌어다 놓거나, 파일선택 버튼을 눌러 파일을 직접 선택해주세요'; display: block; max-width: 100%; box-sizing: border-box; font-size: 1.4rem; line-height: 1.5; white-space: normal; word-break: keep-all; overflow-wrap: break-word; text-align: center;}*/
.unread-wrap{ display: flex; gap: 1rem;}
.unread-wrap button{padding: .4rem 1.5rem; border-radius: 5rem;}
.unread-wrap .unread-item01{background: #333333; color: #ffffff;}
.unread-wrap .unread-item02{border: 1px solid #c1c1c1;}
.unread-wrap .unread-item02 span{display: inline-block; padding: .2rem .4rem; background: #ff7a6b; color: #ffffff; font-size: 1.2rem; border-radius: 5rem; margin-left: .5rem;}
.tbl-group-wrap{}
.plant-overview{display: flex; justify-content: space-between; gap:1rem; padding: 1rem; border-radius: 1rem; border: 1px solid #F3F4F6;}
.plant-overview .item01{width:calc(60% - 1rem); display: flex; gap: 1rem;}
.plant-overview .state-icon{}
.plant-overview .state-txt{}
.plant-overview .state-txt p{font-weight: 600; color: #101727; font-size: 16px; letter-spacing: 0; line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.plant-overview .state-txt span{}
.plant-overview .state-txt em{font-weight: 400; color: #697282; font-size: 12px; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-overview .item02{width:40%; display: flex; flex-direction: column; justify-content: space-around;}
.plant-overview .gen-today{display: flex; justify-content: space-between;}
.plant-overview .gen-today-time{font-weight: 500; color: #333333; font-size: 16px; text-align: right; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-overview .gen-today-kwh{font-weight: 500; color: #333333; font-size: 16px; text-align: right; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
.plant-overview .progress-bar-wrap{display: flex; align-items: center; justify-content: space-between; gap: 1rem;}
.plant-overview .pct-barbox{width: 100%; height: .8rem; background: #E5E7EB; border-radius: 10rem;}
.plant-overview .pct-fill{height: 100%; background-color:#2B7FFF;}
.plant-overview span{font-size:1rem; color:#99A1AF; margin-top: .7rem;}
.plant-kpi-tblwrap{display: flex; align-items: center; flex-direction: column;}
.plant-kpi-sch{width: 100%; display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;}
.plant-kpi-sch .sell-boxwrap{display: flex; flex-direction: column; gap:0.5rem;}
.plant-kpi-sch .btn-combo-box{position: relative; width: 100%; border: 1px solid #DFDFDF; border-radius: 5px; background: #ffffff; height: 3.8rem; display: flex; align-items: center; padding: 0 1rem; border: 1px solid #DFDFDF; border-radius: .5rem; padding: .5rem 1.6rem .5rem 4.6rem; background-image: url(../images/search.svg); background-repeat: no-repeat; background-position: center left 1.6rem;}
.plant-kpi-sch .btn-combo-box button{width:100%; height: 100%; left: 0; position: absolute; text-align: left; padding-left: 4.5rem; font-size: 1.4rem; color: #797F84;}
.plant-kpi-sch .item01{position: relative;}
.plant-kpi-sch .total-search,
.plant-kpi-sch .search-group, .plant-kpi-sch .search-group input{width: 100%;;}
.multi-combo-dropdown{position: absolute; background: #ffffff; padding: 1rem; display: flex; flex-direction: column; border: 1px solid #dddddd; border-radius: 1rem; top: 4rem; z-index: 1;}
.multi-combo-dropdown .combo-footer{display: flex; justify-content: end; gap: 1rem; margin-top: 2rem;}
.multi-combo-dropdown .combo-footer button{height: 3.8rem; padding: 1.15rem 1.5rem; box-sizing: border-box; position: relative; align-self: stretch; border-radius: 10px; color: #ffffff; font-size: 1.4rem; display: flex; justify-content: center; align-items: center;}
.multi-combo-dropdown .combo-footer button#applyRegionFilter{background-color: #2b7fff;}
.multi-combo-dropdown .combo-footer button#resetRegionFilter{background-color: #868e96;}
.multi-combo-dropdown .combo-list{font-size: 1.4rem; display: flex; flex-wrap: wrap; display: flex; flex-wrap: wrap; gap: .5rem 1rem; height: 20rem; overflow: auto; margin-top: .5rem;}
.multi-combo-dropdown .combo-list .form_check{width:30%;}
.plant-kpi-sch .item02{display: flex; justify-content: space-between; gap: .5rem;}
.plant-kpi-sch .item02 input{height: 3.8rem;}
body #footer{width:100%; padding-bottom: 10rem;}
.footer{align-items:center;gap:16px;padding:24px 83px;border-top-width:1px;border-top-style:solid;border-color:#e5e7eb;display:flex;flex-direction:column;position:relative;align-self:stretch;width:100%;flex:0 0 auto;}
.footer-link{display:inline-flex;align-items:center;justify-content:center;gap:20px;position:relative;flex:0 0 auto;}
.link{display:inline-flex;align-items:center;justify-content:center;gap:10px;position:relative;flex:0 0 auto; font-weight: 600; color: #6b7280; font-size: 12px; letter-spacing: 0; line-height: 16px; white-space: nowrap;}
p.address{position:relative;display:flex;align-items:center;justify-content:center;width:fit-content;font-family:"Pretendard-Regular",Helvetica;font-weight:400;color:#9ca3af;font-size:10px;text-align:center;letter-spacing:0;line-height:15px;white-space:nowrap;}
.mob-contwrap{display: flex; flex-direction: column; gap: 1rem;}
.site-card{width:calc(100%); background:#fff;border:1px solid #e8edf5;border-radius:18px;box-shadow:0 16px 34px rgba(0,0,0,.12);padding:16px 16px 14px;}
.site-card__hd{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;}
.site-card__ttl{margin:0;font-size:16px;font-weight:600;line-height:1.25;letter-spacing:-0.2px;}
.site-card__sub{margin:4px 0 0;font-size:12px;color:#6b7280;}
.site-card__check{width:26px;height:26px;border-radius:999px;background:#2f6bff;display:flex;align-items:center;justify-content:center;flex:0 0 auto;box-shadow:0 6px 14px rgba(47,107,255,.28);}
.site-card__check svg{width:16px;height:16px;fill:#fff;}
.site-card__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin:0;padding:0;}
.site-card__row{min-width:0;}
.site-card__row dt{font-size:1.4rem;color:#8b93a1;margin:0 0 4px;}
.site-card__row dd{margin:0;font-size:13px;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.site-card__row dd b{font-weight:500;}
.site-card__ft{margin-top:14px;}
.site-card__btn{width:100%;height:4rem;border:0;border-radius:10px;background:#eef5ff;color:#2f6bff;font-weight:500;cursor:pointer; font-size: 1.4rem;}
.site-card__btn:active{transform:translateY(1px);}
.site-card__grid.is-3col{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px 18px;}
.site-card .form_check label::before{border: 1px solid #9E9E9E}
.file-item.file-{display: flex; gap: 1rem;}
.file-item.file- .file-info{display: flex; justify-content: space-between; width: 100%;}
.dropzone.dz-clickable{height: 1rem; min-height: auto;}
.dz-default.dz-message:before{content:'업로드';font-size: 1.4rem;}
.dz-default.dz-message button{display: none;}
.site-card__grid.is-3col .site-card__row{min-width:0;}
.site-card-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:16px;}
.site-card__checkwrap{position:relative;flex:0 0 auto;}
.site-card__chk{position:absolute;inset:0;opacity:0;pointer-events:none;}
.site-card__check{cursor:pointer;}
.site-card__check{opacity:.25;transform:scale(.98);transition:opacity .15s ease,transform .15s ease;}
.site-card__chk:checked + .site-card__check{opacity:1;transform:scale(1);}
.site-card-list-flex{display: flex; flex-direction: column; gap: 1.6rem;}
#safetyTbmob,
#constructModalDiv{max-height: 30rem; margin-top:2rem; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; touch-action: pan-y; }
#safetyTbmob .site-card-list-flex,
#constructModalDiv .site-card-list-flex{max-height: 30rem; overflow: auto;:}
#safetyTbmob .site-card,
#constructModalDiv .site-card{display: flex; flex-direction: column; gap:1rem; position: relative;box-shadow: none;}
#safetyTbmob .site-card header,
#constructModalDiv .site-card header{justify-content: flex-end; position: absolute; right:2rem;}
#customAlertMessage{font-size: 1.6rem; text-align: center; padding: 3rem 0;}
.sitelist-wrap{display: flex; flex-direction: column; gap: 1rem;}
.sitelist-wrap .card{display: flex; flex-direction: column; gap: 1rem;}
.sitelist-wrap header{display: flex; flex-direction: column;gap: .5rem;}
.sitelist-wrap header p{font-size: 1.6rem; font-weight: 600; color:#0A0A0A;}
.sitelist-wrap header span:not(.form_check){font-size: 1.4rem; color:#6A7282}
.sitelist-wrap header .form_check{position: absolute; right: 1rem;}
.sitelist-item{display:grid; grid-template-columns:repeat(3, 1fr); gap:16px 24px;}
.sitelist-item > div{display: flex; flex-direction: column; gap: .5rem;}
.sitelist-item > div em{font-size: 1.2rem; color: #6A7282;}
.sitelist-item > div span{font-size: 1.6rem; font-weight: 500; color:#333333;}
.sitelist-wrap .view-rtuid{color:#2B7FFF; background-color:#EFF6FF; text-align: center; padding:1rem;font-weight: 500; border-radius: 1rem;}
.card__ttl {font-weight: 500; color: #707070; font-size: 14px; letter-spacing: 0; line-height: 14px; white-space: nowrap;}
.inv-st-item5{display: flex; flex-direction: column; gap:1rem}
.inv-st-item5 header p{font-size: 1.4rem; color: #333;}
.string-tab-wrap{display: flex; justify-content: center; gap:1rem;}
.string-tab-wrap button{border-radius: 10rem; padding:.7rem 1.2rem; border: 1px solid #e0eaff; background: #f5f8ff; color: #0071fe;font-size: 1.4rem;}
.string-tab-wrap button.active{border: 1px solid #0071fe; background: #0071fe; color: #ffffff;}
.elec-meter{display: flex; flex-direction: column; gap: 2rem;}
.inv-utill-st1{display: flex; align-items: center; justify-content: space-between;}
.channel-check{display: flex; flex-wrap: wrap; gap: .5rem 6.5%;}
.elec-meterbox .tbl-util{display: flex; flex-direction: column; gap: 1rem; align-items: stretch; margin:0;}
.elec-meterbox .tbl-util .channel-wrapper{width:100%;}
.elec-meterbox .tbl-util .channel-wrapper .channel-checkboxes{width: calc(100% - 6.5rem);width: calc(100% - 6.5rem);}
.elec-meter{display: flex; justify-content: space-between;}
.elec-meter .search-box input{width: 15rem; font-size: 1.4rem; padding: 1rem;}
.channel-wrapper {border: 1px solid #e1e4e8; border-radius: 6px; overflow: hidden; background: #fff; max-width: 100%;}
.elec-meterbox .channel-wrapper{width: 15rem;}
#toggleChannels{height: 2.8rem;}
.elec-meterbox .channel-checkboxes{position: absolute; z-index: 1; width: 15rem; max-height:20rem; margin-top: 0.3rem; background: #ffffff;padding:1rem; box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); border-radius: 0 0 10px 10px;border: 1px solid #d5d9e0; border-top: none;}
.string-tab-wrap button{all: unset; font-weight: 600;font-size: 1.4rem; padding:.5rem 1rem 0; height: 3.5rem; color: #4a5565; text-align: center; letter-spacing: 0; line-height: 20px; white-space: nowrap;}
.string-tab-wrap button.active{all: unset; font-size: 1.4rem; font-weight: 600; padding:.5rem 1rem 0; height: 3.5rem; color: #2b7fff; text-align: center;letter-spacing: 0;line-height: 20px;white-space: nowrap; border-bottom: 3px solid #2b7fff;}
#strSelectBox{width:100%; padding: .5rem 2rem .5rem .5rem;}
.strSelectBoxwrap:after{content: ''; display: inline-block; width: 6px; height: 6px; border-right: 2px solid #999; border-bottom: 2px solid #999; transform: rotate(45deg) translateY(-50%); margin-left: 10px; margin-bottom: 2px; position: absolute; top: 50%; right: 1.5rem;}
.elec-meterbox .tbs.web{display: none !important;}
#dcTableSubHeaderMob{display: flex;}
#dcTableSubHeaderMob > div{flex:1 auto;}
#dcTableBodyMob .row{display:flex;align-items:stretch;flex-wrap:nowrap;}
#dcTableBodyMob .row > div{flex:1 1 0;}
#dcTableBodyMob .row .time{display:flex;align-items:center;gap:.5rem;align-self:stretch; }
#dcTableBodyMob .row .time .txt{display:block;line-height:1.1;white-space:nowrap; margin-left: 46px;}
#dcTableBodyMob .row .col.val{white-space:nowrap;text-align:right;}
#moblieWidth{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.p-fault-cont{display: flex; flex-direction: column; }
.attach-list{display: flex; flex-direction: column;}
.attach-list .file-list-utill {display: flex; justify-content: space-between; width: 100%;}
.attach-list .attach-items{display: flex; flex-direction: column; gap: 1rem;}
.attach-list .attach-items li{display: flex; flex-direction: column; gap: .5rem; font-size: 1.6rem;}
.attach-list .attach-actions{display: flex; align-items: center; gap: 1rem; justify-content: flex-end;}
.attach-list .attach-actions .attach-meta{white-space: normal; word-break: break-word;}
.attach-list .attach-actions button,
.attach-list .attach-actions a{display: flex; align-items: center;}
.attach-list .attach-actions .btn-view .material-symbols-outlined{font-size:1.7rem;}
.attach-list .attach-actions .btn-download .material-symbols-outlined{font-size:2rem;}
.attach-list .attach-actions .btn-del .material-symbols-outlined{font-size:2.5rem;}
.file-list{display: flex; flex-direction: column; font-size: 1.6rem; gap: 1rem;}
.file-list .file-list-utill{display: flex; justify-content: space-between; align-items: center;}
.file-list .file-list-utill .total{font-weight: 600;}
.file-list .file-list-utill .total .current{color:#0b50d0;}
.file-list .file-list-utill .upload-delete-btn{background-color: #FFFFFF; border: 1px solid #58616a; color: #1e2124; border-radius: .3rem; padding: .5rem 1rem;}
.file-list .upload-list{}
.file-list .upload-list li{}
.file-list .upload-list .file-name{white-space: normal; word-break: break-word;}
.file-list .upload-list .file-info .btn-wrap{all: unset;}
.file-list .upload-list .file-info{display: flex; gap: 1rem;}
.file-list .upload-list .file-info button{display: flex; align-items: center; gap: .5rem; padding: .5rem 1rem;}
.layer-pop{position: fixed; z-index: 100; display: none; font-size: 1.4rem;}
.layer-pop .layer-box{display: flex; flex-direction: column; gap: 1rem;}
.layer-pop .layer-head{margin-bottom:1rem; position: relative;}
.layer-pop .layer-head h1,
.layer-pop .layer-head .title{font-size: 1.6rem; font-weight: 500;}
.layer-pop .layer-head p{font-size: 1.8rem; font-weight: 500;}
.layer-pop .layer-box> button.close{border-top: 1px solid #f1f5f9; background-color: #f8fafc; display: flex; justify-content: center; align-items: center; padding: 1rem; margin: 2rem -2rem -2rem -2rem; border-radius: 0 0 1rem 1rem;}
.layer-pop .layer-box> button.close span{color: #64748b; font-weight: 600; letter-spacing: normal;}
.layer-pop:after{content:''; width:100%; height:100%; position: fixed; top:0; left:0; background-color: rgba(12, 10, 24, .4); z-index: 1;}
.layer-pop .layer-box{width: calc(100% - 4rem); position: fixed; background: #ffffff; top: 40%; left: 50%; transform: translate(-50%, -40%);z-index: 9; border:1px solid #ceced1; border-radius:2rem; padding:2rem; box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);}
.layer-foot.btn-wrap{display: flex; align-items: center; justify-content: center;gap: 1rem;}
.layer-foot.btn-wrap .close{background-color:#A1A1A1; height: 4rem; padding:0 2rem; display: flex; align-items: center; justify-content: center; border-radius: 1rem; color: #ffffff;}
.layer-foot.btn-wrap .close1{width: 100%; height: 3.6rem;font-size: 1.6rem; background: #333333; color: #ffffff; border-radius: .5rem;}
.layer-body.sitelist .txtico-box{display: flex; justify-content: center; align-items: center; gap: 1rem;}
.layer-body.sitelist{display: flex; flex-direction: column; gap: 1rem;}
.layer-body.sitelist .btn-st1{border: 1px solid #DFDFDF; padding: .4rem; border-radius: .4rem; display: inline-flex; justify-content: center; align-items: center;}
.layer-body.sitelist .btn-st1 span.material-symbols-outlined{font-size: 2rem; color: #707070;}
.layer-body.sitelist .btn-st1 span:not(.material-symbols-outlined){padding: 0.5rem 1rem; color: #707070;}
.layer-body.sitelist .btn-st1.on{background-color:#2b7fff;}
.layer-body.sitelist .btn-st1.on span{color: #ffffff;;}
.layer-pop .tbl-wrap th,
.layer-pop .tbl-wrap td{white-space: normal;}
.layer-foot button#errorTopModalClose{width: 100%; height: 3.6rem; background: #333333; color: #ffffff; border-radius: .5rem;}
#rtuChangeHistoryModal table{width:500px;}
.layer-pop .layer-box .multi-combo-wrapper,
.layer-pop .layer-box .multi-combo-dropdown{all:unset;}
#excelOptionModal.layer-pop .layer-box .input-box{display: flex; flex-direction: column; gap: .5rem;}
#excelOptionModal.layer-pop .layer-box .input-box span:not(.bz-dd){display: none;}
#excelOptionModal.layer-pop .layer-box .multi-combo-wrapper{display: flex; flex-direction: column; gap: .5rem;}
#excelOptionModal.layer-pop .multi-combo-dropdown .combo-list{flex-wrap: nowrap; flex-direction: column; border:1px solid #eee; border-radius:.5rem; padding:1rem;}
#excelOptionModal.layer-pop .multi-combo-dropdown .combo-item{}
div[data-modal="modal-img"]{display:none; width: calc(100% - 8rem); position: fixed; background: #ffffff; top: 40%; left: 50%; transform: translate(-50%, -40%);z-index: 9; border:1px solid #ceced1; border-radius:2rem; padding:2rem; box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);}
div[data-modal="modal-img"].active{display: block;}
div[data-modal="modal-img"] .imageModal-content{overflow: auto; height: 415px;}
div[data-modal="modal-img"] button{width: 100%; height: 3.6rem;font-size: 1.6rem;margin-top: 1rem; background: #333333; color: #ffffff; border-radius: .5rem;}
div[data-modal="modal-img"] p.image-modal-caption{display: none;}
.tbl-rtu_inv{display: none;}
#errorTopModalDiv{width: 100%; min-height: 100dvh; padding: 12px 20px 20px; background: #fff; color: #111; padding-bottom: 92px; top: 0; position: fixed; z-index: 10000;}
#errorTopModalDiv .layer-box{width: 100%; min-height: 100dvh; border-radius: 0; border: none; padding: 0;}
#errorTopModalDiv .layer-head{margin-bottom: 0; padding: 0 2rem; display: flex; align-items: baseline;}
#errorTopModalDiv .layer-head p {font-size: 1.8rem; font-weight: 500; width: 100%; text-align: center;position: absolute; top: 50%; left: 0; transform: translateY(-50%); z-index: -1;}
#errorTopModalDiv .layer-box > button.close{display: none;}
#errorTopModalDiv .layer-body,
#errorTopModalDiv .layer-foot{padding:0 2rem;}
#errorTopModalDiv .layer-foot{position: fixed; bottom: 2rem; width: 100%;}
#errorTopModalDiv .layer-foot botton{width: 100%; height: 54px; border: 0; border-radius: 12px; font-size: 16px; font-weight: 800; background: #b9bcc2; color: #fff;}
#errorTopModalDiv input{width:100%;}
#errorTopModalDiv .card{display: flex; flex-direction: column; gap: 1rem; padding: 1rem;}
#errorTopModalDiv .card .tit{font-size: 1.8rem; color:#000000 !important; font-weight: 600;}
#errorTopModalDiv .card p:nth-of-type(n+4):before{content:attr(aria-label); width: 6rem; display: inline-block; font-size: 1.1rem;}
#constructTopModal{display: flex; flex-direction: column; gap: 1rem;}
#constructTopModal *{font-size: 1.4rem}
/*#constructTopModal .sp-top-modal{width: 20rem;}*/
#constructTopModal .sheet__dim{border-radius: 2rem;}
#constructTopModal .sp-content-modal{width: calc(100% - 2.75rem); position: absolute; z-index: 101; background: #ffffff;display: flex; flex-direction: column; gap: .3rem; margin-top: .5rem;}
#constructTopModal .sp-list-modal{border: 1px solid #DFDFDF; padding: 1rem; height: 22rem; overflow: auto;}
#constructTopModal .bz-dd input{font-size: 1.4rem; padding: 1rem;}
#constructTopModal .sheet__panel{bottom: 0rem;}
#constructTopModal .search-box{padding:0;}
#errorSiteSearch li{}
#errorSiteSearch li span{display: inline-block;}
#errorSiteSearch li span label{font-size: 1.6rem; padding: .5rem 0; display: inline-block; height: 100%; width: 100%;}
.error-back{width: 40px;
height: 40px;
border: 0;
background: transparent;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
font-size: 28px;
line-height: 1;
color: #111;}
#constructTopModal .sheet__body{height:40rem;}
#topSiteErrorTable_m{height: calc(100vh - 25rem); overflow: auto; display: flex; flex-direction: column; gap: 1rem;}
.site-st-box{display: none !important;}
.site-st-box-mob{}
.site-st-box-mob p.kpi-capacity-site{font-weight: 400;
color: #6a7282;
font-size: 1.4rem;
letter-spacing: 0;
line-height: 1.4rem;
white-space: nowrap;
margin-left: .5rem;
text-align: right;}
.site-st-box-mob p.kpi-capacity-site span{font-size: 2rem;
color: #101727;
font-weight: 500;}
.site-st-box-mob .site-st-cont-total{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch;}
.site-st-box-mob .status-card{background: #fff; padding: 12px 12px 10px; min-height: 94px; position: relative; overflow: hidden; flex: 1; flex-direction: column; padding-bottom: 1rem; background-color: #ffffff; border-radius: var(--card-border-radius); border: 1px solid var(--card-border-color); box-shadow: 0px 4px 20px -2px #0000000d;}
.site-st-box-mob .status-card .site-stbox{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:2px;}
.site-st-box-mob .site-st-cont-st{width:10px;height:10px;border-radius:999px;flex:0 0 auto;}
.site-st-box-mob .st-normal{background:#16a34a;}
.site-st-box-mob .st-standby{background:#2563eb;}
.site-st-box-mob .st-fault{background:#ef4444;}
.site-st-box-mob .st-comm{background:#6b7280;}
.site-st-box-mob .site-st-cont{font-size:12px;font-weight:700;color:#111827;line-height:1.1;}
.site-st-box-mob .site-st-cont-val{margin-top:10px;text-align:center;font-size:22px;font-weight:900;line-height:1;color:#111827;min-height:24px;}
.site-st-box-mob .progress{margin-top:auto;height:8px;border-radius:999px;background:#e8edf5;overflow:hidden;}
.site-st-box-mob .progress .progress-bar{height:100%;width:0%;border-radius:999px;background:#2563eb;}
.site-st-cont-total{height: 100%; display: flex; flex-direction: column; justify-content: space-between; gap:.5rem;}
.site-st-cont-total .status-card{display: flex; align-items: center;}
.site-st-cont-total .site-st-cont-val{font-size: 2rem; font-weight: 600; width:8.5rem}
.site-st-cont-total .site-stbox{display: flex; align-items: center;gap: .5rem; flex-direction: column;}
.site-st-cont-total .site-stbox .site-st-cont{flex:1; font-size: 1.2rem; font-weight: 600; color: #6B7280; padding:0;}
.site-st-cont-total .site-stbox .site-st-cont-st{width: 10px; height: 10px; border-radius: 999px; display: inline-block;}
.site-st-cont-total .site-stbox .st-normal{background-color:var(--op--run)}
.site-st-cont-total .site-stbox .st-standby{background-color:var(--op--wait)}
.site-st-cont-total .site-stbox .st-fault{background-color:var(--op--err)}
.site-st-cont-total .site-stbox .st-comm{background-color:var(--op--comm)}
.site-st-cont-total .normal .site-st-cont-val{color:var(--op--run)}
.site-st-cont-total .standby .site-st-cont-val{color:var(--op--wait)}
.site-st-cont-total .fault .site-st-cont-val{color:var(--op--err)}
.site-st-cont-total .comm .site-st-cont-val{color:var(--op--comm)}
.site-st-cont-total .site-stbox .site-st-cont-val{font-size: 1.6rem;}
.site-st-cont-total .progress{width: 100%; height: .8rem;}
.site-st-cont-total .status-card .progress{width:100%;height:.6rem;background:#eaf2ff;border-radius:999px;overflow:hidden;margin-top:.65rem;}
.site-st-cont-total .status-card .progress-bar{display:block;height:100%;width:0; background-color: #2B7FFF;}
.btn-st01{background-color: #ffffff; color: #2B7FFF; border: 2px solid #2B7FFF; border-radius: .5rem; height: 3rem; padding: 0 1.5rem; font-weight: 500;}
.btn-boxwrap{display: flex; gap:1rem;}
#apprvAlarmPopDiv{position: absolute; right: 1rem; top: 6rem; background: #ffffff; width: 35rem; z-index: 9999; padding: 1rem; border-radius: 1rem; box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); border: 1px solid #d5d9e0;}
#apprvAlarmPopDiv:before{content:''; position: absolute; top: -8px; right: 76px; width: 16px; height: 16px; background: white; transform: rotate(45deg); border-top:1px solid #d5d9e0; border-left:1px solid #d5d9e0;}
#apprvAlarmPopDiv header{margin: 0 -1rem; gap: .6rem; padding:1rem; display:flex; justify-content:flex-start; align-items: center; border-bottom:1px solid #f1f5f9}
#apprvAlarmPopDiv header span.material-symbols-outlined{color:#f37321}
#apprvAlarmPopDiv header span:not(.material-symbols-outlined){color:#0f172a; font-size: 1.8rem; font-weight: 500;}
.apprvAlarmDiv{display: flex; flex-direction: column; gap:.5rem;}
.apprvAlarmDiv > div{padding:1rem;}
.apprv-list{display: flex; align-items: center; gap: 1rem;}
.apprv-list .apprv-ico{width:4rem; height: 4rem; border-radius: 50%; display: flex; justify-content: center; align-items: center;}
.apprv-list.item01 .apprv-ico,
.apprv-list.item03 .apprv-ico{background: #eff6ff;}
.apprv-list.item02 .apprv-ico,
.apprv-list.item04 .apprv-ico{background: #ecfdf5;}
.apprv-list.item01 .apprv-ico span,
.apprv-list.item03 .apprv-ico span{color:#3b82f6;}
.apprv-list.item02 .apprv-ico span,
.apprv-list.item04 .apprv-ico span{color:#10b981;}
.apprv-list .apprv-cont{display: flex; gap: 1rem; align-items: center;}
.apprv-list .apprv-cont > div b{font-weight:500; color: #f37321;}
.apprv-list .apprv-cont > div em{font-size:1.4rem; color:#94a3b8}
.apprv-list .apprv-cont > span{color:#cbd5e1; cursor: pointer;}
.apprv-close{border-top:1px solid #f1f5f9; background-color: #f8fafc; display: flex;justify-content: center; align-items: center; padding: 1rem; margin: 0 -1rem -1rem -1rem; border-radius: 0 0 1rem 1rem;}
.apprv-close span{color:#64748b; font-weight: 600; letter-spacing: normal;}
.apprvAlarmPopDiv{display: none; position: absolute; right: 1rem; top: 6rem; background: #ffffff; width: 35rem; z-index: 9999; padding: 1rem; border-radius: 1rem; box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); border: 1px solid #d5d9e0;}
.apprvAlarmPopDiv.is-active{display:block;}
.apprvAlarmPopDiv:before{content:''; position: absolute; top: -8px; right: 76px; width: 16px; height: 16px; background: white; transform: rotate(45deg); border-top:1px solid #d5d9e0; border-left:1px solid #d5d9e0;}
.apprvAlarmPopDiv header{margin: 0 -1rem; gap: .6rem; padding:1rem; display:flex; justify-content:flex-start; align-items: center; border-bottom:1px solid #f1f5f9}
.apprvAlarmPopDiv header span.material-symbols-outlined{color:#f37321}
.apprvAlarmPopDiv header span:not(.material-symbols-outlined){color:#0f172a; font-size: 1.8rem; font-weight: 500;}
.apprvAlarmPopDiv.st1{width:10rem;}
.apprvAlarmPopDiv.st1:before{right: 1rem;}
.mypage-ul{display: flex; flex-direction: column; gap: 1rem; font-size: 1.4rem;}
.tabbar{display:flex;flex-direction:column;align-items:center;padding:0px 0px 0px;position:relative;align-self:stretch;width:100%;flex:0 0 auto;}
.nav{display:flex;/*height:106px;*/align-items:flex-start;gap:10px;padding:14px 20px;position:relative;align-self:stretch;width:100%;background-color:#ffffff;border-top-width:1px;border-top-style:solid;border-color:#e5e7eb;box-shadow:0px -4px 20px -2px #0000001a;}
.tabbar .nav>div:not(.tabbar-menu){display:flex;align-items:flex-start;justify-content:space-between;position:relative;flex:1;flex-grow:1;}
.tabbar button{display: flex; flex-direction: column; align-items: center; gap:.5rem;flex: 1;}
.tabbar button.on .txt{color:#2563EB;}
.tabbar button .txt{color:#99A1AF; font-size:1rem; font-weight: 600;}
.tabbar .tabbar-ico{width: 2.4rem; height: 2.4rem; display: inline-block; background-size: contain; background-repeat: no-repeat; background-position:center bottom;}
.tabbar .tabbar-ico.n-menu{background-image: url(../images/n-menu.svg);}
.tabbar .tabbar-ico.n-overview{background-image: url(../images/n-overview.svg);}
.tabbar .tabbar-ico.n-home{background-image: url(../images/n-home.svg);}
.tabbar .tabbar-ico.n-fault{background-image: url(../images/n-fault.svg);}
.tabbar .tabbar-ico.n-mypage{background-image: url(../images/n-mypage.svg);}
.tabbar button.on .tabbar-ico.n-menu{background-image: url(../images/n-menu-on.svg);}
.tabbar button.on .tabbar-ico.n-overview{background-image: url(../images/n-overview-on.svg);}
.tabbar button.on .tabbar-ico.n-home{background-image: url(../images/n-home-on.svg);}
.tabbar button.on .tabbar-ico.n-fault{background-image: url(../images/n-fault-on.svg);}
.tabbar button.on .tabbar-ico.n-mypage{background-image: url(../images/n-mypage-on.svg);}
.tabbar-box{height:100%; margin-bottom: 7rem;}
body .tabbar-menu{display: none;}
body.tabbar-active .tabbar-menu{display:flex; flex-direction: column; width: 100%; height: 100%; background: #ffffff; position: fixed; top: 0; left: 0; z-index: 1501;}
body.tabbar-active .tabbar-menu nav{padding:2rem;}
body .tabbar-menu header{display: flex; justify-content: flex-end;margin-bottom: 1rem; padding: 1rem;;}
body .tabbar-menu .user-name{padding-left: 1.5rem; font-size: 2rem; font-weight: 500; color: #333333; display: flex; align-items: center;}
body .tabbar-menu .user-name:after{content:'\f105'; font-family: fontawesome; font-size: 1.5rem; margin-left: 1rem;}
body .tabbar-menu nav > ul{margin-top:5rem; font-size: 1.6rem; display: flex; flex-direction: column; gap: 2rem;}
body .tabbar-menu nav > ul > li{height: 2.4rem; display: flex; align-items: center;}
body .tabbar-menu nav > ul > li > a{display: flex; gap:.5rem;}
/*body .tabbar-menu [data-menuid="M308"] a:before{content:''}*/
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu [data-menuid=""]{}
body .tabbar-menu .logout-box{position: absolute; bottom: 3rem; width: 100%; display: flex; justify-content: center;}
body .tabbar-menu .logout-box a{color:#666666; font-size: 1.6rem; text-decoration: underline; text-underline-offset: 3px;}
.sheet{position:fixed; inset:0; z-index:2000; display:none; height:100vh; height:100dvh;}
.sheet.is-open{display:block;}
/* dim */
.sheet__dim{ position:fixed; inset:0; }
.sheet.is-open .sheet__dim{opacity:1; background: rgba(0, 0, 0, .7);}
/* panel */
.sheet__panel{
position:absolute;left:0;right:0;bottom:0;
background:#fff;border-radius:18px 18px 0 0;
box-shadow:0 -10px 30px rgba(0,0,0,0.18);
transform:translateY(110%);
transition:transform .28s ease;
max-height:72vh;
display:flex;flex-direction:column;
overflow:hidden;
}
.sheet.is-open .sheet__panel{transform:translateY(0);}
/* handle (너는 div.sheet__handle 사용중) */
.sheet__handle{
width:56px;height:5px;border-radius:999px;
background:#d9dce1;margin:10px auto 6px;
}
body.sheet-open{overflow:hidden;}
/* body (.sheet__body 안에 search-box 넣음) */
.sheet__body{padding:10px 14px 12px;display:flex;flex-direction:column; gap:10px; min-height:0; overflow:auto; -webkit-overflow-scrolling:touch;}
.sheet__search::before{content:'';background-image: url(../images/search.svg);
background-repeat: no-repeat;
background-position: center left 1.6rem; display: inline-block;
width: 4rem;
height: 3rem;}
.sheet__body a,
.sheet__body button{height: 3.8rem; display: flex; align-items: center; justify-content: center; border-radius:.7rem;}
.sheet__body button.btn-dw{background: url(../images/download_2.svg) no-repeat calc(50% - 3rem) center;}
.sheet__searchIcon{position:absolute;left:12px;opacity:.55;font-size:14px;}
.sheet__input{width:100%;height:42px;border:0;outline:none;padding:0 1rem ;font-size:14px;}
.sheet__list{border:1px solid #eef0f3;border-radius:10px;overflow:auto;max-height:40vh;}
.sheet__item{width:100%;text-align:left;border:0;background:#fff;padding:12px 12px;font-size:14px;color:#333;border-bottom:1px solid #f1f3f5;cursor:pointer;}
.sheet__item:last-child{border-bottom:0;}
.sheet__item:hover{background:#f7f9fb;}
.sheet__item.is-active{background:#eef5ff;}
.sheet__footer{padding:10px 14px 14px;border-top:1px solid #eef0f3;background:#fff;}
.sheet__cta{width:100%;height:44px;border:0;border-radius:10px;background:#2f6bff;color:#fff;font-weight:700;cursor:pointer;}
.sheet__cta:active{transform:translateY(1px);}
body.sheet-open{overflow:hidden;}
/* sheet 열리면 tabbar는 숨기기(또는 뒤로 보내기) */
body.sheet-open .tabbar{transform:translate3d(0,110%,0)!important;pointer-events:none!important;}
/* =========================================================
* MEDIA: @media (max-width:768px){
* ========================================================= */
@media (max-width:768px){
.tabbar{position:fixed!important;left:0;right:0;bottom:0;z-index:1500!important;}
}
/* =========================================================
* MEDIA: @media (max-width:1510px){
* ========================================================= */
@media (max-width:1510px){
}
/* =========================================================
* MEDIA: @media screen and (min-width: 768px) {
* ========================================================= */
@media screen and (min-width: 768px) {
.mob{display: none !important;}
.web {display: block !important;}
.login_form { width:45rem; border:1px solid #dfdfdf; border-radius:1.6rem; padding:4rem; background:#ffffff; display:flex; flex-direction:column; gap:4rem; }
.tabbar{display: none;}
.h2box-box {display: flex; gap: 1rem; align-items: center;}
.content-wraper > header{height: 11rem; padding: 1rem; display: flex; flex-direction: column; gap: 1rem 2rem; padding: 1rem 2rem; z-index: 101}
.top_utill{position: relative; top: 0; width: 100%; height: 3.2rem; transform: unset; right: auto;}
.top_utill .item04{display:block;}
.hq-nav__list{gap:2.5rem; width:100rem}
.hq-nav__list li{flex:1;}
.hq-right{position: unset;}
.hq-right input{width:100%;}
.search-box.st1{display: flex; flex-direction: row;}
.search-box .btn-wrap{width: auto;}
.search-box .btn-wrap button,
.search-box .btn-wrap a{height:3.8rem;}
.search-box .search-group{flex-direction: row;}
.search-box .search-item{flex-direction: row; align-items: center;}
.search-box .search-item .input-box{width:auto; flex-direction: row; align-items: center;}
#apprvAlarmPopDiv:before {right: 108px;}
.btn-wrap.st1{}
#dateRangePowerForm .search-box .search-item .input-box span input {width: 16rem;}
.board-info-desc{flex-direction: row;}
.search-item.st1{flex-direction: row; align-items: flex-start;}
.weather-wrapper{flex-direction: row; align-items: center;}
.h2box-box{flex-direction: row; align-items: center;}
.h2box-box .weather-boxwrap{padding-left: 1rem; border-left:1px solid #d5d9e0}
.top_utill li.item01{display: flex;}
.site-inv-wrap{margin-top:1rem;}
.hq-right .search-box.st1{padding:0;}
.hq-right .sselect-wrap{width: 27rem}
.hq-right .sselect-box{margin-top: 1rem; background: #ffffff; padding: .5rem; box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); border-radius: 0 0 10px 10px;}
.hq-right .sselect-list{padding: 1rem;}
.hq-right .sselect-list li{font-size: 1.6rem; padding: .3rem 0; cursor: pointer; line-height: 1.4;}
.hq-right .sselect-list li:hover{color:#0071fe}
.auth-box .auth-chk label{font-size: 1.4rem; border:1px solid #dddddd; border-radius:2rem; padding:1rem 2rem; display: inline-flex; justify-content: center; align-items: center; cursor: pointer;}
#main .content-wraper .inner-1{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; width: 100%; padding: 0 2rem; justify-content: space-between;flex: 1 1 0; min-width: 0;}
#main .content-wraper .inner-1> div{flex: 1 1 0 !important; min-width: 0 !important; width: auto !important; box-sizing: border-box; }
#main .content-wraper .inner-1 > .gen-st{padding: 0 !important; height: auto;}
#main .content-wraper .inner-1 > .gen-st .blk-hd{padding:1.5rem 1.5rem 0 1.5rem;}
#main .content-wraper .inner-2{display: flex; flex-direction: row; padding: 0 2rem;}
#main .content-wraper .inner-2> div{flex: 1;}
#main .gen-st .tbs__panels{padding: 0 1.5rem 0 1.5rem;}
.gen-st-tab{justify-content: inherit; margin-top: 3rem;}
.gen-st-tab .item02{margin-top: 3rem;}
.plant-lst .gen-trd-cont{padding: 0;}
#main .gen-trd .tbs__nav{position: absolute;}
#main .gen-trd .blk-hd .tbs {position: absolute; right: 0; top: 8px;}
#main .content-wraper .inner-1 .rev-st-bottom{width: 100%;}
.rev-st .blk-hd{padding-top: 1rem;}
.smprec-wrap{gap:0; border-radius: 16px;}
.smprec-box{height: 100%;border-radius:0;border:0;box-shadow: inherit;position: relative;padding: 1rem 1.5rem;border-radius:16px 0 0 16px}
.smprec-box .tbs__panel.is-active{display: flex;}
.smprec-box + .smprec-box{border-radius: 0 16px 16px 0;}
.smprec-box + .smprec-box:before{content:'';position: absolute; width: 1px; height:calc(100% - 3.5rem); background: #f2f3f5; top: 50%; left: 0; transform: translateY(-50%);}
.smprec-box .smprec-cont{justify-content: center;}
.smprec-box .smprec-box{margin-top: 5px;}
.gen-trd{padding:1.5rem;}
.gen-trd .blk-hd {padding-left: 1.4rem; padding:1rem 0 0 0;}
.plant-lst .blk-hd{ padding:1rem 0 0 0;}
#siteList1{display: none;}
.content-wrap{display: flex; flex-direction: column; align-items: flex-start; gap: 25px; padding: 0px 0px 10px; position: relative; align-self: stretch; width: 100%; flex: 0 0 auto; background-color: #ffffff; border-radius: 14px; border: 1px solid; border-color: #e5e7eb; box-shadow: 0px 1px 2px -1px #0000001a, 0px 1px 3px #0000001a;}
.plant-detail-cont{padding:0 1rem;}
.sd-titbox{padding:0;}
.sd-titbox.card{padding:1.5rem 1.5rem 0 1.5rem;}
.inv-list-btns.swiper{padding:0;}
.p-stat-item01{flex-direction: row;}
.p-stat-item01 .card:last-child{height:auto; display: flex; flex-direction: column; justify-content: space-between;}
.plant-detail-cont .plant-detail_panels:has(.tbs__panel.is-active[data-tbs-panel="p-stat"]){background-color: #ffffff;}
.gen-trend-wrap{flex-direction: row;}
.tbs.st1 .tbs__nav{height: 4.4rem; border-bottom: 1px solid #E5E7EB;}
.tbs.st1 + .tbs__panels{background: #ffffff;}
.totalList3-cont.totalList3{padding-top: 0rem;}
.totalList3-cont.totalList3 .btn-boxwrap{ position: unset;}
.totalList3-cont.totalList3 .sell-boxwrap{display: flex; flex-direction: row;}
.plant-kpi-box .item{flex:1; display: flex; gap:1rem;}
.plant-kpi-box .item.site-st-box{flex:.5;}
.totallist-3.web{display: flex; }
.totallist-3-wrap .tbl-group{display: flex; gap: 1rem; align-items: center;}
.totallist-3 .status-dot {width: 17px; height:17px; border-radius: 50%; margin-bottom:0px; display: inline-block;}
.totallist-3 .status-dot.status-normal{background-color:var(--op--run)}
.totallist-3 .status-dot.status-standby{background-color:var(--op--wait)}
.totallist-3 .status-dot.status-fault{background-color:var(--op--err)}
.totallist-3 .status-dot.status-comm{background-color:var(--op--comm)}
.site-st-cont-total .site-stbox{flex-direction: row;}
.plant-kpi-box{padding: 0 2rem;}
.plant-kpi-sch{display: flex; justify-content: space-between; flex-direction: row; align-items: center; margin-bottom: auto;padding: 0rem;}
.sell-boxwrap{display: flex; flex-direction: row; margin-bottom: 1rem; }
.multi-combo-dropdown{z-index: 9; width: 41rem;}
.plant-lst-cont{margin-left: -1.5rem; width: calc(100% + 3rem); border-top:1px solid #e5e7eb;}
.totallist-3-wrap .pct-barbox{width:100%;}
.totallist-3-wrap .pct-barbox .pct-bar{position:relative;width:100%;height:.6rem;background:#eaf2ff;border-radius:999px;overflow:hidden;}
.totallist-3-wrap .pct-barbox .pct-bar .pct-fill{position:relative;height:100%;}
.totallist-3-wrap .pct-barbox .pct-bar .pct-fill:before{content:"";position:absolute;left:0;top:0;height:100%;width:var(--pct);background:var(--op--wait);}
.plant-kpi-sch .btn-combo-box button{position: unset; padding: 0 2rem 0 0;}
.plant-kpi-sch .item02{gap: .5rem;}
.p-stat-cont .out{display: flex; justify-content: space-between;}
.p-stat-cont .out-chart{position: relative; top: -0.5rem;}
.p-stat-cont .out-txt{/*padding-top:.5rem;*/}
.inv-list-btns .swiper-slide>.invrt-wrap{height: 100%; justify-content: space-between;}
.search-box .search-item .input-box span input{width:20rem; color:#697077;}
.p-stat-item02 .search-box input{width: 16rem;}
#siteDetailTableBodyMobile{height:32.5rem}
#siteLineChart{width: 100%; height: 39rem;}
.inverterDetail .search-box{flex-direction: row; padding: 0; }
.inverterDetail #toggleChannels{height:3.8rem;}
.elec-meter{display: flex; flex-direction: row; justify-content: space-between;position: relative;}
.elec-meter:before{content: ''; position: absolute; width: calc(100% + 3rem); height: 1px; background: #E5E7EB; bottom: 0; left: -15px;}
.elec-meter .search-box input{width: 15rem; font-size: 1.4rem; padding: 1rem;}
.elec-meterbox .tbl-util .channel-wrapper{width: 25rem;}
.elec-meterbox .channel-checkboxes{position: absolute;width: 25rem; background: #ffffff;padding:1rem; box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); border-radius: 0 0 10px 10px;border: 1px solid #d5d9e0; border-top: none;}
.elec-meterbox .tbl-util .channel-wrapper .channel-checkboxes{width: 25rem;}
.string-tab-wrap button{all: unset; font-weight: 600;font-size: 1.4rem; padding:.5rem 1rem 0; height: 3.5rem; color: #4a5565; text-align: center; letter-spacing: 0; line-height: 20px; white-space: nowrap;}
.string-tab-wrap button.active{all: unset; font-size: 1.4rem; font-weight: 600; padding:.5rem 1rem 0; height: 3.5rem; color: #2b7fff; text-align: center;letter-spacing: 0;line-height: 20px;white-space: nowrap; border-bottom: 3px solid #2b7fff;}
.elec-meterbox .tbl-util{display: flex; justify-content: space-between; align-items: center; flex-direction: revert;}
.gen-time-wrap .rev-st-top{/*margin-top:1rem;*/}
.gen-time-wrap .rev-st-bottom{}
.gen-time-wrap .tbs__nav.position-absolute{position: relative !important;}
.p-stat-item01 .card__hd{height: 2.6rem; align-items: center;}
.rev-est .rev-st-bottom{height:auto;}
.rev-est .rev-st-bottom {margin: 0px -15.5rem -0.5rem -1.5rem; padding: 1rem 1.5rem 0; width: calc(100% + 3rem); height: calc(100% - 2.5rem); border-radius: 0 0 0px 16px;}
.rev-est .rev-st-top{margin-top:0;}
.rev-est .card__ttl{display: flex; align-items: center;}
.rev-est .card__ttl .help{margin-left: .5rem;}
.totallist-3-wrap .layer-pop .layer-box{margin-top: 3rem; /*width: calc(100% - 20rem); height: calc(100% - 7rem);*/ border-radius: 1rem;}
.map-status-item{flex-direction: row !important; flex: 1; padding: 2rem; height: 4rem !important;}
.map-status-item > div{flex-direction: row;}
.map-status-item > div p{font-size: 1.6rem;}
.map-status-item strong{font-size: 1.6rem;}
.totallist-3-wrap h1{font-size: 1.8rem; font-weight: 600;}
.totallist-3-wrap .ol-zoom{top: 5.5em;}
.totallist-3-wrap .ol-control button{width: 3rem; height: 3rem;}
.totallist-3-wrap .layer-pop .layer-head{padding: 1rem 2rem 0.5rem 2rem; align-items: center;}
.totallist-3-wrap .layer-pop .modal-close{border-radius: 0 0 1rem .1rem;}
.ol-viewport canvas{border-radius: 0 0 1rem 1rem;}
#map{border-radius: 1rem;}
#excelOptionModal .search-box{display: flex; flex-direction: column;}
#excelOptionModal.layer-pop .layer-box .input-box{display: flex; flex-direction:row; align-items: center; gap: .5rem;}
#excelOptionModal.layer-pop .layer-box .input-box span:not(.bz-dd){display: inline-block;}
#excelOptionModal.layer-pop .layer-box .multi-combo-wrapper{display: flex; flex-direction: column; gap: .5rem;}
#excelOptionModal.layer-pop .multi-combo-dropdown .combo-list{flex-wrap: nowrap; flex-direction: column; border:1px solid #eee; border-radius:.5rem; padding:1rem;}
#excelOptionModal.layer-pop .multi-combo-dropdown .combo-item{}
.p-info-cont .dropzone-wrap .dropzone{width:100%;height:120px;min-height:120px;padding:0;border:1px solid #e6e8eb!important;border-radius:6px;display:flex;align-items:center;justify-content:center;background:#fff;position:relative;overflow:hidden;}
.p-info-cont .dropzone-wrap .dropzone:before,
.dz-default.dz-message:before{display: none;}
.p-info-cont .dropzone-wrap .dz-default{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:10px;margin:0;text-align:center;color:#9aa3af;}
.p-info-cont .dropzone-wrap .dz-default .dz-button{all:unset;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#9aa3af;cursor:pointer;font-size:14px;line-height:1.4;}
.p-info-cont .dropzone-wrap .dz-default .dz-button:after{content:'파일을 선택하거나, 이곳에 파일을 끌어다 놓으세요'; font-size: 1.4rem;}
.p-info-cont .dropzone-wrap .dz-default .dz-button:before{content:'';width:28px;height:28px;display:block;opacity:.65;background-repeat:no-repeat;background-position:center;background-size:contain;background-image:url(../images/upload2.svg);}
.p-info-cont .dropzone-wrap .dz-default .dz-button img{display: none;}
.attach-list .attach-items li{flex-direction: row;}
#dc-voltage-date .search-item input{width:18rem}
.site-st-box{display: flex !important;}
.site-st-box-mob{display: none !important;}
.dz-preview{align-items: center; flex-direction: row;}
.attach-items{display: flex; flex-direction: column; width: 100%;}
.attach-item{display: flex; justify-content: space-between; align-items: center; font-size: 1.6rem; padding: .5rem 0;}
.attach-item > div{display: flex; gap:1rem;}
.attach-item button,
.attach-item a{display: flex; align-items: center; gap: .5rem;}
.btn-view .material-symbols-outlined{font-size: 2rem;}
.file-list{display: flex; flex-direction: column; font-size: 1.6rem; gap: 1rem;}
.file-list .file-list-utill{display: flex; justify-content: space-between; align-items: center;}
.file-list .file-list-utill .total{font-weight: 600;}
.file-list .file-list-utill .total .current{color:#0b50d0;}
.file-list .file-list-utill .upload-delete-btn{background-color: #FFFFFF; border: 1px solid #58616a; color: #1e2124; border-radius: .3rem; padding: .5rem 1rem;}
.file-list .upload-list{}
.file-list .upload-list li{}
.file-list .upload-list .file-name{display: flex; align-items: center;}
.file-list .upload-list .file-info{}
.layer-pop .layer-box{width:auto;}
.layer-pop .layer-head button.close{position: absolute; right: 2rem; top: 1rem; cursor: pointer; z-index: 1; padding: .4rem; border: 1px solid #b4b4b4; display: flex; justify-content: center; align-items: center; border-radius: .8rem;}
footer#footer{padding-bottom: 1rem; width:100%;}
}
/*@media (min-width:1511px){
#main .content-wraper .inner-1{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:2rem;
align-items:stretch;
}
#main .content-wraper .inner-2{}
#main .content-wraper .inner-1 > *,
#main .content-wraper .inner-2 > *{
min-width:0;
}
}*/
/* =========================================================
* MEDIA: @media (max-width: 1200px){
* ========================================================= */
@media (max-width: 1200px){
.p-stat-item01{display: flex; flex-wrap: wrap;}
.p-stat-item01 >section{flex: 0 0 calc(50% - 1rem); box-sizing: border-box;}
.gen-trend-wrap {flex-direction: column; }
.mh-gnb__list{gap:0; font-size: 1.5rem;}
.sselect-wrap .sselect-head{padding: 0.5rem 1.6rem .5rem 3.6rem; background-position: center left .5rem;}
.hq-right .sselect-list li{font-size: 1.4rem;}
}
/* =========================================================
* MEDIA: @media (max-width: 1349px){
* ========================================================= */
@media (max-width: 1349px){
#main .content-wraper .inner-1{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
/* =========================================================
* MEDIA: @media (max-width: 1200px){
* ========================================================= */
@media (max-width: 1200px){
#main .content-wraper .inner-2{
display: flex; flex-direction: column;
}
}
/* =========================================================
* MEDIA: @media (max-width: 768px){
* ========================================================= */
@media (max-width: 768px){
#siteList{display:none!important;}
#main .content-wraper .inner-1,
#main .content-wraper .inner-2{
grid-template-columns:1fr;
}
}
/* 공통 아이콘 스타일 */
[class^="wi-new-st"] {
display: inline-block;
width: 20px;
height: 20px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
vertical-align: middle;
}
/* 1. 흐림 / 기본값 (SKY 4) */
.wi-new-st1 {background-image: url('../images/wi-st001.png');}
/* 2. 구름많음 (SKY 3) */
.wi-new-st2 {background-image: url('../images/wi-st002.png');}
/* 3. 맑음 (SKY 1) */
.wi-new-st4 {background-image: url('../images/wi-st004.png');}
/* 4. 비 / 빗방울 (PTY 1, 4, 5) */
.wi-new-st5 {background-image: url('../images/wi-st005.png');}
/* 5. 눈 / 진눈깨비 / 눈날림 (PTY 2, 3, 6, 7) */
.wi-new-st6 {background-image: url('../images/wi-st006.png');}
#wrap{display:flex; min-width: 37.5rem; min-height: 100%; user-select: text; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text;}
/* =========================================================
* Agreement Responsive UI (Mobile First)
* - BASE: Mobile (<=767)
* - WEB : @media screen and (min-width: 768px)
* ========================================================= */
/* page base (keep test.css root) */
.agree-page{width:100%;min-height:100dvh;background:#fff;color:#111;padding-bottom:92px;}
/* =========================
* MOBILE (BASE)
* ========================= */
/* 웹 카드(그림1)는 모바일에서 숨김 */
.agree-webcard{display:none;}
/* 모바일 헤더/타이틀/본문/푸터 노출 */
.agree-mhd{height:56px;display:flex;align-items:center;padding:0 16px;}
.agree-back{width:40px;height:40px;border:0;background:transparent;border-radius:10px; display:flex;align-items:center;justify-content: FLEX-START; font-size: 35px;line-height:1;color:#111;}
.agree-mttl{padding:6px 20px 8px;}
.agree-mttl h1{margin:0;font-size:22px;line-height:1.25;font-weight:800;letter-spacing:-0.3px;}
.agree-mbody{padding:12px 20px 20px; height: 100vh; position: relative;}
.agree-mbody:after{content:''; display: inline-block; width:100%; height:100%; background-color:rgba(243,244,246,.4); border-top:1px solid #f1f3f6; position: absolute; z-index: 0; top: 8rem; left: 0;}
.ag-m-all{display:flex;align-items:center;gap:10px; padding:18px 0;;}
.ag-m-all input{position:absolute;opacity:0;pointer-events:none;}
.ag-m-ico{width:28px;height:28px;border-radius:50%; border:2px solid #d6dbe6;background:#fff; display:inline-flex;align-items:center;justify-content:center;flex:none;}
.ag-m-all input + .ag-m-ico{background:#ffffff;border-color:#dddddd;}
.ag-m-all input + .ag-m-ico::after{content: ""; width: 15px; height: 9px; border-left: 3px solid #dddddd; border-bottom: 3px solid #dddddd; transform: rotate(-45deg); margin-top: -5px;}
.ag-m-all input:checked + .ag-m-ico{background:var(--op--wait);border-color:var(--op--wait)}
.ag-m-all input:checked + .ag-m-ico::after{content: ""; width: 15px; height: 9px; border-left: 3px solid #ffffff; border-bottom: 3px solid #ffffff; transform: rotate(-45deg); margin-top: -5px;}
.ag-m-txt{font-size:16px;font-weight:800;}
.agree-mlist{margin-top:10px; z-index: 1; position: relative;}
.agree-mrow{display:flex;align-items:center;justify-content:space-between; padding:10px 0;}
.ag-m-item{display:flex;align-items:center;gap:10px;cursor:pointer;}
.ag-m-item input{position:absolute;opacity:0;pointer-events:none;}
.ag-m-ico-sm{width: 12px; height: 6px; border-left: 2px solid #C6C7C8; border-bottom: 2px solid #C6C7C8; transform: rotate(-45deg); margin-top: -1px;}
.ag-m-item input:checked + .ag-m-ico-sm{width: 12px; height: 6px; border-left: 2px solid var(--op--wait); border-bottom: 2px solid var(--op--wait); transform: rotate(-45deg); margin-top: -1px;}
.ag-m-txt-sm{font-size:14px;color:#6b7280;font-weight:600;}
.ag-m-view{border:0;background:transparent;color:#6b7280; font-size:14px;font-weight:700;padding:6px 8px;border-radius:8px;}
.ag-m-view:hover{background:#f6f7f9;}
.agree-mft{position:fixed;left:0;right:0;bottom:0; padding:14px 20px calc(14px + env(safe-area-inset-bottom)); background:#fff;}
.ag-confirm{ width:100%;height:54px; border:0;border-radius:12px; font-size:16px;font-weight:800; background:#b9bcc2;color:#fff;}
.ag-confirm:not(:disabled){background:var(--op--wait);}
/* =========================
* WEB (>=768)
* ========================= */
/* =========================================================
* MEDIA: @media screen and (min-width: 768px){
* ========================================================= */
@media screen and (min-width: 768px){
/* 웹에서는 footer 고정 버튼 필요 없으니 패딩 제거 */
.agree-page{padding-bottom:0;background:#fff;}
/* 모바일 블록 숨김 */
.agree-mhd,.agree-mttl,.agree-mbody,.agree-mft{display:none;}
/* 웹 카드 노출 */
.agree-webcard{display: flex; flex-direction: column; align-items: center;max-width:1100px;margin:0px auto;padding:32px 24px;}
.agree-webcard-cont{width: 100%;}
.agree-web-all{background:#fff;border:1px solid #e6e8ee;border-radius:10px; padding:18px 18px;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0;}
.agree-web-list{background:#fff;border:1px solid #e6e8ee;border-top:0; border-bottom-left-radius:10px;border-bottom-right-radius:10px;}
.agree-web-row{display:flex;align-items:center;justify-content:space-between; padding:14px 18px;}
.agree-web-row + .agree-web-row{border-top:1px solid #e6e8ee;}
.ag-check{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none;}
.ag-check input{position:absolute;opacity:0;pointer-events:none;}
.ag-ico{width:18px;height:18px;border-radius:4px;border:1px solid #cfd6e4;background:#fff; display:inline-flex;align-items:center;justify-content:center;flex:none; }
.ag-check input:checked + .ag-ico{background:#0a5bff;border-color:#0a5bff;}
.ag-check input:checked + .ag-ico::after{ content:"";width:9px;height:5px; border-left:2px solid #fff;border-bottom:2px solid #fff; transform:rotate(-45deg);margin-top:-1px;}
.ag-txt{font-size:16px;font-weight:600;color:#111;}
.ag-go{font-size:22px;line-height:1;color:#7a8597;text-decoration:none;padding:6px 10px;border-radius:8px;}
.ag-go:hover{background:#f4f7ff;color:#0a5bff;}
.agree-web-actions{display:flex;justify-content:center;gap:20px;margin-top:26px;}
.ag-btn{min-width:220px;height:54px;border-radius:10px;font-size:16px;font-weight:700;cursor:pointer;}
.ag-btn--ghost{background:#fff;border:1px solid #8fb0ff;color:#0a5bff;}
.ag-btn--primary{background:#0047d3;border:1px solid #0047d3;color:#fff;}
.ag-btn--primary:disabled{background:#b9bcc2;border-color:#b9bcc2;cursor:default;}
}
/* =========================
* Modal (common) - 그대로
* ========================= */
.ag-modal{display:none;position:fixed;inset:0;z-index:1000}
.ag-modal.is-open{display:block}
.ag-modal__dim{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.ag-modal__panel{position:relative;max-width:720px;margin:10vh auto;background:#fff;border-radius:12px;overflow:hidden}
.ag-modal__bd{/*max-height:60vh;*/overflow:auto;padding:16px}
/* =========================
* Agree modal: Mobile bottom-sheet 확정 + 모달 오픈 시 하단 확인버튼 숨김
* (기존 CSS 맨 아래에 추가)
* ========================= */
.ag-modal__dim{background:rgba(0,0,0,.45);}
body.ag-modal-open .agree-mft{display:none !important;}
@media (max-width: 767px){
.ag-modal__panel{position:fixed !important;left:0;right:0;bottom:0;top:auto;width:100%;margin:0 !important;max-width:none;max-height:78vh;border-radius:16px 16px 0 0;}
.ag-modal__bd{max-height:calc(78vh - 56px);overflow:auto;-webkit-overflow-scrolling:touch;}
}
/* =========================================================
* MEDIA: @media screen and (max-width: 767px){
* ========================================================= */
@media screen and (max-width: 767px){
.ag-modal__panel{left:0;right:0;bottom:0;top:auto;transform:none;width:100%;max-height:78vh;border-bottom-left-radius:0;border-bottom-right-radius:0;}
}
.ag-modal__hd{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #eef0f3;}
.ag-modal__ttl{font-size:16px;font-weight:800;}
.ag-modal__x{width:36px;height:36px;border:0;background:transparent;border-radius:10px;font-size:22px;line-height:1;cursor:pointer;}
.ag-modal__bd{padding:16px 16px 5rem 16px;overflow:auto;max-height:calc(78vh - 54px);color:#111;font-size:14px;line-height:1.6;}
/* Privacy Policy (Mobile First + Desktop >=768) */
.pp{padding:12px 0 32px;}
.pp__container{max-width:1200px;margin:0 auto;padding:0 12px;}
.pp__header{display:flex;flex-direction:column;gap:12px;align-items:flex-start;justify-content:space-between;margin:10px 0 14px;}
.pp__titlebox{flex:1;min-width:0;}
.pp__title{margin:0 0 8px;font-size:22px;line-height:1.15;letter-spacing:-0.3px;color:#111827;}
.pp__desc{margin:0;color:#4b5563;line-height:1.6;font-size:14px;}
.pp__meta{width:100%;flex:0 0 auto;}
.pp__metaDl{margin:0;padding:14px;border:1px solid #e5e7eb;background:#fff;border-radius:14px;box-shadow:0 8px 20px rgba(17,24,39,.06);}
.pp__metaRow{display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
.pp__metaRow+.pp__metaRow{margin-top:8px;}
.pp__metaDl dt{color:#6b7280;font-size:12px;}
.pp__metaDl dd{margin:0;color:#111827;font-weight:700;font-size:12px;}
.pp__grid{display:grid;grid-template-columns:1fr;gap:14px;align-items:start;}
.pp__toc{position:relative;overflow:visible;}
.pp__tocCard{position:sticky;top:0;z-index:20;border-radius:0;border-left:0;border-right:0;border-top:0;padding:10px 0;border-bottom:1px solid #e5e7eb;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);box-shadow:0 8px 16px rgba(17,24,39,.06);overflow:visible;}
.pp__tocHead{display:none;}
.pp__tocLabel{font-weight:800;color:#111827;letter-spacing:-0.2px;}
.pp__tocTop{font-size:12px;color:#2563eb;text-decoration:none;}
.pp__tocTop:hover{text-decoration:underline;}
.pp__tocNav{display:flex;flex-direction:column;gap:6px;padding: 1rem;}
.pp__tocNav--responsive{display:flex;flex-direction:row;gap:8px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding:0 10px 4px;scroll-padding-left:10px;scroll-padding-right:10px;scrollbar-width:none;}
.pp__tocNav--responsive::-webkit-scrollbar{display:none;}
.pp__tocLink{display:block;white-space:nowrap;flex:0 0 auto;padding:10px 12px;border-radius:999px;text-decoration:none;color:#374151;font-size:12.5px;line-height:1.3;border:1px solid transparent;background:#f3f4f6;max-width:100%;}
.pp__tocLink:hover{border-color:#dbeafe;background:#eff6ff;color:#1d4ed8;}
.pp__content{min-width:0;}
.pp__card{border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:16px;box-shadow:0 10px 28px rgba(17,24,39,.06);}
.pp__card+.pp__card{margin-top:12px;}
.pp__intro{background:linear-gradient(180deg,#f8fafc 0%,#fff 70%);}
.pp__lead{margin:0;color:#374151;line-height:1.7;font-size:14px;}
.pp__h2{margin:0 0 10px;font-size:16px;line-height:1.25;letter-spacing:-0.2px;color:#111827;}
.pp__body{color:#374151;line-height:1.75;font-size:14px;word-break:keep-all;}
.pp__ol{margin:0;padding-left:18px;}
.pp__ol>li{margin:10px 0;}
.pp__bullets{margin:10px 0 0;padding-left:18px;}
.pp__bullets>li{margin:6px 0;color:#374151;}
.pp__tableWrap{margin-top:12px;border:1px solid #e5e7eb;border-radius:16px;overflow:visible;background:#fff;}
.pp__table{width:100%;border-collapse:separate;border-spacing:0;min-width:0;}
.pp__table thead{display:none;}
.pp__table,.pp__table tbody,.pp__table tr,.pp__table td{display:block;width:100%;}
.pp__table tbody tr{border-bottom:1px solid #e5e7eb;padding:10px;}
.pp__table tbody tr:last-child{border-bottom:0;}
.pp__table tbody td{padding:10px 0;border-bottom:0;color:#374151;font-size:13px;vertical-align:top;}
.pp__table tbody td::before{content:attr(data-th);display:block;font-size:11px;font-weight:800;color:#6b7280;margin-bottom:6px;}
.pp__footer{margin-top:16px;display:flex;justify-content:flex-end;}
.pp__btnTop{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 14px;border-radius:999px;border:1px solid #e5e7eb;background:#fff;color:#111827;text-decoration:none;font-weight:800;font-size:13px;box-shadow:0 10px 22px rgba(17,24,39,.06);}
.pp__btnTop:hover{background:#f9fafb;}
.pp__card[id]{scroll-margin-top:84px;}
/* Desktop / Web (>=768px) */
/* =========================================================
* MEDIA: @media screen and (min-width:768px){
* ========================================================= */
@media screen and (min-width:768px){
.pp{padding:16px 0 40px;}
.pp__container{padding:0 16px;}
.pp__header{flex-direction:row;gap:16px;align-items:flex-start;margin:10px 0 18px;}
.pp__title{font-size:28px;}
.pp__meta{width:280px;}
.pp__grid{grid-template-columns:320px 1fr;gap:18px;}
.pp__tocCard{position:sticky;top:16px;z-index:auto;border-radius:16px;border:1px solid #e5e7eb;padding:14px;background:#fff;backdrop-filter:none;box-shadow:0 8px 24px rgba(17,24,39,.06);}
.pp__tocHead{display:flex;margin-bottom:10px;}
.pp__tocNav--responsive{flex-direction:column;overflow:visible;padding:0;scrollbar-width:auto;}
.pp__tocLink{white-space:normal;flex:auto;padding:9px 10px;border-radius:12px;font-size:13px;background:#f9fafb;}
.pp__card{border-radius:18px;padding:18px;}
.pp__h2{font-size:18px;}
.pp__tableWrap{border-radius:14px;overflow:auto;}
.pp__table{display:table;width:100%;min-width:720px;}
.pp__table thead{display:table-header-group;}
.pp__table tbody{display:table-row-group;}
.pp__table tr{display:table-row;}
.pp__table td,.pp__table th{display:table-cell;width:auto;}
.pp__table tbody tr{padding:0;border-bottom:0;}
.pp__table tbody td{padding:12px;border-bottom:1px solid #f1f5f9;}
.pp__table tbody td::before{content:none;display:none;}
.pp__table thead th{position:sticky;top:0;z-index:1;background:#f9fafb;color:#111827;font-weight:800;font-size:12px;text-align:left;padding:12px;border-bottom:1px solid #e5e7eb;}
}
/* Desktop wider (>=1024px) - optional title/meta spacing */
/* =========================================================
* MEDIA: @media screen and (min-width:1024px){
* ========================================================= */
@media screen and (min-width:1024px){
.pp__grid{gap:18px;}
}
/* Terms (Mobile First + Web >=768) */
/* Terms page (term layout + legacy contents/tnc card) - Mobile First */
.term{background:#f6f7fb;}
.term__container{max-width:1200px;margin:0 auto;padding:0 12px;}
.term__header{display:flex;flex-direction:column;gap:12px;align-items:stretch;margin:10px 0 12px;}
.term__titlebox{min-width:0;}
.term__title{margin:0 0 8px;font-size:22px;line-height:1.15;letter-spacing:-0.3px;color:#111827;}
.term__desc{margin:0;color:#4b5563;line-height:1.65;font-size:14px;}
.term__meta{margin:0;padding:14px;border:1px solid #e5e7eb;background:#fff;border-radius:14px;box-shadow:0 8px 18px rgba(17,24,39,.06);}
.term__metaRow{display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
.term__metaRow+.term__metaRow{margin-top:8px;}
.term__meta dt{color:#6b7280;font-size:12px;}
.term__meta dd{margin:0;color:#111827;font-weight:800;font-size:12px;}
.term__toc{position:sticky;top:0;z-index:30;display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding:10px 10px 8px;margin:0 -12px 12px;border-bottom:1px solid #e5e7eb;background:rgba(246,247,251,.92);backdrop-filter:blur(8px);scrollbar-width:none;}
.term__toc::-webkit-scrollbar{display:none;}
.term__tocLink{flex:0 0 auto;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 12px;border-radius:999px;border:1px solid transparent;background:#fff;color:#374151;text-decoration:none;font-size:12.5px;font-weight:700;box-shadow:0 6px 14px rgba(17,24,39,.06);}
.term__tocLink:hover{border-color:#dbeafe;background:#eff6ff;color:#1d4ed8;}
.term__grid{display:grid;grid-template-columns:1fr;gap:12px;align-items:start;}
.term__side{display:none;}
.term__content{min-width:0;}
.term__card{border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:16px;box-shadow:0 10px 22px rgba(17,24,39,.06);}
.term__card+.term__card{margin-top:12px;}
.term__footer{margin-top:14px;display:flex;justify-content:flex-end;}
.term__topBtn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 14px;border-radius:999px;border:1px solid #e5e7eb;background:#fff;color:#111827;text-decoration:none;font-weight:800;font-size:13px;box-shadow:0 10px 18px rgba(17,24,39,.06);}
.term__topBtn:hover{background:#f9fafb;}
.term__card[id]{scroll-margin-top:92px;}
/* ===== legacy contents/tnc card typography (inside term__card) ===== */
/* term__card 안에서 .tnc.card가 “카드 2겹”으로 보이지 않게 */
.term__card .contents.item1{padding:0;background:transparent;}
.term__card .contents.item1 .tnc.card{max-width:none;margin:0;padding:0;border:0;background:transparent;border-radius:0;box-shadow:none;}
/* 제목 */
.term__card .tnc.card h2{margin:0 0 12px;font-size:18px;line-height:1.25;letter-spacing:-0.2px;color:#111827;}
/* 본문 기본 */
.term__card .tnc.card p{margin:10px 0;color:#374151;font-size:14px;line-height:1.75;word-break:keep-all;}
.term__card .tnc.card p:last-child{margin-bottom:0;}
/* “제n조” 라벨(칩 스타일) */
.term__card .tnc.card p strong{display:inline-block;padding:6px 10px;border-radius:999px;background:#f3f4f6;color:#111827;font-size:13px;font-weight:800;letter-spacing:-0.1px;}
/* 리스트 */
.term__card .tnc.card ol{margin:10px 0 14px;padding-left:18px;color:#374151;font-size:14px;line-height:1.75;}
.term__card .tnc.card ol>li{margin:8px 0;}
.term__card .tnc.card ul{margin:8px 0 0;padding-left:18px;color:#374151;font-size:14px;line-height:1.7;}
.term__card .tnc.card ul>li{margin:6px 0;}
/* 부칙 구분 */
.term__card .tnc.card br{display:block;content:"";margin:12px 0;}
/* Web >=768px */
/* =========================================================
* MEDIA: @media screen and (min-width:768px){
* ========================================================= */
@media screen and (min-width:768px){
.term{}
.term__container{padding:0 16px;}
.term__header{flex-direction:row;align-items:flex-start;justify-content:space-between;gap:16px;margin:10px 0 14px;}
.term__title{font-size:28px;}
.term__meta{width:280px;flex:0 0 auto;}
.term__toc{display:none;}
.term__grid{grid-template-columns:320px 1fr;gap:18px;}
.term__side{display:block;}
.term__sideCard{position:sticky;top:16px;border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:14px;box-shadow:0 10px 22px rgba(17,24,39,.06);}
.term__sideHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.term__sideTitle{font-weight:900;color:#111827;letter-spacing:-0.2px;}
.term__sideTop{font-size:12px;color:#2563eb;text-decoration:none;}
.term__sideTop:hover{text-decoration:underline;}
.term__sideNav{display:flex;flex-direction:column;gap:6px;}
.term__sideLink{display:block;padding:9px 10px;border-radius:12px;text-decoration:none;color:#374151;font-size:13px;line-height:1.3;border:1px solid transparent;background:#f9fafb;}
.term__sideLink:hover{border-color:#dbeafe;background:#eff6ff;color:#1d4ed8;}
.term__card{border-radius:18px;padding:18px;}
.term__card .tnc.card h2{font-size:22px;margin-bottom:14px;}
.term__card .tnc.card p{font-size:15px;}
.term__card .tnc.card ol,.term__card .tnc.card ul{font-size:15px;}
}
/* (선택) 초소형 기기에서 목차 탭이 너무 길면 2줄로 */
/* =========================================================
* MEDIA: @media (max-width:360px){
* ========================================================= */
@media (max-width:360px){
.term__toc{flex-wrap:wrap;overflow-x:visible;}
}
/* =========================================================
JOIN (MOBILE FIRST)
- mobile 기본(mjoin1/mjoin2)
- web은 @media (min-width:768px)로 덮어쓰기(join1)
========================================================= */
/* base */
body{background:#fff;}
.content-wraper{max-width:none;margin:0 auto;/*padding:0 0 25px;*/background-color: transparent;min-height: calc(100vh - 11rem);}
/* header: mobile */
.join-mhdr{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 14px;border-bottom:1px solid #eef0f4;background:#fff;position:sticky;top:0;z-index:20;}
.join-mhdr.type1{position: fixed; width: 100%;}
.join-mhdr__back{display: inline-flex; align-items: center; justify-content: flex-start; width: 34px; height: 34px; border-radius: 10px; color: #111; text-decoration: none; font-size: 40px; line-height: 1;}
.join-mhdr__ttl{font-weight:800;font-size:18px;letter-spacing:-.2px;}
.join-mhdr__sp{/*width:34px;height:34px;*/}
/* web 전용 요소는 모바일에서 숨김 */
.join-webttl,.join-step,.step-wrap{display:none;}
/* card: mobile flat */
.content-agree.card.st1.edit{background:#fff;border:0;border-radius:0;box-shadow:none;padding:18px 16px 4px;}
.content-agree.card.st1.edit h2{font-size:22px;font-weight:900;margin:0 0 12px;}
/* sections */
.join-sec{width:100%;margin:0;}
.join-login{width:100% !important;margin:0 auto;text-align:center;padding:8px 0 0;}
.join-login .un-line{text-decoration:underline;font-weight:900;}
.join-sec .tb-style2 tr{border:none;}
.join-step-member input.is-invalid,
.join-step-member select.is-invalid,
.join-step-member textarea.is-invalid{
outline:1px solid #ff0000;
outline-offset:0;
}
/* focus 상태에서도 유지 */
.join-step-member input.is-invalid:focus,
.join-step-member select.is-invalid:focus,
.join-step-member textarea.is-invalid:focus{
outline:1px solid #ff0000;
box-shadow:none !important;
}
/* inputs */
.form-control{width:100%;height:44px;border:1px solid #dfe3ea;border-radius:8px;padding:8px 10px;font-size:14px;outline:none;background:#fff;}
.form-control:focus{border-color:#b8c2d6;box-shadow:0 0 0 3px rgba(47,125,246,.12);}
/* helpers */
.d-flex{display:flex;}
.gap-2{gap:10px;}
.flex-dir{flex-direction:row;align-items:center;}
.me-3{margin-right:12px;}
.rkwndcl{width:80px;display:flex;align-items:center;justify-content:center;font-weight:600;}
/* buttons (mobile) */
.btn-st1,.btn-st99{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 14px;border-radius:10px;border:1px solid #cfd6e4;background:#eee;color:#111;font-size:1.4rem;font-weight:500;cursor:pointer;white-space:nowrap;}
.btn-st1{min-width:110px;background:#2f7df6;border-color:transparent;color:#fff;}
.btn-st1:disabled{background-color: #9e9e9e; color:#ffffff;}
.btn-st99{min-width:110px;border-color:transparent;background:#2f7df6;color:#fff;}
.btn-st99:hover{background:#1e67f0;}
.btn-st5 {
background-color: #eaeaea;
color: #000000;
border: 1px solid #bebebe;padding: .5rem 1rem;
border-radius: .5rem;}
/* role chips */
.role-chips{display:flex;flex-wrap:wrap;gap:8px;}
.role-chips .chip{position:relative;display:inline-flex;align-items:center;}
.role-chips .chip input{position:absolute;opacity:0;pointer-events:none;}
.role-chips .chip span{display:inline-flex;align-items:center;height:32px;padding:0 12px;border-radius:999px;border:1px solid #dfe3ea;background:#fff;font-size:12px;font-weight:800;color:#111;}
.role-chips .chip input:checked + span{background:#2f7df6;border-color:transparent;color:#fff;}
/* email (mobile) */
.email-input-group > div{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.email-input-group .at-mark{font-weight:900;color:#6b7280;}
#emailId{flex:1;max-width:none;}
#emailDomain{flex:1;max-width:none;}
#emailSelect{flex:1;max-width:none;height:44px;}
/* hp code */
.hp-code-wrap{position:relative;flex:1;min-width:0;}
.hp-code-wrap .time{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:900;color:#ED171A;}
/* file drop */
.file-drop__box{position:relative;border:1px dashed #cfd6e4;border-radius:8px;background:#f8fafc;min-height:160px;display:flex;align-items:center;justify-content:center;text-align:center;padding:18px;}
.file-drop__box input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;}
/* footer cta (mobile fixed) */
.join-cta{/*position:fixed;*/left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;border-top:1px solid #eef0f4;padding:14px 16px;z-index:30;}
.join-cta__cancel{display:none;}
.join-cta__submit{width:100%;height:54px;border-radius:12px;font-size:16px;font-weight:600;background:#9aa0a6;color:#fff;}
.join-cta__submit.is-primary{background:#2f7df6;}
/* 모바일 단계 전환 (mjoin1 -> mjoin2) */
body.join-step-member .join-sec[data-join-step="plant"]{display:none;}
body.join-step-plant .join-sec[data-join-step="member"]{display:none;}
/* =========================================================
WEB (join1) : 768px+
========================================================= */
/* =========================================================
* MEDIA: @media screen and (min-width:768px){
* ========================================================= */
@media screen and (min-width:768px){
*{-webkit-font-smoothing:antialiased;box-sizing:border-box; font-size: 1.6rem; line-height: 1;}
.join-mhdr{display:none;}
.content-wraper{background-color:#ffffff;}
body.main .content-wraper,
body.sub .content-wraper{background-color: transparent;}
/* web title + steps on */
.login_form .login-utill a, .login_form .login-utill button{font-size: 1.6rem;}
.join-webttl{display:block;margin:22px 0 14px;text-align:center;font-size:34px;font-weight:900;letter-spacing:-.6px;color:#111;}
.join-step{display:flex;justify-content:center;gap:22px;margin:10px auto 22px;padding:0;list-style:none;}
.join-step li{display:flex;align-items:center;justify-content:center;min-width:120px;cursor:default;}
.join-step li div{display:flex;flex-direction:column;align-items:center;gap:6px;}
.join-step li i{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:999px;border:1px solid #dfe3ea;background:#fff;}
.join-step li.step01 i::before{content:"✓";font-size:18px;color:#9aa0a6;}
.join-step li.step02 i::before{content:"✎";font-size:18px;color:#fff;}
.join-step li span{font-size:12px;color:#111;font-weight:700;}
.join-step li.on i{background:radial-gradient(circle at 30% 30%, #29d1c6, #2f7df6 70%);border-color:transparent;}
.step-wrap{display:flex; margin-bottom: 10rem; }
.step-wrap.agree.web{margin-bottom:6rem;display: flex; width: 100%; justify-content: center;}
.step-wrap.agree li{display: flex; position: relative; align-items: center; }
.step-wrap.agree li+li:before{content:''; display: inline-block; width: 7rem; height: 1px; background-color: #dddddd; margin-top:-2rem;}
.step-wrap.agree li > div{display: flex; flex-direction: column; align-items: center; gap: 1rem;}
.step-wrap.agree li i{width:7rem; height: 7rem; border:1px solid #dddddd; background-color: #ffffff;; border-radius: 50%; display: flex; justify-content: center; align-items: center;}
.step-wrap.agree li i:before{content:''; display: inline-block; width: 3.2rem; height: 3.2rem; background-size: cover;}
.step-wrap.agree li.on i{background:linear-gradient(270deg,rgba(2,41,160,1),rgba(37,168,186,1),rgba(44,183,180,1));}
.step-wrap.agree li.step01 i:before{background-image: url("data:image/svg+xml;utf8,");}
.step-wrap.agree li.step01.on i:before{background-image: url("data:image/svg+xml;utf8,");}
.step-wrap.agree li.step02 i:before{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M14.6667 5.33331H9.06675C6.82654 5.33331 5.70643 5.33331 4.85079 5.76929C4.09814 6.15278 3.48622 6.7647 3.10272 7.51735C2.66675 8.373 2.66675 9.4931 2.66675 11.7333V22.9333C2.66675 25.1735 2.66675 26.2936 3.10272 27.1493C3.48622 27.9019 4.09814 28.5138 4.85079 28.8973C5.70643 29.3333 6.82654 29.3333 9.06675 29.3333H20.2667C22.507 29.3333 23.6271 29.3333 24.4827 28.8973C25.2354 28.5138 25.8473 27.9019 26.2308 27.1493C26.6667 26.2936 26.6667 25.1735 26.6667 22.9333V17.3333M10.6667 21.3333H12.8994C13.5517 21.3333 13.8778 21.3333 14.1847 21.2596C14.4568 21.1943 14.7169 21.0866 14.9555 20.9404C15.2246 20.7754 15.4552 20.5448 15.9164 20.0836L28.6667 7.33331C29.7713 6.22874 29.7713 4.43788 28.6667 3.33331C27.5622 2.22874 25.7713 2.22874 24.6667 3.33331L11.9164 16.0836C11.4552 16.5448 11.2246 16.7754 11.0597 17.0446C10.9135 17.2831 10.8057 17.5433 10.7404 17.8154C10.6667 18.1223 10.6667 18.4484 10.6667 19.1006V21.3333Z' stroke='%23999999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");}
.step-wrap.agree li.step02.on i:before{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M14.6667 5.33331H9.06675C6.82654 5.33331 5.70643 5.33331 4.85079 5.76929C4.09814 6.15278 3.48622 6.7647 3.10272 7.51735C2.66675 8.373 2.66675 9.4931 2.66675 11.7333V22.9333C2.66675 25.1735 2.66675 26.2936 3.10272 27.1493C3.48622 27.9019 4.09814 28.5138 4.85079 28.8973C5.70643 29.3333 6.82654 29.3333 9.06675 29.3333H20.2667C22.507 29.3333 23.6271 29.3333 24.4827 28.8973C25.2354 28.5138 25.8473 27.9019 26.2308 27.1493C26.6667 26.2936 26.6667 25.1735 26.6667 22.9333V17.3333M10.6667 21.3333H12.8994C13.5517 21.3333 13.8778 21.3333 14.1847 21.2596C14.4568 21.1943 14.7169 21.0866 14.9555 20.9404C15.2246 20.7754 15.4552 20.5448 15.9164 20.0836L28.6667 7.33331C29.7713 6.22874 29.7713 4.43788 28.6667 3.33331C27.5622 2.22874 25.7713 2.22874 24.6667 3.33331L11.9164 16.0836C11.4552 16.5448 11.2246 16.7754 11.0597 17.0446C10.9135 17.2831 10.8057 17.5433 10.7404 17.8154C10.6667 18.1223 10.6667 18.4484 10.6667 19.1006V21.3333Z' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");}
.step-wrap.agree li span{font-weight: 600;}
/* ===== mh-gnb base ===== */
.hq-header .mh-gnb{position:relative;display: block;}
.mh-gnb__panel{position:relative;}
.mh-gnb__list{list-style:none;margin:0;padding:0;display:flex;gap:18px;align-items:center; flex-direction: row; overflow: unset;}
.mh-gnb__item{position:relative; border-bottom: none;}
.mh-gnb__item.is-active{position:relative;}
.mh-gnb__item.is-active:after{content: ''; position: absolute; width: 100%; height: 3px; left: 0; bottom: -13px; background-color: var(--op--wait);}
.mh-gnb__item.M300{position:relative;min-width:3rem}
.mh-gnb__item.M340{min-width: 11.3rem;}
.mh-gnb__item.M230{min-width: 12.1rem;}
.mh-gnb__item.M200{min-width:10rem}
.mh-gnb__item.M800{min-width:7rem;}
.mh-gnb__item.M900{min-width:11rem;}
.mh-gnb__link{display:inline-flex;align-items:center;gap:8px; padding:12px 10px;border-radius:12px; text-decoration:none;color:#111;font-weight:600;}
.mh-gnb__item > .mh-gnb__sub + .mh-gnb__link,
.mh-gnb__item > .mh-gnb__link + .mh-gnb__sub{ }
/*
.mh-gnb__item:has(> .mh-gnb__sub) > .mh-gnb__link::after{content:"";width:7px;height:7px;border-right:2px solid #111;border-bottom:2px solid #111; transform:rotate(45deg);margin-top:-2px;opacity:.9;}
*/
/* ===== submenu ===== */
.mh-gnb__sub{list-style:none;margin:0;padding:10px; position:absolute;left:0;top:100%; min-width:240px;background:#fff;border:1px solid #e6e8ee;border-radius:14px; box-shadow:0 14px 40px rgba(0,0,0,.14); display:none;z-index:2000;}
.mh-gnb__sub li a{display:block;padding:10px 12px;border-radius:12px; text-decoration:none;color:#111;font-weight:500; font-size: 1.4rem;}
.mh-gnb__sub li a:hover{background:#f4f6f9;}
/* ===== open state ===== */
.mh-gnb__item.is-open > .mh-gnb__sub{display:block;}
.mh-gnb__item.is-open > .mh-gnb__link{}
.mh-gnb__item.is-open:has(> .mh-gnb__sub) > .mh-gnb__link::after{transform:rotate(-135deg);border-color:#0b57d0;}
/* card restore */
.content-agree.card.st1.edit{border:1px solid #e6e8ee;border-radius:10px;box-shadow:0 2px 10px rgba(17,24,39,.05);padding:22px 22px 12px;}
.content-agree.card.st1.edit h2{margin:0 0 18px;}
.join-sec{margin:0 auto 18px; width:90rem;}
.member_join .email-input-group{flex-direction: row;}
body.join-step-member .join-sec[data-join-step="plant"] {display:block;}
/* table form restore (row layout) */
.tb-style2{border-collapse:separate;border-spacing:0 10px;}
.tb-style2 colgroup{display: block;}
.tb-style2,.tb-style2 tbody,.tb-style2 tr,.tb-style2 th,.tb-style2 td{display:table;width:auto;}
.tb-style2 tbody{width:100%;}
.tb-style2{display:table;width:100%;}
.tb-style2 tr{display:table-row;padding:0;border:0;}
.tb-style2 th{display:table-cell;padding:6px 10px 6px 2px;white-space:nowrap;font-size:1.6rem;}
.tb-style2 td{display:table-cell;padding:6px 0;}
.tb-style3,
.tb-style3 *{all:unset}
div[data-modal="modal-img"]{display:none; width:auto; position: fixed; background: #ffffff; top: 40%; left: 50%; transform: translate(-50%, -40%);z-index: 9; border:1px solid #ceced1; border-radius:2rem; padding:2rem; box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);}
div[data-modal="modal-img"] .imageModal-content{overflow: auto; height:auto;}
/* inputs/buttons sizing */
.form-control{height:40px;border-radius:6px;}
.btn-st1,.btn-st99{height:40px;border-radius:6px;min-width:120px;}
.btn-st1{background:#eee;border-color:#cfd6e4;color:#111;}
#errorTopModalDiv{background: transparent;}
#errorTopModalDiv .layer-head{display: none;}
#errorTopModalDiv .layer-box{min-height: auto; padding: 2rem; width: auto; min-width: 65em; border-radius: 1rem;}
#errorTopModalDiv .layer-box > button.close{display: none;}
#errorTopModalDiv .layer-body{}
#errorTopModalDiv button.f-close{border-top: 1px solid #f1f5f9; background-color: #f8fafc; display: flex; justify-content: center; align-items: center; padding: 1rem; margin: 2rem -2rem -2rem -2rem; border-radius: 0 0 1rem 1rem;}
#errorTopModalDiv button.f-close span{color: #64748b; font-weight: 600; letter-spacing: normal; font-size: 1.6rem;}
#errorTopModalDiv input{width:100%;}
#constructTopModal{display: flex; flex-direction: column; gap: 1rem;}
#constructTopModal *{font-size: 1.4rem}
/*#constructTopModal .sp-top-modal{width: 20rem;}*/
#constructTopModal .sheet__dim{border-radius: 2rem;}
#constructTopModal .sp-content-modal{width: calc(100% - 8rem); position: absolute; z-index: 101; background: #ffffff;display: flex; flex-direction: column; gap: .3rem; margin-top: .5rem;}
#constructTopModal .sp-list-modal{border: 1px solid #DFDFDF; padding: 1rem; height: 22rem; overflow: auto;}
#constructTopModal .bz-dd input{font-size: 1.4rem; padding: 1rem;}
#constructTopModal .sheet__panel{top: 12rem;}
#constructTopModal .search-box{padding:0;}
#errorSiteSearch li{}
#errorSiteSearch li span{display: inline-block;}
#errorSiteSearch li span label{font-size: 1.6rem; padding: .5rem 0; display: inline-block; height: 100%; width: 100%;}
/* footer cta: not fixed on web */
.join-cta{position:static;left:auto;right:auto;bottom:auto;border:0;padding:0;margin:18px auto 0;background:transparent;gap:10px;}
.join-cta__cancel{display:inline-flex;background:#fff;border-color:#cfd6e4;}
.join-cta__submit{width:auto;height:40px;border-radius:6px;font-size:1.4rem;font-weight:500;background:#2f7df6;}
}