﻿.slider .slider-wrapper .slide img { width:100%; }

#main-bg {
	 background:url(../Images/bg.jpg) ;
	 background-size: 100% 100%;			
	 padding-top:70px;
	 margin-top:-70px;
	}

#main-1 { margin:65px 0 20px; }
    #main-1 .sermon {
        /*background: url(../Images/banner_011.png) no-repeat;*/
        background-position: center;
        background-size: 100% 100%;
		
        display: inline-block;
        float: left;

        position: relative;

    }
    #main-1 a:hover {
        opacity: 0.7;
        transition: 0.2s all;
    }
    #main-1 .sermon .sermon-cont {
        position: relative;
        white-space: normal;
        color: #222222;
        font-size:26px;
    }
    #main-1 .sermon .sermon-cont img {
    
    }
#main-1 .sermon .sermon-cont a { text-decoration:none; }	
#main-1 .sermon .sermon-cont h2 { font-size: 21px; color:#000; margin:28px 0; width:220px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; word-wrap: normal !important; display: block; white-space:nowrap;}  
#main-1 .sermon .sermon-cont p {/*font-size:15px;*/}
#main-1 .sermon .sermon-title-top {
  /*  position:absolute;

    top:109px;
    right:158px;*/
	font-size: 25px;
    font-weight: 600;
    color: #535353;

	text-align: center;
	width: 100%;
	padding:  0 0 20px 0;
}
#main-1 .actbox { text-align: center; padding: 0; }
#main-1 .actbox img { transition: .3s; }
#main-1 .actbox:hover img { transform: scale(1.1); }
#main-1 .act { font-size: 20px; text-align: center; color: #000; }
#main-1 .act_f{width: 120px; height: 120px; -webkit-border-radius: ;-moz-border-radius: 100px; border-radius:100px ; text-align: center; background-color: #a0856d; display: inline-block; text-align: center;}
#main-1 .sermon .sermon-title-bottom {color:#A9A9A9; font-size:17px; font-weight:550;}
    
#main-1 .welcome { display:inline-block; float:left; position:relative;}
#main-1 .welcome .welcome-cont {
    /*position:relative;
    top:50%;
    left:50%;
    transform: translate( -50%, -50% );
    text-align: center;*/
    top:110px;
    left:226px;
    position:absolute;
    width:50%;
    text-align:center;
}

/*#main-1 .welcome .welcome-cont .title-text {
    color: #fff;
    font-size: 24px;
}
#main-1 .welcome .welcome-cont .title-text::after {
    content: "";
    display: block;
    width: 40px;
    height: 2px;
    background: rgba(255,255,255,0.5);
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -20px;
}*/

