@charset "utf-8";
/* *******************************************************
 * filename : layout.css
 * description : 전체 레이아웃 CSS
 * date : 2017-05-30
******************************************************** */

@import url("./font.css");	/* 나눔고딕 */ 
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

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

@media (max-width:360px){html{font-size:10px;}}
@media (min-width:361px) and (max-width:399px){html{font-size:11px;}}
@media (min-width:400px) and (max-width:439px){html{font-size:12px;}}
@media (min-width:440px) and (max-width:479px){html{font-size:13px;}}
@media (min-width:480px) and (max-width:519px){html{font-size:14px;}}
@media (min-width:520px) and (max-width:559px){html{font-size:15px;}}
@media (min-width:560px) and (max-width:599px){html{font-size:16px;}}
@media (min-width:600px) and (max-width:639px){html{font-size:17px;}}
@media (min-width:640px) and (max-width:679px){html{font-size:18px;}}
@media (min-width:680px) and (max-width:719px){html{font-size:19px;}}
@media (min-width:720px) and (max-width:767px){html{font-size:20px;}}
@media (min-width:768px) and (max-width:1023px){html{font-size:21px;}}
@media (min-width:1024px) and (max-width:1279px){html{font-size:22px;}}
@media (min-width:1280px) and (max-width:1579px){html{font-size:23px;}}
@media (min-width:1580px){html{font-size:24px;}}

body { background-color:#fff; }
#wrap {overflow:hidden; padding:0 60px; min-height:100%; position:relative; } /* min-width 홈페이지 컨텐츠 가로값에 맞게 변경 */
#wrap.sub-wrapper{padding-top:93px;}
/* ****************** 공통클래스 ********************** */
.area{ max-width:1558px; margin:0px auto;} /* width 홈페이지 컨텐츠 가로값에 맞게 변경 */
.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}
.text-ellipsis{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.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:initial; color:inherit;}
@media all and (max-width:1220px){
	#wrap{padding-left:30px; padding-right:30px}
}

@media all and (max-width:768px){
	#wrap, #wrap.sub-wrapper{padding-left:15px; padding-right:15px; padding-top:56px}
	
}

/* ****************** HEADER ********************** */
#header{/* position:fixed;  */position:absolute; top:0; left:0; width:100%; z-index:99 }
#headerInner{position:relative;  height:93px; margin:0 60px; background-color:#fff;}
#headerInner .logo{position:absolute; top:50%; left:100px; margin-top:-27px; z-index:9}
#headerMenu{position:relative; height:100%;}
/* Header :: gnb */
#gnb{text-align:right; margin-right:130px;}
#gnb > ul > li{position:relative; display:inline-block; margin-left:-3px;}
#gnb > ul > li:first-child{margin-left:0;}
#gnb > ul > li > a{
	position:relative; z-index:11; display:block; height:93px; color:#3f3f3f; font-size:20px; letter-spacing:-0.25px; line-height:93px; padding:0 48px; background-color:#fff; 
	-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 > a:hover, #gnb > ul > li.on > a{background-color:#b10418; color:#fff;}
#gnb > ul > li .gnb-2dep{
	position:absolute; top:93px; left:0px; width:100%; background-color:#b10418; text-align:left; visibility:hidden; opacity:0;filter:Alpha(opacity=0);
	-webkit-transform:translateY(-30px);
	-moz-transform:translateY(-30px);
	-o-transform:translateY(-30px);
	-ms-transform:translateY(-30px);
	transform:translateY(-30px);
	-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.active{
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0);
	-o-transform:translateY(0);
	-ms-transform:translateY(0);
	transform:translateY(0);
	visibility:visible;  
	opacity:1.0;
	filter:Alpha(opacity=100);
}
#gnb > ul > li:hover .gnb-2dep{
	opacity:1.0;filter:Alpha(opacity=100);
	transform:translateY(0);
}
#gnb > ul > li .gnb-2dep ul{padding:10px 10px 20px 10px}
#gnb > ul > li .gnb-2dep ul li{padding:6px 0px 6px 10px;}
#gnb > ul > li .gnb-2dep ul li a{ display:block;  color:#fff; font-size:14px;}
#gnb > ul > li .gnb-2dep ul li a:before{
	display:inline-block; content:""; width:0; height:2px; background-color:#fff; vertical-align:middle; margin:-2px 5px 0 0;
	-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:before{width:10px}

