/* -------- Login -------- */
.login{
    height: 100dvh;
    padding: 10rem;
}
.login .container{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6rem;
}

.locale {
    position: absolute;
    display: flex;
    right:0;
    top:0;
    margin: 2rem
}

.landing-wrap{
    width: 80rem;
    height: 100%;
    background: var(--grey-100);
    border-radius: 2rem;
    overflow: hidden;
}
.landing-wrap .swiper{height: 100%;}
.landing-wrap .swiper .swiper-slide{
    width: inherit !important;
    position: relative;
}
.landing-wrap .swiper .swiper-slide > div img{
    width: initial;
    /* height: 100%; */
}
.landing-wrap .swiper .swiper-slide > img{
    position: absolute;
    top: 0;
    left: 0;
}
.landing-wrap .swiper .swiper-slide:nth-child(2) > img{
    top: initial;
    bottom: 0;
}
.login-wrap{
    width: 100%;
    height: auto;
    flex: 1;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.login-area{
    width: 34rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2.4rem;
}
.login-area h1 img{
    height: 2rem;
    object-fit: contain;
}
.login-area h4{
    color: var(--blue-700);
}
.login-input-wrap .input-wrap{
    margin-bottom: 1.2rem;
}
.login .non-members{
    margin-top: 4rem;
    padding-top: 4rem;
    border-top: 1px solid var(--grey-200);
    display: flex;
    justify-content: space-between;
}

.homepage{
    /* margin-top: 4rem; */
    padding-top: 1rem;
    /* border-top: 1px solid var(--grey-200); */
    display: flex;
    justify-content: space-between;
}


/* add user info 사용자 추가 팝업 */
#add-user-info .popup-content form{
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.history-wrap{
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 1.6rem;
    border-radius: 0.8rem;
    background-color: var(--grey-50);
    margin-top: 2rem;
}
.history-wrap.pair {
    margin-top: 0px;
}
.history-wrap .history{
    display: flex;
    gap: 0.4rem;
}
.history-wrap .history .pair {
    display: flex;
    min-width: 200px; /* 필요한 경우 유동적 줄 수 있음 */
}
.history-wrap .history span{
    font-size: 1.4rem;
    color: var(--grey-400);
}
.history-wrap .history span.label{
    font-weight: 700;
    margin-right: 0.4rem;
}

/* 권한별 메뉴 관리 authority-menu-manage */
.authority-menu-manage .table-area .input-wrap{
    width: 24rem;
    flex-grow: 1;
}
.authority-menu-manage .select-wrap{
    width: 20rem;
    flex-grow: 1;
}
.menu-copy-wrap{
    display: flex;
    gap: 0.4rem;
    padding: 0.4rem;
    border-radius: 0.8rem;
    border: 1px solid var(--grey-200);
}
.menu-copy-wrap .el-select__wrapper{
    padding: 0.8rem 1rem;
    box-shadow: none;
}

/* 내 정보 관리 my-info */
.my-info .card .flex-ss{
    gap: 4rem;
}
.my-info .card .table{
    min-width: 40rem;
    width: 34%;
}
.my-info .card .my-info-edit{
    padding: 4rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
    flex: 1;
}
.my-info .card .my-info-edit form{
    display: flex;
    flex-direction: column;
    gap: 2rem;
}


/* 딜러용 대시보드 dealer-dashboard */
.dealer-dashboard .filter-area{
    align-items: center;
    justify-content: space-between;
    gap: 10rem;
    margin-bottom: 2rem;
}
.current-status-area{
    display: flex;
    gap: 2rem;
    align-items: center;
}
.current-status-area .card-wrap{
    display: flex;
    align-items: center;
    gap: 2rem;
    flex: 1;
    flex-wrap: nowrap;
}
.install .current-status-area .card-wrap{align-items: stretch;}
.current-status-area .card-wrap .card{
    min-width: 12.4rem;
    width: 22.4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-grow: 1;
}
.current-status-area .card-wrap .card:not(.card.quarterly-conversion-rate, .card.thismonth-complete, .card.as-complete){
    cursor: pointer;
}
.current-status-area .card-wrap .card:hover:not(.card.quarterly-conversion-rate, .card.thismonth-complete, .card.as-complete){
    outline: 1px solid var(--blue-200);
    box-shadow: 0 0 10px rgba(11, 46, 130, 0.3);
}
.current-status-area .card-wrap .card.active:not(.card.quarterly-conversion-rate .card.thismonth-complete, .card.as-complete){
    outline: 1px solid var(--blue-200);
    box-shadow: 0 0 10px rgba(11, 46, 130, 0.3);
    background-color: var(--blue-25);
}
.current-status-area .card-wrap .card .value{flex-shrink: 0;}
.install .current-status-area .card-wrap .card .label{
    width: 9.6rem;
    word-break: break-word;
}
.install .current-status-area{flex-wrap: wrap;}
.dealer-dashboard .card.quarterly-conversion-rate{
    min-width: 12.4rem;
    width: 22.4rem;
    max-width: 36.8rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: transparent;
    box-shadow: none;
    border: 1px solid var(--grey-100);
    flex-grow: 1;
}
.dealer-dashboard .card.map{padding: 0;}
.dealer-dashboard .kakao-map{
    padding: 0;
}
.dealer-dashboard .map-wrap{
    width: 100%;
    height: 40rem;
    overflow: hidden;
}

.tab-contents.alarm .current-status-area .card-wrap .card{
    width: calc(100% / 3);
}
.tab-contents.alarm .current-status-area .card-wrap:first-child::after{
    display: inline-flex;
    content: '';
    width: 1px;
    height: 8rem;
    background-color: var(--grey-200);
    margin: 0 2rem;
}

.tab-contents.alarm .thismonth-complete,
.tab-contents.alarm .as-complete{background: var(--grey-300);}
.tab-contents.alarm .thismonth-complete .label,
.tab-contents.alarm .as-complete .label{color: var(--grey-100);}
.tab-contents.alarm .thismonth-complete .value,
.tab-contents.alarm .as-complete .value{color: var(--white);}
.tab-contents.alarm .card-wrap .card p{flex-shrink: 0;}

.side-layer .prd-info-wrap,
#prd-not-place .prd-list-wrap{
    max-height: calc(100dvh - 31.2rem);
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
    padding: 0 1.2rem;
    overflow-y: auto;
}
.side-layer .prd-info-wrap li,
#prd-not-place .prd-list-wrap li{
    display: flex;
    gap: 1rem;
    padding: 2rem 0;
    border-bottom: 1px solid var(--grey-100);
}
.side-layer .prd-info-wrap li:last-child,
#prd-not-place .prd-list-wrap li:last-child{border: 0;}
.side-layer.install .prd-info-wrap li .checkbox{margin-top: 0.4rem;}
.prd-info-wrap li .install-prd-info{flex: 1;}
.prd-info-wrap li .install-prd-info p{
    font-size: 1.7rem;
}
.prd-info-wrap li .install-prd-info .status p{
    color: var(--grey-400);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.prd-info-wrap li .install-prd-info .txt-wrap p{
    display: flex;
    align-items: center;
    font-size: 1.2rem;
    color: var(--grey-300);
    gap: 0.4rem;
    margin-right: 1rem;
}
.prd-info-wrap li .install-prd-info .txt-wrap p:after{
    display: inline-flex;
    content: '|';
    margin-left: 1rem;
}
.prd-info-wrap li .install-prd-info .txt-wrap p:last-child:after{display: none;}
.prd-info-wrap li .install-prd-info .txt-wrap.red p{
    color: var(--red);
}

.side-layer.alarm{width: 44rem;}

/* 20250310: 몽골향 딜러-알람 모니터링 지역별 수정 및 추가 */
.side-layer.alarm .system-label{
    width: 10.4rem;
    max-width: fit-content;
    flex-direction: column;
    flex-shrink: 0;
}
.side-layer.alarm .system-label p {
    letter-spacing: -0.08rem;
    text-align: center;
}

.side-layer.alarm .prd-info-wrap li{
    gap: 2rem;
}
.side-layer.alarm .txt-area{
    position: relative;
    flex-grow: 1;
}
.side-layer.alarm .txt-area .icon-btn{
    position: absolute;
    top: -0.4rem;
    right: 0;
    border-radius: 0.4rem;
    padding: 0.4rem;
}
.side-layer.alarm .txt-area .icon-btn:hover{
    box-shadow: 0 0 10px rgba(11, 46, 130, 0.3);
}
.side-layer.alarm .prd-info-wrap .txt-wrap{
    gap: 0.6rem;
}
.side-layer.alarm .prd-info-wrap .date,
.side-layer.alarm .prd-info-wrap .time{
    font-size: 1.7rem;
    color: var(--grey-300);
}
.side-layer.alarm .prd-info-wrap .error-code,
.side-layer.alarm .prd-info-wrap .error-txt{
    font-size: 1.7rem;
}
.side-layer.alarm .prd-info-wrap .error-code{flex-shrink: 0;}


/* 메일 작성 팝업 */
#write-mail .mail-address-wrap{
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 1rem;

    padding: 0.6rem 0;
    border-bottom: 1px solid var(--grey-100);
    margin-bottom: 0.6rem;
}
#write-mail .label{
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--grey-500);
    flex-shrink: 0;
}
#write-mail .mail-address{
    font-size: 1.7rem;
    padding: 0.4rem 0.8rem;
    border-radius: 0.4rem;
    background-color: var(--blue-25);
}
#write-mail .mail-title{
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 2rem 0;
}
#write-mail .mail-title .input-wrap{width: 100%;}


/* 알람 내역 */
.alarm-list .filter-area .select-wrap{width: 12%;}

/* 알람 상세 */
.alarm-list-detail .alarm-info-wrap,
.prd-list-detail .prd-info-wrap{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}
.alarm-list-detail .alarm-info-wrap .num,
.prd-list-detail .prd-info-wrap{
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--blue-400);
    margin-right: 0.4rem;
}
.alarm-list-detail .line-card .txt-wrap.flex-cb,
.alarm-list-detail .line-card .txt-wrap.flex-cb .flex-cs{
    flex-wrap: wrap;
}
.alarm-list-detail .line-card .txt-wrap.flex-cb .flex-cs button{flex-shrink: 0;}
.alarm-list-detail .alarm-info-wrap .txt-wrap .txt-wrap,
.prd-list-detail .prd-info-wrap .txt-wrap .txt-wrap{
    font-size: 1.5rem;
    color: var(--grey-400);
}
.alarm-list-detail .alarm-info-wrap .txt-wrap .txt-wrap::before,
.prd-list-detail .prd-info-wrap .txt-wrap .txt-wrap::before{
    content: '(';
}
.alarm-list-detail .alarm-info-wrap .txt-wrap .txt-wrap::after,
.prd-list-detail .prd-info-wrap .txt-wrap .txt-wrap::after{
    content: ')';
}
.alarm-list-detail .alarm-info-wrap .txt-wrap .txt-wrap .tit,
.prd-list-detail .prd-info-wrap .txt-wrap .txt-wrap .tit{
    margin-right: 0.4rem;
}

.alarm-list-detail .alarm-mng-wrap,
.prd-list-detail .prd-mng-wrap{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1rem 4rem;
    padding: 1.4rem;
    border-radius: 0.4rem;
    background-color: var(--grey-50);
    margin: 1rem 0 2rem;
}
.alarm-list-detail .alarm-mng-wrap li,
.prd-list-detail .prd-mng-wrap li{flex-shrink: 0;}
.alarm-list-detail .alarm-mng-wrap p,
.prd-list-detail .prd-mng-wrap p{
    font-size: 1.5rem;
    color: var(--grey-400);
    margin-right: 0.4rem;
}
.alarm-list-detail .alarm-mng-wrap li p:last-child,
.prd-list-detail .prd-mng-wrap li p:last-child{margin-right: 0;}
.alarm-list-detail .alarm-mng-wrap p.tit,
.prd-list-detail .prd-mng-wrap p.tit{
    font-weight: 700;
    margin-right: 1rem;
}

.alarm-list-detail .alarm-content{
    display: flex;
    align-items: stretch;
    gap: 2rem;
    margin-bottom: 4rem;
}
.prd-list-detail .prd-content{
    display: flex;
    align-items: flex-start;
    gap: 2rem;
    margin-bottom: 4rem;
}
.alarm-list-detail .alarm-content > div,
.prd-list-detail .prd-content > div{
    width: calc(50% - 1rem);
}
.prd-list-detail .chart-wrap{height: 100%;}

.alarm-list-detail .prd-card,
.prd-list-detail .prd-card{
    width: initial;
    box-shadow: none;
    border: 1px solid var(--grey-100);
}
.alarm-list-detail .prd-img,
.prd-list-detail .prd-img{
    width: initial;
    height: initial;
    min-width: 26rem;
    min-height: 26rem;
}
.alarm-list-detail .chart-wrap{height: initial;}
.alarm-list-detail .prd-card{justify-content: space-between;}
.prd-card ul.prd-info{
    min-width: 30rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.prd-card ul .txt-wrap{
    justify-content: space-between;
    gap: 2rem;
}
.prd-card ul .txt-wrap p{
    font-size: 1.7rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.prd-card ul .txt-wrap p.tit{font-weight: 700;}
.prd-card ul .txt-wrap p span{
    font-size: 1.5rem;
    color: var(--grey-300);
}
.alarm-list-detail .prd-card .btn-wrap button,
.prd-list-detail .prd-card .btn-wrap button{width: 100%;}

.prd-list-detail .part-wrap{
    display: flex;
    flex-direction: column;
    gap: 4rem;
}
.prd-list-detail .line-card .btn-wrap .medium{flex-shrink: 0;}
.prd-list-detail .edit-btn .icon{
    position: initial;
    transform: initial;
}
.prd-list-detail .edit-btn{
    position: absolute;
    top: 50%;
    left: 2rem;
    transform: translateY(-50%);
}
.alarm-list-detail .prd-card .system-label + .flex-cs > p.as-status{
    color: var(--mint-500);
}

#custoemr-business-popup .shop-list{
    padding: 1.4rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-200);
    max-height: 16rem;
    overflow-y: auto;
}
#custoemr-business-popup .shop-list li{
    width: 100%;
    margin-bottom: 1rem;
}
#custoemr-business-popup .shop-list li:last-child{margin-bottom: 0;}

