:root {
    --white: #fff;
    --vh: 100vh;
    --header-h: 4.38rem;
    --blue: #40A7FF;
    --green: #00CDC3;
    --yellow: #FFCC5C;
    --pink: #FF68D2;
    --purple: #B36FEE;
}

body {
    font-family: 'Pretendard', sans-serif;
}
html.fixed {overflow-y:hidden !important;}
.pc {
    display: block !important;
}

.mob, .mobMo {
    display: none !important;
}

.NanumSquare {
    font-family: 'NanumSquareRound', sans-serif !important;
}

.en .NanumSquare {
    word-break: keep-all;
}

.main {
    overflow-x: hidden;
}

body {
    position: relative;
}

/* body::-webkit-scrollbar {
    display: none;
} */

button {
    line-height: 100% !important
}

.logo,
.headerTab {
    cursor: pointer;
}

.flexStartBetween {
    display: flex;
    justify-content: space-between;
    align-items: start;
}

.flexCenterBetween {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.flexEndBetween {
    display: flex;
    justify-content: space-between;
    align-items: end;
}

.flexStartStart {
    display: flex;
    justify-content: start;
    align-items: start;
}

.flexCenterStart {
    display: flex;
    justify-content: start;
    align-items: center;
}

.flexEndStart {
    display: flex;
    justify-content: start;
    align-items: end;
}

.flexStartCenter {
    display: flex;
    justify-content: center;
    align-items: start;
}

.flexCenterCenter {
    display: flex;
    justify-content: center;
    align-items: center;
}

.flexStartEnd {
    display: flex;
    justify-content: end;
    align-items: start;
}

.flexCenterEnd {
    display: flex;
    justify-content: end;
    align-items: center;
}

.w-full {
    width: 100%
}

.blueColor {
    color: var(--blue)
}

.yellowBg {
    background: var(--yellow)
}

.pinkBg {
    background: var(--pink)
}

.greenBg {
    background: var(--green)
}

.purpleBg {
    background: var(--purple)
}

.blueBg {
    background: var(--blue)
}

.yellowColor {
    color: var(--yellow)
}

.pinkColor {
    color: var(--pink)
}

.greenColor {
    color: var(--green)
}

.purpleColor {
    color: var(--purple)
}

.blueColor {
    color: var(--blue)
}

.whiteColor {
    color: var(--white)
}

.mb0 {
    margin-bottom: 0 !important
}

/*header*/
.header {
    position: fixed;
    top: 1.88rem;
    left: 50%;
    transform: translateX(-50%);
    background: var(--white);
    width: calc(100% - 10.0rem);
    border-radius: 6.19rem;
    height: 5.0rem;
    padding: 0 5.0rem;
    transition: .3s;
    z-index: 999;
}

.header .flexCenterBetween{
	height: 100%;
}

.headerMenuList {
    display: flex;
    justify-content: center;
    align-items: start;
    text-align: center;
    cursor: pointer;
	height: 100%;

}

.headerMenuList div{
	height: 100%;
}

/* .header.hover .logo {
    margin-top: -4px
} */

.header .logo {
    width: 10.0rem;
}

.headerTab {
    width: 1.25rem;
    height: 1.25rem;
    position: relative;
    margin-left: 1.88rem
}

.headerTab div {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 6.19rem;
    position: absolute;
    top: 0;
    left: 0;
}

.headerTab div:nth-child(1) {
    background: #00CDC3
}

.headerTab div:nth-child(2) {
    right: 0;
    left: auto;
    background: #FFCC5C
}

.headerTab div:nth-child(3) {
    top: auto;
    bottom: 0;
    background: #40A7FF
}

.headerTab div:nth-child(4) {
    top: auto;
    bottom: 0;
    right: 0;
    left: auto;
    background: #000000
}

.headerRight {
    position: relative;
}

.langWrap {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 3.12rem;
    transform: translateY(-50%)
}

.langWrap li {
    padding: 0 0.94rem;
    font-size: 0.88rem;
    font-weight: 400;
    position: relative;
    line-height: 100%;
    opacity: .5;
    cursor: pointer;
}

.langWrap li.active {
    font-weight: 700;
    opacity: 1;
}

.langWrap li:first-child:after {
    content: '';
    display: inline-block;
    width: 0.06rem;
    height: 0.75rem;
    background: #000;
    opacity: .5;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%)
}

