@charset "utf-8";
:root{

    --qcells-black:#000000;
    --qcells-white:#ffffff;
    --gray-100:#f9f9f9;
    --gray-200:#f5f5f5;
    --gray-300:#eaeaea;
    --gray-400:#dfdfdf;
    --gray-500:#cccccc;
    --gray-600:#bebebe;
    --gray-700:#959595;
    --gray-800:#767676;
    --gray-900:#666666;
    --gray-1000:#333333;
    --point-main-soft:#01A2D0;
    --point-main-dark:#0229A0;
    --point-secondary-green:#0BB9A8;
    --point-secondary-red:#ED171A;
    --point-secondary-blue:#41A3FF;

}
html, body{height: 100%;}
input, select{border: 1px solid var(--gray-400); border-radius: .5rem; padding:.8rem}
input:placeholder{color:var(--gray-100)}
select{position: relative; padding-right: 4.4rem; background: #fff url(../images/select-arrow.png) calc(100% - 1.6rem) 50% no-repeat; background-size: 1.2rem;}
.ellipsis{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.txt-red{color:var(--point-secondary-red)}
.bz-dd{position: relative;}
/*.bz-dd:after{content:''; background-image: url(../images/calendar.png);display: inline-block; width: 2rem; height: 2rem;}*/
#wrap{background-color:#f9f9f9; display:flex; min-width: 37.5rem;}
nav.navbar-nav{width: 20rem; min-height:100vh; background-color: #ffffff; display: flex; flex-direction: column; align-items: center; border-right:1px solid #eaeaea; position: relative;}
nav.navbar-nav .go-qcells{display: none;}
.brand-box{width:16rem; height:10rem;display:flex; flex-direction: column; justify-content: center; align-items: center; border-bottom:1px solid #eaeaea;}
.brand-box i{background:url(../images/qcells-brand.png); width:9rem; height:2.6rem; display: inline-block;}
.brand-box span{font-weight: 400; font-size: 1rem; line-height: 1.6rem;}
.nav{width:16rem; padding-top:4rem; display: flex; flex-direction: column; gap: 2rem;}
.nav .nav-item{}
.nav .nav-item[class^="nav-"] a{display: flex; align-items: center; gap:.8rem; padding-left: 2rem; height: 4rem; border-radius: 1rem; font-size: 1.4rem;}
.nav .nav-item[class^="nav-"] a:before{content:''; background-repeat: no-repeat; background-size: cover; display: inline-block; width: 2rem; height: 2rem;}
.nav .nav-item a:hover{background-color:rgba(237, 245, 248, 1)}
.nav .nav-01 a:hover{color: rgba(1, 162, 208, 1);}
:root.nav-collapsed{
nav.navbar-nav{width: 8rem;}
nav.navbar-nav .brand-box{width:auto;}
nav.navbar-nav .brand-box i{width: 4rem; height: 4rem; background: url(../images/qcells-brand-sm.png) no-repeat center center;}
nav.navbar-nav .brand-box span{display:none;}
.nav{width:auto;}
.nav .nav-item[class^="nav-"] a{width: 4rem; padding-left: inherit; justify-content: center;}
.nav .nav-item[class^="nav-"] a span{display: none;}
nav.navbar-nav .btn-logout{width:auto;}
nav.navbar-nav .btn-logout:before{content:''; display: inline-block; width: 4rem; height: 4rem; background: url(../images/icon-logout.png) center center no-repeat;}
nav.navbar-nav .btn-logout span{display:none;}
.content-wrapper{width:calc(100% - 8rem);}
}

.nav .nav-toggle a::before{background:url(../images/icon-menu-off.png);}
.nav .nav-01 a::before{background:url(../images/icon-home.png)}
.nav .nav-02 a::before{background:url(../images/icon-grid.png)}
.nav .nav-03 a::before{background:url(../images/icon-file.png)}
.nav .nav-04 a::before{background:url(../images/icon-announcement.png)}
.nav .nav-05 a::before{background:url(../images/icon-folder.png)}
.nav .nav-06 a::before{background:url(../images/icon-user.png)}
.nav .nav-toggle a:hover::before{background:url(../images/icon-menu-off.png);}
.nav .nav-01 a:hover::before{background:url(../images/icon-home-on.png)}
.nav .nav-02 a:hover::before{background:url(../images/icon-grid-on.png)}
.nav .nav-03 a:hover::before{background:url(../images/icon-file-on.png)}
.nav .nav-04 a:hover::before{background:url(../images/icon-announcement-on.png)}
.nav .nav-05 a:hover::before{background:url(../images/icon-folder-on.png)}
.nav .nav-06 a:hover::before{background:url(../images/icon-user-on.png)}
nav.navbar-nav .btn-logout{background-color: rgba(245, 245, 245, 1); border:1px solid #dfdfdf; border-radius: 1rem; width: 16rem; height: 4rem; display: flex; justify-content: center; align-items: center; position: absolute; bottom: 2rem; font-size: 1.4rem; font-weight: 500;}
nav.navbar-nav .btn-logout:hover{background-color: #eaeaea; border:1px solid #bebebe}
.content-wrapper{width:calc(100% - 20rem); background: url(../images/top-bg.png) right 0 no-repeat;flex:1;}
nav.navbar{width: 100%; height: 10rem; display: flex; justify-content: space-between; align-items: center; font-size: 1.4rem; padding:0 4rem; border-bottom: 1px solid rgba(174, 174, 174, 0.2);}
.m-navbar{display:none;}
.go-qcells{width:16.1rem; height: 4.4rem; display:inline-block;background-size: cover; background-image: url(../images/go-qcells.png);}
.go-qcells:hover{background: url(../images/go-qcells-on.png);}
.top-bar{display: flex; gap:3.2rem;}
.top-bar .nav-item{display: flex; align-items: center; gap:.8rem; font-size: 1.4rem;}
.top-bar .nav-item[class^="nav-"]:before{content:''; background-repeat: no-repeat; background-size: cover; display: inline-block; width: 2rem; height: 2rem; font-weight: 500;}
.top-bar .nav-01::before{background-image:url(../images/alert-triangle.png);}
.top-bar .nav-02::before{background-image:url(../images/icon-user.png);}
.top-bar .nav-03::before{background-image:url(../images/icon-logout.png);}

footer{border-top:1px solid #dfdfdf; padding:1.6rem 0; display: flex; justify-content: center; align-items: center;
.footer-copy{font-size: 1.4rem; color:#959595}
}


.container{padding:4rem; display: flex; flex-direction: column; gap: 2.4rem;}
.main{
h3{font-size:1.8rem;display: flex; gap: .8rem; margin-bottom:0}
h3:before{content:''; width:2.3rem; height:2.3rem; display: inline-block; background-size: cover;background-repeat: no-repeat;}
header{display: flex; justify-content: space-between; align-items: center;}
}
.container:has(.main-contab01){padding-top:5rem}
.main-contab01{position: absolute; margin-top: -5rem;}
.main-contab01 button{background: linear-gradient(180deg, #b3b3b3 0%, #999999 100%); color: #fff; font-weight: 600; border: none; border-radius: 0 0 1rem 1rem; padding: .6rem 1.2rem; cursor: pointer; box-shadow: 0 2px 4px rgba(0,0,0,.15); transition: all .2s ease;}
.main-contab01 button.active{background: linear-gradient(180deg, #2196ff 0%, #0071FE 100%);}
.main-contab01 button:hover{background-color: #005cdc; box-shadow: 0 3px 6px rgba(0,0,0,.25);}

.switch { position: relative; display: inline-block; vertical-align: top; width:110px; height:30px; padding: 3px; background-color: white; border-radius: 18px; box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05); cursor: pointer; background-image: -webkit-linear-gradient(top, #eeeeee, white 25px); background-image: -moz-linear-gradient(top, #eeeeee, white 25px); background-image: -o-linear-gradient(top, #eeeeee, white 25px); background-image: linear-gradient(to bottom, #eeeeee, white 25px); }
.switch-input { position: absolute; top: 0; left: 0; opacity: 0; }
.switch-label { position: relative; display: block; height: inherit; font-size: 10px; text-transform: uppercase; /* background: #eceeef; */background: #4fb845; border-radius: inherit; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15); -webkit-transition: 0.15s ease-out; -moz-transition: 0.15s ease-out; -o-transition: 0.15s ease-out; transition: 0.15s ease-out; -webkit-transition-property: opacity background; -moz-transition-property: opacity background; -o-transition-property: opacity background; transition-property: opacity background; }
.switch-label:before, .switch-label:after { position: absolute; top: 50%; margin-top: -.5em; line-height: 1; -webkit-transition: inherit; -moz-transition: inherit; -o-transition: inherit; transition: inherit; }
.switch-label:before { content: attr(data-off); right: 11px; /* color: #aaa; */ color:#ffffff; /* text-shadow: 0 1px rgba(255, 255, 255, 0.5);  */}
.switch-label:after { content: attr(data-on); left: 11px; color: white; text-shadow: 0 1px rgba(0, 0, 0, 0.2); opacity: 0; }
.switch-input:checked ~ .switch-label { background: #47a8d8; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2); }
.switch-input:checked ~ .switch-label:before { opacity: 0; }
.switch-input:checked ~ .switch-label:after { opacity: 1; }
.switch-handle { position: absolute; top: 6px; left: 5px; width:24px; height:24px; background: white; border-radius: 10px; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2); background-image: -webkit-linear-gradient(top, white 40%, #f0f0f0); background-image: -moz-linear-gradient(top, white 40%, #f0f0f0); background-image: -o-linear-gradient(top, white 40%, #f0f0f0); background-image: linear-gradient(to bottom, white 40%, #f0f0f0); -webkit-transition: left 0.15s ease-out; -moz-transition: left 0.15s ease-out; -o-transition: left 0.15s ease-out; transition: left 0.15s ease-out; }
.switch-handle:before { content: ''; position: absolute; top: 50%; left: 50%; margin: -8px 0 0 -8px; width: 16px; height: 16px; background: #f9f9f9; border-radius: 6px; box-shadow: inset 0 1px rgba(0, 0, 0, 0.02); background-image: -webkit-linear-gradient(top, #eeeeee, white); background-image: -moz-linear-gradient(top, #eeeeee, white); background-image: -o-linear-gradient(top, #eeeeee, white); background-image: linear-gradient(to bottom, #eeeeee, white); }
.switch-input:checked ~ .switch-handle { left: auto; right:5px; box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2); }
.switch-green > .switch-input:checked ~ .switch-label { background: #4fb845; }




h2{font-weight: 700; font-size: 2.4rem;}
h3{font-weight: 700; font-size: 1.8rem;}
h4{font-weight: 600; font-size: 1.8rem;}
.h2box{display: flex; gap: 2rem;}
.acc-label{font-size: 1.8rem; color: #999999;}
.wrapper {width: 100%; min-height: 100vh; padding: 3rem 5rem; background: url(../images/top-bg.png) right 0 no-repeat #f9f9f9;}
h1.login{font-size:1.4rem; font-weight: normal; display: flex; flex-direction: column; align-items: center;}
h1.login:before{content:'';display:inline-block; background:url(../images/login_logo.png); width:15.6rem; height:6.4rem;}
h1.login span{overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0 none; clip: rect(0, 0, 0, 0);}
h1.h1-logo{font-size:1.4rem; font-weight: normal; display:inline-flex; flex-direction: column; align-items: center;}
h1.h1-logo span{overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0 none; clip: rect(0, 0, 0, 0);}
h1.h1-logo:before{content:'';display:inline-block; background:url(../images/logo.png); width:16rem; height:4.5rem;}
.login_wrap{display: flex; justify-content: center; align-items: center; width: 100%; height:100%; background: url(../images/top-bg.png) right 0 no-repeat #f9f9f9;}
.login_form{ width: 48rem; border: 1px solid var(--gray-400); padding: 4rem; border-radius: 1rem; margin: 0 auto; display: inline-flex; flex-direction: column; background-color: #ffffff;}
.login_box{margin-top:4rem; display: flex; flex-direction: column; gap:1.5rem;}
.login_box input:not([type="checkbox"]){width:100%; padding: 1.6rem 2rem;}
.login-util{display: flex; margin-top:2rem; border-top: 1px solid #eaeaea; padding-top:3.2rem;}
.login-util li{flex:1; text-align: center; position: relative;}
.login-util li + li:before{content: ''; display: inline-block; width: 1px; height: 1.5rem; background-color: #dfdfdf; position: absolute; left: 0; top: calc(50% - .75rem);}
.login_box .btn-st2{height: 5.6rem; border-radius: .8rem;}
.login_form input[type="checkbox"]{width:2rem; height:2rem; border:1px solid rgba(221, 221, 221, 1); border-radius: .4rem;}
.login_box label{color:#767676;}
.login_box .form_check{display: flex; align-items: center; gap: .4rem;}
.main-lyt1{display: flex; flex-direction: column; align-items: center;}
.main-lyt1 h3{margin-bottom:6.5rem; font-size: 4.8rem; font-weight: 600;}
.step-wrap{display:flex; }
.step-wrap.agree{margin-bottom:6rem;}
.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;}
.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,<svg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M10.0001 15.9998L14.0001 19.9998L22.0001 11.9998M29.3334 15.9998C29.3334 23.3636 23.3639 29.3332 16.0001 29.3332C8.63628 29.3332 2.66675 23.3636 2.66675 15.9998C2.66675 8.63604 8.63628 2.6665 16.0001 2.6665C23.3639 2.6665 29.3334 8.63604 29.3334 15.9998Z' stroke='%23999999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");}
.step-wrap.agree li.step01.on i:before{background-image: url("data:image/svg+xml;utf8,<svg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M10.0001 15.9998L14.0001 19.9998L22.0001 11.9998M29.3334 15.9998C29.3334 23.3636 23.3639 29.3332 16.0001 29.3332C8.63628 29.3332 2.66675 23.3636 2.66675 15.9998C2.66675 8.63604 8.63628 2.6665 16.0001 2.6665C23.3639 2.6665 29.3334 8.63604 29.3334 15.9998Z' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");}
.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;}
.content-agree{border:1px solid #dddddd; border-radius:1rem; max-width: 108rem; width:100%;}
.scroll-box{overflow-y: auto;}
.contents.item1{display: flex; flex-direction: column; gap: 1rem;}
.content-agree .scroll-box{}
.content-agree .scroll-box h4{font-weight: 600;}
.content-agree .scroll-box h4 ~ h4 {margin-top: 7rem;}
.content-agree .scroll-box h4 ~ h5{margin-top:3rem;}
.content-agree .scroll-box h5 ~ h5 {margin-top: 3rem;}
.content-agree > ul{}
.content-agree > ul li{padding:3rem 0 3rem 4rem}
.content-agree > ul li + li{border-top:1px solid #dddddd}
.content-agree > ul li:first-of-type{border-radius:1.6rem 1.6rem 0 0;}
.content-agree > ul li:last-of-type{border-radius:0 0 1rem 1rem;}
.agree-chkwrap{background-color: #ffffff;}
.content-agree.card{border:none;}
.content-agree + .btn-wrap{margin-top: 3rem;}
.hp-code-wrap{display:flex; width:100%; position: relative;}
.hp-code-wrap .time{position: absolute;top:50%;right: 8px; color: #ed171a;transform: translate(0,-50%);}
.menber_join table button{width:125px; padding: 1rem;}
.menber_join table input,
.menber_join .hp-code-wrap{flex:1;}
.error-msg[data-msg*="."]{display:inline-block; margin-top:0.5rem; color:#ed171a}


.m-item01{display: flex; gap: 1rem;}
.m-item01>div{ flex: 1 1 calc((100% - 20px) / 4);}
.m-item02{display: flex; gap: 1rem;}
.m-item02-01{ width: 100%; display: flex; flex-direction: column;}
.card{border:1px solid #dfdfdf; background-color: #ffffff; padding: 2rem; border-radius: 1.6rem; display: flex; flex-direction: column; gap: 2rem;}
.card .header{display: flex; justify-content: space-between; align-items: center;}
.content-info{display: flex; justify-content: space-between;}
.content-util{display: flex; gap: 1rem; align-items: center;}
.content-util label{}
.generation-real h3:before{background-image: url(../images/tit_icon_01.png);}
.generation-loss h3:before{background-image: url(../images/tit_icon_02.png);background-size: contain; background-position-y: bottom;}
.generation-avg h3:before{background-image: url(../images/tit_icon_03.png);}
.income-box h3:before{background-image: url(../images/tit_icon_04.png);}
.site-box h3:before{background-image: url(../images/tit_icon_05.png);}
.generation-trend h3:before{background-image: url(../images/tit_icon_06.png);}
.plant-status-list h3:before{background-image: url(../images/tit_icon_07.png);}
.fault-list h3:before{background-image: url(../images/tit_icon_08.png);}
.generation-real > div{flex: 1;}
.generation-real > div:first-of-type{display: flex; flex-direction: column; justify-content: space-between;}
.gr-rel-total{}
.gr-rel-total span{color:#767676; font-size: 1.4rem;;}
.gr-rel-total p{font-size: 2rem; font-weight: 700;}
.generation-trend-tabbox{display: flex; gap: 1rem; align-items: center;}
.generation-trend-tabbox .form_check{margin-right: 0;}

.content-info{display: flex; justify-content: space-between; align-items: center;}
.weather-boxwrap{display: flex; gap: 2rem;align-items: center;}
.weather-box{display: flex; gap: 1rem; align-items: center;}
.weather-box span{font-weight: 700; font-size: 1.4rem;}
[class^="wi-"]{display: inline-block; width:2.4rem; height: 2.4rem;}
.wi-st1{background: url(../images/wi-st01.png);}
.wi-st2{background: url(../images/wi-st02.png);}
.wi-st3{background: url(../images/wi-st03.png);}
.wi-st4{background: url(../images/wi-st04.png);}
.wi-st5{background: url(../images/wi-st05.png);}
.wi-st6{background: url(../images/wi-st06.png);}
.wi-st7{background: url(../images/wi-st07.png);}
.alarm-box{border: 1px solid #DFDFDF; border-radius: .4rem; width: 4rem; height: 4rem; display: flex; align-items: center; justify-content: center; background-color: #ffffff; position: relative;}
.alarm-box > i{background: url(../images/ico_alarm.png); width: 2.4rem; height:2.4rem; display: inline-block;}
.alarm-box > .alarm-msg{display: inline-block; background-color:#D72424; color:#ffffff; font-weight: 700; font-size: 1rem; border-radius: .4rem; padding:.1rem 0.3rem; position: absolute; top:-.5rem; right:calc(-50% - -13px); z-index:1;}
.total-search{border:1px solid #DFDFDF; border-radius:.4rem; position:relative; }
.total-search input{border:0; padding-right: 4rem;}
.total-search a{position: absolute; top: 0; right: 0; height: 100%; width: 4rem; display: flex; justify-content: center; align-items: center;}
.total-search a:before{content:'';border:0; background-image:url(../images/search-icon.png); display: inline-block; width:1.6rem; height:1.6rem;}
.stat-list,
.stat-list{display: flex; gap:1rem;}
.stat-list li{flex:1; background-color:#f5f5f5; display: flex; justify-content: space-between; align-items: center; padding:2rem; height: 8rem; border-radius: .8rem;}
.stat-list li > p{font-weight: 700; font-size:1.6rem; color:#767676;}
.stat-list li > div{text-align: right; font-weight: 700; font-size: 2.8rem; display: flex; gap: .4rem; align-items: baseline; justify-content: right;}

/* .income-stats {display: flex; gap:1rem; flex-wrap: nowrap; flex:1;}
.stat-item { flex: 1; background: #f8fbff; border: 1px solid #e4eaf0; border-radius: 0.6rem; padding: 1rem 1.2rem; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; }
.stat-item.large { flex: 2; background: #0F2245; color: #fff; }
.stat-item > p{font-size: 1.2rem; color:#959595;}
.stat-item.large > p{font-size: 1.4rem; color:#ffffff;}
.stat-item > div{text-align: right;  font-weight: bold;} */
.income-stats {display:grid;grid-template-columns:1.5fr 1fr 1fr;grid-template-rows:auto auto;gap:1.2rem;align-items:stretch;height: 100%;}
.stat-item {flex: 1; background: #ffffff; border: 1px solid #eaeaea; border-radius: 0.6rem; padding: 1rem 1.2rem; display: flex; align-items: center; justify-content: space-between; min-width: 0;}
.stat-item p {font-size: 1.2rem; color:#959595}
.stat-item div {font-size:1.6rem;font-weight:700;}
.stat-item.large {grid-row:span 2; background: #0F2245; color: #fff;display: flex; flex-direction: column;align-items: stretch;}
.stat-item.large > p{text-align:left; font-size: 1.8rem; color: #ffffff; font-weight: 700;}
.stat-item.large > div{text-align: right; font-size: 3.6rem;}

.site-status{display: flex; flex-direction: column; gap:1rem;}
.total-status{border-radius: .8rem; padding: 1.2rem 2rem; background:#f5f5f5 ; display: flex; justify-content: space-between; font-weight: 500; align-items: center;}
.total-status > p{font-size:1.4rem; font-weight: 700; color:#767676;}
.total-status > div{font-size: 2.2rem; font-weight: 700; color:#000000;}
.status-group{display: flex; gap:1rem;}
.status-group .status-item{display: flex; flex-direction: column; gap:.8rem; padding:1.6rem .8rem; flex:1; align-items: center; border:1px solid #eaeaea; border-radius: .8rem;}
.status-group .status-item > p{font-weight: bold;}
.status-group .status-item > div{font-size: 2.2rem; font-weight: 700; text-decoration: underline; text-underline-offset:4px;}
.status-group .status-item > div.ok{color:#0071FE;}
.status-group .status-item > div.warn{color:#959595;}
.status-group .status-item > div.error{color:#ED171A;}
.status-group .status-item > div.comm{color:#EAAC00;}

.gen-total .period-content,
.gen-time .period-content{background-color: #F5F5F5; width: 100%; height: 100%;}
.gen-total .header + div,
.gen-time .header + div{width: 100%; height: 100%;}
.gen-total .period-content > div,
.gen-time .period-content > div{display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%;font-size: 2.8rem; font-weight: 700;}

.monthly-revenue-box{}
.monthly-revenue-box ul{}
.monthly-revenue-box ul li{display: flex; justify-content: space-between;}
.monthly-revenue-box ul li + li{margin-top: 1rem;}
.monthly-revenue-box ul li:first-of-type{}
.monthly-revenue-box > div p{font-size: 1.4rem;font-weight: 700; color:#767676;}

.production-box{margin-top:2rem}
.production-summary{display: flex; gap:1rem}
.production-summary > div{border:1px solid #dfdfdf; flex:1; }
.production-summary .header{display: flex; justify-content: space-between; align-items: center;}
.period-tab {display:flex; border:1px solid #dcdcdc; border-radius:.4rem; min-width:11.1rem; height:4rem; background-color:rgba(237,237,237,1);}
.period-tab li {display:flex; justify-content:center; align-items:center; border-radius:.4rem; font-size:1.4rem; min-width: 4rem; padding: 0 1rem; color:rgba(165,165,165,1); cursor:pointer; transition:all .2s ease; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.period-tab li span {display:inline-block; max-width:100%; font-size:clamp(1rem, 1.2vw, 1.4rem); text-align:center;}
.period-tab li.active {background-color:#fff; box-shadow:0 0 .8rem rgba(0,0,0,.16); font-weight:700; color:rgba(1,162,208,1);}

/*.period-content{display: none;}*/
/*.period-content.active{display: block;}*/

.production-detail-box{display: flex; gap:1rem; margin-top:2rem}
.production-detail-box .header{display: flex; justify-content: space-between; align-items: center;}
.production-detail-box > div{flex:1;}

.error-info,
.mppt-info,
.plant-status{}
.error-info-content{}
.period-tab.type1{float: right; width:auto;display: flex; border:none; border-radius:0; height: 4rem; background-color:transparent;}
.period-tab.type1 > div,
.period-tab.type1 > a{padding:0 1rem;display: flex; justify-content: center; align-items: center;flex:1; border-radius: .4rem; font-size: 1.4rem; color:rgba(165, 165, 165, 1); transition: all 0.2s ease;}
.period-tab.type1 > div.active{background-color: #ffffff; box-shadow: 0,0,.8,0 rgba(0, 0, 0, 0.16); font-weight: 700; color: rgba(1, 162, 208, 1);}
.period-tab.type1 > a:hover{background-color: #ffffff; box-shadow: 0,0,.8,0 rgba(0, 0, 0, 0.16); font-weight: 700; color: rgba(1, 162, 208, 1);}

.str-info-items{display: flex; gap:1rem}
.str-info-items > div{flex:1;}
.tab-list{display: flex; gap:1rem;}
/*.period-content { display: none; }*/
.period-content { display: block; }

.file-box{position: relative; display: flex; width: 100%; gap:1rem;}
.file-box input[type="file"]{ position: absolute; width: 0; height: 0; opacity: 0;;}
.file-box::before{content:attr(data-text); width:100%; border: 1px solid #dfdfdf; background-color: #ffffff; padding: .5rem; border-radius:.5rem;}
.file-box::after{content:'파일첨부';border-radius:.5rem; background-color: #0F2245; color:#ffffff; width:100px; display: flex; justify-content: center; align-items: center; }

.file-box1{position: relative; display: flex; width: 100%; gap:1rem;}
.file-box1 input[type="file"]{ position: absolute; width: 0; height: 0; opacity: 0;;}
.file-box1 label{position: relative;}
.file-box1::after{content:'파일첨부';border-radius:.4rem; background-color: #767A89; color:#ffffff; width:100px; display: flex; justify-content: center; align-items: center; }

.status-content{display: flex; gap: 1rem;}
.status-content > div{flex:1;}
.plant-info-box{flex:2 !important;}
.plant-info-box ul{}
.plant-info-box ul li{display: flex; border-bottom:1px solid #eaeaea; padding:1.2rem 2.4rem;}
.plant-info-box ul li + li{}
.plant-info-box ul li .tit{width:30%; text-align:left; font-weight: 500;}
.plant-info-box ul li > div{width:100%; color: #666666;}
.income-inv-wrap{display: flex; gap: 1rem; margin-top:2rem}
.income-inv-wrap > div{flex:1}
.income-inv-wrap .monthly-revenue-box{flex:2}

.inv-st-content{display: flex; gap: 1rem;}

.search-box{margin-bottom: 2rem; border-radius: 1.6rem; background-color: rgba(242, 242, 242, 1); padding:2.8rem; display: flex; align-items: center; gap: 2rem;flex-wrap:wrap;}
.search-box.between{justify-content:space-between;}
.search-box.center{justify-content: center; flex-wrap:nowrap;}
.search-box label{font-weight: 500;}
.search-item{display: flex; gap:2rem; align-items: center; white-space:nowrap;}
.search-group{display: flex; gap:1.2rem; flex-wrap: wrap; justify-content:center; width:auto; flex:0 1 auto;}
.btn-wrap {display:flex; gap:1rem; justify-content:center;}

.search-box .btn-wrap{}
.search-box .btn-wrap [class^="btn-st"]{min-width:10rem; height: 4rem; width: auto; padding:.8rem 1.6rem; display: flex; justify-content: center;}
.search-box .btn-wrap .btn-st2{background-color:#01A2D0; color:#ffffff;}
.search-box .btn-wrap .btn-st1{ border:1px solid #DFDFDF; background-color:#ffffff; color:#000000}

.board-info-desc{display: flex; justify-content: space-between;}

.main-lyt1 [class^="btn-st"]{border-radius: .5rem; padding:1rem 2rem; width: 15.4rem; height: 5.6rem; display: inline-flex; justify-content: center; align-items: center;}
.btn-wrap{display: flex; gap:1rem; justify-content: center;}
.btn-st1{background-color: #ffffff; border:1px solid #dddddd; }
.btn-st2{background-color:#01a2d0; color:#ffffff;}
.btn-st3{background-color:#293b5d; color:#ffffff;}
.btn-st4{background-color:#f5f5f5; color:#000000; border:1px solid #DFDFDF}
.btn-st5{background-color:#eaeaea; color:#000000; border:1px solid #bebebe}
.btn-st6{background-color:#B2CCFF; color:#000000;}
.btn-st7{background-color:#767A89; color:#ffffff}
.btn-st8{background-color:#FFD9FA; color:#000000}

[class^="btn-st"]{border-radius: .5rem; padding:.5rem 3rem;}
[class^="btn-st"].large{border-radius: .5rem; padding: 1rem 2rem; width: 15.4rem; height: 5.6rem; display: inline-flex; justify-content: center; align-items: center;}
[class^="btn-st"].tp1{border-radius: 4rem;}
/* * :not(.search-wrap div) + .btn-wrap {margin-top: 4rem;} */
.ico-reg{display: flex; justify-content: center; align-items: center; gap: .5rem;}
.ico-reg::before{content:'';display: inline-block; width:1.7rem; height: 1.7rem; background-size: 1.7rem 1.7rem; 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");}
.btn-st2.ico-reg::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");}
.btn-dw{font-size: 1.4rem; border:1px solid #dfdfdf; border-radius: 6rem; padding:.8rem 3.5rem .8rem 1.2rem; background: url(../images/ico-dw.png) no-repeat #f9f9f9; background-position: center right 1.5rem;}
.btn-more{width: 24rem; height: 4rem; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(223, 223, 223, 1); border-radius: .4rem; background-color: #ffffff;;}
.btn-more:after{content:''; background-image: url(../images/chevron-down.png); background-repeat: no-repeat; width: 2rem; height: 2rem;display: inline-block;background-size: cover; margin-left: .5rem;}
.btn-view{border-radius: .5rem; padding:0.4rem 1.2rem; color:#000000; background-color: #ffffff; border:1px solid rgba(223, 223, 223, 1);display: inline-flex; align-items: center; justify-content: center;}
.btn-view:after{content:''; background-image: url(../images/search-sm.png); background-repeat: no-repeat; width: 1.6rem; height: 1.6rem;display: inline-block; background-size: cover; margin-left: .5rem;}

.tbl-wrap{border-top:1px solid #dfdfdf}
.tbl-wrap th,
.tbl-wrap td {padding:1rem;border-top:1px solid #dfdfdf; text-align:center;}
.tbl-wrap th,
.tbl-wrap th *{font-weight: 500;}
.tbl-wrap td{color:#666666}
.tbl-wrap thead{position: sticky; top: 0; background-color: #ffffff;}
.tbl-wrap thead tr:first-of-type th {border:none;}
.tbl-wrap + .btn-more{margin: 0 auto;}
/* table:has(+ .btn-more) {border-bottom:1px solid #dfdfdf;} */
table + .btn-more{margin-top:3rem !important;}
/* .card .tbl-wrap tr:last-of-type td {border:none;} */
.tbl-wrap.type1 th,
.tbl-wrap.type1 td,
.tbl-wrap.type1{border:none}
.tbl-wrap.st1 td{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.tbl-wrap th.asc { cursor: pointer; }
.tbl-wrap th.asc:not(.sorted-asc):not(.sorted-desc)::after{content:''; background-image:url(../images/sort.png); display: inline-block; width:8px; height: 24px;vertical-align: middle; margin-left: 5px;}
.tbl-wrap th.sorted-asc::after { content: " ▲"; font-size: .8rem; vertical-align: middle;}
.tbl-wrap th.sorted-desc::after { content: " ▼"; font-size: .8rem; vertical-align: middle;}
.tbl-util{display: flex; justify-content: space-between;}

.tbl-wrap.st1{}
.tbl-wrap.st1 table{table-layout:fixed}
.tbl-wrap.st1.type1 th,
.tbl-wrap.st1.type1 td{text-align:left;}
.address-st1 {display: flex; flex-direction: column; gap: 1rem;}
.address-st1 > div {display: flex; gap: 1rem;}
.address-st1 > div > input {flex: 1;}

.ts-tbl thead{display: table-header-group;}
.ts-tbl tfoot{display: table-row-group;}
.ts-tbl tbody{display: table-footer-group;}
.ts-tbl th, .ts-tbl td{background-color: #ffffff;}
.ts-tbl th:nth-last-child(-n+5){background-color:rgba(231, 237, 248, 1);}
.ts-tbl td:nth-last-child(-n+5){background-color:rgba(231, 237, 248, 0.2);}
.ts-tbl tfoot td{font-weight: 700;}
.sc-msg{display: flex; align-items: center; gap:.5rem;}
.sc-msg:before{content: ''; background-image: url(../images/sc-msg.png); position: relative; display: inline-block; width: 3rem; height: 3rem;background-size: cover; animation:sc_move 1s infinite linear;}
@keyframes sc_move{
    25%{left:3px}
    50%{left:0}
    75%{left:-3px}
    100%{left:0}
}

.responsive{overflow: auto;}
.responsive thead{position:sticky; top:0;}
.responsive thead th{background-color: #ffffff;}

.mobile-tab{display: flex; gap: 2.8rem; border-bottom: 1px solid rgba(234, 234, 234, 1);}
.mtab-content{display: none;}
.mtab-content.active{display: block;}
.mobile-tab li{font-weight: 500; padding-bottom: 1.6rem;}
.mobile-tab li.active{color: rgba(0, 113, 254, 1); border-bottom:2px solid rgba(0, 113, 254, 1)}

.web-tab{display: flex; gap: 2.8rem; border-bottom: 1px solid rgba(234, 234, 234, 1);}
.wtab-content{display: none;}
.wtab-content.active{display: block;}
.web-tab li{font-weight: 500; padding-bottom: 1.6rem;}
.web-tab li.active{color: rgba(0, 113, 254, 1); border-bottom:2px solid rgba(0, 113, 254, 1)}

.tab-h3{display:flex; gap: 2.8rem; border-bottom: 1px solid rgba(234, 234, 234, 1); margin-bottom: 4rem;}
.tab-h3 li{font-weight: 500; padding-bottom: 1.6rem;}
.tab-h3 li.active{color: rgba(0, 113, 254, 1); border-bottom:2px solid rgba(0, 113, 254, 1)}

.mppt-tab-swiper { width:100%; padding:10px 0; }
.mppt-tab-swiper .swiper-wrapper { display:flex; align-items:center; }
.mppt-tab-swiper .swiper-slide {width: auto; height: auto; background:#f6f6f6; border:1px solid #dfdfdf; border-radius:1.6rem 1.6rem 0 0; padding:8px 20px; font-size:14px; font-weight:400; color:#333; cursor:pointer; /*transition:all .25s ease; box-shadow:0 1px 3px rgba(0,0,0,0.06);*/ white-space:nowrap; }
.mppt-tab-swiper .swiper-slide:not(:last-child) { margin-right:8px; }
.mppt-tab-swiper .swiper-slide.active { background:#ffffff; border-color:#dfdfdf; color:#0071FE; border-bottom: none; }
.mppt-tab-swiper .swiper-slide.click-anim { transform:scale(1.05); transition:transform .3s ease; }
.mppt-section + .card{margin-top:1rem}
.mppt-content-wrap {margin-top: -1px;}
.mppt-content { display:none; padding:20px; border:1px solid #e3e8ef; border-radius:0 0 1.6rem 1.6rem; background:#fff; box-shadow:0 2px 4px rgba(0,0,0,0.04); }
.mppt-content.active { display:block; }
.swiper-button-prev, .swiper-button-next { color:#007aff; opacity:0.6; transition:opacity .3s; }
.swiper-button-prev:hover, .swiper-button-next:hover { opacity:1; }
.mppt-content .header{display: flex; justify-content: space-between; margin-bottom: 2rem;}
.mppt-content-hdtab{display: flex; gap:2rem; align-items:center;}
.mppt-content-hdtab p{font-weight: 400; color: #959595;}

[class^="tunit-"]:after{margin-left: .5rem; font-size: 1.4rem;}
.tunit-kw:after{content:'kW'}
.tunit-kwh:after{content:'kWh'}
.tunit-mwh:after{content:'MWh'}
.tunit-hour:after{content:'hour'}
.tunit-won:after{content:'원'}
.tunit-hourk:after{content:'시간'}
.tunit-temp:after{content:'°C';}
.tunit-pct:after{content:'%'}
.tunit-v:after{content:'V';}
.tunit-a:after{content:'A';}
.tunit-hz:after{content:'Hz';}
.cell-unit{display: flex;gap:1rem; align-items: center;}
.ico-req:after{content:'*'; color:#D72424; margin-left: .5rem; font-weight: 700;}

.tcolor-st1{color:rgba(0, 113, 254, 1) !important;}
.tcolor-st2{color:rgba(149, 149, 149, 1) !important;}
.tcolor-st3{color:rgba(237, 23, 26, 1) !important;}
.tcolor-st4{color:rgba(234, 172, 0, 1) !important;}
.tcolor-st5{color:rgba(1, 162, 208, 1) !important;}

[class^="st-ic"]{border-radius:6rem; border:1px solid #999999; background-color: #f6f6f6; padding:.4rem 1rem; min-width:6rem; 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;}
.st-ic.ok{background-color:#EEF7FF; color:#0071FE; border-color: #0071FE;}
.st-ic.error{background-color: #fff8f8; color:#ED171A; border-color:#ED171A;}
.st-ic.wait{background-color: #f6f6f6; color:#999999; border-color: #999999;}
.st-ic.comm{background-color: #fffcf3; color:#EAAC00; border-color: #EAAC00;}
[class^="st-ty"].ok:before{border-color: #0071FE;}
[class^="st-ty"].error:before{background-color:#ED171A;}
[class^="st-ty"].wait:before{background-color: #999999;}
[class^="st-ty"].comm:before{background-color:#EAAC00;}

.smpup:before{content:''; display: inline-block; width: 1.6rem; height: 1.6rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' height='16px' viewBox='0 0 24 24' fill='none' stroke='%230071FE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-trending-up fw-bold' style='width: 24px; height: 24px'%3E%3Cpolyline points='23 6 13.5 15.5 8.5 10.5 1 18'%3E%3C/polyline%3E%3Cpolyline points='17 6 23 6 23 12'%3E%3C/polyline%3E%3C/svg%3E");}
.smpdown:before{content:''; display: inline-block; width: 1.6rem; height: 1.6rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' height='16px' viewBox='0 0 24 24' fill='none' stroke='%23ED171A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-trending-down fw-bold' style='width: 24px; height: 24px'%3E%3Cpolyline points='23 18 13.5 8.5 8.5 13.5 1 6'%3E%3C/polyline%3E%3Cpolyline points='17 18 23 18 23 12'%3E%3C/polyline%3E%3C/svg%3E");}
.form_check { display: inline-block; position: relative; z-index: 0; margin-right: 2rem; padding-left: 2.5rem; vertical-align: top; }
.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; color: #dddddd; 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; }
.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 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;}

.form_radio { display:inline-block;position:relative;z-index:0;/* margin-right:2.5rem; */padding-left:2.3rem;vertical-align:top}
.form_radio input { position:absolute;left:0;top:0;opacity:0}
/*.form_radio input:focus + label::before { outline:1px dotted #000}*/
.form_radio input:checked + label::after { background-color:#16398B}
.form_radio label { cursor:pointer}
.form_radio label::before { position:absolute;left:0;top:0.2rem;z-index:-2;width:1.8rem;height:1.8rem;border-radius:100%;border:1px solid #666;background-color:#fff;content:''}
.form_radio label::after { position:absolute;left:0.5rem;top:.7rem;z-index:-1;width:0.8rem;height:0.8rem;border-radius:100%;content:''}
.form_radio:last-child { margin-right:0}

.inv-list-btn.swiper { width:100%; height:9.6rem; }
.inv-list-btn.swiper ul { list-style:none; padding:0; margin:0; }
.swiper-slide { display:flex; justify-content:center; align-items:center; font-size:2rem; background:#eee; border-radius:1rem; }
.inv-list-btns { width:100%; overflow:hidden; padding-right:20px; }
.inv-list-btns .swiper-wrapper { display:flex; align-items:stretch; }
.inv-list-btns .swiper-slide { width:auto!important; flex-shrink:0; border:1px solid #ddd; border-radius:.5rem; padding:1rem; background-color:#fff; text-align:center; }
.inv-list-btns .inv-btn-all { width:9.6rem!important; background-color:#ffffff; font-weight:bold; font-size: 1.4rem; border: 1px solid #000000; }
.inv-list-btns .swiper-slide:not(.inv-btn-all) { width:auto!important; min-width:24.6rem; display:flex; background-color:#ffffff; padding:1.6rem 2.4rem; justify-content:space-between; }
.inv-list-btns .swiper-slide > div { display:flex; flex-direction:column; }
.inv-list-btns .swiper-slide > div > p{text-align: left;}
.inv-list-btns .swiper-slide > div .tit { font-size:1.4rem; font-weight:700; }
.inv-list-btns .swiper-slide > div .item01 { font-size:1.2rem; color:#666666; }
.inv-list-btns .swiper-slide > div .item02 { font-size:1.2rem; color:#999999; }
.inv-list-btns .swiper-slide i { display:flex; justify-content:center; align-items:center; width:6rem; height:6rem; }
.inv-list-btns .swiper-slide i.run { border:1px solid rgba(0,113,254,1); border-radius:50%; background-color: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-color: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 { border:1px solid #ddd; background-color:#ffffff; width:9.6rem!important; height:9.6rem; }
.inv-list-btns .inv-btn-all.acitve,
.inv-list-btns .swiper-slide:not(.inv-btn-all).active{border:1px solid rgba(0,0,0,1);}
.inv-list-btns .swiper-slide:last-of-type{border:none; background-color: transparent;}

.inv-st-content{display: flex;  gap: 1rem;}
.inv-st-content.type2{flex-wrap: wrap;}
.inv-st-content > div{flex:1;}
.inv-st-content.type2{margin-top:2rem;}
.inv-st-content .header{display: flex; justify-content: space-between; align-items: center;}
.inv-st-content .inv-st-item2 .period-content,
.inv-st-content .inv-st-item3 .period-content,
.inv-st-content .inv-st-item4 .period-content{background-color: #F5F5F5; width: 100%; height: 100%;}
.inv-st-content .inv-st-item2 > div:not(.header),
.inv-st-content .inv-st-item3 > div:not(.header),
.inv-st-content .inv-st-item4 > div:not(.header){height: 100%;}
.inv-st-content [class^="inv-st-item"] .period-content.active{display: flex; justify-content: center; align-items: center;flex-direction: column; padding: 2rem; gap: 1rem;}
.inv-st-content [class^="inv-st-item"] .period-content > p{font-size: 1.8rem; font-weight: 500; color: #959595;}
.inv-st-content .inv-st-item2 .period-content >div,
.inv-st-content .inv-st-item3 .period-content >div,
.inv-st-content .inv-st-item4 .period-content >div{display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; font-size: 2.8rem; font-weight: 700;}
.inv-st-content.type1 .inv-st-item1 {flex: 1 1 calc((100% - 1rem) * 1/3);}
.inv-st-content.type1 .inv-st-item5 {flex: 2 1 calc((100% - 1rem) * 2/3);}
.inv-st-item1-cont{background-color: #F5F5F5; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem;}
.inv-st-item1-cont p{font-size: 1.8rem; font-weight: 500; color: #959595;}
.inv-st-item1-cont .tunit-kwh{font-size: 2.8rem; font-weight: 700; display: flex; flex-direction: column; justify-content: center; align-items: center;}


.layer-pop{position:fixed; top:0; left:0; width:100%; height:100%; z-index:1000;}
.layer-pop:before{content:''; display: inline-block; width:100%; height:100%; background-color: rgba(0,0,0,.3);}
.layer-pop .layer-box{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); min-width:400px; background:#fff; overflow:hidden; box-shadow:0 4px 12px rgba(0,0,0,0.2);}
.layer-pop .layer-head{background:linear-gradient(270deg,rgba(2,41,160,1),rgba(37,168,186,1),rgba(44,183,180,1)); display: flex; justify-content: space-between; padding: 1rem 1.5rem; color: #ffffff}
.layer-pop .layer-head i::before{font-size:2rem;}
.layer-pop .layer-body{background-color:#ffffff; min-height: 10rem; padding:1rem 1.5rem;}

.srch-wrap{display: flex; gap:1.2rem; flex-direction: row;}
.srch-wrap .msel{width:100%}
.srch-wrap .msel.active .msel-list{display: flex; flex-wrap: wrap;}
.srch-wrap .msel li{width:50%}
.srch-wrap .msel label{display: flex; align-items: center; width: 100%;}
.srch-wrap .msel li:hover{background-color:#f5f5f5;}
.msel{position:relative;width:18rem;font-size:1.4rem;}
.msel-head{border:1px solid #ccc;padding:.8rem 1rem;border-radius:.4rem; background: #fff url(../images/select-arrow.png) calc(100% - 1.6rem) 50% no-repeat; background-size: 1.2rem;cursor:pointer;}
.msel-list{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #ccc;border-radius:.4rem;z-index:10;}
.msel.active .msel-list{display:block;}
.msel-list li{padding:.4rem 1rem;}
.msel-list input{margin-right:.3rem;}

.current-box{display: flex; align-items: center; gap: 1.6rem;}
.current{font: 1.4rem; font-weight: 700; color: rgba(1, 162, 208, 1);}
.current:before{content:'Total'; font-weight: 400; color:#000000; margin-right: .5rem;}

.ts-stul{display: flex; flex-wrap: wrap; gap:.3rem;}
.ts-stul *{font-size: 1.4rem;}
.ts-stul li{flex:0 0 calc(49% - .5rem);}
.ts-stul li span{font-weight: 700; font-size: 1.3rem;}

.pct-bar { position: relative; width: 100%; height: 1rem; background: #eee; border-radius: 0.5rem; overflow: hidden; }
.pct-fill { position: absolute; top: 0; left: 0; height: 100%; width: 0; background: linear-gradient(90deg, #2fa8e0, #00c853); border-radius: 0.5rem; animation: fillAnim 1.5s ease forwards; }
.pct-txt { position: absolute; right: 0.5rem; top: 50%; transform: translateY(-50%); font-size: 0.8rem; color: #333; font-weight: 600; }
.pct-barbox{display: flex; align-items: center; gap: 2rem;}
.pct-barbox .pct-txt{position: relative; transform: inherit; font-size: 1.2rem;}
.pct-wrap{display: flex; gap: 1rem;}
.pct-wrap .pct-barbox{flex: 1; gap: 1.5rem;}
.pct-wrap .pct-txt{top:inherit}
@keyframes fillAnim {
    from { width: 0; }
    to { width: var(--pct); }
}


.error_wrap{background-image: url(../images/error_bg.png); background-repeat: no-repeat; background-color: #EBEDF5; width: 100%; height: 100%;}
.error-container{display: flex; gap: 5rem; justify-content: center; align-items: center; width: 120rem; margin: 12rem 0;}
.error_wrap .error-container img{width:400px}
.error_wrap > div{display: flex; justify-content: center; flex-direction: column; align-items: center; padding-top:5rem; width: 120rem; margin: 0 auto;}
.error-header{width: 100%; padding-bottom: 2rem; border-bottom:1px solid #dfdfdf}
.error-content{}
.ec-txt1{margin-bottom: 25px; font-size: 30px; font-weight: 700;}
.ec-txt2{margin-bottom: 30px; font-size: 16px; font-weight: 700; color: #666;}
.ec-txt3{margin-bottom: 25px; font-size: 18px; font-weight: 700; color: #333;}
.er-btnwrap{display: flex; gap:1.5rem}
.er-btnwrap a{padding: 1rem 2rem; border-radius: .3rem; color:#ffffff;}
.er-btn01{background-color: #1967be;}
.er-btn02{background-color: #666666; }
.error_wrap footer{width:100%;}

@media (max-width:1900px){

}

@media (max-width: 1730px) {

}
@media (max-width: 1520px) {
    html { font-size: 56.25%; }
}

@media (max-width:1440px){
    .status-content {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* 2열 */
        gap: 2rem; /* 카드 사이 여백 */
    }
}

@media (max-width:1350px){
    .stat-list li{flex-direction: column; justify-content: center; align-items: flex-start;}
}
@media (max-width:1280px){

}
@media (max-width:1200px){
    .mtab-content{display: none;}
    .mobile-tab{display: flex;}
    .tab-h3{display: none;}

}
@media (max-width:1080px){
    .m-item01, .m-item02{flex-direction: column;}
    .m-item02 > div{width:100%;}
    .income-inv-wrap{flex-direction: column;}

}

@media (max-width: 1024px) {
    .status-content,
    .production-detail-box{display: flex; flex-direction: column;}
}

@media (max-width:768px){
    body:has(.navbar-nav.active){overflow: hidden;}
    body:has(.navbar-nav.active):before{content:''; width:100%; height:100%; background-color:rgba(0, 0, 0, .6); position: fixed; top: 0; left: 0; z-index:98;}
    nav.navbar-nav{display: none; z-index: 1;}
    /* nav.navbar-nav.active:before{content:''; width:100%; height:100%; background-color:rgba(0, 0, 0, .6); position: fixed; top: 0; left: 0; z-index:-1;} */
    nav.navbar-nav.active{width: 26rem; padding: 0 2rem; display: flex; position: fixed; right: 0; z-index: 99;}
    nav.navbar-nav.active > *{z-index: 1;}
    nav.navbar-nav .nav-toggle{display: none;}
    nav.navbar-nav .brand-box{display: none;}
    nav.navbar-nav .go-qcells{display: inline-block; width:22rem; height: 4.4rem; background-image:url(../images/go-qcells-m.png); margin-top: 7.2rem; background-repeat: no-repeat; background-size: cover;}
    .nav{width:100%;}
    nav.navbar-nav .btn-logout{width: 100%; position: relative; bottom: inherit; margin-top: 8rem;}
    .nav-close{width: 7.2rem; height: 7.2rem; position: absolute; right: 0;}
    .nav-close:before{content: '\f00d';font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size:2rem; width: 3.2rem; height: 3.2rem; display: flex; justify-content: center; align-items: center; margin: 0 auto;}

    nav.navbar{display:none;}
    .container {padding: 2rem}
    .m-navbar{height: 7.6rem; display: flex; justify-content: space-between; align-items: center; padding: 2rem; border-bottom:1px solid rgba(174, 174, 174, 0.2);}
    .brand-box {height: auto; width: auto; display: inline-flex; border-bottom:none;}
    .brand-box i{width: 7.664rem; height: 2.214rem; background-size: 7.664rem; background-repeat: no-repeat;}
    .brand-box span {font-size: .9rem;}
    .m-nav-box{display: flex; align-items: center; justify-content: flex-end; gap: 2rem;}
    .m-alert.info{background-image:url(../images/m-alert-triangle.png); display: inline-block; width: 3.2rem; height: 3.2rem; background-repeat: no-repeat; background-size: cover;}
    .m-btn-nav{background-image: url(../images/icon-mmenu.png); width: 2.4rem; height: 1.8rem; background-repeat: no-repeat; background-size: cover;}

    .wrapper{padding:2rem;}
    .main-lyt1 h3{font-size: 3.2rem; margin-bottom: 4.5rem;}
    .login-util a,
    .login_box label{font-size: 1.4rem;}
    .login_form{background-color: transparent; border: none;}
    h1.h1-logo:before{content:'';display:inline-block; background:url(../images/logo_m.png); width:8.2rem; height:3.6rem;}
    .step-wrap.agree li i{width:5.2rem; height: 5.2rem;}
    .step-wrap.agree li i:before{width: 2.4rem; height: 2.4rem;}
    .step-wrap.agree li.step01 i:before,
    .step-wrap.agree li.step02 i:before{background-size: 2.4rem;}
    .form_check.st1 label::after,
    .form_check.st1 label::before{width: 3.2rem; height: 3.2rem;}
    .form_check.st1 label::after{font-size: 2rem;}
    .content-agree > ul li{padding: 2rem;}
    .form_check.st1{padding-left: 4rem;}
    .form_check.st1 label,
    .form_check.st1 label *{font-size: 1.6rem;}
    .main-lyt1{margin-top:5.6rem}
    .menber_join table button{width:125px; padding: 1rem;}
    .menber_join table input,
    .menber_join .hp-code-wrap{flex:1;}

    .income-stats{grid-template-columns:1fr 1fr;}
    .stat-item.large{grid-row:auto;grid-column:1/span 2;}
}

@media (max-width:640px){
    .responsive{overflow-x: auto;}
    .responsive table{min-width:64rem;}
    .responsive:before{content:'좌,우로 이동가능합니다.'; position: sticky; left:5px; margin-bottom: 1rem; display: inline-block; font-size:1.2rem;}
}

@media (max-width:450px){
    .income-stats{display: flex; flex-direction: column;}
}

@media (max-width:420px){

}

@media (max-width:330px){

}