@charset "utf-8";

/* ─── location ─────────────────────────────── */
.location {display: flex; align-items: center; gap: .5rem; margin-bottom: 1rem;}
.location a {display: flex; align-items: center; line-height: 1.5;}
.location em {color: var(--gray-500);}
.location span .ic-dropDown {margin-left: .5rem;}
.icon-slash {width: .5rem; height: .75rem; background: url(/resource/images/icon/icon-slash.svg) no-repeat center center/cover;}
.location li {position: relative; cursor: pointer;}
.location__trigger {cursor: pointer !important;}
/* .location__trigger .ic-dropDown {transition: transform .25s ease; will-change: transform;} */
.location__trigger.is-open .ic-dropDown {transform: rotate(180deg);}
.location__dropdown {display: none; position: absolute; top: calc(100% + .5rem); left: -1rem; padding: .5rem 0; background: var(--white); box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.10); z-index: 200; transition: opacity .25s ease; opacity: 0;}
.location__dropdown.is-open {display: block; opacity: 1;}
.location__dropdown a {display: block; padding: .5rem 1rem; white-space: nowrap; font-size: var(--font-body16-size); transition: background .15s; font-family: var(--font-eulyoo);}

@media screen and (max-width: 500px) {
    .location {gap: .25rem;}
}

/* ─── tag-tab ─────────────────────────────── */
.tag-tab__wrap {margin-bottom: 2.5rem;}
.tag-tab__list {display: flex; flex-wrap: wrap; gap: .5rem;}
.tag-tab__btn {padding: .5rem .75rem; font-size: var(--font-body15-size); line-height: 1.8; font-weight: 500; background-color: var(--white); border: 1px solid var(--gray-400); cursor: pointer;}
.tag-tab__btn {display: inline-flex; align-items: center; transition: background .2s, color .2s, border-color .2s; }
.tag-tab__item.is-active .tag-tab__btn {border-color: var(--primary); background-color: var(--primary); color: var(--white);}
.tag-tab__select-wrap {display: none; position: relative;}
@media (hover: hover) and (pointer: fine) {
    .tag-tab__btn:hover {border-color: var(--gray-900); color: var(--gray-900);}
}
@media screen and (max-width: 800px) {
    .tag-tab__wrap {margin-bottom: 1.5rem;}
    .tag-tab__list {display: none;}
    .tag-tab__select-wrap {display: block;}
}

.board-view__meta {display: flex; align-items: center; gap: 1.5rem;}
.board-date {font-family: var(--font-eulyoo); color: var(--gray-700); font-size: var(--font-body16-size);}
.board-view__press {position: relative; font-size: var(--font-body16-size); color: var(--gray-700);}
.board-view__press::after {position: absolute; left: -0.75rem; top: 50%; transform: translateY(-50%); display: block; content: ""; width: 1px; height: .75rem; background-color: var(--gray-300);}
.board-tag {display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;}
.board-tag__item {padding: .25rem .5rem; font-size: var(--font-body14-size); line-height: 1.8; font-weight: 500; border: 1px solid var(--gray-300); border-radius: 4px; color: var(--gray-700);}

