@charset "utf-8";

/* ==========================================================================
   1. Fonts & Animations
   ========================================================================== */
@font-face {
    font-family: 'notoserifkr-medium';
    src: url('fonts/notoserifkr-medium.otf') format('opentype');
}

@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%); }
}


/* ==========================================================================
   2. Common Styles
   ========================================================================== */
:root {
    --m1wd: 4;
    --m3wd: 2;
    --m1px: 45px;
}

.no-padding { padding-right: 0; padding-left: 0; }
.no-margin { margin-right: 0; margin-left: 0; }
.nav-tabs { border-bottom: none; }
.plus { position: absolute; top: 0; right: 0; }
.plus:hover { opacity: 0.8; transition: 0.3s all ease; }

#loginForm .form-heading { margin-top: 225px !important; }


/* ==========================================================================
   3. Buttons & UI Components (.view-more, #fp-nav)
   ========================================================================== */
.view-more, .view-more2 {
    display: inline-block;
    text-decoration: none;
    overflow: hidden;
    vertical-align: middle;
    background: transparent;
    -webkit-transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
    z-index: 1;
    font-weight: 100;
}

.view-more:hover:before, a:hover .view-more2:before {
    -webkit-transform: translateX(0) skewX(-17.62deg);
    -ms-transform: translateX(0) skewX(-17.62deg);
    transform: translateX(0) skewX(-17.62deg);
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

.view-more:before, a .view-more2:before {
    z-index: -1;
    content: "";
    display: block;
    width: 135%;
    height: 105%;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: translateX(-101%) skewX(-17.62deg);
    -ms-transform: translateX(-101%) skewX(-17.62deg);
    transform: translateX(-101%) skewX(-17.62deg);
    -webkit-transition: -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.slider .move-btn,
.slider .slider-dots { z-index: 9999; }

/* FullPage.js Navigation */
#fp-nav { background: transparent; z-index: 0 !important; top: 55% !important; display: inline-block; margin: 0 !important; height: 20%; width: 2%; display: none !important; }
#fp-nav ul { display: inline-flex; flex-wrap: wrap; gap: 10px; }
#fp-nav ul li, .fp-slidesNav ul li { padding: 5px; margin: 0; display: inline-block; float: left; width: 30px; height: 30px; }
#fp-nav ul li:last-child { display: none; }
#fp-nav ul li .fp-tooltip { color: #fff !important; opacity: 1 !important; width: 155px !important; font-size: 15px; transform: skew(-0.05deg); right: 30px !important; padding: 5px; text-align: right; }
#fp-nav ul li.white .fp-tooltip { color: #fff !important; }
#fp-nav ul li a span { width: 12px; height: 12px; }
#fp-nav ul li a span, #fp-nav ul li.white a span { background-color: transparent; margin: -6px 0 0 -6px; border: 1px solid #fff; }
#fp-nav ul li a.active { text-decoration: none; border-radius: 100%; position: relative; transition: .3s all; }
#fp-nav ul li:hover a span,
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span { width: 12px; height: 12px; border: 1px solid #fff; background-color: #fff; }


/* ==========================================================================
   4. Desktop Layout (Main 1 : Slider)
   ========================================================================== */
#main1 { padding: 0; margin: 0; height: 100vh; overflow: hidden; position: relative; }
#main1 .main1S, #main1 .main1S .swiper-wrapper, #main1 .main1S .swiper-wrapper .swiper-slide { width: 100%; height: 100%; }
#main1 .main1S .swiper-slide { display: flex; justify-content: center; align-items: center; position: relative; overflow: hidden; }

/* 💡 비디오: 정중앙 배치 및 비율 유지 (contain) */
#main1 .main1S .swiper-slide video {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 100% !important;
    height: 100% !important;
    transform: translate(-50%, -50%) !important; /* 완벽한 수직/수평 중앙 정렬 */
    object-fit: contain !important; /* 원본 비율 유지하며 잘리지 않음 */
    z-index: 0;
    margin: auto;
    background-color: #000; /* 동영상 비율때문에 생기는 상하/좌우 빈 공간을 검은색으로 채움 */
}

/* (선택사항) 슬라이드 자체의 배경도 검은색으로 맞춰주면 위아래 흰 여백이 보이지 않아 더 깔끔합니다. */
#main1 .main1S .swiper-slide {
    background-color: #000; 
}

/* 💡 이미지: 기존처럼 화면에 꽉 채우기 (cover 유지) */
#main1 .main1S .swiper-slide .each-img img,
#main1 .main1S .swiper-slide img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100% !important;
    height: 100% !important;
    min-width: 100%;
    min-height: 100%;
    object-fit: cover !important;
    transform: translate(-50%, -50%);
    z-index: 0;
}

