@charset "utf-8";
/* *******************************************************
 * filename : layout.css
 * description : 전체 레이아웃 CSS
 * date :2018-02-28
******************************************************** */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-dynamic-subset.min.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');

:root{
	--main-color: #f57f20;
	--main-color2: #F36711;
	/* --area-width: 1200px;
	--area-box-width: 162rem;
	--area-wide-width: 172rem;
	--area-wrap-width: 1820px;
	--area-padding: 15px;*/
	--area-padding: 5vw;
	--header-top: 20px;
	--header-height: 70px;
	--custom-transiton1: all 0.4s cubic-bezier(.7, 0, .2, 1);
	--custom-transiton2: all 0.8s cubic-bezier(.7, .1, .2, 1);
	--custom-transiton3: all 0.6s cubic-bezier(.7, .1, .2, 1);
}

/* layout */
html{font-size: 10px;}
body, table, th, td, button, select {
	font-size:13px;
	color:#666;
	-webkit-text-size-adjust:none;
	font-family: 'Pretendard', 'Noto Sans KR', "돋움", Dotum, Arial, sans-serif;
}
body { background-color:#fff; }
#wrap{width:100%; min-width:320px; }

@media all and (max-width:1536px){
	html{font-size:0.6510vw;} /* 10 */
}
@media all and (max-width:1280px){
	html{font-size:0.8594vw;} /* 10 -> 11*/
}
@media all and (max-width:800px){
	html{font-size:1.375vw} /* 10 -> 11*/
}
@media all and (max-width:640px){
	html{font-size:1.7188vw}  /* 10 -> 11*/
}
@media all and ( max-width: 480px ){
	html{font-size:2.2vw}  /* 10 */
}
@media all and ( max-width: 412px ){
	html{font-size:2.4272vw}  /* 10 */
}
@media all and (max-width:390px){
	html{font-size:2.1795vw}  /* 10 -> 8.5 */
}

/* 공통클래스 */
.area,
.area-box,
.area-wrap,
.area-wide{margin:0px auto; padding:0 var(--area-padding); box-sizing: border-box;}
.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:inherit; color:inherit; vertical-align:middle;}

/* skip NAV */
.cm-accessibility a { position:absolute; text-align:center; width:200px; display:block; background:#c52227; color:#fff; left:-9999px; }
.cm-accessibility a:hover { z-index:999999; margin-left:-100px; left:50%; }
.cm-accessibility a:focus { z-index:999999; margin-left:-100px; left:50%; }
.cm-accessibility a:active { z-index:999999; margin-left:-100px; left:50%; }

/* ******************  Header ********************** */
#header{position:absolute; height:var(--header-height); top:var(--header-top); left:0; width:100%; z-index:9999; transition:height 0.3s, top 0.8s ease;}
#headerInnerWrap{position:absolute; top:0; left:0px; z-index:9999; width:100%; height:var(--header-height); transition:height 0.3s; box-sizing: border-box;}
#headerInnerWrap:before{position:absolute; top:0px; left:0px; width:100%; height:var(--header-height); content:"";/*  background-color: rgba(0, 0, 0, 0.5); */ background-color: rgba(255,255,255,0.8); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); opacity:0; transition: height 0.3s, opacity 0.3s;}
.sub-wrap #headerInnerWrap:before{background-color: rgba(255,255,255,0.8);}
#headerInner{position:relative; width: 100%; height:var(--header-height); display:flex; align-items:center; justify-content:space-between; box-sizing: border-box; transition:height 0.3s;}
#header .logo{position:relative; z-index:100; pointer-events: visible;}
#header .logo a{position: relative; display:block; height: 30px;}
#header .logo img{position: absolute; top: 0; left: 0; height: 100%; display:block; vertical-align:top; transition: opacity 0.3s;}
#header .logo .black-ver{opacity: 0;}
#header .logo .ori-ver{opacity: 1;}

/* -------- Header :: UTIL BOX -------- */
.header-util-box{position:relative; z-index:100; display:flex; align-items:center;}

/* .header-counsel {position:absolute; right:50px; top:19px; z-index:99;}
.header-counsel a {display:block; padding:5px 15px; background-color:#161616; font-size:13px; letter-spacing: -0.4px; color:#fff; font-weight: 600; border-radius:25px;}
.header-counsel a i {display:inline-block; font-size:22px; color:#F57F20; vertical-align: middle;} */

/* -------- Header :: 네비게이션 오픈 버튼 -------- */
.nav-open-btn-wrap{display: block; position:fixed; top:var(--header-top); right:var(--area-padding); z-index:10000;  transition: top 0.8s ease;}
.nav-open-btn{
	display:block;position: relative; 
	height:var(--header-height); transition: height 0.3s
}
.nav-open-btn .line{
	display:block; width:28px; height:3px; background-color:#fff; margin: 4px auto;
	transition:var(--custom-transiton1); 
}
.nav-open-btn.active .line,
#header.top-fixed .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){
	transform: translateY(7px) rotate(45deg);
}
.nav-open-btn.active .line:nth-child(3){
	transform: translateY(-7px) rotate(-45deg);
}

