*{-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-focus-ring-color: transparent;}

html {position: relative;}
html.no-scroll {overflow: hidden;}
html:after {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); content: ""; z-index: 40; opacity: 0; visibility: hidden;}
html.no-scroll:after {opacity: 1; visibility: visible; z-index: 10;}

/* 커서커스텀 */
#cursor {position: fixed; z-index: 99; left: 0; top: 0; pointer-events: none; will-change: transform;}

@media (hover: hover) and (pointer: fine) {
    #cursor .cursor__circle {width: 0; height: 0;  margin-left: -50%; margin-top: -50%;}

    #cursor.arrow .cursor__circle {width: 6.25rem; height: 6.25rem; border-radius: 50%; background-color: #c1a460; }
    #cursor.arrow:after {display: block; content: "SCROLL"; letter-spacing: 0; font-size: 1rem; color:#fff; font-family: var(--pointfont); clear: both; position: absolute; width: fit-content; height: fit-content; top:-20%; left: -27%; text-align: center;}
}

@media (pointer:coarse) {
    #cursor {display: none;}
}

#header {position: fixed; left:50%; transform: translateX(-50%); top: 20px; width: 95%; z-index: 10; color: #fff; backdrop-filter: blur(10px); padding: 0 2.5%; transition:  0.45s; text-align: center;}
#header.on {backdrop-filter: blur(0); background: var(--pointcolor);}
#header .wrap {gap: 1.5rem;}
#header .logo {width: 14rem;}
#header .gnb {gap: 5rem;}
#header .gnb li.depth01 {padding: 1.5rem 0; cursor: pointer; }

#header .lnb {position: absolute; left: 50%; top: 4.5rem; transform: translateX(-50%); background: #fcfcf8; width: 14rem; padding: 1rem 0; opacity: 0; visibility: hidden; transition: 0.45s;}
#header .lnb.on {opacity: 1; visibility: visible;}
#header .lnb a {display: block; width: fit-content; margin: auto; padding: 0.5rem 0; transition: 0.45s ease; position: relative; font-weight: 400;}
#header .lnb a:after {position: absolute; left: 0; bottom: 10px; width: 0; height: 1px; background: var(--pointcolor); content: ""; transition: 0.8s;}
#header .lnb a:hover {color: var(--pointcolor); font-weight: 600;}
#header .lnb a:hover:after {width: 100%;}

#header .login {width: 10%; justify-content: flex-end; margin-left: 1.5%;}
#header .login li {padding: 0 1rem; position: relative;}
#header .login li:first-child:after {position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 60%; background: #fff; content: "";}
#header .login a {color: #fff;}


#header .hamburger {cursor: pointer; width: 10%;}

@media(max-width:1440px) {
    #header .gnb {gap: 3.5rem;}
}

@media(min-width:991px) {
    #header:hover {backdrop-filter: blur(0); background: var(--pointcolor);}
}

@media(max-width:1240px) {
    #header .hamburger {width: fit-content;}
    #header .login {width: fit-content;}
    #header .login img {width: fit-content; transform: scale(0.8);}
}

@media(max-width:990px) {
    #header {padding: 1.5rem 5%;}
    #header .gnb {display: none;}
    #header .logo  {width: auto;}
}

@media(max-width:420px) {
    #header .logo  {width: 18rem;}
}

/* 퀵메뉴 */
#quick {position: fixed; right: 0; bottom: 5%;  z-index: 5;}
/* #quick ul { background: #233217;} */
#quick ul li {width: 3.75rem; height: 3.75rem; position: relative; transition: 0.3s;}
#quick ul li a {position: relative; display: block; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
#quick ul li a:after {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: 0.3; content: "";}
#quick ul li a img {width: 1.5625rem; position: relative; z-index: 2;}

#quick ul li div {gap: 1rem; position: absolute; right: -100%; top: 50%; transform: translateY(-50%); z-index: 1; width: max-content; padding: 0 1.5rem; opacity: 0; transition: 0.6s; background: #233217; height: 3.75rem; color: #fff; z-index: -1; visibility: hidden;}
#quick ul li:hover {background: #233217;}
#quick ul li:hover div {opacity: 1; right: 3.5rem; visibility: visible;}

#quick ul li.goTop {background: #c1a460; cursor: pointer; display: flex; align-items: center; justify-content: center;}

@media(max-width:768px) {
    #quick {right: auto; left: 50%; transform: translateX(-50%); bottom: 0;}
    #quick ul {display: flex; background: transparent; gap: 1px;}
    #quick ul li {width: 6.5rem; height: 6.5rem;}
    #quick ul li a img {width: 2.5rem;}   

    #quick ul li div {display: none;}
}

@media(max-width:420px) {
    #quick {width: 100%;} 
    #quick ul {width: 100%;} 
    #quick ul li {width: calc(100% / 6);}
}

