/* =======================================================
   [Common] 폰트 & 애니메이션 & 기본 유틸
   ======================================================= */
@keyframes move {
    from {
        transform: translateX(100px) scale(1.2);
        animation-timing-function: cubic-bezier(.2,0,.8,1);
    }
    to { transform: translateX(0px) scale(1); }
}

@-webkit-keyframes updown {
    0% { bottom: 0; }
    100% { bottom: 30px; }
}

@-webkit-keyframes arrayR {
    0%, 100% { -webkit-transform: translate(15px, -50%); }
    50%      { -webkit-transform: translate(15px, -50%); }
}
@keyframes arrayR {
    0%, 100% { transform: translate(0, -50%); }
    50%      { transform: translate(15px, -50%); }
}

.font-main-42 { font-size: 42px; }
.font-main-21 { font-size: 21px; }
.font-main-17 { font-size: 17px; }

.no-padding { padding-right: 0; padding-left: 0; }
.no-margin  { margin-right: 0; margin-left: 0; }

a, a:hover, a.focus { text-decoration: none; outline: 0px; }

/* =======================================================
   [Common] main 공통 컨테이너
   ======================================================= */
.mainContainer {
    width: 100%;
}

.mainContainer > .container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 20px;
}

/* =======================================================
   [Section] 환영합니다 (mainWelcome) - Sticky Scroll Trigger
   ======================================================= */
#mainWelcome {
    position: relative;
    width: 100%;
    height: 200vh;
    background: #000;
    background-image: url('../Images/main/2_bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/* 네이비 오버레이 */
#mainWelcome::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(80, 128, 171, 0.88);
    z-index: 1;
    pointer-events: none;
}

.welcome_sticky_wrap {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    z-index: 2;
}

.welcome_container {
    width: 100%;
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 20px;
}

/* -------------------------------------------------------
   타이틀 영역
   ------------------------------------------------------- */
.welcome_title_wrap {
    text-align: center;
    margin-bottom: 60px;
    transition: margin-bottom 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.welcome_title {
    font-family: 'DMSerifText', 'Times New Roman', serif;
    font-size: 7rem;
    color: #fff;
    margin: 0 0 30px;
    letter-spacing: -2px;
    line-height: 1;
    transform: translateY(40px);
    transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

#mainWelcome.is-active .welcome_title {
    transform: translateY(0);
}

.welcome_dot {
    color: #a8daf3;
}

/* 설명 텍스트 - 초기 숨김 */
.welcome_desc {
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    overflow: hidden;
    transform: translateY(-10px);
    transition:
        opacity 0.7s ease,
        transform 0.8s cubic-bezier(0.22, 1, 0.36, 1),
        max-height 0.8s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0s linear 0.8s;
}

#mainWelcome.is-active .welcome_desc {
    opacity: 1;
    visibility: visible;
    max-height: 200px;
    transform: translateY(0);
    margin-top: 60px;
    transition:
        opacity 0.7s ease 0.25s,
        transform 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.25s,
        max-height 0.8s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0s linear 0s;
}

.welcome_desc_sub {
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 12px;
    font-size: 24px;
}

.welcome_desc_main {
    color: #fff;
    margin: 0;
    font-weight: 400;
    font-size: 30px;
}

.welcome_desc_main strong {
    font-weight: 800;
    color: #fff;
}

/* -------------------------------------------------------
   원형 아이콘 영역
   ------------------------------------------------------- */
.welcome_circle_area {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.welcome_circle_list {position: relative; width: 100%; max-width: 1340px; margin: 0 auto; display: flex; justify-content: center; align-items: center; gap: 30px; padding: 0 60px;}
.welcome_circle_item {position: relative; flex: 0 1 auto; width: 200px; max-width: 200px; text-decoration: none; color: #fff; z-index: 1;}
.welcome_circle_inner {width: 100%; height: auto; aspect-ratio: 1 / 1; position: relative; border-radius: 50%; overflow: hidden; background-color: transparent; background-size: cover; background-position: center; background-repeat: no-repeat; border: none; box-shadow: none; transition: transform 0.4s ease, background-color 0.5s ease, background-image 0.5s ease;}

#mainWelcome.is-active .welcome_circle_inner {
    background-color: #fff;
    background-image: none !important;   /* 인라인 style보다 우선 */
}

/* 원형 내부 콘텐츠 (아이콘 + EN + KR) */
.welcome_circle_content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 12px;
    text-align: center;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 0.6s ease 0.35s, transform 0.6s ease 0.35s;
}

