@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined');


/* ==========================================================================
   00. 공통 유틸 / 배경
   ========================================================================== */
.page-content {letter-spacing:-0.3px; word-break:keep-all;}

.p_top_2 {padding-top:2rem;}
.p_top_3 {padding-top:3rem;}
.p_top_4 {padding-top:4rem;}
.p_top_5 {padding-top:5rem;}
.p_top_6 {padding-top:6rem;}

.p_bottom_2 {padding-bottom:2rem;}
.p_bottom_3 {padding-bottom:3rem;}
.p_bottom_4 {padding-bottom:4rem;}
.p_bottom_5 {padding-bottom:5rem;}
.p_bottom_6 {padding-bottom:6rem;}

.t_white {color:#fafafa;}

/* 배경 레이어 (동일 배경색 통합) */
.sec-navy {background-color:#152a4d;}
.sec-white {background-color:#ffffff;}
.sec-paper, .sec-soft, .hsm-ci-bg, .vc-comm-bg {background-color:#f3f4f5;}

/* 부트스트랩 table 기본 border 제거 (전역) */
.table>tbody>tr>td, .table>tbody>tr>th,
.table>tfoot>tr>td, .table>tfoot>tr>th,
.table>thead>tr>td, .table>thead>tr>th {border-top:none;}


/* ==========================================================================
   01. 공통 컴포넌트 - 섹션 헤더 (label + title)
   schedule / worship / info(국내선교) / net(해외선교) / serve(디아코니아) / sec(중보기도)
   ========================================================================== */
.schedule-head, .worship-head, .info-head, .net-head, .serve-head, .sec-head {text-align:center;}
.schedule-head {margin-bottom:4rem;}
.worship-head, .info-head, .net-head, .serve-head {margin-bottom:3.5rem;}
.sec-head {margin-bottom:3rem;}

.schedule-label, .worship-label, .info-label, .net-label, .serve-label, .sec-label {display:block; margin-bottom:1rem; letter-spacing:0.15em; color:#031635; text-transform:uppercase; font-weight:700;}
.schedule-title, .worship-title, .info-title, .net-title, .serve-title, .sec-title {color:#031635; font-weight:700;}
.worship-title {margin-bottom:1.5rem;}


/* ==========================================================================
   02. 공통 컴포넌트 - 카드 (국내선교 / 해외선교 / 디아코니아)
   ========================================================================== */
.info-col, .net-col, .serve-col {margin-bottom:1.5rem; display:flex;}
.info-card, .net-card, .serve-card {width:100%; border-radius:20px; background-color:#ffffff;}
.info-card {display:flex; flex-direction:column; gap:1rem; padding:2.5rem 2rem; text-align:center;}
.net-card {padding:2.5rem;}
.serve-card {display:flex; flex-direction:column; padding:2.5rem;}

/* 국내선교 - 요약 카드 */
.info-num {color:#031635; font-weight:700;}
.info-text {line-height:1.7; color:#44474e;}

/* 해외선교 - 파송 네트워크 */
.net-card-title {margin-bottom:1.5rem; padding-bottom:1rem; border-bottom:2px solid #031635; color:#031635; font-weight:700;}
.net-sub-title {margin:1.5rem 0 0.75rem; color:#44474e; font-weight:600;}
.net-list {margin:0 0 0.5rem; padding:0; list-style:none; display:flex; flex-direction:column; gap:0.75rem;}
.net-list li {position:relative; padding-left:1.25rem; line-height:1.6; color:#191c1d;}
.net-list li::before {content:""; position:absolute; left:0; top:0.6em; width:0.4rem; height:0.4rem; border-radius:50%; background-color:#031635;}

/* 디아코니아 위원회 - 사역 카드 */
.serve-num {display:block; margin-bottom:1rem; letter-spacing:0.15em; color:#8293b8; font-weight:700;}
.serve-card-title {margin-bottom:1rem; color:#031635; font-weight:700;}
.serve-card-text {line-height:1.8; color:#44474e;}
.location_list {display:inline-flex; align-items:center; gap:5px;flex-wrap: wrap;}


/* ==========================================================================
   03. 공통 컴포넌트 - Hero 배너
   ========================================================================== */
.hero-banner {position:relative; background-size:cover; background-position:center;}
.hero-banner::before {background-color:rgba(0,0,0,0.55);content:""; position:absolute; inset:0; background-color:rgba(0,0,0,0.5); pointer-events:none; z-index:1;}
.hero-unit {position:relative; z-index:2; max-width:60rem; margin:auto; padding:6rem 0; text-align:center;}
.hero-label {display:block; margin-bottom:1.5rem; letter-spacing:0.2em; color:#c6e9ff; text-transform:uppercase; font-weight:700;}
.hero-title {margin-bottom:2rem; line-height:1.15; color:#ffffff; font-weight:700;}
.hero-desc {line-height:1.9; color:rgba(255,255,255,0.9);}

/* 변형 - 좌측 정렬형 (국내선교 / 해외선교 / 디아코니아 / 중보기도사역) */
.hero-banner--left::before {background-color:rgba(0,0,0,0.55);content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.5); pointer-events: none; z-index: 1;}
.hero-banner--left .hero-unit {max-width:52rem; margin:0 auto 0 0; text-align:left;}
.hero-banner--left .hero-desc {line-height:1.95;}

/* 변형 - 정보 리스트 포함 (중보기도사역) */
.hero-banner--info .hero-unit {max-width:60rem; padding:7rem 0;}
.hero-banner--info .hero-title {margin-bottom:1.75rem;}
.hero-banner--info .hero-desc {margin-bottom:2.5rem;}
.hero-info {margin:0; padding:2rem 0 0; border-top:1px solid rgba(255,255,255,0.2); list-style:none; display:flex; flex-direction:column; gap:1rem; max-width:40rem;}
.hero-info li {line-height:1.7; color:#e3e6ee;}
.hero-info-key {display:inline-block; min-width:4rem; margin-right:1.5rem; color:#ffffff; font-weight:600;}


/* ==========================================================================
   04. 공통 컴포넌트 - 좌우 분할 (Vision Split)
   ========================================================================== */
.vs-split {display:flex; flex-wrap:wrap; align-items:stretch; padding:4rem 0; margin:auto;}
.vs-reverse {flex-direction:row-reverse;}
.vs-text {display:flex; align-items:center;}
.vs-text-unit {margin:auto; padding:5rem 0;}
.vs-label {display:block; margin-bottom:1.5rem; letter-spacing:0.15em; text-transform:uppercase; font-weight:700;}
.vs-heading {margin-bottom:2rem; line-height:1.25; font-weight:700;}
.vs-desc {line-height:1.8;}
.vs-media {display:flex;}
.vs-media-unit {display:flex; width:100%;}
.vs-media-img {display:block; width:100%; height:100%; overflow:hidden; border-radius:20px;}
.vs-media-img img {overflow:hidden; border-radius:20px; object-fit:cover;}

.vs-dark .vs-label {color:#afc0e5;}
.vs-dark .vs-heading {color:#ffffff;}
.vs-dark .vs-desc {color:#afc0e5;}
.vs-reverse .vs-desc {color:#333; line-height:1.8;}
.vs-light .vs-label {color:#031635;}
.vs-light .vs-heading {color:#031635;}
.vs-light .vs-desc {color:#44474e;}

/* 변형 - 정보 리스트 포함 (해외선교) */
.vs-info {margin:1.5rem 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:0.5rem;}
.vs-info-key {display:inline-block; min-width:3rem; margin-right:0.75rem; font-weight:600;}
.vs-dark .vs-info li {color:#ffffff;}
.vs-dark .vs-info-key {color:#afc0e5;}
.vs-light .vs-info li {color:#191c1d;}
.vs-light .vs-info-key {color:#031635;}

/* 변형 - 패딩형 (국내선교 / 해외선교 / 디아코니아) */
.vs-split--padded {min-height:auto; padding:5rem 0;}
.vs-split--padded .vs-text-unit {max-width:32rem; padding:0;}

/* 변형 - 다음세대 */
.vs-split--gen .vs-heading {margin-bottom:1.5rem; line-height:1.25;}
.vs-split--gen .vs-split {min-height:32rem;}
.vs-split--gen.vs-dark .vs-desc, .vs-split--gen .vs-dark .vs-desc {color:#c5cad6;}
.vs-grid-1-1{display:grid;grid-template-columns:1fr 1fr;gap:3rem;}
.vs-grid-1-1 p{line-height:1.75;}
/* ==========================================================================
   05. 공통 컴포넌트 - 예배 시간표 테이블
   ========================================================================== */
.schedule-scroll {overflow-x:auto;}
.schedule-table {width:100%; border-collapse:collapse;}
.schedule-table thead tr {border-top:2px solid #031635; border-bottom:2px solid #031635;}
.schedule-table th {padding:1.5rem 1rem; text-align:left; letter-spacing:0.15em; color:#031635; font-weight:700; white-space:nowrap;}
.schedule-table tbody tr {border-bottom:1px solid rgba(197,198,207,0.4); transition:background-color 0.2s ease;}
.schedule-table tbody tr:hover {background-color:#f8f9fa;}
.schedule-table td {padding:1.2rem 1rem; color:#191c1d; white-space:nowrap;}
.schedule-dept {display:block; color:#031635; font-weight:600;}
.schedule-age {display:block; margin-top:0.25rem; color:#44474e; font-weight:400;}

/* 변형 - 중보기도 (note / foot 포함) */
.schedule-table--prayer th {letter-spacing:0.1em;}
.schedule-table--prayer td {padding:1.75rem 1rem; vertical-align:top; white-space:normal;}
.schedule-dept-prayer {display:block; margin-bottom:0.35rem; color:#031635; font-weight:600;}
.schedule-note {display:block; line-height:1.5; color:#44474e;}
.schedule-foot {margin-top:1.5rem; color:#44474e;}


/* ==========================================================================
   06. 공통 컴포넌트 - 소셜 링크 카드
   ========================================================================== */
.social-grid {display:grid; grid-template-columns:repeat(5,1fr); gap:1.5rem; margin:auto;}
.social-col {display:flex; flex-direction:column; min-width:0;}
.social-col > .dimode-unit {display:flex; flex-direction:column; flex:1; width:100%; min-width:0;}
.social-card {position:relative; display:flex; flex-direction:column; gap:1.25rem; height:100%; padding:2rem 1.75rem; border-radius:1.25rem; background-color:#ffffff; text-decoration:none; transition:transform 0.3s ease;}
.social-card:hover {transform:translateY(-0.5rem);}
.social-icon {display:block; width:2.5rem; height:2.5rem; min-width:2.5rem; flex-shrink:0; color:#031635;}
.social-body {display:flex; flex-direction:column; gap:0.5rem; min-width:0;}
.social-title {display:block; color:#191c1d; font-weight:600; line-height:1.35; word-break:keep-all; overflow-wrap:anywhere;}
.social-sub {display:block; color:#44474e; text-transform:uppercase; letter-spacing:0.1em; word-break:break-all; overflow-wrap:anywhere;}
.social-sub--id {text-transform:none; letter-spacing:0.02em; overflow-wrap:anywhere;}
.social-arrow {position:absolute; right:1.5rem; bottom:1.5rem; width:1.5rem; height:1.5rem; color:#031635; opacity:0; transition:opacity 0.3s ease;}
.social-card:hover .social-arrow {opacity:1;}

/* ==========================================================================
   07. 공통 컴포넌트 - 예배 시간 카드
   ========================================================================== */
.worship-lead {max-width:45rem; margin:auto; line-height:1.8; color:#44474e;}
.worship-col {margin-bottom:2rem; display:flex; flex-direction:column;}
.worship-card-img {overflow:hidden; border-radius:16px;}
.worship-img {display:block; width:100%; height:22rem; object-fit:cover; background-color:#d9dce3;}
.worship-card-txt {padding:1.75rem 0.5rem 0;}
.worship-dept {margin-bottom:0.75rem; color:#031635; font-weight:700;}
.worship-grade {color:#44474e; font-weight:400;}
.worship-desc {margin-bottom:1.25rem; line-height:1.7; color:#44474e;}
.worship-info {margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:0.5rem;}
.worship-info li {color:#191c1d;}
.worship-info-key {display:inline-block; min-width:3rem; margin-right:0.75rem; color:#031635; font-weight:600;}

/* 변형 - 미션소망부 */
.worship-card--mission .worship-img {height:18rem;}
.worship-card--mission .worship-dept {margin-bottom:1rem;}


/* ==========================================================================
   10. 교회비전
   ========================================================================== */
.hsm-intro-inner {display:flex; flex-direction:column; align-items:center;}
.hsm-intro-title {max-width:56rem; margin:0 auto 4rem; text-align:center; line-height:1.25; color:#fafafa; font-weight:700;}
.hsm-point {color:#1A2B4B; font-weight:700;}
.hsm-intro-img {width:100%; aspect-ratio:21/9;}

.hsm-img-reveal {position:relative; overflow:hidden; border-radius:1rem;}
.hsm-img-reveal img {width:100%; height:100%; object-fit:cover; display:block;}
.hsm-img-reveal:hover .hsm-song-img {transform:scale(1.1);}

.hsm-mission, .hsm-values, .hsm-slogan {display:flex; flex-wrap:wrap; align-items:center; gap:4rem 0;}
.hsm-values {align-items:flex-start;}
.core_wrap {display:grid; grid-template-columns:1fr 1fr; gap:3rem;}

.hsm-text-block {display:flex; flex-direction:column;}
.hsm-text-block h2 {font-weight:700; margin-bottom:2rem;}
.hsm-label {display:block; margin-bottom:1.5rem; color:#1A2B4B; letter-spacing:0.2em; font-size:0.75rem; text-transform:uppercase; font-weight:700;}
.hsm-desc-white {color:#fafafa; line-height:1.8;}
.hsm-desc {color:#5C5F60; line-height:1.8;}

.hsm-ratio-43 {aspect-ratio:4/3;}
.hsm-ratio-square {aspect-ratio:1/1;}

.hsm-values-title {margin-bottom:3rem;}
.hsm-value-list {list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:0.2rem;}
.hsm-value-item {display:flex; align-items:center; gap:1.5rem; padding-bottom:1rem;}
.hsm-value-item span:last-child {color:#121212;}
.hsm-num {color:#1A2B4B; font-weight:700;}

.hsm-ci-img {width:100%; height:auto; display:block; border-radius:1rem;}

.hsm-quote {margin-bottom:3rem; color:#1A2B4B; line-height:1.1; font-weight:600;}
.hsm-quote-strong {color:#121212; font-weight:700;}
.hsm-quote-cite {border-left:6px solid #1A2B4B; padding-left:2.5rem;}

.hsm-song-bg {background-color:#121212;}
.hsm-song-head {text-align:center; margin-bottom:5rem;}
.hsm-song-title {margin-bottom:1.5rem; color:#fafafa; font-weight:700;}
.hsm-song-sub {color:rgba(250,250,250,0.6); text-transform:uppercase; letter-spacing:0.2em;}
.hsm-song-grid {display:grid; grid-template-columns:repeat(2,1fr); gap:3rem;}
.hsm-ratio-song1, .hsm-ratio-song2 {display:flex; flex-direction:column; text-align:center;}
.reveal_title {margin-bottom:20px; color:#fff; font-weight:600;}

.hsm-parallax {will-change:transform;}
.hsm-slogan-box {align-self:flex-start; width:fit-content; max-width:100%;}
.hsm-slogan-box .hsm-slogan-sub {text-align:center; text-indent:0.3125rem;}

/* ==========================================================================
   11. 교회연혁
   ========================================================================== */
.hsh-timeline {position:relative;}

.hsh-year-nav {list-style:none; margin:0; padding:0 0 0 1.5rem; border-left:1px solid rgba(92,95,96,0.4); display:flex; flex-direction:column; gap:1rem;}
.hsh-year-link {display:block; font-family:'Noto Serif', serif; color:rgba(92,95,96,0.45); text-decoration:none; transition:color 0.3s ease;}
.hsh-year-link:hover {color:#1A2B4B;}
.hsh-year-link.is-active {color:#1A2B4B; font-weight:700;}

.hsh-tl-content-col {position:relative;}
.hsh-tl-content-col::before {content:''; position:absolute; left:5px; top:0; bottom:0; width:2px; background-color:rgba(92,95,96,0.25); z-index:0;}

.hsh-year-block {position:relative; padding-left:3.5rem; margin-bottom:6rem;}
.hsh-year-block:last-child {margin-bottom:0;}
.hsh-year-block:last-child::before {bottom:0;}
.hsh-dot {position:absolute; left:-4.3rem; top:1.5rem; width:12px; height:12px; border-radius:50%; background-color:#1A2B4B; border:3px solid #f8f9fa; z-index:2;}
.hsh-year-head {margin-bottom:1.5rem;}
.hsh-year-num {font-family:'Noto Serif', serif; color:#1A2B4B; line-height:1; font-weight:700;}
.hsh-year-bar {display:block; width:3rem; height:0.25rem; margin-top:1rem; background-color:#1A2B4B;}

.hsh-table {width:100%; border:none; margin:0; background-color:transparent;}
.hsh-table th, .hsh-table td {border:none; vertical-align:top !important; text-align:left; background-color:transparent;}
.hsh-table th {width:9.5rem; padding-right:2rem; white-space:nowrap; color:#1A2B4B; font-weight:700;}
.hsh-table td {color:#5C5F60; line-height:1.7;}
.hsh-td-title {display:block; margin-bottom:0.4rem; color:#121212; font-weight:600;}
.hsh-td-desc {display:block;}


/* ==========================================================================
   12. 원로목사
   ========================================================================== */
.hpr-body {display:grid; grid-template-columns:4fr 8fr; gap:4rem; align-items:start;}
.hpr-body > .hpr-profile-col, .hpr-body > .hpr-content-col {width:auto; float:none; margin:0; padding:0; min-width:0;}
.hpr-body > .hpr-profile-col {position:-webkit-sticky !important; position:sticky !important; top:2rem !important; align-self:start; z-index:5;}

/* 좌측 프로필 카드 */
.hpr-profile-card {border:0.0625rem solid rgba(197,198,207,0.4); border-radius:0.5rem; overflow:hidden; background-color:#ffffff;}
.hpr-profile-img {width:100%; aspect-ratio:3/4; overflow:hidden;}
.hpr-profile-img img {width:100%; height:100%; object-fit:cover; display:block;}
.hpr-profile-info {padding:1.5rem;}
.hpr-profile-name {color:#1A2B4B; font-weight:600;}
.hpr-profile-eng {color:#5C5F60; font-weight:400;}
.hpr-profile-role {margin-top:0.5rem; color:#1A2B4B; letter-spacing:0.1em; font-weight:700;}
.hpr-profile-quote {margin-top:1.5rem; padding-top:1.5rem; border-top:0.0625rem solid #c5c6cf; color:#5C5F60; line-height:1.7;}
.hpr-profile-contact {margin-top:1.25rem; display:flex; flex-direction:column; gap:0.5rem;}
.hpr-contact-item {color:#1A2B4B;}

/* 좌측 라인형 섹션 네비 */
.hpr-nav {margin-top:1.75rem; display:flex; flex-direction:column; border-left:0.0625rem solid #E3E5EA;}
.hpr-nav-link {display:block; padding:0.2rem 0 0.2rem 1.25rem; margin-left:-0.0625rem; border-left:0.125rem solid transparent; color:#A2A7B0; text-decoration:none; line-height:1.6; transition:color 0.2s ease, border-color 0.2s ease;}
.hpr-nav-link:hover {color:#1A2B4B; font-weight:700;}
.hpr-nav-link.is-active {color:#1A2B4B; font-weight:700; border-left-color:#1A2B4B;}

/* 우측 콘텐츠 */
.hpr-content-col {display:flex; flex-direction:column; gap:6rem; min-width:0;}
.hpr-content-col > * {min-width:0;}
.hpr-block {position:relative; scroll-margin-top:2rem; min-width:0;}
.hpr-edit-line {display:block; height:0.0625rem; margin-bottom:2rem; background:linear-gradient(to right, #1A2B4B 15%, #c5c6cf 15%);}
.hpr-sec-label {display:block; margin-bottom:1rem; color:#1A2B4B; letter-spacing:0.15em; text-transform:uppercase; font-weight:700;}
.hpr-sec-title {margin-bottom:2.5rem; color:#1A2B4B; font-weight:600;}
.hpr-no-mb {margin-bottom:0;}
.hpr-body-text {color:#5C5F60; line-height:2; word-break:keep-all; overflow-wrap:break-word;}

/* 인용 */
.hpr-quote-box {border-left:0.25rem solid #1A2B4B; padding:0.5rem 0 0.5rem 2rem; margin-bottom:2rem;}
.hpr-quote-text {color:#1A2B4B; line-height:1.4;}
.hpr-quote-cite {margin-top:1rem; color:#5C5F60;}

/* 표 */
.hpr-table {width:100%; border-collapse:collapse; margin:0; background-color:transparent; table-layout:fixed;}
.hpr-table th, .hpr-table td {border:none; border-bottom:0.0625rem solid rgba(197,198,207,0.4); padding:1rem 0; text-align:left; vertical-align:baseline; background-color:transparent;}
.hpr-table th {color:#1A2B4B; font-weight:700;}
.hpr-table td {color:#5C5F60; text-align:right; word-break:keep-all; overflow-wrap:break-word;}

/* 사역 타임라인 */
.hpr-ministry {position:relative; border-left:0.0625rem solid rgba(26,43,75,0.2); margin-left:0.25rem; padding-left:2.5rem; display:flex; flex-direction:column; gap:3rem;}
.hpr-ministry-item {position:relative;}
.hpr-min-dot {position:absolute; left:-2.85rem; top:0.35rem; width:0.5rem; height:0.5rem; border-radius:50%; background-color:#1A2B4B; outline:0.5rem solid #f8f9fa;}
.hpr-min-dot-2 {background-color:rgba(26,43,75,0.4);}
.hpr-min-dot-3 {background-color:rgba(26,43,75,0.2);}
.hpr-min-period {margin-bottom:0.25rem;}
.hpr-min-period-sub {color:#5C5F60;}
.hpr-min-title {color:#1A2B4B; font-weight:600;}
.hpr-min-desc {margin-top:0.5rem; color:#5C5F60; word-break:keep-all; overflow-wrap:break-word;}

/* 약력 2단 */
.hpr-career-grid {display:grid; grid-template-columns:repeat(2,1fr); gap:3rem; min-width:0;}
.hpr-career-col {min-width:0;}
.hpr-career-head {width:fit-content; margin-bottom:1.5rem; padding-bottom:0.25rem; border-bottom:0.125rem solid #1A2B4B; color:#1A2B4B; font-weight:600;}
.hpr-career-head-sub {color:#5C5F60; border-bottom-color:#c5c6cf;}
.hpr-career-list {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1rem; color:#5C5F60;}
.hpr-career-list li {position:relative; padding-left:1rem; word-break:keep-all; overflow-wrap:break-word;}
.hpr-career-list li::before {content:'•'; position:absolute; left:0; color:#1A2B4B;}

/* 저서 */
.hpr-books-head {display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:2.5rem;}
.hpr-books-sub {color:#5C5F60;}
.hpr-books-grid {display:grid; grid-template-columns:repeat(3,1fr); gap:1rem 2rem; min-width:0;}
.hpr-books-grid2 {display:grid; grid-template-columns:repeat(2,1fr); gap:1rem 2rem; min-width:0;}
.hpr-books-grid > .hpr-book, .hpr-books-grid2 > .hpr-book {float:none; width:auto; margin:0; min-width:0;}

.hpr-book {display:flex; flex-direction:column; flex-wrap:wrap; align-items:center; gap:1rem; padding:0.85rem 1rem; background-color:#edeeef; border-radius:0.5rem; transition:background-color 0.3s ease;}
.hpr-book-img {flex-shrink:0; width:100%; max-width:11rem; overflow:hidden; background-color:#d9dce3;}
.hpr-book-img img {width:100%; height:100%; aspect-ratio:300/427; border-radius:0.25rem; object-fit:cover; display:block;}
.hpr-book-txt {flex:1; min-width:0; text-align:center;}
.hpr-book-title {margin-bottom:0.25rem; color:#121212; word-break:keep-all; overflow-wrap:break-word; transition:color 0.3s ease;}
.hpr-book-pub {color:#5C5F60; transition:color 0.3s ease;}
.hpr-book:hover {background-color:#1A2B4B;}
.hpr-book:hover .hpr-book-title {color:#fafafa;}
.hpr-book:hover .hpr-book-pub {color:rgba(250,250,250,0.7);}

.hpr-more-btn {display:inline-block; margin-top:2rem; padding-bottom:0.25rem; border-bottom:0.0625rem solid #1A2B4B; color:#1A2B4B; letter-spacing:0.15em; font-weight:700; text-decoration:none; transition:color 0.3s ease;}
.hpr-more-btn:hover {color:#5C5F60;}

/* 논문 및 번역서 */
.hpr-paper-subhead {width:fit-content; margin-bottom:1.5rem; padding-bottom:0.5rem; border-bottom:0.125rem solid #1A2B4B; color:#1A2B4B; font-weight:600;}
.hpr-paper-subhead-2 {margin-top:3rem;}


/* ==========================================================================
   13. 섬기는분들
   ========================================================================== */
/* 타이틀 */
.sok-head {border-left:4px solid #1A2B4B; padding-left:1.5rem; margin-bottom:3rem;}
.sok-label {display:block; margin-bottom:0.5rem; color:#1A2B4B; letter-spacing:0.15em; text-transform:uppercase; font-weight:700;}
.sok-title {color:#121212; font-weight:600; margin:0;}

/* 소제목 */
.sok-subhead {border-left:4px solid #1A2B4B; padding-left:1rem;}
.sok-subtitle {color:#121212; font-weight:600; margin:0;}

/* 그리드 */
.sok-grid {display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; padding:0 15px;}
.sok-grid-6 {display:grid; grid-template-columns:repeat(6,1fr); gap:1.5rem; padding:0 15px;}
.sok-grid > .sok-card, .sok-grid-6 > .sok-card {height:100%;}

/* 카드 */
.sok-card {display:flex; flex-direction:column; padding:1.5rem; border-radius:20px; overflow:hidden; background-color:#f3f4f5; transition:transform 0.3s ease;}
.sok-card:hover {transform:translateY(-4px);}
.sok-img {overflow:hidden; border-radius:20px; background-color:#e1e3e4; margin-bottom:1.5rem;}
.sok-img img {aspect-ratio:5/6; width:100%; height:100%; object-fit:cover; display:block; transition:filter 0.5s ease, transform 0.5s ease;}
.sok-card:hover .sok-img img {filter:grayscale(0%); transform:scale(1.05);}
.sok-card-body {display:flex; flex-direction:column; flex:1;}
.sok-tag {display:inline-block; width:fit-content; margin-bottom:0.75rem; padding-bottom:0.25rem; border-bottom:1px solid rgba(26,43,75,0.2); color:#1A2B4B;}
.sok-name {margin:0 0 0.25rem; color:#121212; font-weight:600;}
.sok-role {margin:0; color:#5C5F60;}
.sok-tel {margin:0.5rem 0 0; color:#5C5F60; letter-spacing:0.02em;}

/* 장로 카테고리 */
.sok-elder-cat-row {padding:0 15px; margin:2rem 0 1.25rem;}
.sok-elder-cat {width:fit-content; margin:0; padding-bottom:0.25rem; border-bottom:2px solid #1A2B4B; color:#1A2B4B; font-weight:700;}

/* 그룹 네비게이션 */
.sok-nav-comp {position:sticky; top:0; z-index:50; margin:0 auto; background-color:#ffffff;}
.sok-nav {display:flex; flex-wrap:nowrap; gap:0.5rem; margin:auto; padding:1rem 15px; overflow-x:auto;}
.sok-nav::-webkit-scrollbar {height:0;}
.sok-nav-btn {flex-shrink:0; display:inline-block; padding:0.5rem 1.1rem; border:1px solid rgba(197,198,207,0.7); border-radius:999px; color:#5C5F60; text-decoration:none; white-space:nowrap; cursor:pointer; transition:color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;}
.sok-nav-btn:hover {color:#1A2B4B; border-color:#1A2B4B;}
.sok-nav-btn.is-active {color:#ffffff; background-color:#1A2B4B; border-color:#1A2B4B;}
#component3931, #component1480, #component2454, #component2453,
#component1880, #component7224, #component5882 {scroll-margin-top:4.5rem;}


/* ==========================================================================
   14. 비전채플
   ※ 주의: .vs-* 접두어는 공통 좌우 분할(04번)과 이름이 겹칩니다.
   ========================================================================== */
/* 비전 섹션 */
.vs-band {position:relative;}
.vs-dark {background-color:#1A2B4B;}
.vs-light {background-color:#f3f4f5;}
.vs-grid {display:grid; grid-template-columns:3fr 2fr; gap:4rem; align-items:center;}
.vs-grid2 {display:grid; grid-template-columns:2fr 3fr; gap:4rem; align-items:center;}

.vs-text-col, .vs-img-col {display:flex; align-items:center;}
.vs-text-block {width:100%;}
.vs-num {display:block; margin-bottom:0.5rem; color:rgba(26,43,75,0.15); line-height:1; font-weight:700;}
.vs-num-light {color:rgba(250,250,250,0.2);}
.vs-title, .vs-title-light {color:#fafafa; font-weight:600; line-height:1.3; margin-bottom:1.5rem;}
.vs-desc {color:#fff; line-height:1.8; margin-bottom:1.25rem;}
.vs-desc-light {color:rgba(250,250,250,1);}
.vs-desc:last-child {margin-bottom:0;}
.sec-text2 {padding-bottom:10rem;}

.vs-quote-list {border-left:3px solid #7DA8D1; padding-left:1.5rem; margin:1.5rem 0;}
.vs-quote-item {color:#fafafa; line-height:1.6; margin-bottom:0.75rem;}
.vs-quote-item:last-child {margin-bottom:0;}
.vs-quote-light .vs-quote-item {color:#082541;}

.vs-blockquote {color:#1A2B4B; font-weight:600; line-height:1.6; border-left:4px solid #1A2B4B; padding-left:1.5rem; margin:1.5rem 0;}
.vs-blockquote-light {color:#7DA8D1; border-left-color:#7DA8D1;}

.vs-img-frame {width:100%; border-radius:20px; overflow:hidden; background-color:#e1e3e4; aspect-ratio:4/3;}
.vs-img-frame img {width:100%; height:100%; object-fit:cover; display:block; transition:transform 0.7s ease;}
.vs-img-frame:hover img {transform:scale(1.05);}

/* 배경 이미지 위 가독성 오버레이 — PC/모바일 공통 적용 */
.vs-band::before {content:""; position:absolute; inset:0; z-index:1; pointer-events:none;}
.vs-band.vs-dark::before {background-color:rgba(15,25,45,0.65);}
.vs-band.vs-light::before {background-color:rgba(15,25,45,0.55);}
.vs-band > .dimode-sort {position:relative; z-index:2;}

/* 오버레이 위에서 어두운 글자색을 밝게 전환 */
.vs-desc:last-child, .vs-light .vs-desc {color:#d2e9ff;}
.vs-quote-light .vs-quote-item {color:#d2e9ff;}
.vs-blockquote {color:#d2e9ff; border-left-color:#d2e9ff;}

/* 공통 섹션 헤드 */
.vc-section-head {border-left:4px solid #1A2B4B; padding-left:1.5rem; margin-bottom:3rem;}
.vc-section-head.vc-center {border-left:none; padding-left:0; text-align:center;}
.vc-label {display:block; margin-bottom:0.75rem; color:#1A2B4B; letter-spacing:0.15em; text-transform:uppercase; font-weight:700;}
.vc-section-title {color:#121212; font-weight:600; margin:0;}

/* 공간안내 아코디언 */
.vc-floor-item {background-color:#fafafa; border:1px solid rgba(197,198,207,0.5); border-radius:20px; overflow:hidden; margin-bottom:1rem;}
.vc-floor-btn {width:100%; display:flex; align-items:center; justify-content:space-between; padding:2rem; background:transparent; border:none; cursor:pointer; text-align:left; transition:background-color 0.2s ease;}
.vc-floor-btn:hover {background-color:#f3f4f5;}
.vc-floor-btn-left {display:flex; align-items:baseline; gap:1.5rem;}
.vc-floor-num {color:#1A2B4B; font-weight:700; line-height:1;}
.vc-floor-name {color:#121212; font-weight:600;}
.vc-floor-icon {flex-shrink:0; color:#1A2B4B; font-size:2rem; font-weight:300; line-height:1; transition:transform 0.3s ease;}
.vc-floor-item.active .vc-floor-icon {transform:rotate(45deg);}
.vc-floor-panel {max-height:0; overflow:hidden; transition:max-height 0.6s ease-in-out;}
.vc-floor-item.active .vc-floor-panel {max-height:2000px;}
.vc-floor-grid {display:grid; grid-template-columns:8fr 6fr; gap:2.5rem; align-items:center; padding:2rem; border-top:1px solid rgba(197,198,207,0.5);}
.vc-floor-bigimg {border-radius:20px; overflow:hidden; aspect-ratio:4/3;}
.vc-floor-bigimg img {width:100%; height:100%; aspect-ratio:4/3; border-radius:20px; object-fit:cover; display:block;}
.vc-floor-info-title {color:#1A2B4B; font-weight:700; margin-bottom:1rem;}
.vc-floor-list {color:#5C5F60; line-height:1.9; margin:0 0 1.5rem;}
.vc-floor-subgrid {display:grid; grid-template-columns:1fr 1fr; gap:1rem;}
.vc-floor-subgrid-4 {grid-template-columns:repeat(4,1fr);}
.vc-floor-subimg {border-radius:20px; overflow:hidden; aspect-ratio:4/3; background-color:#e1e3e4;}
.vc-floor-subimg img {width:100%; height:100%; object-fit:cover; display:block;}

/* 시설이용 / 대관안내 */
.vc-app-cards {display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:stretch;}
.vc-app-cards > [class*="col-sm"] {display:flex; flex-direction:column; float:none; width:100%; height:100%;}
.vc-app-cards > [class*="col-sm"] > .dimode-unit {display:flex; flex-direction:column; flex:1; width:100%; height:100%;}
.vc-app-card {display:flex; flex-direction:column; flex:1; width:100%; height:100%; background-color:#fafafa; border:1px solid rgba(197,198,207,0.5); border-radius:20px; padding:2.5rem;}
.vc-app-icon {width:3.5rem; height:3.5rem; display:flex; align-items:center; justify-content:center; background-color:#f3f4f5; border-radius:16px; margin-bottom:1.5rem;}
.vc-app-icon .material-symbols-outlined {color:#1A2B4B; font-size:1.75rem; line-height:1;}
.vc-app-title {color:#121212; font-weight:600; margin-bottom:1.5rem;}
.vc-app-body {flex:1;}
.vc-app-step-label {color:#1A2B4B; font-weight:700; letter-spacing:0.03em; margin:1.5rem 0 0.75rem;}
.vc-app-step-label:first-child {margin-top:0;}
.vc-app-step {color:#5C5F60; line-height:1.7; margin-bottom:0.5rem; padding-left:2rem; text-indent:-2rem;}
.vc-app-num {color:#1A2B4B; font-weight:700; margin-right:0.5rem;}
.vc-app-note {border-top:1px solid rgba(197,198,207,0.5); margin-top:1.5rem; padding-top:1.5rem;}
.vc-app-note-item {color:#5C5F60; line-height:1.7; margin-bottom:0.4rem;}
.vc-app-note-item:last-child {margin:0;}

/* 건축위원회 */
.vc-comm-card {background-color:#fafafa; border:1px solid rgba(197,198,207,0.5); border-radius:20px; padding:2.5rem; height:100%; margin-bottom:1.5rem;}
.vc-comm-tag {display:inline-block; color:#7DA8D1; font-weight:700; letter-spacing:0.05em; margin-bottom:0.5rem;}
.vc-comm-title {color:#121212; font-weight:600; margin-bottom:1.25rem;}
.vc-comm-desc {color:#5C5F60; line-height:1.8; margin:0;}
.vc-dream-head {text-align:center; margin:2.5rem 0;}
.vc-dream-title {color:#1A2B4B; font-weight:700; margin-bottom:0.75rem; letter-spacing:0.05em;}
.vc-dream-sub {color:#5C5F60; margin:0;}
.vc-dream-list {display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-bottom:2rem;}
.vc-dream-item {background-color:#fafafa; border-radius:20px; padding:1.75rem;}
.vc-dream-name {display:block; color:#1A2B4B; margin-bottom:0.75rem;}
.vc-dream-name strong {color:#121212;}
.vc-dream-desc {color:#5C5F60; line-height:1.7; margin:0;}
.vc-dream-outro {color:#5C5F60; line-height:1.8; margin:0;}


/* ==========================================================================
   15. 새가족등록
   ========================================================================== */
/* HERO */
.nf-hero-bg {position:relative; padding:7rem 0; background-size:cover; background-position:center;}
.nf-hero-bg::before {content:''; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(18,18,18,0.4), rgba(18,18,18,0.7)); z-index:1;}
.nf-hero-inner {position:relative; z-index:2; text-align:center; max-width:56rem; margin:0 auto;}
.nf-hero-label {display:block; margin-bottom:1.5rem; color:#7DA8D1; letter-spacing:0.3em; text-transform:uppercase; font-weight:700;}
.nf-hero-title {margin-bottom:2rem; color:#fafafa; line-height:1.2; font-weight:700;}
.nf-hero-quote {max-width:48rem; margin:0 auto; color:rgba(250,250,250,0.9); line-height:1.8; font-style:normal;}

/* SECTION HEAD */
.nf-section-head {text-align:center;}
.nf-label {display:block; margin-bottom:1rem; color:#1A2B4B; letter-spacing:0.15em; text-transform:uppercase; font-weight:700;}
.nf-section-title {color:#1A2B4B; font-weight:600; margin:0;}

/* STEPS */
.nf-step-grid {display:grid; grid-template-columns:repeat(6,1fr); gap:2rem; position:relative;}
.nf-step-grid::before {content:''; position:absolute; top:2.5rem; left:10%; right:10%; height:1px; background-color:rgba(197,198,207,0.6); z-index:0;}
.nf-step {position:relative; z-index:1; text-align:center; display:flex; flex-direction:column; align-items:center;}
.nf-step-icon {display:flex; align-items:center; justify-content:center; width:5rem; height:5rem; border-radius:50%; background-color:#d8e2ff; margin-bottom:1.5rem;}
.nf-step-icon .material-symbols-outlined {color:#1A2B4B; font-size:2rem; font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;}
.nf-step-label {margin-bottom:0.5rem; color:#7DA8D1; letter-spacing:0.15em; text-transform:uppercase; font-weight:700;}
.nf-step-title {margin-bottom:1rem; color:#1A2B4B; font-weight:600;}
.nf-step-desc {margin:0; color:#5C5F60; line-height:1.7; max-width:none;}

/* 온라인 등록 안내 */
.nf-online-head {text-align:center; margin-bottom:3.5rem;}
.nf-online-label {display:block; margin-bottom:1rem; color:#7DA8D1; letter-spacing:0.15em; text-transform:uppercase; font-weight:700;}
.nf-online-title {color:#fafafa; font-weight:600; margin:0;}
.nf-online-img {overflow:hidden; border-radius:20px; background-color:#2a3f63;}
.nf-online-img img {display:block; width:100%; aspect-ratio:5/3; object-fit:cover;}
.nf-online-body {display:flex; flex-direction:column;}
.nf-online-text {margin:0 0 1rem; color:rgba(250,250,250,0.92); line-height:1.9;}
.nf-online-note {margin:0 0 2rem; color:rgba(250,250,250,0.6); line-height:1.7;}
.nf-online-btn {display:inline-block; width:fit-content; padding:0.9rem 2rem; border-radius:999px; background-color:#fafafa; color:#1A2B4B; letter-spacing:0.02em; font-weight:700; text-decoration:none; transition:background-color 0.25s ease, color 0.25s ease;}
.nf-online-btn:hover {background-color:#d8e2ff; color:#1A2B4B;}


/* ==========================================================================
   16. 오시는길
   ========================================================================== */
.way-grid {display:grid; grid-template-columns:7fr 5fr; gap:3rem; padding:5rem 0; align-items:start;}
.way-grid > .way-map-col, .way-grid > .way-info-col {width:auto; float:none; margin:0; padding:0;}

.way-info-col {display:flex; flex-direction:column; gap:1.5rem;}
.way-card {padding:0 2rem 2rem; border-bottom:1px solid #121212; transition:border-color 0.3s ease;}
.way-card:hover {border-color:rgba(26,43,75,0.3);}
.way-card-title {color:#1A2B4B; font-weight:600; margin-bottom:1rem;}
.way-card-text {color:#121212; line-height:1.7; margin:0;}
.way-card-sub, .way-card-muted {color:#5C5F60;}
.way-copy-btn {margin-top:1rem; padding:0.5rem 1rem; background:transparent; color:#1A2B4B; border:1px solid #1A2B4B; border-radius:8px; cursor:pointer; font-weight:600; transition:background-color 0.2s ease, color 0.2s ease;}
.way-copy-btn:hover, .way-copy-btn.is-copied {background-color:#1A2B4B; color:#fafafa;}

.way-bus-label {font-weight:600; margin-bottom:1rem;}
.way-bus-chips {display:flex; flex-wrap:wrap; gap:0.5rem;}
.way-chip {display:inline-block; padding:0.35rem 0.85rem; border-radius:50px; background-color:#d0e2f9; color:#202b4c; font-weight:600; transition:background-color 0.2s ease, color 0.2s ease;}
.way-chip:hover {background-color:rgba(26,43,75,0.1); color:#1A2B4B;}
.way-bus-label {font-weight:600; margin-bottom:1.25rem;}
.way-bus-group {margin-bottom:1.25rem;}
.way-bus-group:last-child {margin-bottom:0;}
.way-bus-stop {display:flex; align-items:center; gap:0.5rem; color:#5C5F60; font-weight:600; margin:0 0 0.6rem;}
.way-bus-stop::before {content:''; width:0.35rem; height:0.35rem; border-radius:50%; background:#1A2B4B; flex-shrink:0;}
.way-bus-chips {display:flex; flex-wrap:wrap; gap:0.5rem;}
.way-chip {display:inline-flex; align-items:center; gap:0.3rem; padding:0.35rem 0.85rem; border-radius:50px; background-color:#d0e2f9; color:#202b4c; font-weight:600; transition:background-color 0.2s ease, color 0.2s ease;}
.way-chip:hover {background-color:rgba(26,43,75,0.1); color:#1A2B4B;}
.way-chip-village {background-color:#dff0e4; color:#1f5c33;}
.way-chip-village:hover {background-color:rgba(31,92,51,0.12); color:#1f5c33;}
.way-chip-tag {font-size:0.75em; font-weight:500; opacity:0.8;}

/* --- 구분 내비게이션 --- */
.bus_nav {display:flex; flex-wrap:wrap; gap:0.5rem; justify-content:center;}
.bus_nav_link {display:inline-block; padding:0.55rem 1.5rem; border:1px solid #d3dce6; border-radius:9999px; background:#ffffff; color:#5d5d5d; font-weight:600; letter-spacing:0.02em; text-decoration:none; transition:background 0.25s ease, border-color 0.25s ease, color 0.25s ease;}
.bus_nav_link:hover, .bus_nav_link:focus {background:#f4f8fc; border-color:#303E60; color:#303E60; text-decoration:none;}
.bus_nav_link:focus-visible {outline:2px solid #303E60; outline-offset:2px;}

/* --- 섹션 헤더 --- */
.bus_sec {scroll-margin-top:6rem;}
.bus_sec_head {text-align:center; margin-bottom:2.5rem;}
.bus_sec_eng {color:#303E60; font-weight:700; letter-spacing:0.28em; text-transform:uppercase; margin:0 0 0.75rem;}
.bus_sec_title {color:#121212; font-weight:700; margin:0 0 0.75rem; line-height:1.3;}
.bus_sec_note {color:#5d5d5d; margin:0; line-height:1.6;}

/* --- 노선 개요표 (3분할) --- */
.bus_ov_cap {color:#121212; font-weight:700; margin:0; line-height:1.35;}
.bus_ov_grid {display:grid; grid-template-columns:repeat(3, 1fr); gap:2.5rem;margin-top:30px;align-items:start;}
.bus_ov_grid::before, .bus_ov_grid::after {display:none !important;}
.bus_ov_col {min-width:0; width:auto !important; float:none !important;}
.bus_ov_box {min-width:0;}
.bus_ov_tbl {width:100%; border-collapse:collapse; table-layout:fixed;}
.bus_ov_c1 {width:26%;}
.bus_ov_c2 {width:74%;}
.bus_ov_tbl th, .bus_ov_tbl td {padding:0.8rem 0.9rem; text-align:left; vertical-align:middle; border-bottom:1px solid #eef1f5;}
.bus_ov_tbl thead th {background:#303e75;color: #fff;border-bottom:1px solid #c8d4e4; white-space:nowrap;}
.bus_ov_no {color:#303E60; font-weight:700; white-space:nowrap;}
.bus_ov_route {color:#121212; line-height:1.5; overflow-wrap:anywhere;}
.bus_ov_tbl tbody tr:last-child th, .bus_ov_tbl tbody tr:last-child td {border-bottom:none;}

/* --- 차량 카드 그리드 (컴포넌트 단위) --- */
.bus_grid {display:grid; grid-template-columns:repeat(3, 1fr); gap:2.5rem; align-items:stretch;    padding: 5rem 0 3rem 0;}
.bus_grid::before, .bus_grid::after {display:none !important;}
.bus_col {min-width:0; width:auto !important; float:none !important; display:flex;}
.bus_col:hover{background:#ddd;}
.bus_col > .dimode-unit, .bus_col > .dimode-unit {width:100%; display:flex;}
.bus_card {display:flex; flex-direction:column; width:100%; min-width:0;  overflow:hidden; background:#ffffff;}
.bus_card_head {padding:1.5rem 1.5rem 1.25rem; background:#f8fafe; border-bottom: 2px solid #2a4e81;
    border-top: 2px solid #2a4e81;}
.bus_no {color:#121212; font-weight:700; margin:0 0 0.35rem; line-height:1.2;}
.bus_route {color:#303E60; font-weight:600; margin:0 0 0.5rem; line-height:1.5; overflow-wrap:anywhere;}
.bus_size {display:inline-block; padding:0.2rem 0.7rem; border-radius:9999px; background:#d0e2f9; color:#202b4c; font-weight:600; margin:0 0 0.5rem;}
.bus_driver {color:#5d5d5d; margin:0; line-height:1.5; overflow-wrap:anywhere;}

/* --- 시간표 --- */
.bus_tbl_box {flex:1 1 auto; overflow-x:auto; -webkit-overflow-scrolling:touch;}
.bus_tbl {width:100%; border-collapse:collapse; table-layout:fixed;}
.bus_col_area {width:22%;}
.bus_col_stop {width:44%;}
.bus_col_time {width:17%;}
.bus_tbl th, .bus_tbl td {padding:0.7rem 0.75rem; text-align:left; vertical-align:middle; border-bottom:1px solid #eef1f5; line-height:1.45;}
.bus_th {background:#ffffff; color:#5d5d5d; font-weight:700; letter-spacing:0.05em; white-space:nowrap; border-bottom:1px solid #c8d4e4;}
.bus_area {color:#303E60; font-weight:700; vertical-align:top; border-right:1px solid #eef1f5; overflow-wrap:anywhere;}
.bus_stop {color:#121212; overflow-wrap:anywhere;}
.bus_time {color:#5d5d5d; font-weight:600; white-space:nowrap; text-align:right;}
.bus_tbl tbody tr:last-child th, .bus_tbl tbody tr:last-child td {border-bottom:none;}
.bus_row.is-last td, .bus_row.is-last th {background:#f8fafe;}
.bus_row.is-last .bus_stop {color:#303E60; font-weight:700;}
.bus_row.is-last .bus_time {color:#303E60;}

/*CMS 탭메뉴 (.subnav) — 알약형 버튼*/
.subnav.nav-tabs {display:flex; flex-wrap:wrap; gap:0.5rem; align-items:center; justify-content:center; border-bottom:0; margin:0 0 0.5rem; padding:0;}
.subnav.nav-tabs::before, .subnav.nav-tabs::after {display:none !important;}
.subnav.nav-tabs > li {float:none; margin:0; position:relative;}
.subnav.nav-tabs > li > a {display:block; margin:0; padding:0.6rem 1.6rem; border:1px solid #d3dce6; border-radius:9999px; background:#ffffff; color:#6f88a3; font-size:0.95rem; font-weight:600; letter-spacing:0.01em; line-height:1.5; white-space:nowrap; text-decoration:none; transition:background 0.25s ease, border-color 0.25s ease, color 0.25s ease;}
.subnav.nav-tabs > li > a:hover, .subnav.nav-tabs > li > a:focus {background:#f4f8fc; border-color:#303E60; color:#303E60; text-decoration:none;}
.subnav.nav-tabs > li.active > a, .subnav.nav-tabs > li.active > a:hover, .subnav.nav-tabs > li.active > a:focus {background:#303E60; border-color:#303E60; color:#ffffff; cursor:default;}
.subnav.nav-tabs > li > a:focus-visible {outline:2px solid #303E60; outline-offset:2px;}
.navtabs .tab-content {padding:2.5rem 0 0 !important;}

/* --- 노선표 → 차량카드 이동 버튼 --- */
.bus_ov_c1 {width:20%;}
.bus_ov_c2 {width:58%;}
.bus_ov_c3 {width:22%;}

.bus_ov_tbl td.bus_ov_act {text-align:right; overflow:hidden;}
.bus_ov_btn {display:inline-block; padding:0.25rem 0.75rem;font-size:0.7rem; border:1px solid #303E60; border-radius:9999px; background:#ffffff; color:#303E60; font-weight:600; white-space:nowrap; text-decoration:none; transition:background 0.2s ease, color 0.2s ease;}
.bus_ov_btn:hover, .bus_ov_btn:focus {background:#303E60; color:#ffffff; text-decoration:none;}
.bus_ov_btn:focus-visible {outline:2px solid #303E60; outline-offset:2px;}
.bus_ov_grid.is-single {grid-template-columns:1fr; /* max-width:38rem;  */margin-left:auto; margin-right:auto;}
.bus_card {scroll-margin-top:6rem;}
.bus_card.is-target .bus_card_head {background:#eaf2ff;}

#daumRoughmapContainer1787299726565 .cont{display:none;}

.way-map-box {width:100%; aspect-ratio:4/3; border-radius:20px; overflow:hidden;}
.way-map-box .root_daum_roughmap {width:100% !important; height:100% !important; margin:0 !important;}
.way-map-box .root_daum_roughmap .wrap_map {width:100% !important; height:100% !important;}
.way-map-box .root_daum_roughmap .wrap_controllers {display:none;}

/* ==========================================================================
   17. 행정안내
   ========================================================================== */
.ag-container {font-family:'Noto Sans KR', sans-serif;}
.ag-bold {font-weight:700;}
.ag-text-primary {color:#031635;}
.ag-text-muted {color:#44474e;}
.ag-text-white {color:#ffffff;}
.ag-text-white-muted {color:rgba(255,255,255,0.8);}
.ag-bg-white {background-color:#ffffff;}
.ag-bg-primary {background-color:#031635;}
.ag-title-margin {margin-bottom:0.5rem;}
.ag-img-icon {width:2rem; height:2rem; opacity:0.8; filter:invert(8%) sepia(51%) saturate(3015%) hue-rotate(205deg) brightness(96%) contrast(98%);}

.ag-header {text-align:center;}
.ag-label {display:block; margin-bottom:1rem; color:#031635; text-transform:uppercase; letter-spacing:0.1em; font-weight:600;}
.ag-title {margin-bottom:2rem; color:#191c1d; font-weight:700;}

.ag-nav {display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; border-bottom:1px solid rgba(197,198,207,0.3);}
.ag-nav-link {padding:0 1.5rem 1rem; border-bottom:2px solid transparent; color:#44474e; text-decoration:none; font-weight:700; opacity:0.6; transition:all 0.3s ease;}
.ag-nav-link:hover, .ag-nav-link.ag-active {opacity:1; color:#031635; border-bottom-color:#031635;}

.ag-account-card {height:100%; padding:2.5rem; border:1px solid rgba(197,198,207,1); border-radius:1.25rem; background-color:#ffffff; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;}
.ag-account-info {display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap;}
.ag-icon-box {width:4rem; height:4rem; background-color:rgba(3,22,53,0.05); border-radius:1rem; display:flex; align-items:center; justify-content:center;}
.ag-account-num {margin:0.25rem 0; letter-spacing:-0.02em; font-weight:700;}
.ag-btn-copy {padding:1rem 2rem; border:none; border-radius:1rem; background-color:#031635; color:#ffffff; cursor:pointer; font-weight:600; transition:background-color 0.2s ease;}
.ag-btn-copy:hover {background-color:rgba(3,22,53,0.9);}

.ag-logic-grid {display:grid; grid-template-columns:repeat(2,1fr); gap:2rem;}
.ag-logic-col {padding:2rem; border:1px solid rgba(197,198,207,1); border-radius:1.25rem; display:flex; flex-direction:column;background: #f2f9ff;}
.ag-logic-title {margin-bottom:1.5rem; font-weight:700; display:flex; align-items:center; gap:0.5rem;}
.ag-code-list {list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:0.5rem;}
.ag-code-item {display:flex; justify-content:space-between; align-items:center; padding:0.75rem 0.5rem; border-bottom:1px solid rgba(197,198,207,0.1); border-radius:0.5rem; transition:background-color 0.2s;}
.ag-code-item:hover {background-color:#f8f9fa;}

/* 봉헌 정보 2카드 래퍼 - 균등 너비/높이 */
/*.offering-info-wrap {display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; align-items:stretch;}*/
.offering-info-wrap > .dimode-component {display:flex; flex-direction:column; width:100%; height:100%; margin:0 auto !important;}
.offering-info-wrap > .dimode-component > .dimode-unit {display:flex; flex:1; width:100%; height:100%;}
.offering-info-wrap .ag-account-card {display:flex; flex-direction:column; width:100%; height:100%; flex:1; align-items:stretch; justify-content:flex-start; text-align:left; gap:0; padding:2rem;}
.offering-info-wrap .ag-account-card .ag-icon-box {margin-bottom:1.25rem; flex-shrink:0;}
.offering-info-wrap .ag-card-cat {margin:0 0 0.75rem; line-height:1.4;}

/* 계좌번호 + 버튼 가로 정렬 */
.ag-account-row {display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:0.5rem; flex-wrap:wrap;}
.offering-info-wrap .ag-account-row .ag-account-num {margin:0; word-break:break-all; flex:1;}
.offering-info-wrap .ag-account-row .ag-btn-copy {width:auto; margin:0; padding:0.4rem 0.85rem; border-radius:0.5rem; font-weight:600; flex-shrink:0;}
.offering-info-wrap .ag-card-bank {margin:0; line-height:1.5;}

.ag-card-divider {height:1px; background-color:rgba(197,198,207,0.6); margin:1.5rem 0;}
.ag-card-line {margin:0 0 0.4rem; line-height:1.6;}
.ag-card-line.ag-mt {margin-top:0.75rem;}
.ag-offer-list {list-style:none; padding:0; margin:0.25rem 0 0 0.75rem; display:flex; flex-direction:column; gap:0.3rem;}
.ag-offer-list li {line-height:1.6;}

.ag-example-box {padding:1.5rem; border:1px solid rgba(255,255,255,1); border-radius:0.75rem; background-color:rgba(255,255,255,0.1);}
.ag-example-header {display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem;}
.ag-badge {padding:0.125rem 0.5rem; border-radius:0.25rem; background-color:#ffffff; color:#031635; font-weight:700;}
.ag-example-footer {border-top:1px solid rgba(255,255,255,0.1);}

.ag-support-card-wrap {display:flex; flex-wrap:wrap;}
.ag-support-card {padding:2.5rem; border:1px solid rgba(197,198,207,1); border-radius:1.25rem; background-color:#edeeef; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;}
.ag-support-left {display:flex; align-items:center; gap:1.5rem;}
.ag-icon-circle {width:4rem; height:4rem; background-color:#ffffff; border-radius:50%; display:flex; align-items:center; justify-content:center;}
.ag-support-right {text-align:right;}

.ag-icon-grid {display:grid; grid-template-columns:repeat(3,1fr); gap:2rem;}
.ag-icon-item {height:100%; padding:2rem; border:1px solid rgba(197,198,207,1); border-radius:1.25rem; background-color:#ffffff; transition:transform 0.3s ease;}
.ag-icon-item:hover {transform:translateY(-5px);}
.ag-icon-box-small {width:3rem; height:3rem; margin-bottom:1.5rem; background-color:rgba(3,22,53,0.05); border-radius:0.75rem; display:flex; align-items:center; justify-content:center;}

.ag-timeline-section {max-width:48rem; margin:0 auto;}
.ag-timeline-wrap {position:relative; display:flex; flex-direction:column; gap:3rem;}
.ag-timeline-line {position:absolute; left:50%; top:0; bottom:0; width:1px; background-color:rgba(3,22,53,0.2); transform:translateX(-50%);}
.ag-timeline-step {display:flex; align-items:center; gap:2rem; position:relative; z-index:2;}
.ag-step-content {flex:1;}
.ag-text-right {text-align:right;}
.ag-step-marker {width:2.5rem; height:2.5rem; background-color:#031635; color:#ffffff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; border:4px solid #f8f9fa; flex-shrink:0;}


/* ==========================================================================
   18. 예배안내
   ========================================================================== */
.wg-hero {position:relative; min-height:25rem; display:flex; align-items:center; justify-content:center; text-align:center; background-attachment:fixed; background-size:cover; background-position:center; background-repeat:no-repeat;}
.wg-hero-overlay {position:absolute; inset:0; background-color:rgba(3,22,53,0.4); z-index:1;}
.wg-hero-content {position:relative; z-index:2; color:#ffffff;}
.wg-label {display:block; margin-bottom:1rem; letter-spacing:0.3em; opacity:0.9;}
.wg-title-main {font-weight:700; letter-spacing:-0.02em;}
.wg-divider {width:4rem; height:1px; margin:2rem auto 0; background-color:rgba(255,255,255,0.5);}

/* 그리드 (이미지 : 리스트 = 1:1) */
.wg-grid {display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start;}
.wg-col {display:flex; flex-direction:column; justify-content:center;}
.wg-img {width:100%; height:100%; min-height:25rem; object-fit:cover; border-radius:1rem; background-color:#d9dce3;}

/* 섹션 타이틀 */
.wg-section-title {position:relative; margin-bottom:2.5rem; padding-bottom:1rem; color:#191c1d; font-weight:700;}
.wg-section-title::after {content:""; position:absolute; left:0; bottom:0; width:5rem; height:3px; background-color:#081b3a;}

/* 리스트 */
.wg-list {display:flex; flex-direction:column;}
.wg-row {display:grid; grid-template-columns:12rem 1fr; gap:2rem; padding:0; align-items:start;}
.wg-row:first-child {border-top:none; padding-top:0;}

.wg-cat {display:flex; flex-direction:row; gap:0.25rem; padding-top:1.25rem;}
.wg-cat-name {color:#081b3a; font-weight:700; line-height:1.3;}
.wg-cat-sub {color:#44474e; line-height:1.4;}

.wg-items {display:flex; flex-direction:column; gap:0.6rem; border-left:1px solid #c5c6cf; padding:1.2rem 0 1.2rem 1.75rem;}
.wg-row:first-child .wg-items {padding-top:0;}

.wg-item {display:grid; grid-template-columns:4rem 9rem 1fr; gap:1rem; align-items:baseline;}
.wg-tem-wrap {display:flex; gap:7px;}
.wg-item-label {color:#081b3a; font-weight:700;}
.wg-item-time {color:#191c1d; font-weight:500;}
.wg-item-place {color:#44474e; line-height:1.5;}

/* 1부/2부 라벨이 없는 경우 (말씀사경회 등) */
.wg-item:not(:has(.wg-item-label)) {grid-template-columns:14rem 1fr;}


/* ==========================================================================
   19. 목장교회
   ========================================================================== */
.mc-text-navy {color:#1a2b4b;}
.mc-bg-navy {background-color:#1a2b4b;}
.mc-bg-surface-high {background-color:#e1e3e4;}
.mc-bg-white-10 {background-color:rgba(255,255,255,0.1); padding:1rem; border-radius:1.25rem;}
.mc-text-white {color:#ffffff;}
.mc-text-center {text-align:center;}
.mc-text-right {text-align:right;}

.mc-flex-grid {display:flex; gap:4rem; align-items:center;}
.mc-flex-grid.mc-row-reverse {flex-direction:row-reverse;}
.mc-col {flex:1; min-width:0;}

.mc-num {display:block; margin-bottom:-2rem; color:rgba(26,43,75,0.1); line-height:1; font-weight:700;}
.mc-num2 {display:block; margin-bottom:-2rem; color:rgba(255,255,255,0.2); line-height:1; font-weight:700;}
.mc-title {position:relative; z-index:10; margin-bottom:2rem; color:#1a1a1a; font-weight:700;}
.mc-title2 {position:relative; z-index:10; margin-bottom:2rem; color:#fafafa; font-weight:700;}
.mc-desc {margin-bottom:2rem; color:rgba(26,26,26,0.8); line-height:1.6;}

.mc-quote {border-left:4px solid #1a2b4b; padding:1rem 2rem; margin-bottom:2rem;}
.mc-quote-text {color:#1a1a1a; line-height:1.5; font-weight:600;}

.mc-img-frame {overflow:hidden; border-radius:1.25rem;}
.mc-parallax-wrapper {transition:transform 0.2s ease-out;}
.mc-img-rounded {width:100%; height:auto; border-radius:1.25rem; object-fit:cover; transition:transform 0.7s ease;}
.mc-img-1 img {aspect-ratio:9/6;}
.mc-img-2 img {aspect-ratio:671/706;}
.mc-img-3 img {aspect-ratio:671/416;}
.mc-img-frame:hover .mc-img-rounded {transform:scale(1.05);}

.mc-trait-list {display:flex; flex-direction:column; gap:0.6rem;}
.mc-trait-item {padding:1rem 1.5rem; background-color:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.2); border-radius:1.25rem; transition:all 0.3s ease;}
.mc-trait-item:hover {border-color:#ffffff;}
.mc-trait-label {display:block; margin-bottom:0.35rem; color:rgba(255,255,255,0.7); text-transform:uppercase; font-weight:700;}
.mc-trait-title {color:#ffffff; font-weight:700; margin-bottom:0;}
.mc-trait-desc {color:rgba(255,255,255,0.7);}

.mc-table-wrap {overflow:hidden; background-color:#ffffff;}
.mc-table {width:100%; border:none; text-align:left;}
.mc-table th {padding:1.2rem; border-top:3px solid #1a2b4b; border-bottom:3px solid #1a2b4b; color:#1a2b4b; text-transform:uppercase; letter-spacing:0.1em; font-size:1.2rem;}
.mc-table td {padding:0.6rem 1rem; border-bottom:1px solid #e1e3e4; transition:background-color 0.2s ease;}
.mc-table tr:last-child td {border-bottom:none;}
.mc-table tr:hover td {background-color:#f8f9fa;}
.mc-td-bold {font-weight:700; color:#1a2b4b;}

.mc-badge {display:inline-block; padding:0.5rem 1rem; margin-bottom:2rem; background-color:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.2); border-radius:50px; color:#ffffff; text-transform:uppercase; letter-spacing:0.1em;}

.mc-vision-box {max-width:57rem; margin:0 auto; padding:3rem; background-color:#f3f4f5; border-radius:1.25rem;}
.mc-vision-grid {display:grid; grid-template-columns:repeat(3,1fr); gap:3rem; margin-top:3rem;}
.mc-vision-item {text-align:center; display:flex; flex-direction:column; gap:1rem; align-items:center;}
.mc-vision-circle {width:4rem; height:4rem; background-color:#1a2b4b; color:#ffffff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700;}
.mc-vision-title {font-weight:700; color:#1a1a1a;}
.mc-vision-desc {color:rgba(26,26,26,0.7);}
.mc-vision-body {max-width:56rem; margin:0 auto; text-align:left; word-break:keep-all;}
.mc-step-intro {margin-bottom:2rem; color:rgba(255,255,255,0.8); line-height:1.75; word-break:keep-all;}

@keyframes mc-pulse-ring {0% {transform:scale(0.95);} 50% {transform:scale(1.05);} 100% {transform:scale(0.95);}}

/* Section 3 조직/역할 - 제목과 표 사이 간격 축소 */
#unit4352.p_bottom_6 {padding-bottom:2rem !important;}


/* ==========================================================================
   20. 비전의사다리
   ========================================================================== */
.vl-container {color:#191c1d;}
.vl-text-muted {color:#44474e;}
.vl-text-center {text-align:center;}
.vl-bg-navy {background-color:#1a2b4b;}
.vl-grid .dimode-unit {width:100%;}
.labber-intro-img {max-width:50rem; margin:0 auto; padding:3rem 0;}

/* 라벨 */
.vl-label {display:block; margin-bottom:1rem; color:#031635; text-transform:uppercase; letter-spacing:0.15em; font-weight:700;}
.vl-stage-label {display:inline-block; margin-bottom:1.5rem; padding-bottom:0.25rem; border-bottom:1px solid #031635; color:#031635; text-transform:uppercase; letter-spacing:0.15em; font-weight:700;}
.vl-stage-label--light {color:rgba(255,255,255,0.7); border-bottom-color:rgba(255,255,255,0.3);}

/* 타이틀 */
.vl-title-main {color:#031635; letter-spacing:-0.02em; font-weight:700;}
.vl-title {margin-bottom:1.5rem; color:#031635; line-height:1.25; font-weight:700; word-break:keep-all;}
.vl-title--light {color:#ffffff;}
.vl-sub-heading {margin-bottom:1rem; color:#031635; font-weight:700;}

/* 본문 */
.vl-para {line-height:1.8; margin-bottom:1rem; word-break:keep-all;}
.vl-para:last-child {margin-bottom:0;}
.vl-para--light {color:rgba(255,255,255,0.75);}
.vl-list {margin:0; padding-left:1.25rem;}
.vl-list .vl-para {margin-bottom:0.75rem; line-height:1.8;}
.vl-list .vl-para:last-child {margin-bottom:0;}

/* col 내부 수직 중앙 정렬 */
.vl-col-inner {display:flex; flex-direction:column; justify-content:center; height:100%;}

/* 이미지 */
.vl-img-cover {width:100%; height:auto; display:block; object-fit:contain; border-radius:20px !important;}
.vl-img-placeholder {aspect-ratio:4/3; background-color:#f3f4f5; border:1px dashed #c5c6cf; display:flex; align-items:center; justify-content:center;}
.vl-img-placeholder--dark {aspect-ratio:4/3; background-color:rgba(255,255,255,0.07); border:1px dashed rgba(255,255,255,0.2); display:flex; align-items:center; justify-content:center;}
.vl-img-placeholder::after {content:'IMAGE'; color:#c5c6cf; font-size:0.8rem; letter-spacing:0.2em; font-weight:700;}
.vl-img-placeholder--dark::after {content:'IMAGE'; color:rgba(255,255,255,0.25); font-size:0.8rem; letter-spacing:0.2em; font-weight:700;}

/* 1:1 그리드 */
.vl-grid {display:grid; grid-template-columns:1fr 1fr; gap:4rem;}
.vl-grid > [class*="col-sm"] {width:auto; float:none; margin:0; padding:0;}
/* 데스크탑: 텍스트 먼저인 섹션은 텍스트를 왼쪽으로 */
.vl-grid-text-first > [class*="col-sm"]:first-child {order:1;}
.vl-grid-text-first > [class*="col-sm"]:last-child {order:2;}


/* ==========================================================================
   21. 국내선교 - 선교 현황 (좌 표 · 우 이미지)
   ※ 요약 카드(.info-*)는 [02] 공통 카드 참고
   ========================================================================== */
.dm-grid {display:grid; grid-template-columns:7fr 5fr; gap:3rem; align-items:start;}
.dm-grid > .dm-table-col, .dm-grid > .dm-img-col {float:none; width:auto; margin:0; min-width:0;}
.mission_img_1 img {aspect-ratio:8/7;}
.dm-table-caption {margin:0 0 0.5rem; color:#031635; font-weight:700;}
.dm-table-sub {margin:0 0 1.5rem; color:#5C5F60; line-height:1.6;}
.dm-table-scroll {overflow-x:auto;}
.dm-table {width:100%; border-collapse:collapse;}
.dm-table thead tr {border-top:2px solid #031635; border-bottom:2px solid #031635;}
.dm-table thead th {padding:1rem; text-align:left; letter-spacing:0.1em; color:#031635; font-weight:700;}
.dm-table tbody tr {border-bottom:1px solid rgba(197,198,207,0.5);}
.dm-table tbody th {width:9rem; padding:1.1rem 1.25rem 1.1rem 1rem; text-align:left; vertical-align:top; white-space:nowrap; color:#031635; font-weight:700;}
.dm-table tbody td {padding:1.1rem 1rem; vertical-align:top; color:#44474e; line-height:1.9;}
.dm-img {display:block; width:100%; aspect-ratio:1/1; object-fit:contain; border-radius:20px; background-color:#fbf1e6;}


/* ==========================================================================
   22. 중보기도사역
   ========================================================================== */
/* 안내 박스 */
.info-box {max-width:45rem; margin:auto; padding:2.5rem; border-radius:20px; background-color:#ffffff;}
.info-list {margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:1rem;}
.info-list li {line-height:1.7; color:#191c1d;}
.info-key {display:inline-block; min-width:3.5rem; margin-right:1rem; color:#031635; font-weight:600;}

/* 기도실 안내 (좌우 분할 1:1) */
.room-split {display:flex; flex-wrap:wrap; align-items:stretch; padding:5rem 0;}
.room-media {display:flex;}
.room-media-unit {display:flex; width:100%;}
.room-media-img {display:block; width:100%; height:100%; min-height:28rem; object-fit:cover; border-radius:16px; background-color:#d9dce3;}
.room-text {display:flex; align-items:center;}
.room-text-unit {width:100%; max-width:34rem; margin:auto;}
.room-heading {margin-bottom:2.5rem; color:#031635; font-weight:700;}
.room-block {margin-bottom:2rem;}
.room-block:last-child {margin-bottom:0;}
.room-block-title {margin-bottom:0.75rem; padding-bottom:0.5rem; font-weight:700;}
.room-list {margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:0.5rem;}
.room-list li {position:relative; line-height:1.5; color:#44474e;}


/* ==========================================================================
   23. 다음세대 - 미션소망부
   ========================================================================== */
.value-intro {text-align:center;}
.value-intro-desc {max-width:50rem; margin:auto; line-height:1.9; color:#44474e;}
.closing-unit {max-width:50rem; margin:auto; text-align:center;}
.closing-text {line-height:1.7; color:#031635; font-weight:700;}
.closing-link-unit {margin-top:2.5rem; text-align:center;}
.closing-link {display:inline-flex; align-items:center; gap:0.5rem; padding-bottom:0.4rem; border-bottom:0.0625rem solid rgba(255,255,255,0.45); color:#ffffff; font-weight:700; letter-spacing:0.02em; text-decoration:none; transition:color 0.25s ease, border-color 0.25s ease;}
.closing-link:hover {color:#c6e9ff; border-bottom-color:#c6e9ff;}
.closing-link-text {word-break:keep-all;}
.closing-link-logo {flex-shrink:0; width:1.25rem; height:1.25rem;}
.closing-link-arrow {flex-shrink:0; width:1.25rem; height:1.25rem; transition:transform 0.25s ease;}
.closing-link:hover .closing-link-arrow {transform:translateX(0.3rem);}







/* ==========================================================================
   96. 좌우 여백 확보
   ========================================================================== */
@media (min-width: 1200px) and (max-width: 1520px) {
  .dimode-theme .container {width: auto; max-width: 100%; margin-left: 7rem; margin-right: 7rem;}
  .dimode-theme .container.row {margin-left: 7rem; margin-right: 7rem;}
  .dimode-theme > *:not(.dimode-component-WIDE) {margin-left: 7rem; margin-right: 7rem;}
  .dimode-theme > .row {margin-left: 6rem; margin-right: 6rem;}
}

@media (min-width: 992px) and (max-width: 1199px) {
  .dimode-theme .container {width: auto; max-width: 100%; margin-left: 5rem; margin-right: 5rem;}
  .dimode-theme .container.row {margin-left: 5rem; margin-right: 5rem;}
  .dimode-theme > *:not(.dimode-component-WIDE) {margin-left: 5rem; margin-right: 5rem;}
  .dimode-theme > .row {margin-left: 4rem; margin-right: 4rem;}
}



/* ==========================================================================
   90. 반응형 (미디어쿼리 통합)
   ========================================================================== */

/* --------------------------------------------------------------------------
   max-width: 1199px
   -------------------------------------------------------------------------- */
@media (max-width:1199px) {
  /* 공통 - Hero */
  .hero-banner {min-height:25rem;}

  /* 예배안내 */
  .wg-row {grid-template-columns:10rem 1fr; gap:1.5rem;}
  .wg-item {grid-template-columns:3.5rem 8rem 1fr; gap:0.75rem;}
  /* 원로목사 */
  .hpr-body {gap:2.5rem;}
  .hpr-books-grid {grid-template-columns:repeat(2,1fr); gap:1rem 1.5rem;}
  
  /*다음세대*/
  .social-col--5 {flex:0 0 33.3333%; max-width:33.3333%;}
  .social-grid {grid-template-columns:repeat(3,1fr);}
  
  /*오시는길*/
   .bus_grid {grid-template-columns:repeat(2, 1fr); gap:1.75rem;}

  
}

/* --------------------------------------------------------------------------
   max-width: 992px
   -------------------------------------------------------------------------- */
@media (max-width:992px) {
  /* 공통 - Hero */
  .hero-banner {min-height:auto; background-attachment:scroll;}
  .hero-banner--info {min-height:24rem;}

  /* 공통 - 좌우 분할 */
  .vs-split {min-height:31.25rem;}

  /* 공통 - 예배 시간 카드 */
  .worship-col--half {flex:0 0 50%; max-width:50%;}

  /* 교회비전 */

  .hsm-order-1 {order:1;}
  .hsm-order-2 {order:2;}
  .hsm-quote-cite {padding-left:1.5rem;}
.hsm-values.row {flex-direction:column; flex-wrap:wrap; align-items:stretch; gap:1.5rem;}
  .hsm-values.row > [class*="col-sm"] {width:100%; max-width:100%; float:none; margin:0;}
.hsm-slogan-sub{text-align:left !important;}






  /* 교회연혁 */
  .hsh-tl-axis, .hsh-dot {display:none;}
  .hsh-tl-content-col {width:100%; float:none;}
  .hsh-tl-content-col::before {display:none;}
  .hsh-year-block {padding-left:0; margin-bottom:4rem; scroll-margin-top:14rem;}

  /* 좌측 세로 네비 → 상단 가로 스크롤 칩 네비로 전환
     ※ !important 는 CMS 인라인 style(margin/padding/width)을 덮기 위한 것 */
  .hsh-tl-nav-col {
    display:block !important;
    float:none !important;
    width:100% !important;
    margin:0 0 2rem !important;
    padding:0 !important;
    position:-webkit-sticky !important;
    position:sticky !important;
    top:6.5rem;
    z-index:40;
    
  }
  .hsh-tl-nav-sticky {width:100% !important;}

  .hsh-year-nav {
    flex-direction:row;
    flex-wrap:nowrap;
    gap:0.5rem;
    margin:0;
    padding:0.75rem 15px;
    border-left:none;
    overflow-x:auto;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .hsh-year-nav::-webkit-scrollbar {height:0;}
  .hsh-year-nav li {flex-shrink:0;}

  /* .font-2xl(CMS 클래스)를 이기려고 선택자를 2단계로 씀 */
  .hsh-year-nav .hsh-year-link {
    display:block;
    padding:0.4rem 1.1rem;
    border:1px solid rgba(197,198,207,0.8);
    border-radius:999px;
    color:#5C5F60;
    white-space:nowrap;
    font-size:1rem;
    font-family:inherit;
  }
  .hsh-year-nav .hsh-year-link.is-active {
    color:#ffffff;
    background-color:#1A2B4B;
    border-color:#1A2B4B;
    font-weight:700;
  }


  /* 원로목사 */
  .hpr-body {grid-template-columns:1fr; gap:0;}
  .hpr-body > .hpr-profile-col {position:static !important; margin-bottom:2.5rem;}
  .hpr-content-col {gap:4rem; width:100%; min-width:0;}
  .hpr-table {table-layout:auto;}

  /* 섬기는분들 */
  .sok-grid {grid-template-columns:repeat(2,1fr); gap:1.5rem;}
  .sok-grid-6 {grid-template-columns:repeat(4,1fr);}
  .sok-card {padding:1.25rem;}

  /* 비전채플 */
  .vs-band .container {gap:2.5rem;}
  .vs-text-col, .vs-img-col {width:100%;}
  .vs-img-frame {aspect-ratio:16/9;}
  .vc-floor-grid {grid-template-columns:1fr; gap:1.5rem;}
  .vc-floor-subgrid-4 {grid-template-columns:1fr 1fr;}
  .vc-dream-list {grid-template-columns:1fr;}

  /* 새가족등록 */
  .nf-step-grid {grid-template-columns:1fr 1fr; gap:3rem 2rem;}
  .nf-step-grid::before {display:none;}
  .nf-step-desc {max-width:none;}

  /* 오시는길 */
  .way-grid {grid-template-columns:1fr; gap:2.5rem;}
  .way-map {height:25rem;}
   .bus_sec_head {margin-bottom:2rem;}
  .bus_ov_box {margin-bottom:2.5rem;}
  .bus_card_head {padding:1.25rem 1.25rem 1rem;}
  .bus_tbl th, .bus_tbl td {padding:0.65rem 0.6rem;}
.bus_ov_grid {grid-template-columns:repeat(2, 1fr); gap:1.25rem;}
  .way-map-box {aspect-ratio:16/9;}
  /* 행정안내 */
  .ag-logic-grid {grid-template-columns:1fr;}
  .ag-icon-grid {grid-template-columns:repeat(2,1fr);}
  .ag-timeline-line {left:1.25rem; transform:none;}
  .ag-timeline-step {flex-direction:column; align-items:flex-start; gap:1rem;}
  .ag-step-content {text-align:left; padding-left:3.5rem; width:100%;}
  .ag-step-marker {position:absolute; left:0; top:0;}
  .offering-info-wrap {grid-template-columns:1fr; gap:1rem;}

  /* 예배안내 */
  .wg-grid {grid-template-columns:1fr; gap:2rem;}
  .wg-img {min-height:0; aspect-ratio:16/9;}
  .wg-row {grid-template-columns:11rem 1fr;}

  /* 목장교회 */
  .mc-flex-grid, .mc-flex-grid.mc-row-reverse {flex-direction:column; gap:2rem;}
  .mc-text-right {text-align:left;}
  .mc-vision-grid {grid-template-columns:1fr; gap:2rem;}
  .mc-vision-box {padding:1.5rem;}

  /* 국내선교 */
  .dm-grid {grid-template-columns:1fr; gap:2.5rem;}
  .dm-img {max-width:34rem; margin:0 auto;}
  
  /*다음세대*/
  .social-col--5 {flex:0 0 50%; max-width:50%;}
  .social-grid {grid-template-columns:repeat(2,1fr); gap:1.25rem;}

  
  .closing-link-unit {margin-top:1.75rem;}
  .closing-link {gap:0.4rem;}
}

/* --------------------------------------------------------------------------
   max-width: 768px
   -------------------------------------------------------------------------- */
@media (max-width:768px) {
	
.p_top_2 {padding-top:2rem;}
.p_top_3 {padding-top:2rem;}
.p_top_4 {padding-top:2rem;}
.p_top_5 {padding-top:2.2rem;}
.p_top_6 {padding-top:3rem;}

.p_bottom_2 {padding-bottom:2rem;}
.p_bottom_3 {padding-bottom:2rem;}
.p_bottom_4 {padding-bottom:2rem;}
.p_bottom_5 {padding-bottom:2.2rem;}
.p_bottom_6 {padding-bottom:3rem;}
	
	.vs-text-unit{padding:0;}
	.vs-heading{margin-bottom: 0.5rem;}
	.vs-label{margin-bottom: 0.5rem;}
	.vl-grid{gap:2rem;}
	
  /* 공통 - Hero */
  .hero-banner {min-height:auto;}
  .hero-unit {padding:3rem 0;}
  .wg-hero{min-height:auto;}

  /* 공통 - 좌우 분할 */
  .vs-split, .vs-reverse {flex-direction:column;}
  .vs-split {min-height:auto;}
  .vs-text-unit {max-width:100%; padding:0 0 2rem 0;}
  .vs-media-img {min-height:18rem;}
  .vs-split--padded {padding:3rem 0;}
  .vs-split--padded .vs-media-img {margin-top:2rem;}
  .m-order-1 {order:1;}
  .m-order-2 {order:2;}
  
  .mc-bg-navy{padding-left:15px;padding-right:15px;}

  /* 공통 - 예배 시간표 테이블 */
  .schedule-head {margin-bottom:2.5rem;}
  .schedule-table th {padding:1rem 0.75rem;}
  .schedule-table td, .schedule-table--prayer td {padding:1.25rem 0.75rem;}

  /* 공통 - 소셜 링크 카드 */
  .social-card {padding:1.75rem;}

  /* 공통 - 예배 시간 카드 */
  .worship-img {height:22rem;}
  .worship-card-txt {padding:1.5rem 0 0;}
  .worship-card--mission .worship-img {height:14rem;}
  .worship-col--half {flex:0 0 100%; max-width:100%;}

  /* 공통 - 카드 (국내선교 / 해외선교 / 디아코니아) */
  .info-card {padding:2rem 1.5rem;}
  .net-card, .serve-card {padding:2rem;}

  /* 교회비전 */
  .hsm-mission, .hsm-values, .hsm-slogan {gap:2.5rem 0;}
  .core_wrap {grid-template-columns:1fr; gap:1rem;}
  .hsm-intro-title {margin-bottom:2.5rem;}
  .hsm-song-grid {grid-template-columns:1fr; gap:1.5rem;}
  .hsm-song-head {margin-bottom:3rem;}
  .hsm-song-btn-wrap {margin-top:3rem;}
  .hsm-song-btn {padding:1rem 2rem;}
  .hsm-value-list {gap:0rem;}
  .hsm-value-item {gap:1rem; padding-bottom:1.25rem;}
  .hsm-quote-cite {padding-left:1.25rem; border-left-width:4px;}
  .hsm-text-block h2{margin-bottom:1rem;margin-top:0.5rem;}
  .hsm-label{margin-bottom:0.5rem;}
  .hsm-desc{margin-bottom:1rem;}
  .sub12 #component5923{padding-left:15px;padding-right:15px;}

  /* 교회연혁 */
  .hsh-hero-desc {font-size:0.95rem;}
  .hsh-year-block {margin-bottom:3rem;}
  .hsh-table th, .hsh-table td {display:block; width:100%; padding:0;}
  .hsh-table th {padding-bottom:0.5rem;}
  .hsh-table td {padding-bottom:1.25rem;}
  .hsh-detail-grid {grid-template-columns:1fr;}
	
  .hsh-tl-nav-col {top:5.5rem;}
  .hsh-year-block {scroll-margin-top:12rem;}

  /* 원로목사 */
  .hpr-hero-sub {font-size:1rem;}
  .hpr-content-col {gap:3rem;}
  .hpr-military-box {padding:2rem;}
  .hpr-career-grid {grid-template-columns:1fr; gap:2rem;}
  .hpr-books-grid, .hpr-books-grid2 {grid-template-columns:1fr 1fr; gap:1rem;}
  .hpr-book {padding:0.75rem; gap:0.75rem;}
  .hpr-book-img {max-width:100%;}
  .hpr-books-head {flex-direction:column; align-items:flex-start; gap:0.5rem;}
  .hpr-table th, .hpr-table td {display:block; width:100%; text-align:left; white-space:normal; padding:0.5rem 0;}
  .hpr-table th {border-bottom:none; padding-bottom:0.25rem;}
  .hpr-paper {flex-direction:column; gap:0.5rem;}
  .hpr-ministry {padding-left:1.75rem; gap:2rem;}
  .hpr-min-dot {left:-2.1rem;}
	
  /* 섬기는분들 */
  .sok-nav {padding:0.75rem 15px;}
  .sok-nav-btn {padding:0.4rem 0.9rem;}
  .sok-grid {grid-template-columns:repeat(2,1fr); gap:1rem;}
  .sok-grid-6 {grid-template-columns:repeat(3,1fr);}
  .sok-title {margin:0;}
  .sok-img {margin-bottom:1rem;border-radius: 10px;}
  .sok-card{padding: 0.8rem;}

  /* 비전채플 */
  .vs-band {background-attachment:scroll;}
  .vs-grid, .vs-grid2 {grid-template-columns:1fr; gap:1rem;}
  .vs-num {margin-bottom:0.25rem;}
  .vs-quote-list, .vs-blockquote {padding-left:1.25rem;}
  .vs-quote-light .vs-quote-item {color:#d2e9ff;}
  .vs-quote-list {padding-left:1.25rem;}
  .vs-blockquote {color:#d2e9ff; border-left:4px solid #d2e9ff; padding-left:1.25rem;}
  .vc-floor-btn {padding:1.5rem;}
  .vc-floor-btn-left {flex-direction:column; gap:0.25rem;}
  .vc-floor-grid {padding:1.5rem;}
  .vc-floor-subgrid, .vc-floor-subgrid-4 {grid-template-columns:1fr 1fr;}
  .vc-app-cards {grid-template-columns:1fr;}
  .vc-app-card, .vc-comm-card, .vc-dream-item {padding:1.5rem;}
  .sec-text2 {padding-bottom:4rem;}

  /* 새가족등록 */
  .nf-hero-bg {padding:4rem 0;}
  .nf-step-grid {grid-template-columns:1fr; gap:2.5rem;}
  .nf-online-head {margin-bottom:2.5rem;}
  .nf-online-img {margin-bottom:2rem;}
  .nf-online-body{margin:2rem 0 0 0;}
  .sub18 #component9301{padding-left:15px;padding-right:15px;}

  /* 오시는길 */
  .way-card {padding:1.5rem;}
  .way-map-actions {flex-direction:column;}
  .way-info-col{gap:0;}
  .way-grid{gap: 2rem;padding: 3rem 0;}
  .way-bus-group {margin-bottom:1rem;}
  .way-chip {padding:0.3rem 0.7rem;}
  .way-bus-chips {gap:0.4rem;}
    .bus_nav {gap:0.4rem;}
  .bus_nav_link {padding:0.5rem 1.1rem;}
  .bus_grid {grid-template-columns:1fr; gap:1.5rem;}
  .bus_ov_tbl {min-width:38rem;}
  .bus_ov_tbl th, .bus_ov_tbl td {padding:0.7rem 0.75rem;}
  .bus_ov_no {width:4.5rem;}
  .bus_card_head {padding:1.1rem 1.1rem 0.9rem;}
  .bus_tbl th, .bus_tbl td {padding:0.6rem 0.5rem;}
  .bus_col_area {width:24%;}
  .bus_col_stop {width:42%;}
  .bus_col_time {width:17%;}
.subnav.nav-tabs {gap:0.4rem;}
  .subnav.nav-tabs > li > a {padding:0.5rem 1.15rem; font-size:0.88rem;}
  .navtabs .tab-content {padding:1.75rem 0 0 !important;}
.bus_ov_grid {grid-template-columns:1fr; gap:1rem;}

.bus_ov_tbl th, .bus_ov_tbl td {padding:0.7rem 0.75rem;}
 .bus_ov_c1 {width:18%;}
  .bus_ov_c2 {width:56%;}
  .bus_ov_c3 {width:26%;}
  .bus_ov_btn {padding:0.2rem 0.6rem; font-size:0.8rem;}
  .bus_card {scroll-margin-top:5rem;}
  
    .way-map-box {aspect-ratio:4/3; border-radius:12px;}
	
	
  .bus_ov_tbl {min-width:0;}
  .bus_ov_c1 {width:16%;}
  .bus_ov_c2 {width:56%;}
  .bus_ov_c3 {width:28%;}
  .bus_ov_tbl th, .bus_ov_tbl td {padding:0.7rem 0.4rem;}
  .bus_ov_btn {padding:0.2rem 0.55rem; font-size:0.75rem;}
  .bus_card {scroll-margin-top:5rem;}

  /* 행정안내 */

  .ag-account-card {flex-direction:column; text-align:center; justify-content:center;}
  .ag-account-info {flex-direction:column; justify-content:center;}
  .ag-support-card {flex-direction:column; text-align:center;}
  .ag-support-left {flex-direction:column; justify-content:center;}
  .ag-support-right {text-align:center;}
  .ag-icon-grid {grid-template-columns:1fr;}
  .ag-nav {flex-direction:column; align-items:center;}
  .offering-info-wrap .ag-account-row {flex-direction:row; align-items:center;}
  .offering-info-wrap .ag-account-row .ag-account-num {font-size:1.5rem;}
  .sub21 #component5892{padding-left:15px;padding-right:15px;}
	
  /* 예배안내 */
  .wg-row {grid-template-columns:1fr; gap:0.75rem; padding:1.25rem 0;}
  .wg-cat {padding-top:0;}
  .wg-items {border-left:none; border-top:1px solid #e1e3e4; padding:0.75rem 0 0;}
  .wg-row:first-child .wg-items {padding-top:0.75rem;}
  .wg-item {grid-template-columns:3rem 7rem 1fr; gap:0.5rem;}
  .wg-item:not(:has(.wg-item-label)) {grid-template-columns:11rem 1fr;}

  /* 비전의사다리 */
  .vl-col-inner {height:auto;}
  .vl-grid {grid-template-columns:1fr; gap:1.5rem;}
  
  .mc-flex-grid{align-items:stretch}
  	
  .sub32 #component8787 {padding-right: 0 !important;padding-left: 0 !important;}
  .sub32 #component9464 {padding-right: 0 !important;padding-left: 0 !important;}
  .sub33 #component0202 {padding-right: 0 !important;padding-left: 0 !important;}
  .sub33 #component0204 {padding-right: 0 !important;padding-left: 0 !important;}
  .sub34 #component1202 {padding-right: 0 !important;padding-left: 0 !important;}
  .sub34 #component1204 {padding-right: 0 !important;padding-left: 0 !important;}

  /* 국내선교 */
  .dm-table thead {display:none;}
  .dm-table tbody th {width:auto; display:block; white-space:normal; padding:0.9rem 0 0.25rem; border:none;}
  .dm-table tbody td {display:block; padding:0 0 0.9rem;}
  

  /* 중보기도사역 */
  .info-box {padding:2rem;}
  .room-split {flex-direction:column; padding:3rem 0;}
  .room-media-img {min-height:18rem; margin-bottom:2rem;}
  .room-text-unit {max-width:100%;padding:2rem 0 0 0;}
  .room-split{padding: 3rem 15px;}


  /* 다음세대 */
  .social-grid {grid-template-columns:1fr;}
	.social-card {padding:1.75rem;}
  .vs-text-unit{width:100%;}
  .closing-text {line-height:1.6;}
  .vs-grid-1-1{grid-template-columns:1fr;gap:0.5rem;padding:0 15px;}
  .sub37 .vs-split, .sub38 .vs-split, .sub39 .vs-split, 
  .sub40 .vs-split, .sub41 .vs-split{padding: 3rem 0;}
  
  .sub37 .vs-text-unit, .sub38 .vs-text-unit, 
  .sub39 .vs-text-unit, .sub40 .vs-text-unit, .sub41 .vs-text-unit{padding:0;}
  .sub37 .vs-heading, .sub38 .vs-heading, 
  .sub39 .vs-heading, .sub40 .vs-heading, .sub41 .vs-heading{margin-bottom: 0.5rem;}
  .sub37 .vs-label, .sub38 .vs-label, 
  .sub39 .vs-label, .sub40 .vs-label, .sub41 .vs-label{margin-bottom: 0.5rem;}

.sub12 div#component5984 {padding-left: 20px;padding-right: 20px;}
.social-col--5 {flex:0 0 100%; max-width:100%;}

  /*선교*/
  .sub42 .vs-split{padding-left: 20px;padding-right: 20px;}
  .sub43 .vs-split{padding-left: 20px;padding-right: 20px;}
  
  /*디아코니아*/
  .sub46 .vs-split{padding-left: 20px;padding-right: 20px;}
  }


@media (max-width:480px) {
  .bus_ov_c1 {width:15%;}
  .bus_ov_c2 {width:62%;}
  .bus_ov_c3 {width:23%;}
  .bus_ov_btn {padding:0.15rem 0.45rem; font-size:0.7rem;}
}
  
  
  /* --------------------------------------------------------------------------
   max-width: 380px
   -------------------------------------------------------------------------- */
@media (max-width:414px) {
	/*섬기는분들*/
	.sub16 #component1717{padding-right:0 !important;padding-left:0 !important;}
	.sub16 #component7169{padding-right:0 !important;padding-left:0 !important;}
	.sub16 #component9100{padding-right:0 !important;padding-left:0 !important;}
	.sok-grid{grid-template-columns:1fr;}
	.sok-nav {padding: 0.6rem 0rem;}
	
	.worship-img {height: 16rem;}

}

@media (prefers-reduced-motion: reduce) {
  .bus_nav_link {transition:none;}
  .subnav.nav-tabs > li > a {transition:none;}
}