/* 푸터 */
footer {padding: 40px 0; color: #4c4c4c;}
footer .font-13 {font-size: 13px;}
footer .wrap {width: 90%; margin: auto;}
footer .logo img {width: 23rem;}
footer ul {column-gap: 3rem; row-gap: 1.5rem; flex-wrap: wrap;}
footer ul.nav a {width: fit-content; text-decoration: underline; text-underline-offset: 3px;}

@media(max-width:768px) {
    footer {padding: 40px 0 100px;}
    footer .font-16 {font-size: 1.625rem;}
    footer .font-13 {font-size: 1.75rem;}

    footer .flex-between {flex-direction: column; align-items: flex-start; gap: 3rem;}
    footer .mt-30 {margin-top: 4rem;}
    footer ul.infor {flex-direction: column;}
}

/* 풀메뉴 */
#fullmenu {background-image: url("/img/main/fullmenu_bg.jpg"); background-size: cover; background-position: center; position: fixed; left: 0; top: -100%; z-index: 50; width: 100%; color: #fff; height: 100%; transition: 0.5s; opacity: 0; visibility: hidden; padding: 6.25rem 0;}
#fullmenu.on {top: 0; opacity: 1; visibility: visible;}
#fullmenu .max1440 { overflow-y: scroll; height: 100%;}
#fullmenu .logo {display: none;}
#fullmenu .close {position: absolute; left: 1.5rem; top: 1.5rem; cursor: pointer; opacity: 0.6;}
#fullmenu a {color: #fff;}
#fullmenu .gnb {align-items: flex-start; padding-top: 2rem;}
#fullmenu .depth01 span {font-size: 1.5625rem; font-weight: 500;}
#fullmenu .lnb {margin-top: 1.25rem; display: block;}
#fullmenu .depth02 {padding-top: 1.25rem; font-size: 1.125rem;}
#fullmenu .depth02 a {font-weight: 400; position: relative;}
#fullmenu .depth02 a:after {position: absolute; left: 0; bottom: 0; width: 0%; height: 1px; background: var(--sub2color); content: ""; transition: 0.45s;}
#fullmenu .depth02 a:hover {font-weight: 600; color: var(--sub2color);}
#fullmenu .depth02 a:hover:after {width: 100%;}

#fullmenu .cont_box {border-top: 1px solid rgba(255,255,255,0.5); align-items: flex-start;}
#fullmenu .btn-wrap {gap: 2rem;}
#fullmenu .moreBtn {width: fit-content; border: 1px solid rgba(255,255,255,0.5);}
#fullmenu .moreBtn:hover {border: 1px solid var(--pointcolor);}

#fullmenu .cont {gap: 3rem;}
#fullmenu .cont .box {flex-wrap: wrap;}
#fullmenu .cont .box li {width: 55%; opacity: 0.5; height: 2rem;}
#fullmenu .cont .box li:nth-child(even) {padding-left: 1rem; width: 45%;}
#fullmenu .cont .box li .day {width: 5rem; text-align: justify; position: relative; display: block;}
#fullmenu .cont .box li .day:after {content: ''; display: inline-block; width: 100%;}

#fullmenu ::-webkit-scrollbar {display: none;}


@media(max-width:1580px) {
    #fullmenu .max1440 {width: 90%;}   
}

@media(max-width:1440px) {
    #fullmenu .cont_box {flex-direction: column; gap: 1.5rem;}
    #fullmenu .cont {width: 80%;}
}

@media(max-width:1240px) {
    #fullmenu .max1440 {width: 90%;}  
    #fullmenu .cont {width: 85%;}
}

@media(max-width:990px) {
    #fullmenu {width: 32rem; left: auto; right: -100%; top: 0; padding: 80px 0; background-image: url("/img/main/fullmenu_bg_m.jpg"); height: 100%;}
    #fullmenu.on {right: 0;}
    #fullmenu .close {left: -5rem; top: 80px; opacity: 1;}
    #fullmenu .max1440 {width: 70%; display: flex; flex-direction: column; justify-content: space-between;}  
    #fullmenu .gnb {flex-direction: column;}
    #fullmenu .depth01 { padding: 1.5rem 0; width: 100%;}
    #fullmenu .depth01:first-child {padding-top: 0;}
    #fullmenu .depth01 span {font-size: 2.5rem; font-weight: 600; width: 100%; display: block; position: relative;}
    #fullmenu .depth01 span:after {position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 2rem; height: 3px; background: #b2b2b2; content: "";}
    #fullmenu .depth01 span::before {position: absolute; right: 0.8rem; top: 50%; transform: translateY(-50%); height: 2rem; width: 3px; background: #b2b2b2; content: ""; transform: 0.4s;}
    #fullmenu .depth01.on span:before {opacity: 0;}
    #fullmenu .lnb {margin-top: 0; display: none;}
    #fullmenu .depth02 {font-size: 1.6875rem; padding-top: 1rem;}
    #fullmenu .depth02:first-child {padding-top: 1.5rem;}

    #fullmenu .cont_box {border: none; padding-top: 0;}
    #fullmenu .cont {display: none;}

    #fullmenu .btn-wrap {flex-wrap: wrap; width: 100%; margin-top: 0;}
    #fullmenu a.moreBtn {border: 1px solid rgba(255,255,255,0.5) !important; padding: 1.25rem 4rem;}
    #fullmenu a.moreBtn .font-16 {font-size: 1.5rem;}
}

@media(max-height: 751px) {
    #fullmenu {padding: 50px 0;}
    #fullmenu .cont_box {margin-top: 3rem !important;}
}

@media(max-width:380px) {
    #fullmenu .close  {left: 2rem; top: 2rem;}
}

@media(max-width:340px) {
    #fullmenu {width: 100%;}

}