#mainWelcome.is-active .welcome_circle_content {
    opacity: 1;
    transform: translateY(0);
}

/* 아이콘 */
.welcome_circle_icon {
     display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: #1f3c6e;                 
    margin-bottom: 4px;
}

.welcome_circle_icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* 영문 */
.welcome_circle_en {
    font-size: 18px;
    font-weight: 800;
	color: #1f3c6e;       
    letter-spacing: 1.2px;
    line-height: 1;
}

/* 한글 */
.welcome_circle_kr {
    font-size: 20px;
    font-weight: 600;
	color: #333; 
    line-height: 1.2;
}
.welcome_circle_item:hover .welcome_circle_inner {
    transform: translateY(-8px);
}

/* -------------------------------------------------------
   초기 상태 (가운데로 모이고 투명) → is-active 시 펼쳐짐
   ------------------------------------------------------- */
   
   
.welcome_circle_item:not(.welcome_circle_center_item) {
    opacity: 0;
    transition: opacity 0.8s ease, transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}

.welcome_circle_item[data-index="0"] { transform: translateX(calc(50vw - 50% - 100px)) scale(0.3); }
.welcome_circle_item[data-index="1"] { transform: translateX(calc(25vw - 25% - 50px))  scale(0.3); }
.welcome_circle_item[data-index="3"] { transform: translateX(calc(-25vw + 25% + 50px)) scale(0.3); }
.welcome_circle_item[data-index="4"] { transform: translateX(calc(-50vw + 50% + 100px)) scale(0.3); }

#mainWelcome.is-active .welcome_circle_item:not(.welcome_circle_center_item) {
    opacity: 1;
    transform: translateX(0) scale(1);
}

#mainWelcome.is-active .welcome_circle_item[data-index="1"],
#mainWelcome.is-active .welcome_circle_item[data-index="3"] {
    transition-delay: 0.1s;
}

#mainWelcome.is-active .welcome_circle_item[data-index="0"],
#mainWelcome.is-active .welcome_circle_item[data-index="4"] {
    transition-delay: 0.25s;
}

.welcome_circle_center_item {
    z-index: 2;
    transition: transform 0.6s ease;
}

#mainWelcome.is-active .welcome_circle_center_item {
    transform: scale(1);
}

/* -------------------------------------------------------
   호버
   ------------------------------------------------------- */
.welcome_circle_item:hover .welcome_circle_inner {
    transform: translateY(-8px);
    background: rgba(31, 60, 110, 0.78);
    box-shadow:
        0 18px 40px rgba(10, 25, 60, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* =======================================================
   [Section] 설교 (mainSermon)
   ======================================================= */
#mainSermon {
    background: #fff;
    padding: 130px 0;
}

/* 설교 섹션 헤더 */
.sermon_head {
    text-align: center;
    margin-bottom: 50px;
}

.sermon_eng {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: #b87333;
    letter-spacing: 4px;
    margin-bottom: 14px;
}

.sermon_section_title {
    font-weight: 800;
    color: #111;
    margin: 0 0 18px;     /* ✅ 기존 0 → 0 0 18px (설명글과 간격) */
    line-height: 1;
}

.sermon_section_desc {
    color: #888;
    margin: 0;
    line-height: 1.6;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.sermon_grid {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: 4rem;
    align-items: stretch;
}

/* 좌측: 주일예배 큰 카드 */
.sermon_left {
    min-width: 0;
}

.sermon_card {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 480px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
	border-radius: 20px;
}

.sermon_card_dim {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.15) 0%,
        rgba(0, 0, 0, 0.55) 60%,
        rgba(0, 0, 0, 0.75) 100%
    );
    z-index: 1;
}