/* AI 예측 팝업 */
#AI-popup h4{
    font-weight: 700;
    text-align: center;
    margin: 2rem 0;
}
#AI-popup p{
    font-size: 1.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}
#AI-popup p span{
    font-weight: 500;
    color: var(--blue-400);
}


/* 서비스 대시보드 */
.service-dashboard .card-wrap{flex-wrap: nowrap;}
.service-dashboard .service-status-wrap{
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
/* .service-dashboard .card-wrap .card{width: 54%;} */
.service-dashboard .card.service-status{
    width: 65.2rem;
    flex-grow: 0;
    flex-shrink: 0;
}
.service-dashboard .card.service-status .date-wrap{
    margin-left: auto;
}
/* .service-dashboard .service-status-wrap > .flex-cs{
    flex-wrap: wrap;
} */
.service-dashboard .service-status-wrap .status-item{
    min-width: 28.6rem;
    width: calc(50% - 1rem);
    border: 1px solid var(--grey-100);
    border-radius: 0.4rem;
    padding: 2rem;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.4rem;
    flex-shrink: 0;
    cursor: pointer;
}
.service-dashboard .service-status-wrap .status-item .txt-wrap{
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.status-item .label{
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--grey-400);
    display: flex;
    align-items: center;
    margin-bottom: 0.4rem;
}
.status-item .label + h2{
    font-size: 3rem;
    letter-spacing: -1.6px;
}
.status-item .tag{
    font-size: 1.5rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem;
    border-radius: 0.4rem;
}
.status-item .tag.up{
    background-color: rgba(239, 59, 102, 0.06);
    color: var(--red);
}
.status-item .tag.down{
    background-color: rgba(63, 103, 197, 0.06);
    color: var(--blue-400);
}
.service-dashboard .filter-area{margin-bottom: 2rem;}
.service-dashboard .map-wrap{width: 88rem;}

.service-dashboard .table-area > .flex-cb button{
    margin-left: auto;
}

/* 서비스 내역 */
.service-history .system-label {
    min-width: unset;
    font-size:1rem;
    padding: 0.3rem;
}

/*250109 추가 서비스내역 셀 */
.service-table-cell {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
    justify-content: center;
}
.service-table-cell div{
    flex: 1 0 auto;
}

/* 알람 설정 */
#receiver-popup .popup-content,
#receiver-popup form{
    display: flex;
    flex-direction: column;
    gap: 4rem;
}
#receiver-popup form{gap: 2rem;}
#receiver-popup .part-wrap .tit{
    font-size: 1.7rem;
    font-weight: 500;
    margin-bottom: 1rem;
}
#receiver-popup .sub-tit{
    font-size: 1.5rem;
    color: var(--grey-400);
    margin-bottom: 1rem;
}



/* 연구소 대시보드 */
.accumulate-status-wrap{
    display: flex;
    align-items: stretch;
    gap: 2rem;
}
.accumulate-status-wrap ul{
    display: flex;
    align-items: center;
    gap: 1rem;
}
.accumulate-status-wrap ul .line-card{
    display: flex;
    align-items: center;
    gap: 2rem;
    flex-grow: 1;
    flex-wrap: wrap;
}
.accumulate-status-wrap ul .line-card .txt-wrap{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.4rem;
    flex-shrink: 0;
}
.accumulate-status-wrap ul .line-card .txt-wrap .label{
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--grey-400);
}
.accumulate-status-wrap button{align-self: center;}

.accumulate-status-wrap .icon-box.caution{background-color: var(--caution-500);}
.accumulate-status-wrap .icon-box.warning{background-color: var(--warning-500);}
.accumulate-status-wrap .icon-box.danger{background-color: var(--danger-500);}
.accumulate-status-wrap .icon-box.serious{background-color: var(--serious-500);}

.laboratory-dashboard .part-wrap{
    width: 100%;
    display: flex;
}
.laboratory-dashboard .part-wrap > div .title{
    width: 10rem;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: 0.6rem;
    font-size: 1.5rem;
    font-weight: 500;
    text-align: center;
    color: var(--grey-500);
}
.laboratory-dashboard .by-prd,
.laboratory-dashboard .by-failure-type{
    width: 100%;
    padding: 0 6rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10rem;
}
.laboratory-dashboard .by-prd{
    border-right: 1px solid var(--grey-100);
}
.laboratory-dashboard .list-wrap{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex-grow: 1;
    flex-shrink: 0;
}
.laboratory-dashboard .list-wrap li{
    display: flex;
    align-items: center;
    gap: 1rem;
}
.laboratory-dashboard .list-wrap li .number{
    font-weight: 700;
    margin-left: auto;
    text-align: right;
}
.laboratory-dashboard .list-wrap .ranking-num{
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background-color: var(--grey-300);
    color: var(--white);
    font-size: 1.2rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.laboratory-dashboard .list-wrap .ranking-num.top3{
    background-color: var(--blue-400);
}
.laboratory-dashboard .list-wrap p{
    font-size: 1.7rem;
}

.laboratory-dashboard .by-period .flex-cs .line-card{
    width: calc(50% - 1rem);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.laboratory-dashboard .slider-wrap{
    height: initial;
    flex-grow: 1;
    min-width: initial;
}
.laboratory-dashboard .slider-wrap .swiper-wrapper{
    align-items: stretch;
}
.laboratory-dashboard .slider-wrap .swiper-slide{
    position: relative;
    height: auto;
    margin-top: 1rem;
    width: calc(100% - 1rem);
}
.laboratory-dashboard .line-card .slider-wrap .swiper-slide:first-child{margin-left: 1rem;}
.laboratory-dashboard .slider-wrap .swiper-card{
    min-height: 15.4rem;
    height: 100%;
    justify-content: center;
}
.laboratory-dashboard .slider-wrap .swiper-card
.laboratory-dashboard .chart-wrap{height: initial;}
.laboratory-dashboard .apexcharts-canvas{margin: 0 auto;}


/* 고객용 대시보드 */
.customer-dashboard .title-card{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: -2rem;
}
.customer-dashboard .title-card .select-wrap{width: 30rem;}
.customer-dashboard .title-card .select-wrap .el-select__wrapper{
    box-shadow: none;
    background-color: var(--blue-25);
}

.customer-dashboard .card-wrap{
    align-items: stretch;
    display: none;
}
/*250116 flex strsrch css 수정 */
.customer-dashboard .card-wrap.show section.card.part .flex-item {
    flex-grow: 1;
    align-items: stretch;
}
.customer-dashboard .card-wrap.show{
    display: flex;
}
/* .customer-dashboard .card-wrap .card:first-child{
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-grow: 0;
    align-items: center;
    gap: 1rem;
}
.customer-dashboard .card-wrap .card:first-child .select-wrap{width: 20rem;}
.customer-dashboard .card-wrap .card:first-child .select-wrap .el-select__wrapper{
    box-shadow: none;
    background-color: var(--blue-25);
}
.customer-dashboard .card-wrap .card:first-child .select-wrap .el-select__placeholder.is-transparent{color: var(--grey-400);} */
.customer-dashboard .shop-wrap{
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-grow: 0.5;
    justify-content: space-between;
    flex-grow: 1;
}
.customer-dashboard .shop-logo{
    flex-shrink: 0;
}
.customer-dashboard .shop-logo img{
    width: 18rem;
    height: 4rem;
    object-fit: contain;
    object-position: center;
}
.customer-dashboard .shop-name{
    font-size: 2.4rem;
    flex-shrink: 0;
}
.customer-dashboard .shop-info{
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-shrink: 0;
}
.customer-dashboard .shop-info p{
    font-size: 2.2rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--blue-400);
}
.customer-dashboard .update-wrap{
    width: fit-content;
    height: auto;
    padding: 0.6rem 1rem;
    background-color: var(--white);
    border-color: var(--grey-500);
    justify-content: space-between;
}
.customer-dashboard .update-wrap p{
    font-size: 1.5rem;
    color: var(--grey-500);
    text-align: left;
}
.customer-dashboard .update-wrap .date-wrap{flex-direction: row;}
.customer-dashboard .shop-info .indoor::after{
    display: inline-flex;
    content: '';
    width: 1px;
    height: 10px;
    background-color: var(--grey-200);
    margin-left: 0.4rem;
}
.customer-dashboard .card{
    padding: 2rem;
    gap: 3rem;
}
.customer-dashboard .card .line-card{
    min-width: 10rem;
    flex-grow: 1;
    border: 0;
    padding: 0;
}
.customer-dashboard .card .line-card .status{
    font-size: 1.7rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.customer-dashboard .card .line-card .status::before{
    display: inline-flex;
    content: '';
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 50%;
}
.customer-dashboard .card .line-card .status.on::before{
    background-color: var(--blue-400);
}
.customer-dashboard .card .line-card .status.off::before{
    background-color: var(--grey-200);
}
.customer-dashboard .card .line-card .status .num{
    font-weight: 700;
    text-align: right;
    margin-left: auto;
}
.customer-dashboard .card .line-card .label{
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--grey-400);
    display: flex;
    align-items: center;
    margin-bottom: 0.4rem;
}
.customer-dashboard .energy .value{
    font-size: 1.5rem;
    font-weight: 700;
    margin-left: 2rem;
    display: flex;
    align-items: center;
    gap: 0.2rem;
}
.customer-dashboard .energy .value::after{
    display: inline-flex;
    content: '';
    width: 0;
    height: 0;
    border: 5px solid transparent;
}
.customer-dashboard .energy .value.increase::after{
    border-bottom-color: var(--red);
    margin-bottom: 6px;
}
.customer-dashboard .energy .value.decrease::after{
    border-top-color: var(--blue-400);
    margin-top: 4px;
}

.customer-dashboard .system-status{
    width: 12rem;
    min-width: 12rem;
    padding: 1rem;
    border-radius: 0.8rem;
    background: var(--grey-50);
    flex-grow: 1;
    flex-shrink: 0;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.customer-dashboard .system-status p{
    font-size: 1.7rem;
    font-weight: 500;
}

.layout-area{
    display: flex;
    width: fit-content;
    flex-wrap: nowrap;
}
.customer-layout .layout-area{
    width: 100%;
    gap: 4rem;
    justify-content: space-between;
}
/* .customer-layout .card{
    overflow: auto;
} */
.customer-dashboard .layout-area.hide,
.customer-dashboard .by-prd-area.hide{display: none;}

.customer-dashboard .floors-wrap{
    min-width: 24rem;
    min-height: 63rem;
    width: 24rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-grow: 0;
    gap: 2rem;
    overflow-x: initial;
}
.floors{
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 1rem;
}
.customer-dashboard .floors-wrap .floors .num{
    font-size: 1.2rem;
    font-weight: 700;
    border-radius: 10rem;
    padding: 0.2rem 1rem;
    position: absolute;
    right: 1.4rem;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--grey-50);
}
.customer-dashboard .floors-wrap .floors .num.freezer{
    color: var(--blue-500);
}
.customer-dashboard .floors-wrap .floors .num.fridge{
    color: var(--red);
}
.customer-dashboard .num.no-prd{
    font-size: 1.2rem;
    font-weight: 700;
    border-radius: 10rem;
    padding: 0.2rem 1rem;
    background-color: var(--grey-50);
    color: var(--mint-400);
}
.customer-dashboard .num.no-prd + p{
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--mint-500);
}

.floors li{
    width: 100%;
    padding: 1rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
    position: relative;
    cursor: pointer;
}
.floors li .value{
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
}
.floors li:hover{
    background: var(--blue-50);
}
.floors li.active{
    background-color: var(--blue-400);
    color: var(--white);
}
.customer-dashboard .floors-wrap .btn-wrap{flex-direction: column;}

.customer-dashboard .prd-card .temp-label{
    font-size: 1.2rem;
    font-weight: 500;
    padding: 0.4rem 1rem;
    border-radius: 0.4rem;
    background-color: var(--mint-100);
    color: var(--mint-500);
}
.customer-dashboard .prd-btn-wrap{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: auto;
}

/* 20250310: 수정 및 추가 */
.customer-dashboard .prd-btn-wrap button{
    width: 100%;
    padding: 0 1rem;
    height: 4rem;
    border-radius: 0.4rem;
    color: var(--white);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    position: relative;
    font-size: 1.6rem;
    letter-spacing: -0.08rem;
    line-height: 1.8rem;
}
.customer-dashboard .prd-btn-wrap button span{
    font-weight: 500;
}
.customer-dashboard .prd-btn-wrap button span:nth-of-type(2) {
    width: 4.2rem;
    text-align: left;
}

.customer-dashboard .prd-btn-wrap button .caret-down{
    margin-left: auto;
    transition: all 0.5s;
}
.customer-dashboard .prd-btn-wrap button.active .caret-down{
    transform: rotate(-180deg);
    transition: all 0.5s;
}
.customer-dashboard .prd-btn-wrap .fridge-btn{
    background: var(--purple-25);
    color: var(--purple-400);
}
.customer-dashboard .prd-btn-wrap .freezer-btn{
    background: var(--green-25);
    color: var(--green);
}
.customer-dashboard .prd-btn-wrap button .list{
    width: inherit;
    background: var(--white);
    box-shadow: 0 0 2rem rgba(22, 29, 36, 0.06);
    position: absolute;
    left: 0;
    bottom: 4.4rem;
    z-index: 89;
    color: var(--grey-600);
    padding: 1rem;
    border-radius: 0.8rem;
    display: none;
}
.customer-dashboard .prd-btn-wrap button.active .list{
    display: block;
}
.customer-dashboard .prd-btn-wrap button .list li{
    padding: 1rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
    margin-bottom: 1rem;
    position: relative;
}
.customer-dashboard .prd-btn-wrap .fridge-btn .list li:hover{
    background: var(--purple-25);
    border-color: var(--purple-25);
}
.customer-dashboard .prd-btn-wrap .freezer-btn .list li:hover{
    background: var(--green-25);
    border-color: var(--green-25);
}
.customer-dashboard .prd-btn-wrap .fridge-btn .list li.active{
    background-color: var(--purple-400);
}
.customer-dashboard .prd-btn-wrap button .list li.active p:not(.commu-label, .pressure-info p){
    color: white;
}
.customer-dashboard .prd-btn-wrap .freezer-btn .list li.active{
    background-color: var(--green);
}
.customer-dashboard .prd-btn-wrap button .list li p:not(.commu-label){
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}
.customer-dashboard .prd-btn-wrap button .list li .prd-name{
    font-weight: 700;
}

