
@charset "utf-8";
/* Common */
.small-tit {font-size: var(--font-size-28); font-weight: 800; line-height: 1.3333em;}
.sec-tit {font-size: var(--font-size-36); line-height: 1.4444em; font-weight: 800;}
.large-tit {font-size: var(--font-size-48); line-height: 1.3333em;}
.large-tit small {display: block;}
.sec.wide {max-width: 1820px; margin-left: auto; margin-right: auto; border-radius: var(--radius-24);}
.hyphen-list > li {text-indent: -.8em; padding-left: .8em;}
.hyphen-list > li:before {content: '-'; margin-right: 5px;}

/* 기관소개 > 기관소개 */
.zigzag-item {display: flex; gap: 20px;}
.zigzag-item:nth-child(even) {flex-direction: row-reverse;}
.zigzag-item:not(:last-child) {margin-bottom: var(--space-60);}
.zigzag-item .img {flex: 1;}
.zigzag-item .txt {display: flex; flex-direction: column; justify-content: center; width: 50%; padding-left: var(--space-90); font-size: var(--font-size-20); line-height: 1.7em;}
.zigzag-item:nth-child(even) .txt {padding-left: 0; padding-right: var(--space-90); text-align: right;}
.zigzag-item .icon {margin-bottom: var(--space-35);}
.zigzag-item h3 {margin-bottom: var(--space-40);}

.sec-about-help, .sec-about-culture {margin-bottom: 50px; background: url('/images/sub/bg-about-help.jpg') no-repeat center center / cover; border-radius: var(--radius-24); overflow: hidden;}
.about-help-boxes {display: flex; gap: var(--space-70); flex-wrap: wrap;}
.about-help-box {width: calc((100% - var(--space-70)) / 2); height: fit-content; padding: var(--space-45) var(--space-40); border-radius: var(--radius-24); background: rgba(255, 255, 255, 0.15); backdrop-filter: blur(20px);}
.about-help-box:nth-child(2n) {margin-top: 40%; margin-bottom: -40%;}
.about-help-box h3 {margin: var(--space-25) 0 clamp(15px, calc(110 / var(--inner) * 100vw), 110px); font-weight: 800; font-size: var(--font-size-32); line-height: 1.3em;}

