.inr {position:relative; max-width:1400px; margin:0 auto;}

/* header */
#header{z-index:99; position:absolute; width:100%; height:100px; text-align: center; border-bottom:1px solid rgba(255, 255, 255, .3); transition:0.3s; }
#header .inr { max-width: none; justify-content: space-between; align-items: center; display: flex; height: 100%; padding: 0 50px; }
#header h1{position:relative; margin-right: 20px; }

#header nav {display:inline-block; flex: 1;}
#header .gnb {position:relative; display: block; font-size: 0; }
#header .gnb > li {position:relative; display:inline-block; }
#header .gnb > li > a {position:relative; display:block; line-height:100px; height:100px; color:#fff; font-size:16px; font-weight:500; text-transform:uppercase; padding: 0 50px; }
#header .gnb > li:hover > a:after {position:absolute; left:0; bottom:0; content:''; display:inline-block; width:100%; height:3px; background:#e1e1e1}
#header .gnb > li > .sub_menu {display:none; position:absolute; left:0; top:100px; width:100% !important; background:#fff; z-index:99; box-shadow:3px 3px 5px rgba(0, 0, 0, .1)}
#header .gnb li:hover .sub_menu{display:block; }
#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:#666; border-top:1px solid #ddd; font-size:14px; text-align:center; transition:0.4s;}
#header .gnb .sub_menu li a:hover {background:#f5f5f5; color:#da0071; }
#header .gnb .sub_menu li:first-child a{border-top:0;}

#header .area_util {position:relative; }
#header .area_util > * {display:inline-block; float:left; padding:0 30px;}