#main1 .main1S .swiper-slide .each-img { width: 100%; height: 100%; background-position: center; background-size: cover; background-repeat: no-repeat; text-align: center; position: relative; }
#main1 .main1S .slidePA { position: absolute; transform: translate(0%, -50%); width: 100%; z-index: 1; display: flex; justify-content: center; bottom: 30px; }
#main1 .main1S .slidePA .swiper-pagination-bullet { width: 15px; height: 15px; background-color: rgba(255, 255, 255, .5); }
#main1 .main1S .slidePA .swiper-pagination-bullet-active { background-color: #fff; }

.swiper-button-next { background-image: url('../images/1_next_bt.png'); background-repeat: no-repeat; background-position: center; background-size: auto; }
.swiper-button-prev { background-image: url('../images/1_prev_bt.png'); background-repeat: no-repeat; background-position: center; background-size: auto; }

/* 💡 슬라이드 1개일 때 숨김 처리용 클래스 */
.hidden { display: none !important; }

/* -- Main 2 -- */
#main2 .main2T { text-align: center; margin: 0 0 4.5vw; }
#main2 .main2T h1 { margin: 0; font-size: 3rem; }
#main2 .main2T h2 { margin: 0 0 1vw; font-size: 2rem; color: rgba(0,0,0,.8); }
#main2 .main2T h3 { margin: 0 0 3vw; font-size: 1.7rem; }
#main2 .main2M { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; }
#main2 .main2M .WCBTN { aspect-ratio: 69 / 61; position: relative; text-align: center; background-repeat: no-repeat; background-position: center; background-size: contain; }
#main2 .main2M .WCBTN:hover { position: relative; animation-name: updown; animation-duration: 1s; animation-iteration-count: 1; animation-direction: alternate; animation-fill-mode: forwards; }
#main2 .main2M .WCBTN h1 { margin: 0; width: 100%; transform: translate(-50%, -50%); top: 40%; left: 50%; position: absolute; font-size: 2rem; color: #000; font-weight: bold; }
#main2 .main2M .WCBTN h2 { margin: 0; width: 100%; transform: translate(-50%, -50%); top: 60%; left: 50%; position: absolute; font-size: 1.3rem; color: #000; }

/* -- Main 3 -- */
#main3 .main3T { text-align: center; margin: 0 0 5vw; color: #fff; }
#main3 .main3T h1 { margin: 0; font-size: 1.7rem; }
#main3 .main3TM { position: relative; background-color: #e4f2fc; margin: 0 0 1.6vw; border-radius: 15px; }
#main3 .main3TM .sermonM { padding: 3.2vw 5.5vw; }
#main3 .main3TM .sermonM .sermomL .sermomLM > a { display: inline-block; margin: 0 0 2vw; text-decoration: none; color: #000; }
#main3 .main3TM .sermonM .sermomL .sermomLM > a h1 { margin: 0 0 1.7vw; font-size: 2.8rem; }
#main3 .main3TM .sermonM .sermomL .sermomLM > a h3 { margin: 0 0 2vw; font-size: 1.3rem; }
#main3 .main3TM .sermonM .sermomL .sermomLM > a h4 { margin: 0; font-size: 1.1rem; line-height: 1.2; }
#main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT { display: flex; gap: 1.5vw; }
#main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a { position: relative; padding: 1.3vw 6vw; display: inline-block; background-color: #000; border-radius: 100px; color: #fff; }
#main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a.youtbCH { background-color: #d42525; }
#main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a .SIMG { transform: translate(-50%, -50%); right:-50%; position: absolute; width: 100%; display: flex; align-items: center; justify-content: center; gap: .5vw; }
#main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a .SIMG h1 { margin: 0; font-size: 1.1rem; }
#main3 .main3TM .sermonM .sermomR { display: inline-block; position: absolute; bottom: 0; right: 6%; text-decoration: none; color: #fff; cursor:no-drop;}
#main3 .main3TM .sermonM .sermomR .sermomRM .EPBT { position: absolute; transform: translate(50%, -50%); padding: 77.5px; border-radius: 50%; background-color: #2a2e75; right: 0; top: 75%; }
#main3 .main3TM .sermonM .sermomR .sermomRM .EPBT h1 { margin: 0; font-size: 1.3rem; position: absolute; transform: translate(-50%, -50%); top: 40%; width: 100%; text-align: center; }
#main3 .main3TM .sermonM .sermomR .sermomRM .EPBT img { position: absolute; transform: translate(-50%, -50%); top: 70%; }

