@charset "utf-8";

#shGnb{display:flex;align-items:center;justify-content:space-between;max-width:var(--mainsize);position:relative;width:100%;height:90px;margin:0 auto}
#shGnb .mn_wrap{display:flex;align-items:center;width:100%}
.sh_lnb_bg{display:none;position:absolute;top:0;left:0;width:100%;height:230px;background-color:#fff}

/* 로고 */
#shGnb .sh_logo{position:relative;z-index:20}
#shGnb .sh_logo img{width:140px}

/* 대분류  */
#shGnb .sh_nav{display:none;width:max-content}
#shGnb .sh_nav > li{position:relative;padding:0 40px;line-height:90px;list-style:none}
#shGnb .sh_nav > li > a{display:block;font-size:16px;font-weight:700;color:#111;transition:all .2s}
#shGnb.on .sh_nav > li > a{color:#222}

/* 소분류 */
#shGnb .sh_lnb_s{display:none;position:absolute;left:50%;transform:translateX(-50%);min-width:100%;width:max-content;min-height:145px;padding-top:15px}
#shGnb .sh_lnb_s li a{display:block;font-size:15px;line-height:1.8;text-align:center;color:#999;transition:all .2s}
#shGnb .sh_lnb_s li a:hover{color:var(--primary)}

#shGnb .right_area{display:flex;align-items:center;gap:20px;margin-left:auto}
#shGnb .link{display:flex;align-items:center;gap:5px}
#shGnb .link a{display:inline-block;padding:5px 9px;border:1px solid #e1e1e1;border-radius:3px;font-size:13px;font-weight:500;color:#aaa;background:#fff;transition:all .3s}
#shGnb .link a:hover{border:1px solid var(--border);color:var(--primary)}
#shGnb .num{display:flex;align-items:center;gap:10px}
#shGnb .num .cir{display:flex;align-items:center;justify-content:center;width:37px;height:37px;border-radius:50%;background:var(--primary-dark)}
#shGnb .num .cir span{font-size:21px;color:var(--surface)}
#shGnb .num div p{font-size:22px;font-weight:700;color:var(--primary-dark)}
#shGnb .num div .time{font-size:13px;font-weight:600;color:var(--text2)}


/* 반응형 [s] */
@media (max-width:1024px){
}
@media (max-width:768px){
#shGnb .num{gap:8px}
#shGnb .num div p{font-size:19px}

}
@media (max-width:580px){
#shGnb{height:auto;margin-bottom:10px}
#shGnb .mn_wrap{align-items:flex-start}
#shGnb .right_area{align-items:flex-end;flex-direction:column;gap:5px}
#shGnb .link{order:2}
}
@media (max-width:390px){
#shGnb .sh_logo img{width:120px}
#shGnb .num div p{font-size:17px}
#shGnb .num div .time{font-size:12px}
#shGnb .num .cir span{font-size:18px}
#shGnb .num .cir{width:35px;height:35px}
}
/* 반응형 [e] */