@charset "utf-8";

#header{width:100%; height:100px; overflow:hidden; transition: height 0.4s ease, transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), background 0.3s ease; position:fixed; z-index:999; top:0; left:0; font-family: 'Pretendard', sans-serif;}
.headerInner{width:100%; padding:0 40px 36px; display:inline-block; border-bottom:1px solid rgba(255,255,255,0.3); text-align:center;}
.headerInner h1{padding-top:35px; float:left;}
.headerInner .gnb{display:inline-block; padding-top:35px;}
.headerInner .gnb>li{float:left; position:relative;}
.headerInner .gnb a{color:#fff; font-size:18px; width: 200px; display: block; font-family: 'Pretendard', sans-serif; font-weight: 500; letter-spacing: -0.02em;}
.headerInner .gnb>li:nth-child(3) a, .headerInner .gnb>li:nth-child(4) a, .headerInner .gnb>li:nth-child(5) a, .headerInner .gnb>li:nth-child(6) a {width: 150px;}
.headerInner .sGnb{position:absolute; left:50%; transform:translateX(-50%); top:85px; width:max-content; min-width:100%; text-align:center;}
.headerInner .sGnb li{padding:4px 0;}
.headerInner .sGnb a{font-size:15px; font-family: 'Pretendard', sans-serif; font-weight: 400; width:auto; white-space:nowrap; padding:0 5px; opacity:0.85; transition: opacity 0.2s, color 0.2s;}
.headerInner .sGnb a:hover{opacity:1; text-decoration:underline;}

#header.headerOn{background:#fff !important; box-shadow:0 2px 10px rgba(0,0,0,0.06);}
#header.headerOn .headerInner{border-color:rgba(0,0,0,0.1);}
#header.headerOn .gnb a, #header.headerOn .lang a{color:#222 !important;}
#header.headerOn .lang{background-image:url('../img/common/lang_arrowOn.png')}

/** 스크롤 시 헤더 인터랙션 **/
#header.header-up{transform: translateY(-100%) !important;}
#header.header-down{transform: translateY(0) !important;}

.lang{width:60px; float:right; margin-top:35px; background:url('../img/common/lang_arrow.png') no-repeat right 0 top 12px; font-family: 'Pretendard', sans-serif;}
.lang li{display:none; padding:5px 0;}
.lang li.on{display:block;}
.lang a{font-size:14px; color:#fff; text-transform:uppercase; letter-spacing:0; font-family: 'Pretendard', sans-serif; font-weight: 500;}


/* 모바일메뉴 */
.hamBtn{display:none; width:33px; height:25px; background:url('../img/common/ham_w.png') 0 0 no-repeat; overflow:hidden; text-indent:-999px; position:absolute; right:70px; top:36px; cursor:pointer;}
.Mgnb{position:fixed; width:100%; height:100%; top:0; right:0; z-index:1000; background:#fff; padding:70px 7% 0; overflow-y:scroll; display:block; transform:translateX(100%); transition:transform 0.6s ease; font-family: 'Pretendard', sans-serif;}
.Mgnb .close{cursor:pointer; position:absolute; top:20px; right:20px;}
.Mgnb>ul>li{font-size:20px; padding:20px 0; border-bottom:1px solid #eee; cursor:pointer; font-weight: 500;}
.Mgnb>ul>li img{vertical-align:middle; float:right; margin-top:5px; transition:transform 0.2s;}
.Mgnb>ul>li>span.on{color:#008be6;}
.Mgnb>ul>li>span>img.on{transform:rotate(45deg); transition:transform 0.2s;}
.Mgnb>ul>li .sGnb{display:none; font-size:18px; padding:15px 20px 0;}
.Mgnb>ul>li .sGnb li{padding:5px 0;}
.Mgnb>ul>li .sGnb a{color:#595959; font-weight: 400;}

.Mgnb.show{transform:translateX(0); transition:transform 0.6s ease;}


#footer{width:100%; background:#253037; padding:50px 70px; font-size:16px; font-family: 'Pretendard', sans-serif;}
#footer .footerInner{display:inline-block; width:100%;}
.footerInner .left{float:left;}
.footerInner a{color:#fff; margin-right:20px;}
.footerInner a:last-of-type{margin-right:0;}
.footerInner .point{font-weight:bold;}
.footerInner p{float:right; font-size:12px; color:rgba(255,255,255,0.5); letter-spacing:0;}