@charset "utf-8";

/* User Custom CSS */  /*  */
#kso-nav .navbar-nav>li>a,.login-menu li,.login-menu button,.login-menu a {color:#333} /* 탑 메뉴 폰트컬러 */
#kso-nav {background-color: #fff;border-bottom: 1px solid rgba(0,0,0,.1)} /* 탑 메뉴 하단 라인 컬러 */
#kso-nav .dropdown-menu {background-color: #fff}  /* 2차 메뉴 배경 컬러 */
#kso-nav .dropdown-menu>li>a {color: #333} /* 2차 메뉴 폰트 컬러 */
#kso-nav.sticked .navbar-nav>li>a,#kso-nav.sticked .dropdown-menu>li>a {color: #333} /* 스크롤 후 메뉴 폰트 컬러 */
#kso-nav.sticked,#kso-nav.sticked .dropdown-menu {background-color: rgba(255,255,255,.9)} /* 스크롤 후 메뉴바 배경컬러 */
.kso-opener .line,
.navbar-nav > li.active > a > span,.navbar-nav > li:hover > a > span {border-bottom-color:#111} /* 탑 메뉴 활성화된 메뉴 하단 라인 컬러 */
#kso-nav.sticked .kso-opener .line,
#kso-nav.sticked .navbar-nav > li.active > a > span,
#kso-nav.sticked .navbar-nav > li:hover > a > span {border-bottom-color:#333} /* 스크롤 후에 활성화된 메뉴 하단 라인 컬러 */

/* 슬라이드 */
#kso-promotion .caption-title {font-size: 60px;font-weight: normal;letter-spacing: 10px} /* 캡션 폰트 */
#kso-promotion .caption-title,#kso-promotion .caption-cont {color:#fff} /* 캡션 폰트 컬러*/
#kso-promotion .caption-title:after {background-color:#fff} /* 타이틀 아래 라인 컬러 */
.btn-camera {color:#fff;border-color:#fff} /* 버튼 컬러 */
.btn-camera:hover {background-color:#fff} /* 버튼 마우스 오버 시 컬러 */

/* 각 섹션 상하 공간 */
#kso-about {padding-top:50px} /* 1) 어바웃, 설교영상 상 */
#kso-about .kso-about-1 {padding-top:0px;padding-bottom:0px} /* 1_1) 어바웃, 설교영상아이콘 */ 
#kso-about .kso-about-2 {padding-top:0px;padding-bottom:0px} /* 1_2) 어바웃 */
#kso-services {padding-top:50px;padding-bottom:0px} /* 2) 섹션 서비스, 배너 */
#kso-parallax-1{padding-top:130px;padding-bottom:100px} /* 3) 패럴랙스 1 */
#kso-tab {padding-top:50px;padding-bottom:0px} /* 4) 섹션 인포, 찬양사역 */
#kso-parallax-2 {padding-top:100px;padding-bottom:50px} /* 5) 패럴랙스 2 */
#kso-post {padding-top:50px;padding-bottom:10px} /* 6) 섹션 포스트, 다음세대 */
#kso-contact{padding-top:100px;padding-bottom:100px} /* 7) 콘텍트 */
#kso-footer {padding-top:10px;padding-bottom:0px} /* 8) 푸터(하단) */
#kso-copyright {padding-top:15px;padding-bottom:15px} /* 9) 카피라이트 */

#kso-about .kso-about-2:before {
	display: none;
}
#kso-about .kso-about-2 .bgimg {
	position: relative;
	min-height: 450px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: background .3s ease;
}
#kso-about .kso-about-2 .bgimg:before {
	display: flex;
    align-items: center;
    justify-content: center;	
	content: "\e980";
	position: absolute;
	left: 0;top: 0;
	width: 100%;
	height: 100%;
	font-family: 'xeicon';
	color: #fff;
	background-color: rgba(255,168,36,.0);
	transition: background .3s ease;
}	
#kso-about .kso-about-2 .bgimg:hover:before {
	background-color: rgba(255,168,36,.5);
}
/* ETC */
section h1,section h2,section h3,section h4 {font-family:'Open Sans','Apple SD 산돌고딕 Neo', 'Apple SD Gothic Neo', '나눔고딕', 'NanumGothic', 'ng'} /* 섹션 타이틀 폰트 */
#kso-teaser .col-img .teaser-caption h3, #kso-teaser .col-img .teaser-caption p {color:#fff} /* 티져 이미지형 폰트 컬러 */
.company-info,.parallax .plus-line span,
.parallax h3,.parallax p,.parallax .box-cont h4,.parallax .box-cont i {color:#fff} /* 패럴랙스, 콘텍트섹션 폰트 컬러 */
ul.float-menu, ul.float-menu .member-title span {background-color: #1b1b1b}  /* 우측 판넬 배경 컬러 */

/* 서브 */
.sub-head-title h1 {font-size:36px} /* 서브 탑 제목 폰트 사이즈 */
.sub-head-title p {font-size:16px} /* 제목 아래 폰트 사이즈 */
.sub-head-title h1,.sub-head-title p {color:#fff} /* 폰트 컬러 */

/* 푸터 */
#kso-footer {background-color:#232323} /* 배경컬러 */
#kso-footer .footer-color {color:#888} /* 내용컬러 */
#kso-footer .deco-line {border-color:#555} /* 제목 아래 라인 컬러 */
#kso-copyright {background-color:#1a1a1a} /* 카피라이트 배경 */

@media (min-width: 1200px) {  
	#camera_wrap {min-height: 500px}
}
/* 추가할 CSS는 여기에 @media (max-width: @iphone-screen) {  */
/* 
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max–moz-device-pixel-ratio: 2) {
	#kso-onepage1,#kso-onepage2,#kso-onepage3,#kso-onepage4,#kso-onepage5 {background-repeat:no-repeat;background-size: 414px 767px;width:414px;height: 767px;}
}
*/
#kso-tab .icon-tabElement ul li.active a .ico-circle {
	background-color: #20E0BB; /* #1abc9c */
}
.ico-circle {
	display: flex;
	align-items: center;
	text-align: center;
	margin: -20px auto; /* 찬양사역 제목-아이콘간격, 기준 0 */
	margin-bottom: 5px; /* 찬양사역 아이콘-소제목 간격, 기준 10 */
	width: 80px; /* 찬양사역아이콘크기 */
	height: 80px; /* 찬양사역아이콘크기 */
	background-color: #FFF; /*#DDD 연회색*/
	border-radius: 50%;
}
/* 헤더설정 */
.aside h3 {
    font-size: 30px;
}
.aside a.list-group-item {
	font-size: 18px;
}

#kso-contact .section-header {
	color: #fff;
}
#kso-post .box-post {
	padding: 0rem 0; /* 주일학교 아이콘 배경여백 크기:기존 4rem 0 */
	text-align: center;
	background-color: #f8f8f8;
}
#kso-post .box-post .ico-div {
	height: 100px; /* 주일학교 아이콘 크기 조절:기존 100px ; */
}
#kso-post .hover-anchor:hover h3 {
	color: #20E0BB; /* 주일학교 아이콘 선택시 글자색상 조절:기존 #1abc9c ; */
}

