@charset "utf-8";

/* 구글 노토산스 고딕 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');


/* Noto Sans KR  font-weight 구글 노토산스 고딕 폰트 두께
-----------------------
Thin
font-weight:100;
Light
font-weight:300;
Regular
font-weight:400;
Medium
font-weight:500;
Bold
font-weight:700;
Black
font-weight:900; */

/* 나눔고딕 */
@import url(//fonts.googleapis.com/earlyaccess/nanumgothiccoding.css);
/* 
NanumGothic  font-weight
-----------------------

Regular
font-weight:400;
Bold
font-weight:700;
Extra Bold
font-weight:800;
 */


/* 나눔스퀘어네오 */
@font-face{
    font-display: swap;
    font-family: NanumSquareNeo;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.eot?#iefix) format("embedded-opentype"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.woff) format("woff"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.ttf) format("truetype");
    font-weight:100;
    
}
@font-face{
    font-display: swap;
    font-family: NanumSquareNeo;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.eot?#iefix) format("embedded-opentype"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.woff) format("woff"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.ttf) format("truetype");
    font-weight:300;
}
@font-face{
    font-display: swap;
    font-family: NanumSquareNeo;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.eot?#iefix) format("embedded-opentype"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.woff) format("woff"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.ttf) format("truetype");
    font-weight:400;
}
@font-face{
    font-display: swap;
    font-family: NanumSquareNeo;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.eot?#iefix) format("embedded-opentype"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.woff) format("woff"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.ttf) format("truetype");
    font-weight:500;
}
@font-face{
    font-display: swap;
    font-family: NanumSquareNeo;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.eot?#iefix) format("embedded-opentype"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.woff) format("woff"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.ttf) format("truetype");
    font-weight:700;
}


/* 나눔스퀘어라운드 */
@import url('https://fastly.jsdelivr.net/gh/innks/NanumSquareRound@master/nanumsquareround.min.css?1');
/* @font-face {
    font-family: 'NanumSquareRound';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff');
} */


.top_area {
	position: relative;
	height:65px;
	width:100%;
	background: #25a7cd url(../image/common/global_center_img_Cross.jpg) no-repeat;
	background-size: 77px 59px;
	background-position: center bottom;
	text-align:center; 
	z-index: 100;
}
.top_layout {
	position:relative;
}
@media (max-width: 320px) {
	.logo {
		display:inline-block; 
		vertical-align:top; 
		margin-top: 20px;
		width:200px;
		height: 26px;
		background: url(../image/common/global_logo_siheung.png) no-repeat;
		background-size:167px 26px;
		background-position: center center;
	}
}
@media (min-width: 321px) {
	.logo {
		display:inline-block; 
		vertical-align:top; 
		margin-top: 15px;
		width:246px;
		height: 32px;
		background: url(../image/common/global_logo_siheung.png) no-repeat;
		background-size:205px 32px;
		background-position: center center;
	}
}
.btn_menu {
	display:block;
	width:26px;
	height: 19px;
	cursor:pointer;
	position:absolute;
	left:11px;
	top:23px;
	background: url(../image/common/global_icon_menu_open.png) no-repeat;
	background-size:26px 19px;
}


body.on{
	overflow: hidden;
}
body.on .gnb{
	background-color: rgba(0,0,0,0.7);
	z-index: 1000000;
}


.gnb_area{
	position: relative;
	left: -300px;
	width: 300px;
	height: 100%;
	overflow:hidden; 
	overflow-y:scroll;
	background-color: #fff;
}


.gnb {
	position: fixed; 
	left: 0;
	top: 0; 
	width: 100%; 
	height: 100%; 
	line-height: 1;
	background-color: rgba(0,0,0,0);
	transition-duration: 0.5s;
	z-index: -1;
}
.gnb .gnb_area_top{
	position: relative;
	height: 45px;
	background-color: #0d5578;
}
.gnb .gnb_area_top .go_yfgc {
	position: absolute;
	overflow: hidden;
	margin: auto;
	top: 0; 
	bottom: 0;
	left: 26px;
	width: 100%; 
	height: 21px;
	text-indent: 32px;
	background: url(../image/common/global_icon_yfgc.png) no-repeat;
	background-size: 24px 21px;
	font-size: 15px;
	line-height: 21px;
}

.gnb .gnb_area_top .go_close{
	position: absolute;
	overflow:hidden;
	right: 0;
	top:0;
	overflow:hidden;
	width: 45px; 
	height: 45px;
	text-indent: -9999px;
	background: #0b4967 url(../image/common/icon_gnb_close.png) no-repeat center;
	background-size:21px;
}

.gnb .gnb_area_top *{color: #fff;}


.gnb .gnb_members{
	width: 100%;
	background-color: #0981a9;
}
.gnb .gnb_members ul{
	overflow:hidden;
}
.gnb .gnb_members li{
	float: left;
	width: 25%;
	box-sizing: border-box;
	background-color: #0981a9;
	background-repeat: no-repeat;
	background-position: center 15px;
	background-size: auto 21px;	
}

.gnb .gnb_members li a{
	display: block;
	padding-top: 45px;
	height: 75px;
	text-align: center;
	box-sizing: border-box;
	font-size: 11px;
	color: #fff;
}

.gnb .gnb_members .before_login li:nth-of-type(1){
	background-image: url(../image/common/global_icon_login.png);
}
.gnb .gnb_members .before_login li:nth-of-type(2){
	background-image: url(../image/common/global_icon_join.png);
}
.gnb .gnb_members .before_login li:nth-of-type(3){
	background-image: url(../image/common/global_icon_find.png);
	width: 45%;
}

.gnb .gnb_members .after_login li:nth-of-type(1){
	background-image: url(../image/common/global_icon_logout.png);
}
.gnb .gnb_members .after_login li:nth-of-type(2){
	background-image: url(../image/common/global_icon_modify.png);
}


/* sidebar */
.sidebar {
	position: relative;
	width: 100%;
}

.sidebar ul {
	overflow: hidden;
}

.sidebar ul li {
	position: relative;
	border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.sidebar a {
	display: block;
	height: 55px;
	line-height: 55px;
	padding-left: 25px;
	color: #2c2c2c;
	font-family: 'NanumSquareNeo' !important;
	font-size: 16px;
	font-weight: 700;
	text-indent: 30px;
	text-decoration: none;
}

.sidebar .toggle {
	position: absolute;
	top: 0px;
	right: 15px;
	cursor: pointer;
	width: 55px;  /* 터치 영역 확보 때문에 이미지 보다 크게 */
	height: 55px;  /* 터치 영역 확보 때문에 이미지 보다 크게 */
	background-size: cover;
	font-size: 0;
}

.sidebar .plus {
	display: block;
	background-image: url(../image/common/icon_depth1_plus.png);
	background-size: 20px 20px;
	background-position: center center;
	background-repeat: no-repeat;
}

.sidebar .minus {
	display: block;
	background-image: url(../image/common/icon_depth1_minus.png);
	background-size: 20px 1px;
	background-position: center center;
	background-repeat: no-repeat;
}

.sidebar .submenu .toggle {
	position: absolute;
	top: 0px;
	right: 15px;
	width: 44px;  /* 터치 영역 확보 때문에 이미지 보다 크게 */
	height: 44px;  /* 터치 영역 확보 때문에 이미지 보다 크게 */
	background-size: cover;
	font-size: 0;
}

.sidebar .submenu .plus {
	display: block;
	background-image: url(../image/common/icon_depth2_plus.png);
	background-size: 20px 20px;
	background-position: center center;
	background-repeat: no-repeat;
}

.sidebar .submenu .minus {
	display: block;
	background-image: url(../image/common/icon_depth2_minus.png);
	background-size: 20px 1px;
	background-position: center center;
	background-repeat: no-repeat;
}

.sidebar .submenu {
	display: none;
}

.sidebar .submenu > li {
	border-bottom: 1px solid rgba(65, 194, 223, 0.5) !important;
}

.sidebar .submenu li:last-child {
	border-bottom: none !important;
}

.sidebar .submenu a {
	height: 44px;
	line-height: 44px;
	font-size: 14px;
	color: #fff !important;
	background-color: #41c2df;
}

.sidebar .sub-submenu {
	display: none;
}

.sidebar .sub-submenu > li {
	border-bottom: 1px solid rgba(0, 0, 0, 0.15) !important;
}

.sidebar .sub-submenu li:last-child {
	border-bottom: none !important;
}

.sidebar .sub-submenu a {
	height: 44px;
	line-height: 44px;
	font-size: 14px;
	color: #6c6c6c !important;
	background-color: #ebeff0;
	text-indent: 40px;
}


/* depth1-1 교회소개 */
.sidebar > ul > li:nth-of-type(1)>a {
	font-family: 'NanumSquareNeo' !important;
	font-size: 16px;
	font-weight: 700;
	background-image: url(../image/common/main_icon_menu_01.png);
	background-size: 11px 16px;
	background-position: 8.25% center;
	background-repeat: no-repeat;
	background-color: #fff;
}

.sidebar > ul > li.on:nth-of-type(1)>a {
	color: #fff;	
	background-image: url(../image/common/main_icon_menu_01_on.png);
	background-size: 11px 16px;
	background-position: 8.25% center;
	background-repeat: no-repeat;
	background-color: #109fbf;
}


/* depth1-2 예배와 말씀 */
.sidebar > ul > li:nth-of-type(2)>a {
	font-family: 'NanumSquareNeo' !important;
	font-size: 16px;
	font-weight: 700;
	background-image: url(../image/common/main_icon_menu_02.png);
	background-size: 19px 11px;
	background-position: 7% center;
	background-repeat: no-repeat;
	background-color: #fff;
}

/* depth1-2 예배와 말씀 */
.sidebar > ul > li.on:nth-of-type(2)>a {
	color: #fff;	
	background-image: url(../image/common/main_icon_menu_02_on.png);
	background-size: 19px 11px;
	background-position: 7% center;
	background-repeat: no-repeat;
	background-color: #109fbf;
}


/* depth1-3 교회학교 */
.sidebar > ul > li:nth-of-type(3)>a {
	font-family: 'NanumSquareNeo' !important;
	font-size: 16px;
	font-weight: 700;
	background-image: url(../image/common/main_icon_menu_03.png);
	background-size: 19px 15px;
	background-position: 7% center;
	background-repeat: no-repeat;
	background-color: #fff;
}

/* depth1-3 교회학교 */
.sidebar > ul > li.on:nth-of-type(3)>a {
	color: #fff;	
	background-image: url(../image/common/main_icon_menu_03_on.png);
	background-size: 19px 15px;
	background-position: 7% center;
	background-repeat: no-repeat;
	background-color: #109fbf;
}


/* depth1-4 교회학교 */
.sidebar > ul > li:nth-of-type(4)>a {
	font-family: 'NanumSquareNeo' !important;
	font-size: 16px;
	font-weight: 700;
	background-image: url(../image/common/main_icon_menu_04.png);
	background-size: 19px 15px;
	background-position: 7% center;
	background-repeat: no-repeat;
	background-color: #fff;
}

.sidebar > ul > li.on:nth-of-type(4)>a {
	color: #fff;	
	background-image: url(../image/common/main_icon_menu_04_on.png);
	background-size: 19px 15px;
	background-position: 7% center;
	background-repeat: no-repeat;
	background-color: #109fbf;
}


/* depth1-5 교회게시판 */
.sidebar > ul > li:nth-of-type(5)>a {
	font-family: 'NanumSquareNeo' !important;
	font-size: 16px;
	font-weight: 700;
	background-image: url(../image/common/main_icon_menu_05.png);
	background-size: 13px 16px;
	background-position: 8.25% center;
	background-repeat: no-repeat;
	background-color: #fff;
}

.sidebar > ul > li.on:nth-of-type(5)>a {
	color: #fff;	
	background-image: url(../image/common/main_icon_menu_05_on.png);
	background-size: 13px 16px;
	background-position: 8.25% center;
	background-repeat: no-repeat;
	background-color: #109fbf;
}

/* depth1-6 오시는 길 */
.sidebar > ul > li:nth-of-type(6)>a {
	font-family: 'NanumSquareNeo' !important;
	font-size: 16px;
	font-weight: 700;
	background-image: url(../image/common/main_icon_menu_06.png);
	background-size: 19px 13px;
	background-position: 7.25% center;
	background-repeat: no-repeat;
	background-color: #fff;
}

.sidebar > ul > li.on:nth-of-type(6)>a {
	color: #fff;	
	background-image: url(../image/common/main_icon_menu_06_06.png);
	background-size: 19px 13px;
	background-position: 7.25% center;
	background-repeat: no-repeat;
	background-color: #109fbf;
}