.scrlLock { overflow-y: hidden; }

#header { position: fixed; left: 0; top: 0; width: 100%; z-index: 20; backdrop-filter: blur(20px); background: rgba(255, 255, 255,.75); transform: translateY(0); transition: transform .5s; }
#header.on { box-shadow: 0 .25rem .5rem rgba(0,0,0,.1); }
#header.up { transform: translateY(-100%); }
#header .wrap { width: var(--layoutwidth); margin: auto; }
#header .logo { width: 9.5rem; }
#header .gnb { display: flex; justify-content: center; gap: 2.75rem; }
#header .gnb > li { position: relative; }
#header .gnb > li > span { display: inline-block; color: #111; font-weight: 500; cursor: pointer; padding: 2rem 0; }
#header .gnb .point-font { letter-spacing: .5px; }
#header .lnb { display: block; position: absolute; left: 50%; top: 5.5rem; transform: translateX(-50%); width: 12.5rem; background: rgba(255, 255, 255,.75); text-align: center; padding: 1rem; border-top: 2px solid var(--pointcolor); opacity: 0; visibility: hidden; transition: .5s; }
#header .lnb.on { opacity: 1; visibility: visible; }
#header .lnb li a { position: relative; display: block; color: #111; padding: .75rem 0; font-weight: 400; transition: .5s; }
#header .lnb li:hover > a { color: var(--pointcolor); font-weight: 700; }
#header .lnb li.hasChild { position: relative; }
#header .depth3 { position: absolute; width: 100%; border-top: 2px solid var(--pointcolor); right: calc( -100% - 1.25rem ); top: 0; background: rgba(255, 255, 255,.75); opacity: 0; visibility: hidden; transition: .5s; }
#header .depth3.on { opacity: 1; visibility: visible; }
#header .depth3 li a { display: block; padding: .75rem 0; color: #111; }
#header .register_wrap a:not(:first-child) { margin-left: 1rem; }
#header .burger { display: none; }
#header .burger span { display: block; width: 40px; height: 4px; background: var(--pointcolor); transition: .25s; }
#header .burger span:not(:first-child, :last-child) { margin: .75rem 0; }
@media(max-width:1720px){
    #header .wrap { width: 90%; margin: 1rem auto; }
    #header .gnb, #header .register_wrap { display: none; }
    #header .burger { display: block; }
}
@media(max-width:990px){
    #header .logo { width: 25%; }
    #header .wrap { margin: 2rem auto; }
}

#google_translate_view { 
    position: fixed; display: inline-flex; min-width: 180px; min-height: 30px; margin: 5px;
    border: 1px solid #ccc; border-radius: .25rem; background-color: #fff; padding: 0 .25rem;
    cursor: pointer; z-index: 995; top: 100px;
}
#google_translate_view > img { width: 16px; height: auto; aspect-ratio: 1/1; }
#google_translate_view::before {
    position: absolute; content: 'Select Language'; display: block;
    top: 50%; left: 30px; transform: translateY(-50%); font-size: .75rem; font-weight: 700;
    width: fit-content; color: #111; letter-spacing: -.5px; 
}
#google_translate_view::after {
    position: absolute; content: '▼'; font-size: .75rem; color: #666;
    transform: translateY(-50%); top: 50%; right: 8px; cursor: pointer;
} 
#google_translate_box { position: fixed; top: 140px; display: none; z-index: 995; }
#translation-links { min-width: calc(200px - .5rem ); margin: 0 .25rem; background-color: #fff; display: inline-block; border: 1px solid #ccc; border-radius: .25rem; }
#translation-links > li { padding: .25rem .5rem; font-size: .75rem; transition: background-color .2s; letter-spacing: -.5px; }
#translation-links > li:hover { background-color: #f1f1f1; }
#translation-links > li > a { display: flex; justify-content: space-between; color: #333; font-weight: 400; }
#translation-links > li img.flag { width: 16px; height: 16px; border-radius: 50%; overflow: hidden; object-fit: cover; border: 1px solid #eee; }
#goog-gt-tt { display: none !important; }

@media(max-width: 990px){
    #google_translate_view { min-width: 40%; top: 1.25rem; right: calc(5% + 5rem); }
    #google_translate_view::before, #translation-links > li  { font-size: 1.25rem; }
    #translation-links > li { padding: .75rem; }
    #translation-links > li img.flag { width: 20px; height: 20px; }
    #google_translate_box { top: 50px; right: calc(5% + 5rem); }
}