.btn_lang {position:relative; }
.btn_lang > p {position:relative; padding:0px 30px; color:#fff; line-height:100px; cursor:pointer;}
.btn_lang > p:before {position:absolute; left:0; top:50%; content:''; display:inline-block; width:20px; height:20px; background:url(../images/common/i_earth.png) no-repeat left center; transform:translateY(-50%)}
.btn_lang > p:after {position:absolute; right:0; top:50%; content:''; display:inline-block; width:10px; height:5px; background:url(../images/common/i_lang_down.png) no-repeat right center; transform:translateY(-50%)}
.btn_lang > ul {display:none; position:absolute; left:0; top:80px; width:100%; border-radius:10px; background:#fff; box-shadow:3px 3px 5px rgba(0, 0, 0, .1); overflow:hidden;}
.btn_lang > ul a {display:block; font-size:14px; line-height:40px; transition:all .3s}
.btn_lang > ul a:hover {background:#f5f5f5; color:#da0071}
.btn_lang:hover > ul {display:block;}

.m_gnb .btn_lang{ z-index: 10; text-align: left; }
.m_gnb .btn_lang:after{ content: ''; display: block; height: 30px; border: 1px solid #e1e1e1; border-left: 0; border-right: 0; background: #f7f7f7; box-sizing: border-box;}
.m_gnb .btn_lang > p { margin: 0 25px; color: #424242; line-height: 55px;}
.m_gnb .btn_lang > p:before{ background-image: url(../images/common/i_earth_dark.png); }
.m_gnb .btn_lang > p:after{ background-image: url(../images/common/i_lang_down_dark.png); }
.m_gnb .btn_lang > ul{ top: 55px; }
.m_gnb .btn_lang > ul a{ text-indent: 55px; }

#header .area_util .btn_allmenu {position:relative; padding-right:0; margin-top:40px;}
#header .area_util .btn_allmenu:before {position:absolute; left:0; top:0; content:''; display:inline-block; width:1px; height:20px; background:rgba(255, 255, 255, .3);}
#header .area_util .btn_allmenu a {display:inline-block; width:25px; height:25px}
#header .area_util .btn_allmenu a span {float:right; display:block; width:100%; height:2px; background:#fff;}
#header .area_util .btn_allmenu a span:nth-child(2) {width:70%}
#header .area_util .btn_allmenu a span + span {margin-top:7px;}

/* mobile-menu */
.mobile_header{background:#008790; color:#333; text-align:center; padding:35px 0 10px 0;}
.btn_menu{position:relative; z-index:90; width:25px; height:25px; }
.btn_menu{display:none;}
.btn_menu span {display:block; float:right; width:100%; height:2px; background:#fff; text-align:center;}
/* .btn_menu span:nth-child(1){margin-top:14px;} */
.btn_menu span:nth-child(2){width:70%; margin-top:7px;}
.btn_menu span:nth-child(3){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 > div:nth-of-type(1) {height:80px; background:#f7f7f7; border-bottom:1px solid #e1e1e1}
.m_gnb > ul > li > a{display:block; position:relative; padding:15px 25px; text-align:left; border-bottom: 1px solid #eaeaea; color:#424242; transition:all 0.3s ease 0s;}
/*.m_gnb > ul > li > a.active:after {position:absolute; left:0; bottom:0; content:''; display:inline-block; width:100%; height:2px; background:#da0071}*/
/* .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{background:#da0071; color:#fff;}
.m_gnb > ul > li > a.active:before{transform:rotate(180deg);}
.m_gnb > ul > li > ul{display:none;}
.m_gnb > ul > li > ul > li{border-bottom:1px solid #dedede;}
.m_gnb > ul > li > ul > li > a {position:relative; display:block; padding:20px 35px; text-align:left; font-size:14px; font-weight:300; color:#666; }
.m_gnb > ul > li > ul > li > a:before {position:absolute; left:25px; top:50%; content:''; display:inline-block; width:2px; height:2px; margin-top:-1px; background:#666;}

.m_gnb .btn_close{opacity: 0; display: block; position:absolute; top:30px; 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:15px;}
.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:1px; background:#333; transform:rotate(45deg);}
.m_gnb .btn_close:after{content: ''; display:block; position:absolute; top:9px; left:0px; width:100%; height:1px; background:#333; bottom: 9px; transform:rotate(-45deg);}

.area_util_m{padding:20px 20px; margin-top:80px; background:#da0071;}
.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;}

#footer {padding:50px 0; background:#f5f5f5}
#footer .btn_top {position:absolute; right:0; top:0; display:block; width:50px; height:50px; padding:13px 0; text-align:center; font-size:10px; font-weight:500; color:#fff; background:#b5b5b5;}
#footer .btn_top i {display:block; line-height:1; margin-bottom:2px;}
#footer .quick:after {clear:both; content:''; display:block;}
#footer .quick li {position:relative; float:left; display:inline-block;}
#footer .quick li:before {position:absolute; left:0; top:50%; content:''; display:inline-block; width:1px; height:10px; background:#e1e1e1; transform:translateY(-50%);}
#footer .quick li + li {margin-left:15px; padding-left:15px;}
#footer .quick li a {display:inline-block; font-size:14px;}
#footer .quick li:last-child a {color:#da0071}
#footer address {margin-top:15px; line-height:1.8}
#footer address p {display:inline-block; margin-right:20px; color:#888; font-weight:300; font-size:14px;}
#footer address p span {font-weight:600; padding-right:5px;}
#footer address p a {color:#888}
#footer address p.copy {display:block;}

#header .all_menu {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:linear-gradient(145deg, #424242, #2a2b2d)}
#header .all_menu .inr {height:100%;}
#header .all_menu .category {display:table; width:100%; height:100%;}
#header .all_menu .category > ul {display:table-cell !important; vertical-align:middle;}
#header .all_menu .category > ul:after {clear:both; content:''; display:block;}
#header .all_menu .category > ul > li {float:left; width:33.33%; text-align:left;}
#header .all_menu .category > ul > li > a {position:relative; height:auto; padding:0 30px; line-height:normal; font-size:40px; font-weight:600; transition:all .3s}
#header .all_menu .category > ul > li > a:before {position:absolute; left:0; top:0; content:''; display:inline-block; width:5px; height:100%; background:#fff;}
#header .all_menu .category > ul > li:hover > a {color:#da0071}
#header .all_menu .category > ul > li:hover > a:after {display:none;}
#header .all_menu .category > ul > li > .sub_menu {display:block; position:relative; left:auto; top:auto; margin-top:30px; background:none; box-shadow:none;}
#header .all_menu .category > ul > li > .sub_menu li {padding:0 30px;}
#header .all_menu .category > ul > li > .sub_menu a {position:relative; font-size:24px; color:#e1e1e1; text-align:left; border-top:none;}
#header .all_menu .category > ul > li > .sub_menu a:hover {background:none}
#header .all_menu .btn_close {position:absolute; right:100px; top:100px; width:50px; height:50px; border-radius:100%; background:#da0071}
#header .all_menu .btn_close span {position:absolute; left:50%; top:50%; display:inline-block; width:25px; height:2px; background:#fff; transform:translate(-50%, -50%) rotate(45deg);}
#header .all_menu .btn_close span:last-child {transform:translate(-50%, -50%) rotate(-45deg)}

@media screen and (max-width:1400px){
	#footer .btn_top {right:50px;}
}

@media screen and (max-width: 1280px) {
	#header .inr{ padding: 0 40px; }
	#header .gnb > li { width: 33.33%; }
	#header .gnb > li > a{ padding: 0; }
}

@media all and (max-width:1080px){
	.inr {width:100%; padding:0 30px;}

	#header .area_util,
	#header .gnb{display:none;}
	.btn_menu{display:block;}
	#header {height:80px;}
	#header .inr{ padding: 0 30px; }
	#header h1 img {height:32px;}

	#header .all_menu {display:none !important}
}

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

	.inr {padding:0 20px;}

	#header .inr{ padding: 0 20px; }
	#header .area_util {right:20px;}

	#footer .inr:after {clear:both; content:''; display:block;}
	#footer .btn_top {position:relative; float:right; right:auto;}
	#footer .quick {display:none;}
	#footer address {float:left; width:calc(100% - 50px); margin-top:0}
	#footer address p {font-size:12px;}
}

@media all and (max-width:500px){
	#header{height:65px;}
	#header .inr{ padding: 0 10px; }
	#header h1 img {height:28px;}

	#footer {text-align:center;}
	#footer .btn_top {float:none; margin:0 auto; width:45px; height:45px; font-size:8px;}
	#footer address {float:none; width:100%; margin-top:30px; line-height:2}
	#footer address p {display:block; margin-right:0}
}