@charset "UTF-8";
@import url("pages.css?ver=2.1");
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@import url('https://fonts.googleapis.com/css2?family=Diphylleia&family=Noto+Serif+KR:wght@200..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css?family=EB+Garamond:400,400i');
@font-face {font-family:'ssg'; font-weight: normal; src: url('../fonts/ss-gi.woff') format('woff');}

/* reset.css */
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, address, dl, dt, dd, ol, ul, li, fieldset, form, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, select, textarea{margin:0; padding:0;}
img, fieldset {border:0px!important;}
table {border-collapse:collapse;}
ul, ol, li {list-style:none;}
address, em {font-style:normal;}
li img, object {vertical-align:top;}
input, select, textarea, form img {vertical-align:middle;}
a {outline:0; text-decoration:none!important; border:none;}

body {font-family: 'Pretendard', sans-serif; font-weight:400; line-height:1.8; font-size:16px;}
h1, h2, h3, h4, h5, h6 {font-family: 'Pretendard', sans-serif; font-size:1em;}
input, button {font-family: 'Pretendard', sans-serif; font-size:1em;}
textarea, select {font-family: 'Pretendard', sans-serif; font-size:1em;}

/* common */
.container-1600 {max-width:1600px; margin:0 auto;}
.container-1400 {max-width:1440px; margin:0 auto;}
.container-1280 {max-width:1310px; padding-left:15px; padding-right:15px; margin:0 auto;}
.container-1000 {max-width:1030px; padding-left:15px; padding-right:15px; margin:0 auto;}
.container-790 {max-width:820px; padding-left:15px; padding-right:15px; margin:0 auto;}
.container-700 {max-width:700px; margin:0 auto;}
.container-590 {max-width:620px; padding-left:15px; padding-right:15px; margin:0 auto;}
.article-wrap-790 {max-width:790px; margin:0 auto;}
.serif {font-family: 'Noto Serif KR';}

.row {margin-left:-10px; margin-right:-10px;}
.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12 {padding-left:10px; padding-right:10px;}
.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12 {padding-left:10px; padding-right:10px;}
.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12 {padding-left:10px; padding-right:10px;}

.row-custom {margin-left:-10px; margin-right:-10px; margin-bottom:20px;}	
.row-custom .col-custom {padding-left:10px; padding-right:10px;}

/* bootstrap4 modal margin-right issue */
body {padding-right:0 !important;}
.ctt_admin {display:none;}

