/* bootstrap */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

/* font */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@font-face{font-family:'H Light';font-style:normal;src:url(/Web-home/_UI/font/hufs/hufs_L.woff2) format("woff2"),url(/Web-home/_UI/font/hufs/hufs_L.woff) format("woff")}
@font-face{font-family:'H Medium';font-style:normal;src:url(/Web-home/_UI/font/hufs/hufs_M.woff2) format("woff2"),url(/Web-home/_UI/font/hufs/hufs_M.woff) format("woff")}
@font-face{font-family:'H Bold';font-style:normal;src:url(/Web-home/_UI/font/hufs/hufs_B.woff2) format("woff2"),url(/Web-home/_UI/font/hufs/hufs_B.woff) format("woff")}

/* reset */
html, body, p, div, img, ul, ol, li, dl, dt, dd {padding:0; margin:0; border:0;}
body {font-size:14px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; line-height:1.6;}
a {text-decoration: none;}
li {list-style-type: none;}

/* component */
.text-red {color: #f00 !important;}
.text-nowrap {text-wrap: nowrap !important;}
.only-pc {display: block;}

.text-dot {position: relative;padding-left: 0.8em;color: #000;}
.text-dot::before {content: '';position: absolute;top: 49%;left: 0;transform: translateY(-50%);display: block;width: 6px;height: 6px;border-radius: 500px;background: #000;}
.text-dot ~ * {padding-left: 1em;}
.text-dash {display: flex;gap: 4px;padding-left: 1.3em;}
.text-dash::before {content: '-';position: relative;top: -2px;}

.process, .process li {display: flex;align-items: center;flex-wrap: wrap;gap: 8px 4px;}
.process li span {display: inline-block;padding: 6px 8px;background: #eee;border-radius: 4px;text-wrap: nowrap;}
.process li:not(:last-of-type)::after {content: '\F135';font-size: 20px;font-family: bootstrap-icons;color: #333;}

.btn-link {display: inline-flex;justify-content: center;align-items: center;gap: 4px;margin-top: 6px;padding: 4px 12px;color: #333; line-height: 1;background: #ddd;border-radius: 4px;}
.btn-link i {color: #333;font-size: 22px;}

.btn-link2 {display: inline-flex;justify-content: center;align-items: center;gap: 4px;margin-top: 6px;padding: 10px 10px 10px 16px;color: #fff; line-height: 1;background-color: #002d56;border-radius: 50px;}
.btn-link2 i {color: #fff;font-size: 18px;}

/* sugang-intro */
.sugang-intro {position: relative;width: 100%;background: #002d56;word-break: keep-all;}
/* .sugang-intro::after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url('https://dep.hufs.ac.kr/sites/hufs/intro_edit/images/26bg_sugangchange01.jpg') no-repeat top center / cover;mix-blend-mode: soft-light;opacity: 0.3;} */
.sugang-intro::after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url('https://dep.hufs.ac.kr/sites/hufs/hufs_intro/images/2026-7.jpg') no-repeat top center / cover;mix-blend-mode: soft-light;opacity: 0.3;}
.sugang-intro #content {position: relative;z-index: 1;display: flex;flex-direction: column;min-height: 100vh;}

/* header */
.sugang-intro header {margin:0 auto;padding:50px 20px 0;max-width:1200px;width:calc(100% - 40px);text-align:center;color:#fff;}
.sugang-intro header .title {margin-bottom:8px;font-weight:500;font-family:'H Medium';font-size:42px;}
.sugang-intro header .title > .text-grn {color:#52EAFF;}


/* 모의 상단 점 */
.sugang-intro header .title .point-dot{position:relative;display:inline-block;color: #52EAFF;}
.sugang-intro header .title .point-dot::before, .sugang-intro header .title .point-dot::after {content: "";position: absolute;top: -0.12em;width: 7px;height: 7px;background: #52EAFF;border-radius: 50%;}
.sugang-intro header .title .point-dot::before{left:25%;transform:translateX(-50%);}
.sugang-intro header .title .point-dot::after{left:75%;transform:translateX(-50%);}

.sugang-intro header .title + p {font-size:14px;font-weight:200;line-height:1.4;opacity:0.8;letter-spacing:0;}
.sugang-intro header .btn_area {display:flex;justify-content:center;gap:12px;flex-wrap:nowrap;margin:16px 0 28px;}
.sugang-intro header .title + p + .btn_area {margin:28px 0;}
.sugang-intro header .btn_area a {display:flex;justify-content:center;align-items:center;gap:12px;padding:12px 12px 12px 20px;color:#002d56;font-size:20px;font-weight:700;line-height:1;letter-spacing:0;text-wrap:nowrap;border-radius:500px;background:linear-gradient(268deg,#fff,#fff);transition:all .3s;}
.sugang-intro header .btn_area a i {font-size:32px;color:#008395;line-height:1;transition:all .3s;}
.sugang-intro header .btn_area a:hover {color:#fff !important;background:#008395;}
.sugang-intro header .btn_area a:hover i {color:#fff !important;}
.sugang-intro header .hothot {margin:0 auto;font-size:18px;font-weight:200;line-height:1.6;letter-spacing:0;}
.sugang-intro header .hothot > span {font-weight:600;text-decoration:underline;text-underline-offset:3px;}

/* main */
.sugang-intro main {margin:0 auto;padding: 40px 20px 0;max-width:1200px;width: calc(100% - 40px);}
.sugang-intro .sect-maincont {display: flex;justify-content: center;flex-wrap: nowrap;gap: 18px;}
.sugang-intro .sect-maincont:not(.grid) {margin: 0 auto;max-width: 1080px;}
.sugang-intro .bx {flex: 1;background: #fff;border-radius: 8px;color: #333;line-height: 1.5;}

.sugang-intro .sect-maincont.grid {display: grid;grid-template-columns: repeat(2, 1fr);gap: 18px;}
.sugang-intro .sect-maincont.grid .bx {display: flex;flex-direction: column;gap: 16px;padding: 12px 16px 16px;}
.sugang-intro .sect-maincont.grid .bx:last-of-type {grid-row: 1 / span 2;grid-column: 2;}

/* .sugang-intro .goto {padding: 32px;width: 320px;min-height: 240px;background: #008395 url('https://dep.hufs.ac.kr/sites/hufs/intro_edit/images/btn-logoBg.png') no-repeat bottom right / auto 64%;border-radius: 8px;color: #fff;box-sizing: border-box;transition: background-color 0.3s;} */
.sugang-intro .goto {position: relative; padding: 32px;width: 320px;min-height: 240px;background: #008395;border-radius: 8px;color: #fff;box-sizing: border-box;transition: all 0.3s;}
.sugang-intro .goto::after {content: '';display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: url('https://dep.hufs.ac.kr/sites/hufs/intro_edit/images/btn-logoBg_v3.png') no-repeat bottom right / auto 59%;}
.sugang-intro .goto b {font-family: 'H Medium';font-weight: 500; font-size: 36px;line-height: 1.2;text-wrap: nowrap;}
.sugang-intro .goto div:has(i) {display: flex;align-items: center;gap: 8px;margin-top: 12px;font-weight: 400;line-height: 1;}
.sugang-intro .goto div:has(i) span {font-size: 24px;}
.sugang-intro .goto div:has(i) i {font-size: 18px;transition: transform 0.3s;animation: arrow infinite alternate 0.5s;BORDER-RADIUS: 500PX;BACKGROUND: #ffffff33;PADDING: 7PX;}
.sugang-intro .goto:hover {background-color: #007180;}
/* .sugang-intro .goto:hover div:has(i) i {transform: translateX(4px);} */

@keyframes arrow {
  from {transform: translateX(0px);}
  to {transform: translateX(4px);}
}


.sugang-intro .bx:not(.notice) {padding: 12px 16px 16px;}
.sugang-intro .bx:not(.notice) dt {font-size: 24px;font-weight: 800;color: #002d56;}
.sugang-intro .bx:not(.notice) dd {font-size: 18px;}
.sugang-intro .bx:not(.notice) dd + dd {margin-top: 4px;}
.sugang-intro .bx:not(.notice) .btn-wrap {display: flex;gap: 8px;margin-top: auto;}
.sugang-intro .bx:not(.notice) .btn {flex: 1;display: flex;justify-content: space-between;align-items: center;padding: 12px 16px;font-size: 22px;font-weight: 500;color: #fff;border-radius: 6px;}
.sugang-intro .bx:not(.notice) .btn i {font-size: 26px;}
.sugang-intro .bx:not(.notice) .btn1 {background: #008395;}
.sugang-intro .bx:not(.notice) .btn2 {background: #002d56;}

.sugang-intro .bx.notice {position: relative;padding: 24px;display: flex;justify-content: center;align-items: center;overflow: hidden;}
.sugang-intro .bx.notice .tit {font-size: 24px;font-weight: 800;color: #002d56;}
.sugang-intro .bx.notice dl {margin-top: 16px;}
.sugang-intro .bx.notice dt {font-size: 18px;font-weight: 700;color: #000;}
.sugang-intro .bx.notice dd {margin-top: 4px;line-height: 1.6;color: #333;}
.sugang-intro .bx.notice .msg {display: flex;gap: 6px;margin-top: 20px;}
.sugang-intro .bx.notice .msg i {padding-top: 1px;font-size: 14px;color: #f00;}

.sugang-intro .bx:has(.btn-boo) {padding-bottom: 80px;}
.sugang-intro .btn-boo {position: absolute;bottom: 0;right: 2px;font-size: 0;width: 350px;transform: translateY(3%);transition: transform 0.2s;}
.sugang-intro .btn-boo:hover {transform: translateY(0);}
.sugang-intro .btn-boo img {width: 85%;}


.sugang-intro .sect-link {margin: 36px 0 50px;}
.sugang-intro .sect-link .link {display: grid;grid-template-columns: repeat(5, 1fr);gap: 12px;margin: 0 auto;max-width: 1000px;}
.sugang-intro .sect-link .link a {display: block;position: relative;padding: 18px 4px;text-align: center;text-wrap: nowrap;font-size: 16px;background: rgba(157, 159, 162, 0.8);box-shadow: 0 0 16px rgba(0, 0, 0, 0.5) !important;color: #fff;line-height: 1;border-radius: 6px;border: 1px solid rgba(255, 255, 255, 0);transition: all .3s;}
.sugang-intro .sect-link .link a::after {content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url('https://dep.hufs.ac.kr/sites/hufs/intro_edit/images/logo_wh2.png') no-repeat center / auto 114%;opacity: 0.15;pointer-events: none;}
.sugang-intro .sect-link .link li:nth-child(2n) a {background: rgba(157, 159, 162, 0.3);border: 1px solid rgba(255, 255, 255, 0.5);}
.sugang-intro .sect-link .link a:hover {background: #ffffff!important;color: #0f1a41!important;}
.sugang-intro .sect-link .link a:hover::after {mix-blend-mode: difference !important;opacity: 0.1 !important;}


/* footer */
.sugang-intro footer {margin-top: auto;padding: 32px 20px;background: #021527;color: #fff;text-align: center;font-size: 16px;font-weight: 300;}
.sugang-intro footer div + div {margin-top: 4px;}
.sugang-intro footer strong {color: #52EAFF;font-weight: 700;}

/* type-grn */
.sugang-intro.type-grn {background: #666;}
.sugang-intro.type-grn::after {mix-blend-mode: luminosity !important;}
.sugang-intro.type-grn::before {content: '';position: absolute;z-index: 1; top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.2);}
.sugang-intro.type-grn .sect-link .link a:hover {background: #ffffff!important;color: #0f1a41!important;}
.sugang-intro.type-grn .sect-link .link a:hover::after {mix-blend-mode: difference !important;opacity: 0.1 !important;}

/* type-gold */
.sugang-intro.type-gold {background: linear-gradient(284deg, #040f27d1, #a0a2a9);}
.sugang-intro.type-gold::after {background: url('https://dep.hufs.ac.kr/sites/hufs/hufs_intro/images/2026-11.jpg') no-repeat top center / cover;mix-blend-mode: luminosity;opacity: 0.3;}
.sugang-intro.type-gold::before {content: '';position: absolute;z-index: 1; top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.25);}
.sugang-intro.type-gold header .title .point-dot{color: #ffcf60;}
.sugang-intro.type-gold header .title .point-dot::before, .sugang-intro.type-gold header .title .point-dot::after {background: #ffcf60;}
.sugang-intro.type-gold header .btn_area a i {color: #a78258;}
.sugang-intro.type-gold header .btn_area a:hover {color:#fff;background:#a78258;}
.sugang-intro.type-gold .goto {background: #a78258;}
.sugang-intro.type-gold .goto:hover {background: #946d40;}
.sugang-intro.type-gold header .btn_area a {color: #000;font-weight: 600;}
.sugang-intro.type-gold .bx:has(.btn-boo) {padding-bottom: 120px;}
.sugang-intro.type-gold footer strong {color: #ffcf60;font-weight: 500;}
.sugang-intro.type-gold .sect-link .link a:hover {color: #333 !important;}



@media screen and (max-width:1025px) {
    .sugang-intro header .title  {font-size: 38px;line-height: 1.4;}
    .sugang-intro .bx.full {grid-row: 2 / 3;grid-column: 1 / 3;}
    /* .sugang-intro .bx:not(.notice) .btn-wrap {flex-direction: column;} */
    .sugang-intro .sect-link .link {grid-template-columns: repeat(2, 1fr);}
    .sugang-intro .sect-link .link li:nth-child(2n) a {background: rgba(157, 159, 162, 1);}
    .sugang-intro .sect-link .link li:nth-child(2) a, .sugang-intro .sect-link .link li:nth-child(3) a, .sugang-intro .sect-link .link li:nth-child(6) a, .sugang-intro .sect-link .link li:nth-child(7) a, .sugang-intro .sect-link .link li:nth-child(10) a {background: rgba(157, 159, 162, 0.8);}

    .sugang-intro .bx:has(.btn-boo) {padding-bottom: 0px;}
    .sugang-intro .btn-boo {position: static;display: block;margin-left: auto;margin-top: 24px;text-align: center;}
    .sugang-intro .btn-boo img {width: 90% !important;}


    .sugang-intro .sect-link .link li:nth-child(2n) a {background: rgba(157, 159, 162, 0.8);}
    .sugang-intro .sect-link .link li:nth-child(2) a, .sugang-intro .sect-link .link li:nth-child(3) a, .sugang-intro .sect-link .link li:nth-child(6) a, .sugang-intro .sect-link .link li:nth-child(7) a, .sugang-intro .sect-link .link li:nth-child(10) a {background: rgba(157, 159, 162, 0.3);border: 1px solid rgba(255, 255, 255, 0.5);}

    .sugang-intro.type-gold .bx:has(.btn-boo) {padding-bottom: 0px;}
}

@media screen and (max-width:800px) {
    .only-pc {display: none !important;}

    .sugang-intro .sect-maincont, .sugang-intro .sect-maincont.grid {display: flex;flex-direction: column;}
    .sugang-intro header .title {line-height: 1.6;}
    .sugang-intro header .title .point-dot::before, .sugang-intro header .title .point-dot::after {top: -0.05em;}
    .sugang-intro header .btn_area {gap: 8px;}
    .sugang-intro header .btn_area a {flex: 1;justify-content: space-between;gap: 8px;padding: 8px 8px 8px 16px;font-size: 16px;}
    .sugang-intro .bx.full {padding: 16px;}
    .sugang-intro .goto::after {background: url('https://dep.hufs.ac.kr/sites/hufs/intro_edit/images/btn-logoBg_v3.png') no-repeat bottom right / auto 80%;}
    .sugang-intro .goto {width: 100%;}
    .sugang-intro footer div + div {margin-top: 16px;}
    .sugang-intro footer strong {display: block;}

    .sugang-intro .btn-boo {margin: 24px auto 0; width: 80%;}
}