@charset "UTF-8";
/* 입학 리뉴얼 메인 + 서브 공통. 공용 규칙은 type/common/renewal/ */

:root {
    --rn-point: #002DAD;
}

/* 공용 CSS body height 100% 해제. 없으면 고정 헤더가 중간에 풀림 */
body {
    min-height: 100%;
    height: auto;
}

/* 예전 헤더용 top: 70px 해제, 새 헤더는 흐름 안에 있음 */
.typeSub #contents {
    top: 0;
}

/* 본문 바로가기 도착점 외곽선이 빈 줄로 보이지 않게 */
.rn-skip-target:focus { outline: 0; }

/* ---------- 헤더 (시안 505:2493 PC, 655:24936 모바일) ----------
   공용 renewal_header.css 는 GNB 만 고정(top: -32px). 입학은 UNB 까지 통째로 고정 */
/* 확대 배율·소수 DPR 에서 스크롤 위치가 기기 픽셀 사이에 걸리면 sticky 헤더 위 가장자리 1줄에
   본문이 비침(::before 로 덧대도 레이어 경계에서 잘림) → 가장자리를 화면 밖 1px 로 올림.
   margin -1 / padding 1 로 문서 흐름·보이는 위치는 그대로 */
.rn-header[data-rn-gnb="split"] {
    --rn-point: #002dad;
    top: -1px;
    margin-top: -1px;
    padding-top: 1px;
    background: #0a2240;
}

/* 앵커·포커스 대상이 고정 헤더(UNB 42 + GNB 64)에 안 가리게 */
html { scroll-padding-top: 106px; }

