@charset "utf-8";
/*
CSS Document
Style Sheet Import

Version		:	1.0 (모바일웹)
Author		:	
Date	    :	2014.01.06
Make by		:	Sung-Won, Choi
*/



/****************************** MAIN ******************************/

/****** HEADER ******/
h1 { text-align:center;}
h1 img { width:103px; padding:11px 0; }


/****** NAV ******/
#nav {width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; overflow:hidden; background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#B3D26F), color-stop(100%,#8DB53D)); box-shadow:rgba(0,0,0,0.4) 0 2px 2px; height:42px; z-index:999; border-top:1px solid #86AE37; border-bottom:1px solid #86AE37;}
#nav ul li {float:left; width:25%; height:40px; font-size:0.875rem; letter-spacing:-0.1rem; font-weight:bold; text-align:center; line-height:40px; border-top:1px solid #DCF4A3; box-sizing:border-box; -webkit-box-sizing:border-box; color:#fff; font-family: 'Nanum Gothic Coding';}
#nav ul li.on{ color:#fefb00;}
#nav ul li a{ color:#fff; display:block; }


/****** top_img ******/
#top_img {position:relative; width:100%;}


/****** main_menu(ICON)******/
#quick { width:100%; background:-webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(30%,rgba(255,255,255,0.60)), color-stop(50%,rgba(255,255,255,0.80)), color-stop(70%,rgba(255,255,255,0.60)), color-stop(100%,rgba(255,255,255,0))), url(../img/pattern.png) repeat 0 0; display:table; }
#quick ul { padding:25px 20px; display:table-cell; text-align:center; }
#quick ul li { float:left; width:33.3%; }
#quick ul li img { width:79px; height:88px; }
#quick ul li a { display:block; }


