@charset "euc-kr";


:root { --point-color: #411cff; } 

/* evSection */
.evSection .clamp-text { margin-bottom: 15px; color: #111111; font-size: 24px; font-weight: bold; } 
.evSection .clamp-title { line-height: 1.3; color: #111111; font-size: 40px; font-weight: 900; } 
.evSection .clamp-title span { color: var(--point-color); } 
.evSection .tab_base.default { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 3px; overflow: hidden; } 
.evSection .tab_base.default li { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; flex: 1; height: 77px; color: #ababab; font-size: 20px; font-weight: bold; background-color: #ececec; cursor: pointer; } 
.evSection .tab_base.default li::before { position: absolute; left: -3px; bottom: 0; content: ''; width: 100vw; height: 2px; background-color: #000; } 
.evSection .tab_base.default li.on { color: #000; background-color: #fff; border-top: 2px solid #000; border-left: 2px solid #000; border-right: 2px solid #000; } 
.evSection .tab_base.default li.on::before { display: none; } 
.evSection .tab_base.default li a { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 5px; width: 100%; height: 100%; } 

.evSection .tab_base.default_inner { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; margin-top: 18px; margin-left: 12px; margin-bottom: 38px; } 
.evSection .tab_base.default_inner li { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; margin-right: 10px; padding-right: 10px; color: #000000; font-size: 14px; cursor: pointer; } 
.evSection .tab_base.default_inner li::before { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ''; width: 1px; height: 13px; background-color: #000; } 
.evSection .tab_base.default_inner li.on { color: var(--point-color); } 
.evSection .tab_base.default_inner li:last-of-type:before { display: none; } 
.evSection .tab_base.default_inner li a { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 100%; height: 100%; } 
.evSection .panel_base_inner > h6 { display: flex; flex-direction: row; align-items: center; justify-content: center; margin-bottom: 45px; padding: 13px 0; line-height: 1.3; color: #111111; font-size: 18px; font-weight: bold; background-color: #f4f4f4; } 
.evSection .panel_base_inner > h5 { margin-bottom: 20px; line-height: 1.3; color: var(--point-color); font-size: 22px; font-weight: bold; } 
.eventVideo.with_shadow { margin-bottom: 40px; } 
.eventVideo.with_shadow::before { opacity: 0.6; } 
.eventVideo.system .video_title { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 118px 0 0 110px; text-align: left; z-index: 2; } 
.eventVideo.system .video_title span { color: #fff; font-size: 20px; font-weight: 400 } 
.eventVideo.system .video_title strong { display: block; margin-top: 22px; line-height: 1.4; color: #fff; font-size: 40px; font-weight: bold; } 
.eventVideo.system .video_title::before { position: absolute; left: 110px; bottom: 140px; content: ''; display: block; width: 106px; height: 106px; font-size: 0; background: url('https://img.megagong.net/m/2024/0611_series/icon_videoplay.png') no-repeat 0 0; background-size: contain; } 
.eventVideo.system .video_box.prof .play_area > img { position: absolute; top: initial; left: initial; right: 4%; bottom: 0; width: auto; height: 90%; z-index: 1; object-fit: contain; } 
.evSection .teacher_point { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; width: 100%; } 
.evSection .teacher_point .swiper_common { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; width: 100%; } 
.evSection .teacher_point .swiper-wrapper { gap: 20px; } 
.evSection .teacher_point .swiper-slide { width: calc(33.33% - 13.34px) !important; } 
.evSection .teacher_point .top_box { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 41px 0 46px 0; background-color: #f3f3f3; z-index: 1; } 
.evSection .teacher_point .top_box span { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 120px; height: 30px; color: #ffffff; font-size: 15px; background-color: #111111; border-radius: 40px; } 
.evSection .teacher_point .top_box p { margin-top: 16px; line-height: 1.4; color: #111111; font-size: 18px; font-weight: 400; } 
.evSection .tab_subtitle { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; margin: 0 auto; margin-bottom: 40px; padding: 10px 60px; color: #fff; font-size: 18px; font-weight: 400; background-color: #111111; border-radius: 40px; } 


/* evBnr */
.evBnr { background-color: #111111; } 
.evBnr ul { display: flex; flex-direction: row; align-items: center; justify-content: center; } 
.evBnr ul li { position: relative; flex: 1; height: 70px; color: #777777; font-size: 16px; } 
.evBnr ul li:hover { color: #fff; } 
.evBnr ul li::before { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ''; width: 1px; height: 30px; background-color: #3a3a3a; } 
.evBnr ul li.on::before,
.evBnr ul li:last-of-type::before { display: none; } 
.evBnr ul li.on { color: #fff; font-weight: bold; background-color: var(--point-color); } 
.evBnr ul li a { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 100%; height: 100%; } 


/* main */
.main { position: relative; background-image: url('https://img.megagong.net/m/2024/0611_series/main_bg.jpg'); background-repeat: no-repeat; background-position: center; background-size: cover; } 


/* evCon1 */
.evCon1 { padding: 168px 0 181px 0; background-color: #fff; } 
.evCon1 .clamp-title { margin-bottom: 94px; } 
.evCon1 .con_box { margin: 0 -30px; } 
.evCon1 .box_wrap { position: relative; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; width: 100%; gap: 21px 67px; padding: 60px 105px; border: 1px solid #cbcbcb; border-radius: 20px; } 
.evCon1 .box_wrap .box_wrap_title { position: absolute; top: -25px; left: 50%; transform: translate(-50%, 0); display: flex; flex-direction: row; align-items: center; justify-content: center; width: 237px; height: 50px; color: #fff; font-size: 16px; background-color: #000; border-radius: 40px; } 
.evCon1 .box_wrap .box { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: calc(50% - 34px); height: 150px; border: 1px solid #dcdcdc; border-radius: 20px; overflow: hidden; cursor: pointer; } 
.evCon1 .box_wrap .box > h6 { color: #111111; font-size: 28px; font-weight: 900; } 
.evCon1 .box_wrap .box > span { display: inline-block; margin-top: 8px; padding: 4px 20px; color: #8d8d8d; background-color: #f3f3f3; border-radius: 40px; } 
.evCon1 .box_wrap .box .box_active { position: absolute; top: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; background-color: var(--point-color); opacity: 0; } 
.evCon1 .box_wrap .box.active .box_active { opacity: 1; } 
.evCon1 .box_wrap .box .box_active .box_active_title { display: inline-flex; flex-direction: row; align-items: flex-start; justify-content: center; width: 67px; height: 27px; color: #fff; font-size: 16px; font-weight: 400; border-bottom: 1px solid #fff; } 
.evCon1 .box_wrap .box .box_active .box_active_inner { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: 13px; } 
.evCon1 .box_wrap .box .box_active .box_active_inner p { line-height: 1.6; color: #fff; font-size: 18px; font-weight: 400; } 
.evCon1 .box_wrap .box .box_active .box_active_inner p b { font-weight: bold; } 

/* evCon2 */
.evCon2 { padding: 170px 0 165px 0; background-color: #f2f2f2; } 
.evCon2 .clamp-title { margin-bottom: 94px; } 
.evCon2 .clamp-title sup { font-size: 23px; } 
.evCon2 .con_box { margin: 0 -30px; } 
.evCon2 .box_wrap { position: relative; padding: 65px 96px 30px 96px; background-color: #fff; border: 1px solid #cccccc; border-radius: 20px; } 
.evCon2 .box_wrap .box_title { position: absolute; top: -25px; left: 50%; transform: translate(-50%, 0); display: flex; flex-direction: row; align-items: center; justify-content: center; width: auto; height: 50px; padding: 0 68px; color: #fff; font-size: 18px; background-color: #111111; border-radius: 40px; } 
.evCon2 .box_wrap .tiny_noti { width: 100%; margin-top: 35px; color: #9e9e9e; font-size: 14px; text-align: right; } 
.evCon2 .con_box .clamp-text { margin-top: 47px; line-height: 1.5; font-weight: 400; } 
.evCon2 .con_box .clamp-text b { font-weight: bold; } 


/* evCon3 */
.evCon3 { padding: 170px 0 0 0; background-color: #ffffff; } 
.evCon3 .clamp-title { margin-bottom: 67px; } 


/* evCon4 */
.evCon4 { padding: 150px 0 153px 0; background-color: #ffffff; } 
.evCon4 .clamp-title { margin-bottom: 67px; } 


/* evBanner */
.evBanner { padding: 35px 0; background-color: #1e25f1; } 
.evBanner p { color: #fff; font-size: 22px; font-weight: bold; } 


/* evCon5 */
.evCon5 { padding: 90px 0 185px 0; background-color: #f2f2f2; } 
.evCon5 .subtitle_line { margin-bottom: 45px; } 
.lecTab_wrap > div ul, .teaTab_wrap > div ul, .stepTab_wrap > div ul { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; } 
.conditionSearch_wrap { display: none; } 


/* event */
.event { padding: 180px 0 226px 0; background-color: #1e25f1; } 
.event .con_tit { margin-bottom: 74px; } 
.event .con_tit > img { margin-bottom: 32px; } 
.event .con_tit .end::after { top: 50px; right: 118px; background: #d6d6fa; } 
.event .con_tit .clamp-text { margin-bottom: 0; color: #64c8ff; font-weight: 400; } 
.event .con_tit .clamp-title { color: #fff; font-size: 60px; font-weight: 900; } 
.event .con_tit .clamp-title i { font-size: 40px; font-style: normal; font-weight: 400; } 
.event .con_tit .clamp-title span { color: #64c8ff; } 
.event .coupon_wrap { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 94px; } 
.event .coupon_wrap::before { position: absolute; top: 174px; left: -100vw; content: ''; width: 200vw; height: 100vh; background-color: #0d13d9; z-index: 0; } 
.event .coupon_wrap > img { margin-bottom: 86px; z-index: 1; } 
.event .container_info.ver_circle { display: inline-flex; flex-direction: column; gap: 30px; z-index: 1; } 
.container_info.ver_circle .info { align-items: center; } 
.event .container_info.ver_circle .info .info_title { width: 150px; color: #1e25f1; font-size: 16px; background-color: #61c9ff; } 
.event .container_info.ver_circle .info .info_date { color: #fff; } 
.container_info .info .noti { color: #62c9ff; } 
.event .btn_wrap { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 1; } 
.event .btn_wrap a { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 400px; height: 80px; color: #fff; font-size: 24px; font-weight: bold; background-color: #000; } 


@media screen and (max-width: 1200px){
    .evCon1 .con_box,
    .evCon2 .con_box { margin: 0 auto; } 
    .evCon1 .box_wrap { gap: 20px 40px; padding: 50px 40px; } 
}

@media screen and (max-width: 992px){
    .evSection .clamp-text { font-size: clamp(18px,2vmin,22px); } 
    .evSection .clamp-title,
    .event .con_tit .clamp-title { font-size: clamp(26px,4.3vmin,46px); } 
    .event .con_tit .clamp-title i { font-size: clamp(26px,4.3vmin,46px); } 
    .evCon1 .box_wrap .box .box_active .box_active_inner p { font-size: 14px; } 
    .evCon2 .clamp-title sup { font-size: 19px; } 
    .evCon2 .box_wrap { padding: 65px 10px 30px 10px; } 
    .evSection .teacher_point .top_box p { font-size: 15px; } 
    .eventVideo.system .video_title { padding: 70px 0 0 70px; } 
    .eventVideo.system .video_title strong { margin-top: 0; } 
    .eventVideo.system .video_title::before { left: 70px; bottom: 70px; } 
}

@media screen and (max-width: 768px){
    .evSection .clamp-title, .event .con_tit .clamp-title { font-size: clamp(24px,4.3vmin,46px); } 
    .evSection .teacher_point { gap: 0; margin-bottom: 10vw; padding-bottom: 5vw; overflow: hidden; } 
    .evSection .teacher_point .swiper-wrapper { gap: initial; } 
    .evSection .teacher_point .swiper-slide { width: 100% !important; } 
    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction { display: flex; flex-direction: row; align-items: center; justify-content: center; } 

    .evBnr ul li { font-size: 13px; } 
    .evCon1 { padding: 10vw 0; } 
    .evCon1 .clamp-title { margin-bottom: calc(8vw + 20px); } 
    .evCon1 .box_wrap { gap: 10px 10px; padding: 50px 20px; } 
    .evCon1 .box_wrap .box_wrap_title { top: -20px; width: 210px; height: 40px; font-size: 14px; } 
    .evCon1 .box_wrap .box { width: calc(50% - 5px); } 
    .evCon2 { padding: 10vw 0; } 
    .evCon2 .clamp-title { margin-bottom: calc(8vw + 20px); } 
    .evCon2 .clamp-title sup { font-size: 15px; } 
    .evCon2 .box_wrap .box_title { top: -20px; height: 40px; font-size: 14px; } 
    .evCon2 .box_wrap .tiny_noti { font-size: 11px; } 
    .evCon3 { padding: 10vw 0 0 0; } 
    .evCon3 .clamp-title { margin-bottom: 8vw; } 
    .evSection .tab_subtitle { margin-bottom: 30px; padding: 10px 30px; font-size: 15px; } 
    .evSection .tab_base.default li { height: 60px; font-size: 17px; } 
    .evSection .panel_base_inner > h6 { margin-bottom: 30px; font-size: 16px; } 
    .eventVideo.system .video_title { padding: 70px 0 0 70px; } 
    .eventVideo.system .video_title strong { margin-top: 0; font-size: 28px; } 
    .eventVideo.system .video_title::before { left: 70px; bottom: 70px; width: 70px; height: 70px; } 
    .evCon4 { padding: 10vw 0; } 
    .evSection .teacher_point { margin-bottom: 0; padding-bottom: 0; } 
    .evBanner p { font-size: 18px; } 
    .evCon5 { padding: 10vw 0; } 
    .evCon5 .subtitle_line { margin-bottom: 5vw; } 
    .event { padding: 10vw 0; } 
    .event .con_tit { margin-bottom: 5vw; } 
    .event .con_tit > img { margin-bottom: 15px; } 
    .event .con_tit .end::after { top: 0; right: 0; } 
    .event .coupon_wrap { margin-bottom: 10vw; } 
    .event .coupon_wrap > img { margin-bottom: 50px; } 
    .event .container_info.ver_circle .info .info_title { width: 110px; font-size: 14px; } 
    .container_info.ver_circle .info .info_date { padding-top: 0; } 
    .event .btn_wrap a { width: 400px; height: 60px; font-size: 20px; } 
}

@media screen and (max-width: 576px){
    .evSection .clamp-text { margin-bottom: 2px; font-size: clamp(13px,2vmin,18px); } 
    .evSection .clamp-title { font-size: clamp(18px,5.5vmin,30px); } 
    .event .con_tit .clamp-title i { font-size: clamp(18px,5.5vmin,30px); } 
    .evBnr ul li { font-size: 12px; } 
    .evCon1 .box_wrap { padding: 50px 10px; } 
    .evCon1 .box_wrap .box > h6 { font-size: 22px; } 
    .evCon1 .box_wrap .box .box_active .box_active_inner p { font-size: 12px; } 
    .evCon2 .clamp-title sup { font-size: 11px; } 
    .evCon2 .box_wrap .box_title { padding: 0 20px; } 
    .evSection .tab_base.default li { height: 55px; font-size: 14px; } 
    .evSection .panel_base_inner > h5 { font-size: 18px; } 
    .eventVideo.system .video_title { padding: 30px 0 0 30px; } 
    .eventVideo.system .video_title strong { margin-top: 0; font-size: 20px; } 
    .eventVideo.system .video_title::before { left: 30px; bottom: 30px; width: 40px; height: 40px; } 
    .eventVideo.with_shadow { margin-bottom: 20px; } 
    .evSection .teacher_point .top_box { padding: 30px 0 40px 0; } 
    .event .con_tit .clamp-title { font-size: clamp(24px,6vmin,30px); } 
    .event .container_info.ver_circle .info .info_title { width: 80px; font-size: 12px; } 
    .event .btn_wrap a { width: 80%; height: 55px; font-size: 16px; } 
}