/*메인*/
/*#dimodePage{display: block!important; transform:translateY(-100px);}*/
.flex { display: flex; justify-content: space-between; }
a:hover { color: black; text-decoration: none; }

section { overflow: hidden; display: block; }




#mainSlider { position: relative; opacity: 0.999; }
.intro_container { width: 1160px; /*width:696px;*/ }
.intro { position: absolute; bottom: 20%; left: 50%; z-index: 99; transform: translateX(-50%); }
.intro-center > div { width: 145px; height: 145px; border: 1px solid #ccc; background: white; /*padding: 27px;*/ padding: 0; transition: .3s; border-radius:20px; }
.intro-center > div:hover { top: -10px; }
.intro-center > div p { font-size: 16px; font-weight: bold; color: black; margin: 0; margin-top: 10px; line-height: 1; }
.intro-center > div a { width: 100%; height: 100%; white-space: nowrap; display: flex; justify-content: center; align-items: center; flex-direction: column; }
#mainSlider .each-img { margin: 0; }

/*section1*/

#main1 { overflow: visible; }

.sermon { padding: 0%; padding-bottom: 4%; /*background: url(../../../Layouts/yejun_renewal_Layout/Images/2.sermon_bg.png);*/ background-size: cover; background-position: 50% 50%; background-origin: border-box; background-repeat: no-repeat; text-align: center; }
.sermon h2 { font-size: 45px; color: #0E1F3D; text-align: left; font-weight:bold;}
.sermon h2 span { color: #8dd0f1;font-weight:normal; font-family: 'Callheart';font-size: 3.5rem;}
.st-2 { padding: 40px 40px; }
.st-2 > div {  text-align: left;display: flex;padding-top: 20px;}
.st-2 > div > a { margin: 20px 20px 0 0; display: block; margin: 0 10px; width: 25%; height: 100%; position: relative; display: flex; justify-content: center; align-items: center; }
.st-2 > div > a.live-a {margin: 0 10px;width: 25%;aspect-ratio: 1 / 1; border-radius: 50%;border: 3.5px solid #0E1F3D;background: #fff;display: flex;flex-direction: column;justify-content: center;align-items: center;position: relative;text-decoration: none;transition: background 0.3s, color 0.3s;}
.st-2 > div > a.live-a p {position: static;margin: 0;text-align: center;color: #0E1F3D;font-size: 20px;font-weight: bold;line-height: 1.3;transition: color 0.3s;}
.st-2 > div > a.live-a .live-icon {font-size: 18px;color: #0E1F3D;/* margin-bottom: 4px; */transition: color 0.3s;}
.st-2 > div > a.live-a:hover {background: #0E1F3D;}
.st-2 > div > a.live-a:hover p,
.st-2 > div > a.live-a:hover .live-icon {color: #fff;}
.st-2 > div > a .live-box { position: relative; }
.st-2 > div > a .live-cont { position: absolute; }
.st-2 > div > a p { position: absolute; margin: 0; text-decoration: none; color: #0E1F3D; font-size: 22px;font-weight:bold; }

.st-1 { transform: translateY(-100px); padding: 0; }
.st-1 > a { width: 100%; display: block; height: 100%; text-decoration: none; color: #fff; }
.st-1 > a .sermon-cont { display:none;/* position: absolute; top: 10%; left: 10%; text-align: left; */ }
.st-1 > a .sermon-play { position: absolute; right: 0; bottom: 0; right: 10%; bottom: 10%; }
.st-1 > a .sermon-img { width: 100%; }
.st-1 > a .sermon-cont .sermon-date { margin-bottom: 8%; }
.st-1 > a .sermon-cont .sermon-title { margin-bottom: 3%; font-size: 35px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 90%; }
.st-1 > a .sermon-cont .sermon-bible { margin-bottom: 5%; }
.st-1 > a .sermon-cont .sermon-pastor { font-size: 20px; }


.sb-1 h2 { padding: 0 15px; margin-bottom: 40px; }
.sb-2 > div > a { text-align: left; color: #10195C; display: block; transform: translateY(-40px); width: 73%; }
.sb-2 > div > img { max-width: unset; width: 100%; }
.sb-2 > div > a p { font-size: 17px;color: #6D717C; white-space: nowrap; }
.sb-2 > div > a h4 { font-size: 24px; line-height: 1.4; margin-bottom: 0; font-weight: 600; position: relative; margin-top: 0; }
.sb-2 > div > a h4 span { font-size: 18px; color: #77A4B9; font-family: 'NanumSquare' !important; font-weight: 600; display:none; }
.sb-2 > div > a h4 img { float: right; margin-top: 0px; position: absolute; right: 0; top: 40%; transform: translateY(-50%); }


/*section2*/


.next { padding: 2% 0%; background: url(../../../Layouts/yejun_renewal_Layout/Images/4_ng_bg.jpg); background-size: cover; background-position: 50% 50%; background-origin: border-box; background-repeat: no-repeat; text-align: center; }
.next h1 { font-size: 60px; color: white; font-weight: bold; letter-spacing: 2px; line-height: 1.5; }
.next h1 span { font-family: 'Noto Sans', serif; font-weight: 500; font-size: 38px; letter-spacing: 7px; color: #fff; }
.next h2 {     font-size: 21px; color: white; margin-bottom: 40px; letter-spacing: 2px;}

.nb-1 > div h4 { color: #10213F; font-size: 32px; font-weight:bold;}
.nb-1 > div > a {  color: #10213F; display: block; border-radius: 125px; background: rgba(255,255,255,1); /*padding: 40% 0;*/ width: 10vw; height: 10vw; display: flex; justify-content: center; align-items: center; flex-direction: column; }
.nb-1 > div > a:hover { background: #6CAED1; color: #fff; }
.nb-1 > div > a:hover h4 { color: #fff; }
.nb-1 > div > a > p { margin: 0; font-size: 20px; }
.nb-1 > div { justify-content: center; align-items: center; display: flex; }
.next-bottom { /*padding: 5%;*/ margin: 2% 0; }



/*section3*/


.gallery { padding: 6% 0% 8%; background: url(../../../Layouts/yejun_renewal_Layout/Images/5_gallery_bg.jpg); background-size: cover; background-position: 50% 50%; background-origin: border-box; background-repeat: no-repeat; text-align: left; margin-bottom: 8rem; }

.photo_container { transform: translateX(14%); }

.gallery h1 { /*font-family: 'Noto Sans', serif;*/ /*font-family: 'NanumSquare', sans-serif;*/ font-size: 52px; font-weight: 600; line-height: 1.5; /*color: rgb(14,55,37,0.5);*/ color: #fff; font-weight: 600; margin-top: 0; }
.gallery h1 span { font-family: 'NanumSquare', sans-serif; font-size: 52px; color: white; }
.gallery h2 { font-size: 23px; color: white; }

.gallery .galleryList-slide { padding: 15px 0; }
.gallery .galleryList-slide > a { display: block; position: relative; margin: 0 15px; }
.gallery .galleryList-slide > a:focus { border: none; }
.gallery .galleryList-slide > a > p { visibility: hidden; position: absolute; top: 47%; left: 50%; transform: translate(-50%, -50%); color: white; }
.gallery .galleryList-slide a:hover > img { filter: brightness(0.5); transition: all .5s linear; }
.gallery .galleryList-slide > a:hover > p { visibility: visible; }
.gallery .galleryList-slide > a > img { width: 100%; height: 14vw; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; position: relative; box-shadow: 5px 5px 10px 0 #111; }

.photo { flex-direction: column-reverse; }
.gallery .slick-list { width: 100%; }


.swiper-pagination1 { width: 100%; position: initial; display: flex; flex-direction: row; margin: 15px 5px; }

.swiper-pagination2 { margin-top: 10%; width: 31vw; display: flex; flex-wrap: wrap; justify-content: center; }

.swiper-pagination1 > li { margin: 0 10px; height: 20px; width: 20px; border-radius: 10px; background: #ccc; border: 1px solid #ccc; }

.swiper-pagination1 .slick-active { width: 40px; border-radius: 20px; background: white; border: 1px solid white; }
.swiper-pagination1 > li > button { display: none; }

#footer { margin-bottom: 100px; }

@media(max-width:1499px) { .intro-center > div { width: 15%; }
    .intro_container { width: 990px; /*width:594px;*/ }

    .nb-1.flex > div { /*padding: 0 20px;*/ }

    .next h1 { font-size: 55px; }
    .next h2 { font-size: 28px; }
    .sermon h2 span { font-size: 40px; }
    .gallery h1 span { font-size: 45px; }
    .sb-2 > div > a p { font-size: 15px; }
    .gallery h2 { font-size: 21px; }
    .nb-1 > div h4 { font-size: 24px; }
}



@media(max-width:1199px) {
    .intro_container { width: 900px; /*width: 540px;*/ }
    .intro-center > div { width: 15%; height: 120px; padding: 7px; /*padding-top: 15px;*/ }
    .pt-1, .photo-left { padding: 0; }
    .st-2 { padding: 40px 20px; }

    .nb-1 > div > a { /*padding: 38% 0;*/ }
    .st-2 > div > a p { font-size: 18px; }

    .next h1 { font-size: 45px; }
    .next h2 { font-size: 24px; }
    .sermon h2 { font-size: 37px; }
    .sermon h2 span { font-size: 34px; }
    .gallery h1 span { font-size: 40px; }
    .sb-2 > div > a p { font-size: 12px; }
    .gallery h2 { font-size: 18px; }
    .nb-1 > div h4 { font-size: 23px; }
}

@media(max-width:991px) {
    .intro { bottom: 12%; }
    .intro-center > div { height: 121px; padding: 5px; }
    .intro_container { width: 690px; /*width: 414px;*/ }
    .intro-center > div p { font-size: 15px; }
    .intro-center > div { width: 15%; height: 108px; padding: 6px; }
    .st-2 > div > a { margin: 0 5px; }
    .st-1 { transform: translateY(-10%); }
    .st-2 { padding: 25px 20px; padding-right: 0; }
    .nb-1 > div > a { /*padding: 31% 0;*/ }
    .sb-2 > div > a h4 { font-size: 21px; }
    .sb-2 > div > a { transform: translateY(-20px); }
    .st-1 > a .sermon-cont .sermon-title { font-size: 22px; }
    .st-1 > a .sermon-cont .sermon-date, .st-1 > a .sermon-cont .sermon-bible, .st-1 > a .sermon-cont .sermon-pastor { font-size: 15px; }
    .st-2 > div > a .live-cont { width: 60%; }
    .st-2 > div > a p { font-size: 16px; }
    .st-1 > a .sermon-play { width: 74px; }
    .st-2 > div > a.live-a p { font-size: 13px; }
    .nb-1 > div > a > p { font-size: 14px; }

    .next h1 span { font-size: 30px; }
    .next h1, .gallery h1 span { font-size: 30px; }
    .next h2 { font-size: 19px; }
    .next h2, .gallery h2, .nb-1 > div h4, .sb-2 > div > a h4 { font-size: 17px; }
    .sermon h2 { font-size: 32px; }
    .sermon h2 span { font-size: 30px; }
    .gallery h1 span { font-size: 30px; }
    .gallery h2 { font-size: 17px; }
    .gallery h1 { font-size: 45px; line-height: 1.2; }
}

@media(max-width:767px) {
    /*모바일 플렉스*/
    #dimodePage { padding-top: 61px; }
    .intro { bottom: 12%; width: 90%; }
    .intro-center { /*display:none;*/ flex-wrap: wrap; }
    .intro-center > div { padding: 10px; width: 30%; margin-bottom: 10px; }
    .intro-center > div img { width: 40px; }
    .intro-center > div p { font-size: 12px; }
    .intro-center > div { height: 85px; }
    .intro_container { width: 100%;padding:0; }


    .sb-2 { display: flex; align-items: center; flex-wrap: wrap; flex-direction: column; }
    .sb-2 > div { max-width: 480px; }
    .sb-2 > div > img { width: 100%; }
    .nb-1 {flex-wrap:wrap;}
    .nb-1.flex > div { padding: 0 5px; }
    .photo_container.flex { flex-direction: column; transform: translateX(2%); }
    .gallery .galleryList-slide > a > img { height: 43vw; }
    .st-1 > a .sermon-cont .sermon-date { margin-bottom: 3%; }
    .st-1 > a .sermon-play { width: 67px; }
    .st-1 > a .sermon-cont .sermon-title { font-size: 20px; }
    .nb-1 > div > a { width: 30vw; height: 30vw; margin-bottom: 20px; }

    .next h1, .gallery h1 span { font-size: 30px; }
    .sb-2 > div > a { transform: translateY(-40px); }
    .next h2, .gallery h2, .nb-1 > div h4, .sb-2 > div > a h4 { font-size: 17px; }
    .sermon h2 { font-size: 30px; }
    .sermon h2 span { font-size: 25px; }
    .gallery h1 span { font-size: 25px; }
    .gallery h1 { font-size: 40px; }
    .pt-1, .photo-left { padding-left: 15px; }
    .st-1 { transform : unset;}
    .st-2 { padding: 0; }
    .st-2 > div { padding-top: 0; width: 90%; margin: auto; padding-bottom: 20px; }
    .st-2 > div > a.live-a { margin: 0 5px; }

    #footer { margin-bottom: 30px; }
    /**/
}

@media(max-width:567px) {
    #mainSlider .each-img { width: 100%; overflow: hidden; }
    #mainSlider .each-img img { display: block; width: 100%; max-width: 100%; height: auto; transform: scale(1.1); transform-origin: left top; }

    .intro_container { width: auto; }
    .intro { position: relative; padding: 15px 0; }
    .intro-center > div { height: auto; display: flex; justify-content: center; align-items: center; padding: 5px; }


    /*.st-1 { transform: translateY(30px); }*/
    .sermon-top { display: flex; flex-direction: column; }
    .nb-1.flex { flex-wrap: wrap; }
    .photo_container { transform: translateX(30px); }
    .nb-1.flex > div { padding: 5px; }

    .next h1, .sermon h2 { font-size: 26px; padding: 0 15px; }
    .sermon h2 span { font-size: 2.5rem; }
    .next h1 span { font-size: 20px; letter-spacing: 4px; }
    .next h2, .gallery h1 { font-size: 18px; word-break: keep-all; }
    .sb-1 h2 { margin-bottom: 15px; }
    .gallery { margin-bottom: 5rem; }
    .gallery h1 { line-height: 1.5; }
    .photo-right { padding: 0; }
    .sb-2 > div > a { transform: translateY(-30px); }
}