/*  HEADER :: GNB(M)  */
.nav-open-btn{
	position:absolute; top:50%; right:-20px; margin-top:-12px; z-index:9998; 
	opacity:0;filter:Alpha(opacity=0);
	visibility:hidden;
}
.nav-open-btn .line{
	display:block; width:30px; height:3px; background-color:#b10418; margin: 4px 0; 
	-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{/* margin-left:280px */ margin-top:-12px}
.nav-open-btn.active .line{background-color:#fff; width:30px}
.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(7px) rotate(45deg);
  -ms-transform: translateY(7px) rotate(45deg);
  -o-transform: translateY(7px) rotate(45deg);
  transform: translateY(7px) rotate(45deg);
}
.nav-open-btn.active .line:nth-child(3){
  -webkit-transform: translateY(-7px) rotate(-45deg);
  -ms-transform: translateY(-7px) rotate(-45deg);
  -o-transform: translateY(-7px) rotate(-45deg);
  transform: translateY(-7px) rotate(-45deg);
}
/* Header :: Gnb */
#gnbM{ 
	overflow-y:auto; position:fixed; top:0px; right:-80%; width:80%; height:100%;  max-width:280px; background-color:#b10418; z-index:999;
	/* gnb OPEN 속도 */
	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);
}
#gnbM.open{right:0px;}
#gnbM #navigation{margin-top:93px;}
#gnbM #navigation > li{border-bottom:1px solid rgba(255,255,255,0.5);}
#gnbM #navigation > li > a {position:relative; display:block; padding:15px; color:#fff; font-size:18px;  }
#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;}
#gnbM #navigation > li .gnb-2dep{display:none;background-color:#f2f2f2;}
#gnbM #navigation > li .gnb-2dep > li{border-top:1px solid #ddd;}
#gnbM #navigation > li .gnb-2dep > li > a{display:block; color:#333; font-size:15px; padding:15px 12%;}
#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep{display:none; padding:5px 17%; background-color:#aaa; border-top:1px dotted #ddd;}
#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a{display:block; padding:10px 0; font-size:13px; color:#fff;}
#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a:before{display:inline-block; content:"-"; margin-right:5px;}
.gnb-bg{display:none; 	position:fixed; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:0.6; filter:alpha(opacity=60); z-index:998;}

