html{font-size:20px;}
body{font-size:1rem;}

.tablet{display:none;}
.mob{display:none;}


/*탑메뉴*/
#wrap{ position:relative; font-size:0.85rem; overflow:hidden;}
#header{position:relative; width:100%; z-index:10;}
#header .gnb{height:2rem; background:#eee;position:relative;}
#header .gnb:before{content : ""; display : block; position : absolute; left : 0; top:0;  width :100%; height : 3px; background : #3086c9;}
#header .gnb ul{width:1400px; margin:0 auto; display:flex; align-items: center; justify-content: flex-end;}
#header .gnb ul li a{display:block; height:100%; line-height:2rem; font-weight:700; padding:0 1rem; border-radius:3px; background:#3086c9; color:#fff;}
#header .gnb ul li:nth-of-type(1) a{border-radius:3px 0 0 3px;}
#header .gnb ul li:nth-of-type(2) a{background:#a1cf43;border-radius:0 3px 3px 0;}


#header .header_inner {width:1400px; margin:0 auto;  height:4rem; box-sizing:border-box;  position:relative;  }
#header .header_inner h1 {position:absolute; left:0; top:50%; transform:translateY(-50%); }
#header .header_inner #nav {margin-left:200px;}
#header .header_inner #nav ul {clear:both;  position:relative; box-sizing:border-box;height:100%;}
#header .header_inner #nav ul li { display:inline-block;width: auto; float:none; vertical-align:top;position:relative;}
#header .header_inner #nav ul li {position:relative; }
#header .header_inner #nav ul li  a{text-align:center; color:#221815; font-weight: 900; font-size:.95rem; display:inline-block; height:4rem; line-height:4rem; text-transform: uppercase;position:relative;margin:0 20px;}
#header .header_inner #nav ul li  a strong{font-weight: 900;}
#header .header_inner #nav ul li.active a{color:#3689C9;}
#header .header_inner #nav ul li.active a:after{content : ""; display : block; position : absolute; left:50%;  transform:translateX(-50%);  bottom:0; width:100%; height :3px; background:#3689C9; z-index:100;}
#header .header_inner #nav ul li ul {z-index: 100; display:none; position: absolute; width:9rem;  left:50%;  transform:translateX(-50%); top:4rem; padding:30px 0px 15px; box-sizing:border-box;  border-top:none; text-align:center; background:#1D4589; height:auto;}
#header .header_inner #nav ul li ul li {display:block;margin:0; margin-bottom:13px; line-height:1.5;}
#header .header_inner #nav ul li ul li a{display:block;color:#fff; font-size:0.84rem;   height:auto; font-weight:normal; line-height:1.5; position:relative;}
#header .header_inner #nav ul li ul li a:after{display:none;}
#header .header_inner #nav ul li.active ul li a:after{display:none;}
#header .header_inner #nav ul li.active ul li a{color:#fff;}
#header .header_inner #nav ul li ul li a:hover{color:#6dc7f9;}
#header .header_inner #nav ul li ul li ul{display:none;}
#header .header_inner #nav ul li ul li ul li{display:none;}
#header .header_inner #nav a.newBlank{ padding-right:1rem; position:relative;}
#header .header_inner #nav a.newBlank:after{ content : "\e980"; display : block;font-size:0.9rem; font-weight:500; position : absolute; right:0px; top:50%;transform:translateY(-50%); font-family:'xeicon'; color:#fff; font-size:0.75rem;}
#header .header_inner #nav a.newBlank:hover:after{background:#6dc7f9;}


/*사이트맵 버튼*/
#header .btn-gnb-menu{display:none; position:absolute; right:0; top:0; width:4rem; height:4rem; cursor:pointer;  border-left:1px solid rgba(255, 255, 255, 0.2);  text-align:center; background-color:#385C97;}
#header .btnAll {position:relative; width:1.4rem; height:1.1rem; top:50%; transform:translateY(-50%);outline: none;}
#header .btnAll span { display: block; width: 100%; height: 0.14rem; position: absolute; background-color: #fff; -webkit-transition: all 0.25s; transition: all 0.25s; }
#header .btnAll > span:nth-child(1) { top: 0; width:1.2rem;}
#header .btnAll > span:nth-child(2) { top: 0.5rem; }
#header .btnAll > span:nth-child(3) { top: 1rem; width:0.74rem;}
#header.open .btnAll > span{background-color: #fff;}
#header.open .btnAll > span:nth-child(1) { top: 0.4rem; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); width: 1.4rem;}
#header.open .btnAll > span:nth-child(2) { top: 0; opacity: 0; width: 1.4rem;}
#header.open .btnAll > span:nth-child(3) { top: 0.4rem; -webkit-transform: rotate(135deg); transform: rotate(135deg); width: 1.4rem;}

/*사이트맵*/
#header #navi{background:#fff; position:fixed; right:-100%; top:0; width:100%; height:100%; padding-top:0;  z-index:100; transition:right 0.45s;}
#header.open #navi{transition:right 0.45s; right:0px;}

