/*************** [sermons]basic ***************/
/*#section_type_sermons_15*/
#section_type_sermons_15 {clear:both; position:relative;}

/*sec2*/
.sec2{/*width:1198px;*/ margin:100px auto; overflow:hidden; border:1px solid #dadada;}
.sec2 .box{float:left; width:25%; height: 576px; }
.sec2 .box.box2{width:50%; border-left:1px solid #dadada; border-right:1px solid #dadada; 
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
}
.sec2 .box > div{position:relative; padding:30px; height:100%;  box-sizing:border-box; overflow:hidden; z-index:1;}
.sec2 .box .inner_box{height:288px;}
.sec2 .box .inner_box + .inner_box{border-top:1px solid #dadada;}

.sec2 .box h2{font-size:24px; letter-spacing:-0.5px; color:#333; margin-bottom:15px; font-weight: 400;}
.sec2 .box p{font-family:"Malgun Gothic"; font-size:15px; letter-spacing:-0.25px; line-height:18px; margin-bottom:25px;}
.sec2 .box a.btn{display:block; width:94px; height:29px; line-height:28px; border-radius:40px; background:#2f2f2f;  color:#fff; text-align:center; font-size:13px; font-family:"Malgun Gothic"; transition:all 0.3s;}
.sec2 .box a.btn:hover{/*background:#3d3e4d;*/ transform:scale(1.03);}

/*Áö±³È¸´ç ¾È³»*/
.sec2 .box .family{ /*background:#759dd0;*/ background:#418888;}
.sec2 .box .family > img{position:absolute; right:20px; bottom:0; z-index:-1; }
.sec2 .box .family > img:hover {right:30px; transition:all 1s;}
.sec2 .box .family h2{color:#fff;}
.sec2 .box .family p{color:#fff;}

/*Network*/
.sec2 .box .calendar_box > img{position:absolute; right:30px; bottom:25px; z-index:-1; animation:cal_ani 1s linear 3 alternate; transition:all 1s;}
.sec2 .box .calendar_box > img:hover {transform:rotate(30deg);}
.sec2 .box .calendar_box p{color:#777;}
.sec2 .box .calendar_box ul {margin-top:60px;}
.sec2 .box .calendar_box ul li {margin-bottom:20px; }
.sec2 .box .calendar_box ul li a {display:block; text-align:center;}

@keyframes cal_ani{
	0% { transform:rotate(0deg); }
	50% { transform:rotate(30deg); }
	100% { transform:rotate(0deg); }
}

/*±ÝÁÖÀÇ ¸»¾¸*/
.sec2 .box .words h2 span{/*color:#e7922e;*/ color:#990000;}
.sec2 .box .words .words_video{position:relative; margin-top:20px; background:#000;}
.sec2 .box .words .words_video a > img{width:100%; height:360px !important;} 

.sec2 .box .words .words_video .worship_img {width: 100%;}
.sec2 .box .words .words_video .worship_img iframe {position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;}

.sec2 .box .words .words_video a p{position:absolute; top:50%; margin-top:-35px; width:100%; text-align:center;}
.sec2 .box .words .words_txt{margin-top:20px;}
.sec2 .box .words .words_txt p{font-family: 'NanumBarunGothic'; font-weight:200; font-size:18px; letter-spacing:-0.5px; color:#666; line-height:normal; margin:0; text-align:left;}
.sec2 .box .words .words_txt p + p{margin:8px 0 0 15px;}
.sec2 .box .words .words_txt p span{font-size:24px; margin-left: 15px; color:#222; display: block; width: 90%; text-overflow: ellipsis;  -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.sec2 .box .words .words_txt a{margin:10px 0 0 15px;}
.sec2 .box .words > img{position:absolute; bottom:0; right:0; z-index:-1;}

/*±³È¸¼Ò½Ä*/
.sec2 .box .notice{background:#f7f7f7;}
.sec2 .box .notice a.more{position:absolute; top:35px; right:35px;}
.sec2 .box .notice ul{margin-top:25px;}
.sec2 .box .notice li{position:relative; font-family:"Malgun Gothic"; font-size:15px; color:#787878; padding-left:12px; margin-bottom:11px;}
.sec2 .box .notice li:before{content:"-"; position:absolute; left:0;}
.sec2 .box .notice li a{display: block; width: 100%; text-overflow: ellipsis;  -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.sec2 .box .notice li a:hover{text-decoration:underline; color:#222;}

/*¾ð¾àÀÇ ¸»¾¸*/
.sec2 .box .school{background:url("/section/sermon/sermon_15/img/box5_bg.jpg") no-repeat; transition:all 1s;}
.sec2 .box .school h2{color:#fff;}
.sec2 .box .school p{color:#fff; opacity:0.8;}
.sec2 .box .school li{position:relative;  padding-left:12px; margin-bottom:10px;}
.sec2 .box .school li:before{content:"-"; position:absolute; left:0; opacity:0.8; color:#fff;}
.sec2 .box .school li a{font-family:"Malgun Gothic"; font-size:15px; color:#fff; opacity:0.8;}
.sec2 .box .school li a:hover{opacity:1;}

/*************** [mainboard]responsive ***************/
/*sec2*/
@media screen and (max-width: 1024px) {
	.sec2{width:93%; margin:5% auto; box-sizing:border-box;}
	.sec2 .box{float:none;overflow:hidden; width:100%; height:auto;}
	.sec2 .box.box2{width:100%; border:0; border-top:1px solid #dadada; border-bottom:1px solid #dadada;}

	.sec2 .box .words{padding-bottom:55px;}
	.sec2 .box .school{background-size:cover;}
}

@media screen and (min-width: 641px) and (max-width:1024px) {
	.sec2 .box .words .words_video{float:left; width:50%;}
	.sec2 .box .words .words_txt{float:left; width:45%; margin-left:5%;}
	.sec2 .box .words > img{width:61%;}
}

@media screen and (min-width: 501px) and (max-width:1024px) {
	.sec2 .box .inner_box{float:left; width:50%;}
	.sec2 .box .inner_box + .inner_box{border-top:0; border-left:1px solid #dadada;}
}
@media screen and (max-width: 1000px) {
.sec2 .box .words .words_video a > img{height:300px !important;} 
}
@media screen and (max-width: 800px) {
.sec2 .box .words .words_video a > img{height:240px !important;} 
}
@media screen and (max-width: 767px) {
	.sec2 .box > div{padding:25px; padding-bottom:30px;} 
}
@media screen and (max-width: 640px) {
	.sec2 .box .words .words_video a > img{height:260px !important;} 
}
@media screen and (max-width: 500px) {
	.sec2 .box > div{padding:18px 16px; padding-bottom:25px;} 
	.sec2 .box .inner_box{height:auto;}
	
	.sec2 .box h2{font-size:19px; margin-bottom:10px;}
	.sec2 .box p{font-size:13px; margin-bottom:20px;}
	
	.sec2 .box .family > img{width:95px;}
	.sec2 .box .calendar_box > img{width:60px; right:20px; bottom:20px;}
	
	.sec2 .box .words .words_txt{margin-top:25px;}
	.sec2 .box .words .words_txt p span{font-size:20px;}
	.sec2 .box .words .words_txt p{font-size:16px;}

	.sec2 .box .notice li{font-size:14px;}
	.sec2 .box .notice a.more{top:24px; right:25px;}

	.sec2 .box .school li a{font-size:13px;}
}
@media screen and (max-width: 400px) {
	.sec2 .box .words .words_video a > img{height:230px !important;} 
}

@media screen and (max-width: 320px) {
	.sec2 .box .words .words_video a > img{height:200px !important;} 
}


.worship_img {
	position: relative;
    padding-bottom: 56.1%;
    height: 0;
    overflow: hidden;
    width: 100%;
    border: 1px solid #ddd;
    background: #000;
}