@import url('http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css');

@font-face {
 font-family: 'NanumBarunpen';
 src: url(webfont/NanumBarunpen/NanumBarunpenR.eot);
 src: url(webfont/NanumBarunpen/NanumBarunpenR.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumBarunpen/NanumBarunpenR.woff) format('woff'),
      url(webfont/NanumBarunpen/NanumBarunpenR.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumBarunGothic';
 src: url(webfont/NanumBarunGothic/NanumBarunGothicWeb.eot);
 src: url(webfont/NanumBarunGothic/NanumBarunGothicWeb.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumBarunGothic/NanumBarunGothicWeb.woff) format('woff'),
      url(webfont/NanumBarunGothic/NanumBarunGothicWeb.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumBareunGothicUltraLight';
 src: url(webfont/NanumBarunGothicL/NanumBarunGothicWebUltraLight.eot);
 src: url(webfont/NanumBarunGothicL/NanumBarunGothicWebUltraLight.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumBarunGothicL/NanumBarunGothicWebUltraLight.woff) format('woff'),
      url(webfont/NanumBarunGothicL/NanumBarunGothicWebUltraLight.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumGothicEco';
 src: url(webfont/NanumEco/NanumGothicEco/NanumGothicEco.eot);
 src: url(webfont/NanumEco/NanumGothicEco/NanumGothicEco.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumEco/NanumGothicEco/NanumGothicEco.woff) format('woff'),
      url(webfont/NanumEco/NanumGothicEco/NanumGothicEco.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumBrush';
 src: url(webfont/NanumBrush/NanumBrush.eot);
 src: url(webfont/NanumBrush/NanumBrush.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumBrush/NanumBrush.woff) format('woff'),
      url(webfont/NanumBrush/NanumBrush.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumPen';
 src: url(webfont/NanumBrush/NanumPen.eot);
 src: url(webfont/NanumBrush/NanumPen.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumBrush/NanumPen.woff) format('woff'),
      url(webfont/NanumBrush/NanumPen.ttf) format('truetype');
}

@font-face {
 font-family: 'NanumSquare';
 src: url(webfont/NanumSquare/NanumSquareR.eot);
 src: url(webfont/NanumSquare/NanumSquareR.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumSquare/NanumSquareR.woff) format('woff'),
      url(webfont/NanumSquare/NanumSquareR.ttf) format('truetype');
}


body * {
    font-family:'NanumBarunGothic';
}

#header { background:#303030; color:#fff; }
#header .header-box { padding:10px 20px; float:left; font-size:14px; }
#header .header-box.active { background:#686463; }
#loginbox { float:right;  }
#loginbox .widget-login { padding-top:10px; }
#loginbox .widget-login a { color:#b6b6b6; font-size:14px; }
#loginbox .widget-login span{color:#b6b6b6;}

#gnb-wrap { position:relative; }
#gnb-wrap img { float:left; margin-top:28px; }
#gnb { float: left; padding:40px 0px; margin-left:40px; }
#gnb > li  { float:left; padding:0px 29px; position:relative; }
#gnb > li > a { font-size:25px; color:#333; text-decoration:none; transition:all ease 0.2s; font-family:NanumBarunGothic;}
#gnb > li > a:hover {  color:#09A2C2; border-bottom:2px solid #09A2C2; padding-bottom:3px; transition:all ease 0.2s; }
#gnb > li > a.active { color:#09A2C2; border-bottom:2px solid #09A2C2; padding-bottom:3px; transition:all ease 0.2s; }
#gnb > li > ul { display:none; }
.point { position:absolute; bottom:-33px; left:50%; margin-left:-9px; display:none; }


#subtop img { width:100%; }
#subgnb {     border-bottom: 1px solid #ddd; padding: 12px 0px; background: #303030; }
#subgnb img{position:relative; top: -2px;}
#subgnb span,
#subgnb a { font-size:18px; /*color:#777;*/ position:relative; top:0px; color:#fff; text-decoration:none; }
#subgnb span.active { color:#000; }
#content { padding-top:30px; min-height:600px; padding-bottom:50px;}
#content .third-menus { margin:10px 0 42px 0;text-align:center; }
#content .third-menus ul{ display:inline-block; }
#content .third-menus ul li { border: 1px solid #dedede; float:left; margin-left:-1px;}
#content .third-menus ul li a { color: #333;text-decoration: none;padding: 8px 17px;font-size: 12px;min-width: 160px;display: inline-block;text-align: center; }
#content .third-menus ul li.active a { color:#fff; }
#sub_title { font-size:40px; font-weight:600; margin-bottom:30px; }
#sitemap-wrap { border-top:1px solid #ddd; padding-top:0px;  background:#6b6b6b; margin-top:30px; } 
#sitemap-wrap  img { float:left; }
#sitemap { float:left; margin-top:50px; padding-bottom:30px; margin-bottom:30px; }
#sitemap a { text-decoration:none; }
#sitemap > li { float:left; padding:0px 17px; }
#sitemap > li > a { color:#b6b6b6; font-size:18px; /*font-weight:600;*/ }
#sitemap > li > ul { margin-top:10px;}
#sitemap > li > ul > li { padding:2px 0px;}
#sitemap > li > ul > li > a { color:#b6b6b6; font-size:15px;  }
#sitemap > li > ul > li > a:hover { color:#e6e5e5; transition:all ease 0.3s; }
#sitemap > li > ul > li > ul > li { padding-left:10px; }
#sitemap > li > ul > li > ul > li > a { color:#aaa; font-size:13px; }

#footer { background:#6b6b6b; padding:0px 0px; position:relative; margin-top:-10px; }
#footer .container { border-top:1px solid #7a7a7a;  padding-top:30px; padding-bottom:30px;  }
#footer p { color:#b6b6b6; margin-bottom:0px; display: inline-block; position:relative; top:10px; padding-left: 24px; font-size:15px;}
#footer p .cont2, #footer p .cont3, #footer p .cont4{padding-left: 15px;}
#footer p .cont5{padding-left:15px;}
#footer p .cont5,#footer p .cont6{padding-right: 5px;}

.gnb2 { height:0px; background:#09A4C3; width:100%; position:absolute; top:88px; left:0px; z-index:9999; }

.subtext-wrap { float:left;  padding-top:50px;   display:none; width:220px; }
.subtext { display:inline-block; }
.subtext p { color:#fff; text-align:left;}
.subtext p:first-child { font-size:14px; margin-bottom:0px; display:none; }
.subtext p:nth-child(2) { font-size:36px; font-family:NanumBarunGothic; }
.subtext img { display:block; position:relative; float:none !important; margin:0 auto; }

.subul { float: left; margin-top:50px; width:74%; margin-left:75px; }
.subul > li { float:left; width:170px; margin-right:40px; margin-bottom:35px; }
.subul > li:last-child { margin-right:0px; }
.subul > li > a { font-size:18px; font-weight:600; }
.subul > li > a > i { float:right; position:relative; top:3px; }
.subul > li > ul { margin-top:5px; }
.subul > li > ul > li { font-size:13px; transition:all ease 0.3s;height: 29px;margin-top:1px; }
.subul > li > ul > li:hover { background:#188397; }
.subul > li > ul > li > a { padding: 5px 7px;border-bottom: 1px solid #9ED9E7;display: inline-block;overflow: hidden; width: 100%;text-overflow: ellipsis; white-space: nowrap; }
.subul > li > ul > li > a > i { margin-right:5px; position:relative; }

.subul li a {
    color: #fff;
    text-decoration:none;
}

.widget-inner { position:absolute; }
.widget-inner .timetable { color:white; font-size:14px; margin:5px; }



.w1 { top:20px; left:40px; }
.w1 .viewbtn { border: 1px solid #a0a0a0; background:#222222; text-align: center; width: 89px; font-size: 15px; padding: 2px 0px; color: white; }
.w2 { top:15px; left:35px; height:80%; width:77%; }
.w2 hr { border-top:1px solid #fff; margin:0px; width:35px; }


.w1 .wtitle { color:#fff; font-size:26px; margin-bottom:6px;}
.w1 .border { border: 1px solid #e8e6e6; width: 34px; position:relative; top:-5px;}
.weng { color:#fff; font-size:15px; margin-top:5px; margin-bottom:20px; }

.w1 button { border:1px solid #fff; background:none; padding:2px 22px; font-size:16px; color:#fff; transition:all ease 0.3s; }
#widget-sermon button:hover { background:#efefef; color:#333; border-color:#fff; }

.w2 .wtitle { color:#fff; font-size:18px; margin-bottom:5px; }
.w2 .wcontent { color:#fff;  font-size:22px; margin-top:20px; margin-bottom:15px; }
.w2 button { border:1px solid #fff; background:none; padding:2px 22px; font-size:16px; color:#fff; transition:all ease 0.3s; }
.w2 button:hover,.w1 button:hover { background:#efefef; color:#333; border-color:#fff; }
.wpager { top:10px; right:25px; position:absolute; }
.wpager i { color: #fff; font-weight: 300; border: 1px solid #fff; padding: 1px 5px; cursor:pointer; }

.w2 table { border:0px; margin:10px 0px 8px; }
.w2 table th { color:#41B8D0; padding-right:5px; padding-bottom:5px; font-size:14px;}
.w2 table td { color:#fff; padding-left:5px;  padding-bottom:5px; font-size:14px;}


.ms2-box-cotnent { text-align:center; padding:15px 0px; }
.ms2bc-title { font-size:40px; font-weight:600;}
.ms2bc-desc { color:#7A7A7A; font-size:14px; font-weight:600; }

.i0 { text-align:center; cursor:pointer; }
.i0 img { float:none !important; margin-top:0px !important; }
.i0 p:nth-child(2) { color:#fff; font-size:22px; font-weight:600; margin-top:10px; margin-bottom:10px; }
.i0 p:nth-child(3) { color:#fff; font-size:14px; color:#fff; margin-bottom:15px; }

.header-mobile-gnb { float:right; font-size:28px; padding-top:10px; }
.mm-panel { background:#008DAB !important; }
.mm-title, .mm-listview>li>a, .mm-listview>li>span { color:#fff !important; }
.mm-menu .mm-listview>li .mm-next:after { border-color:#fff !important; }

.ms2-box { transition:all ease 0.3s; }
.ms2-box.active { border:10px solid #09A4C3 !important; transition:all ease 0.3s; }
.ms2-box.active  .circle span { background:#09A4C3 !important; }
.ms2-shadow { background:rgba(0,0,0,0.45); width:100%; height:100%; display:none; }
.ms2-table { border:0px;  width:100%; display:none; table-layout:fixed; position: absolute; top: 50%; }
.ms2-table td { text-align:center; padding:6px 0px; width:50%; } 
.ms2-table td a { padding:5px; transition:all ease 0.3s; }
.ms2-table td:hover a { background:rgba(54,191,218,0.4);  transition:all ease 0.3s; }
.ms2-table td a { text-decoration:none; color:#fff; font-size:18px; font-family:NanumBarunGothic;  }

.swiper-container { max-height:900px; }

.lnb { padding-right:40px;}
.lnb_title { font-size:30px; border-bottom:1px solid #000; padding-bottom:10px; font-weight:600; font-family:NanumBarunGothic; margin-bottom:0px; }
.sub_depth2 { margin-top:0px; padding-top:0px; }
.sub_depth2 > li { padding: 15px; border-bottom:1px solid #ddd; transition:all ease 0.3s; }
.sub_depth2 > li.active,
.sub_depth2 > li:hover { background:#f0f0f0; }
.sub_depth2 > li > a { color:#777; font-weight:600;  font-size:16px; text-decoration:none; }
.sub_depth2 > li > i { position:relative; margin-right:10px; cursor:pointer; }
.sub_depth2 > li > i.fa-minus { display:none; }
.sub_depth2 > li:last-child { border-color:#000; }
.sub_depth3 { padding-left:20px; margin-top:10px; display:none; }
.sub_depth3.active { display:block; }
.sub_depth3 li { padding:3px 0px; }
.sub_depth3 li a  { color:#999; font-size:15px;  text-decoration:none;  transition:all ease 0.3s; }
.sub_depth3 li a:hover  { color:#739AB9; }
.sub_depth3.a_96 li a:hover { color:#4E5397; }
.sub_depth3.a_98 li a:hover { color:#E4C640; }

.board-theme .theme-list table td { white-space: nowrap; }
.board-theme .theme-list table td:first-child, .board-theme .theme-list table td:last-child { white-space: nowrap; }
.vr_nav_xs {
     position:absolute; left:0px; top:0px; width:100%;  z-index:1;
     border:2px solid #000; border-top:1px solid #aaa; border-bottom-left-radius:15px; border-bottom-right-radius:15px; 
     background:rgba(255,255,255,0.6);

}
.vr_nav_xs table { width:100%; border:0px; table-layout:fixed; }
.vr_nav_xs table td { text-align:center; font-size:14px; padding:8px 0px; line-height:100% }
.vr_nav_xs table td a { color:#000; font-weight:600; text-decoration:none; }

#onlineadmin { float:right; margin-top:10px; margin-right:10px;  }
#onlineadmin a { color:#fff; font-weight:600; font-size:14px; text-decoration:none; }
#component2030 img { height:117px; }



.r1 > div:nth-child(2) .w1{
    /*background: #009FA5;*/
    display: block;
    padding: 0px 30px;
    padding-top: 20px;
    height: 158.28px;
    width: 90%;
    top: -1px;
    left: 15px;
    overflow:hidden;
}

.r1 > div:nth-child(2) .w1 span{
    float:right;
}

.r1 > div:nth-child(2) .w1 span img{
    cursor:pointer;
}

.r1 > div:nth-child(2) .w1 .weng{
    text-align: center;
}

.r1 > div:nth-child(2) .w1 .weng_box{
    text-align: center;
    padding-top: 0px;
    width: 220%;
    font-size: 0;
}

.r1 > div:nth-child(2) .w1 .weng_box > .weng{
    width: 50%;
    display: inline-block;
}

#sitemap > li { float:left; padding:0px 40px; }

.gnb-line {
    background: #303030;
}

    .gnb-line li {
        list-style-type: none;
        display: inline-block;
        padding: 10px 19px;
        font-size: 18px;
    }

        .gnb-line li a {
            color: white;
        }

    .gnb-line .gnb-line-wrapper {
        margin: 0 auto;
        width: 1100px;
    }

        .gnb-line .gnb-line-wrapper .gnb-line-cont li > a {
            text-decoration: none;
        }

        .gnb-line .gnb-line-wrapper .gnb-line-cont li ul li {display:none;}



@media(max-width:1200px){
    #widget-sermon { top:100px; right:25px; }
    #gnb > li{padding:0px 7px;}
    #gnb > li > a { font-size:20px;}
}



@media(max-width:992px){

    

    .r1 > div:nth-child(2) .w1{
        width:85%;
        padding: 20px 25px;

    }

    #footer p{
        padding:0px;
    }

    #footer .container img{
        width:30%;
    }

    #gnb > li > a{font-size:18px;}
}



@media(max-width:768px)
{
    #subtop img { display:none; }
    
    .board-theme .theme-list table td:first-child { display:table-cell !important; }
    .board-theme .theme-list.calendar .datepicker .datepicker--content .datepicker--cell.datepicker--cell-day .schedule { white-space:nowrap; }

    #logo{height:35px;}
    #footer p{padding:0px; text-align:center;}
    #footer p .cont2{padding-left: 0px;}
    #footer .container{text-align:center;}
    #footer .container img{top: 50%; position: relative; margin-top: -60.2px; width:inherit;}

    .r1 > div:nth-child(2) .w1 span img{width:50%;}
    .r1 > div:nth-child(2) .w1{width:91.1%;}

    .w1 .wtitle{font-size:21px;}

}

@media(max-width:680px){
    #footer .container img {margin-top:0 !important;}
}

@media(max-width:560px){
    #footer .container img{
        /*margin:-30.2px;*/
    }

    .r1 > div:nth-child(2) .w1{width:95%;}
}

@media(max-width:370px){
   #footer .container img{
       position:inherit;
       margin:0;
       top:0;
       width:inherit;
   } 

   .r1 > div:nth-child(2) .w1{width:81.2%;}
}