@charset "UTF-8";

/*상단 슬라이드 팝업*/
.layer_pop{position: relative; background: url("/images/layer_pop_bg.jpg") #3d3d3d 50% 50% no-repeat; z-index: 999}
.layer_pop .container_wrap{position:relative;}
.layer_pop .item{padding: 35px 0 65px 14.22413793103448%;} /*165 / 1160*/
.layer_pop a{color: #fff; letter-spacing: -1px;}
.layer_pop a.pop_subject strong {display: block; width: 87%; font-size: 1.2em; font-weight: 600; text-overflow: ellipsis;  overflow: hidden; white-space: nowrap;}
.layer_pop a.pop_subject span{display: block; width: 87%; text-overflow: ellipsis;  overflow: hidden; white-space: nowrap;}
.layer_pop a.pop_more{position:absolute; bottom: 20px; right: 40px; width: 92px; line-height: 25px; border: 4px solid #f7cc1d; text-align: center;}
.layer_pop .owl-carousel .owl-nav .owl-prev, .layer_pop .owl-carousel .owl-nav .owl-next{position: absolute; top: 50%; width: 20px; height: 36px; margin-top: -18px; text-indent: -9999px; overflow: hidden;}
.layer_pop .owl-carousel .owl-nav .owl-prev{background: url("/images/cheveron-w-left.png") no-repeat;}
.layer_pop .owl-carousel .owl-nav .owl-next{right:0; background: url("/images/cheveron-w-right.png") no-repeat;}
.layer_pop .close_sec{position: absolute; top:0; right: 5%; color: #fff; font-size: 0.85em; z-index: 400;}
.layer_pop .close_sec .pop_close{margin-left: 10px;}

.visual {position:relative; height: 790px; clear: both;}
.visual .owl-carousel .item{min-height: 790px;}
.visual .owl-carousel .item h3.slogan{padding: 165px 0 0 16.66666666666667%; font-size: 1.9em; font-weight: 300; color: #fff;}
.visual .owl-carousel .item h3.slogan > span{display: block; font-size: 0.85em;}
.visual .owl-carousel .item h3.slogan strong{font-weight: 300;}
.visual .owl-carousel .item.first{background: url("/images/slide01.jpg") 50% 50% no-repeat;}
.visual .owl-carousel .item.second{background: url("/images/slide01.jpg") 50% 50% no-repeat;}
.visual .owl-carousel .item.third{background: url("/images/slide01.jpg") 50% 50% no-repeat;}
.visual .owl-carousel .item.fourth{background: url("/images/slide01.jpg") 50% 50% no-repeat;}

.fix_note{position:absolute; top:30px; left:25px; width: 100%; z-index: 10;}
.fix_note p{overflow: hidden; float: left; }
.fix_note p.item1 {display: block; font-size: 36px; color : white;}
.fix_note p.item2 {display: block; font-size: 36px; color : green;}
.fix_note p.item3 {display: block; font-size: 24px; color : white;}

/* 전체 오버레이가 있으면 제거(있을 때만) */
.visual_note::before { display:none !important; }

/* 글자 박스: 좌측은 진하게, 우측은 투명하게 */
.visual_note .fix_note .container_wrap{
  display: inline-block;          /* 박스가 내용만큼만 */
  width: auto;
  max-width: 900px;               /* 필요시 조절 */
  padding: 18px 24px;
  border-radius: 14px;

  background: linear-gradient(
    90deg,
    rgba(0,0,0,0.55) 0%,
    rgba(0,0,0,0.35) 55%,
    rgba(0,0,0,0.00) 100%
  );

  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

/* 텍스트 대비만 확실하게 */
.visual_note .fix_note p{
  color:#fff;
  text-shadow: 0 2px 8px rgba(0,0,0,.85);
}

/* 초록색 제거(현재 초록이라 더 답답해 보임) */
.visual_note .fix_note p.item2{ 
    font-size: clamp(22px, 2.5vw, 30px);  /* 기존 36px → 축소 */
    line-height: 1.2;
    font-weight: 600;
    color: #fff !important;              /* 기존 green 덮어쓰기 */
}

/* '소중한 기부' 강조 */
.visual_note .fix_note .highlight {
    color: #ffd65a;              /* 따뜻한 포인트 컬러 */
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;

    /* 배경 없이도 튀게 */
    text-shadow:
        0 2px 6px rgba(0,0,0,0.85);
}




.target_note{float:left; width: 80.08333333333333%; padding: 5px 0 5px 0.5833333333333333%; overflow: hidden; border: 1px solid #e1e1e1;} /*277 / 1200*/  /*7 / 1200*/
.target_note > ul > li{float: left; width: 25%; line-height: 56px; box-sizing: border-box;}
.target_note > ul > li:first-child, .target_site > ul > li:nth-child(3){border-right: 1px dashed #e0e0e0;}

.middle_note{float:left;}

.task_note{float:left; width: 50.08333333333333%; padding: 5px 0 5px 0.5833333333333333%; overflow: hidden; border: 1px solid #e1e1e1;} /*277 / 1200*/  /*7 / 1200*/
.task_note > ul > li{float: left; width: 50%; line-height: 56px; box-sizing: border-box;}
.task_note > ul > li:first-child, .target_site > ul > li:nth-child(3){border-right: 1px dashed #e0e0e0;}

.donation_form1{clear: both}

.fix_menu{position:relative; bottom:0; width: 100%; background: url("/images/fix_bg.png"); z-index: 10;}
.fix_menu ul{overflow: hidden;}
.fix_menu ul > li{float: left; width: 25%; line-height: 180px;}
.fix_menu ul > li.fix1 > a{background: url("/images/ico_v_fix_01.png") 0 50% no-repeat;}
.fix_menu ul > li.fix2 > a{background: url("/images/ico_v_fix_02.png") 0 50% no-repeat;}
.fix_menu ul > li.fix3 > a{background: url("/images/ico_v_fix_03.png") 0 50% no-repeat;}
.fix_menu ul > li.fix4 > a{background: url("/images/ico_v_fix_04.png") 0 50% no-repeat;}
.fix_menu ul > li > a {display:block; padding-left: 45%; width: 55%; color: #fff;}

.announcement{padding:37px 0 72px; overflow: hidden;}


/* 강서대: .notice_main */
.board{position:relative; float:left; width: 46.5%;} /*558 / 1200*/
.board h4.tit{margin-top: 0;}
.board .tab_menu{border: 1px solid #e3e3e3; overflow: hidden;}
.board .tab_menu > li{float:left; width: 14.28571428571429%; height: 38px; line-height: 38px; text-align: center; box-sizing: border-box; }
.board .tab_menu > li + li{border-left: 1px solid #e3e3e3;}
.board .tab_menu > li > a{display: block;}
.board .tab_menu > li.active{border-bottom: 3px solid #f7cc1d; background-color: #464646;}
.board .tab_menu > li.active > a{color: #fff;}
.board .tab_content{padding: 15px;}
.board .tab_content > li > ul > li + li{margin-top: 3px;}
.board .tab_content > li > ul > li > a{display:block;  overflow: hidden; font-weight: 300;}
.board .tab_content > li > ul > li > a:hover{color: #38a0e8;}
.board .tab_content > li > ul > li > a .subject{float:left; width: 80%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} /*360 / 558*/
.board .tab_content > li > ul > li > a .date{float: right;}

/* 강서대: .view_more → 발전기금은 .more 라서 “아이콘만” 매핑 */
.board .more{
  position:absolute;
  top: 57px;
  right: 5%;
  width: 20px;
  height: 20px;
  background: url("/images/ico_view_more.png") 50% 50% no-repeat;
  text-indent: -9999px;
  overflow: hidden;
}

/* =========================
   NEWS: 강서대 .kc_news 그대로 복사
========================= */

.kc_news{position:relative; float:left; width: 47.33333333333333%; margin-left: 6.166666666666667%; padding: 2.083333333333333%; height: 320px; box-sizing: border-box; background: url("/images/news_bg.gif") no-repeat; background-size: cover; overflow: hidden;}
.kc_news h4.tit{margin-top: 0; border-left-color: #fff;}
.kc_news h4.tit a{color: #fff;}
.kc_news > div > .thumbnail{float: left; width: 51.05633802816901%; max-width: 250px; max-height: 200px; text-align: center; overflow: hidden;}
.kc_news > div > ul {float: left; width: 44%; margin-left: 4.401408450704225%;}
.kc_news > div > ul img{display: none;}
.kc_news > div > ul > li{max-height: 203px; overflow: hidden;}
.kc_news > div > ul > li * {color: #fff !important;}
.kc_news > div > ul > li > a:hover{text-decoration: none;}
.kc_news > div > ul > li > a > strong{display: block; max-height: 54px; margin: 10px 0; font-size: 1.2em !important; overflow: hidden;}
.kc_news > div > ul > li > a * {font-size: 14px !important;}
.kc_news > div > ul > li > a p{overflow: hidden; text-align: left !important; font-size: 14px !important;}
.kc_news > div > ul > li > a > p, .kc_news > div > ul > li > a > span {font-size: 0.85em;}
.kc_news > div > ul > li > a > span{display: block; margin-top: 10px;}
.kc_news .date{position: absolute; right: 5%; bottom: 5%; color: #fff;}
.kc_news .kcnews_more{position: absolute; width: 20px; height: 23px; right: 24px; top: 24px; background: url("/images/ico_more_w.png") no-repeat; text-indent:-9999px; overflow:hidden;}

/* ✅ 발전기금 뉴스는 img.thumbnail을 쓰는 경우가 많아서 “추가”만 해줌(태그 변경 없음) */
.kc_news img.thumbnail{
  float: left;
  width: 51.0563380282%;
  max-width: 250px;
  max-height: 200px;
  object-fit: cover;
  display:block;
}

/*35 / 282*/
.schedule{float:left; width: 45.25862068965517%; margin-left: 3.706896551724138%;}  /*525 / 1160*/
/* 학사일정 */
.schedule h4.tit{margin-top: 0;}
.schedule .year_month, .schedule .month_info{float:left;}
.schedule .year_month{text-align: center;}
.schedule .year_month p.year{font-size: 1.4em; font-weight: 600;}
.schedule .year_month p.month{font-size: 2em; color: #82d9e6 ; font-weight: 600;}
.schedule .year_month span.cl_btn{display: inline-block; width: 20px; height: 20px; cursor: pointer;}
.schedule .year_month span.cl_btn.prev{background: url("/images/cl_prev.png") 50% 50% no-repeat;}
.schedule .year_month span.cl_btn.next{background: url("/images/cl_next.png") 50% 50% no-repeat;}
.schedule .month_info{width: 78.0952380952381%; margin-left: 4.761904761904762%;} /* width: 328 / 420*/    /*margin-left: 20 / 420*/
.schedule .month_info .month_list > ul{overflow: hidden;}
.schedule .month_info .month_list > ul > li{float: left; width: 8.333333333333333%;  text-align: center; font-weight: 600;}
.schedule .month_info .month_list > ul > li.this_month > a {color: #82d9e6 ;}
.schedule .month_info .month_list .month_line{position:relative; height: 2px; margin-top: 10px; background-color: #060606;}
.schedule .month_info .month_list .month_line > .month_progress{position: absolute; top:0; left: 24.9999999%; width:  8.333333333333333%; height: 2px; background-color: #82d9e6 ;}
.schedule .month_info .monthly_schedule{max-height:144px; padding: 27px 15px; border: 1px solid #dfdfdf; overflow-y: auto;}
.schedule .month_info .monthly_schedule > ul > li + li{margin-top: 18px;}

.quick_sec{float:left; width: 24.39655172413793%; margin-left: 2.327586206896552%;}   /*283 / 1160  27 / 1160*/

.funcbox{width: 48.0565371024735%;}  /*136 / 283*/
.funcbox + .funcbox{margin-left: 1.5%;}  /*18 / 1200*/
.funcbox.func1{width: 100%; background: url("/images/func_1_bg.jpg") 50% 50% no-repeat; background-size: cover;}
.funcbox.func2{margin: 11px 0 0 0; background: url("/images/func_2_bg.jpg") 50% 50% no-repeat; background-size: cover;}
.funcbox.func3{margin: 11px 0  0 3.886925795053004%; background: url("/images/func_3_bg.jpg") 50% 50% no-repeat; background-size: cover;} /*11 / 283*/
.funcbox > a {display: block; position: relative; width: 77.94117647058824%; height: 94px;  padding: 11.02941176470588%;}  /*106 / 136*/   /*15 / 136*/
.funcbox.func1 > a {height: 76px; padding: 15px 0 15px 40.63604240282686%; color: #07626f; line-height: 1.5;}  /*115 / 283*/
.funcbox.func1 h3{color: #07626f;}
.funcbox.func1 span{display:block; font-size: 1.5em;}
.funcbox.func1 em{display: block;}
.funcbox.func2, .funcbox.func3{float: left;}
.funcbox.func2 h3, .funcbox.func3 h3 {color: #0e0e0e; font-size: 1em;}
.funcbox .more_btn{display: block; position: absolute; top:15px; right:15px; width: 22px; height: 22px; text-indent: -9999px; overflow: hidden; background: url("/images/ico_more.png") no-repeat;}

.quick_link{padding: 39px 0 83px; overflow:hidden; background: url("/images/link_bg.jpg") no-repeat; background-size: cover;}
.link_site{float:left; overflow: hidden;}
.link_site > h3 {float: left; margin-top: 10px; padding-left: 60px; }
.link_site.addon {width: 50%}   /*580 / 1160*/
.link_site.addon > h3 {background: url("/images/ico_addon.png") 0 50% no-repeat;}
.link_site.helper{width: 44.48275862068966%; margin-left: 5.517241379310345%;}  /*516 / 1160*/   /*64 /1160*/
.link_site.helper > h3 {background: url("/images/ico_helper.png") 0 50% no-repeat;}
.link_site > h3 > span{display: block;}
.link_site > ul {float:left; margin-left: 23px; padding: 15px 0 15px 25px; overflow: hidden; background: url("/images/link_menu_bg.png"); border: 2px solid #fff;}
.link_site.addon > ul{width: 67%}  /*403 / 580*/
.link_site.helper > ul{width: 62.01550387596899%;} /*320 / 516*/
.link_site > ul > li{float: left; width: 33.3333%;}
.link_site > ul > li >  a {display: block; padding-left: 7px; background: url("/images/dot.gif") 0 50% no-repeat; font-weight: 600;}


.form_layer_wrap {
    display: none;
    position: fixed;
    width: 360px;
    top: 20%;
    left: 50%;
    margin-left: -213px;
    padding: 2rem;
    border: 1px solid #e6e6e6;
    z-index: 66;
    background: #fff;
    box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.5);
}
.form_layer_wrap h3{
    margin: 5px 0;
    text-align: center;
}
.form_layer_wrap p{
    margin: 12px 0;
}
.form_layer_wrap input[type="text"], .form_layer_wrap input[type="number"], .form_layer_wrap select {
    width: 100%;
    min-width: 300px;
    height: 35px;
    padding: 3px 5px;
    line-height: 35px;
    border: 1px solid #e6e6e6;
    box-sizing: border-box;
}
.form_layer_wrap textarea{
    width: 100%;
    min-width: 300px;
    border: 1px solid #e6e6e6;
    padding: 5px;
    box-sizing: border-box;
}
.form_layer_wrap .btn_wrap{padding: 20px 0; text-align: center;}
.form_layer_wrap .btn_apply{display: inline-block; width: 84px; height: 35px; line-height: 35px; background-color: #88a2e8; border-radius: .28571429rem; color: #fff;}


/* ===== 상단 헤더를 강서대 메인 스타일로 ===== */
.header,
.gnb,
.top_menu,
.header_wrap {
    background-color: #6b3a8f; /* 이미지2 보라색 */
}

/* 로고 텍스트 */
.header .logo,
.header .logo a,
.header .logo span {
    color: #ffffff;
}

#header .logo img {
    filter: brightness(0) invert(1);
}

/* 상단 메뉴 */
.header .gnb a,
.header .top_menu a {
    color: #ffffff;
    font-weight: 500;
}

.header .gnb a:hover,
.header .top_menu a:hover {
    color: #ffd65a;              /* 연한 골드 포인트 */
}

.header,
.header_wrap {
    height: 90px;
    display: flex;
    align-items: center;
}

.header .logo img {
    height: 48px;   /* 로고 크기 조절 */
}




@media(max-width: 1200px){
    .schedule_sec .schedule_sec > h3{float: none; margin-bottom: 15px;}
    .schedule_sec .schedule_zone{margin-left: 0;}
    .schedule_sec .func_sec{margin-left: 2%;}

    .link_site > h3{width: 100%; line-height: 60px; margin-top: 0; box-sizing: border-box;}
    .link_site > h3 > span{display: inline;}
    .link_site > ul{margin: 25px 0 0 0; box-sizing: border-box;}
    .link_site.addon > ul, .link_site.helper > ul{width: 100%; box-sizing: border-box;}
}
@media (max-width: 1024px) {
    .visual {height: 500px;}
    .visual .owl-carousel .item{min-height: 500px}

    .fix_menu{padding: 15px 0;}
    .fix_menu ul{overflow: hidden;}
    .fix_menu ul > li{text-align: center; line-height: 2;}

    .fix_menu ul > li.fix1 > a,
    .fix_menu ul > li.fix2 > a,
    .fix_menu ul > li.fix3 > a,
    .fix_menu ul > li.fix4 > a{background-position: 50% 0; background-size: 50%;}

    .fix_menu ul > li > a {display:block; padding: 50% 0 0 0; width: 100%; color: #fff;}




    .board{width: 49%; height: auto; margin-left: 0; box-sizing: border-box;}
    .board > .tab > .tab_menu{width: 85%;}
    .schedule_sec{width: 49%; margin: 0 0 0 2%;}
    .schedule_sec #calender{padding: 0;}
    .schedule_sec #calender #calenderHeader{position: relative; left: 0;}
    .schedule_sec #calender .arrow{position: absolute; top: 20px;}
    .schedule_sec #calender .arrow.prev{left: 40px;}
    .schedule_sec #calender .arrow.next{right: 40px;}
    .schedule_sec .fc .fc-row .fc-content-skeleton td{padding: 2px 0;}

    .quick_sec{width: 100%; margin: 25px 0 0 0;}
    .funcbox{float:left; width: 32%; height: 106px;}  /*210 / 1024*/
    .funcbox.func1{width: 32%;}
    .funcbox > a {width: 100%; box-sizing: border-box;}
    .funcbox + .funcbox{margin-left: 2%;}  /*18 / 1024*/
    .funcbox.func2, .funcbox.func3{margin-top: 0;}

    .form_layer_wrap{
        width: 90%;
        left: 0;
        margin-left: auto;
        margin-right: auto;
        box-sizing: border-box;
    }
    .form_layer_wrap input[type="text"], .form_layer_wrap input[type="number"], .form_layer_wrap textarea, .form_layer_wrap select{ min-width: initial;  }
}

@media (max-width: 768px){
    .visual {height: 320px;}
    .visual .owl-carousel .item{min-height: 320px}
    .service_sec{padding: 50px 0;}

    .link_site.addon, .link_site.helper{width: 100%;}
    .link_site.helper{margin: 30px 0 0 0;}

}

@media (max-width: 640px) {
    .visual{height: 300px;}
    .visual .owl-carousel .item{min-height: 300px; background-size: cover;}
    .visual .owl-carousel .item.first,
    .visual .owl-carousel .item.second,
    .visual .owl-carousel .item.third,
    .visual .owl-carousel .item.fourth{background-size: cover; background-position: 70% 50%;}

    .entrance{width: 100%; padding-left: 60%;}
    .entrance > ul > li{margin-top: 15px;}
    .board, .schedule_sec{width: 100%; margin: 25px 0 0;}
    .funcbox{width: 50%;}
    .funcbox.func1{width: 100%;}
    .funcbox + .funcbox{margin-left: 0;}
    .link_site > ul > li{width: 50%;}

}

@media (max-width: 768px) {
  .visual_note .fix_note .container_wrap {
    margin: 0 16px;
    padding: 14px 16px;
  }
}


/* 🔥 상단 메뉴 세로 구분선 제거 (원인 정확 타격) */
.header .nav > ul > li {
    border-left: none !important;
    border-right: none !important;
}

/* 상단 GNB 메뉴 글자색 - kcua 메인과 동일 */
.header .nav > ul > li > a {
    color: #ffffff !important;
    font-weight: 500;
}

/* =========================
   Sub menu (depth2) KCUA 스타일로 변경
   ========================= */

/* 1) 서브메뉴 펼쳐질 때 깔리는 패널(.blind)을 보라색으로 */
.header .blind{
  background-color: #6b3a8f !important;    /* 기존 흰색(#fff) 덮어쓰기 */
  border-bottom: 0 !important;            /* 기존 하단 라인 제거 */
  opacity: 0.95;                          /* 살짝만 비치게(원하면 1로) */
  height: 260px;                          /* 서브메뉴 높이(필요시 조절) */
}

/* 2) depth2의 배경 이미지(link_menu_bg.png) 제거 + 패널 위에 투명하게 */
.header .nav > ul > li > .depth2{
  background: none !important;            /* 기존 이미지 배경 제거 */
  height: auto !important;
  padding-top: 18px !important;
}

/* 3) 서브메뉴 링크: 흰색 + 가독성 */
.header .nav > ul > li > .depth2 a{
  color: #ffffff !important;
  font-weight: 500;
  font-size: 15px;
  text-decoration: none;
}

/* 4) hover / active 포인트(이미지2 느낌) */
.header .nav > ul > li > .depth2 a:hover{
  color: #ffd65a !important;              /* 연한 골드 포인트 */
}

/* 5) 서브메뉴 항목 간격(이미지2처럼 촘촘하게) */
.header .nav > ul > li > .depth2 > li + li{
  margin-top: 8px !important;             /* 기존 10px에서 살짝 축소 */
}

/* 6) (선택) 컬럼 느낌 살리기 - 1뎁스 영역별 구분선 */
.header .nav > ul > li{
  border-left: 1px solid rgba(255,255,255,0.25) !important;
}
.header .nav > ul > li:first-child{
  border-left: 0 !important;
}