/* 학교 TOP 전용 디자인. 본문과 이 페이지의 공통 정렬에만 적용됩니다. */

/* 실제 공통 헤더의 1120px 컨테이너·20px 여백을 기준으로 정렬합니다. */
body:has(#uhp-school-top) {
    --uhp-school-top-layout-max:1120px;
    --uhp-school-top-gutter:20px;
}

body:has(#uhp-school-top) .up-auto-page-title__inner {
    max-width:var(--uhp-school-top-layout-max);
    padding-left:var(--uhp-school-top-gutter);
    padding-right:var(--uhp-school-top-gutter);
}

/* 푸터 카드의 외곽선을 본문 카드의 좌우 끝에 맞춥니다. */
body:has(#uhp-school-top) .uhp-footer-inner {
    width:calc(100% - var(--uhp-school-top-gutter) * 2);
    max-width:calc(var(--uhp-school-top-layout-max) - var(--uhp-school-top-gutter) * 2);
    margin-left:auto;
    margin-right:auto;
}

@media (max-width:1024px) {
    body:has(#uhp-school-top) {
        --uhp-school-top-gutter:16px;
    }
}

/* 모바일 푸터는 기존 평면 형태를 유지하고 내부 여백을 맞춥니다. */
@media (max-width:640px) {
    body:has(#uhp-school-top) .uhp-footer-inner {
        width:100%;
        max-width:none;
        padding-left:var(--uhp-school-top-gutter);
        padding-right:var(--uhp-school-top-gutter);
    }
}

#uhp-school-top {
    --uhp-school-top-ink:#25233e;
    --uhp-school-top-muted:#706c80;
    --uhp-school-top-purple:#6942c3;
    --uhp-school-top-line:#e8e4ef;
    --uhp-school-top-soft:#f6f3fb;
    color:var(--uhp-school-top-ink);
    background:#fff;
    font:inherit;
    line-height:1.65;
    word-break:keep-all;
    overflow-wrap:anywhere;
    text-align:left;
}

#uhp-school-top * {
    box-sizing:border-box;
}

#uhp-school-top h2,#uhp-school-top h3,#uhp-school-top h4,#uhp-school-top p,#uhp-school-top dl,#uhp-school-top dd {
    margin:0;
    padding:0;
    color:inherit;
}

#uhp-school-top a {
    color:inherit;
    text-decoration:none;
}

#uhp-school-top button,#uhp-school-top input {
    font:inherit;
}

#uhp-school-top button {
    cursor:pointer;
    text-transform:none;
    letter-spacing:inherit;
}

#uhp-school-top svg {
    width:21px;
    height:21px;
    flex-shrink:0;
    vertical-align:middle;
}

#uhp-school-top img {
    display:block;
    max-width:100%;
    border:0;
}

#uhp-school-top [hidden] {
    display:none!important;
}

#uhp-school-top :is(a,button,input):focus-visible {
    outline:3px solid #835ade;
    outline-offset:4px;
}

#uhp-school-top .uhp-school-top-wrap {
    width:100%;
    max-width:var(--uhp-school-top-layout-max,1120px);
    margin:0 auto;
    padding-left:var(--uhp-school-top-gutter,20px);
    padding-right:var(--uhp-school-top-gutter,20px);
}

#uhp-school-top .uhp-school-top-hero {
    padding:50px 0 38px;
    background:#f7f5fa;
    border-bottom:1px solid var(--uhp-school-top-line);
}

#uhp-school-top .uhp-school-top-hero-grid {
    display:grid;
    grid-template-columns:1.05fr 1fr;
    gap:54px;
    align-items:center;
}

#uhp-school-top .uhp-school-top-brandline {
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:23px;
}

#uhp-school-top .uhp-school-top-brand {
    font-family:Arial,sans-serif;
    font-size:34px;
    font-weight:900;
    line-height:1;
    letter-spacing:-2px;
    color:var(--uhp-school-top-purple);
}

#uhp-school-top .uhp-school-top-brandline>span:last-child {
    font-size:12px;
    line-height:1.5;
    border-left:1px solid #d9d2e6;
    padding-left:12px;
    color:#777083;
}

#uhp-school-top .uhp-school-top-hero h2 {
    font-size:clamp(30px,3.2vw,43px);
    line-height:1.32;
    letter-spacing:-1.9px;
    font-weight:800;
}

#uhp-school-top .uhp-school-top-hero h2 span {
    display:block;
    color:var(--uhp-school-top-purple);
}