/* ─── 공지사항 board list ─────────────────────────────── */
.board__head {display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 7.5rem;}
.board__head--tight {margin-bottom: 0;}
.board__title {font-size: var(--font-title72-size); font-weight: 600; line-height: 1.3;}
/* .board-list__wrap {margin-bottom: 2.5rem;} */
.board-list__wrap {border-top: 3px solid var(--gray-900);}
.board-list__item {border-bottom: 1px solid var(--gray-300);}
.board-list__link, .board-list__title, .board-list__head i, .board-list__tag li, .board-list__date {transition: .25s ease;}
.board-list__head, .board-list__right, .board-list__tag {display: flex; align-items: center;}
.board-list__head {gap: .75rem; min-width: 0; max-width: 100%;}
.board-list__head-tag, .board-list__head i {flex-shrink: 0;}
.board-list__head-tag {display: block; padding: .125rem 1rem; font-size: var(--font-body18-size); color: var(--white); background-color: var(--primary); border-radius: 4px;}
.board-list__right {gap: 4.125rem; flex-shrink: 0; margin-left: 1rem;}
.board-list__title {min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500;}
.board-list__link {display: flex; justify-content: space-between; align-items: center; padding: 1rem;}
.board-list__tag {gap: .25rem;}
.board-list__tag li {padding: .25rem .5rem; color: var(--gray-800); font-size: var(--font-body14-size); background-color: var(--gray-200); border-radius: 4px; line-height: 1.8; font-weight: 500;}
.board-list__wrap .board-nodata {min-height: 24.375rem;}
@media screen and (min-width: 1025px) {
    .board-list__head .ic-clip {background-color: var(--white);}
    /* .board-list__head i {background-color: var(--gray-900);} */
    .board-list__head .ic-clip, .board-list__tag li {opacity: 0;}
}
@media (hover: hover) and (pointer: fine) and (min-width: 1025px) {
    .board-list__link:hover {background-color: var(--primary);
        .board-list__title, .board-list__date {color: var(--white);}
        .board-list__head .ic-clip, .board-list__tag li {opacity: 1;}
        .board-list__head-tag {background-color: var(--primary-dark);}
    }
}
@media screen and (max-width: 1024px) {
    .board-list__link, .board-list__right {flex-direction: column; align-items: flex-start; gap: .75rem;}
    .board-list__right {margin-left: 0;}
    .board-list__link {padding: 1rem 0;}
    @media (hover: hover) and (pointer: fine) {
        .board-list__link:hover .board-list__title {color: var(--primary);}
    }
}
@media screen and (max-width: 800px) {
    .board-date, .board-view__press {font-size: var(--font-body14-size);}
    .board-tag {gap: .25rem;}
    .board__head {flex-direction: column; align-items: flex-start; gap: 2.5rem; margin-bottom: 2.5rem;}
    .board__head--tight {margin-bottom: 2.375rem;}
    .board__title {font-size: var(--font-display96-size);}
    .board-list__head {gap: .5rem;}
    .board-list__head-tag {padding: .125rem .5rem;}
}

/* ─── 공지사항 board view ─────────────────────────────── */
.board-view {margin: 0 auto; max-width: 1218px;}
.board-view__head {padding-bottom: 2.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid var(--gray-300);}
.board-view__label {font-size: var(--font-cap16-serif-size); font-family: var(--font-eulyoo); line-height: 1.5;}
.board-view__label {display: inline-block; padding-bottom: 1rem; font-weight: 600; color: var(--gray-500); letter-spacing: 0;}
.board-view__title {padding-bottom: 1.5rem; font-size: var(--font-title56-size); font-weight: 500; line-height: 1.3; letter-spacing: 0;}
.board-view__infos {display: flex; justify-content: space-between; position: relative;}
.board-view__info {display: flex; align-items: center; gap: 1.5rem;}
.board-view__cont, .board-gallery__cont-related {padding-bottom: 2.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid var(--gray-300);}
.board-read-file {padding: 1.5rem; margin-bottom: 1.5rem; background-color: var(--gray-50); border-radius: 16px;}
.board-read-file__item + .board-read-file__item {margin-top: .75rem;}
.board-read-file__item a {display: flex; align-items: center; gap: 1rem; font-size: var(--font-body16-size);}
.board-view__cont .board-tag {margin-top: 5rem;}
/* ─── editor ─── */
.ck-content * {margin: 0; padding: 0; color: inherit; line-height: 1.5; -webkit-box-sizing: border-box; box-sizing: border-box;  background: none; border: 0; text-decoration: none; letter-spacing: -0.5px; font-family: var(--font-pretendard) !important;}
.ck-content:has(img) {text-align: center;}
.editor img {display: inline-block; margin-bottom: 2.5rem;}
.ck-content td {border: 1px solid var(--gray-900);}

/* ─── 뉴스레터 view 전용 (.editor--newsletter) ───────────────────
   뉴스레터 테스트 화면(언중위 뉴스레터)에 맞춤. 추후 디자인에 맞게 수정이 들어갈수도 있음. */