#main3 .main3BM { display: grid; grid-template-columns: 1fr 1px 1fr 1px 1fr; align-items: center; gap: 2.1vw; position: relative; }
#main3 .main3BM .cmBM { position: relative; text-decoration: none; color: #fff; }
#main3 .main3BM .cmBM .cmBTM { position: relative; aspect-ratio: 3.42 / 1; }
#main3 .main3BM .cmBM .cmBTM .cmBT { position: relative; margin: 0 0 1.6vw; }
#main3 .main3BM .cmBM .cmBTM .cmBT h1 { margin: 0; font-size: 1.5rem; }
#main3 .main3BM .cmBM .cmBTM .cmBT .more { font-size: .9rem; padding: .1vw .8vw; display: inline-block; text-align: center; color: #fff; border-radius: 15px; position: absolute; transform: translate(0%, 0%); top: 0; right: 0; border: 1px solid #fff; }
#main3 .main3BM .cmBM .cmBTM .cmBT .more:before { background-color: #fff; }
#main3 .main3BM .cmBM:hover .cmBTM .cmBT .more { color: #000; }
#main3 .main3BM .cmBM .cmBTM > h1 { margin: 0; font-size: 1.1rem; }
#main3 .main3BM .cmBM .cmBTM > h2 { position: absolute; bottom: 0; left: 0; margin: 0; font-size: .9rem; }
#main3 .main3BM .cmBM .cmBTM .arrowBT { display: inline-block; padding: .2vw 1vw; background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; right: 0; bottom: 0; }
#main3 .main3BM .cmHR { height: 100%; border: 1px solid #fff; }

/* -- Main 4 -- */
#main4 .main4T { text-align: center; margin: 0 0 4.5vw; }
#main4 .main4T h1 { margin: 0; font-size: 3rem; }
#main4 .main4T h2 { margin: 0 0 1vw; font-size: 2rem; color: rgba(0,0,0,.8); }
#main4 .main4T h3 { margin: 0 0 3vw; font-size: 1.7rem; }
#main4 .main4T h4 { margin: 3.6rem 0 0; font-size: 1.4rem; color: #262f81; }
#main4 .main4M { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 1.6vw; }
#main4 .main4M .MiniBT { aspect-ratio: 334 / 245; background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 15px; text-decoration: none; color: #fff; position: relative; }
#main4 .main4M .MiniBT:hover { position: relative; animation-name: updown; animation-duration: 1s; animation-iteration-count: 1; animation-direction: alternate; animation-fill-mode: forwards; }
#main4 .main4M .MiniBT h1 { margin: 0; font-size: 2rem; transform: translate(-50%, -50%); position: absolute; text-align: center; top: 35%; left: 50%; width: 100%; }
#main4 .main4M .MiniBT h2 { margin: 0; font-size: 1.6rem; transform: translate(-50%, -50%); position: absolute; text-align: center; top: 65%; left: 50%; width: 100%; }

/* -- Main 5 -- */
#main5 .main5T { text-align: center; margin: 0 0 3.9vw; }
#main5 .main5T h1 { font-size: 1.7rem; margin: 0; }
#main5 .main5M { text-align: center; }
#main5 .main5M .gallerySD { overflow: hidden; margin: 0 0 3.5vw; }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide { padding: 1vw 1vw 1.5vw 1vw; aspect-ratio: 112 / 141; background-color: rgba(0,0,0,0.5); border-radius: 15px; text-decoration: none; color: #fff; transition: 0.3s all ease; }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide:hover { background-color: rgba(41,47,104,.8); }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM { position: relative; height: 100%; }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM .galleryIMG { aspect-ratio: 1.267 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM .galleryT { margin: 1.2vw 0 0; text-align: left; }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM .galleryT h1 { margin: 0; font-size: 1.1rem; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM .galleryT h5 { margin: 0; font-size: .9rem; line-height: 2; }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM .galleryMore { display: inline-block; border-radius: 50%; transform: translate(0%, 0%); position: absolute; right: 0; bottom: 0; padding: 1.3vw; border: 1px solid #fff; background-color: rgba(255,255,255,.2) }
#main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM .galleryMore img { transform: translate(-50%, -50%); position: absolute; text-align: center; top: 50%; left: 50%; }
#main5 .main5M .galleryP { padding: 1.2vw .7vw; display: inline-block; position: absolute; top: 50%; left: 10%; transform: translate(-50%, -50%); }
#main5 .main5M .galleryP .on, #main5 .main5M .galleryP .off { position: absolute; width: 100%; height: 100%; top: 0; right: 0; background-repeat: no-repeat; background-position: center; background-size: cover; }
#main5 .main5M .galleryN { padding: 1.2vw .7vw; display: inline-block; position: absolute; top: 50%; left: 90%; transform: translate(-50%, -50%); }
#main5 .main5M .galleryN .on, #main5 .main5M .galleryN .off { position: absolute; width: 100%; height: 100%; top: 0; right: 0; background-repeat: no-repeat; background-position: center; background-size: cover; }
#main5 .main5M .main2HF { position: relative; display: inline-block; padding: 1vw 3.5vw; border-radius: 100px; background-color: #292f68; text-decoration: none; color: #fff; }
#main5 .main5M .main2HF h1 { margin: 0; font-size: .9rem; transform: translate(-50%, -50%); position: absolute; text-align: center; top: 50%; left: 50%; }