.sermon_card_inner {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    min-height: 480px;
    padding: 40px 45px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.sermon_card_top {
    display: flex;
}

.sermon_label {
    display: inline-block;
    font-size: 13px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.85);
    letter-spacing: 3px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

.sermon_card_body {
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;      
    gap: 24px;
    flex-wrap: wrap;
}
.sermon_card_text {
    flex: 1;
    min-width: 0;
}


.sermon_card_title {
    font-size: 34px;
    font-weight: 800;
    line-height: 1.3;
    color: #fff;
    margin: 0 0 12px;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.sermon_card_bible {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.9);
    margin: 0 0 10px;
    font-weight: 500;
}

.sermon_card_meta {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.75);
    margin: 0px;
}

.sermon_card_dot {
    margin: 0 8px;
    opacity: 0.6;
}

.sermon_card_btn {
     display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 26px;        
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.5);
    color: #fff;
    font-size: 17px;          
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
    backdrop-filter: blur(4px);
    flex-shrink: 0;           
    white-space: nowrap;
}

.sermon_card_btn:hover {
    background: rgba(255, 255, 255, 0.95);
    color: #111;
    border-color: #fff;
}

.sermon_card_btn_icon {
    font-size: 10px;
}

/* 우측: 주보 + 바로가기 */
.sermon_right {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.bulletin_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.bulletin_title {
    font-size: 24px;
    font-weight: 800;
    color: #111;
    margin: 0;
}

.bulletin_youtube {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    transition: all 0.25s ease;
}

.bulletin_youtube:hover {
    border-color: #ff0000;
    transform: translateY(-2px);
}

.bulletin_youtube_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    background: transparent;
    border-radius: 4px;
}

.bulletin_youtube_icon svg {
    display: block;              
}
.bulletin_youtube_text {
    font-size: 18px;
    font-weight: 700;
    color: #111;
    letter-spacing: -0.3px;
}

.bulletin_card {
    display: block;
    text-decoration: none;
    color: #111;
    overflow: hidden;
    border-radius: 20px;
    transition: transform 0.3s ease;
}

.bulletin_card:hover {
    transform: translateY(-4px);
}

.bulletin_thumb {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform 0.5s ease;
}

.bulletin_card:hover .bulletin_thumb {
    transform: scale(1.03);
}

.bulletin_thumb_overlay {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 24px 26px;
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
    color: #fff;
}

.bulletin_thumb_title {
    font-size: 24px;
    font-weight: 800;
    line-height: 1.3;
    color: #fff;
    margin: 0 0 4px;
    
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.bulletin_thumb_date {
    font-size: 15px;
    color: rgba(255,255,255,0.9);
    margin: 0;
    font-weight: 500;
    letter-spacing: 0.5px;
}
.sermon_quick {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-top: 2px;
}

.sermon_quick_item {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;   /* 정사각형 */
    height: auto;
    padding: 10px;
    background: #a3acb3;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    line-height: 1.3;
    border-radius: 20px;   /* 라운딩 */
    transition: all 0.25s ease;
    word-break: keep-all;
}

.sermon_quick_item:hover {
    background: #1f4fa3;
    color: #fff;
    transform: translateY(-3px);
}

.sermon_quick_item span {
    display: block;
}

/* =======================================================
   [Section] 새가족 안내 (mainNewFamily) - Parallax
   ======================================================= */
#mainNewFamily {
    position: relative;
    width: 100%;
    min-height: 600px;
    height: 80vh;
    overflow: hidden;
    color: #fff;
}

.newfamily_bg {
    position: absolute;
    top: -10%;
    left: 0;
    width: 100%;
    height: 120%;
    background-image: url('../Images/main/4_welcome_bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    will-change: transform;
    z-index: 1;
}

.newfamily_dim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:linear-gradient(
        135deg,
        rgba(0,0,0, 0.5) 0%,
        rgba(0,0,0, 0.5) 50%,
        rgba(0,0,0, 0.5) 100%
    );
    z-index: 2;
}

.newfamily_inner {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 60vh;
    min-height: 600px;
    display: flex;
    align-items: center;
}

