@charset "utf-8";
/* *******************************************************
 * filename : layout.css
 * description : 전체 레이아웃 CSS
 * date : 2018-01-16
******************************************************** */

@import url("font.css");	/* 나눔고딕 */ 
@import url('../../innks/NanumSquareRound/master/nanumsquareround.min.css');
@font-face { font-family: 'GoyangDeogyang'; src: url('../../gh/projectnoonnu/noonfonts_one-1.0/GoyangDeogyang.woff') format('woff'); font-weight: normal; font-style: normal; }

/* layout */
body, table, th, td, button, select, input {
	font-family: 'NanumSquareRound', 'Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;
	font-size:13px;
	color:#666;
}

body { background-color:#fff; }
#wrap {overflow:hidden; width:100%; min-width:1220px; position:relative; } /* min-width 홈페이지 컨텐츠 가로값에 맞게 변경 */

.font-goyang {font-family: 'GoyangDeogyang';}

@media all and (max-width:800px){
	#wrap {min-width:320px;}
}

/* ****************** 공통클래스 ********************** */
.area{ max-width:1200px; margin:0px auto;} /* width 홈페이지 컨텐츠 가로값에 맞게 변경 */
.area-box{ max-width:1600px; margin:0px auto; }
.clearfix{*zoom:1;}
.clearfix:after{clear:both; display:block; content:"";}
.blind{overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
.trans200{-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;-ms-transition:all 0.2s;transition:all 0.2s}
.trans300{-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
.trans400{-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.trans500{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s}
.material-icons{line-height:inherit; color:inherit; vertical-align:middle;}
.text-ellipsis{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.table-layout{display:table; width:100%; height:100%; }
.table-cell-layout{display:table-cell; width:100%; height:100%; vertical-align:middle;}
.bold {font-weight: 600 ! important;}
.over-img{overflow:hidden;}
.over-img img{-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
a:hover .over-img img{
	-ms-transform: scale(1.1) rotate(0.02deg);
	  -o-transform: scale(1.1) rotate(0.02deg);
	  -moz-transform: scale(1.1) rotate(0.02deg);
	  -webkit-transform: scale(1.1) rotate(0.02deg);
	  transform: scale(1.1) rotate(0.02deg);
}
@media all and (max-width:1620px){
	.area-box{padding:0 15px;}
}
@media all and (max-width:1220px){
	.area{padding:0 5%;}
}
/* ****************** HEADER ********************** */
#header{position:absolute; width:100%; height:90px; -webkit-transition:top 0.4s;-moz-transition:top 0.4s;-o-transition:top 0.4s;-ms-transition:top 0.4s;transition:top 0.4s}
#headerInnerWrap{height:90px; width:100%; z-index:99; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
#headerInner{position:relative; height:90px; max-width:1200px; margin:0px auto; }
#header .logo{position:relative; z-index:100; float:left;}		/* padding값 적절히 바꿔주세요 */
#header .logo a{display:inline-block; width:186px; height:51px; background:url("../images/common/logo.png") no-repeat; margin-top: 15px;}



/* -------- Header :: UTIL BOX -------- */
.header-util-box{position:absolute; top:0; right:0;  z-index:100; width:90px; height:90px; border-left:1px solid rgba(255, 255, 255, 0.3); border-right:1px solid rgba(255, 255, 255, 0.3); text-align:center;}

.header-m-call {display:none;}

/* Header :: 사이트맵(기본형 or 커스텀) */
.sitemap-line-btn{width:32px; height:32px; margin-top: 30px;}
.sitemap-line-btn .line{display:block; width:28px; height:3px; background-color:#fff; margin: 5px auto;}


/* -------- Header :: GNB(PC) -------- */
.gnb-overlay-bg{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:97;}	/* gnb overlay BG */
#gnbBg{display:none; position:absolute; left:0; top:91px; width:100%; height:235px; background:#fff; z-index:98}	/* gnb 2depth BG */
#gnb{position:absolute; text-align:center; top:0; left:0px; width:100%; z-index:99; border-bottom:1px solid rgba(255, 255, 255, 0.3); height:90px;}
#gnb > ul{display:inline-block; *display:inline;*zoom:1; margin-left: 100px;}
#gnb > ul > li{position:relative; float:left; }
#gnb > ul > li > a{position:relative; z-index:100; display:block; height:90px; line-height:89px; padding:0 20px; text-align:center; color:#fff; font-size:19px; letter-spacing:-0.5px; font-weight:600; -webkit-transition:font-size 0.4s;-moz-transition:font-size 0.4s;-o-transition:font-size 0.4s;-ms-transition:font-size 0.4s;transition:font-size 0.4s }
#gnb > ul > li > a:hover, #gnb > ul > li.on > a{color:#fff;}
/* GNB :: 2차 전체메뉴 */
#gnb.total-menu > ul > li .gnb-2dep{
	display:none; 
	position:absolute; 
	top:90px; 
	left:0px; 
	z-index:99;
	width:100%; 
	text-align:left; 
}
#gnb.total-menu > ul > li:hover .gnb-2dep{}

#gnb > ul > li .gnb-2dep ul{padding:20px 0px;}
#gnb > ul > li .gnb-2dep ul li{position:relative;}
#gnb > ul > li .gnb-2dep ul li a{ display:block; text-align:center; color:#555555; font-size:14px; letter-spacing: -0.5px; line-height: 38px; -webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;-ms-transition:all 0.2s;transition:all 0.2s}
#gnb > ul > li .gnb-2dep ul li a:hover{}


/* header 마우스 오버시 스타일 적용 */
#header.over .logo a {background:url("../images/common/logo_on.png") no-repeat;}

#header.over .header-util-box {border-color:#ddd;}
#header.over .sitemap-line-btn .line {background-color:#553F28;}

#header.over #gnb {border-bottom: 1px solid #DDDDDD; background-color:#fff;} 
#header.over #gnb > ul > li > a {color:#333333;}


/* -------- Header :: GNB(Mobile) -------- */
.nav-open-btn{display:none;}
#gnbM{display:none}

@media all and ( max-width: 800px ){	
	/* Header :: 사이트맵 버튼 */
	.sitemap-line-btn, .sitemap-custom-btn{display:none;}

	.header-util-box {width:60px; height:60px;}

	.header-m-call {display:block; position:absolute; left:0; top:0; z-index:105; width:60px; height:60px; border-right:1px solid rgba(255, 255, 255, 0.3)}
	.header-m-call a {display:block; line-height: 60px; text-align:center; color:#fff; background-color: #FEC93B; height: 61px;}

	/* -------- Header :: GNB(Pc) -------- */
	#gnb{display:none;}
	.gnb-overlay-bg{display:none}

	/* -------- Header :: GNB(Mobile) -------- */
	.gnb-overlay-bg-m{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:101;}	
	#gnbM{ 
		display:block; 
		overflow-y:auto; 
		position:fixed; 
		top:0px; 
		right:-82%;
		width:80%; 
		height:100%;  
		max-width:280px; 
		background-color:#553F28; 
		z-index:999; 
		box-shadow:-2px 1px 11px rgba(0, 0, 0, .3);
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);		/* gnb OPEN 속도 */
		visibility:hidden;
	}
	#gnbM.open{
		right:0px; 
		visibility:visible;
	}
	#gnbM #navigation{margin-top:80px;}	/* Header 높이값 */
	/* GNB Mobile :: 1차 */
	#gnbM #navigation > li{border-bottom:1px solid rgba(255,255,255,0.2);}
	#gnbM #navigation > li > a {position:relative; display:block; padding:15px; color:#fff; font-size:17px;  }
	#gnbM #navigation > li.active > a{color:#fff;}
	#gnbM #navigation > li.has-2dep > a{}
	#gnbM #navigation > li.has-2dep.active > a{}
	#gnbM #navigation > li .gnb-icon{position:absolute; top:50%; right:10px; margin-top:-14px;}
	#gnbM #navigation > li .gnb-icon i{font-size:24px;}
	/* GNB Mobile :: 2차 */
	#gnbM #navigation > li .gnb-2dep{display:none; padding:15px 0; background-color:#fff}
	#gnbM #navigation > li .gnb-2dep > li{}
	#gnbM #navigation > li .gnb-2dep > li > a{display:block; color:#553F28; font-size:14px; padding:10px 15px; opacity:0.7;filter:Alpha(opacity=70);}
	#gnbM #navigation > li .gnb-2dep > li.on > a{opacity:1.0;filter:Alpha(opacity=100); text-decoration:underline;}
	/* GNB Mobile :: 3차 */
	#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep{display:none; padding:10px 20px; background-color:#aaa; box-shadow:inset 0px 3px 9px rgba(0, 0, 0, .3);}
	#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a{display:block; padding:8px 0; font-size:13px; color:#fff;}
	#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a:before{display:inline-block; content:"-"; margin-right:5px;}
	
	/* -------- Header :: 네비게이션 오픈 버튼 -------- */
	.nav-open-btn{
		display:block; position:fixed; top:0;  right:0; z-index:9998; 
		width:60px;
		height:60px;
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	}
	.nav-open-btn .line{
		display:block; width:28px; height:3px; background-color:#fff; border-radius:5px; margin: 3px auto;
		-webkit-transition: all 0.3s ease-in-out;
	  -o-transition: all 0.3s ease-in-out;
	  transition: all 0.3s ease-in-out;
	}
	.nav-open-btn.active .line{background-color:#fff;}
	.nav-open-btn.active .line:nth-child(2), .nav-open-btn.active .line:nth-child(4){opacity: 0;}
	.nav-open-btn.active .line:nth-child(1){
		 -webkit-transform: translateY(6px) rotate(45deg);
		  -ms-transform: translateY(6px) rotate(45deg);
		  -o-transform: translateY(6px) rotate(45deg);
		  transform: translateY(6px) rotate(45deg);
	}
	.nav-open-btn.active .line:nth-child(3){
		 -webkit-transform: translateY(-6px) rotate(-45deg);
		  -ms-transform: translateY(-6px) rotate(-45deg);
		  -o-transform: translateY(-6px) rotate(-45deg);
		  transform: translateY(-6px) rotate(-45deg);
	}
	
	#header.fixed-header .nav-open-btn .line{background-color:#fff}

	#header, #headerInnerWrap, #headerInner{height:60px;}
	#headerInnerWrap {position:fixed; width:100%; left:0; top:0; border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
	#header .logo{line-height: 60px; float:none; text-align:center; height:60px;}	/* padding값 적절히 바꿔주세요 */
	#header .logo a {width:130px; background-size:100% auto; margin-top: 10px;}
	#header .logo img{height:18px;}

	/* -------- Header :: UTIL BOX -------- */
	/* Header :: 검색버튼 */
	.header-search-box{margin-left:5px;}
	.header-search-inner{position:fixed; left:0; top:60px; width:calc(100% - 60px); padding:10px 45px 10px 15px; background-color:#444; text-align:left;}
	.header-search-inner .header-search-inner-box{-webkit-border-radius:15px;-moz-border-radius:15px; -o-border-radius:15px;border-radius:15px;}
	.header-search-inner .header-search-word{text-indent:10px}
	.header-search-inner .header-search-close-btn{top:50%; right:8px; margin-top:-16px; border:0; background:none;}
	/* Header :: 언어선택 */
	.header-lang{width:60px; margin-left:5px}
	.header-lang strong{display:none;}
	.header-lang > ul{border-color:#ccc;}
	.header-lang > ul > li > a{padding:0; text-align:center;}
	/* Header :: 사이트맵, 네비게이션 버튼 */
	.nav-open-btn{top:0; margin-top:0;}
	.nav-open-btn .line{width:20px; height:2px;}
	.nav-open-btn.active .line:nth-child(1){
		 -webkit-transform: translateY(5px) rotate(45deg);
		  -ms-transform: translateY(5px) rotate(45deg);
		  -o-transform: translateY(5px) rotate(45deg);
		  transform: translateY(5px) rotate(45deg);
	}
	.nav-open-btn.active .line:nth-child(3){
		 -webkit-transform: translateY(-5px) rotate(-45deg);
		  -ms-transform: translateY(-5px) rotate(-45deg);
		  -o-transform: translateY(-5px) rotate(-45deg);
		  transform: translateY(-5px) rotate(-45deg);
	}
	/* Header :: GNB(Mobile) */
	#gnbM #navigation{margin-top:60px}	/* Header 높이값 */
	#gnbM #navigation > li > a {font-size:15px;}
	#gnbM #navigation > li .gnb-2dep > li > a{font-size:13px;}


	/* HEADER 고정 */
	#header.fixed #headerInnerWrap {background-color:#fff; box-shadow:1px 1px 5px rgba(0, 0, 0, 0.1);}
	#header.fixed .logo a {background: url("../images/common/logo_on.png") no-repeat; background-size:100% auto;}
	
	#header.fixed .header-m-call {border-right:1px solid rgba(0, 0, 0, 0.1)}
	#header.fixed .header-m-call i {color:#333;}
	
	#header.fixed .header-util-box {border-left: 1px solid rgba(0, 0, 0, 0.1);}
	#header.fixed .nav-open-btn .line {background-color:#333;}

}

/* ****************** FOOTER ********************** */
#footer{padding:35px 0; background-color:#fff;}
#footerInner{position:relative; }
#footerTop{max-width:1200px; margin:0 auto; margin-bottom:30px; }

/* Footer :: TOP버튼 */
.to-top-btn{display:block; width:84px; height:38px; border-radius:3px; text-align:center; line-height:38px; z-index:99; border:1px solid #A5A5A5; font-size:14px; letter-spacing: -0.5px; color:#666666;}
.to-top-btn i {margin-left: 10px; font-size:13px;}

/* Footer :: 푸터로고 */
.foot-logo{float:left; padding-right:40px;}

/* Footer :: 푸터메뉴 */
.foot-menu{float:left; }
.foot-menu li{float:left; line-height:38px; margin-left: 30px;}
.foot-menu li:first-child {margin-left: 0;}
.foot-menu li a{font-size:15px; letter-spacing: -0.5px; color:#666666; border-bottom: 1px solid #999999; padding-bottom: 2px;}
.foot-menu li.privacy a {color:#222222; border-color:#222222;}

.footer-top {float:right;}

#footerBottom {position:relative;}

/* Footer :: 왼쪽정보 */
.family-address p{color:#666666; font-size:14px; line-height:22px; letter-spacing: -0.5px; padding-bottom:20px;}
.family-address span:before{display:inline-block; content:"|"; margin:0 10px;  color:#ccc} /* line 형태 */ 
.family-address span.first:before{display:none} 

.family-address .footer-caution-txt{color:#444444; font-size:14px; letter-spacing: -0.5px; padding-bottom: 5px;}
.family-address .copyright{font-size:14px; letter-spacing: -0.5px; color:#999999}

/* Footer :: 오른쪽정보  */
.footer-right-con{float:right;}

.footer-logo {position:absolute; right:0; bottom:15px;}


@media all and (max-width:800px){
	#footer {padding: 0;}

	.foot-menu {float:none; padding:0 5%; margin:0 -5%; border-bottom: 1px solid #ddd; border-top: 2px solid #553F28;}
	.foot-menu li {float:left; width:20%; text-align:center; margin-left: 0;}
	.foot-menu li a {display:block; font-size:12px; line-height: 14px; border-bottom: 0; text-align:center; text-align:center; padding:15px 0; border-left:1px solid #DDDDDD; word-break:keep-all;}
	.foot-menu li a span {display:block;}
	.foot-menu li:first-child a {border-left: 0;}
	.foot-menu li.short a {line-height: 28px;}

	.footer-top {float:none; text-align:center; margin-top: 15px;}
	.to-top-btn {display:inline-block; font-size:13px;}

	#footerBottom {text-align:center; }

	.family-address p {padding-bottom: 15px; font-size:11px; line-height: 17px;}
	.footer-logo {position:static; padding-bottom: 20px;}
	.footer-logo img {max-width:100px;}
	.family-address .footer-copy-wrap {padding:20px 5%; margin:0 -5%; background-color:#F4F4F4; padding-bottom: 150px;}
	.family-address .footer-caution-txt {font-size:11px; line-height: 17px;}
	.family-address .copyright {font-size:11px; line-height: 17px; margin-top: 10px;}
}

/* ****************** SUB LAYOUT ********************** */
/*  SUB LAYOUT :: 비주얼 */
#visual{width:100%; height:370px; position:relative; overflow:hidden;}
.visual-bg {position:absolute; width:100%; height:100%; left:0; top:0;-webkit-transition:transform 5000ms  ease-in-out ;
	-moz-transition:transform 5000ms ease-in-out ;
	-o-transition:transform 5000ms ease-in-out ;
	-ms-transition:transform 5000ms ease-in-out ;
    transition:transform 5000ms ease-in-out ;	-webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1);}
#visual .visual-txt-con{position:relative; text-align:center; height:100%; letter-spacing:-0.5px; color:#fff;}
#visual .visual-tit{opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -o-transform: translateY(-20px); transform: translateY(-20px); font-weight:600; font-size:46px; padding-top:210px; letter-spacing: -0.5px; -webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s;}

#visual.active .visual-bg  {-webkit-transform: scale(1.0); -moz-transform: scale(1.0); -ms-transform: scale(1.0); -o-transform: scale(1.0); transform: scale(1.0);}
#visual.active .visual-tit {opacity:1;filter:Alpha(opacity=100);-webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }

/*  SUB LAYOUT :: 이전페이지,다음페이지 버튼 */
.sub-page-controls-btn{position:absolute; top:50%; height:20px; margin-top:35px; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s;} /* margin-top:수정*/
.sub-page-controls-btn.sub-prev-page-btn{left:0; }
.sub-page-controls-btn.sub-next-page-btn{right:0; }
.sub-page-controls-btn .sub-page-name{vertical-align:middle; color:#fff; font-size:16px; font-weight:600; letter-spacing: -0.5px; opacity:0.8;filter:Alpha(opacity=80);}
.sub-page-controls-btn span{color:#fff; vertical-align:middle;}
.sub-page-controls-btn span i{margin-top:-2px; font-size:30px;}
.sub-page-controls-btn.sub-prev-page-btn .sub-page-name {margin-left: 5px;}
.sub-page-controls-btn.sub-next-page-btn .sub-page-name {margin-right:5px;}
.sub-page-controls-btn.sub-prev-page-btn:hover{margin-left:-10px}
.sub-page-controls-btn.sub-next-page-btn:hover{margin-right:-10px}

/*  SUB LAYOUT :: 서브메뉴(스타일1) */
#sideMenuM{display:none}
#sideMenu{width:100%;height:63px; border-top: 1px solid #ddd; border-bottom:1px solid #DDDDDD;}
#sideMenu .side-menu-inner{text-align:center;}
#sideMenu .side-menu-inner > ul{display:inline-block; *display:inline;*zoom:1;}
#sideMenu .side-menu-inner > ul > li{float:left; }
#sideMenu .side-menu-inner > ul > li > a{
	display:block; height:61px; line-height:61px; color:#4c3d2b; font-size:19px; letter-spacing:-0.5px; font-weight:400; width:196px; border-bottom:2px solid transparent;
	-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s;
}
#sideMenu .side-menu-inner > ul > li > a:hover, #sideMenu .side-menu-inner > ul > li.on > a{font-weight: 600; border-bottom-color:#4C3D2B;}

/*  SUB LAYOUT :: 서브메뉴(스타일2) */
#topMenuCon{border-bottom:1px solid #ddd}
#topMenu{display:block; position:relative; height:70px; }
#topMenu .location-to-home-btn{float:left; width:85px; height:70px; background-color:#fff; text-align:center; border-right:1px solid #ddd; border-left:1px solid #ddd;}
#topMenu .location-to-home-btn i{color:#797979; font-size:30px; line-height:70px;}
#topMenu .menu-location{position:relative; float:left; width:260px;}
#topMenu .menu-location > .cur-location{position:relative; display:block; height:70px; padding-left:10px; border-right:1px solid #ddd;}
#topMenu .menu-location.location1 > .cur-location{}
#topMenu .menu-location > .cur-location span{line-height:70px; color:#000; font-weight:400; font-size:18px; letter-spacing:-0.5px;}
#topMenu .menu-location > .cur-location .arrow{position:absolute; top:50%; right:10px; width:20px; height:20px;margin-top:-8px; font-size:20px;}
#topMenu .menu-location > .cur-location.open .arrow{transform:rotate(-180deg); margin-top:-10px;}
#topMenu .menu-location .location-menu-con{display:none; position:absolute; top:70px; left:-1px; width:calc(100% - 1px); border:1px solid #ddd; background-color:#fff; z-index:11; }
#topMenu .menu-location .location-menu-con li a{display:block; padding:10px; font-size:15px;}
#topMenu .menu-location .location-menu-con li.on{position:relative;}
#topMenu .menu-location .location-menu-con li.on a{padding-left:25px; color:#ff6100; font-weight:500;}
#topMenu .menu-location .location-menu-con li.on a:before{content:""; position:absolute; top:50%; left:10px; width:7px; height:3px; margin-top:-1px; background-color:#ff6100}
#topMenu .sub-link-btn{float:right; height:70px; line-height:70px; padding:0 20px; background-color:#ff6100; color:#fff; font-size:18px; letter-spacing:-0.5px;}

/*  SUB LAYOUT :: 컨텐츠 레이아웃 */
#content{padding:80px 0;}

@media all and (max-width:1220px){
	/*  SUB LAYOUT :: 서브메뉴(스타일2) */
	#topMenu{padding:0;}
	#topMenu .sub-link-btn{display:none;}
}

@media all and (max-width:800px){
	#content{padding:30px 5%;}

	/*  SUB LAYOUT :: 비주얼 */
	#visual{height:200px;}
	.visual-bg  {background-size:cover !important;}
	#visual .visual-tit{padding-top:120px; font-size:28px; padding-bottom:15px;}

	/*  SUB LAYOUT :: 이전페이지,다음페이지 버튼 */
	.sub-page-controls-btn {display:none}
	/*  SUB LAYOUT ::  서브메뉴(스타일1) */
	#sideMenu{display:none}
	#sideMenuM{display:block; position:relative; height:60px; border-bottom:1px solid #ddd;}

	#sideMenuM .menu-location{position:relative;}
	#sideMenuM .menu-location > .cur-location{position:relative; display:block; height:60px; text-align:center; background-color:#F6F6F6;}
	#sideMenuM .menu-location > .cur-location span{line-height:60px; color:#553f28; font-weight:600; font-size:14px; letter-spacing: -0.5px;}
	#sideMenuM .menu-location > .cur-location .arrow{position:absolute; top:50%; right:10px; width:35px; height:35px;margin-top:-16.5px; background-color:#4E3E2D; border-radius:50%; line-height: 35px; color:#fff;}
	#sideMenuM .menu-location > .cur-location .arrow i {font-size:20px;}
	#sideMenuM .menu-location .location-menu-con{display:none; position:absolute; top:60px; left:-1px; width:100%; border:1px solid #ddd; background-color:#fff; z-index:11; }
	#sideMenuM .menu-location .location-menu-con li a{display:block; padding:13px 10px; font-size:13px;}
	#sideMenuM .menu-location .location-menu-con li.on{position:relative;}
	#sideMenuM .menu-location .location-menu-con li.on a{padding-left:25px; color:#553F28; font-weight:500;}
	#sideMenuM .menu-location .location-menu-con li.on a:before{content:""; position:absolute; top:50%; left:10px; width:7px; height:3px; margin-top:-1px; background-color:#553F28}
}

/* ****************** MODAL LAYERPOPUP ********************** */
/* modal layer */
.modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:9999; background:#000; background:rgba(0,0,0,0.8);}
.modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.modal-inner-content{text-align:left;}
.loading {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 8px solid rgba(255,255,255,.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
/* modal layer content */
.footer-modal-content{position:relative; width:96%; max-width:1000px; margin:20px auto; background-color:#fff; }
.footer-modal-content h1{height:60px; line-height:60px; font-size:24px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#FEC93B; color:#fff;}
.modal-close-btn{position:absolute; top:11px; right:10px; color:#fff; }
.modal-close-btn i{font-size:38px;}
.modal-close-btn i:hover {color:#fff}
.footer-inner-box{padding:30px; }
.footer-inner{padding:20px; height:400px; overflow-y:auto; overflow-x:hidden; border:1px solid #ddd; }

/* 사이트맵 */
.sitemap-wrapper{padding:30px;}
.sitemap-wrapper > ul{overflow:hidden;}
.sitemap-wrapper > ul > li{float:left; width:20%; text-align:center;}	/* 메뉴 갯수에 맞게 %로 계산, 두줄로 들어갈 경우 height값 설정 */
.sitemap-wrapper.menu4 > ul > li{width:25%;}
.sitemap-wrapper.menu6 > ul > li{width:16.6%;}
.sitemap-wrapper.menu7 > ul > li{width:16.4%;}
.sitemap-wrapper > ul > li > h2{color:#191919; margin:0 2% 20px 2%; padding-bottom:20px; font-size:16px; border-bottom:1px solid #888; letter-spacing:-1.0px; margin-bottom:20px; font-weight:500;}
.sitemap-wrapper > ul > li .sitemap-2dep {padding:0 5%;}
.sitemap-wrapper > ul > li .sitemap-2dep a{display:block; padding:10px 0; color:#666; font-size:13px; font-weight:400; line-height:1.2em;}
.sitemap-wrapper > ul > li .sitemap-2dep a:hover{color:#000; text-decoration:underline;}

@media all and ( max-width: 800px ){
	/* modal layer content */
	.footer-modal-content h1{height:46px; line-height:46px; font-size:18px; text-align:left; padding:0 15px}
	.modal-close-btn i{font-size:24px}
	.footer-inner-box{padding:15px}
	.footer-inner{padding:10px; height:250px;}
	/* 사이트맵  */
	.sitemap-wrapper{padding:15px}
}


/* 오른쪽 퀵메뉴 */
#rightQuick {position:fixed; right:0; top:18%; z-index:92; -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; }
#rightQuick .right-quick-btn-wrap {float:left; width:33px; position:relative; height:540px;}
#rightQuick .right-quick-btn {position:absolute; cursor:pointer; right:-5px; bottom:0; width:33px; height:184px; background:url("../images/layout/side_arrow_bg.png") no-repeat;}
#rightQuick .right-quick-btn p {height:33px; width:60px;-webkit-transform: rotate(-90deg) translate(-60%, -50%);
-moz-transform: rotate(-90deg) translate(-60%, -50%);
-ms-transform: rotate(-90deg) translate(-60%, -50%);
-o-transform: rotate(-90deg) translate(-60%, -50%);
transform: rotate(-90deg) translate(-60%, -50%); text-align:right; position:relative; line-height: 33px; font-size:13px; font-weight: 600; color:#553f28;}
#rightQuick .right-quick-btn p::before {content:""; position:absolute; width:8px; height:4px; left:0; top:50%; margin-top: -2px; background:url("../images/layout/aside_arrow.png") no-repeat;}
#rightQuick .right-quick-btn .open {display:none;}
#rightQuick.active .right-quick-btn p::before {-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);}


#rightQuick ul {float:left; position:relative; z-index:5; box-shadow:3px 3px 16px rgba(0, 0, 0, 0.4); border-radius:10px 0 0 10px;}
#rightQuick ul li a {display:block; position:relative; width:100px; height:65px; background-color:#553F28; text-align:center; padding-top: 25px;}
#rightQuick ul li.request a {padding-top: 20px; height:80px; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s; }
#rightQuick ul li a::before {content:""; position:absolute; width:60px; height:1px; background-color:rgba(255, 255, 255, 0.2); top:0; left:50%; margin-left: -30px; }
#rightQuick ul li:first-child a::before {background-color:transparent;}
#rightQuick ul li a p {font-size:14px; line-height: 18px; letter-spacing: -0.5px; color:#fff; font-weight: 600; margin-top: 5px; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
#rightQuick ul li a i {color:#fff; font-size:26px; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
#rightQuick ul li:last-child a {border-radius:0 0 0 10px;}
#rightQuick ul li.call {background-color:#FEC93B; height:75px; padding-top: 15px; border-radius:10px 0 0 0; text-align:center;}
#rightQuick ul li.call p {font-size:19px; letter-spacing: -0.5px; color:#553f28; font-weight: 600; margin-top: 5px;}

#rightQuick ul li a:hover p , #rightQuick ul li a:hover i {color:#FEC93B;}

#rightQuick.active {right:-100px;}
#rightQuick.active .right-quick-btn .open {display:block;}
#rightQuick.active .right-quick-btn .close {display:none;}

@media all and (max-width:1320px){
	#rightQuick {display:none;}
}

/* 하단 퀵메뉴 */
#bottomQuick {height:76px; -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
#bottomQuick .bottom-quick-wrap {position:fixed; width:100%; left:0; bottom:-10px; opacity:0;filter:Alpha(opacity=0); visibility:hidden; z-index:90; -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; }
#bottomQuick .bottom-quick-btn p {position:relative; display:inline-block; width:68px; padding-left: 30px; height:34px; line-height: 34px; background:url("../images/layout/side_bottom_arrow.png") no-repeat; position:relative; z-index:5; font-size:13px; font-weight: 600; color:#553f28; cursor:pointer;}
#bottomQuick .bottom-quick-btn p::before {content:""; position:absolute; width:8px; height:4px; left:12px; top:50%; margin-top: -2px; background:url("../images/layout/aside_arrow.png") no-repeat;}

#bottomQuick .bottom-quick-btn .open {display:none;}

#bottomQuick .bottom-quick-bg {height:76px; background-color:#4E3E2D; box-shadow:0px 0px 24px rgba(0, 0, 0, 0.26);}
#bottomQuick .bottom-quick-info {width:1200px; margin:0 auto;}
#bottomQuick .bottom-quick-customer {float:left; position:relative;}
#bottomQuick .bottom-quick-customer p {font-size:18px; letter-spacing: 2px; color:rgba(255, 255, 255, 0.8); line-height: 74px;}
#bottomQuick .bottom-quick-customer p span {display:inline-block; margin-left: 20px; font-size:25px; color:#ffc52e; letter-spacing: -0.5px;}
#bottomQuick .bottom-quick-customer p.caption {position:absolute; width:100%; right:40px; bottom:0px; text-align:right; font-size:11px; line-height: 25px; letter-spacing: -0.5px; color:rgba(255, 255, 255, 0.7);}

#bottomQuick .bottom-quick-list {float:right; }
#bottomQuick .bottom-quick-list ul {float:left;}
#bottomQuick .bottom-quick-list ul li {position:relative; float:left; width:220px;}
#bottomQuick .bottom-quick-list ul li:first-child::after {content:""; position:absolute; width:1px; height:33px; background:rgba(255, 255, 255, 0.4); right:0; top:50%; margin-top: -16.5px;}
#bottomQuick .bottom-quick-list ul li a {position:relative; display:block; line-height: 74px; padding:0 25px; }
#bottomQuick .bottom-quick-list ul li a::after {content:""; position:absolute; width:12px; height:12px; background:url("../images/icon/ic_more.png") no-repeat; right:25px; top:50%; margin-top: -6px; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
#bottomQuick .bottom-quick-list ul li a img {display:inline-block; vertical-align: middle; margin-right:10px;}
#bottomQuick .bottom-quick-list ul li a p {display:inline-block; vertical-align: middle; font-size:16px; letter-spacing: -0.5px; color:rgba(255, 255, 255, 0.8); font-weight: 600;}

#bottomQuick .bottom-quick-list ul li a:hover::after {-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);}

#bottomQuick .bottom-quick-request {float:left; position:relative; overflow:hidden;}
#bottomQuick .bottom-quick-request a {display:block; width:285px; height:76px; line-height: 74px; text-align:center; font-size:20px; letter-spacing: -0.5px; color:#553f28; background-color:#FFC52E;}
#bottomQuick .bottom-quick-request a p {position:relative; z-index:10; }
#bottomQuick .bottom-quick-request a strong {font-weight: 600;}
#bottomQuick .bottom-quick-request img {margin-right:20px; }

/* 하단 이동했을 때 */
#bottomQuick.move .bottom-quick-wrap {opacity:1;filter:Alpha(opacity=100); visibility:visible; bottom:0;}

/* 하단 열렸을 때 */
#bottomQuick.active .bottom-quick-wrap {bottom:-76px;}
#bottomQuick.active .bottom-quick-btn .open {display:inline-block;}
#bottomQuick.active .bottom-quick-btn .close {display:none;}
#bottomQuick.active .bottom-quick-btn p::before {-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);}

/* 하단 아래에 도달했을 때 */
#bottomQuick.attach .bottom-quick-wrap {position:relative; }
#bottomQuick.attach .bottom-quick-inner {display:none;}

@media all and (max-width:800px){
	#bottomQuick {display:none;}
}



/* 전화기버튼 */
#callBtn {
  font-size: 30px !important;
  color: #553F28 !important;
}