.ck-content.editor--newsletter * {margin: 0; padding: 0; background: revert; border: revert;}
.ck-content.editor--newsletter figure.media iframe {border: 0;}
.ck-content.editor--newsletter:has(img) {text-align: revert;}
.ck-content.editor--newsletter .image {margin: 0; clear: inherit;}
.ck-content.editor--newsletter figure.image,
.ck-content.editor--newsletter figure.image img {min-width: 0;}
.ck-content.editor--newsletter figure.table:not(.layout-table) > table {border: 0;}
.ck-content.editor--newsletter .table:not(.layout-table) {margin: 0;}
.ck-content.editor--newsletter.editor--newsletter td,
.ck-content.editor--newsletter.editor--newsletter th {width: auto !important; min-width: 0 !important; border: 0 !important; padding: 0 !important;}

@media screen and (max-width: 800px) {
    .board-view__head, .board-view__cont {padding-bottom: 1.5rem; margin-bottom: 1.5rem;}
    .board-view__title {padding-bottom: 1rem; font-size: var(--font-title72-size); font-weight: 600;}
    .board-view__infos:has(.share-btns) {align-items: flex-end; flex-wrap: wrap; gap: 1rem;}
    .board-view__infos:has(.share-btns) .board-view__info {flex-direction: column; align-items: flex-start;}
    .board-view__cont .board-tag {margin-top: 4rem;}
    .board-view__info, .board-tag {flex-wrap: wrap;}
    .board-read-file {padding: 1rem;}
    .board-view__info {gap: 1rem;}
    .board-tag {gap: .25rem;}
    .board-tag__item {font-size: .75rem;}
    .editor img {margin-bottom: 1.5rem;}
}

/* ─── 재단소식 board gallery list ─────────────────────────────── */
.board-gallery {padding-top: 2.5rem;}
.board-gallery__list {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.5rem 1.5rem;}
.board-gallery__thumbnail {overflow: hidden; aspect-ratio: 3/2;}
.board-gallery__thumbnail img {width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: 0.5s ease;}
.board-gallery__desc {padding-top: 1.5rem;}
.board-gallery__title {overflow: hidden; display: -webkit-box;  -webkit-box-orient: vertical; -webkit-line-clamp: 2; align-self: stretch; text-overflow: ellipsis;}
.board-gallery__desc:has(.board-tag) .board-gallery__title {margin: .5rem 0 1.5rem 0;}

@media (hover: hover) and (pointer: fine) {
    .board-gallery__link:hover .board-gallery__thumbnail img {transform: scale(1.1);}
}