/* -------- Header ::  서브용 -------- */
.sub-wrap #container{padding-top: calc(var(--header-height) + var(--header-top));}
.sub-wrap #header .logo .ori-ver{opacity: 0;}
.sub-wrap #header .logo .black-ver{opacity: 1;}
.sub-wrap #header #gnb > ul > li > a{color: #000;}
.sub-wrap #header .header-sns-list li{color: #000;}
.sub-wrap #header .header-email-consult{border-color: #000; color: #000;}
.sub-wrap #header .nav-open-btn .line{background-color:#000;}
.sub-wrap #header .nav-open-btn.active .line, 
.sub-wrap #header.top-fixed .nav-open-btn.active .line{background-color: #fff;}

/* -------- Header :: Fixed -------- */
#header.top-fixed,
#header.top-fixed .nav-open-btn-wrap{position: fixed; top: 0;}
#header.top-fixed:before{opacity:1.0;}
#header.top-fixed #headerInnerWrap:before{height:var(--header-height); opacity: 1;}
#header.top-fixed .nav-open-btn,
#header.top-fixed #headerInner{height: var(--header-height);}
#header.top-fixed .logo .ori-ver{opacity: 0;}
#header.top-fixed .logo .black-ver{opacity: 1;}
#header.top-fixed .header-sns-list li{color: #000;}
#header.top-fixed .header-email-consult{border-color: #000; color: #000;}
#header.top-fixed .nav-open-btn .line{background-color:#000;}

/* -------- Header :: Gnb Mobile -------- */
.gnb-bg{display:none; 	position:absolute; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:0.6; filter:alpha(opacity=60); z-index:998;}
#gnbM{ 
	display:block; 
	overflow-y:auto; 
	position:fixed; 
	top:0px; 
	right:-100%; 
	width:100%; 
	height:100%;  
	background-color:#444; 
	z-index:9999; 
	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:20%;}	/* Header 높이값 */