.newfamily_container {
    width: 100%;
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.newfamily_text {
    max-width: 700px;
    margin-top: 40px;
}

.newfamily_title {
    font-size: 40px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 24px;
    line-height: 1.2;
    letter-spacing: -1px;
}

.newfamily_desc {
    font-size: 24px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 1);
    margin: 0;
    font-weight: 300;
}

.newfamily_btns {
    position: absolute;
    right: 20px;
    bottom: 40px;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.newfamily_btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    min-width: 220px;
    padding: 18px 26px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.7);
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    text-decoration: none;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: all 0.35s ease;
}

.newfamily_btn:hover {
    background: #fff;
    color: #1a1a1a;
    border-color: #fff;
    transform: translateY(-4px);
}

.newfamily_btn_arrow {
    font-size: 18px;
    transition: transform 0.3s ease;
}

.newfamily_btn:hover .newfamily_btn_arrow {
    transform: translateX(5px);
}

/* =======================================================
   [Section] 교회앨범 (mainGallery)
   ======================================================= */
#mainGallery {
    padding: 130px 0;
    background: #fff;
    overflow: hidden;
}

#mainGallery .gallery_container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 헤더 */
.gallery_head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 50px;
    gap: 20px;
}

.gallery_head_left {
    flex: 1;
    min-width: 0;
}

.gallery_eng {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: #b87333;
    letter-spacing: 4px;
    margin-bottom: 14px;
}

.gallery_title_wrap {
    display: flex;
    align-items: center;
    gap: 30px;
    flex-wrap: wrap;
}

.gallery_title {
	font-size:40px;
    font-weight: 800;
    color: #111;
    margin: 0;
    line-height: 1;
}

/* 탭 */
.gallery_tabs {
    display: flex;
    align-items: center;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.gallery_tab {
    padding: 8px 18px;
    font-size: 17px;
    font-weight: 600;
    color: #888;
    background: transparent;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.25s ease;
    white-space: nowrap;
}

.gallery_tab:hover {
    color: #111;
}

.gallery_tab.is-active {
    background: #1f3c6e;
    color: #fff;
}

/* 화살표 */
.gallery_arrows {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-shrink: 0;
}

.gallery_arrow {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #ddd;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.25s ease;
    padding: 0;
}

.gallery_arrow:hover {
    background: #1f4fa3;
    border-color: #1f4fa3;
}

.gallery_arrow:hover svg {
    stroke: #fff;
}

.gallery_arrow svg {
    transition: stroke 0.25s ease;
}

/* 패널 */
.gallery_panels {
    position: relative;
}

.gallery_panel {
    display: none;
}

.gallery_panel.is-active {
    display: block;
}

/* 슬라이더 */
.gallery_slider {
    width: 100%;
}

.gallery_slider .slick-list {
    margin: 0 -12px;
}

.gallery_slider .slick-track {
    display: flex;
}

.gallery_item {
    padding: 0 12px;
    box-sizing: border-box;
    float: none;
    height: auto;
}

.gallery_item a {
    position: relative;
    display: block;
    color: #111;
    text-decoration: none;
    background: #fff;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.gallery_item a:hover {
    transform: translateY(-8px);
}

.gallery_thumb {
    width: 100%;
    aspect-ratio: 4 / 3;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #f0f0f0;
    transition: transform 0.5s ease;
    margin-bottom: 18px;
	border-radius: 20px;
}

.gallery_item a:hover .gallery_thumb {
    transform: scale(1.08);
}

.gallery_info {
    padding: 0 2px;
}

.gallery_cate {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: #888;
    margin-bottom: 8px;
}

.gallery_item_title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4;
    color: #222;
    margin: 0 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gallery_item a:hover .gallery_item_title {
    color: #1f4fa3;
}

.gallery_date {
    font-size: 14px;
    color: #aaa;
    margin: 0;
    letter-spacing: 0.3px;
}

.gallery_empty {
    padding: 80px 20px;
    text-align: center;
    color: #aaa;
    font-size: 15px;
}

/* =======================================================
   [Section] 사역 (mainMinistry)
   ======================================================= */
#mainMinistry {
    position: relative;
    padding: 130px 0;
    background: #000;
    background-image: url('../Images/main/5_bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/* 블랙 오버레이 */
#mainMinistry::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
    pointer-events: none;
}
#mainMinistry .ministry_container {
    position: relative;
    z-index: 2;
}