/* 20250224: 고객홈 리스트 5개 노출 css 추가 */
.customer-dashboard .prd-btn-wrap button .list {
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 52.2rem;
}
.customer-dashboard .prd-btn-wrap button .list::-webkit-scrollbar {
    width: 8px;
}
.customer-dashboard .list .pressure-info {
    right: -1rem !important;
}



.customer-dashboard .list .pressure-info{
    display: none;
    padding: 1.4rem;
    border-radius: 0.4rem;
    background: var(--white);
    box-shadow: 0 0 2rem rgba(22, 29, 36, 0.06);
    position: absolute;
    right: -6rem;
    top: 50%;
    transform: translateY(-50%);
}
.customer-dashboard .list .pressure-info.show{
    display: block;
}
.customer-dashboard .pressure-info .value{
    font-weight: 700;
    text-align: right;
}

.customer-dashboard{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 4rem;
    overflow: auto;
}
/* 도면 영역 비율 16:9 / pc최소값 1040x585 / 최적값 1286 * 820 */
/* .canvas-wrap{
    width: 100%;
    height: 630px;
    overflow: auto;
    position: relative;
    background:
		linear-gradient(to bottom, transparent 68px, var(--grey-100) 68px) 0 0 / 100% 69px repeat-y,
		linear-gradient(to right, transparent 68px, var(--grey-100) 68px) 0 0 / 69px 100% repeat-x
	    white;
} */
/* .canvas-wrap{
    width: 1286px;
    height: 820px;
    overflow: auto;
    position: relative;
    background:
		linear-gradient(to bottom, transparent 68px, var(--grey-100) 68px) 0 0 / 100% 69px repeat-y,
		linear-gradient(to right, transparent 68px, var(--grey-100) 68px) 0 0 / 69px 100% repeat-x
	    white;
} */
.canvas-wrap{
    width: fit-content;
    height: fit-content;
    position: relative;
    background:
      linear-gradient(to bottom, transparent 68px, var(--grey-100) 68px) 0 0 / 100% 69px repeat-y,
      linear-gradient(to right, transparent 68px, var(--grey-100) 68px) 0 0 / 69px 100% repeat-x
       white;
}
.canvas-wrap img{width: initial; background-color: var(--white);}
/* .customer-dashboard .layout-area .canvas-wrap .prd{
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--white);
    border-radius: 0.4rem;
    background-color: var(--blue-400);
    position: absolute;
}
.customer-dashboard .layout-area .canvas-wrap .prd.num12{
    left: 678px;
    top: 154px;
}
.customer-dashboard .layout-area .canvas-wrap .prd.num13{
    left: 678px;
    top: 178px;
} */

.customer-dashboard .monitoring-wrap{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0 1%;
    /* margin-right: 4rem; */
}

/* 20250324: 수정 */
.customer-dashboard .monitoring-wrap li{
    width: 9rem;
    height: 9rem;
    background-color: var(--blue-700);
    border: 1px solid var(--blue-700);
    font-size: 1.4rem;
    color: var(--white);
    padding: 1rem;
    border-radius: 0.8rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    position: relative;
}
.customer-dashboard .monitoring-wrap li:hover{
    background-color: var(--blue-400);
    border-color: var(--blue-400);
}
.customer-dashboard .monitoring-wrap li .num{
    font-size: 2.6rem;
    font-weight: 700;
}
.customer-dashboard .monitoring-wrap li.floor-plan{
    border-color: var(--grey-200);
    background-color: var(--white);
    color: var(--grey-600);
}
.customer-dashboard .monitoring-wrap li.floor-plan:hover{
    background-color: var(--blue-50);
}
.customer-dashboard .monitoring-wrap li.system-wrap{
    background: none;
    border: none;
    padding: 0;
    height: auto;
    margin-top: auto;
}
.customer-dashboard .monitoring-wrap li.system-wrap > div{
    display: grid;
    grid-template-rows: 1fr 1fr 1fr;
    gap: 0.4rem;
}

/* 20250324: 수정 */
.customer-dashboard .monitoring-wrap li.system-wrap .system-label p{
    font-size: 1.33rem;
    letter-spacing: -0.1rem;
}

.customer-dashboard .monitoring-wrap li.system-wrap .system-label .icon{flex-shrink: 0;}

.customer-dashboard .monitoring-wrap .system-status-info{
    width: 20rem;
    padding: 1.4rem;
    background-color: var(--white);
    box-shadow: 0 0 2rem rgba(22, 29, 36, 0.16);
    border-radius: 0.4rem;
    position: absolute;
    left: 10rem;
    z-index: 90;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    display: none;
}
.customer-dashboard .monitoring-wrap .system-status-info.show{display: flex;}
.customer-dashboard .monitoring-wrap .system-status-info > div{
    display: flex;
    align-items: center;
    gap: 1rem;
}
.customer-dashboard .monitoring-wrap .system-status-info .prd-num{
    color: var(--grey-600);
    font-weight: 700;
}


/* 고객용 대시보드 레이아웃 설정 */
.customer-layout .page-title span::before{
    display: inline-flex;
    content: '|';
    color: var(--grey-100);
    margin-right: 1rem;
}
.customer-layout .setting-wrap{
    width: 20rem;
    flex-shrink: 0;
    flex-grow: 0;
}
.customer-layout .floors li{
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: center;
    position: relative;
}
.customer-layout .floors li .value{flex-grow: 1;}
.customer-layout .floors li .input-wrap{min-width: initial;}
.customer-layout .floors li .input-wrap,
.customer-layout .floors li .delete-btn,
.customer-layout .floors li .edit-btn,
.customer-layout .floors li .showhide-btn{
    display: none;
}
.customer-layout .floors li .el-input__wrapper{width: initial;}
/* .customer-layout .floors li .edit-btn{
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
}
.customer-layout .floors li .showhide-btn{
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
} */
.customer-layout .floors li:hover .showhide-btn{
    display: block;
}
.customer-layout .floors li:hover .edit-btn{
    display: block;
    filter: invert(19%) sepia(95%) saturate(2397%) hue-rotate(215deg) brightness(87%) contrast(95%);
}
.customer-layout .floors li.active:hover .edit-btn,
.customer-layout .floors li.active:hover .showhide-btn{
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(274deg) brightness(108%) contrast(107%);
}
.customer-layout .floors li:hover .showhide-btn{
    filter: invert(43%) sepia(13%) saturate(871%) hue-rotate(171deg) brightness(94%) contrast(90%);
}
.customer-layout .floors li.focus{
    border-color: var(--blue-400);
}
.customer-layout .floors li.focus .input-wrap,
.customer-layout .floors li.focus .delete-btn{display: block;}

.customer-layout .prd-size .btn-wrap{gap: 2rem;}
.customer-layout .size-btn{
    border-radius: 0.4rem;
    border: 2px solid var(--blue-200);
    background-color: var(--blue-100);
    color: var(--blue-700);
    font-size: 1.2rem;
}
.customer-layout .size-btn:hover{
    transform: translateY(-0.4rem);
    transition: all 0.3s;
}
.customer-layout .size-btn.oto{
    width: 2.8rem;
    height: 2.8rem;
}
.customer-layout .size-btn.tto{
    width: 5.6rem;
    height: 2.8rem;
}
.customer-layout .size-btn.ott{
    width: 2.8rem;
    height: 5.6rem;
}
.customer-layout .box{
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.customer-layout .box > div:not(.upload-btn){
    height: fit-content;
    padding: 2rem;
    border-radius: 0.4rem;
    background-color: var(--grey-50);
}
.customer-layout .upload-btn{width: fit-content;}
.customer-layout .upload-btn input[type="file"]{display: none;}

.customer-layout .guide-wrap{
    font-size: 1.2rem;
    margin-bottom: 0.4rem;
    color: var(--grey-400);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.customer-layout .canvas-area{
    width: 100%;
    max-width: 1288px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow: hidden;
    flex-grow: 1;
}
.customer-layout .canvas-area .btn-wrap{justify-content: space-between;}
.customer-layout .canvas-wrap{
    width: 100%;
    max-width: 1288px;
    /* height: 62.8rem; */
    height: 822px;
    border: 1px solid var(--grey-100);
    overflow: auto;
}

.customer-layout .prd-info-wrap{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 2rem 4rem;
    border: 1px solid var(--grey-100);
    gap: 1rem;
}
.customer-layout .prd-info-wrap .input-wrap{
    min-width: 8rem;
    width: 8rem;
}
.customer-layout .prd-info-wrap p{
    font-size: 1.7rem;
}
.customer-layout .prd-info-wrap p.label{
    font-weight: 500;
}

#prd-not-place{
    width: initial;
    min-height: initial;
    background-color: transparent;
    position: initial;
}
#prd-not-place .popup-wrap{
    min-width: 34rem;
    box-shadow: 0 0 2rem rgba(22, 29, 36, 0.16);
    position: absolute;
    top: 50%;
    left: 30rem;
    transform: translateY(-50%);
    overflow: hidden;
}
#prd-not-place .prd-list-wrap{
    max-height: 34rem;
}
#prd-not-place .prd-name{
    font-size: 1.7rem;
    font-weight: 500;
    margin-bottom: 0.6rem;
}
#prd-not-place .prd-code{
    font-size: 1.5rem;
    color: var(--grey-300);
}



/* 모니터링 지역별 */
.monitoring_by-region{
    width: 100%;
    height: 100%;
    position: relative;
}
.monitoring_by-region .card{
    position: relative;
    z-index: 5;
    padding: 2rem;
}
.monitoring_by-region .map-wrap{
    position: absolute;
    width: calc(100% + 8rem);
    height: calc(100% + 8rem);
    top: -4rem;
    left: -4rem;
    z-index: 0;
}

.monitoring_by-region .total-area{
    position: absolute;
    top: 0;
    left: 0;
    min-width: 40rem;
    width: 40rem;
    max-width: 46rem;
}
.monitoring_by-region .card-wrap{
    position: absolute;
    bottom: 0;
    left: 0;
    min-width: 40rem;
    width: 40rem;
    max-width: 46rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 1rem;
}
@media screen and (max-height: 690px) {
    .monitoring_by-region .card-wrap{top: 10.8rem;}
}

