/* 해더 */
#header {background: #fff; position: sticky; top: 0; z-index: 10;}
#header .container {display: flex; justify-content: space-between; align-items: center;}

#header .logo img {width: 18.5rem;}

#header .gnb {display: flex;}
#header .gnb li.depth01 {padding: 2rem 1.5rem; transition: .2s;}

#header .subMenu {position: relative;}
#header .subMenu .arrow {font-family: 'SUIT', sans-serif; color: #a3a3a3; font-weight: 400 !important; transition: .3s; display: inline-block;}

#header .lnb {position: absolute; left: 50%; top: 7rem; transform: translateX(-50%); width: 15rem; background: rgba(6, 40, 29, .5); text-align: center; padding: 2rem; border-radius: 1.25rem; opacity: 0; visibility: hidden; transition: .3s;}
#header .lnb .depth02:nth-child(n+2) {margin-top: 1rem;}
#header .lnb .depth02 a {color: #fff;}

#header .subMenu:hover .lnb {opacity: 1; visibility: visible;}

#header .hamburger {width: 2.5rem; height: calc(8px + 1rem); position: relative; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);   -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; position: absolute; right: 5%; top: 50%; transform: translateY(-50%);}
#header .hamburger span {display: block; position: absolute; height: 2px; width: 100%; background: #000; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}

#header .hamburger span:nth-child(1) {top: 0px;}
#header .hamburger span:nth-child(2),
#header .hamburger span:nth-child(3) {top: .7rem;}
#header .hamburger span:nth-child(4) {top: 1.4rem;}

#header .hamburger.open span:nth-child(1) {top: .5rem; width: 0%; left: 50%;}
#header .hamburger.open span:nth-child(2) {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
#header .hamburger.open span:nth-child(3) {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
#header .hamburger.open span:nth-child(4) {top: .5rem; width: 0%; left: 50%;}

@media(min-width:991px) {
    #header .gnb li.depth01:hover > a {font-weight: 600;}
    #header .lnb .depth02 a:hover {font-weight: 600;}
    #header .subMenu:hover .arrow {transform: rotate(180deg);}
}

@media(max-width:990px) {
    #header {padding: 1.5rem 0;}
    #header.open {border-bottom: 1px solid #ebebeb; z-index: 12;}

    #header .gnb {position: absolute; left: 0; top: 6.6rem; flex-direction: column; background: #fff; width: 100%; height: calc(100vh - 6.6rem); font-size: 3.125rem; gap: 3rem; padding: 3rem 5%; opacity: 0; visibility: hidden; transition: opacity .5s; overflow-y: auto;}
    #header .gnb::-webkit-scrollbar {display: none;}
    #header.open .gnb {opacity: 1; visibility: visible;}
    #header .gnb li.depth01 {padding: 0; transition: none; width: 100%;}
    #header .gnb li.depth01 a {width: 100%;}

    #header .subMenu a {display: flex; justify-content: space-between;}
    #header .subMenu.open .arrow {transform: rotate(180deg);}

    #header .lnb {position: initial; opacity: 1; visibility: visible; transition: none; transform: none; background: transparent; border-radius: 0; font-size: 2.25rem; text-align: left; padding: 3rem 5% 0 3rem; display: none;}
    #header .lnb .depth02:nth-child(n+2) {margin-top: 1.5rem;}
    #header .lnb .depth02 a {color: #000;}
    #header .lnb .depth02 a:hover {color: var(--pointcolor); font-weight: 600;}
}

@media(max-width:768px) {
    #header .gnb {top: 6.7rem;}
}

/* 푸터 */
#footer {padding: 60px 0;}
#footer .top {display: flex; align-items: center; justify-content: center; gap: 1rem;}
#footer .nonbenefit {color: #fff; padding-left: 1rem; position: relative;}
#footer .nonbenefit:after {position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: 50%; width: 1px; background: #fff; content: ""; opacity: .3;}
#footer .copyright {color: #fff; opacity: .5; letter-spacing: 0;}
#footer .logo img {width: 18.5rem; }
#footer br.mo {display: none;}

@media(max-width:768px) {
    #footer {font-size: 1.25rem;}
    #footer .top {flex-direction: column;}
    #footer .nonbenefit {padding-left: 0; background: rgba(255,255,255,0.25); padding: .5rem 1rem; border-radius: 5px; font-size: 1.37rem;}
    #footer .nonbenefit:after {display: none;}
}

@media(max-width:360px) {
    #footer br.mo {display: block;}
}

/* 퀵메뉴 */
#quick {position: fixed; bottom: 2rem; right: 2.5%; z-index: 1; z-index: 11;}
#quick a {color: #fff;}

#quick .circle {width: 5.625rem; height: 5.625rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 2px 2px 16px rgba(157, 157, 157, .35);}
#quick .circle.quickBtn {background: #186245; z-index: 1; position: relative;}
#quick .circle.naver {background: #00c300;}
#quick .circle.top {background: #fff;}
#quick .circle span {display: block; margin-top: .25rem;}
#quick .circle .en {letter-spacing: -.01em;}

#quick .quickMenu {width: 100%; background: #1d9061; padding: 1rem .5rem 3.25rem; border-radius: 100px 100px 0 0; transform: translateY(3rem); display: none;}
#quick .quickMenu li:nth-child(n+2) {border-top: 1px solid rgba(237, 252, 243, .25);}
#quick .quickMenu li a {padding: 1.25rem 0; display: block;}

@media(max-width:1580px) {
    #quick img {transform: scale(.8);}
}

@media(max-width:768px) {
    #quick .circle {width: 7rem; height: 7rem;}
    #quick .circle.mt-15 {margin-top: .625rem;}
    #quick .quickMenu {font-size: 1.5rem;}
}