.ministry_head {
    text-align: center;
    margin-bottom: 60px;
}

.ministry_title {
    font-weight: 800;
    color: #fff;
    margin: 0 0 18px;
    line-height: 1;
}

.ministry_desc {
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    line-height: 1.6;
}

.ministry_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.ministry_card {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 12px;
    text-decoration: none;
    color: #fff;
    transition: transform 0.4s ease;
}

.ministry_card:hover {
    transform: translateY(-8px);
}

.ministry_card_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform 0.7s ease;
    z-index: 1;
}

.ministry_card:hover .ministry_card_bg {
    transform: scale(1.08);
}

.ministry_card_dim {
     position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.15) 0%,
        rgba(0, 0, 0, 0.15) 40%,
        rgba(0, 0, 0, 0.55) 75%,
        rgba(0, 0, 0, 0.85) 100%      /* ✅ 하단으로 갈수록 진해짐 */
    );
    z-index: 2;
    transition: background 0.4s ease;
}

.ministry_card:hover .ministry_card_dim {
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.1) 0%,
        rgba(0, 0, 0, 0.1) 40%,
        rgba(0, 0, 0, 0.5) 75%,
        rgba(0, 0, 0, 0.8) 100%
    );
}


.ministry_card_inner {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 100%;
    padding: 38px 36px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ministry_card_top {
    text-align: center;
}

.ministry_card_en {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #fff;                                    /* ✅ 완전 흰색 */
    letter-spacing: 1px;
    margin-bottom: 10px;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.7);      /* ✅ 강한 섀도우 */
}

.ministry_card_title {
    font-size: 30px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 22px;
    line-height: 1.2;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.75);    /* ✅ 강한 섀도우 */
}

.ministry_card_line {
    display: inline-block;
    width: 70px;
    height: 1px;
    background: rgba(255, 255, 255, 0.85);          /* ✅ 더 선명하게 */
    transition: width 0.4s ease, background 0.4s ease;
}

.ministry_card:hover .ministry_card_line {
    width: 100px;
    background: #fff;
}

.ministry_card_bottom {
    text-align: center;
}

.ministry_card_text {
    font-size: 17px;
    color: #fff;                                    /* ✅ 완전 흰색 */
    margin: 0;
    line-height: 1.6;
    font-weight: 500;
	word-break: keep-all;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.7);      /* ✅ 강한 섀도우 */
}


/* =======================================================
   [Responsive] 1199px 이하 (태블릿 가로)
   ======================================================= */
@media (max-width: 1199px) {

    /* 환영합니다 */
	.welcome_circle_list {gap: 24px; padding: 0 40px;}
  .welcome_circle_item {width: 170px; max-width: 170px;}
  .welcome_circle_inner {width: 100%; height: auto;}
  .welcome_title {font-size: 5.5rem;}
  .welcome_circle_icon {width: 38px; height: 38px;}
  .welcome_circle_en {font-size: 16px;}
  .welcome_circle_kr {font-size: 17px;}
	
	
    /* 설교 */
    .sermon_grid { gap: 3rem; }
    .sermon_card_title { font-size: 28px; }
    .sermon_quick_item { font-size: 16px;  }

    /* 새가족 안내 */
    .newfamily_btn {
        min-width: 200px;
        font-size: 15px;
        padding: 16px 22px;
    }

    /* 교회앨범 */
    .gallery_head { margin-bottom: 40px; }

    /* 사역 */
    .ministry_card_inner { padding: 32px 28px; }
    .ministry_card_title { font-size: 26px; }
}

/* =======================================================
   [Responsive] 992px 이하 (태블릿)
   ======================================================= */