#uhp-school-top .uhp-school-top-intro {
    font-size:16px;
    color:#625d73;
    max-width:440px;
    margin-top:19px;
    line-height:1.85;
}

#uhp-school-top .uhp-school-top-hero-actions {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:26px;
}

#uhp-school-top .uhp-school-top-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:15px;
    padding:12px 19px;
    border-radius:8px;
    font-weight:750;
    font-size:14px;
    min-height:47px;
    white-space:nowrap;
    border:1px solid #dcd5e8;
    background:white;
    transition:background .18s,border-color .18s;
}

#uhp-school-top .uhp-school-top-btn-primary {
    background:var(--uhp-school-top-purple);
    border-color:var(--uhp-school-top-purple);
    color:white;
}

#uhp-school-top .uhp-school-top-btn:hover {
    background:#eee8fa;
    border-color:#bca4e6;
}

#uhp-school-top .uhp-school-top-btn-primary:hover {
    background:#5633a5;
    color:white;
}

#uhp-school-top .uhp-school-top-collage {
    position:relative;
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:12px;
    padding:12px 0 28px;
}

#uhp-school-top .uhp-school-top-photo {
    margin:0;
    height:306px;
    position:relative;
    border-radius:15px;
    overflow:hidden;
    background:#d7d7df;
}

#uhp-school-top .uhp-school-top-photo:nth-child(2) {
    height:257px;
    margin-top:49px;
}

#uhp-school-top .uhp-school-top-photo img {
    width:100%;
    height:100%;
    object-fit:cover;
}

#uhp-school-top .uhp-school-top-photo figcaption {
    position:absolute;
    bottom:24px;
    left:0;
    width:100%;
    padding:40px 16px 14px;
    background:linear-gradient(transparent,rgba(22,20,34,.8));
    color:#fff;
    font-size:15px;
    font-weight:750;
    line-height:1.4;
}

#uhp-school-top .uhp-school-top-photo figcaption small {
    font-size:10px;
    display:block;
    letter-spacing:.12em;
    opacity:.85;
    font-weight:500;
    margin-top:4px;
}

#uhp-school-top .uhp-school-top-hero-note {
    position:absolute;
    bottom:5px;
    left:22px;
    right:22px;
    padding:12px 17px;
    background:white;
    border:1px solid var(--uhp-school-top-line);
    border-radius:9px;
    box-shadow:0 8px 24px #2820410d;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    font-size:12px;
    color:var(--uhp-school-top-muted);
}

#uhp-school-top .uhp-school-top-hero-note strong {
    font-size:15px;
    color:var(--uhp-school-top-ink);
}

#uhp-school-top .uhp-school-top-stats {
    display:flex;
    gap:25px;
    margin-top:30px;
    flex-wrap:wrap;
    color:#787184;
    font-size:12px;
}

#uhp-school-top .uhp-school-top-stats span {
    display:flex;
    align-items:baseline;
    gap:6px;
}

#uhp-school-top .uhp-school-top-stats b {
    font-size:21px;
    line-height:1.1;
    color:var(--uhp-school-top-ink);
}

#uhp-school-top .uhp-school-top-section {
    padding:56px 0;
}

#uhp-school-top .uhp-school-top-section-heading {
    display:flex;
    justify-content:space-between;
    gap:22px;
    align-items:end;
    margin-bottom:24px;
}

#uhp-school-top .uhp-school-top-section h2 {
    font-size:27px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:-.9px;
}

#uhp-school-top .uhp-school-top-section-heading p {
    margin-top:8px;
    font-size:15px;
    color:var(--uhp-school-top-muted);
}

#uhp-school-top .uhp-school-top-textlink {
    font-size:13px;
    white-space:nowrap;
    color:var(--uhp-school-top-purple);
    display:inline-flex;
    gap:5px;
    align-items:center;
    font-weight:700;
}

#uhp-school-top .uhp-school-top-country-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}

#uhp-school-top .uhp-school-top-country {
    width:100%;
    display:block;
    text-align:left;
    background:white;
    border:1px solid var(--uhp-school-top-line);
    border-radius:11px;
    padding:19px 19px 16px;
    color:var(--uhp-school-top-ink);
    position:relative;
    box-shadow:none;
    transition:border-color .18s,background .18s;
}

#uhp-school-top .uhp-school-top-country:hover {
    border-color:#bba5e4;
    background:#faf8fe;
}