.monitoring_by-region .total-area .total-wrap{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
}
.monitoring_by-region .total-wrap .value-wrap{
    width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
}
.monitoring_by-region .total-wrap .value-wrap > div{
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.monitoring_by-region .total-wrap .value-wrap .num-wrap{
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.monitoring_by-region .total-wrap p{
    font-size: 1.5rem;
    text-align: center;
}
.monitoring_by-region .total-wrap .value-wrap .num-wrap p.alarm-num{
    font-size: 2.6rem;
    font-weight: 700;
    color: var(--blue-400);
}
.monitoring_by-region .total-wrap .value-wrap .num-wrap p.all-num{
    font-size: 1.7rem;
    color: var(--grey-400);
    display: flex;
    align-items: center;
}
.monitoring_by-region .total-wrap .value-wrap .num-wrap p.all-num::before{
    display: inline-flex;
    content: '/';
    margin-right: 0.4rem;
}

.monitoring_by-region .filter-wrap{
    width: 100%;
    border-radius: 0.4rem;
    padding: 2rem;
    background-color: var(--blue-50);
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-x: hidden;
    display: none;
    z-index: 10;
}
.monitoring_by-region .filter-wrap.show{display: flex;}
.monitoring_by-region .filter-wrap .btn-wrap{
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    z-index: 2;
}
.monitoring_by-region .filter-wrap .btn-wrap .btn{
    flex-shrink: 0;
    border-color: var(--grey-200);
    color: var(--grey-400);
}
.monitoring_by-region .filter-wrap .btn-wrap .btn.filled{
    color: white;
}
.monitoring_by-region .filter-wrap .btn-wrap .btn.active{
    background-color: var(--blue-100);
    border-color: var(--blue-500);
    color: var(--blue-500);
}
.monitoring_by-region .card-wrap{
    flex-direction: column;
    gap: 1rem;
    flex-wrap: nowrap;
}
.monitoring_by-region .card .close-btn{
    position: absolute;
    right: 0.8rem;
    top: 0.8rem;
}
.monitoring_by-region .card.total-alarm{
    max-height: 24.8rem;
    overflow-y: auto;
    z-index: 3;
}
.monitoring_by-region .system-alarm-info{max-height: 18rem;}
.monitoring_by-region .system-alarm-info .status-wrap{
    display: flex;
    flex-direction: row;
    gap: 1rem;
}
.monitoring_by-region .system-alarm-info .status-wrap > div{
    width: 40%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.monitoring_by-region .system-alarm-info .status-wrap .all-wrap{
    width: 20%;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: 0.4rem;
    background-color: var(--blue-400);
}

/* 20250310 : 모니터링 시스템알람 수정 */
.monitoring_by-region .system-alarm-info > div p{
    display: flex;
    align-items: center;
    letter-spacing: -0.09rem;
}
.monitoring_by-region .system-alarm-info > div p .num{
    margin-left: 1rem;
    font-weight: 700;
    min-width: 2rem;
    text-align: right;
}

.monitoring_by-region .mo.btn-wrap{
    position: absolute;
    right: 0;
    bottom: 0;
    flex-direction: column;
}
.monitoring_by-region .mo.btn-wrap button{
    background-color: var(--white);
    box-shadow: 0 0 20px rgba(22, 29, 36, 0.16);
    display: flex;
    align-items: center;
    flex-direction: column;
    border-radius: 10rem;
    gap: 0;
    z-index: 3;
}
.monitoring_by-region .mo.btn-wrap .total-alarm p{
    font-size: 1.2rem;
    margin-top: 0.4rem;
}
.monitoring_by-region .mo.btn-wrap .total-alarm p.num{
    font-weight: 700;
    font-size: 1.7rem;
    color: var(--blue-400);
}
.monitoring_by-region .info-btn{
    position: absolute;
    background-color: var(--white);
    box-shadow: 0 0 20px rgba(22, 29, 36, 0.16);
}
.monitoring_by-region .btn.close{
    background-color: var(--white);
    box-shadow: 0 0 20px rgba(22, 29, 36, 0.16);
    margin: 2rem auto 0;
}
.monitoring_by-region .status-wrap .system-label{
    position: relative;
}
.monitoring_by-region .status-wrap .all-wrap.active,
.monitoring_by-region .status-wrap .system-label.active{
    outline: 0.2rem solid red;
    outline-offset: 0.2rem;
}
.monitoring_by-region .status-wrap .all-wrap.active{outline-color: var(--blue-400);}
.monitoring_by-region .status-wrap .system-label.inactive.commu.active{outline-color: var(--commu-1);}
.monitoring_by-region .status-wrap .system-label.warning.commu.active{outline-color: var(--commu-2);}
.monitoring_by-region .status-wrap .system-label.serious.commu.active{outline-color: var(--commu-3);}
.monitoring_by-region .status-wrap .system-label.caution.prd.active{outline-color: var(--caution-500);}
.monitoring_by-region .status-wrap .system-label.warning.prd.active{outline-color: var(--warning-500);}
.monitoring_by-region .status-wrap .system-label.danger.prd.active{outline-color: var(--danger-500);}
.monitoring_by-region .status-wrap .system-label.serious.prd.active{outline-color: var(--serious-500);}

/* 모니터링 매장별 */
.monitoring_by-shop .search-aggr-info-wrap{
    display: flex;
    align-items: stretch;
    gap: 1rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}
.monitoring_by-shop .search-aggr-info-wrap .status-item{
    border-radius: 0.4rem;
    padding: 2rem 4rem;
    border: 1px solid var(--grey-100);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    flex-grow: 1;
    gap: 2rem;
}
.monitoring_by-shop .search-aggr-info-wrap .status-item .value-wrap{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 3rem;
}
.monitoring_by-shop .search-aggr-info-wrap .status-item .value-wrap > div{
    display: flex;
    align-items: center;
    gap: 1rem;
}
.monitoring_by-shop .search-aggr-info-wrap .status-item .label{margin-bottom: 0;}
.customer-layout .prd{
    position: absolute;
    width: 68px;
    height: 68px;
    border-radius: 0.4rem;
    font-size: 1.5rem;
    color: var(--grey-400);
    font-weight: 700;
}
.monitoring_by-shop .search-aggr-info-wrap .status-item.energy{flex-shrink: 0;}
.customer-layout .prd.mint{
    border: 2px solid var(--mint-200);
    background-color: var(--mint-100);
    top: 10px;
    left: 10px;
}
.customer-layout .prd.grey{
    top: 100px;
    left: 10px;
    background-color: var(--grey-200);
    border: 2px solid var(--mint-400);
}


/* 원격제어 */
.remote-control .eco-utility{
    padding: 1rem 2rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
}
.remote-control .cell .name{
    font-size: 1.7rem;
}
.remote-control .cell .prd-info{
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}
.remote-control .cell .prd-info p{
    font-size: 1.5rem;
    color: var(--grey-400);
}
.remote-control .cell .prd-info .prd-code{
    font-weight: 500;
    color: var(--blue-400);
}
.remote-control .cell .eco-label{
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 1rem;
    border-radius: 0.4rem;
    background-color: var(--grey-50);
    color: var(--grey-300);
}
.remote-control .cell .eco-label.on{
    color: var(--mint-400);
    font-weight: 500;
}
.remote-control .oper-info{
    display: grid;
    grid-template-columns: 1fr 0.5fr;
    gap: 0.4rem;
}
/* 250318 다국어 텍스트 수정 */
.remote-control.en .oper-info{
    grid-template-columns: 2fr 0.5fr;
}

.remote-control .oper-info span{
    line-height: 2.8rem;
}
.remote-control .btn.control{
    min-width: initial;
}
.remote-control .f-temp{
    display: flex;
    width: 7rem;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--blue-400);
    justify-content: flex-end;
    align-items: center
}

/* 그룹명 팝업 */
#prd-group-popup .group-name.hide{display: none;}
#prd-group-popup .edit-wrap{display: none;}
#prd-group-popup .edit-wrap.show{display: flex;}
#prd-group-popup .prd-list-wrap{
    width: 100%;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
    padding: 0 1.2rem;
    overflow-y: auto;
    margin-top: 1rem;
}
#prd-group-popup .prd-list-wrap li{
    display: flex;
    gap: 1rem;
    padding: 2rem 0;
    border-bottom: 1px solid var(--grey-100);
}
#prd-group-popup .prd-list-wrap li:last-child{border: 0;}
#prd-group-popup .prd-list-wrap li .checkbox{margin-top: 0.4rem;}
#prd-group-popup .prd-list-wrap li .prd-info{flex-grow: 1;}
#prd-group-popup .prd-list-wrap li p{
    font-size: 1.7rem;
    display: flex;
    align-items: center;
}
#prd-group-popup .prd-list-wrap li p.prd-code{
    font-size: 1.5rem;
    color: var(--blue-400);
}
#prd-group-popup .prd-list-wrap li.individual .prd-name::after{
    display: block;
    content: '개별';
    font-size: 1.2rem;
    margin-left: 0.6rem;
    padding: 0 0.6rem;
    border-radius: 0.4rem;
    color: var(--mint-500);
    font-weight: 500;
    background-color: var(--mint-100);
}

/* 그룹제어 팝업 */
#group-control ul{
    display: flex;
    flex-direction: column;
    gap: 3rem;
    max-height: 40rem;
    overflow-y: auto;
    padding: 2rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
}

/* 원격제어 팝업 애니메이션 */
@keyframes sideLayerHideIndoor{
    0%{
        transform: translateX(0);
    }
    100%{
        transform: translateX(100%);
    }
}
@keyframes sideLayerHideOutdoor{
    0%{
        transform: translateX(0);
    }
    100%{
        transform: translateX(100%);
    }
}

/* 원격제어 팝업 : 실내기 */
#indoor-control.hide{
    animation: sideLayerHideIndoor 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
}
#outdoor-control.hide{
    animation: sideLayerHideOutdoor 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
}
.side-layer.control{
    max-width: 98%;
    overflow-y: hidden;
    overflow-x: auto;
    padding: 0;
}
.side-layer.control.mo-pop{width: 40rem;}
.side-layer.control .popup-content{
    height: 100%;
    /* display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 4rem 0; */
}
.side-layer.control .popup-content .inner-content{
    display: flex;
    overflow-y: hidden;
    height: calc(100svh - 4.8rem);
    overflow-x: auto;
}
.side-layer.control .popup-content .oper-wrap{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 4rem;
}
.side-layer.control .popup-content .oper-wrap > .oper{width: 36rem;}

/* 20250310: 게시판 파일업로드 영역 크기 수정 */
.el-upload-dragger {
    padding: 5px 10px 15px;
}

/* 20250310: 원격제어 슬라이드창 한줄로 수정 */
/* 20250312: 수정 */
.side-layer.control .popup-content .remote-wrap{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 2rem;
    overflow: hidden;
    height: calc(100vh - 5rem);
    width: initial;
    background-color: #f7f9ff;
    padding: 2rem;
}


.side-layer.control .popup-content .setting-wrap .title{
    padding-bottom: 1rem;
}
.side-layer.control .popup-content .setting-wrap ul,
.shop-monitoring .part-wrap .remote-setting{
    flex-direction: column;
    gap: 1rem;
    padding: 1.6rem 0;
    border-top: 1px solid var(--grey-200);
    border-bottom: 1px solid var(--grey-200);
    display: none;
}
.side-layer.control .popup-content .setting-wrap ul.show,
.shop-monitoring .part-wrap .remote-setting.show{display: flex;}
.side-layer.control .popup-content .setting-wrap ul .el-select-dropdown__item{
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.side-layer.control .popup-content .setting-wrap .size10 .el-select__selection{
    height: 10rem;
    width: inherit;
}

.select-wrap .size10 .el-select__wrapper.is-filterable.el-tooltip__trigger.el-tooltip__trigger{
    height: 10rem;
    width: inherit;
    max-width: 36rem;
}
.side-layer.control .popup-content .setting-wrap ul .btn-wrap button{
    font-size: 1.5rem;
}
.side-layer.control .popup-content .setting-wrap .chip{background: var(--white);}
.side-layer.control .popup-content .setting-wrap .el-select__wrapper {
    overflow-y: auto;
}
/* .side-layer.control .popup-content .remote .el-radio-group:not(.side-layer.control.mo-pop .popup-content .el-radio-group){flex-wrap: wrap;} */
.el-radio-group.defrostType,
.el-radio-group.radio-flex-wrap{
    flex-wrap: wrap;
    align-items: stretch;
}
.side-layer.control .popup-content .link{
    width: 36rem;
    padding: 2rem;
}
.side-layer.control.mo-pop .popup-content .link{padding: 0;}
.side-layer.control .popup-content .remote-wrap > div{
    width: 36rem;
    max-height: 100%;
}
.side-layer.control .popup-content > div > div{
    /* width: 36rem; */
    padding: 2rem;
    flex-shrink: 0;
}
.side-layer.control .popup-content .side-title button{
    position: initial;
    margin-right: 1rem;
}
.side-layer.control .side-title{
    justify-content: flex-start;
    margin-bottom: 0;
    margin: 1rem;
    margin-right: 0;
}
.side-layer.control ul{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.side-layer.control ul li{
    display: flex;
    justify-content: space-between;
    font-size: 1.7rem;
}

/* 20250324: 수정 */
.side-layer.control ul li .label{
    color: var(--grey-500);
    flex: 1;
}

.side-layer.control .card{
    display: flex;
    justify-content: center;
    gap: 2rem;
}
.side-layer.control .card .box{flex-grow: 1;}
.side-layer.control .card .box p{text-align: center;}
.side-layer.control .card .label{font-size: 1.5rem;}
.side-layer.control .card .value{font-size: 2.0rem; color: var(--grey-300); margin-bottom: 1rem;}
.side-layer.control .card.flex-cs .value{margin-bottom: 0;}
.side-layer.control .card .value.on{color: var(--mint-400);}
.side-layer.control .card .box .icon{margin: 0 auto;}

.side-layer.control form .input-wrap{
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
}

/* 20250324: 수정 */
.side-layer.control form .input-label{
    font-size: 1.6rem;
    letter-spacing: -0.1rem;
    width: 34.6%;
    flex-shrink: 99;
}

.side-layer.control .flex-wrap .input-label{width: 100%;}
.side-layer.control .mix-wrap{
    flex-direction: row;
}
.side-layer.control .btn-wrap{justify-content: space-between;}
.side-layer.control .sub-tit{
    font-size: 1.5rem;
    color: var(--grey-400);
}
.side-layer.control .prd-list{
    padding: 1rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
}
.side-layer.control .prd-list li{
    flex-direction: column;
    gap: 0.4rem;
    border-bottom: 1px solid var(--grey-100);
    padding-bottom: 1rem;
}
.side-layer.control .prd-list li:last-child{
    border-bottom: 0;
    padding-bottom: 0;
}
.side-layer.control .prd-list p{
    font-size: 1.5rem;
}
.side-layer.control .prd-list .active p{color: var(--blue-400);}
.side-layer.control .prd-list .prd-code{
    font-size: 1.2rem;
    color: var(--grey-400);
}

.side-layer.control .mode-wrap,
.shop-monitoring .mode-wrap{
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-direction: row;
    gap: 0;
    border: 1px solid var(--grey-200);
    border-radius: 0.4rem;
    padding: 0.4rem;
}
.side-layer.control .mode-wrap li,
.shop-monitoring .mode-wrap li{
    width: calc(100% / 3);
    padding: 0.6rem;
    border-radius: 0.4rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
}
.shop-monitoring .mode-wrap li{
    display: flex;
}
.side-layer.control .mode-wrap li:hover,
.shop-monitoring .mode-wrap li:hover{
    background-color: var(--blue-50);
}
.side-layer.control .mode-wrap li p,
.shop-monitoring .mode-wrap li p{
    text-align: center;
    font-size: 1.2rem;
    color: var(--grey-400);
}
.side-layer.control .mode-wrap li.active p,
.shop-monitoring .mode-wrap li.active p{
    color: var(--mint-400);
    font-weight: 500;
}
.shop-monitoring .mode-wrap li p{
    letter-spacing: -0.8px;
}
.side-layer.control .time-wrap{width: 12rem; min-width: 12rem;}

/* 20250324: .outlined 추가 */
.side-layer.control .popup-content .line-card .btn.medium,
#eco-mode-popup .btn.filled:not(.btn-wrap .btn),
.shop-monitoring .part-wrap .btn.outlined,
.shop-monitoring .part-wrap .btn.filled{
    width: fit-content;
    min-width: initial;
}

.side-layer.control .popup-content .el-date-editor.el-input{width: 100%;}

/* 원격제어 팝업 : 에코모드 */
#eco-mode-popup.side-layer{
    min-width: 36rem;
    width: 36rem;
    overflow-y: auto;
    overflow-x: hidden;
}
#eco-mode-popup.side-layer .remote:not(.remote.mt-auto){
    padding: 2rem 2rem 0;
}
#eco-mode-popup.side-layer .box{
    padding: 2rem;
}
#eco-mode-popup.side-layer .guide-wrap{
    width: initial;
    min-width: initial;
}
#eco-mode-popup .side-info-title{
    width: 100%;
    padding: 2rem;
    text-align: center;
}
#eco-mode-popup .card p.date{
    font-variant: tabular-nums;
    letter-spacing: -0.8px;
}
#eco-mode-popup .quantity-wrap{width: 100%;}

/* 250318 다국어 에코모드 라벨 수정 */
#eco-mode-popup.en .input-label{
    flex-direction: row;
}

/* 원격제어 팝업 모바일 버전 */
.remote-control .popup-content .control-tabs .el-tabs__header{
    width: 100%;
    padding: 2rem 2rem 0;
    margin-bottom: initial;
}
.remote-control .control-tabs .el-tabs__item{
    font-size: 2rem;
    padding: 0 1rem;
    color: var(--grey-400);
    font-weight: 300;
}
.remote-control .control-tabs .el-tabs__item.is-active, .el-tabs__item:hover{
    color: var(--blue-500);
    font-weight: 500;
}
.remote-control .el-tab-pane{
    display: flex;
    flex-direction: column;
    gap: 4rem;
}
.side-layer.control.mo-pop .el-tabs__content{
    width: 100%;
    overflow-y: auto;
    height: calc(100svh - 10.6rem);
    padding: 2rem;
}
.side-layer.control.mo-pop .el-tabs__content .link{width: 100%;}
#pane-remote-control .select-wrap{margin-left: 1px;}

/* 250318 다국어 텍스트 깨짐 wrap처리 */
.side-layer.control.mo-pop.en form .input-label{
    flex-direction: row;
}