@media (max-width: 992px) {

    /* 환영합니다 */
    #mainWelcome {
        height: auto;
        background-attachment: scroll;
    }

    .welcome_sticky_wrap {
        position: relative;
        height: auto;
        padding: 100px 0;
    }

    .welcome_title { font-size: 5rem; }

    .welcome_circle_list {
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px 25px;
    }

    .welcome_circle_item[data-index="0"],
    .welcome_circle_item[data-index="1"],
    .welcome_circle_item[data-index="3"],
    .welcome_circle_item[data-index="4"] {
        transform: scale(0.5);
    }

    .welcome_circle_item,
    .welcome_circle_inner {
        width: 170px;
        height: 170px;
    }

    .welcome_circle_icon { width: 36px; height: 36px; }

    /* 모바일에선 처음부터 보이게 */
    .welcome_desc {
        opacity: 1;
        visibility: visible;
        max-height: none;
        transform: none;
        margin-top: 24px;
    }
    .welcome_title { transform: none; }
    .welcome_circle_content { opacity: 1; transform: none; }

    .welcome_desc_sub { font-size: 18px; }
    .welcome_desc_main { font-size: 22px; }

    /* 설교 */
    #mainSermon { padding: 90px 0; }
	.sermon_head { margin-bottom: 40px; }
    .sermon_grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    .sermon_card { min-height: 380px; }
    .sermon_card_inner {
        min-height: 380px;
        padding: 32px 30px;
    }

    /* 새가족 안내 */
    #mainNewFamily,
    .newfamily_inner {
        height: auto;
        min-height: 0;
    }
    .newfamily_inner {
        padding: 120px 0 140px;
    }
    .newfamily_title { font-size: 36px; }
    .newfamily_desc { font-size: 15px; }
    .newfamily_text {
        margin-top: 0;
        margin-bottom: 60px;
    }
    .newfamily_btns {
        position: static;
        justify-content: flex-start;
        margin-top: 20px;
    }

    /* 교회앨범 */
    #mainGallery { padding: 90px 0; }

    .gallery_head {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
    }
    .gallery_arrows {
        align-self: flex-end;
    }

    /* 사역 */
    #mainMinistry { padding: 90px 0; }

    .ministry_list {
        grid-template-columns: 1fr;
        gap: 20px;
        max-width: 480px;
        margin: 0 auto;
    }
    .ministry_card {
        aspect-ratio: 16 / 10;
    }
    .ministry_card_inner {
        padding: 36px 32px;
    }
}

/* =======================================================
   [Responsive] 767px 이하 (모바일)
   ======================================================= */