/* ==========================================================================
   5. Legacy Commented Code (원문 보존)
   ========================================================================== */
/*
#main1 .each-img{margin:0;}
#main1 .each-img img{width:100%;}
#main1 .slide{background-repeat:no-repeat;background-position:center;background-size: cover;}
#main1 .slide video{float:left;}
#main2,
#main3,
#main4,
#main5,
#main6,
#main7{background-repeat:no-repeat;background-position:center;background-size:cover;}

#main2{}
#main2 .main2T{text-align:center;padding-bottom:60px;padding-top: 100px;}
#main2 .main2T h1{letter-spacing: -1.23px;font-size: 46px;color: #fff;margin: 0;line-height: 1.5;font-family: 'Pretendard-Bold';}
#main2 .main2T h5{letter-spacing: 10.25px;font-size: 17px;color: #fff;margin: 0;font-family: 'Pretendard-Regular';}
#main2 .main2M{}
#main2 .main2M .main2TO{display: grid;grid-template-columns: 7fr 5fr;gap:30px;padding-bottom: 35px;}
#main2 .main2M .main2TO .main2TR{padding: 45px 55px;background-image: url('../images/2.sermon_bg.png');}
#main2 .main2M .main2TO .main2TR:hover{position: relative;animation-name: updown;
animation-duration: 1s;animation-duration: leaner;animation-iteration-count: 1;animation-direction: alternate;animation-fill-mode: forwards;}
#main2 .main2M .main2TO .main2TR .SRT{text-decoration:none;}
#main2 .main2M .main2TO .main2TR .SRT h2{letter-spacing: -0.64px;color: #000;font-size: 24px;margin: 0;font-family: 'Pretendard-Bold';margin-bottom:45px;}
#main2 .main2M .main2TO .main2TR .SRT h1{letter-spacing: -0.96px;font-size: 38.5px;color: #000;margin: 0;font-family: 'Pretendard-Regular';margin-bottom:50px;}
#main2 .main2M .main2TO .main2TR .SRT h5{margin: 0;font-size: 20px;letter-spacing: -0.54px;color: #000;font-family: 'Pretendard-Regular';display: inline-flex;gap: 5px;margin-top:10px;}
#main2 .main2M .main2TO .main2TR .SRT h5 span{}
#main2 .main2M .main2TO .main2TR .SRT h4{margin: 0;font-size: 20px;letter-spacing: -0.54px;color: #000;font-family: 'Pretendard-Regular';}
#main2 .main2M .main2TO .main2TL .main2TLT{display: inline-flex;width: 100%;justify-content: space-between;align-items: center;padding-bottom: 5px;border-bottom: 3px solid #fff;}
#main2 .main2M .main2TO .main2TL .main2TLT a{font-size: 20px;letter-spacing: -0.64px;color: #fff;font-family: 'Pretendard-Regular';transition:0.3s all ease;text-decoration:none;}
#main2 .main2M .main2TO .main2TL .main2TLT a:hover{ color:#A4DEFF;transition:0.3s all ease;}
#main2 .main2M .main2TO .main2TL ul{}
#main2 .main2M .main2TO .main2TL ul a{}
#main2 .main2M .main2TO .main2TL ul a li{padding: 10px 0;display: inline-flex;flex-direction: row;width: 100%;gap: 40px;justify-content: flex-start;position:relative;border-bottom: 1px solid rgba(255, 255, 255, .5);}
#main2 .main2M .main2TO .main2TL ul a li .SLBG{height: 70px;width: 20%;background-repeat:no-repeat;background-position:center;background-size:cover;}
#main2 .main2M .main2TO .main2TL ul a li .SLT{display: inline-flex;flex-direction: column;justify-content: center;gap: 10px;}
#main2 .main2M .main2TO .main2TL ul a li .SLT h1{letter-spacing: -0.64px;color: #fff;font-size: 20px;margin: 0;}
#main2 .main2M .main2TO .main2TL ul a li .SLT h5{color: rgba(255, 255, 255, 0.5);opacity: 0.5;margin: 0;font-size: 20px;}
#main2 .main2M .main2TO .main2TL ul a li img{position: absolute;transform: translate(0, -50%);top: 50%;right: 5%;opacity:.5;transition:0.3s all ease;}
#main2 .main2M .main2TO .main2TL ul a:hover li img{opacity:1;transition:0.3s all ease;}
#main2 .main2M .main2BO{}
#main2 .main2M .main2BO .sermonSD{overflow:hidden;}
#main2 .main2M .main2BO .sermonSD .swiper-slide{text-decoration:none;}
#main2 .main2M .main2BO .sermonSD .swiper-slide .sermonSBG{height: 205px;background-repeat:no-repeat;background-position:center;background-size:cover;}
#main2 .main2M .main2BO .sermonSD h1{margin: 0;letter-spacing: -0.54px;color: #fff;font-size: 20px;padding-top: 10px;}

#main3{}
#main3 .main3M{}
#main3 .main3M .main3TO{display: grid;grid-template-columns: 3fr 12fr;gap: 130px;padding-bottom:75px;padding-top: 105px;}
#main3 .main3M .main3TO .main3TOT{text-decoration:none;}
#main3 .main3M .main3TO .main3TOT h1{letter-spacing: -1.23px;font-size: 46px;color: #fff;margin: 0;line-height: 1.5;font-family: 'Pretendard-Bold';}
#main3 .main3M .main3TO .main3TOT h5{letter-spacing: 8px;font-size: 17px;color: #fff;margin: 0;font-family: 'Pretendard-Regular';}
#main3 .main3M .main3TO .main3TOM{}
#main3 .main3M .main3TO .main3TOM .NewsSD{height:390px;overflow:hidden;}
#main3 .main3M .main3TO .main3TOM .NewsSD .contentSlide{border-bottom:1px solid #fff;}
#main3 .main3M .main3TO .main3TOM .NewsSD .swiper-slide-active{border-top:1px solid #fff;}
#main3 .main3M .main3TO .main3TOM .NewsSD a{display: inline-flex;flex-direction: row;width: 100%;padding: 30px 35px;gap:60px;position:relative;text-decoration:none;}
#main3 .main3M .main3TO .main3TOM .NewsSD a .galleryIMG{height: 130px;width: 30%;background-repeat:no-repeat;background-position:center;background-size:cover;}
#main3 .main3M .main3TO .main3TOM .NewsSD a .galleryT{display: inline-flex;flex-direction: column;justify-content: center;gap: 20px;}
#main3 .main3M .main3TO .main3TOM .NewsSD a .galleryT h1{font-family: 'Pretendard-Bold';font-size: 24px;color: #fff;letter-spacing: -0.6px;width: 100%;margin:0;}
#main3 .main3M .main3TO .main3TOM .NewsSD a .galleryT h5{letter-spacing: -0.48px;font-size: 19px;color: #fff;margin:0;}
#main3 .main3M .main3TO .main3TOM .NewsSD a img{position: absolute;transform: translate(0, -50%);top: 50%;right: 5%;}
#main3 .main3M .main3BO{display: grid;grid-template-columns: 3fr 12fr;gap: 130px;}
#main3 .main3M .main3BO .main3BOT{text-decoration:none;}
#main3 .main3M .main3BO .main3BOT h1{letter-spacing: -1.23px;font-size: 46px;color: #fff;margin: 0;line-height: 1.5;font-family: 'Pretendard-Bold';}
#main3 .main3M .main3BO .main3BOT h5{letter-spacing: 8px;font-size: 17px;color: #fff;margin: 0;font-family: 'Pretendard-Regular';}
#main3 .main3M .main3BO .main3BOM{overflow:hidden;margin:0 35px;}
#main3 .main3M .main3BO .main3BOM .GallerySD{}
#main3 .main3M .main3BO .main3BOM .GallerySD .contentSlideWrapper{}
#main3 .main3M .main3BO .main3BOM .GallerySD .contentSlideWrapper .contentSlide{}
#main3 .main3M .main3BO .main3BOM .GallerySD .contentSlideWrapper .contentSlide a{}
#main3 .main3M .main3BO .main3BOM .GallerySD .contentSlideWrapper .contentSlide a .galleryIMG{height:165px;margin-bottom:15px;background-size:cover;background-repeat:no-repeat;background-position:center;}
#main3 .main3M .main3BO .main3BOM .GallerySD .contentSlideWrapper .contentSlide a .galleryT{display:inline-flex;gap:5px;}
#main3 .main3M .main3BO .main3BOM .GallerySD .contentSlideWrapper .contentSlide a .galleryT h1{letter-spacing: -0.5px;font-size:20px;color:#fff;margin:0;}

#main4{}
#main4 .main4T{padding-top: 30px;padding-bottom:105px;text-align:center;}
#main4 .main4T h1{letter-spacing: -1.23px;font-size: 46px;color: #fff;margin: 0;line-height: 1.5;font-family: 'Pretendard-Bold';}
#main4 .main4T h5{letter-spacing: 10px;font-size: 17px;color: #fff;margin: 0;font-family: 'Pretendard-Regular';}
#main4 .main4M{display: grid;grid-template-columns: 7fr 8fr;gap: 115px;}
#main4 .main4M .main4L .main4LT{padding-bottom:50px;}
#main4 .main4M .main4L .main4LT h1{letter-spacing: -0.9px;color: #fff;font-size: 36px;margin:0;padding-bottom:25px;}
#main4 .main4M .main4L .main4LT h5{letter-spacing: -0.51px;color: #fff;font-size: 20px;margin:0;}
#main4 .main4M .main4L .main4LM{display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 30px;justify-items: start;}
#main4 .main4M .main4L .main4LM .circle{padding: 83px;position: relative;opacity: 0.8;background-color: #0b58b3;border-radius: 50%;}
#main4 .main4M .main4L .main4LM .circle:hover{position: relative;animation-name: updown;
animation-duration: 1s;animation-duration: leaner;animation-iteration-count: 1;animation-direction: alternate;animation-fill-mode: forwards;}
#main4 .main4M .main4L .main4LM .circle h1{position: absolute;margin: 0;transform: translate(-50%, -50%);top: 50%;
letter-spacing: -0.51px;color: #fff;font-size: 17px;text-align: center;width: 100%;line-height: 1.3;}
#main4 .main4M .main4R{display: grid;grid-template-columns: 1fr 1fr;gap:30px;}
#main4 .main4M .main4R .mission{height: 360px;padding: 50px 40px;text-decoration:none;}
#main4 .main4M .main4R .mission:hover{position: relative;animation-name: updown;
animation-duration: 1s;animation-duration: leaner;animation-iteration-count: 1;animation-direction: alternate;animation-fill-mode: forwards;}
#main4 .main4M .main4R .mission h1{font-family: 'Pretendard-Bold';letter-spacing: -0.9px;font-size:36px;color:#fff;margin:0;padding-bottom:25px;}
#main4 .main4M .main4R .mission h2{letter-spacing: -0.51px;font-size:20px;color:#fff;margin:0;}

#main5{}
#main5 .main5T{padding-top: 65px;padding-bottom:105px;text-align:center;}
#main5 .main5T h1{letter-spacing: -1.23px;font-size: 46px;color: #fff;margin: 0;line-height: 1.5;font-family: 'Pretendard-Bold';}
#main5 .main5T h5{letter-spacing: 10px;font-size: 17px;color: #fff;margin: 0;font-family: 'Pretendard-Regular';}
#main5 .main5M{display: grid;grid-template-columns: 1fr 1fr 1fr 1fr 1fr;gap: 15px;}
#main5 .main5M a{padding:15px;background-color:#fff;color:#000;text-decoration:none;}
#main5 .main5M a:hover{position: relative;animation-name: updown;
animation-duration: 1s;animation-duration: leaner;animation-iteration-count: 1;animation-direction: alternate;animation-fill-mode: forwards;}
#main5 .main5M a .schoolBG{height:145px;background-size:cover;background-repeat:no-repeat;background-position:center;}
#main5 .main5M a .schoolM{position:relative;}
#main5 .main5M a hr{border-color: #000;}
#main5 .main5M a .schoolM h1{font-family: 'Pretendard-Bold';margin: 0;font-size: 28px;letter-spacing: -0.7px;margin-bottom: 15px;}
#main5 .main5M a .schoolM h2{margin: 0;line-height: 1.4;letter-spacing: -0.44px;font-size: 17px;}
#main5 .main5M a .schoolM ul{padding-top: 55px;display: inline-flex;flex-direction: column;align-items: flex-start;gap: 5px;padding-bottom:25px;}
#main5 .main5M a .schoolM ul li{line-height: 1.4;letter-spacing: -0.44px;font-size: 17px;display: inline-flex;align-items: center;gap: 5px;}
#main5 .main5M a h5{margin:0;letter-spacing: -0.44px;color: #0e316a;font-size:17px;text-align:right;}
*/