/* Header :: language */
.lang-select-menu{
	overflow:hidden; position:absolute; top:50%; right:0px; margin-top:-22px;
	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);
}
.lang-select-menu li{float:left; margin:0 7px; }
.lang-select-menu li a{
	display:block; width:44px; height:44px; line-height:44px; background-color:#c5c5c5; color:#fff; text-align:center; font-size:14px; letter-spacing:-0.5px;
	-webkit-border-radius:44px;-moz-border-radius:44px;-o-border-radius:44px;border-radius:44px; 
}
.lang-select-menu li.cur a{background-color:#4c4949;}
/* Header :: video button */
.to-video-btn{position:fixed; top:0; left:0; width:130px; height:130px; background-color:#b10418; color:#fff; z-index:999}
.to-video-btn img{display:block; position:absolute; top:30px; left:50%; margin-left:-18px;}
.to-video-btn span{position:absolute; top:75px; left:0px; width:100%; text-align:center; font-size:15px; line-height:20px; font-weight:500; letter-spacing:-0.25px;}
.to-video-btn.active{height:53px;}
.to-video-btn.active img{display:inline-block; top:10px; left:5px; margin-left:0; width:32px;}
.to-video-btn.active span{top:10px; left:15px; display:inline-block; font-size:13px; line-height:16px; vertical-align:middle; color:#fff;}

@media all and (max-width:1500px){
	#headerInner .logo{left:60px; /* margin-top:-20px */}
	#headerInner .logo img{height:42px; margin-top:5px;}
	/* Header :: gnb */
	#gnb{margin-right:80px}
	#gnb > ul > li > a{padding:0 35px; font-size:18px;}
	/* Header :: language */
	.lang-select-menu{margin-top:-16px;}
	.lang-select-menu li {margin:0px;}
	.lang-select-menu li:first-child{margin-right:5px;}
	.lang-select-menu li a{width:32px; height:32px; line-height:32px; font-size:12px;} 
	/* Header :: video button */
	.to-video-btn{width:94px; height:94px;}
	.to-video-btn img{top:12px;}
	.to-video-btn span{top:50px; font-size:13px; line-height:16px;}
	.to-video-btn.active span{display:none;}
	.to-video-btn.active img{left:30px}
}
@media all and (max-width:1220px){
	#header{position:fixed; border-bottom:1px solid transparent; background-color:#fff; z-index:999;}
	#header.fixed{border-bottom-color:#ddd;}
	#headerInner{margin:0 30px}
	#headerInner .logo{left:80px; }
	/* Header :: gnb */
	#gnb{display:none}
	/* Header :: gnbM */
	.nav-open-btn{
		right:0;
		opacity:1.0;filter:Alpha(opacity=100);
		visibility:visible;
		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);

	}
	/* Header :: language */
	.lang-select-menu{right:40px; margin-top:-13px;}
	.lang-select-menu li a{width:24px; height:24px; line-height:24px; font-size:10px;} 
	
	/* Header :: video button */
	.to-video-btn.active{height:94px;}
	.to-video-btn.active img{ top:30px; left:50%; margin-left:-18px;}
	.to-video-btn.active span{visibility:hidden}
}

@media all and (max-width:768px){
	#header{height:55px; }
	#headerInner{height:55px; margin:0px; padding:0 15px;}
	#headerInner .logo{left:15px; }
	#headerInner .logo img{height: 36px; margin-top: 8px}
	/* Header :: gnbM */
	.nav-open-btn{right:15px;}
	.nav-open-btn .line{width:24px; height:2px;}
	.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);
	}
	#gnbM #navigation{margin-top:56px;}
	#gnbM #navigation > li > a {font-size:16px;}
	#gnbM #navigation > li .gnb-2dep > li > a{font-size:13px;}
	/* Header :: language */
	.lang-select-menu{right:35px;}

	/* Header :: video button */
	.to-video-btn{left:-100px;}
}

/* ****************** FOOTER ********************** */
#footer{position:relative; padding:40px 0; padding-top: 50px; border-top: 1px solid #DEDEDE;}
/* Footer :: Sitemap */
#footerSitemapCon{float:left; width:40%; border-right:1px solid #d9d9d9;}
#footerSitemapCon > ul > li{float:left; width:29.33%; padding:0 2%;}
#footerSitemapCon .site-map-con{padding-top:20px;}
#footerSitemapCon .site-map-con:first-child{padding-top:0;}
#footerSitemapCon .site-map-con h3{padding-bottom:14px; color:#000; font-size:18.5px; letter-spacing:-0.3px;}
#footerSitemapCon .site-map-con:first-child h3{padding-bottom:30px;}
#footerSitemapCon .site-map-con ul li{padding-bottom:12px;}
#footerSitemapCon .site-map-con ul li a{color:#9e9e9e; font-size:14px; letter-spacing:-0.3px; }
/* Footer :: Right Info */
#footerInfoCon{float:left; padding-left:4%; font-size:14px; letter-spacing:-0.3px; line-height:24px; color:#545454;}
#footerInfoCon .footer-logo img{height:40px;}
#footerInfoCon dl{overflow:hidden; }
#footerInfoCon dl dt{ color:#000; font-weight:600;}
#footerInfoCon .footer-address{padding:11px 0;}
#footerInfoCon .footer-factory-info dt,#footerInfoCon .footer-factory-info dd {display:inline-block; vertical-align:middle;}
#footerInfoCon .footer-factory-info dt{margin-right:10px;}
#footerInfoCon address{display:block; padding-top:10px;}