@media (max-width: 767px) {

    /* 공통 폰트 유틸 */
    .font-main-42 { font-size: 28px; }
    .font-main-21 { font-size: 18px; }
    .font-main-17 { font-size: 15px; }

    /* 환영합니다 */
    .welcome_sticky_wrap { padding: 70px 0; }

    .welcome_title {
        font-size: 3.5rem;
        margin-bottom: 20px;
    }
    .welcome_title_wrap { margin-bottom: 40px; }

    .welcome_desc_sub { font-size: 16px; }
    .welcome_desc_main { font-size: 21px; }

    .welcome_circle_list {
        gap: 20px 15px;
        padding: 0 20px;
    }
    .welcome_circle_item {
        width: calc(50% - 8px);
        max-width: 150px;
    }
    .welcome_circle_inner {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
    }
    .welcome_circle_icon { width: 30px; height: 30px; }
    .welcome_circle_en { font-size: 14px; letter-spacing: 0.8px; }
    .welcome_circle_kr { font-size: 15px; }
    .welcome_circle_content { gap: 6px; }

    /* 설교 */
    #mainSermon { padding: 60px 0; }
    .sermon_head { margin-bottom: 30px; }
    .sermon_eng {
        font-size: 13px;
        letter-spacing: 3px;
        margin-bottom: 10px;
    }
    .sermon_section_desc { font-size: 15px; }

    .sermon_card { min-height: 320px; }
    .sermon_card_inner {
        min-height: 320px;
        padding: 26px 24px;
    }
    .sermon_card_body {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    .sermon_card_title { font-size: 24px; }
    .sermon_card_bible { font-size: 16px; }
    .sermon_card_meta { font-size: 14px; }
    .sermon_card_btn {
        align-self: flex-start;
        font-size: 15px;
    }

    .bulletin_title { font-size: 20px; }
    .bulletin_youtube_text { font-size: 16px; }
    .bulletin_thumb_title { font-size: 20px; }
    .bulletin_thumb_date { font-size: 14px; }

    .sermon_quick_item {
        font-size: 15px;
        border-radius: 16px;
    }

    /* 새가족 안내 */
    .newfamily_inner { padding: 80px 0 100px; }

    .newfamily_title {
        font-size: 28px;
        margin-bottom: 18px;
    }
    .newfamily_desc {
        font-size: 16px;
        line-height: 1.7;
    }
    .newfamily_desc br { display: none; }

    .newfamily_btns {
        flex-direction: column;
        width: 100%;
        gap: 10px;
    }
    .newfamily_btn {
        width: 100%;
        min-width: 0;
        padding: 15px 20px;
        font-size: 16px;
    }

    /* 교회앨범 */
    #mainGallery { padding: 60px 0; }

    .gallery_eng { font-size: 13px; letter-spacing: 3px; }
    .gallery_title { font-size: 28px; }
    .gallery_title_wrap {
        gap: 16px;
        width: 100%;
    }
    .gallery_tabs {
        gap: 4px;
        flex-wrap: wrap;
    }
    .gallery_tab {
        padding: 7px 14px;
        font-size: 15px;
    }
    .gallery_slider .slick-list { margin: 0 -8px; }
    .gallery_item { padding: 0 8px; }
    .gallery_cate { font-size: 13px; }
    .gallery_item_title { font-size: 17px; }
    .gallery_date { font-size: 13px; }
    .gallery_arrow {
        width: 38px;
        height: 38px;
    }

    /* 사역 */
    #mainMinistry { padding: 60px 0; }

    .ministry_head { margin-bottom: 40px; }
    .ministry_title { font-size: 28px; }
    .ministry_desc { font-size: 15px; }
    .ministry_card { aspect-ratio: 16 / 11; }
    .ministry_card_inner { padding: 28px 24px; }
    .ministry_card_en { font-size: 13px; }
    .ministry_card_title {
        font-size: 22px;
        margin-bottom: 16px;
    }
    .ministry_card_text { font-size: 15px; }
    

    /* 온라인 헌금 모달 */
    .offering-modal-box {
        width: 94%;
        border-radius: 12px;
    }
    .offering-modal-inner {
        padding: 40px 24px 35px;
    }
    .offering-modal-title { font-size: 24px; }
    .offering-modal-desc { font-size: 15px; }
    .offering-sub-title { font-size: 18px; }

    .offering-example-box,
    .offering-account-box {
        padding: 22px 20px;
    }
    .offering-example-list .ex-label,
    .offering-account-row .acc-label {
        flex: 0 0 80px;
        font-size: 14px;
    }
    .offering-example-list .ex-text,
    .offering-account-row .acc-value {
        font-size: 14px;
    }
    .offering-modal-close {
        top: 12px;
        right: 14px;
    }
}

/* =======================================================
   [Responsive] 480px 이하 (모바일 소형)
   ======================================================= */
@media (max-width: 480px) {

    /* 환영합니다 */
     .welcome_circle_item {
        width: calc(50% - 10px);
        max-width: 160px;
    }
    .welcome_circle_inner {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
    }

    /* 설교 */
    .sermon_card_title { font-size: 20px; }
    .sermon_card_btn {
        padding: 10px 18px;
        font-size: 13px;
    }

    /* 새가족 안내 */
    .newfamily_title { font-size: 24px; }

    /* 온라인 헌금 모달 */
    .offering-account-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 8px 0;
    }
    .offering-example-list li {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        padding: 8px 0;
    }
}

/* =======================================================
   [Responsive spacing] 메인 여백 보정 — 기존 애니메이션 유지
   ======================================================= */
