.wrapper {position:relative; max-width:1200px; margin:0 auto;}

/* header */
#header{z-index:999; position:absolute; width:100%; height:90px; background:#fff; transition:0.3s}
#header h1{position:absolute; left:50px; top:16px;}
#header h1 a{display:block;}

#header .gnb_wrap {position:relative; max-width:1200px; height:100%; margin: 0 auto; text-align:center;}
#header .gnb {display:inline-block;}
#header .gnb > li{position: relative; display:inline-block;}
#header .gnb > li > a{display:block; line-height:90px; padding:0 70px; color:#222; font-size:20px; font-weight:400;}
#header .gnb > li > .sub_menu{display:none; position:absolute; left:0; top:80px; width:100% !important; padding:5px 20px; box-sizing:border-box; border-radius:15px; background:#222; z-index:99;}
#header .gnb li:hover .sub_menu{display:block; top:80px; width:100%; animation: submenu 0.3s 1 linear;}
#header .gnb .sub_menu{animation: submenu 0.3s 1 linear; transition: ease all .2s;}
#header .gnb .sub_menu li a{display: block; padding:14px 0; color:#fff; border-top:1px solid rgba(255, 255, 255, .3); font-size:14px; text-align:center; transition:0.4s;}
#header .gnb .sub_menu li a:hover{color:#3fcbff;}
#header .gnb .sub_menu li:first-child a{border-top:0;}

#header .area_util{position:absolute; right:0; top:25px;}
#header .area_util span{display:inline-block; width:40px; height:40px; margin-right:6px; background:#111; background-size:15px; border-radius:50%; }
#header .area_util div{display:inline-block; color:#fff;}
#header .area_util div a{color:#fff; font-weight:bold; font-size:20px;}

#main #header {border-bottom:1px solid rgba(255, 255, 255, .5); background:none}
#main #footer {position:absolute; left:0; bottom:0; width:100%; font-size:12px; font-weight:300; padding:50px; opacity:.4; background:none}
#main #footer address {display:inline-block; float:left}
#main #footer address p {float:left; display:inline-block; padding:0; margin-right:20px; color:#222; opacity:.7}
#main #footer address p span {font-weight:500; padding-right:10px; }
#main #footer address p span.eng {font-weight:600}
#main #footer > p {float:right; display:inline-block; margin-top:25px; color:#222; opacity:.7}

#footer {padding:50px 0; text-align:center; background:#21282e; z-index:99}
#footer address p {display:inline-block; padding:0 5px; color:#fff; font-size:14px; font-weight:300; opacity:.5;}
#footer address p span {font-weight:500; padding-right:5px}
#footer p.copy {display:block; font-size:14px; margin-top:15px; color:#fff; opacity:1;}
#footer .btn_top {position:absolute; right:0; top:0; display:block; width:60px; height:60px; padding-top:15px; font-size:12px; font-weight:500; color:#fff; text-transform:uppercase; border-radius:100%; background: #1c1f22;}
#footer .btn_top i {display:block; line-height:1;}