/* 250318 라디오 그룹 border처리 */
.side-layer.control .el-radio-group.defrostType .el-radio-button{
    width: 50%;
    flex: initial;
}
.side-layer.control .el-radio-group.defrostType .el-radio-button:nth-child(3),
.side-layer.control .el-radio-group.defrostType .el-radio-button:nth-child(5){
    border-left: var(--el-border-width) var(--el-border-style) var(--el-border-color);
}
.side-layer.control .el-radio-group.defrostType .el-radio-button__inner{
    white-space: normal;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}



/* AS 상세내역 */
.AS-receipt-detail .table-area,
.service-progress-info .table-area{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}
.AS-receipt-detail .part-wrap,
.service-progress-info .part-wrap{
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

/*250103 : 진경대리님 추가 요청*/
.service-progress-info .amount span{
    background-color: var(--mint-200);
}


/* 처리 가이드 */
.process-guide .search-wrap{
    min-width: 20rem;
    flex: 6;
    flex-shrink: 0;
}


/* 제품 분석 */
.year-status{
    min-width: 20rem;
    padding: 2rem;
    border-radius: 0.4rem;
    background-color: var(--grey-50);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.6rem;
}
.year-status .txt-wrap{
    justify-content: space-between;
}
.year-status p{
    font-size: 1.7rem;
    color: var(--grey-500);
}
.year-status .txt-wrap.label p{color: var(--grey-300);}
.year-status .percent{color: var(--blue-500);}
.prd-analyze .line-card-wrap{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.prd-analyze .line-card{
    min-width: 30rem;
    flex-grow: 1;
}


.prd-analyze form{
    height: calc(100% - 14rem);
    overflow-y: auto;
}
.prd-analyze form > div{
    width: calc(100% - 2px);
    margin-left: 1px;
}
.prd-analyze form > div:first-child{
    padding-top: 1px;
}
.prd-analyze form > div:last-child{
    padding-bottom: 1px;
}

/* 부품주문내역 */
.part-order .grid-detail .img-wrap{
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}
.part-order .grid-detail .img-wrap .img-box{
    width: 40%;
    height: 40%;
    max-width: 20rem;
    max-height: 20rem;
    position: relative;
    overflow: hidden;
}
.part-order .grid-detail .img-wrap .img-box img{
    width: initial;
}
.part-order .grid-detail .img-wrap .img-box .img-view-btn{
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 0.4rem;
    background: rgba(0, 0, 0, 0.2);
}
.part-order .grid-detail .order-content .f-bold{
    min-width: 8rem;
}

/* 설치 분석 */
.install-analyze .line-card{
    width: calc(50% - 1rem);
    flex-grow: 1;
}

/* 주요부품 분석 */
.parts-analyze .prd-wrap{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: stretch;
    gap: 2rem;
}
.parts-analyze .prd-wrap li{
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}
.parts-analyze .prd-wrap li .prd-name{
    font-size: 2.0rem;
    font-weight: 500;
}
.parts-analyze .prd-wrap li .txt-wrap{
    font-size: 1.7rem;
}
.parts-analyze .prd-wrap li .txt-wrap .parts{
    color: var(--grey-400);
}
.parts-analyze .prd-wrap li .bar{
    width: 100%;
    height: 2rem;
    border-radius: 10rem;
    background-color: var(--grey-50);
    margin-bottom: 0.4rem;
    position: relative;
}
.parts-analyze .prd-wrap li .bar::after{
    display: block;
    content: '';
    width: 30%;
    height: inherit;
    border-radius: 10rem;
    background-color: var(--green);
}
.parts-analyze .bar-wrap.yellow .bar::after{
    background-color: var(--yellow);
}
.parts-analyze .bar-wrap.red .bar::after{
    background-color: var(--red);
}
.parts-analyze .prd-wrap li .bar-wrap p{
    font-size: 1.5rem;
    color: var(--grey-400);
}


/* 에너지 사용량 분석 */
/* .energy-analyze .card:not(.chart){margin-bottom: 2rem;} */
.energy-analyze .filter-area{
    flex-wrap: wrap;
    gap: 4rem;
}
.energy-analyze .filter-area .select-group{
    align-items: center;
}
.energy-analyze .filter-area .radio-wrap{
    flex-grow: 0;
    margin-left: auto;
}
.energy-analyze .energy .value::after{
    display: inline-flex;
    content: '';
    width: 0;
    height: 0;
    border: 5px solid transparent;
}
.energy-analyze .energy .value.increase::after{
    border-bottom-color: var(--red);
    margin-bottom: 6px;
}
.energy-analyze .energy .value.decrease::after{
    border-top-color: var(—blue-400);
    margin-top: 4px;
}

/*250106 날짜선택 인풋 길이 조정*/
.energy-analyze .filter-area .flex-cc .radio-wrap .el-input__wrapper {
    width: 100%;
}

/*250113 에너지 사용량 테이블 전일대비증감셀 화살표(하락)아이콘 css수정*/
.ag-center-cols-viewport .ag-center-cols-container .ag-cell .ag-cell-wrapper
.ag-cell-value .value.decrease::after{
    transform: translateY(50%) rotate(180deg);
}

/* 제품 정보 */
.prd-info .toggle-wrap{
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 2rem;
    margin-bottom: 2rem;
}
.prd-info .toggle-wrap .line-card{
    min-width: 14.8rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    flex-grow: 1;
}
.prd-info .toggle-wrap .line-card:hover{
    box-shadow: 0 0 10px rgba(11, 46, 130, 0.1);
    border-color: var(--blue-200);
}
.prd-info .toggle-wrap .line-card.active{
    background-color: var(--blue-25);
    border-color: var(--blue-200);
}
.prd-info .toggle-wrap .line-card .label{
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--grey-400);
}
.prd-info .ag-cell-value span{vertical-align: initial;}


/* 부품 정보 */
#prd-code-search-popup .prd-code-list{
    padding: 1rem;
    border-radius: 0.8rem;
    border: 1px solid var(--grey-100);
    overflow-y: scroll;
    max-height: 38rem;
}
#prd-code-search-popup .prd-code-list li{
    padding: 0.6rem 0.4rem;
    border-radius: 0.4rem;
    font-size: 1.7rem;
    color: var(--grey-500);
    cursor: pointer;
}
#prd-code-search-popup .prd-code-list li:hover{
    background-color: var(--blue-50);
}
#prd-code-search-popup .prd-code-list li.active{
    font-weight: 500;
    color: var(--blue-400);
}

/* 사용자 로그 정보 */
.user-log-info .el-radio-group{flex-wrap: wrap;}

/* 기술 공유방 */
.edu-data .grid-detail + .grid-acco-content{border: 0;}


/* 기술 공유방 댓글 */
.comment-wrap{
    padding: 2rem;
    background: var(--blue-25);
    /* border-top: 1px solid var(--grey-200); */
}
.comment-wrap ul li{
    padding: 1.6rem 0;
    border-bottom: 1px solid var(--grey-100);
}
.comment-wrap ul li:last-child{border-bottom: 0;}
.comment-wrap .btn-wrap .btn{font-size: 1.5rem;}
.comment-wrap .edit-btn,
.comment-wrap .delete-btn{
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--grey-400);
}
.comment-wrap .edit-btn:hover,
.comment-wrap .delete-btn:hover{
    text-decoration: underline;
}
.comment-wrap .edit-btn:hover{color: var(--blue-500);}
.comment-wrap .delete-btn:hover{color: var(--red);}
.comment-wrap .write{
    margin-top: 2rem;
    border: 1px solid var(--grey-200);
    border-radius: 0.4rem;
    padding: 0.4rem 1.4rem 1.4rem 0.4rem;
    background-color: var(--white);
}
.comment-wrap .write:hover{
    border-color: var(--grey-400);
}
.comment-wrap .write .el-textarea__inner{box-shadow: 0 0 0 1px transparent;}


/* 설치 실명제 */
.install-person .card-wrap{
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 2rem;
}
.install-person section.card{
    width: calc(100% / 3);
}
.install-person .btn.filled{
    height: initial;
    padding: 1rem;
    align-self: center;
    display: block;
    text-align: center;
}
.install-person .btn.filled .icon{
    transform: rotate(180deg);
    margin: 0 auto 0.4rem auto;
}
.install-person .table-area .radio-wrap{flex-grow: 0;}
.install-person .card.install-prd .page-title{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.4rem;
    flex-shrink: 0;
    flex-wrap: wrap;
    flex-grow: 1;
    max-width: 100%;
}

#install-person-popup .popup-wrap{
    width: 60%;
}
#install-person-popup .popup-wrap form .flex-ss.gap-40.flex-wrap > div{
    width: calc(50% - 2rem);
    flex-grow: 1;
}
#install-person-popup .mix-wrap .size10 .el-select__selection {
    max-height: 10rem;
    overflow-y: auto;
}


/* 펌웨어 관리 */
#firmware-mng-pop .popup-wrap{
    width: 55rem;
}
.popup.firmware h4{word-break: keep-all;}
.popup.firmware .list-wrap{
    padding: 1rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
    max-height: 40rem;
    overflow-y: auto;
}
.popup.firmware li{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 1.4rem 0.4rem;
    gap: 1rem;
    border-bottom: 1px solid var(--grey-100);
}
.popup.firmware li:first-child{padding-top: 0.4rem;}
.popup.firmware li:last-child{border-bottom: 0; padding-bottom: 0.4rem;}
.popup.firmware li .file-wrap,
.popup.firmware .popup-bottom p{
    width: fit-content;
    max-width: 100%;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.4rem 1rem;
    border-radius: 0.4rem;
    background-color: var(--blue-25);
}
.popup.firmware li .desc-btn:hover .icon{
    filter: invert(39%) sepia(15%) saturate(6082%) hue-rotate(203deg) brightness(85%) contrast(79%);
}
.popup.firmware li .desc-wrap{
    width: 100%;
    border-radius: 0.4rem;
    background-color: var(--grey-50);
    padding: 1rem;
    align-items: flex-start;
    gap: 1rem;
    display: none;
}
.popup.firmware li .desc-wrap.show{
    display: flex;
}