@media screen and (max-width: 1280px) {
    .board-gallery__list {grid-template-columns: repeat(3, minmax(0, 1fr));}
}
@media screen and (max-width: 1024px) {
    .board-gallery__list {grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media screen and (max-width: 800px) {
    .board-gallery__list {grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 2.5rem;}
    .board-gallery__list:has(.board-tag) {gap: 2rem;}
    .board-gallery__desc {padding-top: 1rem;}
    .board-gallery__desc:has(.board-tag) .board-gallery__title {margin: .25rem 0 1rem 0;}
}

/* ─── 재단소식 board gallery view ─────────────────────────────── */
.share-btns {display: flex; align-items: center; gap: .5rem;}
.share-btns__item {position: relative;}
.share-btns__item--ai {position: static;}
.share-btns__item--ai .share-btns__btn {padding: .25rem .75rem; border-radius: 16.5px; border: 1px solid var(--primary); }
.share-btns__item--ai span {font-size: var(--font-body14-size); color: var(--primary); font-weight: 600; line-height: 1.8;}
.share-btns__item--link-copy .share-btns__btn, .share-btns__item--share .share-btns__btn {display: flex; align-items: center; justify-content: center; width: 2.0625rem; height: 2.0625rem; border: 1px solid var(--gray-400); border-radius: 50%;}
.share-btns__panel {position: absolute; display: none; left: 0; right: 0; top: calc(100% + 1rem); width: auto; z-index: 100;}
.share-btns__item--ai.is-open .share-btns__panel {display: block;}
.share-btns__item--ai.is-open .share-btns__btn {background-color: var(--primary);}
.share-btns__item--ai.is-open span {color: var(--white);}

.share-btns__item--ai .share-btns__panel {padding: 1.5rem; border: 2px solid var(--primary); background-color: var(--white); box-shadow: 8px 0 20px 0 rgba(27, 221, 255, 0.30), -8px 0 20px 0 rgba(34, 30, 244, 0.30); border-radius: 16px;}
.share-btns__panel-head {display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem;}
.share-btns__panel-title {font-size: var(--font-body18-size); font-weight: 500; color: #222; line-height: 1.5; letter-spacing: -1px;}
.share-btns__panel-body, .share-btns__panel-notice {font-size: var(--font-body15-size); line-height: 1.8;}
.share-btns__panel-body {margin-bottom: 1rem;}
.share-btns__panel-notice {color: var(--gray-700);}

.board-gallery__cont-related .board-gallery__list {grid-template-columns: repeat(3, minmax(0, 1fr));}
.board-gallery__cont-related > p {padding-bottom: 1.125rem;}

@media screen and (max-width: 800px) {
    .board-gallery__cont-related .board-gallery__list {grid-template-columns: repeat(1, minmax(0, 1fr));}
}

/* ─── share panel ─────────────────────────────── */
.share-btns__item--share .share-btns__panel {left: auto; right: 0; width: 25.625rem; padding: 1.5rem; background: var(--white); border: 1px solid var(--gray-300); border-radius: 12px; box-shadow: 0 0 20px 0 rgba(18, 18, 18, 0.08);}
.share-btns__item--share.is-open .share-btns__panel {display: block;}
.share-btns__item--share.is-open .share-btns__btn {background-color: var(--gray-900); border-color: var(--gray-900);}
.share-btns__item--share.is-open .share-btns__btn i {background-color: var(--white);}
.share-panel__head {display: flex; align-items: center; justify-content: flex-start; position: relative; margin-bottom: 1rem;}
.share-panel__title {font-size: var(--font-body18-size); font-weight: 600; color: var(--gray-900); letter-spacing: -0.5px;}
.share-panel__close {position: absolute; right: -0.5rem; top: -0.5rem; display: flex; align-items: center; justify-content: center;}
.share-panel__list {display: flex; align-items: center; justify-content: space-between; gap: 1rem;}
.share-panel__item {display: flex; flex-direction: column; align-items: center; gap: .5rem;}
.share-panel__btn {display: flex; flex-direction: column; align-items: center; gap: .25rem;}
.share-panel__icon {display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; overflow: hidden;}
.share-panel__icon img {width: 100%; height: 100%; object-fit: cover;}
.share-panel__label {font-size: var(--font-body14-size); color: var(--gray-700); white-space: nowrap; line-height: 1.8;}

@media screen and (max-width: 800px) {
    .share-btns__item--share .share-btns__panel {padding: 1.5rem 1rem; width: 22.375rem;}
    .share-panel__list {justify-content: center;}
}

/* ─── 보도자료 board press list ─────────────────────────────── */
.press-list__item {border-bottom: 1px solid var(--gray-300);}
.press-list__link {display: flex; gap: 7.5rem; padding: 1rem;}
.press-list__content {display: flex; flex-direction: column; justify-content: space-between; padding: 1rem 0;}
.press-list__head {display: flex; align-items: baseline; gap: .75rem; margin-bottom: .5rem;}
.press-list__head i {flex-shrink: 0;}
.press-list__desc {line-height: 1.5;}
.press-list__title {overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;
-webkit-line-clamp: 2; text-overflow: ellipsis; transition: .3s ease;}
.press-list__desc {display: block; font-size: var(--font-body18-size);}
.press-list__text .board-tag {margin-top: 1.5rem;}
.press-list__meta, .press-list__source {display: flex; gap: .75rem; align-items: center;}
.press-list__meta {margin-top: 5.25rem;}
.press-list__source {font-size: var(--font-body16-size); color: var(--gray-700); line-height: 1.5;}
.press-list__source::before {display: block; content: ""; width: 1px; height: .75rem; background-color: var(--gray-300);}
.press-list__thumb {overflow: hidden; flex-shrink: 0; aspect-ratio: 3 / 2; width: clamp(160px, 40%, 442px);}
.press-list__thumb img {width: 100%; height: 100%; object-fit: cover;}
@media (hover: hover) and (pointer: fine) {
    .press-list__link:hover .press-list__title {color: var(--primary);}
}
@media screen and (max-width:1280px) {
    .press-list__link {gap: 4.5rem;}
    .press-list__content {gap: 1rem;}
}
@media screen and (max-width:1024px) {
    .press-list__link {gap: 1.5rem;}
}
@media screen and (max-width: 800px) {
    .press-list__link, .press-list__content {flex-direction: column-reverse;}
    .press-list__link {gap: 1rem; padding: 1.5rem .5rem;}
    .press-list__content {gap: 0; padding: 0;}
    .press-list__meta, .press-list__source {gap: .5rem;}
    .press-list__meta {margin-top: 0; padding-bottom: .25rem;}
    .press-list__source {font-size: var(--font-body14-size);}
    .press-list__thumb {width: 100%;}
}

/* ─── 공시자료 board disclosure list ─────────────────────────────── */
.disclosure-list__link {position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: 2rem; min-height: 18.4375rem; background-color: var(--white); transition: background-color 0.3s ease; border: 1px solid var(--gray-300);}
.disclosure-list__corner {position: absolute; top: -2px; right: -2px; width: 3rem; height: 3rem; pointer-events: none;}
.disclosure-list__head {width: 100%;}
.disclosure-list__title {padding-top: 1.5rem; overflow-wrap: break-word;}
@media (hover: hover) and (pointer: fine) {
    .disclosure-list__link:hover {background-color: var(--gray-50);}
}
@media screen and (max-width: 800px) {
    .disclosure-list__link {min-height: 14.75rem; padding: 1.5rem;}
}

/* ─── board pagination ─────────────────────────────── */
.view-paging_wrap {display: grid; grid-template-columns: 1fr auto 1fr; gap: 5rem; align-items: center;}
.view-paging_btn { display: flex; flex-direction: column; gap: .6563rem; max-width: 30.1875rem; width: 100%;}
.view-paging_label {display: inline-flex; align-items: center; gap: .5rem; font-size: var(--font-body16-size); color: var(--gray-600); font-weight: 600;}
.view-paging_wrap > .btn {grid-column: 2;}
.view-paging_btn--next {align-items: flex-end; text-align: right; grid-column: 3; justify-self: end;}
.view-paging_btn--prev {align-items: flex-start; text-align: left; grid-column: 1; justify-self: start;}
.view-paging_title {overflow: hidden; max-width: 30.1875rem; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-line-clamp: 1; align-self: stretch;  text-overflow: ellipsis; font-size: var(--font-body18-size); line-height: 1.5;}

@media screen and (max-width: 800px) {
    .view-paging_label {font-size: var(--font-body14-size);}
    .view-paging_title {display: none;}
}

/* 개인정보처리방침  */
.ck-content.policy__list h2,
.ck-content.policy__list h3,
.ck-content.policy__list h4 {font-size: var(--font-body18-size); font-weight: 600; margin: 1rem 0 0;}
/* 표: 세로줄 없이 가로줄만, 헤더 gray-100·가운데정렬, 셀 gray-900, 패딩 16px.
   CKEditor 기본 CSS(main.ts 주입)가 :is()로 명시도를 높게 잡아 !important로만 덮인다. */
.ck-content.policy__list .table table {border: 0 !important; border-top: 1px solid var(--gray-300) !important;}
.ck-content.policy__list .table table th,
.ck-content.policy__list .table table td {border: 0 !important; border-bottom: 1px solid var(--gray-300) !important; padding: 1rem !important;}
/* 셀 글자 gray-900 — 안쪽 <strong> 등이 `.ck-content *`(gray-700)에 눌리므로 하위까지 강제 */
.ck-content.policy__list .table table th,
.ck-content.policy__list .table table th *,
.ck-content.policy__list .table table td,
.ck-content.policy__list .table table td * {color: var(--gray-900) !important;}
/* 헤더성 셀(th + strong 감싼 td) — gray-100 배경 + 가운데정렬 */
.ck-content.policy__list .table table th,
.ck-content.policy__list .table table td:has(strong) {background: var(--gray-100) !important; text-align: center !important;}
/* 데이터 셀 가운데정렬 — 여러 줄 긴 내용 셀(<br> 포함)은 좌측 유지 */
.ck-content.policy__list .table table td:not(:has(strong)):not(:has(br)) {text-align: center !important;}
/* 헤더 글자 600 — 안쪽 <strong> 등이 `.ck-content *`에 눌리므로 헤더 셀 하위까지 강제 */
.ck-content.policy__list .table table th,
.ck-content.policy__list .table table th *,
.ck-content.policy__list .table table td:has(strong),
.ck-content.policy__list .table table td:has(strong) * {font-weight: 600 !important;}
/* 표3(내용 열에 여러 줄 <br> 존재) 전용 — 내용 열은 좌측정렬, 라벨 열(1번째 칸)은 넓게 */
.ck-content.policy__list .table:has(br) table td:not(:has(strong)):nth-child(2) {text-align: left !important;}
.ck-content.policy__list .table:has(br) table td:first-child {width: 30% !important;}
.ck-content.policy__list p {margin: 0;}
/* 링크: 시안의 브랜드 컬러 파란색 — 개별 <a>에 클래스를 달지 않고 본문 링크 전체에 적용.
   밑줄은 위 `.ck-content a`가 이미 준다. (권리침해 구제방법의 URL·이메일 링크 등) */
.ck-content.policy__list a {color: var(--primary);}
/* 글머리(dot) 목록: 자동수집 정보처럼 시안에 점이 붙는 줄은 편집기 '목록' 버튼으로 <ul><li>로 만든다.
   불릿 자체는 ck-content.css의 `.ck-content ul`(disc)이 그리고, 여기선 시안에 맞춰 들여쓰기·간격만 좁힌다. */
.ck-content.policy__list ul {padding-left: 1.2em; margin: 0.25rem 0;}
.ck-content.policy__list li {margin: 0.15rem 0;}
.ck-content.policy__list li::marker {color: var(--gray-700);}

/* 이용약관(TERMS) 전용 — 개인정보처리방침과 `.policy__list`를 공유하므로 다른 부분만 여기서 가른다.
   시안: 장(章) 제목 [제 X 장 …]은 굵고 진하게, 조(條) 제목 제 X조(…)는 앞에 dot.
   컨테이너에 policy__list--terms가 붙는 조건은 PolicyPage.vue(contentClass) 참고. */
/* 장 제목(h2): 조 제목보다 굵고 진하게 + 장 사이 여백 (첫 장은 위 여백 제거) */
.ck-content.policy__list--terms h2 {font-weight: 600; color: var(--gray-700);;}
.ck-content.policy__list--terms h2:first-child {margin-top: 0; margin-bottom: 0;}
/* 조 제목(h3): 앞에 dot(가상요소) + 진한 색 + 조 사이 여백. 텍스트는 dot만큼 들여쓴다 */
.ck-content.policy__list--terms h3 {position: relative; padding-left: 0.9375rem; color: var(--gray-700); margin: 1rem 0 0.5rem;}
.ck-content.policy__list--terms h3::before {content: ''; position: absolute; left: 0; top: 0.62em; width: 0.3125rem; height: 0.3125rem; border-radius: 50%; background-color: var(--gray-700);}
/* 부칙 시행일 문단(맨 끝 문단): 시안대로 세미볼드 강조 */
.ck-content.policy__list--terms > p:last-child {font-weight: 600;}