@charset "utf-8";

#side_menu_wrap{width:100%;height:7rem;background:#112641;position:relative;z-index:2;display:flex;flex-wrap:wrap;justify-content:space-between}
#side_menu_wrap .inner{max-width:140rem;width:100%;margin:0 auto;position:relative}
.side_menu_mobile{max-width:64.5rem;width:100%;height:100%}
.side_menu_mobile .drop_header{position:relative;display:flex}
.side_menu_mobile .home{width:7rem;height:7rem;border-radius:.5rem 0 0 .5rem;background:rgba(255,255,255,.1)}
.side_menu_mobile .home a{display:block;width:100%;height:100%;position:relative}
.side_menu_mobile .home img{width:2rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}

/* 첫번째 depth */
.side_menu_mobile ul.dep1{width:calc((100% - 5rem) / 2);border-right:1px solid rgba(255,255,255,.2)}
.side_menu_mobile ul.dep1>li{height:100%;position:relative}
.side_menu_mobile ul.dep1>li::after{content:'';width:0.8rem;height:0.8rem;border-left:2px solid #fff;border-bottom:2px solid #fff;position:absolute;right:2rem;top:50%;transform:translateY(-50%) rotate(-45deg);transition:all 0.2s}
.side_menu_mobile ul.dep1>li.active::after{transform:rotate(135deg)}
.side_menu_mobile ul.dep1>li>a{display:block;width:100%;height:100%;padding:0 4rem 0 3rem;font-size:1.6rem;font-weight:500;color:#fff;line-height:130%;text-overflow:ellipsis;display:flex;align-items:center}
.side_menu_mobile ul.dep1>li>a span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-transform: uppercase;}
/* 두번째 depth */
.side_menu_mobile ul.dep2{display:none;width:calc(100% + 2px);border:1px solid #ddd;border-top:none;border-radius:0 0 1rem 1rem;background:#fff;overflow:hidden;position:absolute;top:7rem;left:-1px;z-index:99}
.side_menu_mobile ul.sub_menu_list_m.dep2{left:auto;right:-1px}
.side_menu_mobile ul.dep2>li{width:100%;margin-right:-1px;border-top:1px solid #ddd;transition:.2s;text-transform: uppercase;}
.side_menu_mobile ul.dep2>li>a{display:block;padding:1.5rem 2rem;font-size:1.6rem;line-height:120%}
.side_menu_mobile ul.dep2>li.sub_menu_on>a{font-weight:600}
.side_menu_mobile ul.dep2>li:hover a{background:#f7f7f7}


#side_menu_wrap .page_root{position:absolute;top:50%;transform:translateY(-50%);right:2rem;display:flex;flex-wrap:wrap;align-items:center;gap:2rem}
#side_menu_wrap .page_root li{font-size:1.6rem;color:rgba(255,255,255,.5);position:relative;text-transform: uppercase;}
#side_menu_wrap .page_root li.home{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
#side_menu_wrap .page_root li:before{content:url(/hd/side_menu/arr_side.png);position:absolute;right:-1.3rem;top:50%;transform:translateY(-50%)}
#side_menu_wrap .page_root li:last-child{font-weight:600;color:rgba(255,255,255,.8)}
#side_menu_wrap .page_root li:last-child:before{display:none}



@media(max-width: 1280px) {
#side_menu_wrap .page_root{display:none}
}

@media(max-width: 1024px) {
#side_menu_wrap{width:100%;border-radius:0}	
.side_menu_mobile{max-width:100%}	
.side_menu_mobile .home{border-radius:0}

}

@media(max-width: 767px){
#side_menu_wrap{height:5.5rem}
.side_menu_mobile .home{width:5.5rem;height:5.5rem}
.side_menu_mobile ul.dep1>li>a{padding:0 3rem 0 2rem}

.side_menu_mobile ul.dep2{top:5.5rem}


}

@media(max-width: 480px){
#side_menu_wrap .page_root{display:none}
}