﻿#sermon { padding:200px 0 0; background:#fff; }
#sermon h2 { font-size:18px; font-weight:normal; color:#333; margin:25px 0 140px; }
.sermon-1 { background:url(../Images/sermon_bg.png) no-repeat; background-size:cover; height:371px; width:687px; float:left; display:inline-block; position:relative;}
.sermon-2 { background-color:#114672; height:365px; display:inline-block; float:left; width:513px; position:relative; top:45px; padding:55px 40px; }
.sermon-2 h3 { margin:0; color:#fff; font-size:24px; display:inline-block; }
.sermon-2 .sermon-plus { float:right; font-size:32px; color:#fff; font-weight:bold; clear:both; position:relative; top:-10px; }
.sermon-2 ul { clear:both; margin-top:60px;}
.sermon-2 ul li { overflow:hidden; padding:10px 0; }
.sermon-2 ul li span { float:right; font-size:17px; color:#fff; }
.sermon-2 ul li p { font-size:17px; color:#fff; text-overflow: ellipsis; margin:0; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; width:200px; float:left; }
#sermon hr { position:absolute; bottom:80%; border-bottom:3px solid #fff; left: 55%; top: 90px; z-index:100; width:50px;}
.sermon-date {  display:inline-block; font-size:17px; margin:0; }
.sermon-title { clear:both; font-size:25px; font-weight:bold; margin:30px 0; }
.sermon-cont { font-size:19px; line-height:30px; }
.sermon_new { position:absolute; width:100%;  bottom:-68px ;  left:0;  }
.sermon_new > a > div { float:left; width:50%;  text-align:center;  font-size:20px; color:#fff;  padding:20px 0;  border-top:1px solid #fff ;}
.sermon_new > a > div.new_left { background:#2F6066;  border-right:1px solid #fff; }
.sermon_new > a > div.new_left:hover { background:#2B5D90; transition:0.2s all; }
.sermon_new > a > div.new_right { background:#2B5D90;  }
.sermon_new > a > div.new_right:hover { background:#2F6066; transition:0.2s all; }


#main1 { padding:200px 0; background:#E9EEF4; }
#main1 > div > div > div { padding:0 50px;}
#main1 h2 { font-size:18px; font-weight:normal; color:#333; margin:25px 0 140px; }
#main1 .main1-box { background:#fff; padding:50px; position:relative; }
#main1 .main1-box .plus { position:absolute; top:45px; right:50px; }
#main1 .main1-box h3 { margin:0; font-weight:bold; font-size:19px; border-bottom:2px solid #000; padding-bottom:15px;}
#main1 .main1-box ul { margin-top:40px;}
#main1 .main1-box a li { overflow:hidden; padding:0 0 20px; }
#main1 .main1-box a:last-child li { padding:0; }
#main1 .main1-box a:hover { color:#114672; transition:0.2s all; }
#main1 .main1-box a li p { font-size:17px; float:left; margin:0; color:#333; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display:block; width:180px; }
#main1 .main1-box a li:hover p { color:#114672; transition:0.2s all; font-weight:bold; } 
#main1 .main1-box a li:hover span { color:#114672; transition:0.2s all; font-weight:bold; } 
#main1 .main1-box a li span { float:right; font-size:17px; color:#333;}

#main2 { background-image:url(../Images/news_bg.png); background-repeat:no-repeat; background-size:100% 100%; height:575px; padding:50px 0; }
#main2 h2 {font-size: 46px;font-weight: normal;color: #000;margin: 25px 0 25px;}
#main2 > div > div > a > div { padding:0 8px; }
#main2 > div > div > a > div img:hover { opacity:0.7; transition:0.2s all; }
#main2 > .container > .main2-1 > div{text-align:center;}
#main2 .main2-1 .jubo a, #main2 .main2-1 .sungdo a,
#main2 .main2-1 .church-news a, #main2 .main2-1 .church-day a{width: 240px;height: 240px;position: relative;display: inline-block;}
#main2 a img {width: 100%;height: 100%; border-radius: 50%; }
#main2 a { color:#fff; }
#main2 a:hover img { font-weight:bold; transition:0.1s all; box-shadow: 7px 5px 10px -5px grey;}
#main2 a p {margin: 3px 0;font-size: 30px;color: #000;letter-spacing: 2px;}
#main2 > div > div > a > div img { height:189px; }

#main3 { padding:45px 0 80px; background:#fff; }
#main3 .row2 { margin-bottom: 60px; }
#main3 .main3-box { padding:0 90px;}
#main3 h2 { font-size:27px; margin:10px 0 15px; font-weight:bold; }
#main3 h2 span { font-size:20px; }
#main3 .main3-box2 { padding-top:75px;  }
#main3 ul { border-top:1px solid #333; margin-top:15px; margin-bottom:15px;  }
#main3 ul li:first-child { margin:15px 0 0; }
#main3 ul li { overflow:hidden; padding:5px 0;  }
#main3 ul li p { float:left; font-size:17px; margin:0; color:#666666; }
#main3 ul li span { float:right; display:inline-block; font-size:17px;  color:#666666;}
/*동일교회 작업 시작본*/
#slide{position: relative; top: 0px;}
#sermon .main1-1 .sermon-desc{height:500px;background-image:url(../Images/sermon_bg.png);background-repeat:no-repeat;background-position:center;
                              background-size: 100% 100%;width: 100%;position:relative;}
#sermon .main1-1 .sermon-desc .sermon_btn{position: absolute;bottom: 5px;width: 100%;}
#sermon .main1-1 .sermon-desc .sermon_btn ul{border:none;margin: 0 5px; text-align:center;width:99%;}
#sermon .main1-1 .sermon-desc .sermon_btn ul li .btn-box{border: none;border-radius: 0px;padding:0px;text-decoration: none;}
#sermon .main1-1 .sermon-desc .sermon_btn ul li .btn-box div{position: relative;}
#sermon .main1-1 .sermon-desc .sermon_btn ul li .btn-box div p{position: absolute;
width: 100%;bottom: 40px;font-size: 20px;margin: 0;text-align: center;color: #fff;letter-spacing: 1px;}
#sermon .main1-1 .sermon-desc .sermon_btn ul li .btn-box img{width:100%;}
.nav>li>a:focus, .nav>li>a:hover{background-color:transparent!important;}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{background-color:transparent!important;}
.sermon_main .sermon_title{position: relative;width: 100%;text-align: center;text-decoration: none;color:#000;}
.sermon_main .sermon_title p:nth-child(1){width: 100%;top: 85px;position: relative;font-size: 35px;}
.sermon_main .sermon_title p:nth-child(2){position: relative;top: 75px;font-size: 24px;}
.sermon_main .sermon_title h5:nth-child(3){position: relative;top: 95px;font-weight: bold;font-size: 43px;}
.sermon_main .sermon_title div{position:relative; top:110px; font-size:24px;}
.sermon_main .sermon_title div span:nth-child(1){margin-right: 5px;}
.sermon_main .sermon_title div span:nth-child(3){margin-left: 5px;}

#sermon .main1-2 .main1-2-bar{height: 500px;background-image: url(../Images/welcome_bg.png);background-repeat: no-repeat;
background-position: center;background-size: 100% 100%;width: 500px;position: relative;margin: 0 auto;}
#sermon .main1-2 .main1-2-bar .main-bar-full-1{height: 50%; width: 100%;}
#sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1{height: 100%; width: 50%;float:right;position:relative;}
#sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2{height: 100%; width: 50%;float:left;position:relative;}
#sermon .main1-2 .main1-2-bar .main-bar-full-2{height: 50%; width: 100%;}
#sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3{height: 100%; width: 50%;float:right;position:relative;}
#sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4{height: 100%; width: 50%;float:left;position:relative;}
#sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 img{position:absolute;
top:50%; left:50%;transform: translate(-50%, -50%);}
#sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 img{position:absolute;
top:50%; left:50%;transform: translate(-50%, -50%);}
#sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 img{position:absolute;
top:50%; left:50%;transform: translate(-50%, -50%);}
#sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 img{position:absolute;
top:50%; left:50%;transform: translate(-50%, -50%);}
#sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 p{    position: absolute;
top: 45%;left: 50%;transform: translate(-50%, -50%);margin: 0;font-size: 27px; color:#000;
width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
#sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 p{    position: absolute;
top: 45%;left: 50%;transform: translate(-50%, -50%);margin: 0;font-size: 27px; color:#000;
width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
#sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 p span{font-size: 23px;}
#sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 p{    position: absolute;
top: 55%;left: 50%;transform: translate(-50%, -50%);margin: 0;font-size: 27px; color:#000;
width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
#sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 p{    position: absolute;
top: 55%;left: 50%;transform: translate(-50%, -50%);margin: 0;font-size: 27px; color:#000;
width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
.jubo .circle{text-align: center; position: relative;}
.jubo .circle p{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);
                margin: 0;font-size: 30px;width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
.sungdo .circle{text-align: center; position: relative;}
.sungdo .circle p{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);
                margin: 0;font-size: 30px;width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
.church-news .circle{text-align: center; position: relative;}
.church-news .circle p{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);
                margin: 0;font-size: 30px;width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
.church-day .circle{text-align: center; position: relative;}
.church-day .circle p{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);
                margin: 0;font-size: 30px;width: 100%;text-align: center;font-weight: bold;letter-spacing: 1px;}
#main2 p{font-size: 24px;}
#main2 .container .row .text-center{margin-bottom:80px;}
/*갤러리 부분 진행*/
#main3 > .container > .row > div{padding:0px;}
.document-widget.gallery .document{float:left;}
.document-widget.gallery .document:nth-child(1),.document-widget.gallery .document:nth-child(2),.document-widget.gallery .document:nth-child(3),
.document-widget.gallery .document:nth-child(4){margin-bottom:15px;margin-right:15px;margin-left:15px;}
.document-widget.gallery .document:nth-child(1){margin-left:0px;}
.document-widget.gallery .document:nth-child(4){margin-right:0px;}
.document-widget.gallery .document:nth-child(5),.document-widget.gallery .document:nth-child(6),.document-widget.gallery .document:nth-child(7),
.document-widget.gallery .document:nth-child(8){margin-top:15px;margin-right:15px;margin-left:15px;}
.document-widget.gallery .document:nth-child(5){margin-left:0px;}
.document-widget.gallery .document:nth-child(8){margin-right:0px;}
.document-widget.gallery .document a{position:relative;}
.document-widget.gallery .document a div{opacity:0; background-color:rgba( 0, 0, 0, 0.7 );}
.document-widget.gallery .document a:hover div{width: 100%;height: 100%; display:block;
                                         position: absolute;text-align: center;top: 0px; opacity:1;}
.document-widget.gallery .document a div span:nth-child(1){display: block;position: absolute;
top: 50%;width: 100%;text-align: center;font-size: 20px;color: #fff; transform:translate(0, -50%);}
.document-widget.gallery .document a div span:nth-child(2){display: block;position: absolute;
top: 110px;width: 100%;font-size: 20px;text-align: center;color: #fff;}
.document-memu-title{text-align: center;margin: 65px 0;position: relative;display: inline-block;width: 100%;}
.document-memu-title a{font-size: 26px;padding: 20px 65px;border: 1px solid #E6E6E6;text-decoration: none;color: #000;}
.document-widget.gallery .document img{width:322px;height:200px;}
@media (min-width:1200px) and (max-width:1499px) {
    #main3{padding: 40px 0 40px;}
    .sermon-1 { width:657px; }
    .document-widget.gallery .document{height: auto;width: 270px;display: inline-block;}
    #sermon{padding-top:160px;padding-bottom:60px;}
    #sermon .main1-2 .main1-2-bar{width:100%;height:457.5px;}
    #sermon .main1-1 .sermon-desc{height:457.5px;}
    .document-widget.gallery .document a div span:nth-child(1){top: 50%; transform:translate(0, -50%);}
    .document-widget.gallery .document a div span:nth-child(2){top: 95px;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 p, #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 p{top: 45%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 p, #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 p{top: 55%;}
}

@media (min-width:992px) and (max-width:1199px) {
    #main3{padding: 40px 0 0px;}
    .document-widget.gallery .document{height: auto;width: 220px;display: inline-block;}
    #sermon .main1-2 .main1-2-bar{width:100%;height:374px;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 img{width: 90%;}
    #sermon .main1-1 .sermon-desc{width: 100%; height: 374px;}
    .sermon_main .sermon_title{bottom: 40px;}
    #main2 .main2-1 .jubo a, #main2 .main2-1 .sungdo a, #main2 .main2-1 .church-news a, #main2 .main2-1 .church-day a{width:100%;height:100%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 p, #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 p{top: 45%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 p, #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 p{top: 55%;}
    .document-widget.gallery .document a div span:nth-child(1){top:50%; transform:translate(0, -50%);}
    .document-widget.gallery .document a div span:nth-child(2){top:75px;}
}

@media (min-width:768px) and (max-width:991px) {
    #sermon{padding: 145px 0 0;}
    .document-memu-title{    margin: 40px 0;}
    #sermon hr { position:absolute; bottom:80%; border-bottom:3px solid #fff; left: 55%; top: 90px; z-index:100; width:50px; display:none; } 
    #main3 .main3-box { padding:0; }
    #main3 h2 { font-size:20px;}
    #main3 h2 span { font-size:18px; }
    #main3 ul li p { font-size:16px; }
    #main3 ul li span { font-size:16px; }
    #main3 .row2 { margin-bottom:20px;}
    #main2 { height:auto; }
    #main2 > div > div > a > div { margin-bottom:15px; }
    #main2 { padding:40px 0; }
    #main1 .main1-box { padding: 30px 15px;}
    #main1 > div > div > div { padding:0 15px; }
    #main1 .main1-box .plus { position: absolute; top: 30px; right: 20px; }
    .sermon-1 { width:100%; }
    .sermon-2 { width:100%; top:0; }
    .main1-1{margin-bottom: 40px;}
    #sermon .main1-2 .main1-2-bar{width:100%; height: 720px;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 img{width: 90%;}
    .main2-1 .jubo, .main2-1 .sungdo{margin-bottom:25px;}
    .document-widget.gallery .document{width: 230px;}
    #main3{padding:0px; padding-top: 55px;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 p, #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 p,
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 p, #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 p{font-size: 45px;}
    #sermon .main1-1 .sermon-desc .sermon_btn ul li .btn-box div p{bottom: 28px;font-size: 24px;}
    .document-widget.gallery .document a div span:nth-child(1){top: 50%; transform:translate(0, -50%);}
    .document-widget.gallery .document a div span:nth-child(2){top: 60px;}
    .document-widget.gallery .document:nth-child(3){margin-right: 0px;}
    .document-widget.gallery .document:nth-child(4){margin-left: 0px;margin-right:15px;}
    .document-widget.gallery .document:nth-child(5){margin-left: 0px;margin-top: 15px;
    margin-right: 15px;margin-left: 15px;}
    .document-widget.gallery .document:nth-child(6){margin-right:0px;}
    .document-widget.gallery .document:nth-child(5),.document-widget.gallery .document:nth-child(4)
    ,.document-widget.gallery .document:nth-child(6){margin-top:0px;margin-bottom:0px}
    .document-widget.gallery .document:nth-child(7){margin-left:0px;}
    .document-widget.gallery .document:nth-child(8), .document-widget.gallery .document:nth-child(7){display:none;}
}



@media (max-width: 767px) {
    #sermon{padding: 15px 0 0;}
    #main3{padding:0px; padding-top: 20px;}
    #sermon .main1-1 .sermon-desc{height: 780px;}
    #sermon .main1-1 .sermon-desc .sermon_btn{bottom: 0px;}
    #sermon .main1-1 .sermon-desc .sermon_btn ul{width:100%;}
    #sermon .main1-1 .sermon-desc .sermon_btn ul{margin:0px;}
    #sermon .main1-1 .sermon-desc .sermon_btn ul li{width:100%; margin:5px 0;}
    #sermon .main1-1 .sermon-desc .sermon_btn ul li .btn-box img{width:95%;}
    .sermon_main .sermon_title div span{display:block; margin:0px!important;}
    .sermon_main .sermon_title div span:nth-child(3){display:inline-block; margin-top:5px;}
    .sermon_new { bottom:-54px; }
    .sermon_new > a > div { font-size:17px; padding:15px 0; }
		    .sermon-1 { width:100%; height:260px; }
	    .sermon-mobile {     background: url(../Images/bg.png) no-repeat; position:relative; }
	    .mob-img { z-index:0; position: absolute;     max-width: 260px; display:block!important;
    bottom: 0;
    left: 0;}
	
	
	#main2 > div > div > a > div img { height:auto; }
	.navbar-nav { width:100%; top:0; }
	.navbar-default .navbar-nav>li>a { font-size:16px; }
	#main1 .main1-box a li p { font-size:15px; }
	#main1 .main1-box a li span { font-size:15px; }
		#main1 .main1-box a li { padding: 0 0 10px; }
		#main1 .main1-box ul { margin-top:20px; }
    .sermon-2 { height:auto;   }
    .sermon-2 ul { margin-top:30px; }
    .sermon-2 ul li p { font-size:15px; }
    .sermon-2 ul li span { font-size:15px; }
    .sermon-2 h3 { font-size:20px; }
    #sermon .sermon-desc h4 { font-size:18px; }
    .sermon-cont { font-size:16px; line-height:25px;}
    #sermon .sermon-desc { top:15%; text-align:right; }
    .sermon-title { font-size:20px; margin:20px 0; }
    #main1 h2 { margin:25px 0 50px; }
    #main2 h2 { margin:25px 0 50px; }
    #main1 { padding:50px 0; }
    #main1 .main1-box { margin-bottom:15px; }
    #sermon hr { position:absolute; bottom:80%; border-bottom:3px solid #fff; left: 55%; top: 90px; z-index:100; width:50px; display:none; } 
    .text-center { padding:0 15px; }
    #sermon h2 { font-size:17px; margin:25px 0 80px; }
    .text-center > img { max-width:150px;  }
    #main2 > div > div > a > div { padding:0 15px; }
    #main3 .main3-box { margin:30px 0; }
        #main3 .main3-box { padding:0; }
    #main3 h2 { font-size:20px;}
    #main3 h2 span { font-size:18px; }
    #main3 ul li p { font-size:16px; }
    #main3 ul li span { font-size:16px; }
    #main3 .row2 { margin-bottom:20px;}
    #main2 { height:auto; }
    #main2 > div > div > a > div { margin-bottom:15px; }
    #main2 { padding:80px 0; }
    #main1 .main1-box { padding: 30px 15px;}
    #main1 > div > div > div { padding:0 15px; }
    #main1 .main1-box .plus { position: absolute; top: 30px; right: 20px; }
    .sermon-2 { width:100%; top:0; }
    .sermon_main .sermon_title{bottom: 45px;}
    #sermon .main1-2 .main1-2-bar{width:100%;height:374px;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-2 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-1 .main-bar-1 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-3 img{width: 90%;}
    #sermon .main1-2 .main1-2-bar .main-bar-full-2 .main-bar-4 img{width: 90%;}
    #main2 .main2-1 .jubo a, #main2 .main2-1 .sungdo a, #main2 .main2-1 .church-news a, #main2 .main2-1 .church-day a{margin-bottom: 50px;}
    .document-widget.gallery .document:nth-child(4), .document-widget.gallery .document:nth-child(5), .document-widget.gallery .document:nth-child(6),
    .document-widget.gallery .document:nth-child(7), .document-widget.gallery .document:nth-child(8){display:none;}
    .document-widget.gallery .document,.document-widget.gallery .document:nth-child(1){margin:15px; width:93%;}
    #slide{top:0px;}
    .main1-1{margin-bottom:25px;}


}


@media (max-width: 376px) {
	#sermon .main1-1 .sermon-desc{height: 735px;}
}