@charset "utf-8";

#way_hd{width:100%;position:relative}

.top_menu_warp{max-width:1160px;width:calc(100% - 40px);height:210px;margin:0 auto;position:relative;z-index:10}
.top_menu_warp .logo{position:absolute;top:52px;left:calc(50% - 68.5px)}
.top_menu_warp .logo a{display:block}
.top_menu_warp .blog_icon{position:absolute;top:94px;left:0}

.top_menu_warp .nav_list{display:flex;flex-wrap:wrap;gap:80px;position:absolute;top:97px;transition: all .3s;}
.top_menu_warp .nav_list li{font-size:14.8px;color:#060606;font-weight:700;letter-spacing:0.1em; font-family: "Mulish", sans-serif;}
.top_menu_warp .nav_list.left_nav{left:calc(50% - 350px)}
.top_menu_warp .nav_list.right_nav{left:calc(50% + 136px)}


/*allmenu버튼 영역*/
#allmenu_btn{width:25px;height:25px;position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:600;cursor:pointer}
#allmenu_btn.all_btn_mobile{display:none}
#allmenu_btn .lines, #allmenu_btn .lines::after, #allmenu_btn .lines::before{width:100%;height:2px;background:#333;position:absolute;left:0;top:50%;transition:.2s}
#allmenu_btn .lines::before{content:'';width:100%;height:2px;left:0;top:-8px}
#allmenu_btn .lines::after{content:'';width:100%;left:auto;right:0;top:8px}

/*hover,click event*/
#allmenu_btn.active{}
#allmenu_btn.active .lines{background:transparent !important}
#allmenu_btn.active .lines::before, #way_hd.on #allmenu_btn.active .lines::before{background:#fff;width:100%;top:0;transform:rotate(45deg)}
#allmenu_btn.active .lines::after, #way_hd.on #allmenu_btn.active .lines::after{background:#fff;width:100%;top:0;transform:rotate(-45deg)}

#allmenu_btn.all_btn_mobile.active .lines::before, #way_hd.on #allmenu_btn.active.all_btn_mobile .lines::before,
#allmenu_btn.all_btn_mobile.active .lines::after, #way_hd.on #allmenu_btn.active.all_btn_mobile .lines::after{background:#333}

/*모바일메뉴 */
#navWrap{width:0;height:100%;overflow:hidden;position:fixed;top:0;right:0;z-index:100;background: rgba(0, 0, 0, .2);}
#navWrap .inner{min-width:280px;max-width:360px;width:90%;height:100%;padding:100px 0 75px;background:#fff;overflow-y:scroll;position:absolute;top:0;right:-4rem;z-index:6;opacity:0;transition:all .3s}
#navWrap .inner:before{content:'';position:absolute;right:-4rem;opacity:0;transition:all .4s}
#navWrap .inner::-webkit-scrollbar{display:none}
#allmenu_bg{display:none;width:100%;height:100vh;background:rgba(0,0,0,.7);position:fixed;top:0;left:0;z-index:5}
#allmenu_bg.active{display:none}

/* 대분류 */
#navWrap .lnb .bmenu{display:block;width:100%;padding:15px;border-bottom:1px solid #ddd;font-size:14px;color:#060606;font-weight:700;letter-spacing:0.1em; font-family: "Mulish", sans-serif;}


@media(max-width:1160px){
	.top_menu_warp .nav_list{gap:50px}
	.top_menu_warp .nav_list.left_nav {left: calc(50% - 318px);}
}
@media(max-width:1024px){
	.top_menu_warp{height:170px}
	.top_menu_warp .logo{top:30px}
	.top_menu_warp .logo img{width:126px;left:calc(100% - 63px)}
	
	.top_menu_warp .nav_list{top:73px;gap:30px}
	.top_menu_warp .nav_list.right_nav{left:calc(50% + 85px)}
	.top_menu_warp .nav_list.left_nav {left: calc(50% - 258px);}
	.top_menu_warp .blog_icon{top:70px}
	
}
@media(max-width:767px){
	.top_menu_warp{height:130px}
	.top_menu_warp .logo{height:80%;top:50%;left:50%;transform:translate(-50%,-50%)}
	.top_menu_warp .logo a{height:100%;}
	.top_menu_warp .logo img{width:auto;height:100%;left:auto}
	.top_menu_warp .nav_list{display:none}
	.top_menu_warp .blog_icon{top:50%;transform:translateY(-50%)}
	
	#allmenu_btn.all_btn_mobile{display:block}
	#navWrap.active{width:100%;}
	#navWrap.active .inner{right:0;opacity:1}
	
	
}
@media(max-width:480px){
	.top_menu_warp{height:120px}
	
}
@media(max-width:320px){
	.top_menu_warp{height:110px}
}