/* GNB Mobile :: 1차 */
#gnbM #navigation > li{text-align:center; -webkit-transform: translateY(-5px);
-moz-transform: translateY(-5px);
-ms-transform: translateY(-5px);
-o-transform: translateY(-5px);
transform: translateY(-5px); opacity:0;filter:Alpha(opacity=0); -webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s;}
#gnbM #navigation > li > a {position:relative; display:block; padding:25px; color:#fff; font-size:24px;  font-weight: 800;}
#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.gnb01 {-webkit-transition-delay: 0.1s;
-moz-transition-delay: 0.1s;
-ms-transition-delay: 0.1s;
-o-transition-delay:0.1s ;
transition-delay: 0.1s;}
#gnbM #navigation > li.gnb02 {-webkit-transition-delay: 0.2s;
-moz-transition-delay: 0.2s ;
-ms-transition-delay:  0.2s;
-o-transition-delay: 0.2s ;
transition-delay:  0.2s;}
#gnbM #navigation > li.gnb03 {-webkit-transition-delay: 0.3s;
-moz-transition-delay: 0.3s;
-ms-transition-delay:0.3s ;
-o-transition-delay: 0.3s;
transition-delay: 0.3s;}
#gnbM #navigation > li.gnb04 {-webkit-transition-delay: 0.4s;
-moz-transition-delay: 0.4s;
-ms-transition-delay:0.4s ;
-o-transition-delay:0.4s ;
transition-delay: 0.4s;}
#gnbM #navigation > li.gnb05 {-webkit-transition-delay: 0.5s;
-moz-transition-delay: 0.5s;
-ms-transition-delay: 0.5s;
-o-transition-delay: 0.5s;
transition-delay: 0.5s;}

#gnbM.open #navigation > li {-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
-ms-transform: translateY(0px);
-o-transform: translateY(0px);
transform: translateY(0px); opacity:1.0;filter:Alpha(opacity=100);}

/* GNB Mobile :: 2차 */
#gnbM #navigation > li .gnb-2dep{display:none; padding:20px 0; background-color:#2f2f2f; box-shadow:inset 0px 3px 9px rgba(0, 0, 0, .3);}
#gnbM #navigation > li .gnb-2dep > li{}
#gnbM #navigation > li .gnb-2dep > li > a{display:block; color:#fff; font-size:18px; padding:15px; opacity:0.7;filter:Alpha(opacity=70);}
#gnbM #navigation > li .gnb-2dep > li.active > a{opacity:1.0;filter:Alpha(opacity=100); color:#F67F21; font-weight: 800;}
/* 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;}

@media all and (max-width:480px){
	#gnbM #navigation > li > a {font-size:16px; padding:15px;}

	#gnbM #navigation > li .gnb-2dep {padding:15px 0;}
	#gnbM #navigation > li .gnb-2dep > li > a {padding:10px 15px; font-size:14px;}
}

.gnb-custom {text-align:center; margin-top: 30px;}
.gnb-call {display:inline-block; padding:5px 15px; background-color:#fff; border-radius:25px; margin-bottom: 10px; height:22px;}
.gnb-call i {color:#f58226; font-size:22px; margin-right:10px;}
.gnb-call span {font-size:15px; line-height: 22px; color:#f58226; font-weight: 500; letter-spacing: -0.25px;}

.gnb-request {display:inline-block; padding:7px 15px; background-color:#000;  border-radius:25px; margin-left: 10px; height:22px;}
.gnb-request i {color:#fff; font-size:22px; margin-right:10px;}
.gnb-request span {font-size:15px; line-height: 22px; color:#fff; font-weight: 500;}

.gnb-insta{display: inline-block; padding:5px 15px; margin-bottom:10px; }
.gnb-insta a{font-size:20px; color:#fff;}


/* gnb 닫기버튼이 메뉴와 같이 움직일경우에만 주석 해제 */
/* .nav-open-btn.active{right:82%; }
#gnb{max-width:none;} */

/* ****************** FOOTER ********************** */
/* -------- FOOTER :: Cover -------- */
.footer-round-cover{
	width:100%; 
	position:absolute; 
	top:100%; 
	left:0; 
	height:15vw; height: 6vw;
	overflow:hidden;
}
.round-cover {
   position: absolute;
   width: 150%;
   background: #fff;
   height: 750%;
   left: 50%;
   border-radius: 50%;
   transform: translate(-50%, -86.666%);
   z-index: 1;
}