/* 제품별 계산 */
.calc-pg .card > .flex-cc .box{
    width: 30rem;
}
.calc-pg .card > .flex-cc .line-card{
    width: 60rem;
}
.calc-pg .filter-value{
    padding: 1rem 2rem;
    border-radius: 0.4rem;
    background-color: var(--blue-25);
    font-size: 1.7rem;
    color: var(--blue-400);
    text-align: center;
    margin-bottom: 2rem;
}
.calc-pg form .unit{
    font-size: 1.7rem;
    flex-shrink: 0;
}
.calc-pg form .calc-btn{
    width: fit-content;
    margin: 0 auto;
}
.calc-pg .value-wrap{
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 4rem;
}
.calc-pg .value-wrap p{
    font-size: 1.7rem;
}
.calc-pg .value-wrap .value{
    font-size: 4.8rem;
    font-weight: 700;
    color: var(--mint-400);
}
.calc-pg .notice{
    width: 100%;
    padding: 1rem;
    border-radius: 0.4rem;
    background-color: var(--grey-50);
}
.calc-pg .notice p{
    font-size: 1.2rem;
    color: var(--grey-400);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.calc-pg .notice p::before{
    content: '-';
    margin-right: 0.4rem;
    align-self: flex-start;
}
.calc-pg .notice p a{
    font-weight: 500;
    color: var(--blue-400);
}

/* 매장 모니터링 */
.my-prd-wrap{
    height: 100dvh;
    padding: 2rem;
    background-color: var(--white);
    border-right: 1px solid var(--grey-100);
    min-width: 24rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.my-prd-wrap .my-prd ul{
    display: flex;
    gap: 1rem;
}
.my-prd-wrap .my-prd ul li{
    display: flex;
    gap: 0.4rem;
}
.my-prd-wrap .my-prd ul li p{
    font-size: 1.5rem;
    color: var(--grey-400);
}
.my-prd-wrap .my-prd ul li p.value{font-weight: 500;}
.my-prd-wrap .my-prd ul li.connect p.value{color: var(--green);}


.my-prd-wrap .prd-list-wrap{
    overflow-x: hidden;
    overflow-y: auto;
    flex-grow: 1;
}

.my-prd-wrap .prd-list > p{
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--grey-500);
}

.my-prd-wrap .prd-list ul{
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.my-prd-wrap .prd-list li{
    padding: 1rem;
    border-radius: 0.4rem;
    border: 1px solid var(--grey-100);
}
.my-prd-wrap .prd-list li p{
    font-size: 1.5rem;
    margin-bottom: 0.4rem;
    font-weight: 500;
}
.my-prd-wrap .prd-list li p.prd-code{
    font-size: 1.2rem;
    color: var(--grey-400);
    font-weight: 300;
    margin-bottom: 0;
}
.my-prd-wrap .prd-list li.selected{
    /* background-color: var(--mint-100); */
    border-color: var(--mint-400);
}

.my-prd-wrap .prd-list li.active{
    background-color: var(--mint-100);
    /* border-color: var(--mint-400); */
}
.my-prd-wrap .prd-list li.active .prd-name{color: var(--mint-600);}

.prd-status{
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-left: auto;
}
.prd-status > .card{
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 1.3rem;
    border-radius: 0.4rem;
}
.prd-status div p{
    font-size: 1.5rem;
}
.prd-status .card.commu > div{
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.shop-monitoring .card .card-content{display: none;}
.shop-monitoring .card.show .card-content{display: flex;}
.shop-monitoring .card .caret-down{
    transition: all 0.5s;
}
.shop-monitoring .card.show .caret-down{
    transform: rotate(-180deg);
    transition: all 0.5s;
}
.shop-monitoring .card > .flex-cb{margin-bottom: 0;}
.shop-monitoring .card.show > .flex-cb{margin-bottom: 3rem;}

.shop-monitoring .filter-area{gap: 1rem;}
.shop-monitoring button.flex-cb.mb-30{width: 100%;}
.shop-monitoring .card h3{
    width: 96%;
    text-align: left;
}
.shop-monitoring .alarm-info{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.shop-monitoring .el-tabs{width: 100%;}

.shop-monitoring .part-wrap .input-wrap{
    flex-direction: row;
}
.shop-monitoring .part-wrap .temp-mark .input-wrap{
    flex-direction: column;
}
.shop-monitoring .part-wrap .temp-mark form{
    flex-direction: row;
    justify-content: center;
    gap: 1rem 4rem;
    flex-wrap: wrap;
}
.shop-monitoring .part-wrap .temp-mark form .input-label{
    width: initial;
}
.shop-monitoring .remote-card .time-wrap{
    min-width: 12rem;
    width: 12rem;
    flex-grow: 1;
}
.shop-monitoring .remote-card form .input-label{
    min-width: 9.2rem;
    width: 34.6%;
    flex-shrink: 99;
}
.shop-monitoring .remote-card form{
    gap: 1rem;
}
.shop-monitoring .remote-card .base-setting form,
.shop-monitoring .remote-card .output-setting form{
    flex-direction: row;
    gap: 4rem;
    flex-wrap: wrap;
}
.shop-monitoring .remote-card .base-setting form > div,
.shop-monitoring .remote-card .output-setting form > div{
    width: calc(50% - 2rem);
    min-width: 27.4rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex-grow: 1;
}
.shop-monitoring .remote-card .el-radio-button .el-radio-button__inner{min-width: 6rem;}
.shop-monitoring .remote-card .input-wrap{flex-wrap: wrap;}
.shop-monitoring .remote-card .input-wrap .input-label,
.shop-monitoring .remote-card .input-wrap .input-label + .flex-cs{flex-grow: 1;}


/* customer-dashboard */
.customer-dashboard .card .card-content{display: none;}
.customer-dashboard .card.show .card-content {display: block;}
.customer-dashboard .card .caret-down{
    transition: all 0.5s;
}
.customer-dashboard .card.show .caret-down{
    transform: rotate(-180deg);
    transition: all 0.5s;
}
.customer-dashboard .card > .flex-cb{margin-bottom: 0;}
.customer-dashboard .card.show > .flex-cb{margin-bottom: 0;}

/* .oper-info.card-group */
.oper-info.card-group .card .card-content {display: none;}
.oper-info.card-group .card.show .card-content {display: block;}
.oper-info.card-group .card .caret-down{
    transition: all 0.5s;
}
.oper-info.card-group .card.show .caret-down{
    transform: rotate(-180deg);
    transition: all 0.5s;
}
.oper-info.card-group .card > .flex-cb{margin-bottom: 0;}
.oper-info.card-group .card.show > .flex-cb{margin-bottom: 3rem;}




.state-chart-wrap > div{
    display: flex;
    align-items: center;
}
.state-chart-wrap ul{
    flex-grow: 1;
}
.state-chart-wrap ul li{
    display: flex;
    align-items: center;
}
.state-chart-wrap ul li > *:not(.bar){flex-shrink: 0;}

.state-chart-wrap ul li .percent{
    width: 7.6rem;
    font-size: 1.5rem;
    padding: 1rem;
    color: var(--blue-300);
    text-align: center;
}
.state-chart-wrap ul li .bar,
.state-chart-wrap ul li .bar .value{
    height: 1.6rem;
    border-radius: 10rem;
}
.state-chart-wrap ul li .bar{
    width: 100%;
    flex-shrink: 1;
}

/* 20250310 알람분석 수정 및 추가 */
.state-chart-wrap.ko > div li .system-label{
    width: 15rem;
}
.state-chart-wrap > div li .system-label{
    width: 20rem;
    justify-content: flex-start;
    padding: 0.6rem 1rem;
}
.state-chart-wrap > div li .system-label p{
    display: flex;
    align-items: center;
    gap: 0.4rem;
    width: 100%;
    justify-content: space-between;
    letter-spacing: -0.08rem;
    line-height: 20px;
}
.state-chart-wrap > div li .system-label p .num{
    text-align: right;
    width: 4rem;
}


.state-chart-wrap .commu-chart{
    border-bottom: 1px dashed var(--grey-200);
    padding-bottom: 1rem;
    gap: 1rem;
}
.state-chart-wrap .prd-chart{
    padding-top: 1rem;
}

/* bar 컬러 및 값 모음 */
.state-chart-wrap .commu-chart ul li.inactive .bar .value{
    /* width: 40%; */
    background: var(--commu-1);
}
.state-chart-wrap .commu-chart ul li.warning .bar .value{
    /* width: 30%; */
    background: var(--commu-2);
}
.state-chart-wrap .commu-chart ul li.serious .bar .value{
    /* width: 10%; */
    background: var(--commu-3);
}
.state-chart-wrap .prd-chart ul li.caution .bar .value{
    /* width: 40%; */
    background: var(--caution-500);
}
.state-chart-wrap .prd-chart ul li.warning .bar .value{
    /* width: 30%; */
    background: var(--warning-500);
}
.state-chart-wrap .commu-chart ul li.danger .bar .value{
    /* width: 10%; */
    background: var(--danger-500);
}
.state-chart-wrap .prd-chart ul li.serious .bar .value{
    /* width: 10%; */
    background: var(--serious-500);
}

.state-chart-wrap .text-wrap{width: 8.8rem;}
.state-chart-wrap .text-wrap p{
    text-align: center;
}
.state-chart-wrap .text-wrap .label{
    font-size: 1.4rem;
    color: var(--grey-400);
    font-weight: 400;
}
.state-chart-wrap .text-wrap .total{
    font-size: 2.3rem;
    font-weight: 700;
    color: var(--blue-400);
}

.shop-monitoring .alarm-info .card.alarm-type{
    min-height: 2.5rem;
}

.shop-monitoring .card.timeline{max-width: 64rem;}
.shop-monitoring .card.timeline .tl-tooltip{
    max-width: 30rem;
    padding: 1rem;
}
.shop-monitoring .card.timeline .tl-tooltip .text-wrap{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.shop-monitoring .card.timeline .tl-tooltip .msg{
    white-space: wrap;
}
.shop-monitoring .card.timeline .page-title span{
    width: 62px;
}

.shop-monitoring .log-info .filter-area{
    width: 40%;
}

.shop-monitoring .info-card{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4rem;
    flex-wrap: wrap;
}
.shop-monitoring .remote-card{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 2rem;
    flex-wrap: wrap;
}
.shop-monitoring .part-wrap{
    flex-grow: 1;
    min-width: 24rem;
    width: calc(25% - 4rem);
    flex-shrink: 0;
}
.shop-monitoring .bg-box{
    background: var(--grey-50);
    border-radius: 0.4rem;
    padding: 1rem;
}
.shop-monitoring .txt-wrap{
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.4rem;
}
.shop-monitoring .txt-wrap:last-child{margin-bottom: 0;}
.shop-monitoring .txt-wrap p{
    font-size: 1.5rem;
    text-align: right;
}
.shop-monitoring .txt-wrap .tit{
    width: 15.2rem;
    font-weight: 700;
    text-align: left;
    flex-grow: 1;
}
.shop-monitoring .bg-box .txt-wrap .tit{font-weight: 300;}

.shop-monitoring .grid-card .bg-box{
    min-width: calc(24% - 1rem);
    flex-grow: 1;
}
.shop-monitoring .grid-card .bg-box-wrap{
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    flex-shrink: 0;
    flex-grow: 1;
    width: 20%;
}
.shop-monitoring .grid-card .part-wrap{
    min-width: initial;
    width: 24%;
    flex-grow: initial;
}
.shop-monitoring .grid-card .part-wrap:last-child{
    flex-grow: 1;
}
.shop-monitoring .part-wrap .list-wrap{width: 30rem;}

.shop-monitoring .remote-card .chip label{height: 3.4rem;}
.shop-monitoring .remote-card .chip span.label{
    letter-spacing: -1.6px;
}
.shop-monitoring .remote-card .el-select__selection{
    height: 2rem;
    font-size: 1.5rem;
}
.shop-monitoring .remote-card .quantity-wrap .el-input__inner{
    --el-input-inner-height : 2rem;
    font-size: 1.5rem;
}
.shop-monitoring .remote-card .el-radio-button .el-radio-button__inner{
    font-size: 1.5rem;
    padding: 0.85rem;
}
.shop-monitoring .remote-card .line-card{padding: 1rem;}


/* 20250324: 목표, 출력 해제버튼 추가 */
.shop-monitoring .remote-card .line-card.center .input-wrap {
    justify-content: center;
}
.shop-monitoring .remote-card .line-card.center .input-wrap .input-label {
    flex-grow: 0;
    width: 235.25px;
}



/* 제품 연결*/
.prd-connect .line-card .prd-img{
    width: 14rem;
    height: 14rem;
    background: url(../img/showcase-sample.jpg) no-repeat center center;
    background-size: contain;
}
#prd-cnn-pop .popup-content{
    display: none;
    flex-grow: 1;
}
#prd-cnn-pop .popup-content.show{
    display: block;
}
#prd-cnn-pop .popup-wrap{
    display: flex;
    flex-direction: column;
}

#prd-cnn-pop .show.bt1,
#prd-cnn-pop .show.regi{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}
#prd-cnn-pop .bt2{height: calc(100% - 5.2rem);}
#prd-cnn-pop .bt2 ul{
    border: 1px solid var(--grey-100);
    border-radius: 0.4rem;
    padding: 0 1rem;
    max-height: calc(100% - 5.2rem);
    overflow-y: auto;
}
#prd-cnn-pop .bt2 ul li{
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 1.6rem;
    border-bottom: 1px solid var(--grey-100);
}
#prd-cnn-pop .bt2 ul li:last-child{border-bottom: 0;}

/* 전개도 팝업 */
.popup-wrap.iframe{
    height: 100dvh;
}
.popup-wrap.iframe .popup-content{height: calc(100% - 5.2rem);}
.popup-wrap.iframe .img-box{height: 100%;}

/* 알람 분석 */
.alarm-analyze .timeline{
    max-width: 60rem;
    width: 60rem;
    flex-grow: 1;
    flex-shrink: 0;
}
.alarm-analyze .timeline .no-content{
    width: 100%;
    height: 70rem;
}

/* 알람 설정 */
#receiver-popup .popup-wrap {
    max-width: 54.6rem;
}
#receiver-popup .popup-content .part-wrap .size10 .el-select__selection {
    height: 10rem;
    overflow-y: auto;
    padding: 8px;
}

/* 도면 보기 */
.floor-plan-list{
    width: 100%;
    padding: 0.4rem;
    border-radius: 0.8rem;
    border: 1px solid var(--grey-100);
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 38rem;
}
.floor-plan-list li{
    padding: 1rem;
    border-radius: 0.4rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.floor-plan-list li p{
    font-size: 1.7rem;
    font-weight: 500;
}
.floor-plan-list li:hover,
.floor-plan-list li.is-active{
    background: var(--blue-25);
    color: var(--blue-500);
}


/* 개인정보처리방침 */
.terms{
    min-height: 100dvh;
    height: 100dvh;
    background-color: var(--grey-50);
    padding: 4rem;
    overflow: auto;
}
.terms section.card{
    max-width: 130rem;
    margin: 0 auto;
}
.terms .sc p,
.terms .sc li,
.terms .sc span{
    font-size: 1.5rem;
    color: var(--grey-600);
}
.terms .sc{
    margin-bottom: 3rem;
}
.terms .sc .tit{
    font-size: 1.7rem;
    font-weight: 700;
    margin-bottom: 1rem;
}
.terms .sc ol, .terms .sc ul{
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.terms .sc ol li{
    list-style: decimal inside;
}
.terms .sc ul li{
    list-style: disc;
}
.terms .sc ol li ul li{margin-left: 2.8rem;}

/* 위치보기 팝업*/
#location-popup .popup-wrap {
    padding: 2rem;
    min-width: 30rem
}

#location-popup .popup-content .location-btn-wrap {
    display: flex;
    gap: 1rem;
    justify-content: center;
    height: 100%;
}

#location-popup .popup-content .location-btn-wrap .btn {
    flex-direction: column;
    border: none;
    max-width: 8rem;
    gap: 1rem;
}


#location-popup .popup-content .location-btn-wrap .btn .btn-img-wrap {
    border-radius: 0.6rem;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

#location-popup .popup-content .location-btn-wrap .btn:hover {
    box-shadow: none;
}

#location-popup .popup-content .location-btn-wrap .btn:hover .btn-img-wrap {
    box-shadow: 0 0 10px rgba(11, 46, 130, 0.3);
}


/* 20250224: 제품상세내역 모바일 등록해제 버튼 css 추가 */
.mo-flex button {display: none;}

/* 20250325: 설치 분석 수정 */
.install-analyze .table-area .line-card .square-set > div {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
}


/* 고객용 대시보드 전용 */
@media screen and (max-width: 1620px){
    .customer-dashboard .card-wrap{
        gap: 1rem;
    }
    .customer-dashboard .card-wrap .gap-40{gap: 1rem;}
    .customer-dashboard .card{
        flex-shrink: 1;
        justify-content: center;
    }
    .customer-dashboard .card .line-card{min-width: initial;}
    .customer-dashboard .card h2{font-size: 2.4rem;}
    .customer-dashboard .card .label{font-size: 1.3rem;}
    .customer-dashboard .system-status p{font-size: 1.5rem;}

    .shop-monitoring .grid-card .part-wrap{
        width: 44%;
        flex-grow: 1;
    }

    /* 20250324: 목표, 출력 해제버튼 추가 */
    .shop-monitoring .remote-card .line-card.center .input-wrap .input-label {
        flex-grow: 1;
        width: auto;
    }

}

/* 운전 모니터링 전용 */
@media screen and (max-width: 1568px){
    .shop-monitoring .card.timeline{
        max-width: initial;
    }
}

/* 딜러 대시보드 전용 */
@media screen and (max-width: 1500px){
    .tab-contents.alarm .current-status-area{gap: 1rem;}
    .tab-contents.alarm .current-status-area .card-wrap{gap: 1rem;}
    .tab-contents.alarm .current-status-area .card-wrap{
        align-items: stretch;
    }
    .tab-contents.alarm .current-status-area .card-wrap .card{
        flex-direction: column;
        align-items: flex-start;
    }
    .tab-contents.alarm .current-status-area .card-wrap > span.icon,
    .tab-contents.alarm .current-status-area .card-wrap:first-child::after{display: none;}

    .shop-monitoring .el-radio-button .el-radio-button__inner{
        font-size: 1.5rem;
        padding: 1.35rem 1rem;
    }
    .shop-monitoring .prd-status{gap: 1rem;}
    .shop-monitoring .circle.small{padding: 0.4rem;}

    .alarm-analyze .chart-area .flex-stretch{
        flex-direction: column;
    }
    .alarm-analyze .timeline{
        max-width: initial;
        width: 100%;
    }
}