/* pc-menu */
aside.pc {position:absolute; right:50px; top:0; height:100%;} 
aside.pc .lang {position:absolute; right:60px; top:0; width:100px; text-transform:uppercase;}
aside.pc .lang .on_text {display:inline-block; width:100%; margin-top:30px; padding:10px 20px; padding-right:40px; line-height:1; border-radius:30px; border:1px solid #222; color:#222; font-size:14px; font-weight:400; background:url(../images/common/down_arrow.png) no-repeat right 15px center; cursor:pointer}
aside.pc .lang:hover ul {display:block}
aside.pc .lang ul {display:none; width:100%; margin-top:5px; padding:5px 0; border-radius:15px; background:#222;}
aside.pc .lang ul li {border-bottom:1px solid rgba(255, 255, 255, .3)}
aside.pc .lang ul li:last-child {border-bottom:none}
aside.pc .lang ul li a {display:block; width:100%; padding:7px 20px; padding-left:50px; font-size:13px; font-weight:500; color:#fff;}
aside.pc .lang ul li:nth-child(1) a {background:url(../images/common/lang_ko.jpg) no-repeat left 20px center;}
aside.pc .lang ul li:nth-child(2) a {background:url(../images/common/lang_eng.jpg) no-repeat left 20px center;}

.aside_menu {position:absolute; z-index:90; width:30px; right:0px; top:50%; margin-top:-15px}
.aside_menu span{display:block; width:30px; height:2px; background:#222; text-align:center;}
.aside_menu span:nth-child(1){margin-top:7px; width:20px;}
.aside_menu span:nth-child(2){margin-top:7px;}
.aside_menu span:nth-child(3){margin-top:7px; width:20px}



/* mobile-menu */
.mobile_header{}
.btn_menu{position:absolute; z-index:90; width:30px; right:20px; top:13px;}
.btn_menu{display:none;}
.btn_menu span{display:block; width:30px; height:2px; background:#333; text-align:center;}
.btn_menu span:nth-child(1){width:20px; margin-top:14px;}
.btn_menu span:nth-child(2){margin-top:7px;}
.btn_menu span:nth-child(3){width:20px; margin-top:7px;}

.menu_top p{margin-top:10px; color:#949494;}
#header .m_gnb_top h1{float:none; padding:20px; }
.m_area_util{margin-top:40px;overflow:hidden;  padding:20px; box-sizing:border-box; background:#4c4c4c;}
.m_area_util a{display:inline-block; width: 49%; height:31px; box-sizing: border-box; padding:5px 0; margin:2px 0px; border:1px solid #fff; vertical-align:middle; color:#fff; text-align:center; font-size:14px;}
.m_gnb{overflow-y:auto; position:fixed; top:0px; right:-100%; width:280px; height:100%; background:#fff; transition:all 0.5s ease-out 0s;z-index:999;}
.m_gnb > ul > li > a{display:block; position:relative; padding:15px 25px; border-bottom: 1px solid #eaeaea; color:#222; transition:all 0.3s ease 0s;}
.m_gnb > ul > li > a.open:before{content:''; display:block; position:absolute; top:25px; right:10px; width:11px; height:7px; background:url(../images/main/menu_button.png) no-repeat 50% 0; transition:all 0.4s ease 0s; background-size:100%;}
.m_gnb > ul > li > a.active {}
.m_gnb > ul > li > a.active:before{transform:rotate(180deg);}
.m_gnb > ul > li > ul{display:none; background:#efefef; }
.m_gnb > ul > li > ul > li{border-bottom:1px solid #dedede;}
.m_gnb > ul > li > ul > li > a{position:relative; display:block; padding:20px 25px; font-size:14px; color:#333; }

.m_gnb .btn_close{opacity: 0; display: block; position:absolute; top:25px; right:-100%; width:24px; height:23px; font-size:0px; transition:0.8s;}
.m_gnb.active{right:0px;}
.m_gnb.active .btn_close{opacity:1; right:20px;}
.m_gnb_top{box-sizing:border-box; background:#00469b;}
.m_gnb_top p{background:#ddd;}
.m_gnb > ul{}
.m_gnb .btn_close:before{content: ''; display:block; position:absolute; top:9px; left:0px;  width:100%; height:2px; background:#222; transform:rotate(45deg);}
.m_gnb .btn_close:after{content: ''; display:block; position:absolute; top:9px; left:0px; width:100%; height:2px; background:#222; bottom: 9px; transform:rotate(-45deg);}


.m_lang {margin-top:70px; padding:15px 25px; background:#f5f5f5; border-top:1px solid #eaeaea; border-bottom:1px solid #eaeaea}
.m_lang ul:after {clear:both; content:''; display:block;}
.m_lang ul li {display:inline-block; float:left;}
.m_lang ul li+li {margin-left:10px}
.m_lang ul li a {display:inline-block; padding:5px 15px; text-transform:uppercase; font-size:12px; font-weight:500; color:#222; line-height:1; border-radius:30px; border:1px solid #222}
.m_lang ul li.on a {color:#004182; background:#fff; border:1px solid #004182}


.area_util_m{padding:20px 20px; margin-top:100px; background:#598e35;}
.area_util_m span{display:inline-block; width:40px; height:40px; margin-right:6px; background:#111 url(../images/main/icon_call.svg) no-repeat 50%; background-size:15px; border-radius:50%; }
.area_util_m div{display:inline-block; color:#fff;}
.area_util_m div a{color:#fff; font-weight:bold; font-size:17px;}

.cover{position: fixed; width: 100%; height:100%; left:0; top:0; background:rgba(0, 0, 0, 0.8); z-index:995; display:none;}
.cover.active{display:block;}




/* all menu */
#all_gnb {display:none; position:absolute; left:0; top:0; width:100%; background:#fff; z-index:999}
#all_gnb .btn_close {position:absolute; display:block; right:52px; top:32px; width:30px; height:30px; overflow:hidden; cursor:pointer; z-index:9999}
#all_gnb .btn_close span {position:absolute; top:14px; width:100%; height:2px; background:#222; transform:rotate(45deg)}
#all_gnb .btn_close span:last-child {transform:rotate(-45deg)}
#all_gnb nav {max-width:1200px; height:100%; margin:0 auto;}
#all_gnb nav:after {clear:both; content:''; display:block;}
#all_gnb nav>ul {position:relative; float:left; width:25%; height:100%; padding-top:200px; border-left:1px solid #e1e1e1}
#all_gnb nav>ul a:hover {color:#0064c8}
#all_gnb nav>ul .depth01_li>a {position:relative; padding-left:30px; font-size:24px; font-weight:600}
#all_gnb nav>ul .depth01_li>a:before {position:absolute; left:0; top:0; content:''; display:inline-block; width:5px; height:100%; background:#004182}
#all_gnb nav>ul .depth02_ul {margin-top:30px;}
#all_gnb nav>ul .depth02_ul>li>a {position:relative; padding-left:30px; font-size:18px; font-weight:400}
#all_gnb nav>ul .depth02_ul>li>a:before {position:absolute; left:0; top:50%; content:''; display:inline-block; width:15px; height:1px; margin-top:-1px; background:#e1e1e1}
#all_gnb nav>ul .depth02_ul>li+li {margin-top:30px}
#all_gnb nav>ul .depth03_ul {padding:15px 30px 0; color:#666; font-weight:300; line-height:2}





/*********************************** ¿µ¹® *************************************/

.html_eng #header .gnb > li > a {font-weight:500}
.html_eng aside.pc .lang .on_text {font-weight:500}

.html_eng#main #footer address p {float:left;}
.html_eng#main #footer > p {margin-top:4.5vh}

.html_eng #all_gnb nav>ul {padding-top:11%}
.html_eng #all_gnb nav>ul .depth01_li>a {font-weight:700}
.html_eng #all_gnb nav>ul .depth02_ul>li>a {display:block; line-height:1.5; font-weight:500}
.html_eng #all_gnb nav>ul .depth02_ul>li>a:before {top:12px}
.html_eng #all_gnb nav>ul .depth03_ul {font-size:15px; line-height:normal;}
.html_eng #all_gnb nav>ul .depth03_ul li {position:relative; padding-left:10px;}
.html_eng #all_gnb nav>ul .depth03_ul li:before {position:absolute; left:0; top:10px; content:''; display:inline-block; width:2px; height:2px; background:#666}
.html_eng #all_gnb nav>ul .depth03_ul li+li {margin-top:10px}

.html_eng body {letter-spacing:0; line-height:1.6}
.html_eng #footer address {padding:0 60px}





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

	#header h1 {left:30px;}
	#header .gnb > li > a {padding:0 40px;}
	aside.pc {right:30px}

	#all_gnb .btn_close {right:32px;}


}

@media all and (max-width:1080px){
	#header {height:75px;}
	#header .area_util,
	#header .gnb_wrap {display:none;}

	#header h1 {left:30px; top:18px;}
	#header h1 img {height:40px;}

	aside.pc {display:none}
	.btn_menu{display:block;}

	#main #footer {padding:30px}
	#main #footer address {float:none;}
	#main #footer > p {float:none; margin-top:15px}

	#footer .btn_top {position:relative; right:auto; top:auto; margin: 0 auto;}
	#footer address {margin-top: 20px}


	#all_gnb {display:none !important;}

	.wrapper {width:100%; padding:0 20px;}

	.html_eng #footer address {padding:0px} 
	.html_eng#main #footer address p {float:none;}

	


	
}

@media all and (max-width:767px){
	body,
	p,
	li,
	a{font-size:15px;}

	#header h1 {left:20px}
	.btn_menu {right:20px;}

	#main #footer {position:relative; left:auto; bottom:auto; padding:30px 20px; border-top:1px solid #e1e1e1}
	#main #footer address p {display:block; margin-right:0; font-size:12px}
	#main #footer > p {font-size:12px}
	#footer address p {display:block; margin-right:0; font-size:12px}
	#footer address br {display:none}
	#footer p.copy {font-size:12px}


}

@media all and (max-width:500px){
	#header{height:65px;}
	#header h1 {top:12px}
	#header .btn_menu {top:9px}

}