@charset "utf-8";

/* main header */
#topNavWrap{position:sticky;top:0;z-index:50;padding:35px 50px;background-color:#fff;transition:all .3s}
#topNavWrap .inner{display:flex;justify-content:space-between;align-items:center}

/* 로고 */
#topNavWrap #top_logo{position:relative}

#topNavWrap .btn_area{position:relative;display:flex;align-items:center}
#topNavWrap .btn_area ul{display:flex;gap:20px;padding-right:50px}

/* 대분류  */
#topNav{position:absolute;left:50%;transform:translateX(-50%);z-index:1;height:96px}
#topNav:after{display:block;content:"";visibility:hidden;clear:both}
#topNav > li{float:left;position:relative;padding:0 35px;line-height:95px}
#topNav > li > a{display:block;font-size:16px;font-weight:600;color:#222;transition:all .2s}
#topNav > li:hover > a{color:var(--brand-color)}

/* 소분류 */
.top_nav_s{display:none;position:absolute;width:100%;min-height:165px;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);padding-top:15px}
.top_nav_s li a{display:block;margin:0px;font-size:16px;font-weight:400;line-height:1.8;text-align:center;color:#777;transition:color .2s}
.top_nav_s li a:hover{color:#222}
.top_nav_bg{position:fixed;width:100%;display:none;top:126px;left:0;height:180px;border-top:1px solid #e1e1e1;background:#fff;-webkit-box-shadow:0px 12px 12px -17px rgba(0,0,0,0.25);box-shadow:0px 12px 12px -17px rgba(0,0,0,0.25)}

/* 메뉴버튼 */
#pfBtn{position:absolute;right:50px;display:flex;z-index:101;width:30px;height:30px;cursor:pointer;transition:all .2s}
#pfBtn span{display:block;position:relative;width:26px;height:2px;margin:auto;background:#111;transition:all .2s}
#pfBtn span:before, #pfBtn span:after{display:block;content:"";position:absolute;top:0;width:100%;height:2px;background:#111;transition:all .2s}
#pfBtn span:before {top:-8px}
#pfBtn span:after{top:8px}
#pfBtn.active{position:fixed}
#pfBtn.active span{border:none;background:transparent}
#pfBtn.active span:before{top:0;transform:rotate(45deg)}
#pfBtn.active span:after{top:0;transform:rotate(-45deg)}

/* 메뉴오픈 */
#allWrap{display:none;position:fixed;top:0;left:0;z-index:100;width:100%;height:100%;color:#08151d;transform:rotateX(8deg) translateY(50px);background-color:#fff;transition:transform .6s}
#allWrap.active{transform:rotateX(0) translateY(0)}
#allWrap .inner{height:100%;justify-content:center}
#allWrap .cont>ul{display:grid;grid-template-columns:repeat(2,1fr);gap:50px;padding:100px 0;font-family:var(--k-font)}
#allWrap .cont li{display:flex;flex-direction:column;align-items:center}
#allWrap .cont li > a{display:block;width:max-content;margin-bottom:30px;font-size:80px;font-weight:500;line-height:1;color:#111;transition:color 0.2s}
#allWrap .cont li ul{display:flex;flex-wrap:wrap;justify-content:center;gap:15px}
#allWrap .cont li ul a{opacity:0.6;font-size:17px;font-weight:500;color:#111;transition:all .2s}
#allWrap .cont li ul a:hover{opacity:1}