/* ==========================================================================
   6. Responsive Media Queries
   ========================================================================== */
@media (max-width: 768px) {
    #main1 .each-img img { object-fit: contain; max-height: 80vh; max-width: 100%; }
}

@media (max-width:1699px) {
    /* 폰트 및 요소 미세 조정 */
    #main2 .main2M .WCBTN h1 { font-size: 1.8rem; }
    #main3 .main3TM .sermonM .sermomR .sermomRM .EPBT { padding: 65px; }
}

@media (max-width:1499px) {
    #main2 .main2M .WCBTN h1 { font-size: 1.6rem; }
    #main3 .main3TM .sermonM .sermomR .sermomRM .EPBT { padding: 55px; }
    #main3 .main3TM .sermonM .sermomR .sermomRM .EPBT h1 { font-size: 1.1rem; }
    #main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a { padding: 2vw 9vw; }
    #main5 .main5M .main2HF { padding: 2vw 5.5vw; }
}

@media (max-width:1199px) {
    #main2 .main2M .WCBTN h1 { font-size: 1.3rem; }
    #main2 .main2M .WCBTN h2 { font-size: 1.5rem; }
    #main3 .main3TM .sermonM { padding: 4vw 5vw; }
    #main4 .main4M .MiniBT h1 { font-size: 1.6rem; }
    #main4 .main4M .MiniBT h2 { font-size: 1.2rem; }
}