/* -- 반응형 노트북 -- */
@media screen and (max-width: 1465px){
    /* 딜러용 대시보드 */
    .dealer-dashboard .tab-contents.install .current-status-area{
        align-items: flex-start;
    }
    .dealer-dashboard .current-status-area .card-wrap{
        width: 100%;
    }
    .dealer-dashboard .current-status-area .btn-wrap{
        margin-left: auto;
    }


    /* 서비스 대시보드 */
    .service-dashboard .card.service-status{
        flex-grow: 1;
    }

    /* 연구소 대시보드 */
    /* .accumulate-status-wrap .all-accmulate,
    .accumulate-status-wrap .month-accmulate{
        flex-wrap: wrap;
    } */

    /* 제품 분석 */
    .prd-analyze .flex-stretch{
        flex-wrap: wrap;
    }
    .prd-analyze .flex-stretch .year-status{
        width: 100%;
    }

    /* 설치 분석 */
    .install-analyze .line-card{
        width: 100%;
    }

    /* 제품 정보 */
    .prd-list-detail .prd-content{
        flex-direction: column;
    }
    .prd-list-detail .prd-content > div{width: 100%;}

    /* 매장 모니터링 */
    .shop-monitoring .log-info .filter-area{width: 100%;}

    /* 20250324: 목표, 출력 해제버튼 추가 */
    .shop-monitoring .remote-card .line-card.center .input-wrap .input-label {
        flex-grow: 0;
        width: 235.25px;
    }

}

/* 운전 모니터링 전용 */
@media screen and (max-width: 1380px){
    .prd-status > .card{padding: 1.3rem 0.6rem;}
    .prd-status > .card p{font-size: 1.2rem;}
    .shop-monitoring .el-radio-button .el-radio-button__inner{
        font-size: 1.4rem;
        min-width: initial;
    }
}

/* 서비스 대시보드 전용 */
@media screen and (max-width: 1350px){
    .service-dashboard .card-wrap{flex-wrap: wrap;}
}

/* -- 반응형 노트북, 태블릿 가로 -- */
@media screen and (max-width: 1280px){
    /* 권한별 메뉴관리 */
    .authority-menu-manage .card.group-menu-manage .table-area .flex-eb{
        flex-direction: column;
        align-items: flex-start;
    }
    .authority-menu-manage .card.group-menu-manage .table-area .flex-eb .flex-cs.gap-14,
    .authority-menu-manage .card.group-menu-manage .table-area .flex-eb .ml-auto{width: 100%;}

    .authority-menu-manage .card.group-menu-manage .table-area .flex-eb .flex-cs.gap-10,
    .authority-menu-manage .menu-copy-wrap{flex-grow: 1;}

    .authority-menu-manage .card.group-menu-manage .table-area .flex-eb .flex-cs.gap-14{
        gap: 4rem;
        justify-content: space-between;
        margin-bottom: 2rem;
    }
    .authority-menu-manage .card.group-menu-manage .table-area .flex-eb .ml-auto{
        margin-left: 0;
        justify-content: flex-start;
        gap: 4rem;
        justify-content: space-between;
    }

    .authority-menu-manage .el-radio-group{width: fit-content;}

    /* 레이아웃 */
    .customer-layout .layout-area{
        width: 100%;
        flex-direction: column;
        gap: 4rem;
    }
    .customer-layout .setting-wrap{width: 100%;}
    .customer-layout .floors li.focus .input-wrap{flex-grow: 1;}
    .customer-layout .box > div{
        margin: 0;
    }

    /* 딜러 대시보드 */
    .dealer-dashboard .install .current-status-area{
        flex-direction: column;
    }
    .dealer-dashboard .install .current-status-area .card-wrap{
        flex-wrap: wrap;
    }
    .dealer-dashboard .install .current-status-area > .flex-cb{
        width: 100%;
        flex-wrap: wrap-reverse;
    }
    .dealer-dashboard .tab-contents.alarm .current-status-area .card{
        padding: 1.4rem;
    }
    /* 연구소 대시보드 */
    .laboratory-dashboard .part-wrap{
        flex-direction: column;
    }
    .laboratory-dashboard .by-prd, .laboratory-dashboard .by-failure-type{
        padding: 4rem 6rem;
    }
    .laboratory-dashboard .by-prd{
        border: 0;
        border-bottom: 1px solid var(--grey-100);
    }

    /* 서비스 대시보드 */
    .service-dashboard .card-wrap{
        flex-direction: column;
    }
    .service-dashboard .card-wrap .card{width: 100%;}

    /* 원격 제어 */
    .remote-control .card .flex-stretch{
        flex-direction: column;
    }
    .remote-control .line-card.lookup{width: 100%;}

    .shop-monitoring > .flex-cs:first-child{flex-wrap: wrap;}


    /* 20250325: 모니터링 분석 table 상단 수정 */
    .monitoring-analyze .oper-info .table-area > div {
        flex-direction: column;
        gap: 2rem;
    }
    .monitoring-analyze .oper-info .table-area > div > div:first-child {
        width: 100%;
    }
}