.ban{position: relative;}
.ban1{height: 300px;  padding: 0px;  color: #fff;transition: 0.4s all ease; transition:.3s;}
.ban > a > .ban1:hover { transform: scale(1.05); opacity: 0.9; }
.ban1 > a > .ban2:hover { transform: scale(1.05); opacity: 0.9; }

.ban2 {
    height: 150px;
    padding: 0;
    color: #fff;
    transition: 0.4s all ease;
}
.ban1 a, .ban2 a {text-decoration:none;}
.ban2 p, .ban1 p{padding: 10px 10px;}
.ban {
    text-align: center;
    font-size: 25px;
    font-weight: 600;
    color: #535353;
}
.ban2:hover {
    opacity: 0.7;
}
.col-xs-6.ban1:hover {
    opacity: 0.7;
}



.title-text {
    color: #fff;
    font-size: 24px;
    text-align: center;
    padding: 20px;
}
.title-text::after {
    content: "";
    display: block;
    width: 40px;
    height: 4px;
    background: rgba(255,255,255,0.5);
    position: absolute;
  top: 60px;
    left: 50%;
    margin-left: -20px;
	text-align: center;
}

.ban2 p{text-align: left;}
.ban2 p, .ban1 p { font-size: 15px; }
.title-text2 { font-size: 26px !important; }
#main-1 .sermon-go > img { float: right; }
.mquick{text-align: center; color: #000; padding-left: 0 ;padding-right: 0;}
.mquick a{text-decoration: none; font-size: 14px; color: #000; letter-spacing: -1;}
#main-2 { padding-bottom: 20px; }
#main-2 .story-title-top { font-size: 25px; font-weight: 600; color: #535353; text-align: center; /*width: 100%;*/ padding: 0 0 20px 0; position: relative; }
#main-2 .story-title-top p { width: fit-content; margin: auto; z-index: 1; display: block; position: relative; background: #fff; padding: 0 3%; }
#main-2 .story-title-top hr { position: absolute; width: 100%; top: 0; left: 0; border-top: solid 1px #EAEAEA; }
#main-2 .sasilmo_story { display: flex; flex-wrap: nowrap; justify-content: space-between; /*background: #EAEAEA;*/ padding: 0; }
#main-2 .sasilmo_story .contentSlide.swiper-slide { width: 24%; padding: 1%; /*background: #EAEAEA;*/ margin: 0 0.5%; background: rgba(238, 238, 238, 0.7); transition: .3s; }
#main-2 .sasilmo_story .contentSlide.swiper-slide:hover { transform: scale(1.1); opacity: 0.9; }
#main-2 .sasilmo_story .contentSlide.swiper-slide:first-of-type { margin-left: 0; }
#main-2 .sasilmo_story .contentSlide.swiper-slide:last-of-type { margin-right: 0; }
#main-2 .sasilmo_story a { display: block; /*width:23%;*/ text-decoration: none; }
#main-2 .sasilmo_story .gallery-box { height: 0; width: 100%; padding-top: calc(300 / 300* 100%); background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important; }
#main-2 .sasilmo_story .story-title { font-size: 14px; font-weight: 700; width: 85%; margin: auto; display: block; overflow: hidden; text-align: center; color: #333; margin-top: 12px; height: 24px; text-overflow: ellipsis; white-space: nowrap; }
#main-2 .sasilmo_story .story-date { font-size: 13px; font-weight: 700; width: 85%; margin: auto; display: block; overflow: hidden; text-align: center; color: #909090; margin-top: 1px; height: 24px; text-overflow: ellipsis; white-space: nowrap; }

#main-3 .left { width:53%; display:inline-block; float:left; }
#main-3 .left li { display:inline-block; padding-right:8px; margin-bottom:8px; width: 143px;}
#main-3 .left img { width:135px; height:135px; }
#main-3 .left img:hover { opacity:0.7; transition:0.3s all; }
#main-3 .right { width:45.8%; display:inline-block; float:left; background:#F2F2F2; padding:20px 30px; }
#main-3 .right h2 { color:#545454; margin:0 0 23px; font-size:19px; font-weight:bold; display:inline-block;}
#main-3 .right .plus { float:right; margin:0; font-size:30px; font-weight:bold; color:#545454; text-decoration:none; position:relative; top:-10px;} 
#main-3 .right li { font-size:16px; overflow:hidden; color:#8B8B8B; padding:8px 15px; margin:0; border-top:1px solid #8B8B8B; }
#main-3 .right li:hover { background:#a5e0f9; transition:0.2s all; color:#fff; }
#main-3 .right li p { margin:0; float:left; }
#main-3 .right li span { float:right; }
#main-3 .container .row {margin-top:7px; margin-bottom:20px;}
#album-title {font-size:32px; font-weight:600px;}
#main-3 .photo gallery {display:grid;}



#main6 { margin-top: 50px; text-align: center; }
#main6 a { text-decoration: none; color: #fff; }
#main6 p { display: inline-block; font-size: 18px; margin: 0; }
#main6 img { display: inline-block; margin-right: 15px; }
#main6 img:last-of-type { margin-right: 0; padding: 3px; }
#main6 > div > div > a > div { /*  width: 20%;*/ height: 75px; border-right: 1px solid #fff; background-color: #785d45; border-right-width: 1px; display: flex; justify-content: center; align-items: center; font-size: 14px !important; }
#main6 > div > div > a:nth-child(1) > div img { position: relative; }
#main6 > div > div > a:nth-child(2) > div img { position: relative; top: -3px; }
#main6 > div > div > a:nth-child(3) > div img { position: relative; top: -6px; }
#main6 > div > div > a:nth-child(4) > div img { position: relative; top: -1px; }
#main6 > div > div > a > div:hover { opacity: 0.7; transition: 0.4s all ease; }


/* news */
#main-news-box .news-list { line-height: 2.4; font-size: 17px; }
ul.news-list span { float: right; padding-right: 10px; }
ul.news-list li { border-bottom: 1px solid #cecece; clear: both; }
#main-news-box a { text-decoration: none; padding-left: 10px; color: black; }
#news-title { font-size: 25px; font-weight: 600; color: #535353; border-bottom: 1px solid #cecece; margin: 0; margin-top: 10px; }
#main-news-box .title, .regdate { color: #525252; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 275px; float: left; }
#main-news-box .regdate { width: 105px; }
#main-news-box > div > div > div > div > table > tbody > tr {border-bottom:1px solid #cecece;}
#main-news-box > div > div > div > div > table > tbody > tr > td { padding:8px; font-size:18px;}
#main-news-box > div > div > div > div > table > tbody > tr > td:nth-child(2n) { text-align:right; }
#news-button { font-size: 40px; float: right; font-weight: 600; height: 20px; color: #969696; margin-top: -22px; margin-right: 5px; }

/* album */
#main-album-box { pointer-events: none; margin-bottom: 40px; margin-right: 20px; }
#main-album-box .document { float: left; max-width: 100%; max-height: 100%; margin-right: 10px; margin-bottom: 10px; }
#main-album-box .document img { max-width: none; width: 145px; height: 145px; }
#main-1 .sermon .sermon-go a { float: right; font-size: 30px; font-weight: bold; color: aliceblue; background-color: #1E90FF; width: 5%; }

/*행사갤러리*/
.main3R { padding-bottom: 20px; }
.main3R .story-title-top { font-size: 25px; font-weight: 600; color: #535353; text-align: center; /*width: 100%;*/ padding: 0 0 20px 0; position: relative; }
.main3R .story-title-top p { width: fit-content; margin: auto; z-index: 1; display: block; position: relative; background: #fff; padding: 0 3%; }
.main3R .story-title-top hr { position: absolute; width: 100%; top: 0; left: 0; border-top: solid 1px #EAEAEA; }
.main3R .sasilmo_story { display: flex; flex-wrap: nowrap; justify-content: space-between; /*background: #EAEAEA;*/ padding: 0; }
.main3R .main3RM { position: relative; padding: 25px 0 25px; overflow: hidden; }
.main3RM .main3S { width: 90%; margin: auto; height: 15vw; }
.main3RM .main3S .contentSlide { height: auto; }
.main3RM .main3S .galleryIMG { display: block; position: relative; height: 100%; overflow: hidden; background-size: auto; margin: 0 auto; background-position: 50% 50%; background-origin: border-box; background-repeat: no-repeat; background-size: contain; }
.main3RM .main3S .contentSlide img { max-width: 100%;  height: 70%; object-fit: cover; transition:.3s }
.main3RM .main3S .contentSlide img:hover { transform: scale(1.05); opacity: 0.9; }
.main3RM .main3S .swiper-wrapper { transition-duration: 1000ms !important; }
.main3R .main3S .contentSlide a { text-decoration: none; color: #000; height: 100%; display: flex; flex-wrap: wrap; justify-content: center; }
.main3R .main3S .contentSlide p { width: 95%; text-align: center; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; /*height: 14%;*/ margin: 0; margin-top: 1%; /*font-size: 1.5rem;*/ font-size: 18px; height:auto;}
.galleryPTN { display: inline-block; background-position: center; background-repeat: no-repeat; float: left; position: absolute; top: 50%; transform: translate(0, -50%); z-index: 999; width: 5%; height: 100%; background-color: #fff; }
.galleryNTN { display: inline-block; background-position: center; background-repeat: no-repeat; float: left; position: absolute; right: 0; top: 50%; transform: translate(0, -50%); width: 12px; height: 17px; z-index: 999; width: 5%; height: 100%; background-color: #fff; }
.document-widget.gallery .document a img { transition: .3s; }
.document-widget.gallery .document a img:hover { transform: scale(1.1); opacity: 0.9; }

/*기관 로고*/
.main4R .main4RM { position: relative; padding: 25px 0 25px; overflow: hidden; }
.main4RM .main4S { width: 90%; margin: auto; }
.main4RM .main4S .contentSlide { height: 60px; }
.main4RM .main4S .galleryIMG { display: block; position: relative; height: 100%; overflow: hidden; background-size: auto; margin: 0 auto; background-position: 50% 50%; background-origin: border-box; background-repeat: no-repeat;background-size:contain; }
.main4RM .main4S .contentSlide { transition: .3s; }
.main4RM .main4S .contentSlide:hover { transform: scale(1.1); opacity: 0.9; }
.main4RM .main4S .contentSlide img { max-width: 100%; /*width: 100%;*/ height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  }
.main4RM .main4S .swiper-wrapper { transition-duration: 1000ms !important; }
.galleryBTNM { /*margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; z-index: 999; height: 110px;*/ }
.galleryBTNM .galleryBTN { /*height: 110px;*/ }
.galleryPTN { display: inline-block; background-position: center; background-repeat: no-repeat; float: left; position: absolute; top: 50%; transform: translate(0, -50%); z-index: 999; width: 5%; height: 100%; background-color: #fff; }
.galleryNTN { display: inline-block; background-position: center; background-repeat: no-repeat; float: left; position: absolute; right: 0; top: 50%; transform: translate(0, -50%); width: 12px; height: 17px; z-index: 999; width: 5%; height: 100%; background-color: #fff; }



@media (min-width:1200px) { #gnb-wrap .container {
        width: 1200px;
    }
	.container {width:1120px;}    
}

@media (min-width:993px) and (max-width:1199px){
	#main-1 .sermon { width:56%; margin-right:15px;}
	/*#main-1 .sermon .sermon-cont {right:-10%; top:12px; width:55%;}*/
	#main-1 .sermon .sermon-go a { width:6%!important; }
	#main-1 .row { position:relative;  }
	#main-1 .row .welcome {position:absolute; width:410px; }
	#main-1 .row .welcome img { height:267px; }



	#main-2 .info {}
	#main-2 .info  img { height: 330px}
  #main-2 .map { margin-left:0px;}
	#main-2 .map img { height:330px;}
	#main-2 .edu {margin-left:12px; margin-right:10px;}
  #main-2 .edu .top { height:150px;}
  #main-2 .edu .bottom {height:175px; margin-top:5px; }
   


	#main-album-box .document img {width:120px; height:120px; }
	#main-album-box .document {margin-right:5px; margin-bottom:5px;}
	#main-album-box {width:500px; margin-right:0;}

	#main-news-box .title { width:235px; }
	#news-title {font-size:20px; margin-top:0;} 
	#main-news-box .news-list {font-size:14px;}
	


    #main-1 .sermon .sermon-title-top {
        right: 100px;
    }

    #main-1 .sermon .welcome-cont {
        left: 207px;
    }

    #main-2 .edu .edu-bottom-cont {
        top: 222px;
        left: 267px;
    }
	    #main6 > div > div > a > div {
		font-size: 14px;}

}

@media (min-width:768px) and (max-width:992px){
#main-1 .act_f{width: 100px; height: 100px; -webkit-border-radius: ;-moz-border-radius: 100px; border-radius:100px ; text-align: center;  display: inline-block; text-align: center;}
    #main-1 .sermon { width:536px; }
  	#main-1 {margin-bottom:0px;}
    #main-1 .welcome { width:40%; margin-bottom:20px;     height: 195px;}
    #main-1 .sermon .sermon-cont h2 { width:190px; }
	#main-1 .act{font-size: 18px !important; text-align: center; color: #000;}
      
    .welcome img { height:195px; }
    .info { width:23%; }
    .info-box img { max-width:35px; }
    
    
    #main-2 .edu { margin-left:0; margin-right:0;}
    #main-2 .map {    width: 22.7%; }
    #main-2 .map img { height:245px;}
    #main-2 .top { margin-bottom:5px; }
    #main-2 .info { }
	  #main-2 .info > img {height:245px;}
    #main-2 .edu .bottom {height:132px; margin-top:0px; width:375px;}
    #main-2 .info-box {bottom:15px;}
		
				
	  #main-1 .sermon { width:58%; margin-bottom:20px; }
	  /*#main-1 .sermon .sermon-cont {right:-2%; top:20px; width:50%;}*/
    #main-1 .sermon .sermon-cont MARQUEE { width:80%; }
	  /*#main-1 .sermon .sermon-cont p {font-size:13px;}*/
	  #main-1 .sermon .sermon-cont h2 { font-size:18px; white-space:pre; margin-top:20px; margin-bottom:10px; }
	  /*#main-1 .sermon .sermon-title-top { margin:0; font-size:22px;}*/
    #main-1 .sermon .sermon-title-bottom {color:#A9A9A9; font-size:12px; font-weight:550;}
    #main-1 .sermon .sermon-go a {font-size:20px;}
   
    #main-news-box > div > div > div > div > table > tbody > tr {border-bottom:1px solid #cecece;}
    #main-news-box > div > div > div > div > table > tbody > tr > td { padding:4px; font-size:14px;}
    #main-news-box > div > div > div > div > table > tbody > tr > td:nth-child(2n) { text-align:right; }
    #main-news-box .title, .regdate{font-size:14px; width:165px;}
    
    
    #main-3 .container .row {margin-top:0px;}
    #main-3 .left { text-align:center; }    
    #main-3 .left li { width:125px; margin-bottom:15px; }
    #main-3 .right { width:47%; padding: 16px 30px;}
    #main-3 .right li { font-size:14px; }
    #main-3 .right h2 { margin-bottom:15px; padding: 7px 5px;}
    #main-3 .right .plus { font-size:24px; }

    .main3R .main3S .contentSlide p { font-size: 12px; }

    #main6 p { font-size: 15px; }


    #main-album-box .document img {
        width: 100px;
        height: 100px;
    }
    #main-album-box .document {margin-right:5px; margin-bottom:5px;}
    #main-album-box { width:420px; margin-right:0;}
    #main-news-box { padding:15px; }
    #main-news-box .news-list {font-size:12px;}
    #news-title {font-size:18px; margin-top:-5px;}
    #main-news-box .news-list li {line-height:2.4;}
    #news-button {font-size:35px;}
    
	





#main-1 .sermon .sermon-title-top {
    font-size:26px;
    top:76px;
    right:61px;
}
#main-1 .welcome .welcome-cont {
    top: 79px;
    left: 150px;
}
#main-2 .edu .edu-top-cont {
    top:22px;
    left:-4px;
    width:55%;
}
#main-2 .edu .edu-bottom-cont {
    top:159px;
    left:199px;
}
#main-2 .map .map-cont {
    width:55%;
    left: 37px;
}



}

@media (max-width:767px) {
	#main-1 .sermon { height: unset; }
    #main-1 { padding:0 15px; margin:20px 0 20px;  }
    #main-1 .welcome { grid-row:2; width:100%; margin-bottom:10px; }
    #main-1 .welcome img { width:100%; max-width:none; height:auto;}
    
    #main-1 .sermon { grid-row: 1; width:100%;  margin-bottom:10px; }
    #main-1 .sermon .sermon-cont h2 {font-size:15px; margin:0; margin-top:10px; margin-bottom:10px; white-space:pre; width:150px;}    
    /*#main-1 .sermon .sermon-cont { padding-top:10px;  }*/
    
    #main-1 .sermon .sermon-title-bottom {font-size:15px; color:#A9A9A9; font-weight:550;}
    #main-1 .sermon .sermon-cont p { letter-spacing: 0.5px; margin-top:0px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
    #main-1 .sermon .sermon-go a {font-size: 1em; width: 1em; }
    #main-1 .sermon .sermon-title {padding-left:5px; }
   
    

   
    
    #main-2 { text-align:center; padding:0 15px; }
    #main-2 .row { }
    #main-2 .info {  }
    #main-2 .info-box {bottom:20px; width:100%;}
    #main-2 .info img { width:100%; height:auto;}
    #main-2 .info-box > ul > li { width: 25%; }    
    #main-2 .map { grid-column:2/3; grid-row:1; float:left; width:100%; margin-left:0; }
    #main-2 .map img {height : auto; width:100%;}
    #main-2 .edu { margin:0;  }
    #main-2 .edu .bottom { height : auto; margin-top:3px; width:100%;}
    #main-2 .edu .top {height: auto; width:100%;}
    #main-2 .sasilmo_story .story-title { font-size: 11px; }
    #main-2 .sasilmo_story .story-date { font-size: 10px; }


    #main-3 .left { width: 100%; padding: 0 15px; }  
    #main-3 .left li { width:49%; padding:0 15px; }
    #main-3 .right { width:100%; }
    #main-news-box {  margin-bottom:20px; }

    #main-3 .photo-gallery { grid-column:1; grid-row:1; margin: 0 auto; text-align:center;}
    .document-widget .gallery .document { padding-right: 0; padding-left: 0; }


    .main3R .main3S .contentSlide p { font-size: 12px; }
    .main3RM .main3S { height:auto;}
    .main3RM .main3S .contentSlide img {width:100%;}

    #main-album-box { width: 100%; height: auto; margin-bottom: 10px; margin-right: 0px; }
    #main-album-box .document { margin-right:2%; margin-bottom:10px; float:unset;}
    #main-album-box .document img { width:145px; height:145px; }
 
    #main-album-box .document:nth-child(2) { margin-right:0px; }
    #main-album-box .document:nth-child(4) { margin-right:0px; }
    #main-album-box .document:nth-child(6) { margin-right:0px; }
    
    
    #main-album-box .document:nth-child(n+7) { display: none; }
    #main-news-box { margin-top:0px; width:100%;  padding:15px;}
	  #footer p { line-height:15px;}
    #news-title { font-size: 20px; }
    #main-news-box .news-list { font-size: 14px; }
    #main-3 .container .row { display:grid; grid-template-rows: 1fr auto; grid-template-columns:1fr; margin:0;}
    .widget-login { padding-top:0; }
    #main-news-box > div > div > div > div > table > tbody > tr > td { padding:8px; font-size:12px; }
    #main-news-box .title, .regdate{width:180px; font-size:12px;}

    
    .ban2 p, .ban1 p { font-size: 13px; padding: 10px ;}
    .title-text2 { font-size: 20px !important; }


    #main-1 .sermon .sermon-title-top { top: 150px; right: 0; left: 58%; }
	#main-1 .act_f{width: 80px; height: 80px;}
	#main-1 .act{font-size: 16px;}

    .title-text {
        font-size:1.5rem;
    }

    #main-1 .welcome .welcome-cont {
        top:42%;
        left:48%;
    }

    #main-2 .map .map-cont {
        top:36px;
        left:10%;
        width:75%;
    }
    #main-2 .info .info-cont {
        top:36px;
    }
    #main-2 .edu .edu-top-cont {

        top:11%;
        left:-6px;
    }
    #main-2 .edu .edu-top-cont .title-text  {	font-size: 20px !important;}
    #main-2 .edu .edu-bottom-cont {
        top:64%;
        left:51%;
    }
    #main-2 .edu .edu-bottom-cont p {
        font-size:1.5rem;
    }
    .row:before {
        display: none;
    }

    
    

}

@media (max-width:425px) {
    #main-1 .act_f { width: 60%; height: auto; }
    #main-1 .act { font-size: 11px; margin-top: 10px !important; }
    #main-1 .sermon .sermon-title-top { top: 93px; left: 45%; }
    #main-1 .sermon .sermon-title-top p { font-size: 28px; }
    #main-2 .edu .edu-bottom-cont { top: 119px; left: 145px; }
    #main-1 .welcome .welcome-cont { top: 79px; left: 47%; }
    .title-text { font-size: 28px; }
    #main-2 .edu .edu-top-cont p { font-size: 17px; }
    #main-2 .edu .edu-bottom-cont { top: 60%; left: 50%; }
    #main-2 .edu .edu-bottom-cont p { font-size: 28px; }

    .row:before { display: none; }
}

