@charset "euc-kr";
/* bg url: https://image.megagong.net/m/2025/ */

/* settings */
:root {
    --color-primary: #5059FF;
    --color-secondary: #3F49FF;
}

/* evMain */
.evMain {background-image: linear-gradient(110deg, #FFF 10.64%, #8B8CFF 45.06%, #1E2098 58.13%, #00001B 74.67%); background-image: url(https://image.megagong.net/m/2025/0602_newteacher/main_bg.jpg); background-repeat: no-repeat; background-size: auto 100%;}
.evMain .teacher_img {margin: 0 -880px;}
.evMain .sub_txt {position: absolute; top: 230px; left: -180px; color: #fff; text-align: left; z-index: 1;}
.evMain .sub_txt > * {display: block; line-height: 1.6;}
.evMain .sub_txt .md_txt {color: var(--color-secondary);}
.evMain .sub_txt .sm_txt {margin: 40px 0;}
.evMain .sub_txt .sm_txt > * {display: block;}
.evMain .sub_txt .sm_txt > * + * {margin-top: 23px;}
.evMain .sub_txt .sm_txt .highlight {color: var(--color-secondary);}
.evMain .main_txt {position: absolute; top: 195px; right: -235px; text-align: right; }
.evMain h3 {font-size: 120px; line-height: 1.2; color: #fff; z-index: 1;}
.evMain h3 > * {display: block;}
.evMain h3 .shiny {position: relative; color: var(--color-primary);}
.evMain h3 .shiny::before {content: ''; position: absolute; top: 0; left: calc(44% - 68.5px); width: 137px; height: 137px; background: url(https://image.megagong.net/m/2025/0602_newteacher/obj_shiny.png) no-repeat; background-size: contain;}
.evMain .date_box {display: inline-block; color: #fff; background: var(--color-primary); padding: 18px 45px; border-radius: 3px; margin-top: 25px;}

@media screen and (max-width: 1560px){
    .evMain .inner {width: 96%;}
    .evMain .teacher_img {margin: 0 -330px;}
    .evMain .sub_txt {left: -3vmin;}
    .evMain .main_txt {right: -3vmin;}
    .evMain h3 {font-size: clamp(20px, 12.5vmin, 120px);}
}
@media screen and (max-width: 1200px){
    .evMain {background-image: url(https://image.megagong.net/m/2025/0602_newteacher/main_bg_mo.jpg); background-size: cover;}
    .evMain .inner {width: 100%;}
    .evMain .teacher_img {margin: 0 auto; height: 140vw; min-height: 1550px;}
    .evMain .teacher_img > img {width: 100%; position: absolute; top: 0;}
    .evMain .sub_txt {top: 20vmin; left: 6vmin; line-height: 1.5;}
    .evMain .sub_txt .md_txt {font-size: clamp(22px, 5.6vmin, 60px); color: #fff; line-height: 1.5;}
    .evMain .sub_txt .sm_txt {font-size: clamp(18px, 4vmin, 40px); font-weight: 400; margin: 70px 0 35px;}
    .evMain .sub_txt .sm_txt > strong {font-weight: 400;}
    .evMain .sub_txt .sm_txt > * + * {margin-top: 20px;}
    .evMain .sub_txt .sm_txt .highlight {color: #fff; font-weight: 700;}
    .evMain .sub_txt .lg_txt {font-size: clamp(26px, 5.8vmin, 65px);}
    .evMain .main_txt {top: auto; bottom: 0; right: 0; width: 100%; text-align: center; padding: clamp(40px, 10vmin, 100px) 0; background: rgba(0, 0, 0, 0.6);}
    .evMain h3 {transform: none;}
    .evMain h3 .md_txt {font-size: clamp(24px, 6.5vmin, 70px);}
    .evMain h3 .lg_txt {font-size: clamp(56px, 14vmin, 120px);}
    .evMain .date_box {font-size: clamp(20px, 5.2vmin, 45px); background: none; padding: 0; transform: none; margin-top: 40px;}
}
@media screen and (max-width: 992px){
    .evMain .teacher_img {min-height: auto; height: 100%;}
    .evMain .teacher_img > img {position: initial;}
}
@media screen and (max-width: 768px){
    .evMain {background-size: auto 100%;}
}
@media screen and (max-width: 576px){
    .evMain .sub_txt {top: 15vmin;}
    .evMain .sub_txt .sm_txt {margin: 20px 0 15px;}
    .evMain .sub_txt .sm_txt > * + * {margin-top: 10px;}
    .evMain h3 .shiny::before {left: 12%; width: 100%; height: 100%;}
    .evMain .date_box {margin-top: 10px;}
}
@media screen and (max-width: 360px){
    .evMain .inner {padding-bottom: 20vmin;}
    .evMain .sub_txt .lg_txt {font-size: 24px;}
    .evMain h3 .md_txt {font-size: 22px;}
    .evMain h3 .lg_txt {font-size: 50px;}
}