/* -------- FOOTER :: 레이아웃 -------- */
#footer{position:relative; background-color:#000; overflow: hidden;}
#footerInner {position: relative; z-index: 1; }
#footer .footer-cover{
	position:absolute; top:0px; left:0px; right:0; height:10vw; 
	background: linear-gradient(to bottom,hsla(225, 7%, 12%) 0%, hsla(225, 7%, 12%, 0.987) 8.1%, hsla(225, 7%, 12%, 0.951) 15.5%, hsla(225, 7%, 12%, 0.896) 22.5%, hsla(225, 7%, 12%, 0.825) 29%, hsla(225, 7%, 12%, 0.741) 35.3%,  hsla(225, 7%, 12%, 0.648) 41.2%,  hsla(225, 7%, 12%, 0.55) 47.1%, hsla(225, 7%, 12%, 0.45) 52.9%, hsla(225, 7%, 12%, 0.352) 58.8%, hsla(225, 7%, 12%, 0.259) 64.7%, hsla(225, 7%, 12%, 0.175) 71%, hsla(225, 7%, 12%, 0.104) 77.5%, hsla(225, 7%, 12%, 0.049) 84.5%, hsla(225, 7%, 12%, 0.013) 91.9%, hsla(225, 7%, 12%, 0) 100%)
}

/* Footer :: 로고 영상 영역 */
.footer-logo-video {position: absolute; top: 0; right: 0; width: 100%; height: 100%;}
.footer-logo-video .video-box {position: relative; width: 100%; height: 100%;}
.footer-logo-video .video-box video {position: absolute; top: -40%; left:28%; width: 100%; transform: scale(1.15,1.15); pointer-events:none; opacity: 0.2;}


