/*
pages
*/
.pages section {padding: 3rem 0;text-align: center;}
.pages-section-title {font-size: 18px;margin-bottom: 2rem;}
.pages-section-text {font-size: 14px;margin-bottom: 2rem;}

.add-desc-text {font-size: 12px; text-align: right; width: 100%; margin-bottom: 12px;}
@media (min-width: 768px) {
    .pages section {padding: 3rem 0;}
    .pages-section-title {font-size: 32px;}
    .pages-section-text {font-size: 16px;}

	.add-desc-text {font-size: 16px; }
}
/*
introduce
*/
.introduce-textBox {margin-bottom: 1rem;font-size: 14px;font-weight: 500;}
.introduce-logoBox {text-align: center;margin-bottom: 1rem;}
.introduce-logoBox img {width: 64%;max-width: 384px;}

.introduce .introduce-section01-listBox {margin-top: 2.13rem;}
.introduce .introduce-section01-list {display: inline-block;margin-bottom: 1rem;list-style: outside;text-align: left;font-size: 14px;}

.introduce .introduce-section02 {padding: 2.5rem 0;background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/intro_whyhana_bg.png") no-repeat center center;background-size: cover;}
.introduce .introduce-section02 h2 {font-size: 20px;color: #fff;}
.introduce .introduce-section02 span {font-weight: 400;}

.introduce .introduce-section03 .pages-section-title {line-height: 1.47;}
.introduce .introduce-section03 .pages-section-title > strong {color: #FF1A00;}
.introduce .introduce-section03 img {width: 100%;}
.introduce .introduce-section03-con-list {margin: 2rem 0 3rem;padding: 0;text-align: left;}
.introduce .introduce-section03-con-list > li {min-height: 136px;margin-bottom: 1rem;padding: 1.5rem;border: 1px solid #DFDFDF;list-style: none;line-height: 24px;}
.introduce .introduce-section03-con-list > li:last-child {margin-bottom: 0;}
.introduce .introduce-section03-con-list > li > strong {display: block;padding-bottom: 14px;font-size: 16px;color: #000;}
.introduce .introduce-section03-con-list > li > span {display: block;font-size: 13px;color: #000;}
.introduce .introduce-section03-con-list > li > span > em {font-style: normal;color: #FF1A00;}
.introduce .introduce-section03-con-list > li.focus {border-color: #FFA455;background-color: #FFF8F8}
.introduce .introduce-section03-con-box-title {margin-bottom: 1rem;font-size: 18px;font-weight: 400;}
.introduce .introduce-section03-con-box {padding: 1.5rem;border: 1px solid #cbd4d9;}
.introduce .introduce-section03-con-box-grid {display: grid;grid-template-columns: repeat(1, 1fr);grid-gap: 8px;width: 100%;margin: 0 auto;padding: 0;}
.introduce .introduce-section03-con-box-col {display: flex;justify-content: center;align-items: center;width: 100%;margin: 0 auto;padding: 0.5rem;background: #333;color: #fff;font-size: 14px;}

.introduce .introduce-section04 {background: #eceef1;}
.introduce .introduce-section04-con-img {width: 100%;max-width: 504px;aspect-ratio: 28/17;background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/intro_interview.png") no-repeat center center;background-size: cover;margin-bottom: 1rem;}
.introduce .introduce-section04-con-text {width: 100%;text-align: left;}
.introduce .introduce-section04-con-text-grid {display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 8px;padding: 0; list-style: none}
.introduce .introduce-section04-con-text-col {display: flex;justify-content: center;align-items: center;position: relative;width: 100%;margin: 0 auto;padding: .8rem 0;background: #333;text-align: center;color: #fff;font-size: 11px;}
.introduce .introduce-section04-con-text-col::before {display: none;}

.introduce .introduce-section05-table {width: 100%;border: 1px solid #cbd4d9;border-top: 2px solid #333;}
.introduce .introduce-section05-table thead {display: none;}
.introduce .introduce-section05-table tbody td {display: block;}
.introduce .introduce-section05-table tbody td::before {content: "컨설팅";display: block;width: 100%;padding: 0.6rem;border-bottom: 1px solid #cbd4d9;background: #eceef1;}
.introduce .introduce-section05-table tbody td:nth-of-type(2):before {content: "지원 준비";}
.introduce .introduce-section05-table tbody td:nth-of-type(3):before {content: "포트폴리오 제출 인터뷰";}
.introduce .introduce-section05-table tbody td:nth-of-type(4):before {content: "최종 입학허가서 수령";}
.introduce .introduce-section05-table tbody td:nth-of-type(5):before {content: "비자 신청";}
.introduce .introduce-section05-table tbody td ul {padding: 0.6rem;text-align: left;}
.introduce .introduce-section05-table tbody td ul li {margin-left: 1.5rem;}
.introduce .introduce-section05-table tr th, .introduce .introduce-section05-table tr td {font-size: 14px;border-bottom: 1px solid #cbd4d9;}
.introduce .introduce-section05-table tr th:last-child, .introduce .introduce-section05-table tr td:last-child {border-bottom: none;}

.introduce .introduce-section06 {padding: 4rem 0;background: url('https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/intro_inquiry_bg.png') no-repeat center center;background-size: cover;}
.introduce .introduce-section06 p {margin-bottom: 2.5rem;font-size: 14px;color: #ffffff;}
.introduce .introduce-section06 p:first-child {margin-bottom: 1rem;}
@media (min-width: 768px) {
    .introduce-textBox {font-size: 16px;}

    .introduce .introduce-section01-list {font-size: 16px;}
    .introduce .introduce-section02 h2 {font-size: 40px;color: #fff;}
    .introduce .introduce-section03 {padding: 6.3rem 0;}
    .introduce .introduce-section03 .pages-section-title {margin-bottom: 2.5rem;}
    .introduce .introduce-section03-con-list {display: grid;margin: 2.5rem 0 6.3rem;grid-template-columns: repeat(3, 1fr);grid-gap: 24px;}
    .introduce .introduce-section03-con-list > li {min-height: 152px;margin-bottom: 0;padding: 2rem 1.5rem;}
    .introduce .introduce-section03-con-list > li > strong {font-size: 18px;}
    .introduce .introduce-section03-con-list > li > span {font-size: 14px;}
    .introduce .introduce-section03-con-box-title {font-size: 20px;}
    .introduce .introduce-section03-con-box-grid {grid-template-columns: repeat(4, 1fr);grid-gap: 2rem;width: 100%;max-width: 704px;}
    .introduce .introduce-section03-con-box-col {width: 8rem;height: 8rem;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;font-size: 16px;}

    .introduce .introduce-section04-con {display: flex;justify-content: space-between;}
    .introduce .introduce-section04-con-img {width: 50%;margin: 0;}
    .introduce .introduce-section04-con-text {width: 49%;}
    .introduce .introduce-section04-con-text-col {width: 6.5rem;height: 6.5rem;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;font-size: 14px;}
    .introduce .introduce-section04-con-text-col::before {display: block;position: absolute;left: calc(100% + .5vw);top: 50%;transform: translate(-25%, -50%);color: #999;font-size: 30px;}

    .introduce .introduce-section05-table thead{display: table-header-group;background: #eceef1;}
    .introduce .introduce-section05-table thead th {padding: 1rem 0;}
    .introduce .introduce-section05-table tbody td::before {display: none;}
    .introduce .introduce-section05-table tbody td {display: table-cell;}
    .introduce .introduce-section05-table tr th, .introduce .introduce-section05-table tr td {border-right: 1px solid #cbd4d9;}
    .introduce .introduce-section05-table tr th:last-child, .introduce .introduce-section05-table tr td:last-child {border-bottom: 1px solid #cbd4d9;}

    .introduce .introduce-section06 p {font-size: 22px;}
}
@media (min-width: 1199px) {
    .introduce .introduce-section04-con-text-grid {grid-template-columns: repeat(4, 1fr);grid-gap: 1.5rem;margin-top: 1.5rem;}
}
/*
findway
*/
.find-way-con .flexslider {width: 100%;aspect-ratio: 1080 / 499;overflow: hidden;margin-bottom: 20px;}
.find-way-con .flexslider ul {padding: 0;}
.find-way-con .flexslider img {width: 100%;list-style: none;}
.find-way-con .text-box ul {padding: 0;list-style: none;text-align: left;font-size: 14px;}

.find-way-map #branchMap {aspect-ratio: 27 / 10;width: 100%;}
.find-way-map-text {list-style: none;padding: 0;}
.find-way-map-text > li dl dt {font-size: 18px;text-align: center;}
.find-way-map-text > li dl dd {text-align: left;}
.find-way-map-text > li dl dd ul {list-style: none;padding: 0;}
.find-way-map-text > li dl dd ul li {position: relative;font-size: 14px;padding-left: 10px;}
.find-way-map-text > li dl dd ul li::before {content: '';position: absolute;top: 0.6rem;left: 0;display: block;width: 2px;height: 2px;background: #666;border-radius: 50%;}
.line9 {color: #cea43a;}
.lineN {color: #CD1C37;}
.line2 {color: #57be63;}

@media (min-width: 768px) {
    .find-way-con .text-box {display: flex;}
    .find-way-con .text-box h1 {width: 50%;}
    .find-way-con .text-box ul {font-size: 16px;width: 50%;border-left: 1px solid #cbd4d9;padding: 0 20px;}
    .find-way-con .text-box ul li dl {display: flex;margin-bottom: 0;}
    .find-way-con .text-box ul li dl dt {width: 20%;}
    .find-way-con .text-box ul li dl dd {width: 80%;}

    .find-way-map-text {display: grid;grid-template-columns: repeat(3,1fr);padding: 20px 0;}
    .find-way-map-text > li {padding: 10px;}
    .find-way-map-text > li + li {border-left: 1px solid #cbd4d9;}
    .find-way-map-text li dl dd ul li {font-size: 16px;}
}

/*
ual
*/
.ual-pages section{padding: 3rem 0;}
.ual-pages section:nth-child(n + 2) {padding-bottom: 0;}
.ual-section-top.csm {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_csm_m.png") no-repeat center center;background-size: cover;}
.ual-section-top.lcf {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_lcf_m.png") no-repeat center center;background-size: cover;}
.ual-section-top.lcc {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_lcc_m.png") no-repeat center center;background-size: cover;}
.ual-section-top.chelsea {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_chelsea_m.png") no-repeat center center;background-size: cover;}
.ual-section-top.camberwell {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_camberwell_m.png") no-repeat center center;background-size: cover;}
.ual-section-top.wimbledon {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_wimbledon_m.png") no-repeat center center;background-size: cover;}
.ual-bg {background: #eceef1; padding: 3rem 0;}
.ual-pages h2 {font-size: 18px;margin-bottom: 24px;}
.color {color: #ec3a1d;}
.ual-pages p.text {font-size: 14px;}
.ual-pages ul.list {font-size: 14px;padding-left: 0;list-style: none;}
.ual-section-top .container {color: #fff;text-align: left;}
.ual-section-top .textBox {margin-bottom: 20px;}
.ual-section-top .textBox > p {font-size: 14px;}
.ual-section-top .listBox {padding: 10px;background: rgba(0,0,0,0.3);border: 1px solid rgba(255,255,255,0.3);list-style: none;}
.ual-section-top .listBox li {position: relative;}
.ual-section-top .listBox li dl {padding-left: 10px;font-size: 12px;}
.ual-section-top .listBox li dl:last-child {margin-bottom: 0;}
.ual-section-top .listBox li dl dt {position: relative;}
.ual-section-top .listBox li dl dt::before {content: '';position: absolute;top: 50%;left: -10px;margin-top: -2px;display: block;width: 2px;height: 2px;border-radius: 50%;background: #fff;}
.ual-section-top .listBox li dl dd {color: #ccc;}
.ual-section-top .listBox li dl dd a {color: #ccc;}

.ual-con1-grid {list-style: none;padding-left: 0;display: grid;grid-template-columns: repeat(2,1fr);grid-gap: 8px;}
.ual-con1-grid li {display: flex; align-items: center; position: relative;margin-left: 40px;text-align: left;font-size: 14px;}
.ual-con1-grid li::before {content: '1';position: absolute;top: 50%;right: calc(100% + 8px);transform: translateY(-50%);display: block;width: 30px;height: 30px;line-height: 30px;background: #333;border-radius: 50%;color: #fff;font-weight: bold;text-align: center;}
.ual-con1-grid li:nth-child(2)::before {content: '2';}
.ual-con1-grid li:nth-child(3)::before {content: '3';}
.ual-con1-grid li:nth-child(4)::before {content: '4';}
.ual-con1-grid li:nth-child(5)::before {content: '5';}

.ual-table {border-collapse: collapse;margin-bottom: 30px;width: 100%;}
.ual-table:last-child {margin-bottom: 0;}
.ual-table th,
.ual-table td {font-size: 13px;padding: 10px; border: 1px solid #cbd4d9;}
.ual-table th {background: #eceef1;}
.ual-table th a {display: inline-block;margin-top: 6px;background-color: #5c5e66;color: #FFFFFF;font-weight: normal;padding: 4px 8px;}
.ual-table td ul {padding-left: 0;text-align: left;list-style: none; margin-bottom: 0;}
.ual-table td ul li {position: relative;padding-left: 10px;}
.ual-table td ul li::before {content: '';position: absolute;top: 0.6rem;left: 0;display: block;width: 2px;height: 2px;background: #666;border-radius: 50%;}
.ual-table td p:last-child {margin-bottom: 0;}
.ual-youtube-wrap {max-width: 720px;margin: 0 auto;}
.ual-youtube {position: relative; height: 0; padding-bottom: 56.25%; text-align: left;}
.ual-youtube > iframe {position: absolute; width:100%; height:100%; border: none;}

.ual-con2 {text-align: left;border: 1px solid #cbd4d9;padding: 10px;}
.ual-con2 h3 {font-size: 14px;}
.ual-con2 h3 span {text-decoration: underline;}
.ual-con2 ul {font-size: 13px;list-style: none;padding-left: 0;}
.ual-con2 ul li {position: relative;padding-left: 10px;}
.ual-con2 ul li::before{content: '';position: absolute;top: 0.6rem;left: 0;display: block;width: 2px;height: 2px;background: #666;border-radius: 50%;}
.ual-con2 p {font-size: 13px;position: relative;}
.ual-con2 p::before {content: '* ';}
.ual-con2 .link {text-align: center;}
.ual-con2 .link a {font-size: 13px;display: inline-block;height: 2.2rem;padding: 0 1rem;border: 1px solid #666;box-sizing: border-box;line-height: 2.2rem;color: #fff;text-align: center;vertical-align: text-bottom;cursor: pointer;max-width: 720px;margin: 30px auto 0;background: #5c5e66;}

.ual-con3 {transform: translateY(16px);position: relative;padding:16px 8px;border: 1px solid #cbd4d9;}
.ual-con3::before {content: '* 클릭 시 학과 사이트로 이동합니다.';position: absolute;right: 0;bottom: 100%;font-size: 12px;}
.ual-con3 > ul {list-style: none;padding: 0;margin-bottom: 0;}
.ual-con3 > ul > li {position: relative;margin-left: 40px;text-align: left;font-size: 14px;}
.ual-con3 > ul > li::before {content: '1';position: absolute;top: 0;right: calc(100% + 8px);display: block;width: 30px;height: 30px;line-height: 30px;background: #333;border-radius: 50%;color: #fff;font-weight: bold;text-align: center;}
.ual-con3 > ul > li:nth-child(2)::before {content: '2';}
.ual-con3 > ul > li:nth-child(3)::before {content: '3';}
.ual-con3 > ul > li:nth-child(4)::before {content: '4';}
.ual-con3 > ul > li:nth-child(5)::before {content: '5';}
.ual-con3 > ul > li > h3 {font-size: 14px;}
.ual-con3 > ul > li:last-child p {margin-bottom: 0;}

.ual-con4 {margin-bottom: 20px;}
.ual-con4:last-child {margin-bottom: 0;}
.ual-con4 > h3 {text-align: left;font-size: 16px;}
.ual-con4 > ul {text-align: left;padding-left: 0;list-style: none;}
.ual-con4 > ul > li {position: relative;padding-left: 10px;font-size: 12px;margin-bottom: 4px;}
.ual-con4 > ul > li::before {content: '';position: absolute;top: 0.6rem;left: 0;display: block;width: 2px;height: 2px;background: #666;border-radius: 50%;}

.ual-con5 > h3 {font-size: 16px;margin-bottom: 32px;}
.ual-con5-grid {list-style: none;padding-left: 0;}
.ual-con5-grid.text-left {text-align: left}
.ual-con5-grid > li {margin-bottom: 32px;}
.ual-con5-grid > li > div {aspect-ratio: 1 / 1 ;width: 100px;margin: 0 auto 16px;}
.ual-con5-grid > li > div > img {width: 100%;}
.ual-con5-grid > li > h4 {font-size: 16px;}
.ual-con5-grid > li > p {font-size: 14px;}
@media (min-width: 768px) {
    .ual-section-top.csm {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_csm_pc.png") no-repeat 20%;background-size: cover;}
    .ual-section-top.lcf {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_lcf_pc.png") no-repeat center center;background-size: cover;}
    .ual-section-top.lcc {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_lcc_pc.png") no-repeat center center;background-size: cover;}
    .ual-section-top.chelsea {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_chelsea_pc.png") no-repeat center center;background-size: cover;}
    .ual-section-top.camberwell {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_camberwell_pc.png") no-repeat center center;background-size: cover;}
    .ual-section-top.wimbledon {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/school/school_wimbledon_pc.png") no-repeat center center;background-size: cover;}

    .ual-pages h2 {font-size: 2rem;margin-bottom: 2rem;}
    .ual-pages p.text {font-size: 1rem;}
    .ual-pages ul.list {font-size: 1rem;}
    .ual-section-top .container {display: flex;justify-content: space-between;}
    .ual-section-top .textBox {width: 40%; margin-bottom: 0;}
    .ual-section-top .textBox > p {font-size: 20px;}
    .ual-section-top .listBox {width: 40%; padding: 20px;}
    .ual-section-top .listBox li dl {font-size: 14px;}

    .ual-con1-grid li {margin-left: 50px;font-size: 18px;}
    .ual-con1-grid li::before {width: 40px;height: 40px;line-height: 40px;}

    .ual-table {margin-bottom: 50px;}
    .ual-table th, .ual-table td {font-size: 1rem;line-height: 1.2;}

    .ual-con2 {text-align: center;padding: 30px;}
    .ual-con2 h3 {font-size: 18px;}
    .ual-con2 ul {font-size: 15px;display: inline-block; text-align: left}
    .ual-con2 p {font-size: 15px;}
    .ual-con2 .link a {font-size: 16px;}

    .ual-con3 {text-align: center;padding: 30px;}
    .ual-con3::before {font-size: 16px;}
    .ual-con3 > ul {display: inline-block;}
    .ual-con3 > ul > li {margin-left: 50px;font-size: 15px;}
    .ual-con3 > ul > li::before {width: 40px;height: 40px;line-height: 40px;}
    .ual-con3 > ul > li > h3 {font-size: 18px;}

    .ual-con4-wrap{overflow: hidden}
    .ual-con4.flex-left {float: left;}
    .ual-con4.flex-right {float: right;}
    .ual-con4 {margin-bottom: 20px;width: 50%;}
    .ual-con4 > h3 {font-size: 18px;}
    .ual-con4 > ul > li {font-size: 15px;}

    .ual-con5 > h3 {font-size: 26px;}
    .ual-con5-grid > li {margin-bottom: 0;}
    .ual-con5-grid > li > div {aspect-ratio: 1 / 1 ;width: 140px;margin: 0 auto 16px;}
    .ual-con5-grid > li > h4 {font-size: 20px;}
    .ual-con5-grid > li > p {font-size: 15px;}
}
@media (min-width: 1200px) {
    .ual-con1-grid {grid-template-columns: repeat(5,1fr);margin-bottom: 20px;}
    .grid4 {grid-template-columns: repeat(4,1fr);}
    .ual-con5-grid {display: grid;grid-template-columns: repeat(3,1fr);grid-gap: 5%;}
    .grid2 {grid-template-columns: repeat(2,1fr);}
}


/*
입학심사절차
*/
.interview h1 {margin-bottom: 2rem;}
.interview-bg {background: #eceef1;}
.interview h2 {margin-bottom: 3rem;}
.interview h2.mNone {margin-bottom: 0;}
.interview-title {font-size: 1rem;margin-bottom: 0 !important;}
.interview h2 strong {text-decoration: underline;}
.interview-nav {margin-bottom: 2rem;}
.interview-nav ul {list-style: none;padding: 0;display: grid;grid-template-columns: repeat(3,1fr);background: #fafafc;border: 1px solid #cbd4d9;}
.interview-nav li.active a {background: #191919;color: #fff;font-weight: bold; }
.interview-nav li + li {border-left: 1px solid #cbd4d9; }
.interview-nav li a {display: inline-grid;width: 100%;height: 100%;padding: 10px 20px;}
.interview-nav-text h2 {margin-bottom: 1rem;}

.reservation-imgBox {aspect-ratio: 108 / 71;}
.reservation-textBox {text-align: left;}
.reservation-textBox div {border: 1px solid #cbd4d9;padding: 20px;}
.reservation-textBox div h3 {font-size: 14px;}
.reservation-textBox div ul li {font-size: 14px;}
.reservation-textBox span {font-size: 14px;color: #888;}

.interview-grid{display: grid;grid-template-columns: repeat(1,1fr);grid-gap: 1rem;}
.interview-grid > div .img {aspect-ratio: 340 / 203;margin-bottom: 1.5rem;}
.interview-grid > div h3 {font-size: 16px;font-weight: 400;margin-bottom: 1rem;}
.interview-grid > div p {font-size: 14px;color: #666;}

.interview-circle {display: grid;grid-template-columns: repeat(1,1fr);grid-gap: 20px;margin-bottom: 20px;}
.interview-circle-col p {padding: 5px 0;background: #333;font-size: 16px;color: #ffff;margin-bottom: 0;font-weight: 700;}
.interview-circle-col span {font-size: 14px;}
.interview-circle-textBox {padding: 10px 20px;border: 1px solid #cbd4d9;text-align: left;}
.interview-circle-textBox h3 {font-size: 14px;}
.interview-circle-textBox p {font-size: 13px;}

.reservation-con2 div h4 {padding: 8px 0;-webkit-border-radius: 30px;-moz-border-radius: 30px;border-radius: 30px;background: #5c5e66;font-size: 16px;color: #fff;}
.reservation-con2 div ul {padding: 0 30px;font-size: 14px;}

.reservation-img01 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_reservation_img01.png") no-repeat center center;background-size: cover;}
.reservation-img02 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_reservation_img05.png") no-repeat center center;background-size: cover;}
.reservation-img03 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_reservation_img03.png") no-repeat center center;background-size: cover;}
.reservation-img04 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_reservation_img04.png") no-repeat center center;background-size: cover;}

.portfolio-con {margin-bottom: 20px;}
.portfolio-con > div {position: relative;}
.portfolio-con .img {margin: 0 !important;}
.portfolio-con > div .textBox {display: flex;justify-content: center;align-items: center;position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: #00000040;color: #fff;box-sizing: border-box;}
.portfolio-con > div p {font-size: 16px;color: #fff;margin-bottom: 8px;}
.portfolio-con > div span {font-size: 14px;}

.portfolio-interview-grid h3 {font-size: 16px;}
.portfolio-interview-grid li {font-size: 14px;}

.portfolio-circle-textBox {text-align: center;}
.portfolio-circle-textBox ul {display: inline-block;}
.portfolio-circle-textBox li {font-size: 14px;}

.portfolio-img01 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_portfolio_img01.png") no-repeat center center;background-size: cover;}
.portfolio-img02 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_portfolio_img02.png") no-repeat center center;background-size: cover;}
.portfolio-img03 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_portfolio_img03.png") no-repeat center center;background-size: cover;}

.progress-con > div {position: relative;border: 1px solid #cbd4d9;background: #fff;margin-bottom: 10px;padding: 1rem 1rem 1rem 4rem;font-size: 16px;}
.progress-con > div::before {content: '';position: absolute;top: 1rem;left: 1rem;max-width: 22px;max-height: 18px;display: block;width: 26%;height: 32px;background: url('https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/icon_interview_balloon.png') no-repeat;background-size: 100%;}
.progress-con > div p {margin: 0;text-align: left;}

.progress-con2 div {aspect-ratio: 529/ 328;margin-bottom: 1rem;}
.progress-con2 div:last-child {margin-bottom: 0;}
.progress-imgBox01 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_interview_img01.png") no-repeat center center;background-size: cover;}
.progress-imgBox02 {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_interview_img02.png") no-repeat center center;background-size: cover;}

.admission-school-con {background: url("https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/ip_admission_img01.png") no-repeat center center;background-size: cover;aspect-ratio: 97 / 114;width: 60%;max-width: 388px;margin: 0 auto;box-shadow: 10px 10px 10px rgba(0, 0, 0, .1);}

.passed-con > ul,
.passed-con > div {margin-bottom: .5rem;}
.passed-table th:nth-child(n + 4),
.passed-table td:nth-child(n + 4) {display: none;}

@media (min-width: 768px) {
    .interview-title {font-size: 1.5rem;}
    .interview-nav ul {grid-template-columns: repeat(3,1fr);}

    .reservation-imgBox {width: 53%;}
    .reservation-textBox {width: 45%;}
    .reservation-con {display: flex;justify-content: space-between;align-items: start;}

    .interview-grid {grid-template-columns: repeat(3,1fr);grid-gap: 2%;}
    .interview-grid > div h3 {font-size: 20px;}
    .interview-grid > div p {font-size: 16px;text-align: left;}


    .interview-circle {grid-template-columns: repeat(4,1fr);grid-gap: 6%;margin-bottom: 20px;}
    .interview-circle-col {display: flex;align-items: center;justify-content: center;aspect-ratio: 1 / 1 ;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;background: #333;}
    .interview-circle-col ~ div {position: relative;}
    .interview-circle-col ~ div::before {content: '';position: absolute;right: 103%;transform: translate(-50%, -50%);top: 50%;display: block;width: 20px;height: 33px;margin-top: -8px;background-image: url(https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/common/is_common_pc.png);background-position: -350px 0;}
    .interview-circle-col p {padding: 5px 0;font-size: 20px;background: none;}
    .interview-circle-col span {font-size: 16px;color: #fff;}
    .interview-circle-textBox {padding: 20px 30px;}
    .interview-circle-textBox h3 {font-size: 16px;}
    .interview-circle-textBox p {font-size: 15px;}
    .interview-circle-textBox .none_margin{margin:0}

    .reservation-con2 div h4 {font-size: 18px;}
    .reservation-con2 div ul {font-size: 16px;}

    .portfolio-con > div p {font-size: 18px;text-align: center;}
    .portfolio-con > div span {font-size: 16px;}

    .portfolio-interview-grid {display: grid;grid-template-columns: repeat(4,1fr);}

    .progress-circle {grid-template-columns: repeat(4,1fr);grid-gap: 6%;margin-bottom: 20px;}
    .progress-circle p {font-size: 16px;}

    .progress-con {display: grid;grid-template-columns: repeat(2,1fr);grid-gap: 1rem;}
    .progress-con > div {padding: 1.5rem 1.5rem 1.5rem 5rem;font-size: 18px;}
    .progress-con > div::before {top: 1.5rem;left: 1.5rem;max-width: 40px;max-height: none;background: url('https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/icon_interview_balloon.png') no-repeat;background-size: 100%;}

    .progress-con2 {display: flex;justify-content: space-between;}
    .progress-con2 div {width: 49%;margin-bottom: 0;}

    .admission-school-grid {grid-template-columns: repeat(3,1fr) !important;width: 80%;margin: 0 auto;}
    .passed-con {display: flex;justify-content: space-between;margin-bottom: 2rem;}
    .passed-table th:nth-child(n + 4),
    .passed-table td:nth-child(n + 4) {display: table-cell;}
}
	
@media (min-width: 767px) and (max-width: 1200px) { 
    .interview-grid-responsive > div h3 {font-size: 16px;}
    .interview-circle-responsive .interview-circle-col p {font-size: 17px;padding: 5px 15px 0;}
    .interview-circle-responsive .interview-circle-col span {font-size: 13px;}
}

@media (min-width: 1199px) {
    .reservation-con2 {display: grid;grid-template-columns: repeat(3,1fr);grid-gap: 40px;}

    .progress-con {grid-template-columns: repeat(4,1fr);}
}
/*******************************************************************************
                                히스토리
********************************************************************************/
.history-title {padding: 3rem 0;text-align: center;}
.history-title > h1 {margin: 0;}
.history-banner {padding: 1.9rem 10px;background: url(https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/pages/intro_whyhana_bg.png) no-repeat center center;background-size: cover;text-align: center;color: #fff;}
.history-banner .inner-banner {max-width: 1080px;margin: 0 auto;}
.history-banner .inner-banner > em {display: block;padding-bottom: 12px;font-size: 20px;font-weight: 700;font-style: normal;line-height: 1.5;}
.history-banner .inner-banner > span {display: block;font-size: 14px;line-height: 1.67;}
.history-banner .inner-banner strong {font-weight: 400;color: #F8FF23;}
.history-section {padding: 3rem 0;color: #000;}
.history-section-list {margin-bottom: 0;}
.history-section-list > div {position: relative;padding: 1.5rem 0;border-bottom: 1px solid #e2e2e2;}
.history-section-list > div:first-child {padding-top: 0;}
.history-section-list > div:last-child {padding-bottom: 0;border-bottom: 0 none;}
.history-section-list > div > dt {position: static;padding-bottom: 1rem;font-size: 18px;line-height: 1.45;}
.history-section-list > div > dd {margin: 0;font-size: 15px;line-height: 1.25rem;}
.history-section-list > div > dd > p {margin:0;padding-bottom: 1rem;}
@media (min-width: 768px) {
    .history-banner {padding: 4.4rem 0;}
    .history-banner .inner-banner {padding:0 12px;}
    .history-banner .inner-banner > em {padding-bottom: 18px;font-size: 2.5rem;line-height: 1.3;}
    .history-banner .inner-banner > span {font-size: 24px;}
    .history-section {padding: 6.3rem 0;}
    .history-section-list > div > dt {position: absolute;padding-bottom: 0;font-size: 20px;line-height: 1;}
    .history-section-list > div > dd {padding-left: 5.75rem;font-size: 16px;}
}
@media (min-width: 768px) and (max-width: 1200px) {
    .history-banner .inner-banner > em {font-size: calc(1.375rem + 1.5vw)}
    .history-banner .inner-banner > span {font-size: 20px;}
}