@media (max-width:1400px){
	#header .header_inner h1{left:1rem;}
	#header .gnb ul,
	#header .header_inner{width:100%;}
	#header .header_inner #nav{margin-left:230px;}
}


@media (max-width:1030px){
	html{font-size:16px;}
	body{font-size:1rem}
	.web{display:none;}
	.tablet{display:block;}   
	#wrap{font-size:1rem;}

	#header h1 img,
	#footer h3 img{width: 8rem;}
	#header .btn-gnb-menu{display:block;}
	#header .header_inner #nav{display:none;}

	/*전체메뉴*/
	#header #navi{background:#fff; position:fixed; right:-100%; top:0; padding-top:4rem; width:100%; height:100%; z-index:10; transition:right 0.45s;}
    #header.open #navi{transition:right 0.45s; right:0px;}
    #menuAll{display: block;}
    #navi h3{font-size:1.2rem;color:#fff; padding:1rem 0.75rem; line-height:1.3; font-weight:normal; margin:0; text-align: center;background: #FFB306; }
    #navi h3 em{font-weight:600;}
	#navi .top_menu{display:block; position:absolute; left:1rem; top:0;}
	#navi .top_menu li{display:inline-block; position:relative; height:4rem; line-height:4rem; padding-left:10px; }
	#navi .top_menu li a{color:#898989;}
	#navi .top_menu li a.select_btn{color:#0068B7;}
	#navi .top_menu li:after{position: absolute; content:''; display: block; left:0; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; background: #D2D2D2;}
	#navi .top_menu li:first-child:after{display: none;}	

	#menuAll .mobile_top{width:100%;height:auto; flex-direction: column;}
	#menuAll .mobile_top .mbtop{display: block;padding:0;}
	#menuAll .mobile_top .mbtop > li > a:after{display:none;}
	#menuAll .slogan{width:100%;margin-left:0;}


    /*1차*/
    #navi ul.mbtop {width:100%; margin:0; padding:0;  border-top:1px #eeeeee solid;}
    #navi ul.mbtop li {margin:0; float:none; width:100%; padding-right:0; border-bottom:1px #eeeeee solid; position:relative; }
	#navi ul.mbtop li:after{ content :"\e941"; display : block; position : absolute; right:1rem;  top:15px;font-family:'xeicon'; font-weight:700; }
	#navi ul.mbtop li.nosub:after{display:none;}
    #navi ul.mbtop li a {padding:0; background: none; text-align:left; display:block; width:100%; padding:15px 1rem;box-sizing:border-box; font-size:1.2rem;  color:#262626;  font-weight:700; }
    #navi ul.mbtop li.open_li{ position:relative;}
    #navi ul.mbtop li.open_li:after{ content :"\e944";}
   
    /*2차*/
    #navi ul.mbtop li ul {display:none; float:none; background-color:#f5f6f7; position:relative; left:0; top:0; width:auto; height:auto; visibility:visible;  padding:1rem 1rem; margin-top:0;}
    #navi ul.mbtop li ul li {float:none;border:none; box-sizing:border-box;  background: none; padding-left:0;}
    #navi ul.mbtop li ul li a {color:#262626; background:url(none);  height:auto; padding-left:0;  font-size:1.1rem; font-weight:500;}
    #navi ul.mbtop li ul li:after,
	#navi ul.mbtop li ul li:before{display:none;}

    /*3차*/
    #navi ul.mbtop li ul li ul{display:none;border:none; height:0;background:none; margin:0; padding:0;}
    #navi ul.mbtop li ul li ul li {display:none;}

	#menuAll .mobile_top > ul > li:nth-child(2) > a{ background: #fff; }
	#menuAll .mobile_top > ul > li:nth-child(3) > a{ background: #fff; }
	#menuAll .mobile_top > ul > li:nth-child(4) > a{ background: #fff; }
	#menuAll .mobile_top > ul > li:nth-child(5) > a{ background: #fff; }

	#navi ul.mbtop li.open_li > a {color:#0068B7;}

}

/*푸터*/
#footer{background:#2b4b64;color:#fff;}
#footer .copyright{width:1400px;margin:0 auto;padding:2rem 1rem;position:relative;font-weight:400;}
#footer .copyright ul{display:flex; align-items: center; justify-content: space-around;}
#footer .copyright ul li img{vertical-align:middle; margin-right:10px; width:2.05rem;}
#footer .copyright ul li b{margin-right:1rem; position:relative;}

@media (max-width:1400px){
	#footer .copyright{width:100%;}
	#footer .copyright ul{display:block;}
	#footer .copyright ul li{margin:10px 0;}
	#footer .copyright ul li img{width:1.5rem;}
}

@media (max-width:767px){
	#footer .copyright ul li{position:relative; padding-left:110px; line-height:1.3;}
	#footer .copyright ul li img{margin-right:5px; width:1.5rem;}
	#footer .copyright ul li b{position:absolute; left:0; top:0; margin-bottom:10px;}
}