.headerMenuList p {
    font-size: 1.12rem;
    font-weight: 600;
    margin: 0 3.12rem;
	height: 100%;
	display: flex; align-items: center;

}

.headerMenuList p:hover,
.headerMenuList p.active {
    color: #40A7FF;
}

.headerMenuList ul {
    height: auto;
    overflow: hidden;
    padding: 2.5rem 0;
    display: none;
}

.header.hover .headerMenuList ul {
    display: block
}

.headerMenuList li {
    font-size: 1rem;
    font-weight: 400;
    color: #6D6D6D;
    margin-bottom: 0.94rem;
    font-family: 'Pretendard', sans-serif;
}

.headerMenuList li:hover {
    color: #40A7FF;
    text-decoration: underline;
    text-underline-offset: 0.25rem;
}

.header.active {
    width: 100%;
    top: 0;
    border-radius: 0;
    transition: .3s;
}

/* .hover.active .flexCenterBetween {
    align-items: start !important;
} */

.header .gnb_bg{width: 100%; height: 14.0625rem; border-top: 1px solid #E3E3E3; background: #FFF; position: absolute; top: 100%; z-index: -1; display: none;}

.header.hover .gnb_bg{display: block;}

.header .gnb_bg:after {
    content: '';
    display: block;
    width: 100%;
    height: 4.38rem;
    background: url('/img/main/medu_bg_logo.svg') no-repeat left center / contain;
    position: absolute;
    bottom: 4.88rem;
	margin: 0 5rem;
    left: 0;
    z-index: -1
}

/* .header.hover {
    border-bottom: 0.06rem solid #E3E3E3;
    height: auto;
} */

/* .header.hover .w-full {
    padding-top: 1.9rem;
} */

@keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}


.siteMap {
    width: 100%;
    background: rgba(34, 34, 34, 0.9);
    backdrop-filter: blur(18px);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    color: #fff;
    transition: all .5s ease;
    height: 0;
}

.siteMap:after {
    content: '';
    display: inline-block;
    width: 30.62rem;
    height: 18.62rem;
    background: url('/img/site_map_bg.png') no-repeat center center / 100% 100%;
    position: absolute;
    bottom: 6.25rem;
    right: 0
}

.siteMap.on {
    visibility: initial;
    height: 100%;
}

.siteMap.off {
    visibility: hidden;
    height: 0;
}

.siteMap.on .siteMapCont,
.siteMap.on .all_menu_close {
    animation: fade-in 1s ease both;
    animation-delay: 0.3s;
}

.siteMap.off .siteMapCont,
.siteMap.off .siteMapClose {
    animation: fade-out 0.5s ease both;
}

.siteMapCont {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 87.5rem;
}

.siteMapTitle {
    font-family: Montserrat;
    font-weight: 700;
    font-style: Bold;
    font-size: 3.75rem;
}

.siteMap ul {
    margin-top: 3.88rem;
    width: 100%;
}

.siteMap ul li {
    padding: 2.5rem 0;
    border-bottom: 0.06rem solid rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: start;
    align-items: center;

}

.siteMap ul li:hover {
    border-bottom: 0.06rem solid #fff;
    transition: .4s
}

.siteMap ul li p {
    font-size: 1.5rem;
    font-weight: 700;
    color: #fff;
    width: 6.56rem;
    letter-spacing: -0.19rem;
    font-family: 'Pretendard', sans-serif;
    margin-right: 5.62rem;
}

.siteMap ul li a {
    font-size: 1.12rem;
    font-weight: 700;
    color: #A8A8A8;
    font-family: 'Pretendard', sans-serif;
    width: 10.62rem;
    margin-right: 4.06rem;
}

.siteMap ul li a:hover {
    color: #fff;
    transition: .4s
}

.siteMapClose {
    cursor: pointer;
}

.mobSiteMap {
    display: none;
}

.quickWrap {
    position: fixed;
    bottom: 1.88rem;
    right: 1.25rem;
    z-index: 99
}