@media (max-width:992px) {

/* 🚨 1. FullPage.js가 몰래 넣는 풀페이지 높이 완벽 무력화 🚨 */
    #main1, 
    #main1.fp-section,
    #main1 .fp-tableCell,
    #main1 .fp-scroller {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 !important;
    }

    /* 🚨 2. 어떤 상황에서도 무조건 16:9 비율을 유지하는 절대 방식 (Padding-bottom hack) */
    .main1S {
        width: 100% !important;
        height: 0 !important; /* 높이를 0으로 주고 */
        padding-bottom: 56.25% !important; /* 패딩으로 16:9 공간을 억지로 뚫어버림 */
        position: relative !important;
        background-color: #000 !important;
        overflow: hidden !important;
    }

    /* 🚨 3. 내부 슬라이드 껍데기들은 16:9 부모 영역을 100% 꽉 채우기 */
    .main1S .swiper-wrapper,
    .main1S .swiper-slide {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
    }

    /* 🚨 4. 비디오 & 이미지 꽉 채우기 (여백 원천 차단) */
    #main1 .main1S .swiper-slide video,
    #main1 .main1S .swiper-slide img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        transform: none !important;
        margin: 0 !important;
    }
    
    /* 👇 (이 아래에 있는 .fp-responsive .section 등 나머지 기존 코드는 그대로 두시면 됩니다.) 👇 */
    .fp-responsive .section { padding: 80px 0; }
    .fp-responsive #main1 { padding: 0; }
    
    /* Main 2 : 4단 -> 2단 그리드 */
    #main2 .main2T h1 { font-size: 2.5rem; }
    #main2 .main2T h2 { font-size: 1.5rem; }
    #main2 .main2M { grid-template-columns: 1fr 1fr; gap: 20px; }
    #main2 .main2M .WCBTN h1 { font-size: 1.8rem; }
    
    /* Main 3 : 레이아웃 재배치 */
    #main3 .main3TM .sermonM .sermomR { position: relative; right: auto; bottom: auto; margin-top: 30px; display: block; text-align: center; }
    #main3 .main3TM .sermonM .sermomR .sermomRM .EPBT { position: relative; transform: none; right: auto; top: auto; display: inline-block; padding: 50px; border-radius: 100px; margin: 20px 0 0; }
    #main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a { padding: 4vw 12vw; }
    #main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a .SIMG{gap:3vw;}
    #main3 .main3BM { grid-template-columns: 1fr; gap: 20px; } /* 하단 게시물 1단으로 스택 */
    #main3 .main3BM .cmHR { display: none; } /* 세로 구분선 숨김 */
    #main3 .main3BM .cmBM .cmBTM { aspect-ratio: 5 / 1; }
    
    /* Main 4 : 4단 -> 2단 그리드 */
    #main4 .main4T h2{font-size: 1.6rem;}
    #main4 .main4M { grid-template-columns: 1fr 1fr; gap: 20px; }
    #main4 .main4M .MiniBT h1 { font-size: 1.8rem; }
    #main5 .main5M .gallerySD .contentSlideWrapper .contentSlide{padding:3vw;aspect-ratio: 1 / 1.1;}
    #main5 .main5M .gallerySD .contentSlideWrapper .contentSlide .galleryM .galleryMore{padding: 3vw;}
    
    /* Footer : 4단 -> 2단 그리드 */
    #mainF .mainFT .mainFTM { grid-template-columns: 1fr 1fr; width: 100%; gap: 15px; }

    .main1S-pagination {
        bottom: 10px !important;
    }
}

