@charset "utf-8";

/**************************************************
프로그램 ID : detail.css
프로그램 명 : Detail Cascading Style Sheets
작  성   자 : 양혜숙
최초 작성일 : 2014/08/20
최종 작성일 : 
참고   사항 :  
**************************************************/

@import url("base.css");
@import url("layout.css");
@import url("style.css");


/* 메인
------------------------------------------------------------------------------- */

.main .bible, .main .conference {width:100%; height:306px; font-size:16pt; line-height:129%; background:#ed4949; display:none;}
.main .conference {background:#4983ed;}
.main .bible div, .main .conference div, .main .conference figure {vertical-align:top; display:table-cell; overflow:hidden;}
.main .bible div:first-child, .main .conference div:nth-child(2) {padding:40px 20px 0 20px;}
.main .bible div:first-child {text-align:right;}
.main .bible div:nth-child(2), .main .conference figure {width:390px; height:100%; font-size:0; line-height:0;}
.main .bible div:nth-child(2) img, .main .conference figure img {width:100%;}
.main .bible h3, .main .conference h3 {margin-bottom:21px; padding:0 10px 13px 10px; font-size:0; line-height:0; border-bottom:3px solid #fff;}
.main .bible h4, .main .conference dl {padding:0 10px;}
.main .bible a {color:#f5d0d0;}
.main .bible a strong {margin-bottom:11px; color:#fff; display:block;}
.main .bible p {margin:19px 10px 0 0;}
.main .conference dt em {display:block;}
.main .conference dt a {color:#d6e0f2;}
.main .conference dd {color:#fff;}
.main .conference p {margin:14px 0 0 10px;}
.main .location {width:100%;}
.main .location img {width:100%; max-width:100%;}

.main ul {width:100%; text-align:center; padding:30px 0;}
.main ul li {vertical-align:middle; float:left; width:33.3%; text-align:center;}
.main ul li img {max-width:100%; width:60% !important;}

/* 금주의 말씀 new */
.section02 {width:92%; margin:0 4%;}
.bible-title {padding:5px 10px; background-color:#2f4d91; color:#fff; font-size:14px; width:28%; font-weight:bold; text-align:center;}
.bible-video {min-height:230px;}

/* 금주의 말씀 내용 */
.bible-data {position:relative; margin-top:10px;}
.bible-data .title {font-weight:bold; border-bottom:2px solid #ddd; margin-bottom:16px; padding-bottom:10px; font-size:16px; color:#222;}
.bible-data .data {width: 100%; font-size: 16px; line-height: 1.4em; max-height: 5.8em; color: #777; overflow: hidden; text-overflow: ellipsis; margin-bottom:40px;
    display: -ms-flexbox;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    word-break: break-all;
}

.bible-data .more {position:absolute; top:0; right:0; border-bottom:1px solid #000; font-weight:bold; margin-top:-3px;}

@media only screen and (max-width:568px) {
	.main .bible, .main .conference {height:272px; font-size:14pt;}
	.main .bible div:first-child, .main .conference div:nth-child(2) {padding:36px 18px 0 18px;}
	.main .bible div:nth-child(2), .main .conference figure {width:347px;}
	.main .bible h3, .main .conference h3 {margin-bottom:19px; padding:0 9px 11px 9px;}
	.main .bible h3 img, .main .conference h3 img {height:26px;}
	.main .bible h4, .main .conference dl {padding:0 8px;}
	.main .bible a strong {margin-bottom:10px;}
	.main .bible p {margin:17px 9px 0 0;}
	.main .conference p {margin:12px 0 0 9px;}
	.main .bible p img, .main .conference p img {height:25px;}
	.main .conference h4 em img {height:25px;}
}
@media only screen and (max-width:400px) {
	.main .bible, .main .conference {height:191px; font-size:9pt;}
	.main .bible div:first-child, .main .conference div:nth-child(2) {padding:25px 10px 0 10px;}
	.main .bible div:nth-child(2), .main .conference figure {width:244px;}
	.main .bible div:nth-child(2) img, .main .conference figure img {height:191px;}
	.main .bible h3, .main .conference h3 {margin-bottom:13px; padding:0 10px 13px 10px;}
	.main .bible h3 img, .main .conference h3 img {height:18px;}
	.main .bible h4, .main .conference dl {padding:0 6px;}
	.main .bible a strong {margin-bottom:7px;}
	.main .bible p {margin:12px 6px 0 0;}
	.main .conference p {margin:9px 0 0 6px;}
	.main .bible p img, .main .conference p img {height:18px;}
	.main .conference h4 em img {height:18px;}
}
@media only screen and (max-width:360px) {
	.main .bible, .main .conference {height:172px; font-size:8pt;}
	.main .bible div:first-child, .main .conference div:nth-child(2) {padding:20px 9px 0 9px;}
	.main .bible div:nth-child(2), .main .conference figure {width:219px;}
	.main .bible div:nth-child(2) img, .main .conference figure img {height:auto;}
	.main .bible h3, .main .conference h3 {margin-bottom:11px; padding:0 5px 7px 5px;}
	.main .bible h3 img, .main .conference h3 img {height:15px;}
	.main .bible h4, .main .conference dl {padding:0 5px;}
	.main .bible a strong {margin-bottom:6px;}
	.main .bible p {margin:10px 5px 0 0;}
	.main .conference p {margin:7px 0 0 5px;}
	.main .bible p img, .main .conference p img {height:15px;}
	.main .conference h4 em img {height:15px;}
}
@media only screen and (max-width:320px) {
	.main .bible, .main .conference {height:153px; font-size:7.5pt;}
	.main .bible div:nth-child(2), .main .conference figure {width:195px;}
}


/* 은혜성서교회
------------------------------------------------------------------------------- */
.about h2 {background-image:url(../../images/bg/bg_about.png);}
.about h3 {margin:50px 30px; font-size:0; line-height:0;}
.about h4 {margin-bottom:34px;}
.about p {word-break:keep-all; word-wrap:normal; white-space:normal;}
/* 헌금통장 */
.account table.info td {padding-left:10px; text-align:center;}
.account div.boardList {margin-bottom:9px;}
/* 찾아오시는길 */
div.map {width:576px; height:456px; margin:auto; border:2px solid #929292;}
.about .location dl {clear:both; margin:44px 30px 0 30px;}
.about .location > dl > dt {clear:both; float:left; margin-right:7px; font-weight:bold; color:#222;}
.about .location > dl > dt, .about .location > dl > dd {margin-bottom:9px;}
dl.address {padding-bottom:34px; border-bottom:2px solid #d1d1d1;}
dl.subwayBus dl {margin:0 !important;}
dl.subwayBus dl dt {clear:both; float:left; margin-right:9px;}
dl.subwayBus dl dd ul li {margin-bottom:3px;}
dl.subwayBus dl dd span {vertical-align:-7px;}
.flick-container detail {overflow:hidden;}
.about ul.social {float:right; margin-top:-38px; margin-right:10px;}
.about ul.social li {float:left; margin-left:10px;}

@media only screen and (max-width:568px) {
	.about h3 {margin:45px 26px;}
	.about h3 img {height:31px;}
	.about h4 {margin-bottom:30px;}
	.about h4 img {width:100%;}
	
	.account table.info td {padding-left:8px;}
	.account div.boardList {margin-bottom:7px;}
	
	div.map {width:514px; height:407px;}
	.about .location dl {margin:44px 30px 0 30px;}
	.about .location > dl > dt {margin-right:7px;}
	.about .location > dl > dt, .about .location > dl > dd {margin-bottom:9px;}
	dl.address {padding-bottom:34px;}
	dl.subwayBus dl dt {margin-right:9px;}
	dl.subwayBus dl dd ul li {margin-bottom:3px;}
	dl.subwayBus dl dd span {vertical-align:-7px;}

	.about ul.social {margin-top:-32px;}
	.about ul.social li {margin-left:8px;}
	.about ul.social li img {height:38px;}
}
@media only screen and (max-width:480px) {
	div.map {width:426px; height:337px;}
}
@media only screen and (max-width:400px) {
	#contents.about {}
	.about h3 {margin:30px 18px;}
	.about h3 img {height:22px;}
	.about h4 {margin-bottom:21px;}
	
	.account table.info td {padding-left:5px;}
	.account div.boardList {margin-bottom:6px;}
	
	div.map {width:360px; height:285px;}
	.about .location dl {margin:44px 30px 0 30px;}
	.about .location > dl > dt {margin-right:7px;}
	.about .location > dl > dt, .about .location > dl > dd {margin-bottom:9px;}
	dl.address {padding-bottom:34px;}
	dl.subwayBus dl dt {margin-right:9px;}
	dl.subwayBus dl dd ul li {margin-bottom:3px;}
	dl.subwayBus dl dd span {vertical-align:-7px;}

	.about ul.social {margin-top:-20px;}
	.about ul.social li {margin-left:6px;}
	.about ul.social li img {height:26px;}
}
@media only screen and (max-width:360px) {
	.about h3 {margin:25px 15px;}
	.about h3 img {height:17px;}
	.about h4 {margin-bottom:17px;}
	
	.account div.boardList {margin-bottom:5px;}
	
	div.map {width:328px; height:260px;}
	.about .location dl {margin:22px 15px 0 15px;}
	.about .location > dl > dt {margin-right:4px;}
	.about .location > dl > dt, .about. location > dl > dd {margin-bottom:5px;}
	dl.address {padding-bottom:17px;}
	dl.subwayBus dl dt {margin-right:5px;}
	dl.subwayBus dl dd ul li {margin-bottom:2px;}
	dl.subwayBus dl dd span {vertical-align:-4px;}
	dl.subwayBus dl dd span img {height:15px;}

	.about ul.social {margin-top:-20px;}
	.about ul.social li {margin-left:5px;}
	.about ul.social li img {height:21px;}
}
@media only screen and (max-width:320px) {
	.account table.info td {padding-left:0;}
	
	div.map {width:288px; height:228px;}
}

/* 스와이퍼 탭메뉴 추가 */
.swiper-container.gallery-thumbs {padding:13px 4% 15px 4%; margin:65px 0 40px 0; border-bottom:1px solid #ddd;}
.swiper-container.gallery-thumbs .swiper-slide {font-size:13px; font-weight:bold;}
.swiper-slide.swiper-slide-thumb-active {color:#222;}

/* 교회소개부분 추가 */
.intro-tit {font-size:22px; font-weight:bold; color:#222; margin-bottom:20px;}
.intro-tit span.addition{font-size: 12px;text-align: right;display: inline-block;color: #2f4e91;float: right;line-height: 1;margin-top: 12px;}
.intro-sub-tit {font-size:16px; color:#2f4d91; margin-bottom:20px;}
.intro-sub-data {font-size:14px; margin-bottom:15px;}

/* table 스타일 추가 */
.tb_type1 {border-top:1px solid #222; border-bottom:1px solid #ddd;}
.tb_type1 table thead tr th {font-size:14px; font-weight:normal; color:#222; padding:6px 0;}
.tb_type1 table tbody tr td {font-size:12px; vertical-align:top; border-top:1px solid #ddd; padding:6px 0;}
.tb_type1 table tbody tr td.center {text-align:center;}
.tb_type1 table tbody tr td.linex {border-top:0;}
.tb_type1.all_center table tbody tr td {text-align:center;}

/* 찾아오시는길부분 */
.road-tit {font-size:14px; font-weight:bold; color:#2f4d91;}
.road-sub {font-size:14px; color:#777; margin-bottom:20px;}
.road-left-box {float:left; width:50%;}
.road-right-box {float:left; width:50%;}
.road-sub-number {margin-bottom:10px; font-weight:bold;}
.road-icon {padding:4px 5px; color:#fff; font-size:14px; margin-right:6px;}
.road-icon.blue {background-color:#105dc7;}
.road-icon.red {background-color:#df4144;}
.road-icon.green {background-color:#6bb12c;}
.road-icon.yellow {background-color:#b3b81e;}

/* 금주의 말씀
------------------------------------------------------------------------------- */
#contents.bible h2 {background-image:url(../../images/bg/bg_bible.png);}


/* 컨퍼런스 안내
------------------------------------------------------------------------------- */
#contents.conference h2 {background-image:url(../../images/bg/bg_conference.png);}


/* 교회소식
------------------------------------------------------------------------------- */
#contents.news h2 {background-image:url(../../images/bg/bg_news.png);}


/* 교회앨범
------------------------------------------------------------------------------- */
#contents.album h2 {background-image:url(../../images/bg/bg_album.png);}