@charset "utf-8";
.container.main {}
.container.main .content {width:100%;max-width:1440px;}
.co-wrap {width:100%;height:auto;display: flex;flex-flow:column nowrap;margin:3.5rem 0 2rem;}
.co-wrap .co-header {display: flex;flex-flow: row;justify-content: space-between;align-items: end;color: #111;font-size: 1.5rem;font-weight: 400;margin-bottom: 1.5rem;}
.co-wrap .co-header h3 {color:#000;font-size:2.8rem;font-weight:600;}
.co-wrap .co-header .co-info {font-size:1.5rem;color:#565656;}
.co-wrap .co-body {width: 100%; min-height:54rem; display: flex;  flex-flow: row wrap;padding:0;box-shadow:4px 5px 5px #444b6f20;}
.co-wrap .co-body .co-tit { display: flex;flex:1 1 100%;flex-flow:row nowrap;align-items: center;justify-content: space-between;position:relative;padding:0 2rem;border: 1px solid #375685;border-right:0;background:#375685;}
.co-wrap .co-body .co-tit h4 {font-size:3.5rem;color:#fff;}
.co-wrap .co-body .co-tit div {display:flex;justify-content: end;align-items: end;gap:.5rem;padding:0 .5rem .5rem;}
.co-wrap .co-body .co-tit div span {display:inline-block;font-size:1.8rem;color:#fff7;}
.co-wrap .co-body .co-tit div .total {font-size: 3.4rem;font-weight: 600;color:#fff;position:relative;font-family: 'Noto Sans KR';padding-left:1rem;line-height:1}
.co-wrap .co-body .co-tit .t-sm { font-size:1.5rem;}
.co-wrap .co-body .t-sm {font-size:1.6rem;color:#fff7;padding:.2rem;}

.co-wrap .co-map {position:relative;width:400px;flex:0 0 500px;padding:1rem 1rem 1rem 4rem;background:#fff;border:1px solid #D9D9D9;}
.co-wrap .co-body h6 {font-size:2rem;font-weight:600;}
.co-wrap .co-body .co-content {display:flex;flex-flow:column;flex:1;}
.co-wrap .co-body .stat-wrap {display:flex;flex-flow: row wrap;align-items: center;}
.co-wrap .co-body .stat-wrap .info-box {display: flex;flex-flow:column;flex:0 0 30%;padding:2rem;border: 1px solid #D9D9D9;margin-top:-1px;margin-right:-1px;}
.co-wrap .co-body .stat-wrap .info-box:nth-child(3) {border-right:0;}
.co-wrap .co-body .stat-wrap .info-box.f3 {flex:3 3 30%;}
.co-wrap .co-body .stat-wrap .info-box.f2 {flex:2 2 30%;}
.co-wrap .co-body .stat-wrap .info-box.full {flex:1 1 100%;width:100%;}
.co-wrap .co-body .stat-wrap .info-box:last-child {background: #444b6f10;border-top:none;}
.co-wrap .co-body .info-box .info-text {display:flex;flex-flow:row wrap;gap: 1.5rem;align-items: center;}
.co-wrap .co-body .info-box .info-text > div:last-child {display:flex;justify-content: start;flex:1;align-items: center;gap: 2rem;}
.co-wrap .co-body .info-box .info-text > div:last-child div {display: flex;flex-flow:row nowrap;flex:1;gap:0; }
.co-wrap .co-body .info-box .info-text > div:last-child div.txt {position:relative;font-size:1.7rem;display: inline-flex;flex-flow: column;justify-content:flex-start;flex: 1 1 auto;}

.co-wrap .co-body .info-box .info-text  .sm_tit {display: block;vertical-align: middle;color:#666;letter-spacing:-.12rem;;}
.co-wrap .co-body .total {display:inline-block;font-size: 3.6rem;font-weight: 600;color:#4876ef;position:relative;font-family: 'Noto Sans KR';align-items: center;white-space: nowrap;line-height:1.4;}
.co-wrap .co-body .total:after {content:"";font-size:1.5rem;font-weight:400;padding-left:.2rem;letter-spacing:normal;}
.co-wrap .co-body .total.sup {display:block;text-align:right;width:100%;line-height:1;padding:0;font-size:13px;font-weight:400;}
.co-wrap .co-body .total.sup:before {display:none;}
.co-wrap .co-body .stat-wrap .info-box .m-line {flex:1 1 100%;position:relative;}
.co-wrap .co-body .stat-wrap .info-box .m-line h6 {display:inline-block;padding-right:1rem;}
.co-wrap .co-body .info-box .info-text span:after {color: #666;}
.co-wrap .co-body .info-box .info-text .qy:after {content:"건"}
.co-wrap .co-body .info-box .info-text .qt:after {content:"명"}
.co-wrap .co-body .info-box .info-text .qa:after {content:"개"}
.co-wrap .co-body .info-box .info-text .qc:after {content:"수"}
.co-wrap .co-body .info-box .info-text .qc100:after {content:"백만원"}
.co-wrap .co-body .info-box .info-text .qcm:after {content:"억원"}
.co-wrap .co-body .info-box .info-text div .icon {color:#fff;font-size:3rem;position:absolute;right:0;bottom:-1rem;z-index:0;opacity:.3}
.co-wrap .co-body .info-box .info-text div .icon i + i {display:inline-block;margin:0 -1rem 0 -2rem;}



.main-tab {width:100%;height:100%;display:flex;flex-flow:column;}
.main-tab .tab-header{width:100%;height:auto;box-sizing:border-box;display:flex;flex-flow:row wrap;justify-content:space-between;align-items: center;padding:0 1.5rem;border:1px solid #D9D9D9;border-bottom:none;background:#444b6f20;}
.main-tab .tab-header .tab-items {display:flex;flex-flow:row wrap;justify-content:start;align-items: center;gap:1rem;}
.main-tab .tab-header .tab-link {position:relative;font-size:1.8rem;font-weight:600;color:#333;padding:1.5rem 2rem;height:6rem;display:inline-block;cursor:pointer;transition:all .3s ease;}
.main-tab .tab-header .tab-link:hover,
.main-tab .tab-header .tab-link:active,
.main-tab .tab-header .tab-link.on {color:#305291;font-size:2rem;}
.main-tab .tab-header .tab-link:before {content:"";display:block;width:0;height:4px;background:#305291;position:absolute;bottom:0;left:0; transition:all .2s ease;}
.main-tab .tab-header .tab-link:hover:before,
.main-tab .tab-header .tab-link:active:before,
.main-tab .tab-header .tab-link.on:before {content:"";display: block;width:80px;left:50%;transform:translateX(-50%);}
.main-tab .tab-header .tab_status {display:flex;flex-flow:row wrap;justify-content:end;align-items: center;gap:1rem;}
.main-tab .tab-header .tab_status a {font-size:1.5rem;position:relative;z-index: 1;padding: .4rem 1.2rem;border:1px solid #444;}
.main-tab .tab-header .tab_status a.apply {border-color:#76b026;color:#76b026;}
.main-tab .tab-header .tab_status a.regist  {border-color:#4876EF;color:#4876EF;}
.main-tab .tab-header .tab_status select {width:200px;font-size:1.7rem;}
.main-tab .tab-content {}
.main-tab .bbsList ul {width:100%;height:auto;display: flex;justify-content: start;align-items: stretch;flex-flow:row wrap;gap:-1px;border:1px solid #D9D9D9;box-shadow:4px 5px 5px #444b6f20;}
.main-tab .bbsList > ul > li {flex:0 0 33.33%;box-sizing:border-box; width:33.3333%; background:#fff;border-radius:0;border-top:none;margin:0;margin-right: -1px;box-sizing:border-box;}
.main-tab .bbsList > ul > li:nth-child(3n+3){margin-right:0;border-right:none;flex:1 1 33.33%;}
.main-tab .bbsList > ul > li:nth-child(3n+1){border-left:none;}
.main-tab .bbsList > ul > li .bbs_link {width:100%;height:100%;flex-flow:column nowrap;gap:1.5rem;word-break: keep-all;padding:3rem 2.5rem; display: block; white-space: normal;  overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;   -webkit-box-orient: vertical;  word-wrap: break-word;}
.main-tab .bbsList > ul > li .bbs_link:hover {padding-left:6rem;max-width:100%;}
.main-tab .bbsList > ul > li .bbs_cate  {display: flex;justify-content:space-between;flex-direction: row;align-items: center;width:auto;margin-top:2.5rem;}
.main-tab .bbsList > ul > li .bbs_cate strong {border-radius:0;font-size:1.5rem;min-width:7rem;}
.main-tab .bbsList > ul > li .bbs_cate.apply strong {background:#fff;border-color:#76b026;color:#76b026;}
.main-tab .bbsList > ul > li .bbs_cate.finish strong {background:#fff;color:#000;}
.main-tab .bbsList > ul > li .bbs_cate.regist strong {background:#fff;border-color:#4876EF;color:#4876EF;}
.main-tab .bbsList > ul > li .bbs_cate .period {font-size:1.6rem;color:#666;font-weight:300;padding:0;}
.main-tab .pagination {margin-top:3rem;}
.main-tab .bbsList > ul > li .bbs_link .bbs_info {min-height:4.8rem;}
.main-tab .bbsList.notice > ul > li .bbs_link .bbs_date {font-size:1.6rem;display:block;margin:1rem 0;color:#666;font-weight:300;}
.mainCard {position:relative; margin:0 auto; padding-left:46rem; width:100%; max-width:1440px; box-sizing:border-box;}
.mainCard .popupZone {position:absolute; overflow:hidden; left:-46rem !important; width:69rem; height:40rem; box-shadow:0 0 2rem rgba(91,91,91,0.2); border:1px solid #223c6d; background:#fff;}
.mainCard .popupZone .item {position: relative; width:69rem; height:40rem; transition:all 0.3s;}
.mainCard .popupZone .item img{ height:100%; }
.mainCard .popupZone .item:focus-visible:after {content:''; display:block; position:absolute; top:-0.1rem; left:0; width:100%; height:100%; border:4px solid #223c6d; box-sizing: border-box;}
.mainCard .popupZone .control {  position:absolute;  bottom: 2.6rem;  left: 3rem;  height: 3.8rem;  background: #fff;  line-height: 3rem;  padding: 0.7rem 1rem;  border-radius: 2rem;  padding-left: 10rem;}
.mainCard .popupZone .control button {display:inline-block; width:2.5rem; height:2.5rem; background-repeat:no-repeat; background-position:center;}
.mainCard .popupZone .control button.prev {background-image:url('../../img/main/btn_main_popup_prev.png');}
.mainCard .popupZone .control button.next {background-image:url('../../img/main/btn_main_popup_next.png');}
.mainCard .popupZone .control button.pause {background-image:url('../../img/main/btn_main_popup_pause.png');}
.mainCard .popupZone .control button.play {background-image:url('../../img/main/btn_main_popup_play.png');}
.mainCard .popupZone .control button.pause, .mainCard .popupZone .control button.play {display:none;}
.mainCard .popupZone .control button.on {display:inline-block;}
.mainCard .popupZone .slick-counter {
  position:absolute;
  line-height:3rem;
  bottom: 2.8rem;
  left: 3.5rem;
  font-size:1.7rem;
  color:#000;
  vertical-align:bottom;
  height: 3.8rem;
  padding: 0.5rem 1.5rem;
  z-index: 1;
}
.mainCard .popupZone .slick-counter .current {margin-right:0.5rem; font-size:2.2rem; font-weight:600; vertical-align:bottom;}
.mainCard .popupZone .slick-counter .total {margin-left:0.5rem; color:#737373; vertical-align:bottom;}
.mainCard .gridItem {margin-bottom:2rem; padding-bottom:4.5rem; width:23rem; height:31rem; box-shadow:0 0 2rem rgba(91,91,91,0.2); box-sizing:border-box; opacity:0; transition:transform .5s ease-in,opacity .5s ease-in,top .5s ease-in-out,left .5s ease-in-out; transition-delay:.2s; transform:translateY(50px);
  background: #b37bcf;  /* fallback for old browsers */
  background: #223c6d; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.mainCard .gridItem.show {transform:translateY(0px); opacity:1;}
.mainCard .gridItem > a {display:block; width:100%; height:100%; background-color:#fff; background-repeat:no-repeat; background-position:right 1rem bottom 1rem; transition:all 0.3s; color:#333}
.mainCard .gridItem > a .textBox {position:relative; padding:2rem 2rem 0; word-break:keep-all; z-index:1;}
.mainCard .gridItem > a .textBox strong {display:inline-block; margin-bottom:1rem; font-size:2.4rem; font-weight:600; color:#000; }
.mainCard .gridItem > a .textBox p {line-height:2.5rem; font-size:1.7rem;}
.mainCard .gridItem  >a .cardBtn {position:absolute; padding-left:2.5rem; left:0; bottom:0; width:100%; height:4.5rem; line-height:4.5rem; box-sizing:border-box; color:#fff; font-size:1.7rem; font-weight:400; background:url('../../img/main/btn_main_cardBtn_2.png') no-repeat right 2.5rem center; z-index:1;}
.mainCard .gridItem.on {padding:0.2rem 0.2rem 4.5rem;}
.mainCard .gridItem:nth-of-type(1) {height:27rem;}
.mainCard .gridItem:nth-of-type(2), .gridItem:nth-of-type(4), .gridItem:nth-of-type(5) {margin-top:13rem;}
.mainCard .gridItem > a:hover, .mainCard .gridItem > a:focus-visible {background-color:#223c6d;}
.mainCard .gridItem > a:hover strong, .mainCard .gridItem > a:focus-visible strong,
.mainCard .gridItem > a:hover p, .mainCard .gridItem > a:focus-visible p {color:#fff;}
.mainTitle {position:absolute; top:59.5rem; left:0px;}
.mainTitle p {font-size:1.8rem; font-weight:40rem; line-height:3rem;}
.mainTitle p strong {display:block; ; font-family:'Cafe24Dongdong', sans-serif; color:#a5000c; font-size:5rem; font-weight:normal; vertical-align:bottom; line-height:4.5rem; margin-top:1.5rem; font-style:italic;}
.linkBox { position: absolute; top: 50%; transform:translateY(-50%); left: 2rem; z-index: 3; }
.linkBox .link_a{ display:block; margin-bottom:0.5rem; padding:0.5rem 1rem; border:1px solid #ddd; width:100%; box-sizing:border-box; border-radius:0.5rem; padding-right:2rem; position:relative; font-size:1.4rem; z-index:2; color:#333;}
.linkBox .link_a:before{ content:" "; display:block; position:absolute; top:1.1rem; right:1rem; width:0.8rem; height:0.8rem; border-top:0.1rem solid #555; border-right:0.1rem solid #555; transform: rotate(45deg); }
.mainCard .gridItem > a:hover + .linkBox .link_a,
.mainCard .gridItem > a:focus-visible + .linkBox .link_a  { color:#fff; border-color:#fff; }
.mainCard .gridItem > a:hover + .linkBox .link_a:before,
.mainCard .gridItem > a:focus-visible + .linkBox .link_a:before { border-color:#fff; }
.linkBox .link_a:hover,
.linkBox .link_a:focus{ background:#223c6d; color:#fff; border-color:transparent; }
.linkBox .link_a:active{ background:#000; }
.linkBox .link_a:hover:before,
.linkBox .link_a:focus:before{ border-color:#fff; }

.mainCard .gridItem > a:hover + .linkBox .link_a:hover,
.mainCard .gridItem > a:hover + .linkBox .link_a:focus,
.mainCard .gridItem > a:focus-visible + .linkBox .link_a:hover,
.mainCard .gridItem > a:focus-visible + .linkBox .link_a:focus  { background-color:#fff; color:#223c6d; border-color:#fff; }
.mainCard .gridItem > a:hover + .linkBox .link_a:hover:before,
.mainCard .gridItem > a:hover + .linkBox .link_a:focus:before,
.mainCard .gridItem > a:focus-visible + .linkBox .link_a:hover:before,
.mainCard .gridItem > a:focus-visible + .linkBox .link_a:focus:before { border-color:#223c6d; }

/*메인 공지사항*/
.mainNotice {position:absolute; top:42rem; left:0rem; width:44rem; transition:transform .5s ease-in,opacity .5s ease-in,top .5s ease-in-out,left .5s ease-in-out; transition-delay:.4s; transform:translateY(50px); opacity:0;}
.mainNotice.show {transform:translateY(0px); opacity:1;}
.mainNotice .notiTit { display:flex; justify-content: space-between; align-items: flex-end; margin-bottom:1rem; align-items: center;}
.mainNotice .notiTit h2 { font-size:2.4rem; font-weight:600; color:var(--txtn); }
.mainNotice .notiTit .contBtn_box {display:flex; align-items:center;}
.mainNotice .notiTit .contBtn_box .control {margin-right:1rem; display:flex}
.mainNotice .notiTit .contBtn_box .control button {display:inline-flex; width:2rem; height:2.5rem; background-repeat:no-repeat; background-position:center;}
.mainNotice .notiTit .contBtn_box .control button.prev {background-image:url('../../img/main/btn_main_popup_prev.png');}
.mainNotice .notiTit .contBtn_box .control button.next {background-image:url('../../img/main/btn_main_popup_next.png');}
.mainNotice .notiTit .contBtn_box .control button.pause {background-image:url('../../img/main/btn_main_popup_pause.png');}
.mainNotice .notiTit .contBtn_box .control button.play {background-image:url('../../img/main/btn_main_popup_play.png');}
.mainNotice .notiTit .contBtn_box .control button.pause, .mainNotice .notiTit .contBtn_box .control button.play {display:none;}
.mainNotice .notiTit .contBtn_box .control button.on {display:inline-flex;}
.mainNotice .notiTit .contBtn_box .control .slick-counter {margin-right:1rem; font-size:1.5rem; color:var(--black); line-height:2.5rem; display: flex; align-items:baseline;}
.mainNotice .notiTit .contBtn_box .control .slick-counter .current {margin-right:0.5rem; font-size:2rem; font-weight:600;}
.mainNotice .notiTit .contBtn_box .control .slick-counter .total {margin-left:0.5rem; }
.mainNotice .notiTit .contBtn_box .more_btn {position:relative; padding:0 2rem 0 4.0rem; height:3.9rem; display:flex; align-items: center; border:1px solid #dbdbdb; box-sizing: border-box; background: #fff url('../../img/main/btn_main_notiSlick_more.png') no-repeat center left 1.5rem; border-radius:2rem; transition:all 0.3s;}
.mainNotice .notiTit .contBtn_box .more_btn span {font-size:1.5rem; color:#000; transition:all 0.3s;}
.mainNotice .notiTit .contBtn_box .more_btn:hover {background-image:url('../../img/main/btn_main_notiSlick_more_w.png'); background-color:#223c6d; box-shadow: 0 0 2rem rgba(91,91,91,0.2);}
.mainNotice .notiTit .contBtn_box .more_btn:hover span {color:#fff;}
.mainNotice .slick_item .noti_link {display:flex; position:relative; flex-direction: column; padding:2rem; width:100%; height:13.1rem; border:1px solid #dbdbdb; border-left-color:#fafafa; border-right-color:#fafafa; box-sizing:border-box; transition:all 0.3s;}
.mainNotice .slick_item .noti_link .titBox {font-size:2rem; font-weight:600; line-height:2.5rem; width:100%; text-overflow:ellipsis;overflow:hidden;
  white-space: normal; text-overflow: ellipsis;  display: -webkit-box; height: 5rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color:var(--black);}
.mainNotice .dateBox {display:block; font-size:1.6rem; font-weight:500; margin-top:0.5rem; color:var(--txt5);}
.mainNotice .slick_item .noti_link + .noti_link {margin-top:-1px;}
.mainNotice .slick_item .noti_link:hover, .mainNotice .slick_item .noti_link:focus {border-color:#223c6d; background-color:#fff; z-index:999;}
/*
.mainNotice .slick_item .noti_link:first-child:after {content:''; display:block; position: absolute; left:0; bottom:0px; transition:all 0.3s; width:100%; height:1px; background:transparent;}
.mainNotice .slick_item .noti_link:first-child:hover:after {background:#223c6d;}
*/

/*호버모션 - 슬라이드업*/
.slideUp .gridItem .cardItem {background-color:#fff; }
.slideUp .cardItem:after {content:''; display:block; position:absolute; width:100%; bottom:4.5rem; left:0; height:0; transition:height 0.3s ease-in-out;}
.slideUp .cardItem:after {background-color:#223c6d; }
.slideUp .gridItem .cardItem:hover, .slideUp .gridItem .cardItem:focus-visible {background-color:#fff; }
.mainCard.slideUp .gridItem a strong, .mainCard.slideUp .gridItem a p {transition:color 0.3s ease-in 0.1s; }
.slideUp .cardItem:hover:after, .slideUp .cardItem:focus-visible:after {height:26.5rem;}
.gradientMotion .gridItem:hover, .gradientMotion .gridItem:focus-visible {background-position: right center;}
.gradientMotion .gridItem:hover .cardItem, .gradientMotion .gridItem:focus-visible .cardItem {background-position:center;}

/*아이콘*/
.mainCard .gridItem a .textBox {height:100%; box-sizing:border-box;}
.mainCard .gridItem a .textBox:before {content:''; display:block; position:absolute; bottom: 1.5rem; right: 1.5rem;  width: 8rem; height: 8rem; background-size:contain;background-position:right bottom; background-repeat:no-repeat; transition:all 0.3s;}
.gridItem a.item_3 .textBox:before {display:none;}
/*.gridItem a.item_1 .textBox:before {display:none;}*/
.gridItem a.item_2 .textBox:before {background-image:url('../../img/main/icon_main_02.png');}
.gridItem a.item_6 .textBox:before {background-image:url('../../img/main/icon_main_03.png');}
.gridItem a.item_4 .textBox:before {background-image:url('../../img/main/icon_main_04.png');}
.gridItem a.item_5 .textBox:before {background-image:url('../../img/main/icon_main_05.png');}
.gridItem a.item_7 .textBox:before {background-image:url('../../img/main/icon_main_07.png');}
.gridItem a.item_2:hover .textBox:before, .gridItem a.item_2:focus-visible .textBox:before {background-image:url('../../img/main/icon_main_02_hover.png');}
.gridItem a.item_6:hover .textBox:before, .gridItem a.item_6:focus-visible.textBox:before {background-image:url('../../img/main/icon_main_03_hover.png');}
.gridItem a.item_4:hover .textBox:before, .gridItem a.item_4:focus-visible .textBox:before {background-image:url('../../img/main/icon_main_04_hover.png');}
.gridItem a.item_5:hover .textBox:before, .gridItem a.item_5:focus-visible .textBox:before {background-image:url('../../img/main/icon_main_05_hover.png');}
.gridItem a.item_7:hover .textBox:before, .gridItem a.item_7:focus-visible .textBox:before {background-image:url('../../img/main/icon_main_07_hover.png');}

/*No data*/
.no_data{ padding-top:2rem; }
.no_data p{ font-size:1.8rem; text-align:center; padding-bottom:2rem; padding-top:5.5rem; position:relative; }
.no_data p:before{ content:" "; display:block; position:absolute; width:4rem; height:4rem; background:url('../../img/icon/no_data_icon.png') no-repeat center; top:0.5rem; left:50%; transform:translateX(-50%); }


/*텍스트 스타일 조정*/
.mainCard .gridItem:nth-of-type(2) {letter-spacing:-0.2rem;}
.color_1_1 .mainTitle, .color_1_2 .mainTitle {top:58.6rem;}

/*메인 시범서비스 팝업*/
.test_pop_wrap {
  position: absolute;
  background: rgba(0,0,0,0.5);
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 100;
}

.test_pop_item {
  width: 60rem;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  padding: 5rem;
  box-shadow: 0.6rem 0.5rem 1.1rem #42454a47;
  background: var(--bgColor10);
  box-sizing: border-box;
  padding-top:25rem;
}

.test_pop_item:before{ content:" "; display:block; width:18rem; height:18rem; top:5rem; position:absolute; left:50%; transform:translate(-50%); background:url('../../img/common/test_pop_icon.png') no-repeat center; }

.test_pop_item h3 {
  word-break: keep-all;
  text-align: center;
  font-size:2.4rem;
  font-weight:600;
}
.test_pop_item p {
  word-break: keep-all;
  text-align: center;
  font-size:2.4rem;
  font-weight:600;
  color:#ef3659;
  margin-top:1rem;
}

.test_pop_item .bottom_btnBox{ text-align:center; margin-top:4rem; }
.test_pop_item .bottom_btnBox button{ width:20rem; }

/* 2024. 08. 08 har : 메인 알림 팝업(기능 고도화) - 임시 CSS, 메인 화면 확정 시 함께 퍼블 요청 예정 */
.noty_pop_wrap { position: absolute; background: rgba(0,0,0,0.5); left: 0; right: 0; top: 0; bottom: 0; z-index: 100; }
.noty_pop_item { display:block; top:20rem; position:absolute; left:50%; transform:translate(-50%); box-shadow: 0.6rem 0.5rem 1.1rem #42454a47; background: var(--bgColor10); box-sizing: border-box; }
.noty_pop_item .bottom_btnBox{ text-align:center; margin-top:4rem; }
.noty_pop_item .bottom_btnBox button{ width:20rem; }


/*메인주요지표*/
#container .key_indi_main{ background:transparent; box-shadow: none; width:48rem; height:40.2rem; padding:0; margin-top:0; }
#container .key_indi_main .key_indi_wrap{ height:100%; }
#container .key_indi_main .key_indi_wrap .slick-dots{ bottom:-5rem; width:85%; left:50%; transform:translateX(-50%); }

#container .key_indi_main .key_indi_wrap .key_indi_item{ height: 40.2rem; display:flex !important; flex-wrap: wrap; gap:2rem; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link{ padding:1.8rem; flex-grow: 1; position:relative; width: calc( 50% - 1rem); background:#fff; box-shadow: 0 0 0.8rem rgb(91 91 91 / 24%); display:flex; flex-direction: column; justify-content: space-around; }

/* 2024.11.12 har 완료보고 전 변경 요청사항 */
/* #container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img{ flex-grow: 1; position:relative; width: calc( 50% - 1rem); padding:2rem; background: url(../../img/main/icon_main_03.png) no-repeat; background-position: 94% 80%; background-size: 6rem; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img h3{ font-size:2.2rem; font-weight:800; word-break:keep-all; }
*/

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img{ flex-grow: 1; position:relative; width: calc( 50% - 1rem); padding:2rem; background: url(../../img/main/icon_main_03_hover.png) no-repeat #223c6d; background-position: 94% 80%; background-size: 6rem; box-shadow: 0 0 0.8rem rgb(91 91 91 / 60%); }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img h3{ position:relative; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img h3:before{ content:" "; display:block; position:absolute; width:4.9rem; height:0.8rem; top:0; right:0.5rem;  background: url(../../img/main/btn_main_cardBtn_2.png);}
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link{ opacity:0; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(2){animation:btUp_fadeIN 0.4s 1s forwards; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(4){animation:btUp_fadeIN 0.4s 1.3s forwards; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(3){animation:btUp_fadeIN 0.4s 1.6s forwards; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(5){animation:btUp_fadeIN 0.4s 1.9s forwards; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(6){animation:btUp_fadeIN 0.4s 2.2s forwards; }

@keyframes btUp_fadeIN {
  0% {
    opacity:0;
    bottom:-2rem;
  }
  100% {
    opacity:1;
    bottom:0;
  }
}

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img h3{ font-size:2.2rem; font-weight:800; word-break:keep-all; color:#fff; }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img:after,
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img:before{ content:" "; display:block; position:absolute; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img:before{ width:0.9rem; height:0.9rem; background:#2542a8; border-radius:1rem; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img:after{ width:0.1rem; height:2rem; border:0.1rem dashed #2542a8; }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img:before{ top:50%; transform:translate(50%, -50%); right:0; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_img:after{ top:50%; right:-1rem; transform:translateY(-50%) rotate(90deg); }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:focus{ outline: none; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:hover:before{ content:" "; position:absolute; width:100%; top:0; right:0; left:0; bottom:0; border:0.2rem solid #2542a8; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:focus:before{ content:" "; position:absolute; width:100%; top:0; right:0; left:0; bottom:0; border:0.3rem dashed #2542a8; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:hover .key_indi_top .btn,
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:focus .key_indi_top .btn{ background:#2542a8; color:#fff; border:0.1rem solid #2542a8; }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:active:before{ content:" "; position:absolute; width:100%; top:0; right:0; left:0; bottom:0; border:0.2rem solid #B32843; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:active .key_indi_top .btn{ background:#B32843; color:#fff; border:0.1rem solid #B32843; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link .key_indi_top:after,
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link .key_indi_top:before{ content:" "; display:block; position:absolute; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link .key_indi_top:before{ width:0.9rem; height:0.9rem; background:#2542a8; border-radius:1rem; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link .key_indi_top:after{ width:0.1rem; height:2rem; border:0.1rem dashed #2542a8; }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(2) .key_indi_top:before{ left:50%; transform:translate(-50%, 50%); bottom:0; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(2) .key_indi_top:after{ left:50%; transform:translateX(-50%); bottom:-2rem; }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(3) .key_indi_top:before{ left:50%; transform:translate(-50%, 50%); bottom:0; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(3) .key_indi_top:after{ left:50%; transform:translateX(-50%); bottom:-2rem; }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(4) .key_indi_top:before{ top:50%; transform:translate(-50%, -50%); left:0; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(4) .key_indi_top:after{ top:50%; left:-1rem; transform:translateY(-50%) rotate(90deg); }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(5) .key_indi_top:before{ top:50%; transform:translate(50%, -50%); right:0; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(5) .key_indi_top:after{ top:50%; right:-1rem; transform:translateY(-50%) rotate(90deg); }

#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(6) .key_indi_top:before{ display: none; }
#container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link:nth-child(6) .key_indi_top:after{ display: none; }

#container .key_indi_main .key_indi_wrap .key_indi_top{ display:flex; align-items: start; gap:0.5rem; justify-content: space-between;}
#container .key_indi_main .key_indi_wrap .key_indi_top .tit,
#container .key_indi_main .key_indi_wrap .key_indi_top .btn{ word-break: keep-all; }
#container .key_indi_main .key_indi_wrap .key_indi_top .tit{ font-size:1.6rem; }
#container .key_indi_main .key_indi_wrap .key_indi_top .btn{ font-size:1.2rem; padding:0.2rem 0.7rem; border-radius:2rem; border:0.1rem solid #ddd; }

#container .key_indi_main .key_indi_wrap .key_indi_bot{ display:flex; justify-content: right; align-items: baseline; }
#container .key_indi_main .key_indi_wrap .key_indi_bot .num{ font-size:2.6rem; font-weight:800; color:#2542a8; }
#container .key_indi_main .key_indi_wrap .key_indi_bot .unit{ font-size:1.4rem; font-weight:500; margin-left:0.4rem; }


@media screen and (max-width: 1204px) {
  .mainCard{ padding-left:48rem; }
  .mainCard .gridItem:nth-of-type(3){ margin-top:13rem; }
  .gridItem:nth-of-type(4), .gridItem:nth-of-type(5){ margin-top:0rem; }
  .mainNotice{ left:2rem; }

}

@media screen and (max-width: 975px) {

  .container.main{ padding-top:9rem !important; padding-bottom:3rem !important; }
  .mainCard{ padding-left:2rem; padding-top:29rem; }
  .mainCard .popupZone{ left:0rem !important; top:-29rem; width:73rem; }
  .mainCard .popupZone .item{ overflow: hidden; }
  .mainCard .gridItem:nth-of-type(1){ background:transparent; box-shadow: none; }
  .mainNotice{ left:0; position:relative; top:auto; width: calc( 100% - 2rem ) ; }
  .mainCard .gridItem{ height:28rem; }
  .slideUp .cardItem:hover:after, .slideUp .cardItem:focus-visible:after{ height:23.5rem }
  .mainCard .popupZone .item img{ width:100%; }
}

@media screen and (max-width: 777px) {
  .mainCard{ padding-top:49vw !important; }
  .mainCard .popupZone{ width: 100% ; height:auto; top:-49vw; }
  .mainCard .gridItem{ height:auto; width: calc( 100% - 2rem) ; margin-top:0 !important; }
  .slideUp .cardItem:hover:after, .slideUp .cardItem:focus-visible:after{ height:calc( 100% - 4.5rem ); }
  .mainCard .gridItem a .textBox{ padding-bottom:6rem; }
  .mainCard .gridItem:nth-of-type(1){ height:0rem; padding:1rem; margin:0; }
  .mainCard .popupZone .item{ box-sizing: content-box; padding-bottom:3vw; overflow:hidden;    padding-bottom: 49vw; height: 0; }
  .mainCard .popupZone .item img{ width:100%; position:absolute; }
  .mainCard .linkBox{ display:flex; width:30rem; }
  .mainCard .linkBox a + a { margin-left:1rem; }
  .test_pop_item{ top:12rem; transform: translate(-50%, 0); }
  .mainCard .popupZone .slick-counter{ bottom:2rem; left:3rem; }
  .mainCard .popupZone .control{left: 2rem;bottom:2rem;height:3.8rem;}

  .mainCard .gridItem > a .textBox strong,
  .mainNotice .notiTit h2{ font-size:2rem; }
  .mainNotice .slick_item .noti_link .titBox{ font-size:1.7rem; }
  .mainCard .gridItem >a .cardBtn,
  .mainCard .gridItem > a .textBox p,
  .mainNotice .dateBox{ font-size:1.5rem; }
  .mainNotice .slick_item .noti_link{ height:12rem; }

  .test_pop_item{ width:90%; padding:3rem; padding-top:23rem; }

  /*메인 주요지표 리뉴얼*/
  #container .key_indi_main{ width:calc( 100% - 2rem); }
}

@media screen and (max-width: 500px) {
  .mainCard .popupZone .slick-counter{ left:2rem; bottom:1.8rem; }
  .mainCard .popupZone .control{left: 1.5rem;bottom: 1.6rem;}
  .mainCard{ padding-left:1rem; padding-top:calc( 49.5vw - 0.5rem) !important; }
  .mainCard .gridItem{ height:auto; width: calc( 100% - 1rem); margin-bottom:1.5rem; }
  .mainCard .gridItem a .textBox{ padding:1.5rem 1.5rem 5rem; }
  .mainCard .linkBox{ left:1.5rem; width:26rem; }
  .mainCard .gridItem >a .cardBtn{ padding-left:2rem; }
  .mainCard .gridItem a .textBox:before{ width:5rem; height:5rem; }
  .mainNotice .slick_item .noti_link{ padding:1.5rem; height:10.5rem; }

  .mainCard .gridItem > a .textBox strong,
  .mainNotice .notiTit h2{ font-size:1.8rem; }
  .mainNotice .slick_item .noti_link .titBox{ font-size:1.5rem; }
  .mainCard .gridItem >a .cardBtn,
  .mainCard .gridItem > a .textBox p,
  .mainNotice .dateBox,
  .linkBox .link_a{ font-size:1.3rem; }

  .survey_banner{ top:11rem !important; right:6rem !important; }
  .survey_banner .bn_item{ padding:1.5rem; }

  /*메인 주요지표 리뉴얼*/
  #container .key_indi_main{ width:calc( 100% - 1rem); }
  #container .key_indi_main .key_indi_wrap .key_indi_item,
  #container .key_indi_main{ height:auto; }

  #container .key_indi_main .key_indi_wrap .key_indi_item .key_indi_link{ padding:1.5rem; }
  #container .key_indi_main .key_indi_wrap .key_indi_top .tit{ font-size:1.5rem; }
  #container .key_indi_main .key_indi_wrap .key_indi_bot .num{ font-size:2.2rem; }
}