#uhp-school-top .uhp-school-top-country[aria-pressed=true] {
    border:2px solid var(--uhp-school-top-purple);
    padding:18px 18px 15px;
    background:#f8f5ff;
}

#uhp-school-top .uhp-school-top-country-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:15px;
}

#uhp-school-top .uhp-school-top-country-code {
    display:inline-flex;
    justify-content:center;
    align-items:center;
    width:34px;
    height:30px;
    background:#f2edf9;
    color:#7551ad;
    border-radius:5px;
    font-size:11px;
    letter-spacing:.06em;
    font-weight:800;
}

#uhp-school-top .uhp-school-top-country[data-uhp-school-top-filter=australia] .uhp-school-top-country-code {
    background:#eef4f9;
    color:#427299;
}

#uhp-school-top .uhp-school-top-country[data-uhp-school-top-filter=ireland] .uhp-school-top-country-code {
    background:#eef5ef;
    color:#4a7c5b;
}

#uhp-school-top .uhp-school-top-country[data-uhp-school-top-filter=india] .uhp-school-top-country-code {
    background:#faf1e7;
    color:#a4753b;
}

#uhp-school-top .uhp-school-top-country-count {
    font-size:12px;
    color:var(--uhp-school-top-muted);
}

#uhp-school-top .uhp-school-top-country strong {
    display:block;
    font-size:19px;
    font-weight:800;
    line-height:1.5;
}

#uhp-school-top .uhp-school-top-country small {
    display:block;
    font-size:11px;
    letter-spacing:.1em;
    color:#878093;
    margin:2px 0 9px;
}

#uhp-school-top .uhp-school-top-country-summary {
    display:block;
    font-size:12px;
    color:#777180;
}

#uhp-school-top .uhp-school-top-toolbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin:30px 0 18px;
}

#uhp-school-top .uhp-school-top-results-title {
    font-size:18px;
    font-weight:800;
    line-height:1.45;
}

#uhp-school-top .uhp-school-top-results-title b {
    color:var(--uhp-school-top-purple);
    margin-left:5px;
}

#uhp-school-top .uhp-school-top-search {
    position:relative;
    width:248px;
    flex-shrink:0;
}

#uhp-school-top .uhp-school-top-search svg {
    position:absolute;
    left:13px;
    top:13px;
    width:18px;
    height:18px;
    color:#9990a7;
}

#uhp-school-top .uhp-school-top-search input {
    display:block;
    width:100%;
    height:44px;
    border:1px solid var(--uhp-school-top-line);
    border-radius:7px;
    padding:10px 12px 10px 39px;
    background:#fff;
    color:var(--uhp-school-top-ink);
    font-size:13px;
    box-shadow:none;
    margin:0;
}

#uhp-school-top .uhp-school-top-search input::placeholder {
    color:#888293;
}

#uhp-school-top .uhp-school-top-sr {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
}

#uhp-school-top .uhp-school-top-country-lead {
    padding:15px 18px;
    background:#f7f6fa;
    border-radius:8px;
    color:#716980;
    font-size:13px;
    margin-bottom:20px;
}

#uhp-school-top .uhp-school-top-cards {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:17px;
    align-items:stretch;
}

#uhp-school-top .uhp-school-top-card {
    display:flex;
    flex-direction:column;
    border:1px solid var(--uhp-school-top-line);
    border-radius:12px;
    background:white;
    overflow:hidden;
    transition:border-color .2s,box-shadow .2s;
    min-width:0;
}

#uhp-school-top .uhp-school-top-card-link:hover,
#uhp-school-top .uhp-school-top-card-link:focus-visible {
    border-color:#c2b1df;
    box-shadow:0 7px 24px #39275208;
}

#uhp-school-top .uhp-school-top-card-top {
    padding:23px 22px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:113px;
}

#uhp-school-top .uhp-school-top-card-country {
    color:var(--uhp-school-top-purple);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    margin-bottom:5px;
}

#uhp-school-top .uhp-school-top-card h3 {
    font-size:23px;
    line-height:1.4;
    letter-spacing:-.6px;
    font-weight:800;
}

#uhp-school-top .uhp-school-top-card-en {
    font-size:12px;
    color:var(--uhp-school-top-muted);
    margin-top:2px;
    font-family:Arial,sans-serif;
}