@media (max-width:767px) {
    /* vw 단위를 px/rem 고정값으로 변경하여 모바일에서 너무 작아지는 것 방지 */
    .fp-responsive .section{padding: 20px 0;}
    .row{margin:0!important;}

    /* Main 2 */
    #main2 .main2T { margin: 0 0 30px; }
    #main2 .main2T h1 { font-size: 1.8rem; }
    #main2 .main2T h2 { font-size: 1.1rem; }
    #main2 .main2T h3 { font-size: 1.1rem; margin: 0 0 15px; }
    #main2 .main2M { gap: 10px; }
    #main2 .main2M .WCBTN h1 { font-size: 1.2rem; top: 35%; }
    #main2 .main2M .WCBTN h2 { font-size: 0.9rem; top: 65%; }

    /* Main 3 */
    #main3 .main3T { margin: 0 0 30px; }
    #main3 .main3TM { margin: 0 0 30px; }
    #main3 .main3TM .sermonM .sermomL .sermomLM > a h1 { font-size: 1.8rem; }
    #main3 .main3TM .sermonM .sermomL .sermomLM > a h3 { font-size: 1.1rem; }
    #main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT { flex-direction: column; gap: 10px; }
    #main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a { padding: 15px 30px; border-radius: 30px; }
    #main3 .main3TM .sermonM .sermomL .sermomLM .sermomLBT a .SIMG h1 { font-size: 1rem; }
    #main3 .main3BM .cmBM .cmBTM .cmBT .more{padding: 1.5vw 3vw;}
    
    /* Main 4 */
    #main4 .main4T { margin: 0 0 30px; }
    #main4 .main4T h1 { font-size: 1.8rem; }
    #main4 .main4T h2 { font-size: 1.2rem; }
    #main4 .main4T h4 { font-size: 1.1rem; margin-top: 2rem; }
    #main4 .main4M { gap: 10px; }
    #main4 .main4M .MiniBT h1 { font-size: 1.2rem; top: 35%; }
    #main4 .main4M .MiniBT h2 { font-size: 0.9rem; top: 65%; }
    
    /* Main 5 (Gallery) */
    #main5 .main5T { margin: 0 0 30px; }
    #main5 .main5M .galleryP, #main5 .main5M .galleryN { display: none; } /* 모바일에서는 스와이프로 넘기도록 버튼 숨김 */
    #main5 .main5M .gallerySD .contentSlideWrapper .contentSlide{aspect-ratio: inherit;}
    
    /* Footer */
    #mainF .mainFT { padding: 30px 0; }
    #mainF .mainFT .mainFTM { grid-template-columns: 1fr; } /* 1단 그리드 */
    #mainF .mainFT .mainFTM .commBT { padding: 15px; border-radius: 15px; }
    #mainF .mainFB { flex-direction: column; align-items: center; text-align: center; padding: 30px 0; gap: 20px; }

    .main1S .txt_box .t1 {
        font-size: 24px !important;
        line-height: 1.3 !important;
    }
    .main1S .txt_box .t2 {
        font-size: 16px !important;
        margin-top: 10px !important;
    }
    .main1S-next, .main1S-prev {
        display: none !important;
    }
}

@media (max-width:320px) {
    /* 아주 작은 화면 예외 처리 */
    #main2 .main2M .WCBTN h1, #main4 .main4M .MiniBT h1 { font-size: 1rem; }
}