.quickWrap ul {
    height: auto;
    overflow: hidden;
    border-radius: 0.62rem;
    box-shadow: 0.0rem 0.44rem 1.81rem 0.0rem #64646F33;

}

.quickWrap ul:nth-child(1) {
    background: #A7D6FF
}

.quickWrap ul {
    background: var(--white);
    margin-top: 0.62rem;
}

.quickWrap li {
    width: 4.38rem;
    height: 4.38rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 0.06rem solid rgba(255, 255, 255, .3);
    cursor: pointer
}

.quickWrap li:last-child {
    border-bottom: 0
}

.quickWrap li div {
    text-align: center;
}

.quickWrap li img {
    margin-bottom: 0.25rem;
}

.quickWrap .pc {
    display: inline-block !important
}

.quickWrap li p {
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 133%;
    letter-spacing: -0.03rem;
}


.rainbowBtn {
    padding: 0 2.25rem;
    height: 4.56rem;
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    color: var(--white);
    border: 0;
    outline: 0;
    border-radius: 0.62rem;
    font-size: 1.38rem;
    font-weight: 600;
    padding: 0 2.25rem;
    cursor: pointer;
    background: linear-gradient(87.25deg, rgba(228, 104, 98, 0.8) -1.56%, rgba(173, 114, 253, 0.9) 27.79%, rgba(89, 120, 255, 0.9) 59.66%, #29C4A8 91.53%);
}

.mb-24 {
    margin-bottom: 1.5rem;
}

.mb-32 {
    margin-bottom: 32px
}

.mb-40 {
    margin-bottom: 2.5rem;
}

.ellipsis {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4em;
    /* height: 2.8em; */
}

.textCenter {
    text-align: center;
}

/*footer*/
footer {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #231815;
}

.newFooter {
    width: 100.0rem;
}

.footerCont {
    padding-bottom: 3.12rem;
    padding-top: 4.38rem;
    border-bottom: 0.06rem solid #555555
}

.footLogo {
    height: 2.38rem;
    margin-right: 1.75rem;
}

.ftList {
    margin-top: 2.69rem
}

.ftList {
    font-size: 1.12rem;
    font-weight: 500;
    color: var(--white);
}

.ftList div {
    display: inline-flex;
    justify-content: start;
    align-items: start;
    margin-right: 1.25rem;
    margin-bottom: 0.62rem
}

.ftList span {
    font-weight: 400;
    color: #BEBEBE;
    margin-right: 0.5rem
}

.footSnsList li {
    width: 1.88rem;
    height: 1.88rem;
    margin-right: 0.62rem;
    opacity: .8;
    cursor: pointer;
}

.footContRight {
    color: var(--white);
    padding-top: 5.12rem;
    margin-right: 12.69rem
}

.footRsTxt {
    font-size: 1.12rem;
    font-weight: 700;
    margin-bottom: 0.62rem;
}

.footRTit {
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.62rem;
}

.footRTxt {
    font-size: 1.0rem;
    font-weight: 400;
    margin-bottom: 0.62rem;
    color: #BEBEBE
}

.kakaoBtn {
    padding: 0 0.94rem;
    border: 0;
    outline: 0;
    border-radius: 0.31rem;
    height: 2.19rem;
    background: #FFD82A;
    font-size: 1.0rem;
    font-weight: 500;
    color: #111
}

.kakaoBtn img {
    margin: 0 0.16rem
}

.kakaoBtn img:first-child{width:1.5rem}
.kakaoBtn img:last-child{width:1.06rem}

.footContBottom {
    padding: 2.19rem 0 3.44rem 0;
}

.footContBottom p {
    font-size: 1.0rem;
    font-weight: 500;
    color: #BEBEBE
}

.footContBottom ul {
    display: flex;
    justify-content: start;
    align-items: center;
}

.footContBottom ul li a {
    font-size: 1.0rem;
    font-weight: 500;
    color: #E7E7E7;
    margin-left: 1.62rem;
    cursor: pointer;
}

.footContBottom ul li:first-child a {
    color: var(--white);
    font-weight: 700;
    margin-left: 0
}

@keyframes up {
    0% {
        opacity: 0;
        transform: translateY(5rem)
    }

    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

.en .headerMenuList p {
    margin: 0 2rem
}

@media all and (max-width:1650px) {
    .en .headerMenuList {margin-left: -5rem;}
    .en .headerMenuList p {
        margin: 0 1.5rem
    }
}

@media all and (max-width:1600px) {
    .header {
        padding: 0 2rem;
        width: calc(100% - 3rem)
    }
	
	.header .gnb_bg:after {
    height: 3rem;
    bottom: 5.88rem;
	margin: 0 2rem;
}

    .headerMenuList p {
        margin: 0 2.8rem
    }

    .en .headerMenuList p {
        margin: 0 2rem
    }

    .langWrap li {
        padding: 0 0.5rem
    }

    .siteMapCont {
        width: calc(100% - 15rem)
    }

    .siteMap ul {
        margin-top: 1rem;
    }

    .siteMap ul li {
        padding: 2rem 0
    }

    .siteMap ul li p {
        letter-spacing: 0;
        white-space: nowrap;
    }

    .newFooter {
        width: calc(100% - 2.5rem)
    }

    .footContRight {
        margin-right: 0
    }
}

@media all and (max-width:1440px) {
    .en .headerMenuList {margin-left: -5rem;}
    .en .headerMenuList p {
        margin: 0 1.2rem
    }
}

@media all and (max-width:1280px) {
    .header {
        width: 100%;
        top: 0;
        height: 3.75rem;
        border-radius: 0
    }

    .headerMenuList {
        display: none;
    }

    .header.hover, .header.active {
        height: 3.75rem;
        border-bottom: 0;
    }

    .header.hover .w-full {
        padding-top: 0;
    }

    .header.hover .logo {
        margin-top: 0
    }

    .siteMap ul li a {
        white-space: nowrap;
    }

    .siteMapCont {
        width: calc(100% - 3rem)
    }

    .siteMap ul li p {
        width: 4.56rem;
        font-size: 1.2rem;
        margin-right: 0;
    }

    .siteMap ul li a {
        font-size: 1rem;
        margin-right: 0;
        margin-left: 3rem;
        width: 7.62rem
    }

    .hover.active .flexCenterBetween {
        align-items: center !important;
    }

    .footerCont {
        display: block;
    }

    .footContRight {
        padding-top: 2.5rem
    }

    .upAnimation.on {
        animation: up linear .6s forwards
    }

    .quickWrap .pc {
        display: none !important
    }

    .langWrap {
        display: none;
    }

    .header {
        padding: 0 1.62rem
    }

	.header.hover .gnb_bg{display: none;}

	.siteMap{display: none !important;}

    .mobSiteMap {
        width: 100%;
        height: 100%;
        background: #fff;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1001;
    }

    .mobSiteMap.active {
        display: block;
    }

    .mobSiteTop {
        padding: 16px 20px;
    }

    .mobSiteClose {
        width: 24px;
        height: 24px;
        position: absolute;
        top: 20px;
        right: 20px;
        cursor: pointer;
    }

    .mobSiteTop .logo {
        width: 150px;
        height: 26px;
        margin: 38px auto 38px;
        cursor: pointer;
    }

    .mobLang {
        display: flex;
        justify-content: start;
        align-items: center;
    }

    .mobLang li {
        font-size: 14px;
        font-weight: 700;
        margin-right: 15px;
        color: rgba(0, 0, 0, .5);
        cursor: pointer;
    }

    .mobLang li:first-child {
        padding-right: 15px;
        position: relative;
    }

    .mobLang li:first-child:after {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        width: 1px;
        height: 12px;
        background: rgba(0, 0, 0, .5)
    }

    .mobLang li.active a {
        color: #6EB0FF
    }

    .mobSiteCont {
        height: calc(100vh - 158px);
        overflow-y: auto;
        border-top: 1px solid #e7e7e7
    }

    .mobSiteCont::-webkit-scrollbar {
        display: none;
    }

    .mobSiteCont>div {
        border-bottom: 1px solid #e7e7e7;
        cursor: pointer;
    }

    .mobSiteCont p {
        font-size: 16px;
        font-weight: 600;
        color: #000;
        padding: 17px 20px;
        position: relative;
        display: flex;
        justify-content: start;
        align-items: center;
        height: 60px
    }

    .mobSiteCont p:after {
        content: '';
        display: block;
        width: 24px;
        height: 24px;
        background: url('/img/up_arrow_bk.svg') no-repeat center center / 10px 6px;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%) rotate(0);
        transition: .4s
    }

    .mobSiteCont ul {
        padding: 20px;
        background: #F9F9F9;
        height: auto;
        overflow: hidden;
        display: none;
    }

    .mobSiteCont ul li {
        font-size: 14px;
        font-weight: 500;
        color: #8e8e8e;
        padding: 4px 0;
    }

    .mobSiteCont ul li:hover,
    .mobSiteCont ul li.active {
        color: #000;
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    .mobSiteCont div.active p {
        background: linear-gradient(87.25deg, rgba(228, 104, 98, 0.8) -1.56%, rgba(173, 114, 253, 0.9) 27.79%, rgba(89, 120, 255, 0.9) 59.66%, #29C4A8 91.53%);
        color: #fff
    }

    .mobSiteCont div.active p:after {
        background: url('/img/up_arrow_wh.svg') no-repeat center center / 10px 6px;
        transform: translateY(-50%) rotate(180deg);
        transition: .4s
    }

    .moFootRCont {
        display: flex;
        justify-content: start;
        align-items: center;
    }

    .footRTxt {
        margin-left: 0.5rem
    }

    .footContRight {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .kakaoBtn img {
        width: 1.5rem
    }

    .quickWrap li img {
        width: 1.8rem
    }

    .pc {
        display: none !important;
    }

    .mob {
        display: block !important;
    }
}

@media (min-width:769px) and (max-width:930px) {
	.mobMo {display: block !important;}
	.pc{display: none !important;}
	.mob{display:none !important}
    .quickWrap ul.mobMo {display:none !important;}
}

@media all and (max-width:768px) {
    .mobMo {display: block !important;}
    .header {
        height: 3.75rem;
        padding: 0 1.25rem
    }

    .quickWrap {
        bottom: 1.28rem;
        right: 0.93rem
    }

    .quickWrap li p {
        font-size: 0.68rem
    }

    .quickWrap li {
        width: 3.12rem;
        height: 3.12rem;
    }

    .quickWrap li img {
        width: 0.93rem;
        height: 1.18rem
    }
    .quickSns {display:none;}
    .quickToggleBtn {background:#A7D6FF url('/img/quick_toggle_bk.svg') no-repeat center center / 2.14rem 1.88rem;}
    .quickToggleBtn.active {background:#1D50A2 url('/img/close_wh.svg') no-repeat center center / 2.14rem 1.88rem;}
    .footerCont {
        padding: 2.53rem 0;
    }

    .footLogo {
        height: 1.62rem;
        margin-right: 0;
        margin-bottom: 1.92rem
    }

    .footerCont .flexEndStart {
        display: block;
    }

    .ftList {
        margin-top: 1.89rem;
        font-size: 0.81rem;
    }

    .footContRight {
        padding-top: 1.58rem;
    }

    .footContRight {
        display: block;
    }

    .footRsTxt {
        font-size: 0.87rem;
        margin-bottom: 0.23rem
    }

    .moFootRCont {
        display: block;
    }

    .footRTit {
        font-size: 1.37rem;
        margin-bottom: 0.4rem
    }

    .footRTxt {
        font-size: 0.93rem;
        margin-right: 0;
        margin-bottom: 0.94rem;
        margin-left:0
    }

    .kakaoBtn {
        height: 2.18rem
    }

    .footContBottom {
        justify-content: start;
        align-items: unset;
        flex-flow: column-reverse;
    }

    .footContBottom ul {
        margin-bottom: 0.94rem;
    }

    .footContBottom p,
    .footContBottom ul li a {
        font-size: 0.87rem
    }

    .footContBottom ul li a {
        margin-left: 0.61rem
    }

    .en .footContBottom ul li a {min-width: max-content;}

    .kakaoBtn {
        font-size: 0.87rem
    }

}