.btn-anchor {
	display: inline-block;
	padding: 1.5rem 2rem;
	min-width: 210px;
	text-align: center;
	color: #333;
	background-color: #fff;
}
.btn-anchor svg {
	font-size: 15px;
}

.bg-gray {
	background-color: #f2f2f2 !important;/*연회색*/
}
.btn-m {
	display: inline-block;
	padding: 5px 0;
}
.btn-m>svg {
	color: #aaa;/*회색*/
	transition: margin .3s ease;
}
.btn-m:hover {
	color: #20E0BB; /* #1abc9c 초록색 */
}
.btn-m:hover svg {
	margin-left: .5rem;
	color: #20E0BB; /* #1abc9c */
}

.d-flex {
	display: flex;
}
.align-items-center {
	display: flex;
	align-items: center;
}
.py-0 {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.py-100 {
	padding-top: 100px !important;
	padding-bottom: 100px !important;
}
.px-3 {
	padding-left: 15px !important;
	padding-right: 15px !important;
}
.mt-3 {margin-top: 1rem;}
.ms-4 {margin-left: 1.5rem;}
.no-gutters {
  margin-right: 0;
  margin-left: 0;
}
.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

@media (min-width: 1200px) {  
	.navbar-collapse.collapse {
		margin-right: 10rem;
	}
}


@media (max-width: 767px) {  
	#kso-about .about-iconblock {
		display: flex;
	}
	#kso-about .icon-wrap {
		min-width: 110px;
	}
	#kso-about .icon-wrap a {
		text-align: center;
	}	
	#kso-about .about-iconblock p {
		padding-top: 1rem;
		text-align: left;
	}
	#kso-tab .icon-tabElement li a {
		font-size: 14px;
	}
}


@media (max-width: 480px) {  
	#kso-onepage1,#kso-onepage2,#kso-onepage3,#kso-onepage4,#kso-onepage5,
	#kso-parallax-1,#kso-parallax-2,#kso-contact {background-attachment:scroll;}
}