.main__box__wrap { padding:30px 20px; position:relative; height:350px; }
.main__box__wrap ul { margin-top:50px; }
.main__box__wrap ul li { transition: all ease-in 0.5s; position: relative; margin-bottom:20px; padding-bottom:2px; border-bottom:1px solid #333; overflow:hidden; }
.main__box__wrap ul li:hover {border-bottom:1px solid transparent; transition: all ease-out 0.1s;}
.main__box__wrap ul li a { transition: all 0.2s; font-size:16px; color:#fff; text-decoration:none; }
.main__box__wrap ul li:hover { color: #fff;  }
.main__box__wrap ul li:before {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  display: block;
  width: 100%;
  height: 3px;
  background: #fff;
  transform: scale(0);
  transition: all 0.5s;
}

.main__box__wrap ul li:hover:before {
  background: #fff;
  transform: scale(1);
}
.main__box__wrap ul li a strong {  float:left; font-weight:normal; display:inline-block; text-overflow: ellipsis; overflow: hidden; 
                                    white-space: nowrap;word-wrap: normal !important; width:100%; }
.main__plus { position:absolute; top:0; right:0; }


/* common */

.nav-tabs {border-bottom:none;}
.plus { position:absolute; top:0; right:0;}
.plus:hover { opacity:0.8; transition:0.3s all ease;}
#main__section1 .col-xs-12 { padding:0 10px; }
#main__section2 .col-xs-12 { padding:0 10px; }
#main__section2 { margin:20px 0; }
#main__slogan { padding:30px; 0; }
#main__slogan h1 { margin:0; font-size:33px; font-weight:normal; }

/* main1 s */
.slider .move-btn{background:rgba(0,0,0,0)!important;}
.slider .slider-dots .each-dot.active{background:white!important;border-color:white!important;width:30px;border-radius:15px; transition:all 0.3s;}
.slider .slider-dots .each-dot{background:rgba(255,255,255,0.5)!important;}
#main-1 { margin:50px 0 0;}

.wrap__title { margin:0; font-size:2.4rem; color:#fff;}
#sermon__wrap { background:url(../Images/sermon_bg.png) no-repeat; height:350px; position:relative; padding:30px; width:100%; background-size:100% 100%; }
.sermon__desc { margin-top:80px;height:100%; width:100%; }
.sermon__desc #sermon__title { font-size:30px; color:#fff; text-decoration:none; display:block; margin:20px 0; }
.sermon__desc h5 { font-size:20px; color:#fff; margin:0;position:absolute; top:35px; left:150px }
.sermon__desc ul { display: inline-block; }
.sermon__desc ul li { font-size:20px; color:#fff; padding:3px 0; }
.sermon__desc img { position:absolute; top:40px; right:70px;  }


#sermon__title {
    font-size: 40px;
    color: #fff;
    text-decoration: none;
    display: block;margin: 200px 0;}
#box__1 #jubo__img { position:absolute; bottom:15px; right:15px; }
#box__1 #jubo__title { font-size:25px; text-decoration:none; display:inline-block; color:#fff; margin-top:70px; }
#box__1 #jubo__title h3 {font-size: 25px; word-break: keep-all;}
#box__1 #jubo__title h4 {font-size: 20px; word-break: keep-all;}
#box__3 #jubo__title { font-size:25px; text-decoration:none; display:inline-block; color:#fff; margin-top:70px; }
#box__3 #jubo__title h3 {font-size: 25px;}
#box__3 #jubo__title h4 {font-size: 20px; word-break: keep-all;}
#box__2 #jubo__title { font-size:25px; text-decoration:none; display:inline-block; color:#fff; margin-top:70px; }
#box__2 #jubo__title h3 {font-size: 25px; word-break: keep-all;}
#box__2 #jubo__title h4 {font-size: 20px; word-break: keep-all;}
#box__1 #jubo__title span { font-size:22px; }
#box__1 { background:#0E3B5C; }

#box__2 { background:#255d4c; }
#box__2 .tab-dots {text-align:center; width: 100%; position: absolute;  left: 0;  bottom: 15px; margin:0; margin:0; border-bottom:none; }
#box__2 .tab-dots > li { margin:0 3px 0; float:none; display:inline-block; border-bottom:none; vertical-align: bottom;}
#box__2 .tab-dots > li.active  > a { background:#fff; border:1px solid #fff; opacity:1;}
#box__2 .tab-dots > li > a {display: inline-block;width: 12px;height: 12px;background: #fff;cursor: pointer;border-radius: 50%; padding: 0; opacity:.5;}
#box__2 .box__2_title{letter-spacing:-3px;}
#box__2_ul {margin-top:0!important;}
.tab-content {margin-top:30px;}
.tab-content a{font-size:15px; list-style:none; display:inline-block; color:#fff; width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tab-content hr{margin-top:10px; margin-bottom:10px; }
#next__section { margin-top:40px; }
#next__section img { margin-bottom:15px; }
#next__section h3 { font-size:18px; font-weight:bold; margin:5px 0 0; color:#fff; }
#next__section h5 { margin:10px 0 0; font-size:16px; color:#fff; line-height:25px;  }

#box__1 { background-color: #3C5B9B}
#jubo__title{ color:white; font-size:x-large; }

#main__gallery { overflow:hidden; border:1px solid #ddd; position:relative; padding:30px 30px; height:350px; }
#main__gallery > h5 { color:#333; font-size:30px; font-weight:600; margin:0; padding-left:50px; letter-spacing:-1px;}
#main__gallery > h5 span { color:#1E9B7B;}
#main__gallery ul { text-align:center; margin-top:50px; }
#main__gallery li { display:inline-block; margin:0 5px; }
#main__gallery li a { font-size:16px; color:#333; text-decoration:none; }
#main__gallery li p { margin:10px 0 0; }
#main__gallery .pictures .gallery { width: 200%; }
#main__gallery .right { position: absolute; right: 30px; top: 50%; margin-top:-16px; cursor: pointer; }
#main__gallery .left { position: absolute; left: 30px; top: 50%; margin-top:-16px; cursor: pointer; }
#main__gallery .pictures { width: 455px; overflow: hidden; position: absolute; top: 50%;     margin-top: -52px; left: 11%; }
#main__gallery .latest-wrapper { position: relative; }
#main__gallery .pictures img {height:115px;}
.document-widget.gallery .document {padding:4px 14px;}
.document-widget.gallery .document p.date { font-size:14px; margin: 10px 0 0;}
#main__gallery .document-widget.gallery .document a.title { font-size:14px; padding: 4px 0; text-decoration:none; }
#main__gallery .document-widget.gallery .document a.title:hover { text-decoration:none; }

#box__3 { background:url(../Images/ban_1.png) no-repeat;  background-size: cover;} 
#new__people__section { margin-top:20px; color:#fff; }
#new__people__section img { margin-bottom:15px;}
#new__people__section h3 { font-size:24px; font-weight:normal; margin:0; word-break: keep-all;}
#new__people__section p { margin:0; font-size:15px; transform: skew(-0.05deg);}

#box__4 { background:url(../Images/ban_4.png) no-repeat; color:#fff; background-size:cover;} 
.wrap__title2 { margin:0; font-size:2.4rem; color:#fff;}
#box__4_li { color:#fff;}
#box__4_li:before {color:inherit; }

#box__4 #jubo__img { position:absolute; bottom:15px; right:15px; }
#box__4 #jubo__title { font-size:25px; text-decoration:none; display:inline-block; color:#fff; margin-top:70px; }
#box__4 #jubo__title h4 { font-size:25px; word-break: keep-all;}

#main__quick { margin:40px 0; }
#main__quick .row { margin:0 -5px; }
#main__quick ul { overflow:hidden; border:1px solid #ddd; padding:40px 0; }
#main__quick li img { margin-bottom:15px; }
#main__quick li a { text-decoration:none; color:#333;}
#main__quick li { float:left; width:20%; text-align:center; font-size:17px; border-right:1px solid #ddd; font-weight:bold; }
#main__quick ul > li:last-child { border-right:none; }

#main__quick2 { margin-bottom:40px; }
#main__quick2 .row { margin:0 -5px; }
#main__quick2 ul { overflow:hidden; }
#main__quick2 li a { font-weight:normal; color:#333; text-align:center; display:inline-block; padding:15px 0; width:100%;  text-decoration:none;  line-height:45px; vertical-align:middle;}
#main__quick2 li { float:left; width:33.333%; text-align:center; font-size:17px; border-right:1px solid #ddd; font-weight:bold; border-top:1px solid #ddd; border-bottom:1px solid #ddd; }
#main__quick2 li:hover{opacity:.7; color:#fff; transition:all ease-in-out .2s;}
#main__quick2 li:hover a{opacity:.7; transition:all ease-in-out .2s;}
#main__quick2 ul > li:first-child { border-left:1px solid #ddd; }

.pictures .document-widget.gallery .document{
	width:16.2%;
}


@media (max-width:1499px) {
    .main-right-2 .tab-content li { width:200px;}
    .main-2-right2 .tab-content li { width:200px;}
    #main-3 .main3-icon li { padding:0px 33px;}
    #main-3 .main-3-right { padding:15px 20px;}
    #main-3 .main-3-right img { margin-right:15px;}
    #main__slogan h1 { margin:0; font-size:25px; font-weight:normal; }
}

@media (max-width:1199px) {
	
	#main__gallery .pictures .gallery {width: 260%;}
	#main__gallery .left {left: 10px;}
	#main__gallery .right {right: 10px;}
	
	
    #main__slogan h1 { margin:0; font-size:20px; font-weight:normal; }
    /*#sermon__wrap .sermon__desc h5 {
        width: 220px;
    }*/
    .latest-third .latest-wrapper ul > li > a > span.community_title {
        display: inline-block;
        width: 170px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    #main__gallery .pictures {
        width: 100%;
    }
    #main-2 .main2-left-top p { font-size:18px; }
    #main-2 .main2-left-top small { font-size:15px; }
    .main2-right-1 .main2-school p { font-size:12px; }
    #main-slogan h3 { line-height:30px;}
    #main-3 .main3-icon li { padding:0px 20px;}
    #main-3 .main-3-right p { display:none;}
    #main-3 .main-3-right { text-align:center;}
    #main-3 .main-3-right img { float:none; margin:0px;}
    .main-right-2 .tab-content li { width:150px;}
    .main-2-right2 .tab-content li { width:150px;}
    .main-2-right1 a { font-size:18px;}
    #main-2 .main2-gallery .pictures .gallery {width:300%;}
    /*다음세대*/
    .next-generation-wrapper .next-generation {text-align:center;}
    .next-generation-wrapper .next-generation .documents a {padding:0px;}
    .next-generation-wrapper .next-generation .documents .generation_img {margin-bottom:20px; height:100px;}
    .next-generation-wrapper .tab-dots > li {margin-left:0px!important;margin-right:0px!important;}
     #main-quick p { font-size:15px;}
    #main-quick img { margin-right:5px; }

}

@media (max-width:991px) {

    #main__section1 .col-xs-12, #main__section2 .col-xs-12 {
        padding: 10px;
    }


    #main__slogan h1 { margin:0; font-size:18px; font-weight:normal; }
	#main-2 .main2-gallery .right,#main-2 .main2-gallery .left {top:40%;}
    #main-2 .main2-gallery {margin:0 0 50px; }
    #main-slogan h3 { line-height:30px;}
    #sermon { margin:0px 0px 15px;}
    .main-right-1 { margin:0px 0px 15px;}
    .main-2-left { text-align:center; margin:15px 0px;}
    #main-2 .main-2-left-top img { float:none;}
    #main-2 { margin:0px 0px 30px;}
    #main-3 .main3-icon li { padding:0px 21px;}
    #main-3 .main-3-right { margin:30px 0px 0px; text-align:center;}
    #main-3 .main-3-right img { float:none; margin-right:30px; }
    #main-2 .main2-left-top { text-align:center; }
    #main-2 .main2-gallery .pictures { top:40%; left:10%;}
    #main-3 .main3-icon li { padding:0; width:20%; margin:15px 0;}
    #main-2 .main2-gallery .pictures {left:20%;}
    #main__quick .row { margin:0; }
    
    /*다음세대 귀찮음*/
    .next-generation-wrapper .next-generation .documents a {padding-left:40px!important;padding-right:40px!important;}
}

@media (max-width:768px) {
        .document-widget.gallery .document a.no-image {padding: 30px 0 !important;}
    /* 220324 */
	#main__gallery .pictures .gallery {width: 200%;}
    .sermon__desc img {top: unset; bottom: 30px; right: 30px;}
    .wrap__title, .wrap__title2, #box__4 #jubo__title {font-size: 2rem;}
    .sermon__desc h5, #box__4 #jubo__title span {font-size: 16px;}
    .sermon__desc #sermon__title {font-size: 2rem; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
     .main__box__wrap {margin-top: 0;}

    /*.main__box__wrap {margin-top:10px;}*/
	#main__slogan h1 { margin:0; font-size:2rem; font-weight:normal;   
                       word-break: keep-all; line-height: 1.4; }
	#main-slider .slider .slider-dots .each-dot{height:8px;}
	#main-slider .slider .slider-dots .each-dot.active{ width:20px;}
	#main-slider .slider-dots{ bottom:2px;}
	#sermon .sermon-play-img { width:30px; position: absolute; right: 0vw; top: 5vw;}
	
	.bottom-latest .latest-wrapper { padding:15px; height:100%; }
	#wedPray #prayIcon { position:absolute; bottom:10px; right:10px; }
	.latest-wrapper ul > li > a > span.choir_date { margin-bottom:30px;}
	
	.latest-third .latest-wrapper ul > li > a > span.community_title{width:50%;}
	.latest-third .latest-wrapper ul > li > a > span.community_date { float:right; width:35%;}
	.latest-third { height:245px;}
	
	.generation { text-align:center; }
	
		.background-color2 .latest-wrapper ul > li{text-align:center;}
		.main-1-right .latest-wrapper .tab-content2{width:90%; top:60%;}
		.main-1-right .latest-wrapper .tab-content {top:35%;}
		.latest-wrapper a.latest-title{font-size:22px; top:60%;}
	  #main-2 .main2-gallery .pictures .gallery{ width:100%; height:335px; margin:0 auto;}
    #main-2 .main2-gallery {padding:20px; height:395px; text-align:center;}
	  .next-generation-wrapper{margin:20px 0;}
    #sermon .sermon__desc { position:static; width:100%;}
   
    #main-quick img {
        width: 25px!important;
    }
    #main-quick > div > div > a> div { padding:15px 0; border-bottom: 1px solid #fff;}
	#main-quick img { display:none; margin:0 auto 10px; }
    #main-quick p { font-size:14px;}
    #main-1 { margin:25px 0;}
    #sermon {padding:15px; height:250px;}
    div.latest-third.background-color.bottom-latest { height:280px }
    #main-2 .main2-left-top p { font-size:17px; margin:0;}
    #main-2 .main2-gallery .left { display:none; }
    #main-2 .main2-gallery .right { display:none; }
    #main-2 .main2-left-top small { font-size:14px; }
    .main2-right-2, .main2-right-1 { margin:15px 0 0;}
    #main-2 .main2-left-top { text-align:center; }
    #main-2 .main2-left-top img { float:none!important; margin:0 0 15px!important;}
    #main-2 .main2-gallery .pictures { width:270px; margin:0 auto; position:static;}
    #main-3 .main3-icon li { padding:0 10px;}
    #main-slogan h1 { font-size:25px; }
    #main-slogan h1 span { font-size:13px; margin-right:15px; top:-3px;}
    #main-slogan h3 { font-size:16px; line-height:20px;}
    #main-3 .main-3-right { margin:15px 0px 0px; text-align:center;}
    #main-3 .main-3-right img { float:none; }
    #main-3 .main3-icon li { border-left:none; margin:20px 0px; width:32%;}
    #main-3, #main-2 {margin:15px 0px;}
    .main-2-right2 { margin:15px 0px 0px;}
    .main-2-right2 .tab-content ul { margin:25px 0px;}
    #main-3 .main3-icon li p { font-size:15px;}
    .main-2-right2 h3, .main-2-right1 h3, #sermon h3, #sermon h5, .main-right-1 h3, .main-right-2 h3 { font-size:25px; line-height: 35px; margin:0; margin-right:15px; float:unset;}
    #sermon h5{width:100%!important; margin-bottom:5px;}
    .main-2-left {text-align:center;}
    #main-2 .main-2-left-top img { float:none; margin:0px 0px 15px;}
    #main-2 .main-2-left-top p { font-size:22px;}
    #main-2 .main-2-left-top span { font-size:18px; margin:0px 5px;}
    #sermon h4, #sermon h6 { font-size:18px;}
    #sermon h4{margin:10px 0px 30px; float:unset; }
    #sermon h6{margin: 10px 0px 0px;}
    #sermon, .main-right-1 { margin:0px 0px 15px;}
    
    /*다음세대*/
    .next-generation-wrapper .next-generationr .documents a {position: absolute;text-align: center;width: 100%;top: 20%;left: 0;font-size: 19px;color: #fff;}
    .next-generation-wrapper .next-generation .nav-tabs {position:absolute;bottom:20px;left:50%; transform:translateX(-50%);}
    .next-generation-wrapper .next-generation .documents .generation_img {width:unset!important;}
    /*퀵메뉴*/
      #main__quick ul {display: flex;  justify-content: space-between;}
    #main__quick li { /*width:32.333%;*/width: auto; border-right:none; margin:7px 0; font-size:1.2rem; float:unset; display:inline-block; }
	#main__quick .row { margin:0; }
	#main__quick li img { margin-bottom:10px; max-width:50px; }
	#main__quick ul { padding:15px 10px; text-align:center;}
	#main__quick { margin:15px 0; }
    #main__quick2 li { width:100%;border-left: 1px solid #ddd;}
    #main__quick2 .row { margin:0; }

    /*#main__gallery ul > li:nth-child(2), #main__gallery ul > li:nth-child(3) { display:none; }*/
	#main__gallery > h5 { font-size:21px; padding-left: 0;}
	#main__gallery { padding:30px 15px; /*height:310px;*/ height: auto;}
    #main__gallery .right { right:0; }
    #main__gallery .left {left:0; }
    .document-widget.gallery .document {padding: 0 6px;}
    #main__gallery .pictures {width:100%; overflow: hidden; position: static; margin: 0 auto;  height: auto; /*height:230px;*/}
    #main__gallery .pictures img {/*height:165px;*/ height: auto;}
    #main__gallery .pictures .gallery {margin-top:30px; display: flex;}
}

@media  (max-width:480px) {
    #main-2 .main2-gallery .pictures { width:150px; height:340px; top: 35%; left: 25%; }
 
}