.subNavTap {margin-bottom:45px;}
.subNavTap .nav-tabs {border-bottom:none;}
.subNavTap .nav-tabs li {border:1px solid #ddd; margin-bottom:15px;}
.subNavTap .nav-tabs li:not(:last-child) {margin-right:10px;}
.subNavTap .nav-tabs>li>.active {background-color:#454545;}
.subNavTap .nav-tabs>li>a {color:#666; border-radius:0px; padding:12px 20px; margin-right:0px; border:none; display:block; line-height:1;}
.subNavTap .nav-tabs>li.active>a, .subNavTap .nav-tabs>li.active>a:focus, .subNavTap .nav-tabs>li.active>a:hover {border:none; background-color:#0F4C82; color:#fff;}

/* nav */
.mnav {position:absolute; top:50%; right:12px; transform:translateY(-50%);}
.mnav > a {color:#666;}
.material-icons {font-size:2em;}
.sidenav .nav-wrap-top {background-color:#927664; color:#fff; position:relative;}
.sidenav .nav-wrap-top .closeBtn {position:absolute; right:15px; top:25px;}
.sidenav .nav-wrap-top .closeBtn a {display:block; font-size:0.825em; color:#fff; padding:12px 13px; border-radius:5px; border:1px solid rgba(255,255,255,0.3);}
.sidenav .nav-wrap-top .nav-info1 {display:block; overflow:hidden; padding:50px 30px;}
    .sidenav .nav-wrap-top .nav-info1 li {font-size:20px; font-weight:400;}
.sidenav .nav-wrap-top .nav-info1 li a {}
.sidenav .nav-wrap-top .nav-info2 {display:block; overflow:hidden;}
.sidenav .nav-wrap-top .nav-info2 li {float:left; width:33.3333%; border-top:1px solid rgba(255,255,255,0.3); border-right:1px solid rgba(255,255,255,0.3); text-align:center; height:auto; line-height:40px;}
.sidenav .nav-wrap-top .nav-info2 li a {display:block; color:rgba(255,255,255,0.7); line-height:40px; font-size:0.875em;}
.sidenav .nav-wrap-bt {background-color:#f4f4f4; overflow:hidden;}
.sidenav .nav-wrap-bt .left-menu {float:left; display:block; width:35%; padding:35px 0 20px 20px;}
.sidenav .nav-wrap-bt .left-menu li {margin-bottom:25px;}
.sidenav .nav-wrap-bt .left-menu li a {font-size:1.0625em; color:#888;}
.sidenav .nav-wrap-bt .left-menu li.current_scroll a {color:#000; position:relative;}
.sidenav .nav-wrap-bt .left-menu li.current_scroll a:before {content:''; position:absolute; bottom:-2px; left:0; width:100%; height:2px; background-color:#000;}
.sidenav .nav-wrap-bt .right-menu-wrap {width:100%; height:100vh; float:left; display:block; width:65%; overflow-y:scroll; padding:35px 20px 750px; background-color:#fff;}
.sidenav .nav-wrap-bt .right-menu-wrap {
-ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.sidenav .nav-wrap-bt .right-menu-wrap::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

.sidenav .nav-wrap-bt .right-menu li {margin-bottom:40px;}
.sidenav .nav-wrap-bt .right-menu li a {font-size:0.875em; color:#222;}
.sidenav .nav-wrap-bt .right-menu li ul {border-top:1px solid #ddd; margin-top:10px; padding-top:10px;}
.sidenav .nav-wrap-bt .right-menu li ul li {margin-bottom:8px;}
.sidenav .nav-wrap-bt .right-menu li ul li a {color:#888; font-weight:400;}
.sidenav {font-size:0.875em; box-shadow:none; background:#fff;}
.sidenav h1 {padding:20px; text-align:center;}
.sidenav h1 a {display:inline-block;}
.sidenav .sidenav-brand {background:#f7f7f7; font-size:0.875em; font-weight:500; height:48px;}
.sidenav .sidenav-brand ul li {width:33.3333%; background:#f7f7f7; float:left; padding:11px; text-align:center; border-right:1px solid #e3e3e3;}
.sidenav .sidenav-brand ul .closeBtn {padding:0px;}
.sidenav .sidenav-brand ul .closeBtn .material-icons {font-size:20px; padding:13px 0px; background:#f7f7f7;}
.sidenav .sidenav-brand a {color:#888; text-decoration:none;}
.sidenav-menu li:first-child {border-top:1px solid #e3e3e3;}
.sidenav-menu a {color:#222;}
.sidenav-link-title {padding-left:0px;}
.sidenav-dropdown a {padding-left:32px; background:#f6f6f6; color:#888;}
.sidenav-dropdown-icon.show {color:#0092E5;}
.sidenav-footer li {width:50%; float:left; text-align:center; border-right:1px solid #e3e3e3; border-bottom:1px solid #e3e3e3; padding-top:1px;}
.sidenav-footer li a {font-size:0.75em; color:#999;}

/* main page */
.container-header-wrap {padding:0 80px;}
.header {position:fixed; top:0; width:100%; z-index:100; transition: all 0.1s; border-bottom:1px solid #ddd; background-color:#fff;}
.header.on {}
.header h1 a {display:block;}
.header .gnb {height:80px; display:flex; justify-content: space-between; align-items:center;}
.header .gnb .all-nav {color:#fff; line-height:1;}
.header .gnb .all-nav > span {display:flex; flex-direction: column;}
.header .gnb .all-nav > span > span {width:27px; height:3px; background-color:#000;}
.header .gnb .all-nav > span > span:not(:last-child) {margin-bottom:6px;}

.main-top {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.main-top h6 {color:#fff; font-size:20px; line-height:1; display:flex;}
.main-top h6 span:nth-child(1) {margin-right:10px; background-color:red; font-size:13px; padding:4px 6px 6px; line-height:1; border-radius:4px; font-weight:700; letter-spacing:1px;}
.main-top h6 span:nth-child(2) {margin-right:10px; font-weight:700; color:#333;}

.main-top-live {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.main-top-live h6 {color:#fff; font-size:20px; line-height:1; display:flex; align-items:anchor-center;}
.main-top-live h6 span:nth-child(1) {margin-right:10px; background-color:#888; font-size:13px; line-height:1; border-radius:4px; font-weight:700; letter-spacing:1px;}
.main-top-live h6 span:nth-child(2) {margin-right:10px; font-weight:700; color:#333;}
.main-top-live h6 em {font-weight:900; color:#333;}

.pc.main-top-live h6 span:nth-child(1) {padding:4px 5px 5px 6px;}
.pc.main-top-live h6 em {width:125px;}
.worship-bottom-banner .main-top-live h6 em {width:100px;}
.worship-bottom-banner .main-top-live h6 span:nth-child(1) {padding:4px 5px 5px 6px;}

.live, .nolive {display: none;}
.live.on {display: block;}
.nolive.on {display: block;}
#live-content {display:none;}

.repre-word {overflow:hidden; margin-top:100px; margin-bottom:100px;}
.repre-word h3 {font-size:3em; font-weight:800; margin-bottom:20px; line-height:1.5; word-break:keep-all;}
.repre-word span {font-size:1.125em; color:#999; display:block; word-break:keep-all;}
.repre-word .left-col {display:flex; align-items:center;}

.section-gray-wrap {background-color:#f8f8f8; padding-top:100px; padding-bottom:100px;}
.section1 h4 {font-size:2.125em; margin-bottom:40px; font-weight:700;}
.section1 h4 a {color: #000;}

.section2 {margin-top:100px;}
.section2 h4 {font-size:2.125em; margin-bottom:40px; font-weight:700; position:relative;}
.section2 h4 .all {font-size:0.45em; position:absolute; right:0; bottom:0; font-weight:400;}
.section2 h4 a {color:#000;}

.section3 {margin-top:100px; margin-bottom:100px;}
.section3 h4 {font-size:2.125em; margin-bottom:40px; font-weight:700;}
.section3 h4 a {color:#000;}

.section4 h4 {font-size:2.125em; margin-bottom:40px; font-weight:700;}
.section4 .sec-4-img {position:relative; display:block;}
.section4 .row span {position:absolute; top:0; left:0; padding:25px 20px; color:#fff; width:100%; height:100%; display:flex; flex-direction:column; justify-content:end;}
.section4 .row span em {font-size:1.125em; line-height:1; margin-bottom:12px;}
.section4 .row span strong {font-size:1.75em; line-height:1;}

.section5 {margin-top:100px;}
.section5 h4 {font-size:2.125em; font-weight:700; margin-bottom:40px;}
.section5 h4 span {margin-left:15px; color:rgba(0,0,0,0.2);}
.section5 .slide-wrap {margin-bottom:100px;}

.page-title-bar {border-bottom:1px solid #ececec; margin-top:100px; margin-bottom:50px;}
.page-title-bar .lineBottom {padding-top:20px; padding-bottom:20px; border-bottom:4px solid #000;} 
.page-title-bar h3 {font-size:2.5em; font-weight:700;}
.page-title-bar h3 span {display:block; line-height:1;}
.breadBox {margin-top:25px; color:#777; overflow:hidden;}
.locaIcon {font-size:13px; font-family:ssg; margin-top:2px;}
.locationBox {display:flex; align-items:center;}
.locationBox li {font-size:0.875em;}
.locationBox>li+li:before {font-family:ssg; content:"▻"; font-size:11px; padding:0 5px;}

.footer {margin-top:200px; border-top:1px solid #ddd;}
.footer .ft-top {padding-top:60px; padding-bottom:100px;}
.footer .ft-top dd {word-break:keep-all;}
.footer .ft-top .copyright {margin-top:30px; color:rgba(0, 0, 0, 0.3)}

.footer .ft-logo a {display: inline-block;}
.footer .ft-sns {float:right;}
.footer .ft-sns h6 {margin-bottom:20px;}
.footer .ft-sns li {display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    outline: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    text-align: center;
    flex: 0 0 auto;
    padding: 8px;
    border-radius: 50%;
    overflow: visible;
    color: rgba(0, 0, 0, 0.54);
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    width: 38px;
    height: 38px;
    background-color: rgb(245, 245, 245);
    border: 1px solid rgba(0, 0, 0, 0.04); margin-right:10px;
}

.footer .ft-sns li a {line-height:0;}






@media screen and (max-width:1320px) {
    .container-header-wrap {padding:0 15px; max-width:1200px; margin:0 auto;}
}

@media screen and (max-width:991px) {
.page-title-bar h3 {font-size:1.75em;}

.repre-word {margin-top:50px; margin-bottom:50px;}
.repre-word .left-col {margin-bottom:50px;}
.repre-word h3 {font-size:1.75em;}

.main-top h6 {align-items:center;}
.main-top h6 span:nth-child(1) {padding:4px 6px 5px;}

.section-gray-wrap {padding-top:50px; padding-bottom:50px;}
.section1 h4 {font-size:1.75em;}
.section2 {margin-top:50px;}
.section2 h4 {font-size:1.75em;}
.section3 {margin-top:50px; margin-bottom:50px;}
.section3 h4 {font-size:1.75em;}
.section4 h4 {font-size:1.75em;}
.section4 .row span {padding:25px 20px;}
.section4 .row span em {font-size:1em;}
.section4 .row span strong {font-size:1.5em;}
.section5 {margin-top:50px;}
.section5 h4 {font-size:1.75em;}
.section5 h4 span {margin-left:10px;}
.section5 .slide-wrap {margin-bottom:50px;}

.footer {margin-top:150px;}
.footer .ft-sns {float:inherit;}
.footer .ft-top {padding-top:50px; padding-bottom:50px;}
.footer .col-footinfo {margin-top:30px;}
}

@media screen and (max-width: 767px) {

.header .gnb h1 a svg {width:190px;}

.repre-word span {font-size:1em;}

.section3 {margin-bottom:0px;}
.section4 .col-newmember {margin-bottom:20px;}

.footer {margin-top:100px;}
.footer .col-footinfo span {display:block;}
.footer .col-footinfo em {display:none;}
.footer .ft-top .copyright {margin-top:20px; font-size:0.813em;}
.footer .ft-sns h6 {font-size:0.813em; color:rgba(0, 0, 0, 0.3)}
.footer .hidden-admin {font-size:0.813em;}
.footer .ft-logo a img {width:85px;}
.footer .ft-sns h6 {margin-bottom:15px;}
}

@media screen and (max-width: 575px) {

.row {margin-left:-5px; margin-right:-5px;}
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12 {padding-left:5px; padding-right:5px;}
.row-custom {margin-left:-5px; margin-right:-5px; margin-bottom:10px;}	
.row-custom .col-custom {padding-left:5px; padding-right:5px;}

.section4 .col-newmember {margin-bottom:10px;}

}

@media screen and (max-width: 460px) {

}