main section {position: relative;padding: 3rem 0;}
main .sub-title h2 { line-height: 131%; }
main .sub-title p { line-height: 150%; }
main .sub-title p > strong { color: #FC1D01; }
.main-section01 {background: #ECEEF1;}
@media (min-width: 768px) {  .grid {display: grid;grid-template-columns: repeat(2, 1fr);}  }
/* main section1 */
.main-banner {list-style: none;padding: 0;}
.main-banner > li {position: relative;font-size: 0;}
.main-banner > li > div {aspect-ratio: 336 / 290;}
.main-banner > li > a {display: inline-block;position: absolute;left: 0;top: 0;width: 100%;height: 100%;font-size: 0;}
/* notice */
.notice h5 {position: relative;}
.notice h5 a {position: absolute; right: 0;top: 0; font-size: 16px;}
.notice ul {list-style: none;padding: 1rem 0 0;border-top: 1px solid #000; overflow: hidden;}
.notice ul li {width: 100%;margin-bottom: .25rem;white-space: nowrap;overflow: hiddeDn;text-overflow: ellipsis;font-size: 1rem;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {bottom: 20px !important;}
.banner-slider .swiper-pagination-bullet{background: #fff; opacity: 1;}
.banner-slider .swiper-pagination-bullet-active {background: #7BFFA3;}
.banner-slider .swiper-button-next,.banner-slider .swiper-button-prev {color: #7BFFA3;}
@media (min-width: 768px)  {
    .main-section01 .container {display: flex;justify-content: space-between;align-items: center;}
    .main-section01 .textBox {width: 45%;}
    .main-section01 .banner-slider {width: 50%;margin-right: 0;}
}
/* main section2 */
.main-section02 .main-review {list-style: none;padding: 0;}
.main-section02 .main-review li {display: flex;justify-content: space-between;position: relative;margin-bottom: 1rem;padding: 1rem;border: 1px solid #cbd4d9;}
.main-section02 .main-review li a {position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.main-section02 .main-review li div.textBox {width: 55%;}
.main-section02 .main-review li div.textBox h3 {font-size: calc(1.275rem + .3vw);overflow: hidden;text-overflow: ellipsis;white-space: normal;line-height: 1.2;height: 2.4em;text-align: left;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.main-section02 .main-review li div.textBox p {width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: normal;line-height: 1.2;height: 4.8em;text-align: left;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
.main-section02 .main-review li div.imgBox {width: 40%;}
.main-section02 .main-review li div.imgBox img {width: 100%;}
@media (min-width: 768px) {
    .main-section02 .main-review {display: grid;grid-template-columns: repeat(2,1fr);grid-gap: 1rem;margin-bottom: 0;}
    .main-section02 .main-review li {margin-bottom: 0;}
    .main-section02 .main-review li div.textBox h3 {font-size: 1.5rem;}
}
/* main section3 */
.main-section03-con {border: 1px solid #cbd4d9;}
.main-section03-con > div.main-section03-con-box {display: flex;justify-content: center;align-items: center;background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/passed_list_bg_mo.jpg") no-repeat center center  ;background-size: cover;text-align: center;padding: 1rem 0;}
.main-section03-con > div.main-section03-con-box span,.main-section03-con > div.main-section03-con-box > strong {display: block;}
.main-section03-con-title {font-size: 14px;}
.main-section03-con-text-num {font-size: 20px;}
.main-section03-con-text-num > strong {font-size: 36px;}
.main-section03-con-text-exp {color: #999;font-size: 13px;}
.main-section03-con .student-list {height: calc(22px * 7);overflow: hidden;margin: 1rem;}
.main-section03-con .student-list > ul {list-style: none;padding: 0 1rem 1rem;margin: 0;transform: translateY(-22px);width: 100%;}
.main-section03-con .student-list > ul > li {width: 100%;font-size: 16px;display: flex;line-height: 1;margin-bottom: 6px;justify-content: space-between;}
.main-section03-con-list-year {display: inline-block;width: 20%;}
.main-section03-con-list-name {display: inline-block;width: 20%;}
.main-section03-con-list-school {display: inline-block;width: 60%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.main-section03-con-list-major {display: none;}
@media (min-width: 768px) {
    .main-section03-con {display: flex;}
    .main-section03-con > div.main-section03-con-box {width: 25%;}
    .main-section03-con .student-list {width: 75%;}
    .main-section03-con .student-list > ul {padding: 0;transform: translateY(-20px);}
    .main-section03-con .student-list > ul > li {font-size: 14px;}
    .main-section03-con-list-year {width: 15%;}
    .main-section03-con-list-name {width: 15%;}
    .main-section03-con-list-school {width: 40%;}
    .main-section03-con-list-major {display: inline-block;width: 30%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
}
/* main section4 */
.renew-section .sub-title { margin-bottom: 2.5rem; }
.renew-section .sub-title h2 { margin-bottom: 1rem; }
.renew-section .sub-title p { margin-bottom: 0; font-size: 16px; font-weight: 500; }
.renew-section .sub-title strong { font-weight: 500; }
.main-section04 .sub-title p > strong { color: #FF1A00DB;}
.main-section04-con .listWhy { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; margin-bottom: 2.5rem; padding: 0; text-align: center; }
.main-section04-con .listWhy li { padding: 1.5rem 1.25rem;; border: 1px solid #C5C5C5; border-radius: 8px; letter-spacing: -.2px; list-style: none; }
.main-section04-con .listWhy li .iconWrap { margin-bottom: 8px; }
.main-section04-con .listWhy li figure { display: block; width: 2.5rem; height: 2.5rem; margin: 0 auto; background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/listWhy_icon01.svg"); background-size: cover; background-repeat: no-repeat; }
.main-section04-con .listWhy li figure.icon02 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/listWhy_icon02.svg"); }
.main-section04-con .listWhy li figure.icon03 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/listWhy_icon03.svg"); }
.main-section04-con .listWhy li figure.icon04 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/listWhy_icon04.svg"); }
.main-section04-con .listWhy li p { margin-bottom: 0; font-size: 16px; font-weight: 500; color: #000; }
.main-section04-con .imageWrap > img { display: block; width: 100%; max-width: 896px; margin: 0 auto; }
/* main section6 */
.main-section06-con { text-align: center; }
.main-section06-con .listStructure { display: grid; grid-template-columns: repeat(3,1fr); gap: 38px 24px; margin: 0; padding: 0; }
.main-section06-con .listStructure li { list-style: none; }
.main-section06-con .listStructure li figure { display: block; width: 100%; margin: 0 auto 12px; aspect-ratio: 344/200; background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/ual_structure_img01.png"); background-size: cover; background-repeat: no-repeat; border-radius: 16px; }
.main-section06-con .listStructure li figure.img02 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/ual_structure_img02.png"); }
.main-section06-con .listStructure li figure.img03 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/ual_structure_img03.png"); }
.main-section06-con .listStructure li figure.img04 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/ual_structure_img04.png"); }
.main-section06-con .listStructure li figure.img05 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/ual_structure_img05.png"); }
.main-section06-con .listStructure li figure.img06 { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/ual_structure_img06.png"); }
.main-section06-con .listStructure li p { margin-bottom: 0; font-size: 16px; font-weight: 500; color: #343A40; }
.main-section06-con .imageWrap > img { width: 100%; max-width: 896px; margin: 0 auto; }
/* main section5 */
.main-section05 {padding-bottom: 0;}
.main-section05-bg {background: #ECEEF1;padding: 1rem 12px;}
.main-section05 .container2 {overflow: hidden;padding: 0;}
.main-section05-con-nav ul {display: grid;grid-template-columns: repeat(3,1fr);list-style: none;padding: 0;}
.main-section05-con-nav ul li {display: inline-block;width: auto !important;text-align: center;cursor: pointer;padding: .5rem .4rem;margin: 0 !important;font-size: 12px;white-space: nowrap;}
.main-section05-con-nav ul li.swiper-slide-thumb-active {background: #000;color: #fff;}
.main-section05-con ul {padding: 0;list-style: none;}
.main-section05-con ul li .main-section04-con-imgBox {width: 100%;aspect-ratio: 504 / 319;font-size: 0;}
.main-section04-con-textBox {position: relative;padding: 1rem 1rem 30px;background: #fff;}
.main-section04-con-textBox .hana-btn-wrap {position: absolute;left: 0;bottom: 0;width: 100%;text-align: center;}
.main-section04-con-textBox .hana-btn-wrap a {margin-bottom: 0;width: 100%;}
.main-section04-con-textBox p {font-size: 12px;}
@media (min-width: 768px) {
    .main-section05-con-nav ul {justify-content: space-between;width: calc(100% - 2px);}
    .main-section05-con-nav ul li {width: 100% !important;padding: 1rem 0;background: #fff;font-size: 16px; border-top: 1px solid #333;border-bottom: 1px solid #333;margin-bottom: -1px !important;}
    .main-section05-con-nav ul li ~ li {border-right: 1px solid #333;}
    .main-section05-con-nav ul li:first-child {border: 1px solid #333;}
    .main-section05-con-nav ul li:nth-child(4n +1) {border-left: 1px solid #333;}
    .main-section05-con-nav ul li:nth-child(n + 5) {border-top: none;}
    .main-section05-con {padding-top: 2rem;}
    .main-section05-con .swiper-slide {display: flex;justify-content: space-between;}
    .main-section05-con ul li .main-section04-con-imgBox {width: 48%;}
    .main-section04-con-textBox {width: 48%;background: none;padding: 0 0 60px;}
    .main-section04-con-textBox p {font-size: 16px;}
    .main-section04-con-textBox .hana-btn-wrap {width: auto;}
}

.swiper-container .manage-lnk {position: static;}


/*  list-test */
    .content-test {list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;}
    .list-test {list-style: none;margin: 0;padding: 0;}
    .list-test img {height: 100px;}
    .list-test li {border-top: solid 1px var(--teal);padding: 1rem;}
    .list-test li.first-item {background-color: var(--gray-200);}
    .content-test .table th {background-color: var(--gray-200);border: none;border-bottom: solid 2px var(--gray-500);}
/*******************************************************************************
                                        UAL
********************************************************************************/
.ual-cooperation {max-width:1080px;padding: 2rem 0; margin: 0 auto; text-align:center;}
.ual-cooperation ul { list-style: none; display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 20px; margin-bottom: 0;}
.ual-cooperation ul img {width: 100%;}
@media (min-width: 1200px) {.ual-cooperation ul {grid-template-columns: repeat(6,1fr);}}


/* 팝업 */
[class*=ui-layout] {position:relative;display:inline-block;width:2rem;height:2rem;background:url(https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/common/sp-ui-kit-x2.png) no-repeat;background-position:0 0;background-size:19.5rem;font-size:0;line-height:0;text-indent:-999px;vertical-align:middle;overflow:hidden;}
.ui-layout-close {background-position:0 -3rem;}
.area-layer-popup-fixbody {display:none;position:fixed;top:0;left:0;width:100%;height:100%;overflow-y:scroll;background:rgba(0,0,0,0.7);z-index:100;}
.area-layer-popup {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:100;}
.area-layer-popup.open {display:block;}
.area-layer-popup .small-popup {width: 28%;}

@media (min-width: 768px) {
    .pc body.fixed {margin-right:17px;}
    .pc body.fixed:before {content:'';display:block;width:17px;height:100%;positoin:absolute;top:0;right:0;background:#ccc;}
    .pc body.fixed .layout-aside {margin-right:17px;}
}
@media (min-width: 320px) and (max-width: 480px) {
    .area-layer-popup .small-popup {width: 60%;}
}

.today-popup,
.countdown-popup {display:none;position:fixed;top:0;left:0;width:100%;height:100%;overflow-y:auto;z-index:1000;}
.today-popup.is-visible,
.countdown-popup.is-visible {display:block; background-color: rgba(0, 0, 0, 0.4);}
.today-popup .popup-container,
.countdown-popup .popup-container {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;flex-direction:column;padding: 4px;  max-width:383px;max-height:calc(100vh - 2rem);margin:0 auto;background-color: #fff;overflow:visible;box-sizing:border-box;}
.today-popup .popup-content,
.countdown-popup .popup-content {position:relative;flex:0 0 auto;padding:0;font-size:0;line-height:0;text-align:center;}
.today-popup .popup-content img,
.countdown-popup .popup-content img {display:block;width:100%;max-width:100%;height:auto;margin:0 auto;}
.today-popup .popup-close-x,
.countdown-popup .popup-close-x{ position:relative;top:auto;right:auto;padding: 0;display:flex;align-items:stretch;width:100%;margin-top:-1px;background-color:#fff;font-weight: 600;}
.today-popup .popup-close-x .popup-all-close-x,
.today-popup .popup-close-x .layout-close,
.countdown-popup .popup-close-x .popup-all-close-x,
.countdown-popup .popup-close-x .layout-close{font-family: "pretendard", sans-serif; display:inline-flex;align-items:center;justify-content:center;gap:4px;flex:1 1 0;min-width:0;width:50%;box-sizing:border-box;padding:20px;text-align:center;font-size:18px;line-height:100%;cursor:pointer;border:0;background:none;appearance:none;-webkit-appearance:none;}
.today-popup .popup-close-x .popup-all-close-x,
.countdown-popup .popup-close-x .popup-all-close-x{color:#666;text-decoration:none;}
.today-popup .popup-close-x .layout-close,
.countdown-popup .popup-close-x .layout-close{color:#333; font-weight: 600;}
.today-popup .popup-close-x .popup-all-close-x i,
.today-popup .popup-close-x .layout-close i,
.countdown-popup .popup-close-x .popup-all-close-x i,
.countdown-popup .popup-close-x .layout-close i{display:inline-block;flex-shrink:0;}
.today-popup .popup-close-x .popup-all-close-x .icon-check,
.countdown-popup .popup-close-x .popup-all-close-x .icon-check{background-image: url("https://s3.dualstack.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/popup/icon-check_v2.svg"); width: 12px; height: 12px; background-size: contain; background-position: center; background-repeat: no-repeat;}
.today-popup .popup-close-x .layout-close .icon-close,
.countdown-popup .popup-close-x .layout-close .icon-close{background-image: url("https://s3.dualstack.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/popup/icon-close_v2.svg"); width: 16px; height: 16px; background-size: contain; background-position: center; background-repeat: no-repeat;}

/* countdown 전용: 배경 이미지 + 고정 높이 + 텍스트/D-day/링크 */
.countdown-popup .countdown-content {position: relative;width: 375px;height: 450px; margin: 0 auto;background: url("https://s3.dualstack.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/main/popup/hana_popup_260713.png") no-repeat center top;background-size: cover;overflow: hidden;font-size: 1rem;line-height: 1.2;padding: 32px 24px;}
.countdown-popup .countdown-inner {display: flex;flex-direction: column;align-items: center;text-align: center;}
.countdown-popup .countdown-title {margin: 0;color: #fff;font-family: "pretendard", sans-serif;font-size: 37px;font-weight: 700;line-height: 122%;letter-spacing: -0.74px;}
.countdown-popup .countdown-sub {margin: 18px 0 0;font-family: "pretendard", sans-serif;font-size: 18px;font-weight: 700;line-height: 150%; letter-spacing: -0.18px;background: linear-gradient(90deg, #FF8B8C 0%, #FFC4C5 45.67%, #FF8B8C 100%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.countdown-popup .countdown-dday {display: flex;align-items: center;justify-content: center;gap: 10px;margin-top: 10px;}
.countdown-popup .countdown-dday .cd-box {display: flex;align-items: center;justify-content: center;width: 48px;height: 62px;border-radius: 6px;background: linear-gradient(0deg, #FFF 0%, #FFF 100%);box-shadow: 0 12px 24px 0 #270305;font-family: "pretendard", sans-serif;font-size: 2rem;font-weight: 800;line-height: 1;}
.countdown-popup .countdown-dday .cd-text {display: inline-block;font-size: 36px;font-weight: 800;line-height: 150%;letter-spacing: -0.36px;background: linear-gradient(180deg, #FA0004 24.56%, #190306 86.84%);-webkit-background-clip: text;background-clip: text;color: transparent;-webkit-text-fill-color: transparent;}
.countdown-popup .countdown-desc {margin: 10px 0 0;color: #fff;font-family: "pretendard", sans-serif;font-size: 15px;font-weight: 600;line-height: 150%;letter-spacing: -0.15px;}
.countdown-popup .countdown-link {display: inline-flex;align-items: center;justify-content: center;margin-top: 152px;padding: 14px 24px;border-radius: 4px;background: #F00;color: #fff;font-family: "pretendard", sans-serif;font-size: 16px;font-weight: 700;line-height: 1;letter-spacing: -0.16px;}

@media screen and (max-width: 575px) {
    .today-popup .popup-close-x .popup-all-close-x, .today-popup .popup-close-x .layout-close,
    .countdown-popup .popup-close-x .popup-all-close-x, .countdown-popup .popup-close-x .layout-close{font-size: 16px;}
    .today-popup .popup-container,
    .countdown-popup .popup-container{width: 336px;}
    .countdown-popup .countdown-content{width:100%;height:392px; padding: 28px 21px;}
    .countdown-popup .countdown-title{font-size:32px; line-height: 122%; letter-spacing: -0.64px;}
    .countdown-popup .countdown-sub{font-size:16px; margin-top: 16px; line-height: 150%; letter-spacing: -0.16px;}
    .countdown-popup .countdown-dday{gap: 8px; margin-top: 8px;}
    .countdown-popup .countdown-dday .cd-box{width:42px;height:54px;font-size:32px;border-radius:4px;}
    .countdown-popup .countdown-desc{font-size: 13px;font-weight: 600; line-height: 150%; letter-spacing: -0.13px; margin-top: 8px;}
    .countdown-popup .countdown-link{padding: 12px 21px; font-size: 14px; letter-spacing: -0.14px; margin-top: 133px;}
}

.london .popup-container {max-width:40rem;}
.popup-container {position:absolute;top:50%;left:50%;width:90%;max-width:36rem;/*margin:4rem 0;*/transform:translate(-50%, -50%);background:#fff;}
.main-popup .popup-content {
    width:100%;
}
.main-popup .popup-content > div{
    position: relative;
}
.main-popup .popup-all-close-x {
    position: absolute;
    right: 0;
    bottom: 100%;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
}

.popup-container .popup-content{font-size:.8rem;}
.popup-content {padding:1.5rem;box-sizing:border-box;}
.popup-sample .small-popup .popup-content{font-size:1rem;}

.popup-slider {position:absolute;top:50%;left:50%;width:90%;max-width:22rem;transform:translate(-50%, -50%);background:#fff;visibility:hidden;opacity:0;}
.popup-slider .popup-content {padding:0;}
.popup-slider .bx-controls-direction {display:none;}
.popup-slider .bx-pager .bx-pager-item a {width:.55rem;height:.55rem;}

.popup-title {position:relative;min-height:4rem;box-sizing:border-box;border-bottom:1px solid #c5c5c5;}
.popup-title .heading-text:only-child {position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);box-sizing:border-box;padding:1rem;font-size:1.1rem;font-weight:400;}
.popup-close-x {position:absolute;top:0;right:0;padding:1rem;cursor:pointer;}
.popup-container .popup-close {position:absolute;top:0;right:0;padding:1rem;cursor:pointer;}
.popup-condition-wrap {display:flex;}
.popup-condition-wrap [class^=popup-] {flex:auto;border:1px solid #ccc;padding:1rem 0;font-size:.9rem;}
.popup-condition-wrap [class^=popup-] ~ [class^=popup-] {border-left:none;}
.popup-condition-wrap .popup-close {}
.popup-condition-wrap .popup-slider-auto:before {content:'';position:relative;display:inline-block;width:1rem;height:1rem;background:url(https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/common/sp-ui-kit-x2.png) no-repeat;background-position:-8rem -6rem;background-size:19.5rem;font-size:0;line-height:0;text-indent:-999px;vertical-align:middle;overflow:hidden;}
.popup-condition-wrap .popup-slider-auto.stop:before {background-position:-8rem -5rem;}
.review .popup-title .heading-text {padding-right:1.5rem;}
@media (min-width: 1104px) {
    .container { box-sizing: content-box; }
}
@media screen and (max-width: 768px) {
    .container { padding: 0 16px;}
    main section { padding: 2.5rem 0; }
    .renew-section .sub-title { margin-bottom: 1.25rem; }
    .renew-section .sub-title h2 { margin-bottom: .75rem; font-size: 16px; }
    .renew-section .sub-title p { font-size: 13px; line-height: 154%; letter-spacing: -.2px; }
    .renew-section .sub-title p > strong { line-height: 154%; }
    .main-section04-con .listWhy { grid-template-columns: repeat(1,1fr); gap: 12px; margin-bottom: 1.25rem; text-align: left; }
    .main-section04-con .listWhy li { display: flex; gap: 12px; align-items: center; padding: 1rem 1.25rem; }
    .main-section04-con .listWhy li .iconWrap { width: 32px; height: 32px; margin-bottom: 0; }
    .main-section04-con .listWhy li figure {width: 32px; height: 32px; }
    .main-section04-con .listWhy li p { width: calc(100% - 32px - 12px); font-size: 14px; }
    .main-section04-con .imageWrap > img { border-radius: 16px; }
    .main-section06-con .listStructure { grid-template-columns: repeat(1,1fr); gap: 1rem; }
    .main-section06-con .listStructure li figure { margin-bottom: 8px; }
    .main-section06-con .listStructure li p { font-size: 12px; }
}
