@charset "utf-8";
/* CSS Document */
/*특성분석-태양광*/
.krds-analysis-wrap {
  margin-bottom: 6rem;
}
.w450 {
  width: 450px !important;
  max-width: none !important;
}
.w750 {
  width: 750px !important;
  max-width: none !important;
}
.w900 {
  width: 900px !important;
  max-width: none !important;
}
.w350 {
  width: 350px !important;
}
.flex-align {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  width: 100%;
  max-width: 26.5rem;
}
.flex-align2 {
  display: flex;
  justify-content: flex-end !important;
  align-items: center;
  gap: 1.2rem;
  width: 100%;
}
.flex-align3 {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.8rem;
}
.flex-align4{
  display: flex;
  align-items: center;
  gap: 1.2rem;
  width: 100%;
  max-width: 400px;
}
.flex-gap {
  display: flex;
  gap: 4px;
}

.search-top-box .sch-filter-box .filter-form.space-between > div:first-child{
  justify-content: flex-start;
}

/*테이블 타이틀*/
.krds-analysis-wrap .sec-tit {
  display: flex;
  flex-direction: row;
  margin-bottom: 2.4rem;
  font-size: 1.9rem;
  font-weight: bold;
  width: 100%;
}
.tit-between{
  display:flex;
  justify-content: space-between;
}
.tit-flex{
  display: flex;
}
/*icon*/
.svg-icon.ico-notice {
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
  -webkit-mask-image: url(../../img/component/icon/ico_notice.svg);
  mask-image: url(../../img/component/icon/ico_notice.svg);
  width: 2rem;
}
/*버튼*/
.btn-align {
  display: flex;
  justify-content: space-between;
}
span.info-text {
  font-size: 1.7rem;
  color: #1E2124;
}
/*특성분석*/
.analyze-graph {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.analyze-graph .ag-box-padding {
  display: flex;
  width: 33.3%;
  padding: 0 10px;
}
.analyze-graph .ag-box-padding:first-child {
  padding-left: 0px;
}
.analyze-graph .ag-box-padding:last-child {
  padding-right: 0px;
}

/* 차트 확대 시 */
.analyze-graph .ag-box-padding.expand {
  width: 100% !important;
}

.analyze-graph .ag-box-padding.hidden {
  display:none;
}

.analyze-graph .ag-box {
  position: relative;
  border-radius: 1.2rem;
  border: solid 1px #cdd1d5;
  width: 100%;
  height: 350px;
}
.analyze-graph .ag-box p {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 1.2rem;
  padding: 10px;
  background: rgb(243, 249, 249);
}
.analyze-graph .ag-box p button{
  position: absolute;
  top:12px;
  right: 15px;
}

/*2025.10.29 화면 내 특성분석 영역 타이틀 동적 변경을 위해 css 조정*/
.analyze-graph .ag-box p button.analysis-elem-help {
  margin-right: 30px;
}

/*.analyze-graph .ag-box span {*/
/*  font-weight: 600;*/
/*  color: #464c53;*/
/*  font-size: 1.2rem;*/
/*}*/

.analyze-graph .ag-box .cont {
  display: flex;
  justify-content: center;
  align-items: center;
  /*padding: 10px;*/ /* 차트 영역 좀 더 넓게 쓰고자 div에 지정된 패딩 주석 처리 */
  height: calc(100% - 36px);
}
/*설비위험기상*/
.facilities-list .search-top-box .sch-filter-box .filter-form > div.calendar {
  min-width: 50rem;
}
.info-wrap {
  display: flex;
  align-items: center;
}
.info-wrap .info-text {
  display: flex;
  align-items: center;
  color: #464c53;
  font-weight: normal;
}
.no-maxwidth{
  max-width: none;
}

/*GIS 영역*/
.left-cont {
  display: flex;
  box-sizing: border-box;
  width: calc(100% - 30%);
  position: sticky;
  top: 0;
}

.left-cont.fold {
  width: 0%;
}

.left-cont.fold .gis-map {
  border: none;
}

.gis-area {
  position: relative;
  width: 100%;
  height: 100%;
}

.gis-map {
  border: solid 1px #cdd1d5;
  width: 100%;
  height: 650px; /* 2025.10.23 설비 위험 기상 결과에 따라 지도 높이가 계속 변경되어 고정함*/
  /*max-height: 650px;*/
  /*height: 100%;*/
}

.gis-map .ol-zoom {
  display: block;
  transform: scale(0.8);
  top: 0.1em;
  left: .3em;

}

.normal {
  margin-left: 15px;
  font-weight: normal;
}
.sub-cont {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-left:33px;
}
.krds-table-wrap {
  overflow-x: auto;
  min-height: 330px;
}
.krds-table-wrap .tbl.center.fixed thead th:nth-child(2) {
  left: 124px;
  z-index: 4;
  position: sticky;
}
.krds-table-wrap .tbl.center.fixed tbody th[scope="row"]:nth-child(2) {
  position: sticky;
  left: 124px;
  z-index: 2;
  background: #f4f4f4;
  text-align: center;
}
.krds-table-wrap .srroll {
  overflow: scroll;
  max-height: 650px;
}
.cc-search-title-close {
  position: absolute;
  top: 0px;
  right: -27px;
  background-image: url("../../img/map/main/arrow02.png");
  background-position: center;
  background-size: 20px 20px;
  background-repeat: no-repeat;
  background-color: #fff;
  border-radius: 0px 5px 5px 0;
  padding: 0;
  margin: 0;
  border-top: solid 1px #cdd1d5;
  border-right: solid 1px #cdd1d5;
  border-bottom: solid 1px #cdd1d5;
  width: 28px;
  height: 65px;
  transition: none !important;
  rotate: 0deg;
}
.layer{
  display:flex;
  justify-content: flex-end;
  padding: 10px 15px;;
  background: #EBF8F5;
}
.layer ul li{
  display: flex;
  align-items: center;
  float:left;
  margin-left: 15px;
  font-size: 1.5rem;
  font-weight: normal;
}
.layer ul li:first-child{
  margin-left:0px;
}
.circle-red{
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ff3131;
}
.circle-green{
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  /*background: #00A287;*/
  background: white; /*2025.10.23 웹 접근성 고려하여 수정함*/
  border: 1px solid #1e2124;
}



/*margin padding*/
.mR5 {
  margin-right: 5px;
}
.mR10 {
  margin-right: 10px;
}
.mB10 {
  margin-bottom: 10px;
}
.mB20 {
  margin-bottom: 20px;
}
.mL5 {
  margin-left: 5px;
}
.mL10 {
  margin-left: 10px;
}
.mT10 {
  margin-top: 10px;
}
.mT20 {
  margin-top: 20px;
}
.mT30 {
  margin-top: 30px;
}

@media (max-width: 1024px) {
  .search-top-box .sch-form-wrap {
    display: none!important;
  }
}
@media (max-width: 1024px) {
  .search-top-box .sch-filter-box {
    display: block;
  }
}
@media (max-width: 1024px) {
  .search-top-box {
    padding:0px;
    margin-bottom: 3rem;
  }
}
@media (max-width: 1024px) {
  .no-maxwidth {
    max-width: none;
    width: 370px;
    margin-left: -44px;
  }
}
@media (max-width: 1024px) {
  .select170{
    width: 170px!important;
  }
}
@media (max-width: 1024px) {
  .calendar-input .krds-input {
    width:180px;
  }
}