@charset "utf-8";

/* 로고와 대메뉴 */
header{ height:190px;z-index: 99999; position: relative;box-shadow: 0 5px 10px rgba(0,0,0,0.05); background-color: #fff;}
header *{ box-sizing: border-box;}

/*상단*/
.header_top{padding: 0 6%;height: 120px;border-bottom: 1px solid #ddd;}
.header_top h1{position: absolute; top: 40px;}

.header_top .search_top{position: absolute;left: 36%;top:35px;width: 100%;max-width: 350px;height: 50px;}
.header_top input{width: 100%;height: 50px;padding: 0 85px 0 40px;font-size: 16px;border: 3px solid #5885d7;color: #000;background-color: #fff!important;border-radius: 25px;}
.header_top button{position: absolute;right: 5px; top: 5px;height: calc(100% - 10px);padding: 0 15px;font-size: 15px;border-radius: 25px;background-color:transparent;}
.header_top .top_btn {display: inline-block;position: absolute;right: 11%;top: 45px;}

.header_top .top_btn ul {display: flex;}

.header_top .top_btn ul li b {margin-right: 10px;font-weight: 300;}
.header_top .top_btn ul li b strong{color: #fe452c;font-weight: 300;}
.header_top .top_btn ul li a{font-size: 14px;display: flex;align-items: center;}
.header_top .top_btn ul li:first-child{margin-left:0;}
.header_top .top_btn ul li i{margin-right: 10px;}
.header_top .top_btn ul li{padding: 0 10px;}
.header_top .top_btn ul li:hover a span{color:#3848ad;font-weight: 400; }


/* 모바일 전체메뉴 */
#gnavi_btn{display:none;}

@media all and (max-width: 1540px) {
header{ height:140px;}
.header_top{height: 140px;border-bottom: none;} 
.header_top h1{top: 70px;} 
.header_top .search_top{top:65px;left: 46%;} 
.header_top .top_btn {top: 15px;}
.header_top .top_btn ul li i img{height: 18px;} 
 
#gnavi_btn{display:block;position:absolute;right: 0px;top: 60px;margin-right: 11%;}
#gnavi_btn a{display: inline-block; width: 60px; height: 60px; background: #3848ad url("../images/inc/sitemap_icon.png") center no-repeat; border-radius: 5px;overflow: hidden; text-indent: -500px;} 
}


@media all and (max-width: 1024px) {
 header{ height:120px;}
.header_top{height: 120px;}
.header_top h1{top: 55px;}  
.header_top > a {line-height: 93px;margin-top: 27px;}
.header_top .top_btn {right: 5%;} 
.header_top .top_btn ul li b {margin-right: 5px;} 
.header_top .top_btn ul li i img{height: 15px;}
.header_top .top_btn ul li span{line-height: 20px;} 
.header_top .search_top{display: none;}  
#gnavi_btn{top: 50px; margin-right: 5%;}
#gnavi_btn a{ width: 50px; height:50px;} 
 
 
} 

@media all and (max-width: 767px){
header{ height:100px;}
.header_top{height: 100px;}
.header_top h1{top: 50px;}   
.header_top h1 a img{width: 250px;}   
#gnavi_btn{top: 48px;}
#gnavi_btn a{ width: 40px; height:40px;} 
}

@media all and (max-width: 640px){
.header_top .top_btn ul li{padding: 0 10px;}
.header_top .top_btn ul li i{display: none;}
}

/*
 * 메뉴레이아웃
 *     nav 메뉴가이드
 *     #gnavibg                서브메뉴배경
 *     #gnavibox               메뉴
 *     .gnavi > a              일차메뉴
 *     .gnavi > div            각서브메뉴박스배경
 *     .gnavi > div > p        일차메뉴타이틀
 *     .gnavi > div > ul       각서브메뉴리스트
 *     .mnavi                  각이차서브메뉴리스트
 *     .mnavi > a              각이차서브메뉴명
 *     .mnavi > ul             각삼차서브메뉴리스트
 *     .snavi                  각삼차서브메뉴리스트
 *     .snavi > a              각삼차서브메뉴명
 */
/* 대메뉴 배경이미지 있을때*/
#gnavibg{ position:absolute; left:0; top:190px; width:100%; display:none; background:#4e86ed;height:280px;/*풀다운메뉴높이*/ }
#gnavibg p{ display: inline-block;}

#gnavibox{padding: 0 11% 0 5%; margin: 0 auto; position:relative;display:flex;flex-wrap: wrap;}
#gnavibox > ul{width: calc(100% - 70px);font-size: 0;}

nav .gnavi {position:relative;display:inline-block;padding: 0 3%;}
nav .gnavi > a{font-size:20px;color:#000; line-height:70px; font-weight: 300;}
nav .gnavi > a:focus,
nav .gnavi > a:hover{color:#3848ad;font-weight: 500; font-size:21px;}
nav .gnavi.on > a{font-weight: 500;color:#3848ad; font-size:21px;}
nav .gnavi > div{position:absolute;display:none;width: 100%;left: 0px; }
nav .gnavi > div > ul{padding-top: 20px;text-align: center;}

nav .mnavi {text-align: center; }
nav .mnavi > a{ position:relative; color:#fff; display: block;font-size:17px; line-height: 20px; padding:10px 0;font-weight: 300;}
nav .mnavi > a:focus,
nav .mnavi > a:hover{color:#fff000;}
nav .mnavi.on > a{color:#fff000;}

.all_menu_hide{min-width: 70px; height: 70px;background:#3848ad; display: flex;align-items: center;justify-content: center;}

@media all and (max-width: 1592px){
nav .gnavi {padding: 0 2.8%;} 
}


@media all and (max-width: 1540px){
 nav{display:none; position:absolute;width:100%;} 
#gnavibg{display:none;}
#gnavibox{padding: 0; width:100%; border-top: 2px solid #3848ad;background: #fff; box-shadow: 0 10px 10px rgba(0,0,0,0.05);height: auto!important;}
#gnavibox > ul{width: 100%;} 
.all_menu_hide{display: none;}  
nav .gnavi{display: block; border-bottom: 1px solid #ddd;margin: 0;padding: 0;}
nav .gnavi:last-child{border-bottom: 2px solid #3848ad;}
nav .gnavi > div{position:relative;background: #f8f8f8;} 
nav .gnavi > div > ul{padding-top: 0;} 
nav .gnavi.on > div{ display:block;} 
nav .gnavi > a{display: block; padding:20px 0 20px 3%; color:#000; text-align:left;background:url('../images/inc/menu_arrow_basic.png') no-repeat calc(100% - 30px) center;line-height: inherit;font-size: 20px;}
nav .gnavi > a:focus,
nav .gnavi > a:hover{border-bottom: none;background:#4e86ed url('../images/inc/menu_arrow_hover.png') no-repeat calc(100% - 40px) center;color:#fff000;}
nav .gnavi > a.on{border-bottom: none; background:#4e86ed url('../images/inc/menu_arrow_active.png') no-repeat calc(100% - 40px) center;color:#fff000;}
nav .mnavi{border-top:1px solid #e5e5e5; text-align: left;}
nav .mnavi:first-child{border-top:none;}
nav .mnavi > a{padding-left: 3%; font-size: 15px;line-height: 30px;color: #000;}
nav .mnavi.on > a{color: #3848ad;font-size: 16px;font-weight: 500;}
nav .mnavi > a:focus,
nav .mnavi > a:hover{color:#3848ad;font-size:16px;font-weight: 500;}

}



@media all and (max-width: 1024px) {
nav .gnavi > a{font-size: 18px;padding:15px 0 15px 3%;} 
nav .gnavi > a:focus,
nav .gnavi > a:hover{font-size: 20px;} 
}


/*온라인쇼핑몰 바로가*/
.shopping_quick {position:absolute;top: 15%; right: 1%; z-index: 999999;}
.shopping_quick i{background:url("../images/inc/shopping_quick_icon.png") no-repeat top center; font-size: 18px; padding-top: 50px; text-align: center;position:absolute;left: 30px;top: 30px;color: #000;}

.shopping_quick a{animation: up-down 1.5s infinite ease-in-out alternate;display: block;}

@keyframes up-down{
  from{
    transform: translatey(0px);
  }
  to{
    transform: translatey(10px);
  }
}

@media all and (max-width: 1360px) {
 .shopping_quick {top:30%;}
 .shopping_quick img {height: 120px;}
 .shopping_quick i {background-size: 45px; font-size: 15px;left: 30px;top: 30px;padding-top:40px; }
}

@media all and (max-width: 1024px) {
 .shopping_quick {display: none;}
}

 