/* 고객용 대시보드 전용 */
@media screen and (max-width: 1023px){
    .customer-dashboard .layout-area{
        width: 100%;
        flex-direction: column;
        gap: 4rem;
    }
    .customer-dashboard .monitoring-wrap{
        flex-direction: row;
        padding: 2rem 0;
        margin-right: 0;
        align-items: center;
        flex-wrap: wrap;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap{
        margin-left: auto;
        flex-direction: row;
        width: auto;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .system-label{padding: 0.4rem;}
    .customer-dashboard .monitoring-wrap li.system-wrap .system-label p{font-size: 1.3rem;}
    .customer-dashboard .floors-wrap{width: 100%;}

    .shop-monitoring .grid-card{flex-direction: column;}
    .shop-monitoring .grid-card .part-wrap{width: 100%;}
}

/* -- 반응형 태블릿 세로 -- */
@media screen and (max-width: 980px){
    /* 로그인 */
    .login .landing-wrap{display: none;}

    /* 내 정보 관리 */
    .my-info .card .flex-ss{
        display: flex;
        flex-direction: column;
    }
    .my-info .table-wrap{width: 100%;}
    .my-info .card .table,
    .my-info .card .my-info-edit{width: 100%;}


    /* 권한별 메뉴관리 */
    .authority-menu-manage .table-area .flex-eb{
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }
    .authority-menu-manage .table-area .flex-eb .flex-cs.gap-14{
        width: 100%;
        flex-wrap: wrap;
    }
    .authority-menu-manage .table-area .flex-eb .flex-cs.gap-10{flex-grow: 1;}
    .authority-menu-manage .table-area .flex-eb .ml-auto{
        width: 100%;
        margin-left: 0;
        margin-top: 1rem;
    }


    /* 딜러용 대시보드 */
    .dealer-dashboard .install .current-status-area{
        flex-direction: column-reverse;
    }
    .dealer-dashboard .card.quarterly-conversion-rate{
        min-width: 18.6rem;
        max-width: initial;
        flex: 1;
    }
    .dealer-dashboard .filter-area{
        flex-direction: column;
        align-items: flex-start;
        gap: 2rem;
    }
    .dealer-dashboard .filter-area .radio-wrap{
        margin-left: auto;
        width: 100%;
    }
    .dealer-dashboard .filter-area .select-group{width: 100%;}
    /* .dealer-dashboard .current-status-area .card-wrap .card{
        width: initial;
        flex-grow: 1;
    } */
    .dealer-dashboard .install .current-status-area .card-wrap .card{width: calc(50% - 1rem);}

    /* 서비스 대시보드 */
    .service-dashboard .card-wrap{
        flex-direction: column;
    }
    .service-dashboard .card.service-status{
        width: 100%;
        flex-shrink: initial;
    }
    .service-dashboard .service-status-wrap .status-item{
        min-width: initial;
        flex-wrap: wrap;
    }
    .service-dashboard .service-status-wrap > .flex-cs{
        align-items: stretch;
    }

    /* 연구소 대시보드 */
    /* .accumulate-status-wrap{flex-direction: column;}
    .accumulate-status-wrap .all-accmulate, .accumulate-status-wrap .month-accmulate{width: 100%;}
    .accumulate-status-wrap button, */
    .laboratory-dashboard .by-period .flex-cs .line-card{width: 100%;}
    .laboratory-dashboard .by-period .flex-cs .swiper-card.line-card{width: calc(100% - 2rem);}
    .laboratory-dashboard .by-period .flex-cs{flex-wrap: wrap;}
    .laboratory-dashboard .by-prd, .laboratory-dashboard .by-failure-type{gap: 4rem;}

    /* 알람 상세 */
    .alarm-content{
        flex-direction: column;
    }
    .alarm-list-detail .alarm-content > div,
    .prd-list-detail .prd-content > div{
        width: 100%;
    }

    /* 원격 제어 */
    .remote-control .list-wrap .list-content{
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    .remote-control .list-wrap .list-content .option-wrap{
        width: 100%;
        gap: 1rem;
    }
    .remote-control .list-wrap .list-content .option-wrap > div{
        width: initial;
    }
    .remote-control .list-wrap .list-content .option-wrap button{margin-left: auto;}

    .AS-receipt-detail .table-area,
    .service-progress-info .table-area{
        display: flex;
        flex-direction: column;
        gap: 4rem;
    }

    /* 주요부품 분석 */
    .parts-analyze .prd-wrap{
        grid-template-columns: repeat(2, 1fr);
    }


    /* 에너지 사용량 분석 */
    .energy-analyze .filter-area,
    .energy-analyze .filter-area > .flex-cs,
    .energy-analyze .filter-area .select-group{
        flex-direction: column;
        width: 100%;
    }
    .energy-analyze .filter-area .select-wrap,
    .energy-analyze .btn-wrap,
    .energy-analyze .btn-wrap button{
        width: 100%;
    }
    .energy-analyze .filter-area .radio-wrap{
        flex-grow: 0;
        margin-left: auto;
    }


    /* 설치 실명제 */
    .install-person .card-wrap{
        flex-direction: column;
    }
    .install-person .card-wrap .card{
        width: 100%;
    }
    .install-person .btn.filled .icon{
        transform: rotate(-90deg);
    }

    /* 제품별 계산 */
    .calc-pg .card > .flex-cc{
        flex-direction: column;
    }

    /* 제품 정보 */
    .prd-info .toggle-wrap,
    .prd-info .toggle-wrap > .flex-cs{gap: 1rem;}
    .prd-info .toggle-wrap .line-card{
        flex-direction: column;
        align-items: flex-start;
        padding: 1.2rem;
    }
    .prd-info .toggle-wrap .line-card > .flex-cs{
        flex-direction: column;
        align-items: flex-start;
    }

    /* 매장별 모니터링 */
    .monitoring_by-shop .search-aggr-info-wrap .status-item.alarm h2{
        text-align: center;
    }
    .monitoring_by-shop .search-aggr-info-wrap .status-item.energy{width: 100%;}
    .monitoring_by-shop .search-aggr-info-wrap .status-item .value-wrap > div{
        flex-direction: column;
        gap: 0.4rem;
        flex-grow: 1;
    }

    .shop-monitoring .grid-card .part-wrap:last-child .part{flex-direction: column;}
    .shop-monitoring .grid-card .part-wrap:last-child .part > div{width: 100% !important;}
}

@media screen and (max-width: 830px){
    /* 연구소 대시보드 */
    .accumulate-status-wrap{
        flex-direction: column;
    }
    .accumulate-status-wrap button{margin-left: auto;}

    /* 딜러 대시보드 */
    .tab-contents.alarm .current-status-area{
        flex-direction: column;
    }
    .tab-contents.alarm .current-status-area .card-wrap .card{
        flex-direction: row;
        align-items: center;
    }

    /* 알람 상세 */
    .alarm-list-detail .alarm-content .table-area > .flex-cs .flex-cs{flex-wrap: wrap;}

    /* 매장별 모니터링 */
    .monitoring_by-shop .search-aggr-info-wrap .status-item{
        flex-direction: column;
        align-items: flex-start;
        gap: 2rem;
    }
    .monitoring_by-shop .search-aggr-info-wrap .status-item .flex-cs{
        flex-direction: column;
        align-items: flex-start;
        gap: 2rem;
    }
    .monitoring_by-shop .search-aggr-info-wrap .status-item .value-wrap{
        width: 100%;
    }

    .customer-dashboard .title-card{
        flex-direction: column;
    }
    .customer-dashboard .title-card .select-wrap,
    .customer-dashboard .title-card .shop-wrap + div,
    .customer-dashboard .shop-wrap,
    .customer-dashboard .update-wrap,
    .customer-dashboard .title-card .btn.ghost{
        width: 100%;
    }
    .customer-dashboard .title-card .shop-wrap{
        flex-direction: column;
        align-items: center;
    }
    .customer-dashboard .title-card .shop-wrap + div{
        flex-direction: column;
        align-items: center;
    }
    

    /* 20250224: 고객홈 prd-wrap 수정 */
    .customer-dashboard .monitoring-wrap li.system-wrap {
        margin-top: 0;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .prd-wrap {
        grid-template-areas:
        "inactive warning"
        "caution serious";
        grid-template-rows: 1fr 1fr;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .system-label {
        padding: 0.6rem;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .prd-wrap .inactive {
        grid-area: inactive;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .prd-wrap .caution {
        grid-area: caution;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .prd-wrap .warning {
        grid-area: warning;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .prd-wrap .active {
        grid-area: danger;
    }
    .customer-dashboard .monitoring-wrap li.system-wrap .prd-wrap .serious {
        grid-area: serious;
    }


    /* 20250224: 리스트보기 수정 */
    .prd-card .temperature {font-size: 2rem;}
    .customer-dashboard .prd-card .temp-label {
        padding: 0.4rem 0.6rem;
        letter-spacing: -0.102rem;
    }

    /* 20250325: 모니터링 분석 table 상단 수정 */
    .monitoring-analyze .oper-info .table-area .monitor-group {
        flex-direction: column;
        align-items: flex-end;
        gap: 1rem;
    }
    .monitoring-analyze .oper-info .table-area .monitor-group > div:first-child {
        align-items: center;
    }
    .monitoring-analyze .oper-info .table-area .monitor-group > div:first-child > div:first-child {
        flex-direction: column;
        align-items: flex-end;
        gap: 0;
        margin-right: 1rem;
    }
    .monitoring-analyze .oper-info .table-area .monitor-group > div:first-child > div:first-child p:last-child {
        margin-right: 0;
    }
    .monitoring-analyze .oper-info .table-area .monitor-group > div:first-child > div:last-child {
        margin-right: 0;
    }

    /* 20250325: 설치 분석 수정 */
    .install-analyze .table-area .line-card .square-set {
        flex-direction: column;
        align-items: normal;
    }
}

/* 20250224: 모바일 제품상세내역 등록해제 css 추가 */
@media screen and (max-width: 680px) {
    .prd-info-wrap .btn-wrap + button {display: none;}
    .mo-flex button {display: block;}
    .mo-flex {
        display: flex;
        gap: 1rem;
        align-items: baseline;
        justify-content: space-between;
    }
    .alarm-list-detail .alarm-mng-wrap, .prd-list-detail .prd-mng-wrap {
        flex: 1;
    }
}

/* -- 반응형 모바일 -- */
@media screen and (max-width: 600px){
    .login{padding: 1.6rem;}
    .filter-area,
    .authority-menu-manage .table-area .flex-eb .flex-cs.gap-14,
    .laboratory-dashboard .by-prd, .laboratory-dashboard .by-failure-type,
    .monitoring_by-shop .search-aggr-info-wrap,
    .alarm-list-detail .prd-card .btn-wrap,
    .alarm-list-detail .table-area .flex-cs > .flex-cs{
        width: 100%;
        flex-direction: column;
    }

    .table-area .flex-eb{
        flex-direction: column;
        align-items: flex-start;
        gap: 2rem;
    }

    /* width 100% */
    /* 20250224: .line-card 주석처리 */
    .filter-area .select-wrap,
    .filter-area .btn-wrap button,
    .filter-area .select-group button:not(.quantity-wrap button),
    .table-area .flex-eb > div,
    /* .customer-dashboard .energy .line-card, */
    .customer-dashboard .by-prd-area .btn-wrap,
    .alarm-list-detail .table-area .flex-cs .flex-cs .radio-wrap,
    .alarm-list-detail .table-area .flex-cs > .flex-cs .btn-wrap,
    .energy-analyze .filter-area .radio-wrap,
    .popup.firmware .input-wrap .filled{width: 100%;}

    .table-area .flex-ce{justify-content: flex-start;}

    .table-area .flex-ce .select-wrap,
    .customer-dashboard > .card-wrap > .card:first-child{flex-grow: 1;}

    .customer-dashboard .by-prd-area .flex-cb{
        flex-wrap: wrap;
        gap: 1rem;
    }


    /* 20250224: 고객홈 card-wrap 레이아웃 수정 */
    /* 20250304: 수정 */
    .customer-dashboard .card-wrap section.card {
        width: auto !important;
    }


    .my-info .card .table{min-width: initial;}
    .my-info .card .my-info-edit{padding: 3rem;}

    /* .customer-dashboard .energy .flex-cs, */
    #as-reception .chk-wrap .flex-cs,
    .alarm-list-detail .table-area .flex-cs .txt-wrap{
        flex-direction: column;
        align-items: flex-start;
    }
    .customer-dashboard .energy .txt-wrap .value{margin-left: 0;}

    .dealer-dashboard .current-status-area .card-wrap{
        gap: 1rem;
        align-items: stretch;
    }
    .dealer-dashboard .install .current-status-area .card-wrap{
        gap: 2rem;
        margin-left: 0;
    }
    .tab-contents.alarm .current-status-area .card-wrap{
        flex-direction: row;
    }
    .tab-contents.alarm .current-status-area .card-wrap .card{
        min-width: initial;
        width: calc((100% / 3) - 2rem);
        padding: 1rem;
    }
    .tab-contents.alarm .card-wrap .card p.label{font-size: 1.4rem;}
    .tab-contents.alarm .card-wrap .card p.value{font-size: 2rem;}
    .tab-contents.alarm .current-status-area .card-wrap .icon.caret-right{
        display: none;
    }
    /* .tab-contents.alarm .current-status-area .card-wrap:first-child::after{
        display: block;
        width: 100%;
        height: 1px;
        margin: 0;
        margin-top: 1rem;
    } */

    .side-layer.alarm .prd-info-wrap li{
        flex-direction: column;
        gap: 1rem;
    }
    .side-layer.alarm .system-label{flex-direction: row;}

    .popup-content .map-wrap{overflow-x: auto;}

    .monitoring_by-region .map-wrap{
        width: calc(100% + 3.2rem);
        height: calc(100% + 3.2rem);
        top: -1.6rem;
        left: -1.6rem;
        z-index: 1;
    }
    .monitoring_by-region .total-area{
        min-width: initial;
        max-width: initial;
        width: 100%;
    }
    .monitoring_by-region .total-wrap{
        width: auto;
        margin-left: 0;
    }
    .monitoring_by-region .card-wrap{
        min-width: initial;
        max-width: initial;
        width: 100%;
        margin-left: 0;
    }
    .monitoring_by-region .card:not(.total-wrap){
        padding-top: 4rem;
        display: none;
    }
    .monitoring_by-region .card.show{
        display: flex;
        animation: 0.5s fadeInDown;
    }

    .monitoring_by-shop .search-aggr-info-wrap .status-item{
        padding: 2rem;
    }
    .monitoring_by-shop .search-aggr-info-wrap .status-item h2{
        font-size: 2.8rem;
    }
    .monitoring_by-shop .search-aggr-info-wrap .status-item .value-wrap{gap: 1rem;}

    .alarm-list-detail .prd-card,
    .prd-card ul.prd-info{min-width: initial;}
    .alarm-list-detail .alarm-info-wrap{gap: 1.4rem;}
    .alarm-list-detail .alarm-info-wrap .btn-wrap,
    .alarm-list-detail .table-area button{
        margin-left: 0;
        width: 100%;
    }
    .alarm-list-detail .alarm-info-wrap .btn-wrap button{width: 100%;}
    .alarm-list-detail .table-area > .flex-cs{
        flex-wrap: wrap;
        gap: 1rem;
    }

    .remote-control .list-wrap .list-content .option-wrap{
        width: 100%;
        flex-direction: column;
        gap: 0.4rem;
    }
    .remote-control .table-area .flex-cb{
        flex-wrap: wrap;
        gap: 1rem;
    }
    .remote-control .table-area .flex-cb > button{margin-left: auto;}
    .remote-control .eco-utility{
        width: 100%;
        flex-wrap: wrap;
        gap: 2rem;
    }
    .remote-control .eco-utility > div{width: 100%;}
    .remote-control .eco-utility > div.flex-cs{justify-content: space-between;}
    .remote-control .eco-utility .el-radio-group{flex-grow: 1;}
    .side-layer.control{
        max-width: initial;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .side-layer.control.mo-pop{
        overflow: hidden;
    }
    .side-layer.control.mo-pop .el-tabs__content{
        height: calc(100svh - 11.2rem);
    }
    .side-layer.control .popup-content{
        flex-wrap: nowrap;
    }
    .side-layer.control .popup-content > div > div{
        width: 100%;
        padding: 0 2rem;
    }
    .side-layer.control .popup-content > div:last-child{padding-bottom: 2rem;}
    #eco-mode-popup.side-layer{
        width: 100%;
    }
    #eco-mode-popup.side-layer .guide-wrap{
        padding: 2rem;
    }

    .general-inquiry .table-area .flex-eb{
        flex-direction: row;
        align-items: flex-end;
    }

    /* 주요부품 분석 */
    .parts-analyze .prd-wrap{
        grid-template-columns: 1fr;
    }

    /* 펌웨어 관리 */
    .popup.firmware .list-wrap li .btn-wrap{
        width: 100%;
        margin-left: 0;
    }
    .popup.firmware .list-wrap li .btn-wrap button{
        height: 4rem;
        flex-grow: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
        padding: 0 1rem;
        border-radius: 0.4rem;
        border: 1px solid var(--grey-100);
    }

    /* 제품별 계산 */
    .calc-pg .card > .flex-cc .box,
    .calc-pg .card > .flex-cc .line-card{
        width: 100%;
    }

    /* 서비스 대시보드 */
    .service-dashboard .slider-wrap{min-width: initial;}
    .service-dashboard .service-status-wrap .status-item{
        min-width: initial;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    .service-dashboard .service-status-wrap .status-item .flex-cs{
        flex-direction: column;
        align-items: flex-start;
    }

    /* AS접수 등록 팝업 */
    #as-reception .mix-wrap .flex-cs{flex-wrap: wrap;}
    #as-reception .mix-wrap .flex-cs .select-wrap{width: 100%;}

    /* 고객 대시보드 제품 리스트 */
    .customer-dashboard{
        padding: 1.6rem 1.6rem 3rem 1.6rem;
    }
    .customer-dashboard .title-card,
    .customer-dashboard .floors-wrap{width: 100vw;}
    .customer-dashboard .shop-wrap{
        flex-direction: column;
        justify-content: center;
        gap: 1.4rem;
    }
    /* .customer-dashboard .card:not(.card.title-card, .floors-wrap){
        width: calc(50% - 1rem);
        justify-content: flex-start;
    } */
    .customer-dashboard .card.part .flex-stretch{
        flex-wrap: wrap;
    }

    /* 20250224: .system-status 주석처리 */
    /* .customer-dashboard .card.part .system-status{width: 100%;} */

    /* 20250224: 부품 정보 수정 */
    .customer-dashboard .system-status p {font-size: 1.4rem;}

    /* 20250304: 수정 */
    .mo-more-btn {display: none !important;}

    .flex-cs .pc {
        display: block !important;
        font-size: 1.4rem;
    }

    .customer-dashboard .card-wrap .card:last-child{gap: 2rem;}
    .customer-dashboard .card-wrap .gap-40{flex-wrap: wrap;}
    .customer-dashboard .system-status{
        flex-wrap: wrap;
        text-align: center;
    }
    .customer-dashboard .system-status + button{margin-top: auto;}
    .customer-dashboard .icon-box .size24{width: 1.8rem; height: 1.8rem;}
    .customer-dashboard .icon-box + h4{font-size: 1.8rem;}
    .customer-dashboard .txt-wrap{flex-wrap: wrap;}
    .prd-card-wrap .prd-card{width: 100%;}

    .customer-dashboard .part .flex-cs .btn.text{height: 2.4rem;}

    /* 연구소 대시보드 */
    .laboratory-dashboard .by-prd, .laboratory-dashboard .by-failure-type{padding: 3rem 0;}
    .laboratory-dashboard .card .flex-cb{flex-wrap: wrap;}
    .accumulate-status-wrap .line-card{padding: 1.2rem;}
    .accumulate-status-wrap h2{font-size: 2.8rem;}
    .laboratory-dashboard .slider-wrap .swiper-card{
        min-width: initial;
        width: calc(100% - 2rem);
    }

    /* 알람 상세 */
    .alarm-list-detail .table-area .flex-cs > .flex-cs .btn-wrap{flex-wrap: wrap;}
    .alarm-list-detail .table-area .flex-cs > .flex-cs .btn-wrap button{
        width: calc(50% - 1rem);
    }

    /* 알람 설정*/
    .alarm-setting .chk-wrap{flex-wrap: wrap;}

    /* 모니터링 분석*/
    .monitoring-analyze section.card:last-child .page-title{flex-wrap: wrap;}
    .monitoring-analyze section.card:last-child .line-card > .flex-cb .flex-ce{
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    /* 제품 상세 */
    .prd-list-detail .btn-wrap.ml-auto,
    .prd-list-detail .line-card .btn-wrap{flex-wrap: wrap;}
    .prd-list-detail .btn-wrap.ml-auto > *{flex-grow: 1;}
    .prd-list-detail .prd-content > div{min-width: initial; width: 100%;}
    .prd-list-detail .prd-content .prd-card .btn-wrap{flex-direction: column;}

    /* 설치 실명제 */
    .install-person .card{display: none;}
    .install-person .card.show{display: block;}

    /* 에너지 사용량 분석 */
    /* .energy-analyze .card{display: none;} */
    .energy-analyze .card.show{display: block;}

    /* 제품 정보 */
    .prd-info .toggle-wrap{
        flex-direction: column;
        gap: 1rem;
    }
    .prd-info .toggle-wrap > .flex-cs{width: 100%;}
    .prd-info .toggle-wrap .line-card{
        min-width: calc((100% / 3) - 1rem);
    }
    .prd-info .toggle-wrap .line-card .label{
        font-size: 1.5rem;
    }
    .prd-info .toggle-wrap .line-card .icon{
        width: 2.4rem;
        height: 2.4rem;
    }
    .prd-info .toggle-wrap .line-card h2{
        font-size: 2rem;
        letter-spacing: -0.4px;
    }

    #firmware-mng-pop .popup-wrap{width: calc(100% - 3.2rem);}

    /* 제품코드 팝업 */
    #prd-code-search-popup button{width: auto;}
    #diagnosis-popup .quantity-wrap{
        flex-grow: 0;
        width: initial;
    }

    /* 개인정보처리방침 */
    .terms{padding: 2rem;}
    .terms section.card{
        margin-left: -2rem;
    }

    #install-person-popup .popup-wrap{
        width: calc(100% - 3.2rem);
    }
    #install-person-popup .popup-wrap .flex-ss.gap-40.flex-wrap{
        flex-direction: column;
        gap: 2rem;
    }
    #install-person-popup .popup-wrap form .flex-ss.gap-40.flex-wrap > div{width: 100%;}



    /* .oper-info.btn-previous-include */
    .oper-info.btn-previous-include > .card {
        position: relative;
    }
    .oper-info.btn-previous-include > .card .btn-previous {
        position: absolute;
        top: 2.6rem;
        left: 3rem;
    }
    .oper-info.btn-previous-include > .card .page-title {
        margin-left: 6rem;
    }

    .card-chart-group {display: none;}
    .card-chart-group.show {display: block;}
}

/* 20250310: 알람내역 모바일 필터영역 수정 */
@media screen and (max-width: 460px){
    .alarm-list .filter-area .select-wrap {width: 100%;}

    /* 20250325: 설치 분석 수정 */
    .install-analyze .table-area .line-card .square-set > div {
        flex-direction: column;
        align-items: flex-end;
    }
}