.rn-header[data-rn-gnb="split"] .rn-unb { background: #0a2240; }

.rn-header[data-rn-gnb="split"] .rn-unb__inner { height: 42px; }

.rn-header[data-rn-gnb="split"] .rn-unb__sites li a {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 4px 8px;
    color: #ccc;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: -0.15px;
}

.rn-header[data-rn-gnb="split"] .rn-unb__sites a.is-current {
    background: #002dad;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.rn-header[data-rn-gnb="split"] .rn-unb__cta { gap: 4px; }

.rn-header[data-rn-gnb="split"] .rn-unb__cta a {
    gap: 4px;
    height: 32px;
    padding: 0 8px;
    font-size: 16px;
    letter-spacing: -0.24px;
}

.rn-header[data-rn-gnb="split"] .rn-unb__cta a.rn-unb__cta-sub { background: #002dad; }

.rn-header[data-rn-gnb="split"] .rn-unb__cta a.is-point {
    background: #ffdc00;
    color: #222;
}

.rn-header[data-rn-gnb="split"] .rn-unb__cta img {
    display: none;
    width: 20px;
    height: 20px;
}
 

/* 시안에 GNB 아래 줄 없음 */
.rn-header[data-rn-gnb="split"] .rn-gnb-bar {
    border-bottom: 0;
    background: linear-gradient(90deg, #002dae, #00115b);
}

.rn-header[data-rn-gnb="split"] .rn-gnb-bar__inner { padding: 0 16px; }

.rn-header[data-rn-gnb="split"] .rn-logo img {
    width: 138.333px;
    height: 40px;
}
.rn-util__link img{
    display: none;
}
.rn-header[data-rn-gnb="split"] .rn-util__link {
    gap: 6px;
    color: #fff;
    font-size: 16px;
    letter-spacing: -.24px;
}
.rn-util__menu.rn-util__pc:focus,
.rn-header[data-rn-gnb="split"] .rn-util__link:focus{
    outline-color: #ffffff;
}
/* 시안 아이콘은 24px 틀보다 살짝 큼(자물쇠 17.8×19.8, 햄버거 19.4×15.4) */
.rn-header[data-rn-gnb="split"] .rn-util__link img { padding: 2.1px 3.1px; }

.rn-header[data-rn-gnb="split"] .rn-util__menu img { padding: 4.3px 2.3px; }

.rn-header[data-rn-gnb="split"] .rn-util__bar { background: rgba(255,255,255,0.4); }

.rn-header[data-rn-gnb="split"] .rn-unb__sites li + li { border-left-color: #192F4B; }

/* 닫기(X) 아이콘은 20px 라 따로 */
.rn-header[data-rn-gnb="split"] .rn-util__menu img.rn-util__menu-close { padding: 2px; }

@media screen and (min-width: 768px) {
    html { scroll-padding-top: 120px; } /* UNB 40 + GNB 80 */

    .rn-header[data-rn-gnb="split"] .rn-unb__inner {
        height: 40px;
        padding: 0 16px;
    }

    .rn-header[data-rn-gnb="split"] .rn-unb__sites li a {
        padding: 4px 16px;
        letter-spacing: -0.3px;
    }

    .rn-header[data-rn-gnb="split"] .rn-unb__cta {
        gap: 4px;
        padding: 0 2px;
    }

    .rn-header[data-rn-gnb="split"] .rn-unb__cta a {
        gap: 8px;
        padding: 0 12px;
        font-size: 18px;
        letter-spacing: -0.27px;
    }

    .rn-header[data-rn-gnb="split"] .rn-unb__cta img { display: block; }

    .rn-header[data-rn-gnb="split"] .rn-logo img {
        width: 166px;
        height: 48px;
    }

    .rn-header[data-rn-gnb="split"] .rn-util { gap: 16px; }
    .rn-quick {
        display: flex;
    }
}

@media screen and (min-width: 1440px) {
    /* 시안: 로고·유틸 영역 180px, 학과소개·No.1 SDU 도 GNB 메뉴 */
    .rn-header[data-rn-gnb="split"] .rn-logo,
    .rn-header[data-rn-gnb="split"] .rn-util {
        /* flex: 1 1 0; */
        min-width: 180px;
        width: auto;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb-bar__inner { gap: 40px; }

    .rn-header[data-rn-gnb="split"] .rn-gnb__link { color: #fff; outline-color: #ffffff;}

    /* 시안: 180 칸에 로고 173 을 왼쪽 4px 띄워 둠. 양쪽 4px 면 로고가 172 로 줄어듦 */
    .rn-header[data-rn-gnb="split"] .rn-logo { padding: 0 0 0 4px; }

    .rn-header[data-rn-gnb="split"] .rn-gnb__item--util:not(.is-hidden) { display: block !important; }
    .rn-quick {
        display: flex;
    }
}

/* PC 서브 SNB 는 스크롤 시 화면 맨 위(layout.css top: 0)에 붙음 → 고정 헤더 아래로.
   모바일(typeMobile)은 layout_mob.css 값으로 이미 헤더 아래에 보여서 그대로 */
.typePc #snb_nav.sticky { top: 106px; }

@media screen and (min-width: 768px) {
    .typePc #snb_nav.sticky { top: 120px; }
}

/* ---------- 플로팅 상담 버튼 (시안 853:8945) ---------- */
.rn-quick {
    position: fixed;    
    right: 8px;
    bottom: 16px;
    z-index: 999; /* 헤더(1000) 아래 */
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    display: none;
    gap: 8px;
    font-family: var(--rn-font);
}

.rn-quick__item {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    width: 56px;
    height: 56px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 16px;
    background: rgba(217, 217, 217, 0.8);
    /* 그림자를 부모 filter 로 주면 그 안에서만 흐려져 블러가 안 보인다 — 칸마다 box-shadow 로 */
    box-shadow: 0 16px 15px rgba(0, 0, 0, 0.08);
    -webkit-backdrop-filter: blur(17.5px);
    backdrop-filter: blur(17.5px);
    color: #222;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.48;
    letter-spacing: -0.24px;
    text-decoration: none;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.9);
    white-space: nowrap;
    cursor: pointer;
}

.rn-quick__item:hover,
.rn-quick__item:focus { color: #222; text-decoration: none; }

.rn-quick__item:focus-visible {
    outline: 2px solid #00105C;
    outline-offset: 2px;
}

.rn-quick__item--top[hidden] { display: none; }

.rn-quick__item--top {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .25s ease, transform .25s ease, visibility 0s .25s;
}

.rn-quick__item--top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    transition-delay: 0s;
}

@media (prefers-reduced-motion: reduce) {
    .rn-quick__item--top { transition: none; }
}

.rn-quick__item--kakao { background: rgba(255, 224, 30, 0.9); }

.rn-quick__item img {
    display: block;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.9));
}

.rn-quick__item--kakao img { width: 22px; }

@media screen and (max-width: 375px) {

    .rn-header[data-rn-gnb="split"] .rn-unb__sites li a{
        padding: 4px;
        font-size: 14px;
        letter-spacing: -0.15px;        
    }
    .rn-unb .rn-unb__sites li:first-child a {
        padding-left: 4px;
    }

    .rn-header[data-rn-gnb="split"] .rn-unb__cta a{
        gap: 4px;
        height: 32px;
        padding: calc(0.04em * 1) 4px 0;
        font-size: 14px;
        letter-spacing: -0.24px;
    }
}
@media screen and (min-width: 375px) {
    .rn-util__link img{
        display: block;
    }   
}


@media screen and (min-width: 768px) {
    
    /* 시안 1920: 오른쪽 6px, 위 405px */
    .rn-quick {
        top: 405px;
        right: 6px;
        bottom: auto;
        display: flex;
    }
 
    .rn-quick__item {
        gap: 4px;
        width: 68px;
        height: 68px;
        padding: 16px 8px 12px;
        border-radius: 20px;
        font-size: 13px;
        letter-spacing: -0.26px;
    }

    .rn-quick__item img { height: 20px; }

    .rn-quick__item:not(.rn-quick__item--kakao):not(.rn-quick__item--top) img {
        width: 24px;
        height: 24px;
    }

    .rn-quick__item--top {
        font-size: 14px;
        letter-spacing: -0.28px;
    }
}

/* ---------- 메뉴 패널 (~1439): 운영 IPSI_2025 모바일 메뉴 구조 ----------
   헤더 아래에서 왼쪽→오른쪽으로 열림, 좌측 1차(136px)·우측 2차, 3차는 아코디언.
   동작은 renewal_common.js RN.header 의 data-rn-gnb="split" */
.rn-util__menu-close { display: none !important; }

@media screen and (max-width: 1439px) {
    .rn-header[data-rn-gnb="split"] {
        --rn-gnb-dep1-w: 136px;
        --rn-gnb-dep1-bg: #363636;
        --rn-gnb-on: #002DAD; /* 시안 Highlight-Ent. 사이트 --rn-point(#7043e1) 와 다름 */
    }

    .rn-header.is-open .rn-util__menu-open { display: none !important; }

    .rn-header.is-open .rn-util__menu-close {
        display: block !important;
        padding: 2px;
    }

    /* 운영엔 dim 이 없음. 투명하게 두고 패널 밖 눌러 닫기만 */
    .rn-header[data-rn-gnb="split"] .rn-dim {
        top: var(--rn-gnb-top, 0px);
        background: none;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb {
        top: var(--rn-gnb-top, 0px);
        right: auto;
        bottom: 0;
        left: 0;
        width: 100%;
        max-width: 768px;
        height: auto;
        transform: translateX(-100%);
        /* PC에서 모바일로 전환될 때 닫힌 패널을 즉시 숨긴다. */
        visibility: hidden;
        transition: transform 0.2s;
    }

    .rn-header[data-rn-gnb="split"].is-open .rn-gnb {
        transform: none;
        visibility: visible;
    }

    /* 상단은 헤더(로고·메뉴 버튼)가 그대로 보여서, 하단 버튼은 UNB·메뉴에 같은 링크가 있어서 숨김 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__head,
    .rn-header[data-rn-gnb="split"] .rn-gnb__cta { display: none; }

    .rn-header[data-rn-gnb="split"] .rn-gnb__list {
        position: relative;
        display: flex;
        flex-direction: column;
        padding: 0;
        background: linear-gradient(to right, var(--rn-gnb-dep1-bg) var(--rn-gnb-dep1-w), #fff var(--rn-gnb-dep1-w));
    }

    /* 1차 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__item {
        flex-wrap: nowrap;
        align-items: stretch;
        width: var(--rn-gnb-dep1-w);
        border: 0;
    }

    /* 시안대로 학과소개, NO.1 SDU 는 맨 아래. DOM 순서는 snb 인덱스와 맞춰야 해서 그대로 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__item--dept { order: 10; }

    .rn-header[data-rn-gnb="split"] .rn-gnb__item--no1 { order: 11; }

    .rn-header[data-rn-gnb="split"] .rn-gnb__link {
        display: flex;
        flex: 0 0 var(--rn-gnb-dep1-w);
        align-items: center;
        min-height: 56px;
        padding: 8px 16px;
        color: #fff;
        font-size: 17px;
        font-weight: 300;
        line-height: 1.3;
        letter-spacing: -0.51px;
        word-break: keep-all;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__link:hover { color: #fff; }

    /* 시안엔 학과소개·NO.1 SDU 전용 아이콘·노랑 선택색이 없음 — 다른 1차와 같게 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__item.is-open > .rn-gnb__link {
        background: var(--rn-gnb-on);
        font-weight: 600;
    }

    /* 1차 칸 전체를 덮는 선택 버튼 (운영은 1차 누르면 이동 없이 2차 표시) */
    .rn-header[data-rn-gnb="split"] .rn-gnb__item > .rn-gnb__toggle {
        flex: 0 0 var(--rn-gnb-dep1-w);
        height: auto;
        margin-left: calc(var(--rn-gnb-dep1-w) * -1);
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__item > .rn-gnb__toggle::before { display: none; }

    .rn-header[data-rn-gnb="split"] .rn-gnb__item > a:focus-visible,
    .rn-header[data-rn-gnb="split"] .rn-gnb__item > button:focus-visible { outline-color: #fff; }

    /* 2차: 오른쪽 칸, 선택된 것만 보이고 왼쪽에서 밀려 들어옴 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__panel {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        display: block;
        width: calc(100% - var(--rn-gnb-dep1-w));
        overflow-x: hidden;
        overflow-y: auto;
        border-top: 1px solid #e9e9e9;
        background: #fff;
        visibility: hidden;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__item.is-open > .rn-gnb__panel {
        z-index: 1;
        visibility: visible;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 {
        padding: 0 24px;
        background: none;
        opacity: 0;
        transform: translateX(45%);
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__item.is-open .rn-gnb__dep2 {
        opacity: 1;
        transform: none;
        transition: opacity 0.2s, transform 0.2s;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 > li { position: relative; }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 > li > a {
        display: flex;
        align-items: center;
        min-height: 52px;
        padding: 8px 20px 8px 0;
        border-bottom: 1px solid #e9e9e9;
        color: #222;
        font-size: 16px;
        font-weight: 500;
        line-height: 1.48;
        letter-spacing: -0.24px;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 > li > a:hover { color: var(--rn-gnb-on); }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 > li.is-open > a {
        border-bottom-color: var(--rn-gnb-on);
        color: var(--rn-gnb-on);
        font-weight: 600;
    }

    /* 3차 있는 2차: 줄 전체가 펼치기 버튼 (운영과 같음), 화살표는 오른쪽 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 .rn-gnb__toggle {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 52px;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 .rn-gnb__toggle::before {
        left: auto;
        right: 2px;
        border-width: 0 1.8px 1.8px 0;
        border-color: #222;
        transform: translateY(-75%) rotate(45deg);
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 .rn-gnb__toggle[aria-expanded="true"]::before {
        border-color: var(--rn-gnb-on);
        transform: translateY(-25%) rotate(-135deg);
    }

    /* 3차 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__dep3 {
        padding: 8px 0;
        background: rgba(0, 111, 235, 0.05);
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep3 a {
        display: flex;
        align-items: center;
        min-height: 36px;
        padding: 4px 16px;
        color: #545454;
        font-size: 15px;
        font-weight: 300;
        line-height: 1.3;
    }

    /* 시안 불릿은 점이 아니라 4px 짧은 선 */
    .rn-header[data-rn-gnb="split"] .rn-gnb__dep3 a::before {
        flex-shrink: 0;
        width: 4px;
        height: 1px;
        margin-right: 8px;
        background: currentColor;
        content: '';
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep3 a:hover { color: var(--rn-gnb-on); }
}

/* =========================================================
   박스 안 한 줄 글자 세로 가운데 보정 (입학 메인 renewal_main.css 와 같은 방식)
   한글 잉크가 줄 상자보다 위로 치우친 만큼(실측) 위 여백을 옮긴다. 높이는 그대로
   ========================================================= */
:root {
    --rn-text-shift: .04em;     /* Pretendard, 짧은 라벨 */
    --rn-text-shift-lg: .115em; /* S-Core Dream 한글 */
    /* 버튼 아이콘을 글자 잉크 가운데에: S-Core Dream 한글 잉크 가운데가 줄 가운데보다 위인 만큼 (실측).
       Pretendard 는 아이콘이 글자와 같이 내려가기만 하면 맞아서 따로 없음 */
    --rn-text-ink-lg: -.09em;
}

.rn-header[data-rn-gnb="split"] .rn-unb__sites li a,
.rn-header[data-rn-gnb="split"] .rn-unb__cta a {
    --rn-shift: var(--rn-text-shift);
}

.rn-header[data-rn-gnb="split"] .rn-unb__sites li a {
    padding-top: calc(4px + var(--rn-shift) * 2);
}

.rn-header[data-rn-gnb="split"] .rn-unb__cta a {
    padding-top: calc(var(--rn-shift) * 2);
}



/* 모바일 메뉴 패널 */
@media screen and (max-width: 1439px) {
    .rn-header[data-rn-gnb="split"] .rn-gnb__link {
        --rn-shift: var(--rn-text-shift-lg);
        padding-top: calc(8px + var(--rn-shift) * 2);
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__dep2 > li > a {
        --rn-shift: var(--rn-text-shift);
        padding-top: calc(8px + var(--rn-shift));
        padding-bottom: calc(8px - var(--rn-shift));
    }
}

/* GEO 승인 문안은 화면 요소가 아니다 — IncGeoData.jsp 의 값을 IncSeoHead.jsp 가
   JSON-LD(WebPage.abstract/citation)로만 내보낸다(담당자 결정 2026-11-04). 전용 CSS 없음. */
.rn-logo-heading {
    display: flex;
    align-items: center;
    flex: none;
    margin: 0;
    padding: 0;
    font: inherit;
    line-height: inherit;
}

/* Reveal submenu and background together, clipping text during expansion. */
@media screen and (min-width: 1440px) {
    .rn-header[data-rn-gnb="split"] .rn-gnb-bar::after {
        transition: height 0.2s ease-out, opacity 0.2s ease-out, visibility 0s;
    }

    .rn-header[data-rn-gnb="split"] .rn-gnb__panel {
        opacity: 0;
        visibility: hidden;
        clip-path: inset(0 0 100% 0);
        transition: none;
    }

    .rn-header[data-rn-gnb="split"].is-gnb-open .rn-gnb__item.is-active > .rn-gnb__panel {
        opacity: 1;
        visibility: visible;
        clip-path: inset(0);
        transition: opacity 0.2s ease-out, clip-path 0.2s ease-out;
    }
}

@media screen and (min-width: 1440px) and (prefers-reduced-motion: reduce) {
    .rn-header[data-rn-gnb="split"] .rn-gnb-bar::after,
    .rn-header[data-rn-gnb="split"].is-gnb-open .rn-gnb__item.is-active > .rn-gnb__panel {
        transition: none;
    }
}