/****** PHOTO GALLERY ******/
#photo { position:relative; padding:15px 10px 25px 10px; background:#fff; overflow:hidden; }
#photo h3 { padding-left:10px; font-size:1.2em;}
.photo_area { padding-top:10px; }
.photo_area li { display:list-item; float:left; width:33.3%; padding:0 5px; text-align:center; box-sizing:border-box; -webkit-box-sizing:border-box; height:130px; vertical-align:top;}
.photo_area li img { border:1px solid #000; width:92px; }

.pho_txt{font-size:0.813em; padding:6px 0 0 0; width:82px; }
.pho_date{font-size:0.688rem; color:#666; padding-bottom:15px;}
.white_bg { background:#fff; padding:10px 0; margin-bottom:20px; border-bottom:1px solid #ddd; text-align:center; }
.white_bg img { padding:3px 0; }


/****** FOOTER ******/
#footerArea { height:55px; }
#footerArea .foot_link {clear:both; padding-top:10px; font-size:0.750rem; color:#b2b2b2; text-align:center;}
#footerArea .foot_link span { display:inline-block; padding:0 10px; }
#footerArea .foot_link span.foot_line { background:url(../img/footer_line.png) no-repeat 0 3px; background-size:1px; }
#footerArea .foot_link span a { color:#b2b2b2; }
#footerArea .name_tel { padding-top:3px; font-size:0.625rem; color:#b2b2b2; text-align:center;}
#footerArea .name_tel a { color:#b2b2b2; }




/****************************** SUB ******************************/

/****** 공통 : HEADER ******/
/****** NAV ******/
/* 서브메뉴 3개 Type*/
#sub_nav_type3{width:100%; background:#383838; overflow:hidden}
#sub_nav_type3 li{float:left; box-sizing:border-box; -webkit-box-sizing:border-box; height:36px; width:33%; line-height:36px; background:#383838; font-family: 'Nanum Gothic Coding'; color:#9f9f9f; font-size:0.813rem; text-align:center; letter-spacing:-1px;}
#sub_nav_type3 li:nth-child(3){width:34%;} 
#sub_nav_type3 li.on{color:#fff; font-weight:bold; background:#383838 url(../img/icon_arr.png) center bottom no-repeat; height:36px; line-height:36px;}
#sub_nav_type3 li a { color:#9f9f9f; display:block;  }

/* 서브메뉴 4개 Type*/
#sub_nav_type4{width:100%; background:#383838; overflow:hidden}
#sub_nav_type4 li{float:left; width:25%; height:36px; box-sizing:border-box; -webkit-box-sizing:border-box; line-height:36px; background:#383838; font-family: 'Nanum Gothic Coding'; color:#9f9f9f; font-size:0.813rem; text-align:center; letter-spacing:-1px;}
#sub_nav_type4 li.on{color:#fff; font-weight:bold; background:#383838 url(../img/icon_arr.png) center bottom no-repeat; height:36px; line-height:36px;}
#sub_nav_type4 li a { color:#9f9f9f; display:block;  }
#sub_nav_type4 li.txt_int { letter-spacing:-2px; }


/* 서브메뉴 5개 Type*/
#sub_nav_type5{width:100%; background:#383838; overflow:hidden}
#sub_nav_type5 li{float:left; width:20%; height:36px; box-sizing:border-box; -webkit-box-sizing:border-box; line-height:36px; background:#383838; font-family: 'Nanum Gothic Coding'; color:#9f9f9f; font-size:0.813rem; text-align:center; letter-spacing:-1px;}
#sub_nav_type5 li.on{color:#fff; font-weight:bold; background:#383838 url(../img/icon_arr.png) center bottom no-repeat; height:36px; line-height:36px;}
#sub_nav_type5 li a { color:#9f9f9f; display:block;  }
#sub_nav_type5 li.txt_int { letter-spacing:-2px; }

#sub_cont{padding:30px 10px 50px 10px; background:#fff; clear:both}
#sub_cont h3{font-size:1.313rem; font-family: 'Nanum Gothic Coding'; font-weight:bold; letter-spacing:-0.05rem;}

/* 영역이 넘어가는 텍스트 말줄임 설정 */
.ellipsis {width:80%; display:inline-block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.ellipsis4 {width:30%; display:inline-block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }

/* 교회비전 */
#sub_cont .sub_txt{ font-size:0.875rem; padding-top:20px; line-height:1.250rem;}

/* 섬기는 사람들 */
.photo_zone { clear:both; }
.photo_zone .job { padding-top:20px; padding-left:5px; font-size:0.938rem; font-weight:bold; }
.photo_zone .photo { padding-top:5px; }
.photo_zone .photo li { float:left; padding:5px 5px; }
.photo_zone .photo li img { width:90px; height:106px; border:1px solid #D9D9D9; border-bottom:none; padding:2px 2px; box-sizing:border-box; -webkit-box-sizing:border-box; }
.photo_zone .photo li .name { padding:2px 0; font-size:0.750rem; color:#666; border:1px solid #D9D9D9; text-align:center; border-top:none;  }

/* 예배와 모임 */
.tbl_area { }
.s_title { padding-top:20px; font-size:0.938rem; font-weight:bold; }
.tbl_disp  { width:100%; margin-top:7px; font-size:0.875rem; }
.tbl_disp th { border-top:2px solid #333; border-bottom:1px solid #dddddd; background:#f6f6f6; height:40px; vertical-align:middle; }
.tbl_disp td { padding:10px 5px; border-bottom:1px solid #dddddd; vertical-align:middle; }
.tbl_disp td.cell_L { border-right:1px solid #dddddd; text-align:center; }
.tbl_disp td.cell_R { border-left:1px solid #dddddd; text-align:center; }

/* 오시는 길 */
.map { margin-top:20px; width:100%; border:1px solid #333; box-sizing:border-box; -webkit-box-sizing:border-box; }
.sub_tt { padding-top:5px; font-size:0.875rem; }

/* 동영상 리스트 */
.line_2px { margin-top:20px; border-bottom:2px solid #333; }
.vod_area { position:relative; }
.vod_area .ttl_txt { padding:12px 5px 9px 5px; border-bottom:1px solid #ddd; cursor:pointer;   }
.vod_area .ttl_txt .ttl_title { font-size:1rem; letter-spacing:-0.05rem; }
.vod_area .ttl_txt span { display:inline-block; padding-top:7px; }
.vod_area .ttl_txt span.ttl_date { font-size:0.750rem; color:#666; padding-right:6px; } 
.vod_area .ttl_txt span.ttl_date2 { padding-left:9px; padding-right:6px; font-size:0.750rem; color:#666; background:url(../img/footer_line.png) no-repeat 0 9px; background-size:1px 10px; }

/* 게시판 리스트 */
.line_2px { margin-top:20px; border-bottom:2px solid #333; }
.board_area { position:relative; }
.board_area .ttl_txt {position:relative; padding:12px 5px 9px 5px; border-bottom:1px solid #ddd; cursor:pointer;  }
.board_area .ttl_txt .ttl_title { font-size:1rem; letter-spacing:-0.05rem; width:100%; padding-bottom:7px; }
.board_area .ttl_txt span { display:inline-block;  }
.board_area .ttl_txt span.ttl_date { font-size:0.750rem; color:#666; padding-right:6px; } 
.board_area .ttl_txt span.ttl_date2 { padding-left:9px; padding-right:6px; font-size:0.750rem; color:#666; background:url(../img/footer_line.png) no-repeat 0 2px; background-size:1px 10px; }
.ero { position:absolute; right:10px; top:25px; width:7px;} 
.read{background:#f4f4f4; padding:20px 10px; margin-bottom:20px; font-size:0.875rem; line-height:1.250rem; color:#666; border-bottom:1px solid #ddd;}
.read_2{background:#f4f4f4; padding:20px 10px; margin-bottom:20px; font-size:0.875rem; line-height:1.250rem; color:#666; border-bottom:1px solid #ddd; text-align:left;}

/*포토갤러리*/
.photo_area { position:relative; margin-top:10px; overflow:hidden; }
.photo_area li { float:left; width:33.33%; padding:10px 5px; text-align:center; box-sizing:border-box; -webkit-box-sizing:border-box; }
.photo_area li  p { width:100% }
.photo_area li  img { border:1px solid #333; width:92px; height:62px;}
.pho_txt{font-size:0.813em; padding:6px 0 0 0; width:92px; }
.pho_date{font-size:0.688rem; color:#666; padding-bottom:15px;}
.white_bg { background:#fff; padding:10px 0; margin-bottom:20px; border-bottom:1px solid #ddd; text-align:center; }
.white_bg img { padding:3px 0; }

/*켈린더*/
#calendar { width:100%; margin-top:20px; }
#calendar .date { position:relative; }
#calendar .date li { float:left; display:inline; height:25px; font-size:0.875rem; }
#calendar .date li:nth-child(1) { position:absolute; left:10px; top:0; height:20px; padding-left:15px; background:url(../img/btn_mon_left.png) no-repeat left 2px; background-size:8px; z-index:100; }
#calendar .date li:nth-child(2) { width:100%; text-align:center; font-size:1.188rem; }
#calendar .date li:nth-child(3) { position:absolute; right:10px; top:0; height:20px; padding-right:15px; background:url(../img/btn_mon_right.png) no-repeat right 2px; background-size:8px; z-index:100; }
#calendar .date li img { width:7px; padding:2px 5px 0 0; }

.tbl_calendar{ clear:both; width:100%; table-layout:fixed }
.tbl_calendar th{ border-top:1px solid #333; border-bottom:1px solid #dddddd; background:#f6f6f6; height:22px; padding-top:2px; vertical-align:middle; font-size:0.688em;}
.tbl_calendar td{ height:62px; border-bottom:1px solid #ddd; border-left:1px solid #ddd; font-size:1rem; }
.tbl_calendar td.line_L { border-left:none; }
.tbl_calendar td.line_R { border-right:none; }
.tbl_calendar td .num{ text-align:center; width:22px; height:18px; padding-top:1px; }
.tbl_calendar td .schedule{ width:100%; display:block; margin:1px 0; font-size:0.625rem; line-height:0.7rem; background:#FFE14B; border:1px solid #F0C824; box-sizing:border-box; -webkit-box-sizing:border-box; }

.sun { color:#D10101; }
.sat { color:#0261CA; }

/*켈린더 상세보기*/
.sch_area { position:relative; margin-top:20px; }
.sch_area .sch_txt {position:relative; padding:9px 10px 7px 10px; border-top:1px solid #F0C824; border-bottom:1px solid #F0C824; background:#FFE14B;  }
.sch_area .sch_txt .sch_title { font-size:1rem; letter-spacing:-0.05rem; line-height:1.2rem; width:100%; padding-bottom:5px; }
.sch_area .sch_txt span { display:inline-block;  }
.sch_area .sch_txt span.sch_date { font-size:0.750rem; color:#666; padding-right:6px; } 
.sch_area .con_read{background:#f4f4f4; padding:20px 10px; margin-bottom:20px; font-size:0.875rem; line-height:1.250rem; color:#666; border-bottom:1px solid #ddd;}


/* 페이지 넘버 : 공통 */
#pageNav{margin:15px auto; width:200px; text-align:center; font-size:0.813em; color:#666;}
.pageNum{display:inline-block; padding:3px 5px 0 5px; }
.pageNum_on{display:inline-block; padding:3px 5px 0 5px; font-weight:bold}

/* 버튼 - 목록 : 공통 */
#btn_list{  -webkit-box-shadow:rgba(0,0,0,0.2) 0 3px 3px; width:70px; height:28px; line-height:28px; border:1px solid #c0bebe; text-align:center; color:#000; font-weight:bold; margin:0 auto; font-size:0.875rem; }
#btn_list a { display:block; }