@charset "utf-8";

/* background fixed 사용시 버그 대응용 * 한 번 스크롤로 페이지 전체 넘김을 할 때는 html스타일에서 height속성 제거하기 */
/* html {overflow: hidden; height: 100%;} */
/* body {overflow: auto; height: 100%;} */

/* ******************** 공용 ******************** */
a:link {color:#666;}
a:visited {color:#666;}
a:hover {color:#000;}
a:active {color:#000;}
#gotop {z-index:2000; position:fixed; display:none; width:35px; height:35px; right:20px; border-radius:3px; bottom:40px;}
body {font-family:'NotoSansKR' !important; font-size:14px; line-height:1.6; color:#666;}

.c_acc {color:#582b02 !important;}
.c_sub {color:#ffde00 !important;}
.f_bold {font-weight:bold !important;}
p {word-break:keep-all !important;}



/* ******************** 데스크탑 (992~) ******************** */
@media screen and (min-width: 992px){
	
	/* ********** 헤더 ********** */
	header {z-index:9999; position:relative; overflow:hidden; width:100%; height:160px; background:#fff;}
	header.main {position:absolute; height:110px;}
	header .headWrap {position:relative;}
	header .headWrap .wrap {position:relative; width:1200px; margin:0 auto;}
	header .head {position:absolute; top:35px; left:0px; z-index:999;}
	header .head h1 {display:inline-block; font-size:30px; font-family:NanumRound; font-weight:900; letter-spacing:-.5px;}
	header .head h1 a {color:#000;}
	header .head h1 span {display:block; font-size:13px; font-weight:300; line-height:2;}
	header .side {position:absolute; top:35px; width:100%;}
	header .side ul {width:1200px; margin:0 auto; overflow:hidden; text-align:right; line-height:1;}
	header .side li {float:right;}
	header .side li a {color:#000; font-size:12px; font-weight:400; padding-left:30px;}
	
	/* ********** gnb ********** */
	nav.mobile {visibility:hidden !important;}
	nav.pc {visibility:visible; position:relative; display:block; max-width:100%; margin:0 auto;}
	nav.pc .on {}
	nav.pc .navbg {position:absolute; left:0; top:0; width:100%; height:100%;}
	nav.pc .navbg .dep1 {height:110px; background:#fff;}
	nav.pc .navbg .dep2 {height:50px; background:#000; width:100%;}
	nav.pc .gnb {height:110px; width:1200px; margin:0 auto;}
	nav.pc .gnb a {line-height:1;}
	nav.pc .gnb a.on {color:#ffde00;}
	nav.pc .gnb>ul>li>div ul li a:hover, nav .navWrap>ul>li>div ul li a:focus {color:#ffde00;}
	nav.pc .gnb>ul {overflow:hidden; float:right;}
	nav.pc .gnb>ul>li {float:left;}
	nav.pc .gnb>ul>li>a {display:block;width:100%; height:50px; font-size:18px; font-weight:500; color:#000; padding-left:40px; margin-top:66px; position:relative;}
	nav.pc .gnb>ul>li>a::after {content:''; display:block; position:absolute; width:5px; height:5px; background:#000; transform:rotate(45deg); top:7px; left:20px; margin-left:-2.5px;}
	nav.pc .gnb>ul>li:first-child>a::after {display:none;}
	nav.pc .gnb>ul>li>a::before {
		content:''; display:none; width:7px; height:7px; position:absolute; bottom:2px; left:65%;
		transform:rotate(45deg); margin-left:-3.5px; background:#000;
	}
	nav.pc .gnb>ul>li:hover>a::before {display:block}
	nav.pc .gnb>ul>li:hover>a.on::before {display:block}
	nav.pc .gnb>ul>li>div {
		display:none; position:absolute;left:0; top:110px; width:100%; height:0; overflow:hidden; background-color:#000; line-height:1;
		transition:all .2s linear !important;
		-webkit-transition:all .2s linear !important;
		-moz-transition:all .2s linear !important;
	}
	nav.pc .gnb>ul>li>div.on {display:block; height:50px; margin-top:15px;}
	nav.pc .gnb>ul>li>div p {width:1200px; margin:0 auto; font-size:18px; font-weight:500; color:#fff;}
	nav.pc .gnb>ul>li>div ul {max-width:1200px; height:100%; margin:0 auto; overflow:hidden; position:absolute; top:0px;}
	nav.pc .gnb>ul>li>div ul li {float:left; padding-left:10px;}
	nav.pc .gnb>ul>li>div ul li:hover {color:#ffde00;}
	nav.pc .gnb>ul>li>div ul li a {display:block; color:#fff; font-size:16px; font-weight:100; padding:0 10px;}
	nav.pc .gnb>ul>li>div ul li.on {color:#ffde00;}
	
	nav.pc .gnb>ul>li:nth-child(1)>div ul {left:720px;}
	nav.pc .gnb>ul>li:nth-child(2)>div ul {left:830px;}
	nav.pc .gnb>ul>li:nth-child(3)>div ul {left:950px;}
	nav.pc .gnb>ul>li:nth-child(4)>div ul {left:1030px;}
	nav.pc .gnb>ul>li:nth-child(5)>div ul {left:1150px;}
	nav.pc .gnb>ul>li:nth-child(6)>div ul {left:1370px;}
	nav.pc .gnb>ul>li:nth-child(7)>div ul {left:1480px;}
	
	
	/* ********** 하단 ********** */
	footer {background:#241e17; color:#fff; font-size:15px; font-weight:300;}
	footer .footer_wrap {max-width:1200px; overflow:hidden; margin:0 auto; padding:50px 0;}
	footer .footer_wrap ul {float:left; padding:0 30px;}
	footer .footer_wrap ul li {line-height:2.2;}
	footer .footer_wrap ul li a {color:#fff;}
	footer .footer_wrap address {float:left; line-height:2.2; padding:0 30px;}
	footer .footer_wrap .familySite {float:right;  background:#fff;}
	footer .footer_wrap .familySite a {
		display:block; color:#fff; color:#000; font-size:14px; background-image:url(../images/common/plus.png);
		background-repeat:no-repeat; background-position:90% 50%; padding:15px 100px 15px 30px;
	}
	
	/* ********** 서브메뉴 ********** */
	section.titleBg {padding-top:110px; color:#fff; width:100%;}
	section.titleBg>div {max-width:1200px; margin:0 auto;}
	section.titleBg .subTitle {font-family:NanumRound; padding:70px 50px;}
	section.titleBg .subTitle h2 {font-weight:900; font-size:32px;}
	section.titleBg .subTitle p {font-weight:300; font-size:13px;}
	
	section.titleBg .subMenu {padding-bottom:30px;}
	section.titleBg .subMenu div {background:#fff; overflow:hidden;}
	section.titleBg .subMenu div>a {
		float:left; display:inline-block; background:#ffde00 url(../images/common/home_btn.png)no-repeat center;
		width:50px; height:50px; 
	}
	section.titleBg .subMenu ul {float:right;height:50px;}
	section.titleBg .subMenu ul li {float:left; padding:15px 20px;}
	section.titleBg .subMenu ul li.on {background:#000;}
	section.titleBg .subMenu ul li a {font-size:15px; font-weight:300; line-height:1;}
	section.titleBg .subMenu ul li.on a {color:#ffde00;}
	
	
	
	/* 배경 이미지 */
	section.titleBg.introduction {background:url(../images/intro/introduction_bg.jpg)no-repeat 0 110px;}
	section.titleBg.member {background:url(../images/member/member_bg.jpg)no-repeat 0 110px;}
	
	/* ********** 컨텐츠 ********** */
	.contents>div {max-width:1200px; margin:0 auto; overflow:hidden; padding:70px 0;}
	.contents>div h3 {font-size:28px; font-weight:700; color:#000; padding-bottom:50px;}
	
}

/* ******************** 태블릿 이하(~991) ******************** */
@media (max-width: 991px) {
	
	/* ********** 공용 ********** */
	.pc {display:none !important;}
	
	/* ********** 헤더 ********** */
	header {z-index:9999; position:absolute ;width:100%; height:60px !important; background:#fff; box-shadow:0 2px 2px rgba(0,0,0,.2);}
	header .headWrap {position:absolute; top:0; left:0; z-index:9; width:100%;}
	header .headWrap .wrap {margin:0 !important; display:block; text-align:center;}
	header .head h1 {display:inline-block; font-size:30px; font-family:NanumRound; font-weight:900; letter-spacing:-.5px; padding:15px 0;}
	header .head h1 a {color:#000;}
	header .head h1 span {display:block; font-size:13px; font-weight:300; line-height:2;}
	header .gnbView {
		position:absolute; top:0; left:0; display:block; height:60px; width:60px;
		border-right:1px solid rgba(255,255,255,.15); background:url(../images/common/icon_allmenu.png)no-repeat center; background-size:20px;
	}
	
	/* ********** gnb ********** */	
	nav.mobile {z-index:9999; position:fixed; visibility:hidden; left:0; top:0; width:100%; overflow:hidden; background-color:#fff;}
	nav.mobile .closeWrap {position:relative; height:60px; background-color:#582b02; color:#fff; border-bottom:1px solid rgba(255,255,255,.3); box-shadow:0 5px 5px rgba(0,0,0,.2);}
	nav.mobile .closeWrap .sideWrap {position:absolute; top:10px; right:10px;}
	nav.mobile .closeWrap a {color:#fff; padding:10px; display:inline-block; font-size:12px;}
	nav.mobile .closeWrap .gnbClose {
		position:relative; display:block; overflow:hidden; float:left; width:60px; height:60px; border-right:1px solid rgba(255,255,255,.2); 
		background:url(../images/common/icon_x.png)no-repeat center; background-size:20px;
	}
	.gnbCover {z-index:9998; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.5);}
	
	nav.mobile {width:80%;}
	nav.mobile .gnb {position:relative; width:100%; height:100%; overflow-y:auto; text-align:left !important;}
	nav.mobile .gnb * {width:100% !important;}
	
	nav.mobile .gnb>ul>li {float:right;}
	nav.mobile .gnb>ul>li>a {display:block; padding:20px; font-size:18px; color:#000; line-height:1; letter-spacing:-.5px; border-bottom:1px solid #f0f0f0; background:#fff; cursor:pointer;}
	nav.mobile .gnb>ul>li>a:hover {color:#ffde00;}
	nav.mobile .gnb>ul>li.on>a {color:#fff; background:#582b02; border-bottom:1px solid #582b02;}
	nav.mobile .gnb>ul>li>div {display:none;}
	nav.mobile .gnb>ul>li>div ul li a {
		display:block; padding:15px 20px 15px 40px; font-size:16px; color:#666; line-height:1.2; 
		border-bottom:1px solid #f5f5f5;
	}
	nav.mobile .gnb>ul>li div ul li a:before {display:block; content:""; width:3px; height:3px; background:#ccc; border-radius:50%; position:absolute; top:23px; left:30px;}
	nav.mobile .gnb>ul>li div ul li:last-child a {border-color:#e0e0e0;}
	nav.mobile .gnb>ul>li div ul li a:hover {color:#ffde00; background-color:#fff;}
	nav.mobile .gnb>ul>li div ul li.on a {color:#379f3d;}
	
	/* ********** 서브메뉴 ********** */
	section.titleBg {color:#fff; width:100%; background:#582b02; padding-top:60px;}
	section.titleBg>div {width:100%;}
	section.titleBg .subTitle {font-family:NanumRound; padding:10px 0; text-align:center;}
	section.titleBg .subTitle h2 {font-weight:900; font-size:27px;}
	section.titleBg .subTitle p {display:none; font-weight:300; font-size:13px;}
	
	
	/* ********** 하단 ********** */
	footer {background:#241e17; color:#fff; font-size:15px; font-weight:300;}
	footer .footer_wrap {width:100%; overflow:hidden; padding-bottom:20px;}
	footer .footer_wrap ul {width:100%; overflow:hidden; text-align:center; padding:20px 0;}
	footer .footer_wrap ul li {line-height:2.2; display:inline-block; padding:0px 30px;}
	footer .footer_wrap ul li a {color:#fff;}
	footer .footer_wrap .familySite {width:100%; background:#fff; border-top:1px solid #582b02;}
	footer .footer_wrap .familySite a {
		display:block; color:#fff; color:#000; font-size:14px; background-image:url(../images/common/plus.png);
		background-repeat:no-repeat; background-position:98%; padding:20px;
	}
	footer .footer_wrap address {width:100%; line-height:2.2; padding:0 30px; text-align:center;}
	
	/* ********** 컨텐츠 ********** */
	.contents > div {width:100%; padding:40px 20px;}
	.contents>div h3 {font-size:24px; font-weight:700; color:#000; padding-bottom:20px;}
}

/* ******************** 모바일 (~767) ******************** */
@media screen and (max-width: 767px) {
	
	/* ********** 하단 ********** */
	
	
}