@charset "UTF-8";
@import url("/font/RemixIcon_Fonts_v4.6.0/remixicon.css");

#wrap ::-webkit-scrollbar { width: 8px; }
#wrap ::-webkit-scrollbar-thumb { background-color: #295581; border-radius:10px; }
#wrap ::-webkit-scrollbar-track { background-color: #CFD9E3; border-radius:10px; }

:root {
  --event-color1: #00969F;
  --event-color2: #4B60F7;
  --event-color3: #666666;
  --event-color4: #009D5A;
  --event-color5: #F70350;
  --event-color6 : #007CFF;
}

/* 총장일정 : 기본 캘린더 스타일 */
.cld_wrap {position: relative; display: flex; justify-content: space-between; font-family:'NotoSans'; border-top: 2px solid #ddd; padding-top: 40px;}
.cld_left {width: 55.75%;}
.cld_right {width: 42%; padding-left: 40px; border-left: 1px solid #ddd;}

.cld_tit_wrap {display: flex; align-items: center; justify-content: space-between; margin-bottom: 34px;}
.cld_tit_wrap a {display: inline-block; width:28px; height: 28px; line-height: 25px; text-align: center; border-radius: 50%; border: 1px solid #ccc; font-size: 18px;}
.cld_tit_wrap .cld_tit {font-size: 24px; font-weight: 700; color: #1d1d1d; font-family: 'SCDream';}

.cld_tbl table {border-top: 1px solid #BFC4CF; border-bottom: 1px solid #BFC4CF;}
.cld_tbl thead th {border-bottom: 2px solid #BFC4CF; padding: 8px 0; font-weight: 600; font-size: 16px; color: #1F1E23;}
.cld_tbl tbody td {border-top: 1px solid #EAEAEA;}
.cld_tbl tbody tr:first-child td {border-top: none;}
.cld_tbl tbody td .cld_td {display: flex; align-items: center; flex-direction: column; justify-content: start; width: 100%; height: 120px;}
.cld_tbl tbody td strong {width: 48px; height: 48px; line-height: 48px; border-radius: 50%; font-weight: 500; text-align: center; margin: 13px 0;}
.cld_tbl tbody td strong.event {background: #E5F5FB; border: 1px solid #C6EFFF;}
.cld_tbl tbody td strong.today {background: #C6EFFF;}
.cld_tbl .sun {color: #EA4B60;}
.cld_tbl .sat {color: #427CF8;}
.cld_tbl .gray {opacity: 0.2;}
.cld_wrap .cld_circle_wrap {display: flex; flex-wrap: wrap; gap: 2px; width: fit-content; max-width: 43px;}
.cld_wrap .cld_circle {display: inline-block; width: 7px; height: 7px; border-radius: 50%;}
.cld_wrap .cld_circle.color1 {background: var(--event-color1);}
.cld_wrap .cld_circle.color2 {background: var(--event-color2);}
.cld_wrap .cld_circle.color3 {background: var(--event-color3);}
.cld_wrap .cld_circle.color4 {background: var(--event-color4);}
.cld_wrap .cld_circle.color5 {background: var(--event-color5);}
.cld_wrap .cld_circle.color6 {background: var(--event-color6);}

.cld_notes {display: flex; gap: 16px; width: fit-content; align-items: center; height: 36px; border-radius: 18px; padding: 0 20px; border: 1px solid #ddd; margin-top: 20px; font-size: 14px; color: #222;}
.cld_notes dt {font-weight: 600;}
.cld_notes dd ul {display: flex; gap: 16px;}
.cld_notes dd li {display: flex; align-items: center; gap: 4px;}

.cld-tabs {width: 100%;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) {display: flex; width: 100%; max-width: 280px; height: 44px; border-radius: 8px; background: #F2F3F6; border: 1px solid #ececec;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li {position: relative; width: 50%; height: 100%; z-index: 1;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li::before {content: ''; position: absolute; top: -1px; right: -1px; bottom: -1px; left: -1px; width: auto; height: auto; border-radius: 8px; background: #009EDB; z-index: -1; opacity: 0; transition: all 0.15s;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li:hover {color: #009EDB;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li.active::before {opacity: 1;}
[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li a {position: relative; display: block; line-height: 42px; text-align: center; font-size: 16px; font-weight: 600; color: #1d1d1d; transition: all 0.15s;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li a::before {transition: all 0.15s;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li a:hover,
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li a:focus {color: #009EDB;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li.active a {color: #fff;}
ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li.active a::before {content: '\EB80'; font-family: 'remixicon'; display: inline-block; margin-right: 5px; font-size: 20px; font-weight: 400}
#cld-tabs-content {margin-top: 25px;}
.cld_event_wrap {height: 715px; overflow-y: auto; padding-right: 20px;}
.cld_event_wrap li ~ li {margin-top: 40px;}
.cld_event_wrap dt {font-family: 'SCDream'; font-size: 18px; font-weight: 700; color:#1d1d1d; margin-bottom: 10px;}
.cld_event_wrap dd div ~ div {margin-top: 8px;}
.cld_event_box {display: flex; align-items: center; flex-wrap: wrap; gap: 7px 16px; padding: 9px 16px; border-radius: 8px; border: 1px solid #ddd; font-size: 16px; color: #222;}
.cld_event_box .index {display: inline-block; width: 50px; text-align: center; line-height: 22px; border-radius: 4px; color:#fff; font-size: 14px; font-weight: 500;}
.cld_event_box .index.color1 {background: var(--event-color1);}
.cld_event_box .index.color2 {background: var(--event-color2);}
.cld_event_box .index.color3 {background: var(--event-color3);}
.cld_event_box .index.color4 {background: var(--event-color4);}
.cld_event_box .index.color5 {background: var(--event-color5);}
.cld_event_box .index.color6 {background: var(--event-color6);}
.cld_event_box .tit {font-size: 15px; font-weight: 700; font-family: 'SCDream';}
.cld_event_box .txt {display: flex; flex-wrap: wrap; gap: 3px 16px; line-height: 24px;}
.cld_event_box .txt em {color: #666;}


/* GNU 캘린더 */
.cld_left2 {width: 30.75%;}
.cld_right2 {width: 67%;}

.cld-tabs2 {margin-top:20px; padding: 30px; border-radius: 12px; background: #E5F5FB; border: 1px solid #C6EFFF;}
#cld-tabs-nav2 {display: flex; flex-wrap: wrap; gap: 10px 16px;}
#cld-tabs-nav2 li {width: calc(50% - 8px);}
#cld-tabs-nav2 li a {display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 50px; padding: 0 7px; background: #fff; border: 1px solid #ccc; border-radius: 8px; font-family: 'SCDream'; font-size: 18px; font-weight: 600; color: #222; line-height: 1.2; transition: all 0.15s;}
#cld-tabs-nav2 li a i {font-size: 22px; color: #999; font-weight: 400; transition: all 0.15s;}
#cld-tabs-nav2 li a:hover,
#cld-tabs-nav2 li a:focus,
#cld-tabs-nav2 li a:hover i,
#cld-tabs-nav2 li a:focus i {color: #0073DB;}
 #cld-tabs-nav2 li.active a {background: #0073DB; border-color: #0073DB; color: #fff;}
 #cld-tabs-nav2 li.active a i {color: #fff;}

.cld_tbl tbody td .cld_td2 {height: 68px;}
.cld_tbl tbody td .cld_td2 strong {width: 30px; height: 30px; line-height: 28px; font-size: 15px; margin: 6px 0;}
.cld_wrap .cld_td2 .cld_circle_wrap {max-width: 33px;}
.cld_wrap .cld_td2 .cld_circle {width: 5px; height: 5px;}

.cld_event_wrap {height: 435px;}
.cld_culture_wrap {height: 706px;}

.cld_culture_wrap {margin-top: 40px; padding-bottom: 35px; border-bottom: 1px solid #C8D1DB; margin-bottom: 20px; overflow-y: auto;}
.cld_culture_wrap ul {display: flex; flex-wrap: wrap; gap: 24px 30px;}
.cld_culture_wrap li {width: calc(33.3% - (calc(30px * 2 / 3))); border: 1px solid #C8D1DB;}
.cld_culture_wrap li a {display: block; color: #222;}
.cld_culture_wrap li a .img {position: relative; display: flex; align-items: start; justify-content: center; width: 100%; height: 200px; overflow: hidden; background: #eee;}
.cld_culture_wrap li a .img > span {position:absolute;top: 50%;left:50%;transform: translate(-50%, -50%);display:block;width: 100%;height:100%;background-size: cover;background-position:top;background-repeat:no-repeat;z-index:1; transition:transform 0.3s;}
.cld_culture_wrap li a .cont {padding: 15px 15px 22px;}
.cld_culture_wrap li a .tit {font-family: 'SCDream'; font-size: 18px; font-weight: 500; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.cld_culture_wrap li a .date {display: block; font-family: 'Sora'; font-size: 12px; font-weight: 700; color: #888; margin: 5px 0 2px;}
.cld_culture_wrap li a .place {font-size: 14px;}
.cld_culture_wrap li a:hover .img > span,
.cld_culture_wrap li a:focus .img > span {transform:  translate(-50%, -50%) scale(1.1);}
.cld_culture_wrap li.no_data {width: 100%; text-align: center; border:none; background: #f5f5f5; line-height: 16rem;} /* 데이터 없을 시 */


/* responsive */
@media (max-width:1200px){
  /* 총장일정 : 기본 캘린더 스타일 */
  .cld_right {padding-left: 30px;}

  .cld_event_wrap {padding-right: 15px;}

  /* GNU 캘린더 */
  .cld_left2 {width: 300px;}
  .cld_right2 {width: calc(100% - 325px);}

  .cld-tabs2 {padding: 20px;}
  #cld-tabs-nav2 {gap: 8px 10px;}
  #cld-tabs-nav2 li {width: calc(50% - 5px);}
  #cld-tabs-nav2 li a {gap: 5px; font-size: 16px;}
  #cld-tabs-nav2 li a i {font-size: 20px;}
}

@media (max-width:1200px) and (min-width:951px) {
  .cld_culture_wrap li {width: calc(50% - 15px);}
}

@media (max-width:950px){
  /* 총장일정 : 기본 캘린더 스타일 */
  .cld_wrap {flex-direction: column; justify-content: space-between; padding-top: 40px;}
  .cld_left {width: 100%;}
  .cld_right {width: 100%; padding-left: 0; padding-top:30px; margin-top: 30px; border-left: none; border-top: 1px solid #ddd;}

  .cld_tit_wrap {margin-bottom: 20px;}

  .cld_tbl tbody td .cld_td {height: 90px;}
  .cld_tbl tbody td strong {width: 38px; height: 38px; line-height: 40px; margin: 10px 0;}

  .cld_event_wrap {height: 253px;}

  /* GNU 캘린더 */
  .cld_left2 {width: 100%;}
  .cld_right2 {width: 100%;}

  .cld_tbl tbody td .cld_td2 {height: 63px;}
  .cld_tbl tbody td .cld_td2 strong {margin: 5px 0;}

  .cld_culture_wrap {margin-top: 25px;}
}

@media (max-width:768px) {
  .cld_culture_wrap li {width: calc(50% - 15px);}
}

@media (max-width:480px){
  /* 총장일정 : 기본 캘린더 스타일 */
  .cld_right {padding-top:20px; margin-top: 30px;}

  .cld_tit_wrap .cld_tit {font-size: 20px;}

  .cld_tbl thead th {padding: 6px 0; font-size: 15px;}
  .cld_tbl tbody td .cld_td {height: 75px;}
  .cld_tbl tbody td strong {width: 30px; height: 30px; line-height: 30px; margin: 5px 0; font-size: 15px;}
  .cld_wrap .cld_circle_wrap {max-width: 25px;}

  .cld_notes {margin-top: 15px; height: 32px;}

  .cld_event_wrap {height: 350px;}
  ul[id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) {height: 38px;}
  [id ^="cld-tabs-nav"]:not(#cld-tabs-nav2) li a {line-height: 36px; font-size: 15px;}
  ul[id ^="cld-tabs-nav"] li.active a::before {font-size: 18px;}
  #cld-tabs-content {margin-top: 15px;}
  .cld_event_wrap {padding-right: 10px;}
  .cld_event_wrap li ~ li {margin-top: 20px;}
  .cld_event_wrap dt {font-size: 16px; margin-bottom: 7px;}
  .cld_event_box {font-size: 15px;}

  /* GNU 캘린더 */
  .cld_tbl tbody td .cld_td2 {height: 68px;}
  .cld_wrap .cld_td2 .cld_circle_wrap {max-width: 19px;}
  
  .cld-tabs2 {padding: 15px;}
  #cld-tabs-nav2 li a {height: 40px;}

  .cld_culture_wrap {margin-top: 15px; padding-bottom: 20px;}
  .cld_culture_wrap ul {gap: 15px;}
  .cld_culture_wrap li {width: 100%;}
  .cld_culture_wrap li a .img {height: 150px;}
  .cld_culture_wrap li a .cont {padding: 15px 15px 20px;}
  .cld_culture_wrap li a .tit {font-size: 16px;}
}

@media (max-width:340px){    
  /* GNU 캘린더 */
  #cld-tabs-nav2 li a i {display: none;}
}