.sec-about-terms {background: #f8f8f8;}
.about-terms-cnt {display: flex; gap: 40px; padding-top: var(--space-50); border-top: 2px solid var(--dark-color);}
.about-terms-cnt h3 {width: 25.71428%; font-size: var(--font-size-28); font-weight: 800; color: var(--dark-color);}
.about-terms-cnt .wrap {flex: 1;}
.group-about-terms {padding: var(--space-45) var(--space-40); background: #fff; border-radius: var(--radius-24);}
.group-about-terms:not(:last-child) {margin-bottom: 10px;;}
.group-about-terms h4 {margin-bottom: var(--space-20); font-size: var(--font-size-18); color: var(--primary-color);}
.group-about-terms ol {margin-top: var(--space-35);}
.group-about-terms li:not(:last-child) {margin-bottom: 8px;}
.group-about-terms li {display: flex; color: var(--dark-color); font-weight: 700;}
.group-about-terms li span {min-width: 35px; color: var(--gray-color);}

.sec-about-flow {font-size: var(--font-size-20); line-height: 1.7em;}
.about-flow-cnt {margin: var(--space-70) 0;}
.about-flow-cnt .slick-list {overflow: visible;}
.about-flow-txt {font-family: 'GmarketSans'; color: #f8f8f8; font-size: 140px; font-weight: 700; line-height: 1em; width: max-content !important;}
.sec-about-flow .desc {width: 50%; margin-left: auto;}

.sec-about-culture {background-image: url('/images/sub/bg-about-culture.jpg'); background-position: top right;}
.flex-boxes {display: flex; gap: 20px; flex-wrap: wrap;}
.flex-box {width: calc((100% - 40px) / 3); padding: var(--space-40); border-radius: var(--radius-16); background: #fff;}
.flex-box.long {width: calc((100% - 20px) / 2);}
.type2 .flex-box {background: #f8f8f8;}
.flex-box .num, .type3 .oversea-process-item .num, .type4 .oversea-process-item .num, .type2 .parallele-box .num, .guide-change-item .num {display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: var(--primary-color); color: #fff; font-size: var(--font-size-16); font-weight: 700;}
.type2 .flex-box .num {display: block; margin-bottom: var(--space-15); width: auto; height: auto; background: transparent; color: #ccc; font-size: var(--font-size-24); font-weight: 800;}
.flex-box .num, .flex-box .icon {margin-bottom: var(--space-45);}
.flex-box h3 {margin-bottom: var(--space-30); font-size: var(--font-size-24); font-weight: 800; color: var(--dark-color); line-height: 1.4167em;}
[lang="en"] .flex-box h3 {font-size: var(--font-size-22);}
.flex-box h3 span {display: inline-block;}
.flex-box h3 small {display: block; margin-top: var(--space-15); font-size: var(--font-size-16); font-weight: 500; color: var(--primary-color); line-height: 1.2em;}
.type3 .flex-box {color: #a8a8a8; font-size: var(--font-size-16);}
.type3 .flex-box h3 {margin-bottom: 7px;}
.type4 .flex-box {width: calc((100% - 60px) / 4); color: #a8a8a8;}
.type5 .flex-box {border: 1px solid #eee;}


.sec-about-visions {font-size: var(--font-size-20); line-height: 1.7em;}
.sec-about-visions h3 {margin-bottom: var(--space-30);}
.about-global-banner {margin-bottom: 10px; padding: clamp(40px, calc(95 / var(--inner) * 100vw), 95px) 0; border-radius: var(--radius-24); background: url('/images/sub/bg-about-global.jpg') no-repeat right center / cover;}
.about-global-map {position: relative; margin-bottom: var(--space-100); overflow: hidden; border-radius: var(--radius-24); border: 1px solid #eee;}
.about-global-map .global-map-markers img {z-index :2; position: absolute; top: 1px; left: 1px; bottom: 1px; right: 1px;}
.about-global-map .wave {position: absolute; top: 1px; left: 1px; right: 1px; bottom: 1px;}
.about-global-map .wave span {position: absolute; display: block; width: 3.3%; text-indent: -99999em; font-size: 0;}
.about-global-map .wave span:before {content: ''; animation: wave 3s linear infinite; display: block; width: 100%; padding-bottom: 100%;  border-radius: 100%; background: rgba(0,0,0,.03); transform: translate(-50%, -50%); overflow: hidden;}
.about-global-map .wave span:nth-child(1) {top: 63%; left: 15%;}
.about-global-map .wave span:nth-child(2) {top: 22%; left: 55%;}
.about-global-map .wave span:nth-child(3) {top: 58%; left: 52.6%;}
.about-global-map .wave span:nth-child(4) {top: 46%; left: 81.5%;}
.about-global-map .wave span:nth-child(2):before {animation-delay: .2s;}
.about-global-map .wave span:nth-child(3):before {animation-delay: .5s;}
.about-global-map .wave span:nth-child(4):before {animation-delay: .7s;}

.about-global-countries .contain {display: flex; flex-wrap: wrap; border-top: 2px solid var(--dark-color);}
.global-countries-item {width: 50%; padding: var(--space-50) var(--space-40); border-bottom: 1px solid #eee;}
.global-countries-item .tag {width: fit-content; margin-bottom: var(--space-25); font-size: var(--font-size-16); font-weight: 700; padding: 2px 20px; border-radius: 34px; background: var(--primary-color); color: #fff;}
.global-countries-item h3 {margin-bottom: var(--space-30);}

@keyframes wave {
    0% {transform: translate(-50%, -50%) scale(1);}
    90% {opacity: 1;}
    100% {transform: translate(-50%, -50%) scale(12); opacity: 0;}
}

.group-introduction {
    margin-top: -6.1111111111rem;
}

.group-introduction .__grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: min(3.90625vw, 5.5555555556rem);
}

.group-introduction .__grid .__img.mid {
    grid-column: span 3;
    grid-row: span 1;
    position: static;
    z-index: 1;
}

.about-video-txt {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 1; width: 100%;}
.small-img {position: relative; max-width: 216px; margin: 0 auto; border-radius: clamp(22px, 3.90625vw, 2.2222222222rem);overflow: hidden;isolation: isolate;}
.mid .small-img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
.mid .small-img:after {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; background: #fff; opacity: var(--after-opacity, 0.82);}
.mid .small-img .wrap {position: relative; width: 100%; padding-bottom: 138.8889%;}
.mid .small-img .wrap img {position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.large-img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1400px; max-width: 100%; z-index: 2; opacity: 0;}
.large-img .video-container {border-radius: clamp(22px, 3.90625vw, 2.2222222222rem);}

.group-introduction .__grid .__img {

    position: relative;
}

.group-introduction .__grid .__img img {
    border-radius: clamp(22px, 3.90625vw, 2.2222222222rem);
    display: block;
    width: 100%;
    aspect-ratio: 216/300;
    object-fit: cover;
    will-change: width, height, border-radius, transform, opacity;
}


.sec-about-shortcut .contain {position: relative; display: flex; gap: 20px; z-index: 3;}
.about-shortcut {flex: 1; display: flex; align-items: center; gap: var(--space-40); background: #f8f8f8; border-radius: var(--radius-24); padding: var(--space-40);}
.about-shortcut .icon {display: flex; align-items: center; justify-content: center; width: 160px; height: 160px; padding: var(--space-50); border-radius: 100%; background: #fff;}
.about-shortcut h3 {margin-bottom: var(--space-15); font-size: var(--font-size-28); font-weight: 800; color: var(--dark-color);}
.about-shortcut p {margin-bottom: var(--space-25);}

/* 기관소개 > 인사말 */
.greeting-head {margin-bottom: var(--space-90); font-size: var(--font-size-24); font-weight: 500; color: var(--dark-color);}
.greeting-head h2 {display: flex; align-items: center;margin-bottom: var(--space-30); font-size: var(--font-size-56); font-weight: 800; color: var(--dark-color); line-height: 1.2em;}
.greeting-head .divider {display: inline-block; width: 120px; height: 8px; margin: 0 30px; background: var(--dark-color);}
.greeting-flex {gap: 35px; margin-bottom: var(--space-100); font-size: var(--font-size-20); line-height: 1.7em;}
[lang="en"] .greeting-flex {font-size: var(--font-size-18);}
.greeting-flex h3 {margin-bottom: var(--space-40);}
.greeting-flex .img {width: 30%;}
.greeting-bot .desc {margin-bottom: var(--space-60); font-size: var(--font-size-24); line-height: 1.6667em; font-weight: 600; color: var(--dark-color);}
.greeting-position {margin-bottom: var(--space-15); font-weight: 800; color: var(--primary-color);}

/* 기관소개 > 연혁 : /css/history.css */
/* 기관소개 > 조직도 */
.org-info-box {padding: var(--space-70) var(--space-40); margin-bottom: var(--space-100); border-radius: var(--radius-24); background: #f8f8f8;}
.org-info-box h3 {margin: var(--space-20) 0; font-size: var(--font-size-24); font-weight: 800; color: var(--primary-color);}
[lang="en"] .org-info-box h3 {font-size: var(--font-size-22);}
.org-list-group:not(:last-child) {margin-bottom: clamp(40px, calc(50 / var(--inner) * 100vw), 50px);}
.org-list-group h3 {display: flex; align-items: center; margin-bottom: 20px;; font-size: var(--font-size-18); font-weight: 700; color: var(--dark-color);}
.org-list-group h3:before {content:''; display: block; width: 8px; height: 8px; margin-right: 10px; background: var(--primary-color); border-radius: 100%;}
.org-list-group ul {display: flex; flex-wrap: wrap; margin: -5px;}
.org-list-group li {width: 25%; padding: 5px;}
.org-employee {display: block; height: 100%; padding: var(--space-35) var(--space-40); border: 1px solid #eee; border-radius: var(--radius-16);}
.employee-name {padding-bottom: var(--space-20); margin-bottom: var(--space-20); border-bottom: 1px dashed #eee; font-size: var(--font-size-24); font-weight: 800; color: var(--dark-color);}

/* 기관소개 > 투명경영 */
.sec-transparency-welcome {overflow: hidden; font-size: var(--font-size-20); line-height: 1.7em;}
.transparency-welcome-flow {position: relative;}
.transparency-welcome-flow .img {position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%, -50%); clip-path: circle(55% at 50% 47%);}
.transparency-welcome-flow .circle {width: 400px; height: 400px; margin: 0 auto; border-radius: 100%; background: var(--third-color);}
.transparency-welcome-flow .about-flow-cnt {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: 0; display: none;}

.sec-transparency-usage {background:#f8f8f8; border-radius: var(--radius-24);}
.transparency-financial-head {margin-bottom: var(--space-80);}
.sec-transparency-usage .flex-box {color: var(--gray-color);}
.transparency-financial-years {position: relative; width: fit-content;}
.current-year {display: flex; align-items: center; justify-content: space-between; width: 133px; height: 58px; padding: 5px 25px; background: #f8f8f8; border-radius: 8px;  font-size: var(--font-size-16); font-weight: 800; color: var(--dark-color); cursor: pointer;}
[lang="en"] .current-year {width: 150px;}
.current-year:after {content: ''; display: block; width: 6px; height: 10px; background: url('/images/main/visual-arrow.png') no-repeat center center / contain; filter: brightness(0);}
.transparency-financial-years ul {display: none; position: absolute; width: 100%;  margin-top: 10px; padding: 15px 0; border: 1px solid #eee; background: #fff; border-radius: 8px; }
.transparency-financial-years ul a {padding: 9px 25px; font-size: var(--font-size-16); font-weight: 600; color: var(--dark-color);}

.financial-document-list {margin-top: var(--space-40);}
.financial-document-list ul {display: flex; flex-wrap: wrap;margin: -10px;}
.financial-document-list li {width: 33.3335%; padding: 10px;}
.financial-document-list a {display: flex; align-items: center; gap:var(--space-15); height: 100%; padding: var(--space-25) var(--space-30); border: 1px solid #eee; border-radius: var(--radius-16); font-weight: 700; color: var(--dark-color);}
.financial-document-list a:before {content:''; display: block; width: 8px; height: 8px; border-radius: 100%; background: #ccc; transition: .2s;}
.financial-document-list a:hover:before {background: var(--primary-color);}
.financial-document-list a:after {content:'';display: block; width: 16px; height: 15px; margin-left: auto; background: url('/images/sub/financial-download-arrow.png') no-repeat center center / contain; filter: brightness(3);}
.financial-document-list a:hover:after {filter: brightness(1);}

.transparent-financial-cnt {margin-bottom: var(--space-45);}
.transparent-financial-group:not(:last-child) {margin-bottom: var(--space-100);}
.transparent-financial-group h3 {margin-bottom: var(--space-35);font-size: var(--font-size-28); font-weight: 800; color: var(--dark-color);}
.transparent-financial-chart {margin-bottom: var(--space-90); background: #fff; border-radius: var(--radius-24); padding: var(--space-70); border: 1px solid #eee;}
.financial-chart-head {display: flex; align-items: center; gap: var(--space-30); margin-bottom: var(--space-100);}
.financial-chart-head .wrap h4 {margin-bottom: var(--space-15); font-size: var(--font-size-20); font-weight: 800; color: var(--dark-color);}
.financial-chart-head .total-amount {font-size: var(--font-size-40); font-weight: 800; color: var(--fourth-color);}
.expense .financial-chart-head .total-amount {color: var(--primary-color);}
.financial-chart-head .total-amount span {font-size: var(--font-size-42);}
.financial-chart-cnt {display: flex; align-items: center; gap: 35px; padding: 0 var(--space-50);}
.financial-chart {flex:1;}
.financial-chart .wrap {position: relative; width: 400px; height: 400px;}
.financial-chart .logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.donut-chart {position: relative; width: 100%; height: 100%;}
.chart-color {display: inline-block; width: 12px; height: 12px; margin-right: 12px; border-radius: 100%;}
.chart-color.type1 {background: #90000c;}
.chart-color.type2 {background: #ad000e;}
.chart-color.type3 {background: #c40817;}
.chart-color.type4 {background: #da1020;}
.chart-color.type5 {background: #ea2030;}
.chart-color.type6 {background: #f05662;}
.chart-color.type7 {background: #f58b93;}
.chart-color.type8 {background: #f58b93;}
.chart-color.type9 {background: #ffe9ea;}

/* 지출 차트 색상 */
.expense .chart-color.type1 {background: #021012;}
.expense .chart-color.type2 {background: #032124;}
.expense .chart-color.type3 {background: #053135;}
.expense .chart-color.type4 {background: #064247;}
.expense .chart-color.type5 {background: #085259;}
.expense .chart-color.type6 {background: #09636b;}
.expense .chart-color.type7 {background: #0b737d;}
.expense .chart-color.type8 {background: #0c848f;}
.expense .chart-color.type9 {background: #0e94a0;}
.expense .chart-color.type10 {background: #10a5b2;}
.expense .chart-color.type11 {background: #12c0cf;}
.expense .chart-color.type12 {background: #16d9eb;}
.expense .chart-color.type13 {background: #33deed;}
.expense .chart-color.type14 {background: #50e3f0;}
.expense .chart-color.type15 {background: #6ee7f2;}
.expense .chart-color.type16 {background: #8becf5;}
.expense .chart-color.type17 {background: #a8f1f7;}
.expense .chart-color.type18 {background: #c5f6fa;}

.financial-chart-list {width: 45%;}
[lang="en"] .financial-chart-list {width: 52%;}
.financial-chart-list ul {display: flex; flex-wrap: wrap; gap: var(--space-35) 0;font-weight: 700; color: var(--dark-color);}
.financial-chart-list li:nth-child(odd) {width: 300px;}

.table-wrap table {width: 100%; border-collapse: collapse;}
.table-wrap th {font-weight: 800; color: var(--dark-color);}
.table-wrap th, .table-wrap td {padding: var(--space-20) var(--space-30); border: 1px solid #eee;}
.table-wrap thead th {background: #fafafa; border-top: 2px solid var(--dark-color); border-bottom: 2px solid #ddd;}
.table-wrap th:first-child, .table-wrap td:first-child {border-left: 0;}
.table-wrap th:last-child, .table-wrap td:last-child {border-right: 0;}

.transparent-financial-detail td:first-child {text-align: center;}
.transparent-financial-detail td:last-child {text-align: right;}
.transparent-financial-detail .total th, .transparent-financial-detail .total td {border-top: 2px solid #ddd; border-bottom: 2px solid #ddd;}
.transparent-financial-detail .total td {font-weight: 800; color: var(--fourth-color); }
.expense .transparent-financial-detail .total td {color: var(--primary-color); }

.this-year-report {display: flex; gap: clamp(35px, calc(100 / var(--inner) * 100vw), 100px); align-items: center; margin-bottom: var(--space-100);}
.year-report-txt {width: 50%;}
.year-report-txt h3 {position: relative; width: fit-content; margin-bottom: var(--space-35); padding-right: 22px; font-size: var(--font-size-28); line-height: 1em; font-weight: 800; color: var(--dark-color);}
.year-report-txt h3:after {position: absolute; content: ''; width: 10px; height: 10px; border-radius: 100%; background: var(--primary-color);top: 0; right: 0;}
.year-report-txt .txt {margin-bottom: var(--space-55);}
.report-btns, .annual-report-btns {display: flex; gap: 10px;}
.report-btns a {border: 1px solid #eee;}
.report-btns a:hover, .annual-report-btns a:hover {background: var(--primary-color); color: #fff;}
.report-btns a:hover:after {filter: brightness(1);}
.year-report-img {padding: var(--space-50); background: url('/images/sub/bg-transparency-report.jpg') no-repeat center center / cover; border-radius: var(--radius-16);}
.year-report-img .thumb {max-width: 280px; margin: 0 auto;}
.year-report-img .thumb .img {position: relative; width: 100%; padding-bottom: 136.4286%; border-radius: var(--radius-24); overflow: hidden; box-shadow: 12px 12px 32px rgba(0, 0, 0, 0.14);}
.year-report-img .thumb img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain;}
.annual-report-btns {justify-content: center;}
.annual-report-btns a {flex: 1; max-width:139px; display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: 30px; padding: 12px var(--space-30); border: 1px solid #eee; font-size: var(--font-size-16); font-weight: 600; line-height: 1.5em;}
.annual-report-btns a:hover .icon img {filter: brightness(20);}
.annual-report-thumb {position: relative; width: 100%; padding-bottom: 136.418%; border-radius: var(--radius-16); overflow: hidden; transition: .3s;}
.annual-report-thumb img {position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain;}
.annual-report-list {margin-top: var(--space-50); margin-bottom: var(--space-100);}
.annual-report-list ul {display: flex; flex-wrap: wrap; gap: 35px 0; margin: -10px;}
.annual-report-list li {width: 25%; padding: 10px;}
.annual-report-txt .tit {margin: var(--space-35) 0 var(--space-25); text-align: center; font-size: var(--font-size-24); font-weight: 800; color: var(--dark-color);}
.annual-report-item:hover .annual-report-thumb {box-shadow: 4px 4px 28px rgba(0, 0, 0, 0.12);}

/* 기관소개 > 캐릭터 소개 */
.character-container {overflow: hidden;}
.character-wrap {display: flex; gap: clamp(35px, calc(100 / var(--inner) * 100vw), 100px);}
.character-wrap .img {width: 50%;}
.character-info-cnt {display: flex; flex-direction: column; gap: 20px;}
.character-info-head {flex: 1; padding-top: var(--space-35);}
.character-info-head .tag {margin-bottom: var(--space-30); font-size: var(--font-size-16); font-weight: 700; color: var(--primary-color);}
.character-info-head .wrap { padding-bottom: var(--space-50); margin-bottom: var(--space-35); border-bottom: 2px solid #dfdfdf;}
.character-info-cnt h3 {margin-bottom: var(--space-30); font-size: var(--font-size-24); font-weight: 700; color: var(--dark-color); line-height: 1.5833em;}
.character-info-boxes {display: flex; gap: 10px;}
.character-info-box {flex: 1; padding: var(--space-50) 15px; background: #f8f8f8; border-radius: var(--radius-24); font-weight: 800; color: var(--dark-color);}
[lang="en"] .character-info-box {font-size: var(--font-size-15);}
.character-info-box ul {display: flex; flex-direction: column; gap: 10px; justify-content: space-between; width: fit-content; margin: 0 auto;  height: 100%;}
.character-info-box li {display: flex;}
.character-info-box li strong {display: block; min-width:75px;color: var(--primary-color);}
[lang="en"] .character-info-box li strong {min-width: 100px;}
.character-gallery-wrap .rtl {margin-bottom: 20px;}
.character-gallery-wrap .wrap {width: 500px;}
.character-gallery-wrap .img {margin-right: 20px;}
.character-gallery-wrap img {border-radius: var(--radius-24); overflow: hidden;}
.character-gallery-wrap .slick-list {overflow: visible;}
.character-gallery-wrap .ltr {transform: translateX(-800%);}
.ltr .slick-slide {float: right;}

.character-drama-items {gap: 40px 20px}
.drama-iframe {position: relative; width: 100%; padding-bottom: 56.25%; overflow: hidden; border-radius: var(--radius-24); margin-bottom: var(--space-40);}
.drama-iframe iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.drama-tit {display: flex; align-items: center; gap: 15px; font-size: var(--font-size-24); font-weight: 800; color: var(--dark-color);}
.drama-tit span {display: block; min-width: max-content; border-radius: 24px; background: var(--dark-color); padding: 7px 20px; color: #fff; font-size: var(--font-size-18); font-weight: 600; }

/* 기관소개 > 홍보대사 */
.ambassador-gallery-items {position: relative; padding: 0 var(--space-50);}
.ambassador-gallery-items:before {content: ''; position: absolute; top: 0; width: 365px; height: 365px; background: url('/images/sub/ambassador-circle.png') no-repeat center center / contain; top: 28%; left: 42%; transform: translate(-50%, -50%);}
.ambassador-gallery-items .slick-list {padding: 0 !important; margin: 0 -55px;}
.ambassador-gallery-items .slick-track {display: flex; align-items: center;}
.ambassador-gallery-items .slick-slide {padding: 0 55px; width: var(--ambassador-width);}
.ambassador-gallery-items .slick-slide.slick-current,
.ambassador-gallery-items .slick-slide.active {width: calc(1400px - var(--space-50) - var(--ambassador-width) * 2);}
.ambassador-gallery-item {position: relative; display: flex !important; align-items: center; justify-content: center; cursor: pointer; height: 520px;}
.ambassador-circle-wrap {text-align: center; font-weight: 600; overflow: hidden; opacity: 1; }
.ambassador-circle {position: relative; width: var(--ambassador-circle); height: var(--ambassador-circle); margin-bottom: var(--space-25); border-radius: 100%; overflow: hidden; transition: .2s;}
.ambassador-gallery-item:hover .ambassador-circle { box-shadow: var(--box-shadow); }
.ambassador-circle:after {content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 100%; border: 1px solid #ddd;}
.ambassador-gallery-item:hover .ambassador-circle:after {border: 4px solid var(--primary-color);}
.ambassador-gallery-item:hover {color: var(--primary-color);}
.ambassador-circle img {width: 100%; height: 100%; object-fit: cover;}
.slick-current .ambassador-circle-wrap {opacity: 0; width: 0;}
.slick-current .ambassador-active-wrap {width: 100%; opacity: 1; height: 100%;}
.slick-current .ambassador-active-img img {opacity: 1; transform: translateY(0)}
.slick-current .ambassador-active-txt {opacity: 1; transform: translateX(0); transition: .5s .5s;}
.ambassador-active-wrap {position: absolute; width: 0; opacity: 0; transition: .5s;}
.ambassador-active-img {width: 100%; height: 100%;}
.ambassador-active-img img {opacity: 0; transform: translateY(50px); transition: .5s .3s; position: absolute;bottom: 0; left: 0; width: 100%; height: 100%; margin: 0 auto; object-fit: contain; object-position: center bottom;}
.ambassador-active-txt {position: absolute; top: 18%; left: 80%; min-width: max-content; opacity: 0; transform: translateX(50px); transition: 0s;}
.ambassador-info {font-size: var(--font-size-14); color: var(--primary-color); font-weight: 700; margin-bottom: var(--space-20);}
.ambassador-name {font-size: var(--font-size-42); font-weight: 800; color: var(--dark-color);}

/* slick-active 상태일 때 */
.ambassador-gallery-item.slick-active .ambassador-circle {border-color: var(--primary-color); transform: scale(1.1);}
.ambassador-gallery-item.slick-active .ambassador-circle-name {color: var(--primary-color); font-weight: 700;}
.ambassador-gallery-item.slick-active .ambassador-active-wrap {display: block;}

/* slick-current 상태일 때 (현재 활성화된 슬라이드) */
.ambassador-gallery-item.slick-current .ambassador-circle {border-color: var(--primary-color); transform: scale(1.2); box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);}
.ambassador-gallery-item.slick-current .ambassador-circle-name {color: var(--primary-color); font-weight: 800;}

/* 텍스트 슬라이더 */
.ambassador-txt-items {position: relative; padding:var(--space-60) var(--space-30); background: var(--third-color); border-radius: var(--radius-24);}
.ambassador-txt-items:before, .ambassador-txt-items:after {content: ''; position: absolute; left: var(--space-40); top: -35px; width: 80px; height: 71px; background: url('/images/sub/ambassador-emphasis.png') no-repeat center center / contain;}
.ambassador-txt-items:after {left: auto; right: var(--space-40); top: auto; bottom: -35px; transform: rotate(180deg);}
.ambassador-txt-item {text-align: center;}
.ambassador-txt-item h3 {margin-bottom: var(--space-25); font-size: var(--font-size-28); font-weight: 800; line-height: 1.4em; color: var(--dark-color);}
.ambassador-txt-item .desc {margin-bottom: var(--space-35);}
.ambassador-txt-item .btn-ambassador {display: flex; align-items: center; gap: 12px; width: fit-content; margin: 0 auto; font-size: 16px; font-weight: 600; color: var(--primary-color);}
.ambassador-txt-item .btn-ambassador:before {content: ''; display: block; width: 18px; height: 18px; background: url('/images/sub/ambassador-play.png') no-repeat center center / contain;}

.ambassador-gallery-items .slick-arrow {position: absolute; top: 50%; left: 0; margin-top: -11px; width: 13px; height: 22px; background: url('/images/sub/ambassador-arrow.png') no-repeat center center / contain; cursor: pointer; overflow: hidden; border: 0; text-indent: -9999em; opacity: .3;}
.ambassador-gallery-items .slick-arrow.slick-next {left: auto; right: 0; transform: rotate(180deg);}
.ambassador-gallery-items .slick-arrow:hover {opacity: 1;}
.sec-ambassador-banner {padding: var(--space-80) clamp(35px, calc(100 / var(--inner) * 100vw), 100px); background: url('/images/sub/bg-ambassador-banner.jpg') no-repeat center center / cover; border-radius: var(--radius-24);}

/* 기관소개 > 찾아오시는길 */
.head-office-flex {display: flex; justify-content: space-between; gap: 25px 35px; margin-bottom: var(--space-70);}
.head-office-map {position: relative; width: 100%; overflow: hidden; border-radius: var(--radius-24); overflow: hidden;}
.office-info {margin-top: var(--space-35); font-size: var(--font-size-20); line-height: 1.7em;}
.office-info > ul {gap: 20px;}
.direction-tit {display: flex; align-items: center; gap: var(--space-15); color: var(--dark-color);}
.head-office-txt .direction-info-cnt {margin-top: var(--space-15);}
.sec-head-office .directions-info {padding-bottom: var(--space-50); margin-bottom: var(--space-30); border-bottom:2px solid var(--dark-color);}
.sec-head-office .directions-info li:not(:last-child) {margin-bottom: var(--space-40);}
.sec-head-office .contact-info li:not(:last-child) {margin-bottom: var(--space-15);}
.direction-sns:not(:last-child) {margin-right: 8px;}
.map-shortcuts {display: flex; gap: 10px; position: absolute; left: 20px; bottom: 20px; z-index: 10;}
.map-shortcuts a {display: flex; align-items: center; gap: 12px; padding: var(--space-15) var(--space-25); border: 1px solid #ddd; background: #fff; border-radius: 10px;font-size: var(--font-size-16); line-height: 1.5em; color: var(--dark-color); font-weight: 600;}
.map-shortcuts a:hover {background: #f4f4f4;}
.transport-boxes {display: flex; gap: 20px;}
.transport-box {flex: 1; padding: var(--space-35) var(--space-40); border-radius: var(--radius-16); background: #f8f8f8;}
.transport-box h3 {margin-bottom: var(--space-20); font-size: var(--font-size-16); font-weight: 700; color: var(--gray-color);}
.transport-box p {font-size:var(--font-size-20); font-weight: 800; line-height: 1.7em; color: var(--dark-color);}
.transport-box ul {display: flex; gap: var(--space-30); margin-top: 7px;}
.transport-box li {display: flex; align-items: center; gap: 10px; font-size: var(--font-size-16); font-weight: 500; color: var(--dark-color);}
.transport-box li span {display: block; padding: 0 10px; border-radius: 6px; font-size: 13px; font-weight: 700; color: #fff;}
.root_daum_roughmap .wrap_map, .root_daum_roughmap, .page-about-directions iframe {width: 100% !important; border-radius: var(--radius-24);}
.root_daum_roughmap .cont {display: none;}
.root_daum_roughmap .wrap_controllers {display: none;}
.sec-branch .office-info {display: flex; justify-content: space-between; gap: 20px; max-width: 100%;}
.sec-branch .directions-info li {display: flex; gap: var(--space-15) var(--space-30);}
.sec-branch .contact-info ul {display: flex; gap: var(--space-15) var(--space-40);}

/* 주요사업 > 해외사업 */
.oversea-welcome .contain {gap: 25px 35px;}
.oversea-welcome-img {width: 55.715%;}
.oversea-welcome-txt {width: 34.286%;; padding: var(--space-30) 0; gap: 25px;}
.curtain-boxes {display: flex; gap: 10px;}
.curtain-box {position: relative; flex: 1; display: block; border-radius: var(--radius-24); overflow: hidden; transition: 1s;}
.curtain-box.narrow {flex: .5;}
.curtain-box .bg img {width: 100%; height: 521px; object-fit: cover; object-position: center center;}
.curtain-box .txt {position: absolute; top: 0; left: 0; right: 0; padding: var(--space-45) var(--space-30) 0; color: #fff;}
.curtain-box .tag {font-weight: 700; opacity: .5; margin-bottom: var(--space-20); transition: .3s;}
.curtain-box.on .tag {opacity: 1;}
.curtain-box h3 {font-size: var(--font-size-28); font-weight: 800; line-height: 1.5em; transition: .6s;}
[lang="en"] .curtain-box h3 {font-size: var(--font-size-26);}
.curtain-box.on h3 {font-size: var(--font-size-42);}
[lang="en"] .curtain-box.on h3 {font-size: var(--font-size-38);}
.pop-business-slides .items {position: relative; border-radius: var(--radius-24); overflow: hidden;}
.business-slides-func, .participation-slide-func {display: flex; justify-content: center; align-items: center; gap: 30px;margin-top: var(--space-35);}
.pop-business-slides .slick-dots {display: flex; gap: 15px; line-height: 0;}
.pop-business-slides .slick-dots button {display: block; width: 8px; height: 8px; border-radius: 100%; background: #dfdfdf; border: 0; overflow: hidden; text-indent: -9999em;}
.pop-business-slides .slick-dots .slick-active button {background: var(--primary-color);}
.pop-business-slides .item {position: relative; width: 100%; padding-bottom: 56.4%;}
.pop-business-slides img,
.pop-business-slides iframe {position: absolute; width: 100%; height: 100%; object-fit: contain;}
.business-arrow {display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 100%; border: 1px solid #ddd; background: #fff; font-weight: 800; font-size: 20px; transition: .2s;}
.business-arrow:hover {background: var(--primary-color); border-color: var(--primary-color); color: #fff;}
.oversea-slide-func {display: flex; gap: 10px;}
.oversea-slides-wrap .slick-list {overflow: visible; margin: 0 -10px;}
.oversea-slides-wrap .slick-slide {padding: 0 10px;}
.oversea-slides-wrap .thumb {position: relative; width: 100%; padding-bottom: 75.055%; margin-bottom: var(--space-35); border-radius: var(--radius-24); overflow: hidden;}
.oversea-slides-wrap .thumb img {position: absolute; width: 100%; height: 100%; object-fit: cover;}
.oversea-slides-wrap h3 {height: 3em; margin-bottom: 10px; font-size: var(--font-size-28); font-weight: 800; line-height: 1.5em; color: var(--dark-color);}
.page-grouphome .oversea-slides-wrap h3 {height: auto; margin-bottom: 0;}
[lang="en"] .page-domestic .oversea-slides-wrap h3 {height: auto;}

.oversea-facility-item {display: flex; align-items: center; gap: 25px clamp(35px, calc(90 / var(--inner) * 100vw), 90px);}
.oversea-facility-item:not(:last-child) {padding-bottom: var(--space-40); margin-bottom: var(--space-40); border-bottom: 1px dashed #ddd}
.oversea-facility-item .img {width: 32.3575%;}
.oversea-facility-item .txt {flex: 1;}
.oversea-facility-item .txt p {margin: var(--space-25) 0;}
.oversea-facility-item .help-txt, .supporter-box .help-txt {font-size: var(--font-size-16); color: #a8a8a8;}
.oversea-education-banner {background: url('/images/sub/bg-education-banner.jpg') no-repeat center center; background-size: cover; border-radius: var(--radius-24); overflow: hidden;}
.page-domestic .oversea-education-banner {background-image: url('/images/sub/bg-domestic-education-banner.jpg')}
.education-circle-item .icon {width: fit-content; margin: 0 auto var(--space-25); margin-bottom: var(--space-50); padding: var(--space-60); box-shadow: 12px 12px 32px rgba(0,0,0,.1); border-radius: 100%; background: rgba(44,44,44,.2); backdrop-filter: blur(10px);}
.page-domestic .education-circle-item .icon {background-color: rgba(255,255,255,.1)}
.education-circle-item h3 {margin-bottom: 10px;}
.education-circle-items {display: flex; justify-content: space-around; gap: 25px 15px;}
.oversea-process {margin-top: var(--space-50); border-radius:var(--radius-24);}
.oversea-process-items {display: flex; gap: var(--space-20);}
.oversea-process-items.type2, .oversea-process-items.type3, .oversea-process-items.type5 {flex-wrap: wrap;}
.oversea-process-items.type2 .oversea-process-item, .oversea-process-items.type3 .oversea-process-item,  .oversea-process-items.type5 .oversea-process-item {flex: none; width: calc((100% - 40px) / 3); background: #f0fbfb;}
.oversea-process-items.type3 .oversea-process-item, .oversea-process-items.type5 .oversea-process-item {background: #f8f8f8;}
.oversea-process-items.type4 .oversea-process-item {background: #fff;}
.oversea-process .num {display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin-bottom: var(--space-50); background:  var(--primary-color); color: #fff; border-radius: 100%; font-size: var(--font-size-16); font-weight: 700;}
.oversea-process .oversea-process-items.type2 .num,
.oversea-process .oversea-process-items.type3 .num,
.oversea-process .oversea-process-items.type4 .num {display: block; width: auto; height: auto; margin: var(--space-50) 0 var(--space-15); background: transparent; color: #ccc; font-size: var(--font-size-24); font-weight: 800;}
.oversea-process-item {position: relative; flex: 1; padding:var(--space-40); background: #fff; border-radius: var(--radius-16); font-size: var(--font-size-16); color: #a8a8a8;}
.type2 .oversea-process-item,
.type3 .oversea-process-item,
.type4 .oversea-process-item,
.type5 .oversea-process-item {font-size: var(--font-size-18); color: #505050;}
.oversea-process-item:not(:last-child):after {content:'→'; position: absolute; right: 0; top: 50%; transform: translate(50%, -50%); font-size: 86px; font-weight: 800; background: linear-gradient(to right, #fff, #a0e3e4); -webkit-background-clip: text; color: transparent; line-height: 1em; z-index: 1;}
.type2 .oversea-process-item:nth-child(3n):after,
.type3 .oversea-process-item:nth-child(3n):after,
.type5 .oversea-process-item:nth-child(3n):after {content: none;}
.type5 .oversea-process-item .icon {margin-bottom: var(--space-45);}
.oversea-process-item h3 {margin-bottom: 7px; font-size: var(--font-size-24); font-weight: 800; color: var(--dark-color);}
[lang="en"] .oversea-process-item h3 {font-size: var(--font-size-22);}
.oversea-process-item h3 span {display: inline-block;}
.type2 .oversea-process-item h3,
.type3 .oversea-process-item h3,
.type4 .oversea-process-item h3 {margin-bottom: var(--space-25);}
.oversea-bot-shortcuts {margin-bottom: var(--space-30); padding:var(--space-30) 0; background: #f0fbfb; border-radius: var(--radius-24);}
.oversea-bot-shortcuts .contain {display: flex; align-items: center; justify-content: space-between; gap: 20px 30px;}
.oversea-bot-shortcuts p {font-size: var(--font-size-24); line-height: 1.5em; font-weight: 700; color: var(--dark-color);}
.btn-start {padding: 15px 50px; background: #fff; color: var(--dark-color); border-radius: 30px; font-weight: 700; line-height: 1.5em; transition: .2s;}
.btn-start:hover {background: var(--primary-color); color: #fff;}
.oversea-culture-banner {padding: var(--space-70) var(--space-70) clamp(40px, calc(330 / var(--inner) * 100vw), 330px); margin-bottom: 20px; border-radius: var(--radius-24); background: url('/images/sub/bg-oversea-culture.jpg') no-repeat center center; background-size: cover; font-size: var(--font-size-36); font-weight: 800; color: #fff; line-height: 1.4444em;}
[lang="en"] .oversea-culture-banner {font-size: var(--font-size-32);}
.oversea-culture-support .video-container {margin-bottom: var(--space-50); border-radius: var(--radius-24); overflow: hidden;}
.culture-support-cards {display: flex; gap: 35px var(--space-20);}
.culture-support-cards.type3 {flex-wrap: wrap; gap: var(--space-80) var(--space-20);}
.culture-support-cards.type2 {flex-wrap: wrap; gap: var(--space-80) var(--space-40);}
.culture-support-cards.type3 .culture-support-card {width: calc((100% - var(--space-20) * 2) / 3);}
.culture-support-cards.type2 .culture-support-card {width: calc((100% - var(--space-40)) / 2);}
.card-help-txt {margin-top: var(--space-30); font-size: var(--font-size-16); color: var(--gray-color);}
.culture-support-card h3 {margin-bottom: 10px; margin-top: var(--space-35); font-size: var(--font-size-28); font-weight: 800; color: var(--dark-color);}
[lang="en"] .culture-support-card h3 small {display: inline-block;}
.oversea-develop .group:not(:last-child) {margin-bottom: var(--space-110);}
.oversea-develop .img {position: relative; border-radius: var(--radius-24); overflow: hidden;}
.oversea-develop .img .tag {position: absolute; right: 20px; bottom: 20px; padding: 13px 30px; border-radius: 30px; font-weight: 700; color: #fff; background: rgba(0,0,0,.4); backdrop-filter: blur(10px)}
.blue-cnt {padding: var(--space-75) var(--space-65); background: #f1f7f7; border-radius: var(--radius-24);}
.color-infos {gap: 30px;}
.color-info span {width: 20px; height: 20px; border-radius: 100%; margin-right: 10px;}
.domestic-chart {padding: var(--space-70) var(--space-40); text-align: center; background: #fff; border-radius: var(--radius-24);}
.blue-help-txt {margin-top: var(--space-35); text-align: right; font-size: var(--font-size-16); color: #a8a8a8;}
.grouphome-facility-boxes {display: flex; flex-wrap: wrap; gap: 10px; width: 35.07%;}
.grouphome-facility-box {display: flex; flex-direction: column;justify-content: center; gap: 5px; width: calc((100% - 10px) / 2); padding: var(--space-15) var(--space-30); background: #fff; border-radius: var(--radius-16);}
[lang="en"] .grouphome-facility-box {padding: var(--space-15) var(--space-20);}
.grouphome-facility-map {margin-left: -50px; margin-right: 50px;}
.grouphome-facility-number {display: flex; align-items: center; gap: 5px;}
.grouphome-facility-number span {font-size: var(--font-size-36); font-weight: 800; color: var(--dark-color);}
.grouphome-center-gallery {display: flex; gap: var(--space-80) var(--space-20); flex-wrap: wrap;}
.grouphome-center-item {width: calc((100% - var(--space-20)) / 2);}
.support-guide-info .contain {gap: 25px 35px;}
.guide-info-cnt {width: 50%; padding-top: var(--space-35); padding-left: var(--space-30); border-top: 2px solid var(--dark-color);}
.guide-info-cnt li {display: flex; gap: 3px; }
.guide-info-cnt li .wrap {min-width: max-content;}
.regular-welcome-txt {padding-right: 35px; padding-top: var(--space-80);}
.regular-welcome-img {width: 55.715%;}
.support-guide-custom .culture-support-card .img {overflow: hidden; transition: .3s linear;}
.support-guide-custom .culture-support-card:hover .img {border-radius: 100%;}


/* 주요사업 > 참여사업 */
.sec-participation-welcome .contain {gap: 25px var(--space-100);}
.sec-participation-welcome .img {width: 28.5715%;}
.participation-slides .slick-list {margin: 0 -10px;}
.participation-slides .slick-slide {padding: 0 10px;}
.participation-slide {max-width: 453px;}
.participation-slide .thumb {position: relative; width: 100%; padding-bottom: 75.055%; margin-bottom: var(--space-35); border-radius: var(--radius-24); overflow: hidden;}
.participation-slide .thumb > img {position: absolute; width: 100%; height: 100%; object-fit: cover;}
.participation-slide .thumb:after {content:''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #000; opacity: 0; transition: .3s ease-in-out;}
.participation-slide:hover .thumb:after {opacity: .5;}
.participation-slide .tit {margin-bottom: var(--space-15); font-size: var(--font-size-28); font-weight: 800; color: var(--dark-color);}
[lang="en"] .participation-slide .tit {font-size: var(--font-size-26);}
.participation-slide p {overflow: hidden; height: 3.3333em; margin-bottom: var(--space-35); white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all;}
.participation-slide .hashtags {display: flex; gap: 4px; flex-wrap: wrap; font-size: var(--font-size-14); font-weight: 600; color: #a8a8a8; line-height: 1.5em;}
.participation-slide .hashtags span {display: block; padding: 7px 16px; border-radius: 20px; border: 1px solid #eee; background: #fff; transition: .3s;}
.participation-slide:hover .hashtags span {background: var(--primary-color); border-color: var(--primary-color); color: #fff;}
.flex-tit {display: flex; align-items: center; gap: 30px;}
.participation-share-img {width: calc((100% - 20px) / 2); margin-left: 20px; border-radius: var(--radius-24); overflow: hidden;}
.sec-participation-share .flex-box {border: 1px solid #eee; color: #878787;}
.inquiry-form {padding-top: var(--space-30); padding-bottom: var(--space-15); border-top: 2px solid var(--dark-color); border-bottom: 1px solid #ddd;}
.inquiry-form .row {display: flex; margin: 0 calc(var(--space-30) * -1);}
.inquiry-form .col {flex: 1; display: flex; padding: var(--space-20) var(--space-30);}
.inquiry-tit {display: flex; align-items: center; gap: 12px; min-width: 160px; height: fit-content; padding: var(--space-15) 0; font-size: var(--font-size-20); font-weight: 600; color: var(--dark-color);}
[lang="en"] .inquiry-tit {min-width: 195px;}
.inquiry-tit:before {content:''; width: 8px; height: 8px; display: flex; align-items: center; border-radius: 100%; background: #dfdfdf;}
.inquiry-input {flex: 1;}
.inquiry-form .input, .criteria-input .input, .input-wrap {width: 100%; height: 60px; border-radius: 8px;}
.required-col .inquiry-tit:before {background: var(--primary-color);}

/* 주요사업 > 위드림로드 */
.supporter-welcome .img {width: 55.7143%;}
.supporter-welcome .txt {width: 35%;}
.parallele-box {display: flex; padding: var(--space-40); padding-right: var(--space-30); background: #f8f8f8; border-radius: var(--radius-16);}
.parallele-tit {display: flex; min-width: 430px; font-size: var(--font-size-24); font-weight: 800; color: #ccc;}
[lang="en"] .parallele-tit {min-width: 520px;}
.parallele-tit h3 {font-size: var(--font-size-24); font-weight: 800; color: var(--primary-color);}
.parallele-tit .num {min-width: 45px;}
.supporter-business .sponsor-btns a {border: 1px solid var(--primary-color);}
.sponsor-btns a.btn-dark {border-color: #ddd; background: #fff; color: #505050;}
.sponsor-btns a.btn-dark:after {filter: grayscale(1) brightness(0.5);}
.sponsor-btns a.btn-dark:hover {background-color: var(--primary-color); color: #fff;}
.sponsor-btns a.btn-dark:hover:after {filter: grayscale(1) brightness(0) invert(1);}
.supporter-business .tag {width: fit-content; padding: 4px 16px; margin-bottom: var(--space-25); border-radius: 8px; background: #e8f5f5; font-size: var(--font-size-16); font-weight: 600; color: var(--primary-color);}
.supporter-business .sponsor-btns {margin-bottom: var(--space-25);}
.type3 .oversea-process-item .num,
.type4 .oversea-process-item .num {margin-bottom: var(--space-45);}
.type5 .oversea-process-item .num {margin-bottom: var(--space-12);font-size: var(--font-size-24); font-weight: 800; color: #ccc;}
.supporter-boxes {gap: var(--space-20);}
.supporter-box {background: #fff; padding: var(--space-55) 20px; border-radius: var(--radius-16); }
.supporter-box h3 {margin-bottom: var(--space-25); font-size: var(--font-size-20); color: #676767;}
.btn-start.btn-wedream-inquiry {display: block; width: fit-content; margin: 0 auto; border: 1px solid var(--primary-color); color: var(--primary-color);}
.btn-start.btn-wedream-inquiry:hover {color: #fff;}
.supporter-tel {margin-bottom: 10px; font-size: var(--font-size-48); font-weight: 800; color: var(--primary-color); line-height: 1em;}

/* 후원하기 > 후원안내 */
.page-support-guide .corporate-welcome-img .img:not(:last-child) {margin-bottom: 10px;}
.page-support-guide .corporate-welcome-txt {padding-right: 30px;}
.sec-guide-opportunity .support-welcome-cnt h3 {position: unset; padding: 0; text-align: right;}
.sec-guide-opportunity .support-welcome-txt {display: flex; flex-direction: column; justify-content: space-between; position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: var(--space-70); color: #fff;}
.sec-guide-opportunity .support-welcome-bot {display: flex; gap: 15px; font-size: var(--font-size-32); font-weight: 800; line-height: 1em;}
.sec-guide-opportunity .support-welcome-bot strong {display: inline-block; width: 5.8em; font-size: clamp(35px, calc(86 / var(--inner) * 100vw), 86px); line-height: .8em;}
.guide-change-items {flex-wrap: wrap; gap: var(--space-80); color: #676767; font-weight: 700;}
.guide-change-item {display: flex; align-items: center; gap: 25px var(--space-60); width: calc((100% - var(--space-80)) / 2);}
.guide-change-img {border-radius: var(--radius-24); width: 48.485%; overflow: hidden; transition: .3s linear;}
.guide-change-txt {flex: 1;}
.guide-change-item .num {margin-bottom: var(--space-25); background: #f1f1f1; border-radius: 100%; font-size: var(--font-size-16); font-weight: 700; color: var(--primary-color); transition: .3s;}
.guide-change-item:hover .guide-change-img {border-radius: 100%;}
.guide-change-item:hover .num {background: var(--primary-color); color: #fff;}
.guide-change-item:hover,
.guide-change-item:hover h3.sec-tit {color: var(--primary-color) !important;}
.page-support-guide .store-banner .contain {padding: var(--space-80) var(--space-100);}
.page-support-guide .store-banner.type2 .contain:last-child {text-align: right; padding: 0;}
.btn-dark.btn-detail {min-width: max-content}
.howto-help-txt {display: flex; gap: 8px 25px; flex-wrap: wrap;}
.howto-help-txt .tag {display: flex; align-items: center; gap: 7px; padding: 5px 20px; border-radius: 40px; background: #e0f6f6; font-weight: 700; color: var(--primary-color);}
.howto-help-txt span.gray-color, .howto-help-txt small.gray-color {display: inline-block;}
.exclamation-txt {gap: 10px;}
.exclamation-txt .icon img {filter: grayscale(1) brightness(1.5)}
.guide-receipt-wrap .img {width: 41.429%;}
.guide-receipt-wrap .txt {width: 50%;}
.download-btns {gap: 12px var(--space-40);}
[lang="en"] .download-btns {flex-direction: column;}
.download-btns a {display: flex; align-items: center; gap: var(--space-15);}
.download-btns .icon {padding: var(--space-10) var(--space-20); background: #fafafa; border-radius: 20px; border: 1px solid #eee; line-height: 0;}
.download-btns a:hover .icon {background: var(--primary-color); border-color: var(--primary-color);}
.download-btns a:hover .icon img {filter: grayscale(1) brightness(0) invert(1);}
.parallele-boxes {gap: var(--space-20);}
.type2 .parallele-box .num {background: #fff; border: 1px solid #eee; color: var(--primary-color);}
.type2 .parallele-box {display: flex; align-items: center; gap: 12px; font-size: var(--font-size-22); font-weight: 600; text-align: center;}

/* 후원하기 > 정기일시후원 */
.regular-support-boxes {gap: var(--space-20);}
.regular-support-box {position: relative; display: block; padding: var(--space-80) var(--space-60); border-radius: var(--radius-24); overflow: hidden;}
.regular-support-box .bg img {position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; object-fit: cover; object-position: top right;}
.regular-support-box .tit {margin-bottom:  clamp(35px, calc(170 / var(--inner) * 100vw), 170px);}

/* 후원하기 > 기업후원 > 후원 안내 */
.corporate-welcome-img {width: 40%;}
.corporate-participate {background: #f0fbfb;}
.corporate-partner-list ul {display: flex; flex-wrap: wrap; margin: calc(var(--space-10) * -1);}
.corporate-partner-list li {width: 25%; padding: var(--space-10);}
.corporate-logo {position: relative; width: 100%; padding-bottom: 40%; background: #fff; border: 1px solid #eee; border-radius: var(--radius-16);}
.corporate-logo img {position: absolute; width: 100%; height: 100%; object-fit: contain; object-position: center center;}
.page-corporate .main-report {margin-top: var(--space-50); background-image: url('/images/sub/bg-corporate-banner.jpg');}

/* 후원하기 > 국내아동 결연후원 */
.support-welcome-cnt {position: relative; border-radius: var(--radius-24); overflow: hidden;}
.support-welcome-cnt h3 {position: absolute; left: 0; right: 0; bottom: 0; padding: var(--space-70);}
.support-faq .faq-tit, [lang="en"] .support-faq .faq-tit {width: auto;}
.support-faq .faq-top-head {gap: 25px;}
.support-banner {position: relative; overflow: hidden;}
.support-banner .bg {position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; left: 0;}
.support-banner .bg img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.support-banner a {margin: 0 auto;}

/* 후원하기 > 해외아동 결연후원 */
.find-support-child {padding:var(--space-55) var(--space-70); background: #f4f4f4; border-radius: var(--radius-24);}
.find-support-criteria {display: flex; gap: var(--space-40); padding-bottom: var(--space-35); margin-bottom: var(--space-35); border-bottom: 1px dashed #ccc}
.input-wrap {display: flex; gap: 8px;}
.input-wrap.flex-mid {gap: 5px 30px;}
.find-support-child .buttons {margin-top: 0;}
.find-support-child .buttons .btn-pack.xlarge {width: 224px;}
.page-support-list >ul {display: flex; flex-wrap: wrap; gap: var(--space-90) 0; margin: 0 calc(var(--space-20) * -1);}
.page-support-list >ul>li {width: 33.3335%;padding: 0 var(--space-20);}
.support-list-tag {margin-bottom: var(--space-12); font-size: var(--font-size-16); font-weight: 700; color: var(--primary-color); line-height: 1.5em;}
.page-support-list .campaign-list-thumb {margin-bottom: var(--space-30);}
.page-support-list .campaign-list-txt .tit {margin-bottom: var(--space-20); font-size: var(--font-size-32); font-weight: 800;}
.child-list-info {display: flex; gap: 5px 30px; font-weight: 600; color: var(--dark-color);}
.child-list-info > div {display: flex; align-items: center; gap: 12px;}
.child-list-info .icon {display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 100%; background: #f1f1f1;}
.campaign-list-item:hover .child-list-info .icon {background: var(--primary-color);}
.campaign-list-item:hover .child-list-info .icon img {filter: grayscale(1) brightness(0) invert(1)}
.campaign-list-item.end {}
.support-list-more {display: flex; justify-content: center; margin-top: var(--space-100);}
.support-list-more a {display: flex; justify-content: center; align-items: center; max-width: 680px; width: 100%; height: clamp(45px, calc(64 / var(--inner) * 100vw), 64px); border-radius: 8px; border: 1px solid #ddd; font-weight: 700;}
.support-list-more a:hover {border-color: var(--primary-color); background: var(--primary-color); color: #fff;}

/* 후원하기 > 해외아동 결연후원 상세 */
.page-support-detail .sec:not(:last-child) {margin-bottom: var(--space-90);}
.child-information-wrap {display: flex; gap: 20px;}
.child-img {width: 24.2858%;}
.child-img .img {position: relative; width: 100%; padding-bottom: 100%; border-radius: var(--radius-24); overflow: hidden;}
.child-img img {position: absolute; width: 100%; height: 100%; object-fit: cover;}
.child-profile {display: flex; flex-direction: column; justify-content: space-between; gap: 20px; padding: var(--space-40) var(--space-35) var(--space-35); border: 1px solid #ddd; border-radius: var(--radius-24);}
.child-overview {display: flex; align-items: center; gap: 8px 25px;}
.child-overview .wrap {display: flex; align-items: center; gap: 15px var(--space-40);}
.child-name {font-size: var(--font-size-28); font-weight: 800; color: var(--dark-color);}
.child-overview .child-list-info .icon {background: var(--primary-color);}
.child-overview .child-list-info .icon img {filter: grayscale(1) brightness(0) invert(1)}
.child-nationality {font-size: var(--font-size-16); font-weight: 700; color: var(--gray-color);}
.child-information {display: flex; gap: 0 var(--space-40);}
.child-information ul {flex: 1;}
.child-information li {display: flex; gap: 5px 30px; padding: 7px 0; font-size: var(--font-size-15);}
.child-information li:not(:last-child) {border-bottom: 1px solid #ddd;}
.child-information strong {flex:1;}
.background-cnt {padding: var(--space-55) 0;border-top: 2px solid var(--dark-color); border-bottom:1px solid #eee;}
.family-table {margin-bottom: var(--space-100);}
.family-table table {width: 100%; border-collapse: collapse; text-align: center; border-top: 2px solid var(--dark-color);}
.family-table th, .family-table td {padding: var(--space-20) 7px; border: 1px solid #ddd;}
.family-table th {background: #fafafa; border-bottom: 2px solid #ddd; font-weight: 800; color: var(--dark-color);}
.family-table th:first-child, .family-table td:first-child {border-left: 0;}
.family-table th:last-child, .family-table td:last-child {border-right: 0;}

/* 후원하기 > 기부 스토어 */
.sec-store-slides {position: relative;}
.sec-store-slides:before {content: ''; position: absolute; top:0; bottom: 0; left: 0; width: 42.86%; background: #f0fbfb; border-radius: var(--radius-24); z-index: -1;}
.store-slides .main-store-item {display: flex !important; flex-direction: row; gap: clamp(30px, calc(100 / var(--inner) * 100vw), 100px); opacity: .14; text-align: left;}
.store-slides .slick-current .main-store-item {opacity: 1;}
.store-slides .main-store-item .img {width: 51.4286%;} 
.store-slides .main-store-thumb {padding-bottom: 66.1115%;}
.store-slides .main-store-item .tag {margin-left: 0; margin-bottom: var(--space-30);}
.store-slides .main-store-shortcuts {justify-content: flex-start; margin-top: var(--space-45);}
.store-slides .main-store-item .tit {margin-bottom: var(--space-45); font-size: var(--font-size-42); font-weight: 800; color: var(--dark-color); line-height: 1.2em;}
.store-slides .main-store-info .txt {flex: none; font-size: var(--font-size-20); line-height: 1.7em;}
.store-slides .slick-list {overflow: visible;}
.store-slides .main-store-info {padding-right: 30px;}
.sec-store-process .oversea-process-items.type4 .oversea-process-item {background: #f8f8f8;}
.board-list .main-store-shortcuts {margin-top: 0; justify-content: center;}
.store-banner .contain {position: relative; border-radius: var(--radius-24); overflow: hidden; padding: clamp(45px, calc(155 / var(--inner) * 100vw), 155px) var(--space-100);}
.store-banner .bg, .store-banner .bg img {position: absolute; z-index:-2; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: right center;}

.store-banner.type2 .contain:last-child {padding: 0 var(--container-space);}
.select-trigger {display: flex; align-items: center;}
.custom-select {position: relative; z-index: 4;}
.select-options {display: none; position: absolute; width: 100%; padding-top: 5px;}
.select-options ul {max-height: 300px; overflow-y: auto; background: #fff; border: 1px solid #ddd; border-radius: 8px;}
.select-options li {padding: 6px 16px; font-size: 15px; cursor: pointer;}
.select-options li:hover {background: #f4f4f4;}

/* 진행중인 캠페인 */
.campaign-ongoing {margin-bottom: var(--space-100);}
.campaign-ongoing-item {display: flex; gap: var(--space-40) var(--space-80);}
.campaign-ongoing-thumb {width: 27.1429%;}
.campaign-ongoing-thumb .campaign-list-thumb {margin-bottom: 0;}
.campaign-ongoing-item .campaign-list-txt {max-width: 720px; padding-top: var(--space-45);}
.campaign-ongoing-item .campaign-list-txt .tit {font-size: var(--font-size-28);}
.campaign-ongoing-item .campaign-list-txt .txt {font-size: var(--font-size-18);}
.campaign-list-thumb .btn-share {position: absolute; right: var(--space-15); top: var(--space-15); z-index: 3;}
.campaign-ongoing-func {display: flex; align-items: center; gap: var(--space-30); position: absolute; width: 100%; left: 0; bottom: 0; padding-left: calc(27.1429% + var(--space-80)); z-index: 1;}
.campaign-ongoing-arrow {position: unset; width: 50px; height: 50px; margin: 0; border-radius: 100%; background: #fff; border: 1px solid #ddd; font-size: 20px; font-weight: 800; color: #505050; transition: .2s;}
.campaign-ongoing-arrow.swiper-button-prev:after, .campaign-ongoing-arrow.swiper-button-next:after {content: none;}
.campaign-ongoing-arrow.disabled {pointer-events: none; background: #eee; color: #aaa;}
.campaign-ongoing-arrow:hover {background: var(--primary-color); border-color: var(--primary-color); color: #fff;}
.campaign-ongoing-pagination {position: unset; width: auto !important; line-height: 0;}
.campaign-ongoing-pagination.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 8px;}
.campaign-ongoing-pagination .swiper-pagination-bullet-active {background: var(--primary-color);}

.share-box {display: none;position: absolute; right: 0; bottom: 100%; z-index: 5; width: fit-content; padding: var(--space-25) var(--space-30) var(--space-30); background: #fff; border-radius: var(--radius-24); border: 1px solid #ddd;}
.share-box:after {content: ''; position: absolute; right:calc(var(--space-15) + 18px); top: 100%; width:12px; height:12px; margin-top: -5px; background: #fff; border: 1px solid #ddd; border-top: 0; border-left: 0; transform: rotate(45deg);}
.share-box .tit {color: var(--dark-color); font-size: var(--font-size-16); font-weight: 700;}
.share-title {display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: var(--space-20);}
.share-title .btn-close {display: block; width: 12px; height: 12px; background: url('/images/sub/share-close.png') no-repeat center center; background-size: contain; overflow: hidden; text-indent: -9999em;}
.share-list {display: flex; justify-content: space-around; gap:  var(--space-30); text-align: center; font-size: var(--font-size-14); line-height: 1.3em;}
.share-item {display: block; width: max-content;}
.share-item .txt {margin-top: var(--space-12);}
.view-head-func .share-box {bottom: calc((100% + 15px));right: calc(var(--space-15) * -1);}

/* 참여와소통 > 사업후기 */
.sec-recommend-review {margin-bottom: var(--space-90);}
.board-top-slide {position: relative; margin: 0 -40px; padding: 0 40px;}
.board-top-slide .items {position: unset;}
.board-top-slide .campaign-list-thumb {padding-bottom: 74.7727%;}
.board-top-slide .slick-arrow, .visual-arrow {position: absolute; top: 50%; transform: translateY(-50%); right: 0; z-index: 2; display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; border-radius: 100%; background: #fff; box-shadow: 6px 6px 24px rgba(0, 0, 0, 0.12); cursor: pointer; overflow: hidden; border: 0; font-size: 28px; font-weight: 800; color: #505050; transition: .2s;}
.board-top-slide .slick-arrow.slick-prev, .visual-arrow.visual-prev {right: auto; left: 0;}
.board-top-slide .slick-arrow:hover, .visual-arrow:hover {background: var(--primary-color); color: #fff;}
.board-top-slide .slick-list {margin: 0 calc(var(--space-20) * -1);}
.board-top-slide .slick-slide {padding: 0 var(--space-20);}
.community-shortcut-arrow,
.curtain-box:after {position: absolute; content: ''; right: var(--space-20); bottom: var(--space-20); width: 60px; height: 60px; background: url('/images/sub/community-shortcut-arrow.png') no-repeat center center / contain; opacity: 0; transition: .3s;}
.curtain-box:after {background-image: url('/images/sub/curtain-box-arrow.png')}
.campaign-list-item:hover .community-shortcut-arrow,
.curtain-box:hover:after {opacity: 1;}

/* 참여와소통 > 뉴스레터 */
.this-month-newsletter {display: flex; align-items: center; gap: 25px var(--space-100); margin-bottom: var(--space-90); padding: var(--space-60); border-radius: var(--radius-24); background:#f5fbfb;}
.this-month-newsletter .thumb {max-width: 360px; margin-left: auto;}
.this-month-newsletter .img {position: relative; width: 100%; padding-bottom: 100%; border-radius: var(--radius-24); overflow: hidden; box-shadow: 12px 12px 32px rgba(0,0,0,.12);}
.this-month-newsletter img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.this-newsletter-txt {width: 50%; color: var(--gray-color);font-size: var(--font-size-16); line-height: 1.2em; font-weight: 800;}
.this-newsletter-date {margin-bottom: var(--space-35);font-size: var(--font-size-15); font-weight: 400;}
.this-newsletter-txt h3 {margin: var(--space-12) 0 var(--space-25);}

/* 참여와소통 > 갤러리 & 영상 */
#container.over-hidden {overflow: hidden;}
.page-community-gallery .board-top-slide {max-width: 660px; margin: 0 auto var(--space-90); text-align: center;}
.community-gallery-slide .slick-list {overflow: visible;}
.community-gallery-slide .campaign-list-txt .tit {margin-bottom: var(--space-15); color: #ccc; transition: .2s;}
.community-gallery-slide .active .campaign-list-txt .tit {color: var(--dark-color); transition: .2s;}
.community-gallery-slide .active:hover .campaign-list-txt .tit,
.community-gallery-slide .campaign-list-item:hover .campaign-list-txt .tit {color: var(--primary-color);}
.community-gallery-slide .campaign-list-txt .date {justify-content: center;}
.board-top-slide .community-gallery-slide .campaign-list-thumb {padding-bottom: 56.0345%;}
.community-gallery-slide .campaign-list-thumb:before {position: absolute; content:''; top: 0; right: 0; bottom: 0; left: 0; background: #fff; opacity: .76; transition: .3s; z-index: 1;}
.community-gallery-slide .active .campaign-list-thumb:before {opacity: 0;}
.page-community-gallery .board-top-slide .slick-arrow {width: 60px; height: 60px;}

.community-gallery-list > ul {display: flex; flex-wrap: wrap; margin: calc(var(--space-20) * -1);}
.community-gallery-list > ul > li {width: 25%; padding: var(--space-20);}
.community-gallery-item {position: relative;}
.community-gallery-item .thumb {position: relative; width: 100%; padding-bottom: 74.6875%; border-radius: var(--radius-24); overflow: hidden; box-shadow: 12px 12px 32px rgba(0, 0, 0, 0.12);}
.community-gallery-item .thumb img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.community-gallery-txt {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; gap: 15px; padding: var(--space-25) var(--space-30); background: rgba(0, 0, 0, 0.2); border-radius: var(--radius-24); color: rgba(255, 255, 255, 0.8); transition: .3s; pointer-events: none;;}
.community-gallery-txt .category {display: block; margin-bottom: var(--space-12); font-size: var(--font-size-14); font-weight: 600; line-height: 1.3em;}
.community-gallery-txt .tit {color: #fff; font-size: var(--font-size-18); font-weight: 700;}
.community-gallery-info {display: flex; justify-content: space-between; align-items: flex-end;}
.community-gallery-info .date {font-size: var(--font-size-13);}
.btn-gallery-view {opacity:0; display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 30px; background: rgba(255, 255, 255, 0.88); font-size: var(--font-size-14); font-weight: 600; line-height: 1em; color: var(--dark-color); transform: translateY(15px); transition: .3s;}
.btn-gallery-view:before {content: ''; display: block; width: 20px; height: 20px; background: url('/images/sub/campaign-list-plus.png') no-repeat center center / contain;}
.btn-gallery-view.btn-video:before {background-image: url('/images/sub/ambassador-play.png');}

.community-gallery-item:hover .community-gallery-txt {background: rgba(0,0,0,.7); pointer-events: auto;}
.community-gallery-item:hover .btn-gallery-view {opacity: 1; transform: translateY(0);}

.pop-gallery-head {margin-bottom: var(--space-45);}
.pop-gallery-head h2 {font-size: var(--font-size-32); line-height: 1.2em; font-weight: 800; color: var(--dark-color);}
.pop-gallery-info {display: flex; align-items: center; gap: 20px; margin-top: var(--space-25); font-size: var(--font-size-15); color: var(--gray-color);}
.pop-gallery-info .category {font-weight: 600; font-size: var(--font-size-16); color: var(--primary-color);}
.pop_wrap .education-large-gallery {width: 76.155%;}
.pop-gallery-txt {margin-top: var(--space-25); margin-bottom: var(--space-30);}
.pop-gallery-txt .pop-gallery-info {margin-top: 0; margin-bottom: 5px;}
.pop-gallery-txt .tit {font-size: var(--font-size-17); font-weight: 700; color: var(--dark-color); line-height: 1.1em;}
.pop_wrap .main-education-cnt {gap: var(--space-40)}

/* 참여와 소통 > Q&A */
.page-qna-form h2 {padding-bottom: var(--space-55); margin-bottom: var(--space-70); border-bottom: 3px solid var(--dark-color); font-size: var(--font-size-28); font-weight: 600; color: var(--dark-color); line-height: 1.5em;}
.qna-form {margin: calc(var(--space-20) * -1) calc(var(--space-30) * -1);}
.page-qna-form .row {display: flex; }
.page-qna-form .col {display: flex; align-items: center; flex:1; padding: var(--space-20) var(--space-30);}
.page-qna-form .col.flex-top {align-items: flex-start;}
.qna-form-tit {display: flex; align-items: center; height: fit-content; min-width: 160px; font-size: var(--font-size-20); font-weight: 600; color: var(--dark-color);}
[lang="en"] .qna-form-tit {min-width: 220px;}
.qna-form-tit:before {content :''; display: block; width: 8px; height: 8px; background: #dfdfdf; border-radius: 100%; margin-right: 12px;}
.qna-form-tit.required:before {background: var(--primary-color);}
.page-qna-form .col.flex-top .qna-form-tit {padding-top: var(--space-20);}
.qna-form-cnt {flex: 1;}
.qna-form-cnt .input {width: 100%; height: 60px; border-radius: 8px;}
.qna-form-cnt textarea.input {height: 250px;}
.radio-items {display: flex; flex-wrap: wrap; gap: var(--space-12) var(--space-30);}
.email-wrap {display: flex; align-items: center; gap: 12px; margin-bottom: var(--space-20);}
.email-wrap .input {flex: 1;}
.email-wrap > .input {max-width: 380px;}
.email-domain {display: flex; flex:1; gap: 6px; max-width: 480px;}
.email-chk {font-size: var(--font-size-16);}
.file-cnt {display: flex; gap: 6px;}
.btn-file {display: flex; align-items: center; justify-content: center; min-width: max-content; padding: 3px 20px; border-radius: 8px; background: var(--dark-color); color: #fff; border-color: var(--dark-color); font-size: var(--font-size-18); font-weight: 700; line-height: 1em;}
.file-cnt input {display: none;}
.file-cnt .input {display: flex; align-items: center;}
.faq-top-wrap {flex: 1;}

.qna-detail-head {position: relative; margin-bottom: var(--space-40); text-align: center;}
.page-community-view .qna-detail-head {padding: 0 180px;}
.qna-detail-head h2 {font-size: var(--font-size-36); font-weight: 800; line-height: 1.2em; color: var(--dark-color);}
.view-head-func {position: absolute; right: 0; top: 0; display: flex; gap: 15px;}
.view-head-func>a {position: relative; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border: 1px solid #ddd; border-radius: 100%;}
.view-head-func>a:hover {background: #f4f4f4;}
.view-head-func .btn-bookmark.checked {background: var(--primary-color);}
.view-head-func .btn-bookmark.checked img {filter: brightness(0) invert(1);}
.qna-detail-info {display: flex; justify-content: center; gap: 20px; margin-top: var(--space-20); font-size: var(--font-size-15); color: var(--gray-color);}
.qna-category {font-size: var(--font-size-16); font-weight: 600; color: var(--primary-color);}
.qna-detail-cnt {border-top: 2px solid var(--dark-color); border-bottom: 1px solid #eee;}
.qna-detail-cnt .group {max-width: 1200px; margin: 0 auto; padding: var(--space-40); color: #878787;}
.page-newsletter-view .qna-detail-cnt .group {max-width: 730px;}
.qna-detail-cnt .group:not(:last-child) {border-bottom: 1px solid #eee}
.qna-detail-cnt .group>ul>li {display: flex; }
.qna-detail-cnt .group>ul>li:not(:last-child) {margin-bottom: var(--space-30);}
.qna-info-tit {position: relative; width: 160px; height: fit-content; padding-left: 20px; font-size: var(--font-size-20); font-weight: 600; color: var(--dark-color);}
.qna-info-tit:before {content: ''; position: absolute; left: 0; top: 50%; margin-top: -4px; display: block; width: 8px; height: 8px; border-radius: 100%; background: #dfdfdf;}
.qna-detail-cnt .group.type2  {color: #505050;}
.group.type2 .qna-info-tit:before {background: var(--primary-color);}
.qna-info-cnt {flex: 1;}
.qna-detail-cnt a {font-weight: 500; color: #54c5ef;}
.qna-detail-cnt a span {display: flex; align-items: center; gap: 12px; font-size: var(--font-size-16); font-weight: 500; color: #505050;}
.qna-detail-cnt a span:after {content: ''; display: block; width: 16px; height: 16px; background: url('/images/sub/icon-download.png') no-repeat center center / contain;}

/* 참여와소통 > FAQ */
.qna-head {display: flex; align-items: center; gap: 20px; font-size: var(--font-size-16); font-weight: 700;}
.qna-head .btn-detail {background: var(--primary-color); color: #fff;}
.qna-head .btn-detail:after {filter:brightness(0) invert(1);}
.page-faq {border-top: 2px solid var(--dark-color);}
.page-faq.sec {border-top: 0;}
.page-faq h2 {font-size: var(--font-size-28); font-weight: 800; color: var(--dark-color);}
.page-faq .sec {padding: var(--space-100) 0;}
.page-faq .sec:not(:last-child) {border-bottom: 1px solid #eee}
.page-faq .sec.sec-faq-menu {padding: var(--space-30) 0;}
.sec-faq-menu ul {justify-content: center;}
.sec-faq-top {display: flex; gap: 35px;}
[lang="en"] .sec-faq-top {flex-direction: column;}
.sec-faq-top h2 {width: 27.142857%;}
[lang="en"] .sec-faq-top h2 {width: 100%;}
.sec-faq-top .group {padding: 0 var(--space-30); border-radius: var(--radius-16); background: #f4f4f4;}
.sec-faq-top .group:not(:last-child) {margin-bottom: 10px;}
.faq-top-head, .faq-top-body {padding: var(--space-30) 0;}
.faq-top-head {position: relative; display: flex; align-items: center; padding-right: 40px; cursor: pointer;}
.faq-top-head:after {content: ''; position: absolute; right: 0; top: 50%; margin-top: -4px; width: 14px; height: 9px; background: url('/images/sub/faq-top-arrow.png') no-repeat center center; background-size: contain; transform: scaleY(-1); filter: grayscale(1);}
.group.active .faq-top-head:after {transform: none; filter: none;}
.faq-top-head h3 {flex:1; font-size: var(--font-size-20); font-weight: 700; color: var(--dark-color);}
.faq-tit {display: flex; align-items: center; gap: var(--space-25); width: 235px;}
[lang="en"] .faq-tit {width: 310px;}
.page-faq .circle {display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 100%; background: var(--primary-color); color: #fff; font-size: var(--font-size-16); font-weight: 800; line-height: 1em;}
.faq-tit .faq-category {font-weight: 500; color: var(--gray-color);}
.faq-top-body  {display: none;border-top: 1px dashed #ddd;}
.faq-top-body .inner {display: flex; gap: var(--space-25);}
.page-faq .faq-top-body .circle {background: var(--dark-color);}
.faq-top-body .hashtags {display: flex; gap: 4px; flex-wrap: wrap; margin-top: var(--space-45);}
.faq-top-body .hashtags span {display: block; padding: 3px 15px; border-radius: 30px; border: 1px solid #eee; background: #fff; font-size: var(--font-size-14); font-weight: 600; color: var(--gray-color);}
.faq-top-body .hashtags span:before {content: '#';}
.page-faq .sec.sec-faq-all {padding-bottom: 0;}
.sec-faq-all h2 {margin-bottom: var(--space-35);}
.sec-faq-all .group {border-bottom: 1px solid #eee;}
.sec-faq-all .faq-top-head {padding-left: var(--space-30);}
.sec-faq-all .faq-top-body {background: #f4f4f4;}
.sec-faq-all .faq-top-body .inner {padding:0 var(--space-30);}
.page-faq .sec-faq-all .circle {border: 1px solid #ddd; background: #fff; color: var(--primary-color);}
.page-faq .sec-faq-all .faq-top-body .circle {color: var(--dark-color);}
.sec-faq-all .buttons {margin-top: 20px;}
.sec-faq-all .paginate {margin-top: var(--space-50);}

/* 참여와소통 > 상세 */
.view-bot-func {margin-bottom: var(--space-100);}
.view-bot-func .buttons {margin-top: 0;}
.func-head {display: flex; justify-content: space-between; align-items: center; margin-top: 20px;}
.like-dislike-wrapper {display: flex; gap: 30px;}
.like-dislike-wrapper button {display: flex; align-items: center; gap: 12px; font-weight: 600; color: var(--dark-color); font-size: var(--font-size-15); border: 0; background: transparent; cursor: pointer; }
.like-dislike-wrapper .icon {display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 100%; border: 1px solid #eee;}
.like-dislike-wrapper .icon img {filter: grayscale(1) brightness(.5);}
.like-dislike-wrapper strong {margin-left: 9px;}
.btn-dislike .icon img {transform: scale(-1);}
.like-dislike-wrapper button.checked {color: var(--primary-color); }
.like-dislike-wrapper button.checked .icon {border-color: var(--primary-color);}
.like-dislike-wrapper button.checked .icon img {filter: grayscale(0) brightness(1);}
.buttons a:hover {background: #f5f5f5;}