/* Footer :: TOP버튼 */
.to-top-btn{
	position:fixed; bottom:5rem; bottom: 2rem; right:var(--area-padding); display:block; z-index:99;
	box-sizing:border-box; opacity: 0; visibility: hidden;
	-webkit-transition:all 0.6s;
}
.to-top-btn i{display:inline-block; font-size:16px; line-height:46px; color:#fff; transition:all 0.3s}
.to-top-btn.black-ver i{color: #000;}
.to-top-btn:hover i{transform:translateY(-3px)}
.to-top-btn.fixed{opacity: 1; visibility: visible;}

/* -------- FOOTER :: 상단 -------- */
#footerTop .footer-top-inner{display:block; padding:11.5rem 0 5.5rem; border-bottom:1px solid #434241; text-align: center;}
.footer-slogan-txt{color:#fff; font-size:3.5rem; letter-spacing:-0.065em; font-weight:600; line-height:1.4;}
.footer-consulting-con{padding-top:15px;}
.footer-consulting-con .to-footer-consulting-btn{display:block; color:#fff; }
.footer-consulting-con .to-footer-consulting-btn .txt{font-size:5rem; letter-spacing:-0.008em; font-weight:700;}
.footer-consulting-con .to-footer-consulting-btn .icon{font-size:3.0rem; font-weight:700; margin-left:0.6em}

/* -------- FOOTER :: 하단 -------- */
.footer-bottom-inner{display:block; padding:5.5rem 0;}
.footer-bottom-inner .footer-left-con{display:block; text-align: center;}
.footer-bottom-inner .footer-right-con{margin-top: 5rem; display:flex; justify-content: center;}
/* Footer :: 푸터로고 */
.foot-logo{margin-right:0; display: flex; align-items: center; justify-content: center;}
.foot-name-group{margin-left: 2rem;}
.foot-logo .foot-kr-name{position:relative; display:block; color:#fff; font-size:1.45rem; font-weight:500; letter-spacing:-0.005em; margin: 0 0 0.8rem;}
.foot-logo .foot-kr-name:before{position:absolute; top:-1.9rem; left:0; width:1.3rem; height:2px; opacity:0.2; background-color:#fff; content:""; display: none;}
.foot-logo .foot-en-name{color:rgba(255, 255, 255, 0.56); font-size:1.25rem; font-weight:500;}
/* Footer :: 정보 */
.footer-address-box{display:block; margin-top:2.5rem}
.footer-address-box .footer-address-txt:first-child{margin-right:0;}
.footer-address-box .footer-address-txt p{color:rgba(255,255,255,0.56); font-size:1.45rem; line-height:1.72; font-weight:500;}
.footer-address-box .footer-address-txt:first-child p{letter-spacing:-0.005em;}
.footer-address-box .footer-address-txt .margin-top{margin-top:1.72em}
.footer-address-box .footer-address-txt .copyright{color:rgba(255, 255, 255, 0.29); margin-top:1.55em}
.footer-address-box a{color:inherit}
.footer-address-box a:hover{color:#fff; transition:all 0.3s;}
/* Footer :: 우측메뉴 */
.footer-menu-con{width:16rem; padding:3rem 1.8rem 1.8rem; margin-left:1rem; box-sizing:border-box; background-color:#161616;}
.footer-menu-con:first-child{margin-left:0;}
.footer-menu-con li{text-align:right; font-size:1.4rem; line-height:1.72; letter-spacing:-0.031em;}
.footer-menu-con li a{position:relative; color:rgba(255,255,255,0.56); transition:all 0.3s}
.footer-menu-con li a:after{position:absolute; bottom:-2px; left:0px; width:100%; height:2px; background-color:#fff; content:""; transform:scaleX(0); transition:transform 0.3s ease; transform-origin:100% 0;}
.footer-menu-con li:first-child{margin-bottom:3.07em; font-weight:500;}
.footer-menu-con li.project a{color:#fff;}
.footer-menu-con li.privacy a{color:var(--main-color); }
.footer-menu-con li.privacy a:after{background-color:var(--main-color);}
@media (hover: hover) {
	.footer-menu-con li:not(.privacy) a:hover{color:#fff;}
	.footer-menu-con li a:hover:after{transform:scaleX(1); transform-origin:0% 0%;}
}

/* ******************  서브 레이아웃 ********************** */
/* -------- Sub Layout :: 비주얼 -------- */
#visual{width:100%; height:150px; background:url(/images/layout/sub_visual_bg.jpg) no-repeat 50% 50%; background-size:cover; position:relative;}
#visual .visual-info-con{display:table; width:100%; height:100%; text-align:center; }
#visual .visual-info-con-inner{display:table-cell; vertical-align:middle; }
#visual .visual-info-con .visual-tit{color:#f57f20; font-size:28px; font-weight:600;}
#visual .visual-info-con .visual-txt{color:#fff; font-size:12px; padding:10px 5% 0 5%; line-height:14px; word-break:keep-all;}

#visual .visual-info-con .sub-arrow {position:absolute; top:50%; margin-top: -6.5px; z-index:10;}
#visual .visual-info-con .sub-prev {left:10px;}
#visual .visual-info-con .sub-next {right:10px;}

@media all and (max-width:480px){
	
}

/* -------- Sub Layout :: 상단 메뉴 (1차,2차) -------- */
#subMenuCon{position:relative; height:40px; border-bottom:1px solid #ddd; padding-left:40px; }
#subMenuCon .location-to-home-btn{position:absolute; width:39px; height:40px; left:0px; top:0px; background-color:#fff; text-align:center; border-right:1px solid #ddd;}
#subMenuCon .location-to-home-btn i{color:#797979; font-size:20px; line-height:40px;}
#subMenuCon .menu-location{position:relative; float:left; width:50%;}
#subMenuCon .menu-location > .cur-location{position:relative; display:block; height:40px; padding-left:10px; }
#subMenuCon .menu-location.location1 > .cur-location{border-right:1px solid #ddd;}
#subMenuCon .menu-location > .cur-location span{line-height:40px; color:#555; font-weight:600; font-size:14px;}
#subMenuCon .menu-location > .cur-location .arrow{position:absolute; top:50%; right:10px; width:20px; height:20px;margin-top:-8px; font-size:20px;}
#subMenuCon .menu-location > .cur-location.open .arrow{transform:rotate(-180deg); margin-top:-10px;}
#subMenuCon .menu-location .location-menu-con{display:none; position:absolute; top:40px; left:-1px; width:calc(100% - 1px); border:1px solid #ddd; background-color:#fff; z-index:11; }
#subMenuCon .menu-location .location-menu-con li a{display:block; padding:10px; font-size:13px;}
#subMenuCon .menu-location .location-menu-con li.active{position:relative;}
#subMenuCon .menu-location .location-menu-con li.active a{padding-left:25px; color:#f68326; font-weight:500;}
#subMenuCon .menu-location .location-menu-con li.active a:before{content:""; position:absolute; top:50%; left:10px; width:7px; height:3px; margin-top:-1px; background-color:#f68326}

/* -------- Sub Layout :: 상단 메뉴 (2차만) -------- */
#topMenuBar {position:relative; }
#topMenuBar .depth1-tit{overflow:hidden; width:100%;}
#topMenuBar .depth1-tit a{position:relative; display:block; height:40px; color:#fff;  background-color:#333; padding:0 15px;}
#topMenuBar .depth1-tit a span{line-height:40px; font-size:14px; }
#topMenuBar .depth1-tit a .arrow{position:absolute; top:50%; right:7px; margin-top:-12px;}
#topMenuBar .depth1-tit a.open .arrow{transform:rotate(-180deg); margin-top:-14px;}
#topMenuBar .top-menu-list{display:none; width:100%; position:absolute; top:40px; left:0px; z-index:99}
#topMenuBar .top-menu-list li{width:100%; }
#topMenuBar .top-menu-list li a{display:block; height:40px; line-height:40px; padding:0 15px; font-size:13px; border-bottom:1px solid rgba(0,0,0,0.2); background-color:#fff; color:#333; }
#topMenuBar .top-menu-list li.active{position:relative;}
#topMenuBar .top-menu-list li.active a{padding-left:25px; color:#f68326; font-weight:500;}
#topMenuBar .top-menu-list li.active a:before{content:""; position:absolute; top:50%; left:10px; width:7px; height:3px; margin-top:-1px; background-color:#f68326}

/* -------- Sub Layout :: 컨텐츠레이아웃 -------- */
#content{padding:15px;}


/* ****************** 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%; margin:20px auto; background-color:#fff;  }
.footer-modal-content h1{height:40px; line-height:37px; font-size:18px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#888; color:#fff;}
.modal-close-btn{position:absolute; top:-30px; right:0px; color:#fff; font-size:30px;}
.modal-close-btn i{font-size:inherit}
.modal-close-btn i:hover {color:#fff}
/* 개인정보, 이용약관 등 */
.footer-inner-box{padding:3%; }
.footer-inner{padding:2%; height:350px; 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;}


/* ******************  모바일 전용 레이어 인트로 팝업 ********************** */
.mobile-fixed-pop-wrapper{overflow-y:auto; position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:999999; opacity:1.0;filter:Alpha(opacity=100);}
.mobile-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center; background:rgba(0,0,0,0.75); }
.mobile-fixed-pop-inner-box{ position:relative; display:table-cell; vertical-align:middle; top:0px;}
.mobile-fixed-img-con{display:inline-block; min-width:250px; max-width:92%; margin:4% auto; }
.mobile-popup-img{display:block;}
.mobile-popup-img img{max-width:100%; max-height:100%;}
.mobile-popup-btn-controls{overflow:hidden; text-align:center; background-color:#f2f2f2; border-top:1px solid #f2f2f2;}
.mobile-popup-btn-controls button{float:left; border:0; padding:0; margin:0px; background:none; width:50%; height:50px; background-color:#fff; font-size:14px; color:#333; cursor:pointer;}
.mobile-popup-btn-controls .today-close-btn{background-color:#eee;}