#fullMenu { position: fixed; top: 0; right: -100vw; width: 100%; height: 100vh;  z-index: 100; transition: .5s; opacity: 0; }
#fullMenu.on { right: 0; opacity: 1; }
#fullMenu .cover { display: none; position: fixed; top: 0; left: 0; width: 100%; height: inherit; background: rgba(0,0,0,.5); }
#fullMenu.on .cover { display: block; }
#fullMenu .inner { position: fixed; right: -100vw; top: 0; width: 75%; height: inherit; background-color: #fff; z-index: 101; transition: .5s; overflow-y: auto; }
#fullMenu.on .inner { right: 0; }
#fullMenu .header { margin: 0 2rem; padding: 1rem 0; border-bottom: 1px solid #ebebeb; }
#fullMenu .header .logo { width: 35%; }
#fullMenu .fnb { margin: 2rem 0; }
#fullMenu .fnb > li .lnb { display: none; padding: 2rem 0; }
#fullMenu .fnb > li .lnb { background: rgba(var(--pointcolor-rgb),.1); }
#fullMenu .fnb > li .lnb li a { display: block; padding: 1rem 5rem; font-size: 2.15rem; }
#fullMenu .fnb > li .lnb li a:hover { color: var(--pointcolor); font-weight: 700; }
#fullMenu .fnb > li { width: 100%; cursor: pointer; }
#fullMenu .fnb > li > span { display: block; padding: 1.5rem 3rem; font-size: 2.5rem; font-weight: 300; }
#fullMenu .fnb > li > span[cursor-class="hover"] { position: relative; }
#fullMenu .fnb > li > span[cursor-class="hover"]::before,
#fullMenu .fnb > li > span[cursor-class="hover"]::after {
    position: absolute; content: ''; background: var(--pointcolor); transition: .25s;
    width: 30px; height: 1px; right: 3rem; top: 50%; opacity: 1;
}
#fullMenu .fnb > li > span[cursor-class="hover"]::before { transform: translateY(-50%); }
#fullMenu .fnb > li > span[cursor-class="hover"]::after { transform: translateY(-50%) rotate(90deg); }
#fullMenu .fnb > li.active > span { color: var(--pointcolor); font-weight: 700; }
#fullMenu .fnb > li.active > span[cursor-class="hover"]::before { transform: translateY(-50%) rotate(90deg); opacity: 0; }
#fullMenu .fnb > li.active > span[cursor-class="hover"]::after { transform: translateY(-50%) rotate(0deg); }
#fullMenu .login { margin: 0 3rem; padding: 2rem 0; border-top: 1px solid #ebebeb; }
#fullMenu .login a { display: inline-block; margin-right: 2rem; font-size: 1.5rem; }

#footer { padding: 120px 0; background: #39322c; }
#footer h2 { width: 25%; }
#footer .info { color: rgba(255,255,255,.75); }
#footer .info ul li { line-height: 1; }
#footer .info ul li:first-child { padding-right: 1rem; }
#footer .info ul li:nth-child(2) { padding-right: 1rem; }
#footer .info ul li:not(:first-child) { padding-left: 1rem; border-left: 1px solid rgba(255,255,255,.75); }

@media(max-width:990px){
    #footer { padding: 90px 0; }
    #footer h2, #footer .info { width: 100%; }
    #footer .info { margin-top: 4rem; }
    #footer .info ul { display: block; margin-top: 0; }
    #footer .info ul li { line-height: 1.4; }
    #footer .info ul li:first-child { padding-right: 0; }
    #footer .info ul li:not(:first-child) { padding-left: 0; border-left: none; }
}

#quick { display: block; position: fixed; right: 2.5rem; bottom: 3rem; z-index: 50; }
#quick li[data-quick]:not(:first-child) { margin-top: 10px; }
#quick li[data-quick] a { width: 80px; height: 80px; border-radius: .5rem; display: flex; align-items: center; justify-content: center; flex-direction: column; overflow: hidden; box-shadow: 0 .125rem .25rem rgba(0,0,0,.1); }
#quick li[data-quick] a .icon { aspect-ratio: 1/1; margin-bottom: .25rem; }
#quick li[data-quick='call'] { position: relative; }
#quick li[data-quick='call'] samp { display: none; position: absolute; min-width: 200%; padding: .25rem 0; left: -220%; top: 50%; transform: translateY(-50%); background: #111; border-radius: .5rem; }
#quick li[data-quick='call'] a { background: linear-gradient(to bottom, rgba(250, 229, 215, .95), rgba(250, 229, 215, 1)); }
#quick li[data-quick='kakao'] a { background: #ffe600; }
#quick li[data-quick='insta'] a { background-image: linear-gradient(-135deg,rgb(214,64,137), rgb(228,68,111), rgb(246,83,77), rgb(252,112,68), rgb(252,134,70), rgb(252,168,76), rgb(252,200,84)); }
#quick li[data-quick='timetable'] a { background: var(--pointcolor); }
#quick li[data-quick='blog'] a { background: #00c300; }
#quick li[data-quick='event'] a { background: var(--subcolor); }
#quick li[data-quick='top'] a { background: #fff; }
@media(max-width:1720px){
    #quick { right: 2.5%; }
}
@media(max-width:990px){
    #quick { right: 2%; bottom: 2rem; }
    #quick li[data-quick] a { width: 70px; height: 70px; }
    #quick li[data-quick] a span { font-size: 1.25rem; }
}