#uhp-school-top .uhp-school-top-thumb {
    height:80px;
    width:85px;
    flex-shrink:0;
    border-radius:8px;
    overflow:hidden;
    background:#f3eff9;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#baa8d5;
    font-family:Arial,sans-serif;
    font-size:19px;
    font-weight:800;
    letter-spacing:-1px;
    position:relative;
}

#uhp-school-top .uhp-school-top-thumb img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}

#uhp-school-top .uhp-school-top-card-body {
    flex:1;
    padding:20px 22px 0;
}

#uhp-school-top .uhp-school-top-card h4 {
    font-size:15px;
    font-weight:750;
    line-height:1.5;
    margin-bottom:9px;
}

#uhp-school-top .uhp-school-top-card-desc {
    font-size:13px;
    color:#777080;
    line-height:1.85;
    min-height:72px;
}

#uhp-school-top .uhp-school-top-tags {
    display:flex;
    gap:5px;
    flex-wrap:wrap;
    margin:18px 0 19px;
}

#uhp-school-top .uhp-school-top-tag {
    display:inline-block;
    padding:4px 8px;
    border-radius:4px;
    background:#f6f4f8;
    color:#746a83;
    font-size:11px;
    white-space:nowrap;
}

/* 학교 주소가 있는 센터는 카드 전체가 하나의 링크입니다. */
#uhp-school-top .uhp-school-top-card-action {
    margin-top:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    width:100%;
    min-height:54px;
    padding:15px 22px;
    border-top:1px solid var(--uhp-school-top-purple);
    color:#fff;
    background:var(--uhp-school-top-purple);
    font-size:14px;
    font-weight:800;
    line-height:1.65;
    white-space:nowrap;
    transition:background .18s,color .18s;
}

#uhp-school-top .uhp-school-top-card-link:hover .uhp-school-top-card-action,
#uhp-school-top .uhp-school-top-card-link:focus-visible .uhp-school-top-card-action {
    background:#5633a5;
    color:#fff;
}

#uhp-school-top .uhp-school-top-empty {
    text-align:center;
    padding:40px 20px;
    border:1px dashed var(--uhp-school-top-line);
    border-radius:10px;
    color:var(--uhp-school-top-muted);
}

#uhp-school-top .uhp-school-top-empty button {
    margin-top:15px;
}

#uhp-school-top .uhp-school-top-footnote {
    font-size:12px;
    color:#8a8296;
    margin-top:18px;
    line-height:1.8;
}

#uhp-school-top .uhp-school-top-bottom {
    padding:27px 0 38px;
    border-top:1px solid var(--uhp-school-top-line);
}

#uhp-school-top .uhp-school-top-bottom-label {
    font-size:12px;
    color:#908399;
    letter-spacing:.03em;
    margin-bottom:15px;
}

#uhp-school-top .uhp-school-top-bottom-links {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
}

#uhp-school-top .uhp-school-top-bottom-links a {
    font-size:12px;
    padding:8px 12px;
    border:1px solid var(--uhp-school-top-line);
    border-radius:6px;
    white-space:nowrap;
}

#uhp-school-top .uhp-school-top-bottom-links a:hover {
    background:var(--uhp-school-top-soft);
    color:var(--uhp-school-top-purple);
}

@media(min-width:1000px) {
    #uhp-school-top .uhp-school-top-card h4 {
        white-space:nowrap;
        font-size:14px;
    }
}

@media(max-width:1000px) {
    #uhp-school-top .uhp-school-top-hero-grid {
        gap:26px;
    }
    #uhp-school-top .uhp-school-top-cards {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    #uhp-school-top .uhp-school-top-country-summary {
        font-size:11px;
    }
    #uhp-school-top .uhp-school-top-country {
        padding:16px 13px;
    }
    #uhp-school-top .uhp-school-top-country[aria-pressed=true] {
        padding:15px 12px;
    }
    #uhp-school-top .uhp-school-top-country strong {
        font-size:18px;
    }
    #uhp-school-top .uhp-school-top-country-summary {
        min-height:36px;
    }
}