#footer .footer-icon{position:absolute; top:50%; right:20px; margin-top:-77px}

/* Footer :: TOP버튼 */
.to-top-btn{
	position:fixed; bottom:-100px; right:15px; display:block; width:46px; height:46px; background-color:#b10418; text-align:center; line-height:46px; color:#fff;
	opacity:0;filter:Alpha(opacity=0);
	-webkit-transition:all 0.6s;-moz-transition:all 0.6s;-o-transition:all 0.6s;-ms-transition:all 0.6s;transition:all 0.6s
	-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;
}
.to-top-btn.fixed{bottom:15px; opacity:1.0;filter:Alpha(opacity=100);}
.to-top-btn i{line-height:inherit}
@media all and (max-width:1500px){
	/* Footer :: Sitemap */
	#footerSitemapCon .site-map-con h3{font-size:16px;}
	#footerSitemapCon .site-map-con ul li a{font-size:12px;}
	/* Footer :: Right Info */
	#footer .footer-icon {top:auto; bottom:30px; margin-top:0}
	#footer .footer-icon img{width:100px}
}
@media all and (max-width:1220px){
	#footerSitemapCon{display:none}
	#footerInfoCon{float:none; padding-left:0; font-size:13px;}

}
@media all and (max-width:768px){
	#footerInfoCon{font-size:12px;}
	#footerInfoCon dd{font-size:11px;}
	#footer .footer-icon{bottom:auto; top:40px; right:0px;}
	#footer .footer-icon img{width:50px}
}
/* ****************** SUB LAYOUT ********************** */
#content{padding:95px 0;}
/* Sub Layout :: Visual */
#visualBox{position:relative; width:100%; max-width:1763px; margin:0px auto; height:450px; }
#visualImg{overflow:hidden; width:100%; height:100%;}
#visual{
	width:100%; height:100%;
	-ms-transform: scale(1.1,1.1); /* IE 9 */
    -o-transform: scale(1.1,1.1); /* IE 9 */
    -moz-transform: scale(1.1,1.1); /* IE 9 */
    -webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
     transform: scale(1.1,1.1);
	-webkit-transition:transform 5000ms  ease-in-out ; /* Safari */
	-moz-transition:transform 5000ms ease-in-out ; /* Safari */
	-o-transition:transform 5000ms ease-in-out ; /* Safari */
	-ms-transition:transform 5000ms ease-in-out ; /* Safari */
    transition:transform 5000ms ease-in-out ;
}
/* active */
#visual.active{
	-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);; /* Chrome, Safari, Opera */
    transform: scale(1,1) rotate(0.02deg);;
}
#visualLocationCon{position:absolute; bottom:0px; left:0px; width:100%; height:68px; background:rgba(0,0,0,0.8);}
.location-home{width:68px; height:68px; position:absolute; top:0px; left:0px; text-align:center; line-height:76px; color:#858482;}
.location{margin-left:68px;}
.location > li{float:left; position:relative; border-right:1px solid rgba(255,255,255,0.2);}
.location > li:first-child{border-left:1px solid rgba(255,255,255,0.2);}
.location > li.dep2-menu{display:none;}
.location > li > strong{position:relative; display:block; width:270px; height:68px; line-height:68px; text-indent:30px; font-weight:400; font-size:16px; color:#fff; opacity:0.5;filter:Alpha(opacity=50); text-transform:capitalize; cursor:pointer;}
.location > li:first-child > strong{background-color:#950b1b; opacity:1.0;filter:Alpha(opacity=100);}
.location.has-dep2 > li:first-child > strong{background-color:transparent; opacity:0.5;filter:Alpha(opacity=50); }
.location.has-dep2 > li.dep2-menu > strong{background-color:#950b1b; opacity:1.0;filter:Alpha(opacity=100); }
.location > li > strong .icon{position:absolute; top:0px; right:20px; font-size:18px;}
.location > li .location-dep2{display:none; position:absolute; top:68px; left:0px; width:100%; padding:20px 0; background:#f0f0f0; z-index:99}
.location > li .location-dep2 li a{display:block; color:#9e9e9e; font-size:16px; letter-spacing:-0.25px; font-weight:400; padding:6px 30px;}
.location > li .location-dep2 li a:hover{color:#b10418;}
/* Sub Layout :: Contet Top Info */
#contentInfoCon{position:relative; height:126px; border-bottom:1px solid #dedede; width:100%; max-width:1763px; margin:0px auto; text-align:center;}
#contentInfoCon .content-tit{display:inline-block; height:125px; line-height:125px; padding:0 25px; border-bottom:2px solid #b10418; font-size:48px; letter-spacing:-0.3px; color:#4c4c4c; font-weight:400; text-transform:capitalize;}
.sub-page-btn{position:absolute; top:50%; margin-top:-31px; }
.sub-prev-page-btn{left:0px; background:url(/images/button/main_visual_prev_btn.jpg) no-repeat 50% 50%}
.sub-next-page-btn{right:0px; background:url(/images/button/main_visual_next_btn.jpg) no-repeat 50% 50%}
.sub-page-btn span{display:inline-block; width:60px; height:60px; text-align:center; line-height:60px; border:1px solid #525252; -webkit-border-radius:100em;-moz-border-radius:100em;-o-border-radius:100em;border-radius:100em;}
.green-content #contentInfoCon .content-tit{border-bottom-color:#478300}
.green-content .location > li.dep2-menu > strong{background-color:rgba(71, 131, 0, 0.8)}
.orange-content #contentInfoCon .content-tit{border-bottom-color:#fb7000}
.orange-content .location > li.dep2-menu > strong{background-color:rgba(251, 112, 0, 0.8)}
@media all and (max-width:1220px){
	/* Sub Layout :: Visual */
	#visualBox{
		height:320px; 
		-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s
	}
	#visual{background-size:cover !important;}
	#visualLocationCon{height:48px;}
	.location-home{width:48px; height:48px; line-height:56px;}
	.location{margin-left:48px;}
	.location > li > strong{height:48px; line-height:48px;}
	.location > li .location-dep2{top:48px; padding:10px 0;}
	.location > li .location-dep2 li a{font-size:14px; padding:4px 15px;}
	/* Sub Layout :: Contet Top Info */
	#contentInfoCon{height:90px;}
	#contentInfoCon .content-tit{height:89px; line-height: 89px; font-size:32px;}
	.sub-page-btn{margin-top:-21px;}
	.sub-page-btn span{width:42px; height:42px;}
}

@media all and (max-width:768px){
	#content{padding:40px 0;}
	/* Sub Layout :: Visual */
	#visualBox{height:150px;}
	#visualLocationCon{display:none}
	/* Sub Layout :: Contet Top Info */
	#contentInfoCon{height:60px;}
	#contentInfoCon .content-tit{height:59px; line-height: 59px; font-size:20px;}
	.sub-page-btn{margin-top:-15px; background-size:12px auto !important; background-position:50% 47%  }
	.sub-page-btn span{width:30px; height:30px; }
}
/* ****************** 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:1000px; margin:20px auto; background-color:#fff; }
.footer-modal-content h1{height:60px; line-height:67px; font-size:24px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#888; color:#fff;}
.modal-close-btn{position:absolute; top:11px; right:10px; color:#fff; font-size:38px;}
.modal-close-btn i{font-size:inherit}
.modal-close-btn i:hover {color:#fff}
/* 개인정보, 이용약관 등 */
.footer-inner-box{padding:5%; }
.footer-inner{padding:2%; height:400px; overflow-y:auto; overflow-x:hidden; border:1px solid #ddd; }
/* 사이트맵 */
.sitemap-wrapper{padding:5%;}
.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:14.2%;}
.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;}