@media (max-width:992px) {
    #mainWelcome .welcome_sticky_wrap {padding:4rem 0;}
    #mainWelcome .welcome_title_wrap {margin-bottom:2rem;}
    #mainWelcome.is-active .welcome_desc {margin-top:2rem;}
    /* 원 안쪽은 반응형인데 링크에 남아 있던 170px 높이로 생기는 빈 공간 제거 */
    #mainWelcome .welcome_circle_item {height:auto;}

    #mainSermon,
    #mainGallery,
    #mainMinistry {padding:4rem 0;}
    #mainSermon .sermon_head,
    #mainGallery .gallery_head,
    #mainMinistry .ministry_head {margin-bottom:2rem;}
    #mainSermon .sermon_grid {gap:2rem;}

    #mainNewFamily .newfamily_inner {padding:4rem 0;}
    #mainNewFamily .newfamily_text {margin-bottom:0;}
    #mainNewFamily .newfamily_btns {margin-top:2rem;}
}

@media (max-width:767px) {
    #mainWelcome .welcome_container,
    #mainSermon > .container,
    #mainNewFamily .newfamily_container,
    #mainGallery .gallery_container,
    #mainMinistry > .container {padding-right:1rem; padding-left:1rem;}

    #mainWelcome .welcome_sticky_wrap {padding:2.5rem 0;}
    #mainWelcome .welcome_title {margin-bottom:1rem;}
    #mainWelcome .welcome_title_wrap {margin-bottom:1.5rem;}
    #mainWelcome.is-active .welcome_desc {margin-top:1.25rem;}
    #mainWelcome .welcome_desc_sub {margin-bottom:0.5rem;}
    #mainWelcome .welcome_circle_list {padding:0; gap:1rem;}

    #mainSermon,
    #mainGallery,
    #mainMinistry {padding:2.5rem 0;}
    #mainSermon .sermon_head,
    #mainGallery .gallery_head,
    #mainMinistry .ministry_head {margin-bottom:1.5rem;}
    #mainSermon .sermon_section_title,
    #mainMinistry .ministry_title {margin-bottom:0.75rem;}
    #mainSermon .sermon_grid {gap:1.5rem;}
    #mainSermon .sermon_card,
    #mainSermon .sermon_card_inner {min-height:21rem;}
    #mainSermon .sermon_card_inner {padding:1.5rem;}
    #mainSermon .sermon_card_body {gap:1rem;}
    #mainSermon .sermon_right {gap:1rem;}
    #mainSermon .bulletin_thumb_overlay {padding:1rem 1.25rem;}

    #mainNewFamily .newfamily_inner {padding:3rem 0;}
    #mainNewFamily .newfamily_title {margin-bottom:1rem;}
    #mainNewFamily .newfamily_btns {margin-top:1.5rem; gap:0.75rem;}
    #mainNewFamily .newfamily_btn {padding:0.875rem 1.25rem;}

    #mainGallery .gallery_head {gap:1rem;}
    #mainGallery .gallery_title_wrap {gap:0.75rem 1rem;}
    #mainGallery .gallery_thumb {margin-bottom:1rem;}
    #mainGallery .gallery_cate {margin-bottom:0.375rem;}
    #mainGallery .gallery_item_title {margin-bottom:0.5rem;}
    #mainGallery .gallery_empty {padding:2rem 1rem;}

    #mainMinistry .ministry_list {gap:1rem;}
    /* 고정 비율과 space-between이 벌리던 제목/설명 사이를 내용 높이에 맞춘다. */
    #mainMinistry .ministry_card {aspect-ratio:auto;}
    #mainMinistry .ministry_card_inner {
        height:auto; padding:1.5rem;
        justify-content:flex-start; gap:1.25rem;
    }
    #mainMinistry .ministry_card_en {margin-bottom:0.5rem;}
    #mainMinistry .ministry_card_title {margin-bottom:0.75rem;}

    /* PC용 문장 줄바꿈은 모바일에서 공백으로 이어 붙인다. */
    #mainSermon .sermon_section_desc br,
    #mainNewFamily .newfamily_desc br,
    #mainMinistry .ministry_desc br,
    #mainMinistry .ministry_card_text br {display:contents;}
    #mainSermon .sermon_section_desc br::after,
    #mainNewFamily .newfamily_desc br::after,
    #mainMinistry .ministry_desc br::after,
    #mainMinistry .ministry_card_text br::after {content:" "; white-space:normal;}
}