@media(max-width:720px) {
    #uhp-school-top .uhp-school-top-hero {
        padding:30px 0 28px;
    }
    #uhp-school-top .uhp-school-top-hero-grid {
        grid-template-columns:1fr;
        gap:20px;
    }
    #uhp-school-top .uhp-school-top-brandline {
        margin-bottom:20px;
    }
    #uhp-school-top .uhp-school-top-hero h2 {
        font-size:34px;
        letter-spacing:-1.6px;
    }
    #uhp-school-top .uhp-school-top-intro {
        font-size:14px;
        margin-top:16px;
        max-width:100%;
    }
    #uhp-school-top .uhp-school-top-hero-actions {
        margin-top:20px;
    }
    #uhp-school-top .uhp-school-top-btn {
        padding:11px 14px;
        font-size:13px;
        gap:8px;
    }
    #uhp-school-top .uhp-school-top-stats {
        margin-top:22px;
        gap:24px;
    }
    #uhp-school-top .uhp-school-top-collage {
        padding:0 0 22px;
        gap:9px;
    }
    #uhp-school-top .uhp-school-top-photo {
        height:201px;
        border-radius:10px;
    }
    #uhp-school-top .uhp-school-top-photo:nth-child(2) {
        height:181px;
        margin-top:20px;
    }
    #uhp-school-top .uhp-school-top-hero-note {
        left:12px;
        right:12px;
        bottom:0;
        padding:9px 12px;
        font-size:10px;
    }
    #uhp-school-top .uhp-school-top-hero-note strong {
        font-size:13px;
    }
    #uhp-school-top .uhp-school-top-section {
        padding:35px 0;
    }
    #uhp-school-top .uhp-school-top-section h2 {
        font-size:23px;
        letter-spacing:-.8px;
    }
    #uhp-school-top .uhp-school-top-section-heading {
        gap:12px;
        align-items:start;
        margin-bottom:20px;
    }
    #uhp-school-top .uhp-school-top-section-heading p {
        font-size:13px;
        line-height:1.8;
    }
    #uhp-school-top .uhp-school-top-textlink {
        font-size:11px;
        gap:1px;
        margin-top:7px;
    }
    #uhp-school-top .uhp-school-top-textlink svg {
        width:15px;
    }
    #uhp-school-top .uhp-school-top-country-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }
    #uhp-school-top .uhp-school-top-country-top {
        margin-bottom:10px;
    }
    #uhp-school-top .uhp-school-top-country small {
        font-size:10px;
        margin-bottom:6px;
    }
    #uhp-school-top .uhp-school-top-country-summary {
        min-height:0;
        font-size:10px;
        white-space:nowrap;
    }
    #uhp-school-top .uhp-school-top-toolbar {
        gap:12px;
        flex-wrap:wrap;
        margin:24px 0 14px;
    }
    #uhp-school-top .uhp-school-top-results-title {
        font-size:17px;
    }
    #uhp-school-top .uhp-school-top-search {
        width:100%;
    }
    #uhp-school-top .uhp-school-top-country-lead {
        font-size:12px;
        padding:13px 14px;
    }
    #uhp-school-top .uhp-school-top-cards {
        grid-template-columns:1fr;
        gap:13px;
    }
    #uhp-school-top .uhp-school-top-card-top {
        padding:20px 20px 0;
        min-height:95px;
    }
    #uhp-school-top .uhp-school-top-card-body {
        padding:17px 20px 0;
    }
    #uhp-school-top .uhp-school-top-card-desc {
        min-height:0;
    }
    #uhp-school-top .uhp-school-top-card h4 {
        font-size:14px;
    }
    #uhp-school-top .uhp-school-top-thumb {
        height:75px;
        width:85px;
    }
    #uhp-school-top .uhp-school-top-tags {
        margin:15px 0 17px;
    }
    #uhp-school-top .uhp-school-top-program {
        padding:0 0 21px;
        border-left:0;
        border-bottom:1px solid #e3ddea;
    }
    #uhp-school-top .uhp-school-top-program h3 {
        font-size:18px;
        margin:6px 0;
    }
    #uhp-school-top .uhp-school-top-consult {
        display:block;
        margin-top:27px;
        padding:23px 20px;
    }
    #uhp-school-top .uhp-school-top-consult .uhp-school-top-btn {
        width:100%;
        margin-top:17px;
    }
    #uhp-school-top .uhp-school-top-faq-intro p {
        font-size:13px;
        margin-top:9px;
    }
    #uhp-school-top .uhp-school-top-faq p {
        font-size:12px;
    }
    #uhp-school-top .uhp-school-top-bottom-links a {
        font-size:11px;
        padding:8px 10px;
    }
}

@media(prefers-reduced-motion:reduce) {
    #uhp-school-top * {
        transition:none!important;
        scroll-behavior:auto!important;
    }
}

#uhp-school-top .uhp-school-top-all-button {
    border:0;
    background:none;
    padding:3px 0;
}