@charset "euc-kr";

:root { --point-color: #ff186a; } 

/* evSection */
.evSection .con_tit {color: #111; margin-bottom: 80px;}
.evSection .con_tit h4 {font-weight: 900; font-size: 40px; line-height: 1.3; letter-spacing: -0.04em;}
.evSection .con_tit .sub_tit {font-weight: 700; font-size: 24px; line-height: 1.6;}
.evSection .con_tit .sub_tit + h4 {margin-top: 15px;}
.evSection .con_tit h4 + .sub_tit {font-weight: 300; margin-top: 30px;}
.evSection .con_tit span {color: var(--point-color);}

/* settings */
/* con_box */
.evSection .content_title {width: fit-content; font-weight: 500; font-size: 18px; color: #fff; background-color: #111; border-radius: 25px; padding: 10px 50px; margin: 0 auto 40px;}
.evSection .box_wrap {position: relative; background: #fff; border: 1px solid #ccc; border-radius: 16px; padding: 70px 0 60px; margin: 0 -30px;}
.evSection .box_wrap .content_title {position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%);}

/* °øÅë ÅÇ */
.evSection .tab_base.default {display: flex; justify-content: center; align-items: center; gap: 3px; overflow: hidden;}
.evSection .tab_base.default li {position: relative; display: flex; justify-content: center; align-items: center; flex: 1; height: 77px; color: #ababab; font-weight: 700; font-size: 20px; background-color: #ececec; cursor: pointer;}
.evSection .tab_base.default li::before {content: ''; position: absolute; left: -3px; bottom: 0; width: 100vw; height: 2px; background-color: #000;}
.evSection .tab_base.default li.on {color: #000; background-color: #fff; border: 2px solid #000; border-bottom: none;}
.evSection .tab_base.default li.on::before {content: none;}
.evSection .tab_base.default li a {display: flex; justify-content: center; align-items: center; gap: 5px; width: 100%; height: 100%;}
.evSection .tab_base.default_inner {display: flex; justify-content: flex-start; align-items: center; margin: 18px 12px 38px;}
.evSection .tab_base.default_inner li {position: relative; display: flex; justify-content: center; align-items: center; margin-right: 10px; padding-right: 10px; color: #000; font-size: 14px; cursor: pointer;}
.evSection .tab_base.default_inner li::before {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); 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 {content: none;}
.evSection .tab_base.default_inner li a {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.evSection .panel_base_inner > h6 {display: flex; justify-content: center; align-items: center; font-weight: 700; font-size: 18px; line-height: 1.3; color: #111; background-color: #f4f4f4; padding: 13px 0; margin-bottom: 45px;}
.evSection .panel_base_inner > h5 {font-weight: 700; font-size: 22px; line-height: 1.3; color: var(--point-color); margin-bottom: 20px;}
/* °øÅë ÅÇ - ºñµð¿À */
.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 {font-weight: 500; font-size: 20px; color: #fff;}
.eventVideo.system .video_title strong {display: block; font-weight: 700; font-size: 40px; line-height: 1.4; color: #fff; margin-top: 22px;}
.eventVideo.system .video_title::before {content: ''; position: absolute; left: 110px; bottom: 140px; 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: auto; left: auto; right: 4%; bottom: 0; width: auto; height: 90%; z-index: 1; object-fit: contain;}
/* °øÅë ÅÇ - Àü·« */
.evSection .teacher_point {position: relative; display: flex; justify-content: center; align-items: center; width: 100%;}
.evSection .teacher_point .swiper_common {position: relative; display: flex; justify-content: center; align-items: center; width: 100%;}
.evSection .teacher_point .swiper-wrapper {gap: 20px;}
.evSection .teacher_point .swiper-slide {width: calc(33.333% - 13.333px);}
.evSection .teacher_point .top_box {display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 41px 0 46px 0; background-color: #f3f3f3; z-index: 1;}
.evSection .teacher_point .top_box span {display: flex; justify-content: center; align-items: center; width: 120px; height: 30px; font-size: 15px; color: #fff; background-color: #111; border-radius: 40px;}
.evSection .teacher_point .top_box p {font-weight: 500; font-size: 18px; line-height: 1.4; color: #111; margin-top: 16px;}
.evSection .tab_subtitle {display: inline-flex; justify-content: center; align-items: center; margin: 0 auto 40px; padding: 10px 60px; font-weight: 500; font-size: 18px; color: #fff; background-color: #111; border-radius: 40px;}

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

/* main */
.main {position: relative; background-image: url('https://img.megagong.net/m/2024/0621_series/security/main_bg.jpg'); background-repeat: no-repeat; background-position: 50% 50%; background-size: auto 100%;}

/* evCon1 */
.evCon1 {padding: 180px 0 150px; background-color: #fff;}
.evCon1 .box_swiper {margin: 0 40px;}
.evCon1 .box_swiper .swiper-wrapper {gap: 21px;}
.evCon1 .box_swiper .swiper-slide {flex: 1 1 auto; }
.evCon1 .box_swiper + .swiper-pagination {display: none;}
.evCon1 .box_swiper + .swiper-pagination .swiper-pagination-bullet-active {background: var(--point-color);}
.evCon1 .box_swiper .box {position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column; height: 206px; border: 1px solid #ddd; border-radius: 16px; overflow: hidden; cursor: pointer;}
.evCon1 .box_swiper .box + .box {margin-top: 21px;}
.evCon1 .box_swiper .box > span {font-weight: 500; font-size: 14px; color: var(--point-color);}
.evCon1 .box_swiper .box:not(.two_line) > span {margin-top: 19.5px;}
.evCon1 .box_swiper .box strong {font-weight: 900; font-size: 28px;}
.evCon1 .box_swiper .box .btn {width: 140px; font-size: 14px; color: #8d8d8d; background: #f3f3f3; border-radius: 16px; padding: 4px 0; margin-top: 10px;}
.evCon1 .box_swiper .box .box_active {position: absolute; width: 100%; height: 100%; background: var(--point-color); display: flex; flex-direction: column; justify-content: center; align-items: center; visibility: hidden; opacity: 0;}
.evCon1 .box_swiper .box.active .box_active {visibility: visible; opacity: 1;}
.evCon1 .box_swiper .box .box_active .tit {font-weight: 400; font-size: 16px; color: #fff; border-bottom: 1px solid #fff; padding: 0 3px 10px; margin-bottom: 15px;}
.evCon1 .box_swiper .box .box_active .txt {font-weight: 700; font-size: 18px; color: #fff;}
.evCon1 .box_swiper .box .box_active .txt span {color: #ffd200;}
.evCon1 .content_wrap {margin-top: 80px;}
.evCon1 .merit {justify-content: center; align-items: center; gap: 44px;}
.evCon1 .merit li {display: flex; flex-direction: column; justify-content: center; align-items: center; width: 304px; height: 304px; background: #f3f3f3; border-radius: 50%;}
.evCon1 .merit li .ico {margin-bottom: 20px;}
.evCon1 .merit li .txt {font-weight: 700; font-size: 18px; padding-bottom: 20px;}
.evCon1 .merit li:last-child {padding: 44px 0;}
.evCon1 .merit li:last-child .txt {margin-bottom: auto;}

/* evCon2 */
.evCon2 {padding: 180px 0; background-color: #f2f2f2;}
.evCon2 .con_box {margin: 0 -30px}
.evCon2 .tab_base {display: flex; justify-content: center; align-items: center; gap: 2px;}
.evCon2 .tab_base li {flex: 1;}
.evCon2 .tab_base li a {display: block; font-weight: 700; font-size: 20px; color: #ababab; background: #ececec; padding: 25px 0;}
.evCon2 .tab_base li.on a {color: #fff; background: var(--point-color);}
.evCon2 .panel_base {background: #fff; border: 1px solid #ccc;}
.evCon2 .panel_base .part_wrap {height: 810px; padding: 55px 68px 60px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center;}
.evCon2 .panel_base .tit {font-weight: 400; font-size: 22px; margin-bottom: 45px;}
.evCon2 .panel_base .con {margin-bottom: auto;}
.evCon2 .panel_base .point {position: relative; background: #fafafa; border-radius: 16px;}
.evCon2 .panel_base .point .point_tit {position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); font-weight: 700; font-size: 18px; background: #e9e9e9; width: 304px; padding: 12px 0; border-radius: 25px;}
.evCon2 .panel_base .point ul {padding: 57px 30px 46px 55px;}
.evCon2 .panel_base .point li {position: relative; padding-left: 8px; font-size: 16px; text-align: left; letter-spacing: -0.04em;}
.evCon2 .panel_base .point li + li {margin-top: 10px;}
.evCon2 .panel_base .point li span {position: absolute; top: 0; left: 0;}
.evCon2 .panel_base .point .cr_red {font-style: normal; color: #f00;}
.evCon2 .panel_base .point .cr_blue {font-style: normal; color: #00f;}

/* evEssential */
.evEssential {padding: 180px 0 80px; background-color: #fff;}

/* evMajor */
.evMajor {padding: 80px 0 120px; background-color: #fff;}

/* evBelt */
.evBelt {padding: 35px 0; background-color: var(--point-color);} 
.evBelt p {font-weight: 700; font-size: 22px; color: #fff;} 

/* evLecture */
.evLecture {padding: 100px 0 180px; background-color: #f2f2f2;}
.evLecture .subtitle_line {margin-bottom: 45px;}
.evLecture .subtitle_line .text {font-size: 22px;}
.lecTab_wrap > div ul,
.teaTab_wrap > div ul,
.stepTab_wrap > div ul {display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
.conditionSearch_wrap {display: none;}

/* event */
.event {padding: 180px 0 200px; background-color: #f34482;}
.event .con_tit {margin-bottom: 70px;}
.event .con_tit > img {margin-bottom: 32px;}
.event .con_tit .end {top: 50px; right: 118px;}
.event .con_tit .end::after {background: #fff; opacity: 0.8;}
.event .con_tit .sub_tit {font-weight: 300; color: #ffa7c6;}
.event .con_tit h4 {font-weight: 500; font-size: 40px; color: #fff;}
.event .con_tit h4 b {font-weight: 900; font-size: 60px;}
.event .con_tit h4 span {color: #ffa8c7;}
.event .coupon_wrap {position: relative; z-index: 0; margin-bottom: 120px;}
.event .coupon_wrap::before {content: ''; position: absolute; top: 174px; left: -100vw; width: 200vw; height: 100vh; background-color: var(--point-color); z-index: -1;}
.event .coupon_wrap > img {margin-bottom: 60px;}
.event .coupon_wrap .container_info {flex-direction: column; gap: 30px; width: fit-content; margin: 0 auto;}
.event .coupon_wrap .container_info .info_title {width: 150px; font-size: 16px; color: var(--point-color); background: #ffa8c7;}
.event .coupon_wrap .container_info .info_date {font-weight: 500; color: #fff;}
.event .btn_wrap {position: relative;}
.event .btn_wrap a {display: flex; justify-content: center; align-items: center; width: 400px; height: 80px; font-weight: 700; font-size: 24px; color: #fff; background-color: #000; margin: 0 auto;}

@media screen and (max-width: 1200px){
    /* evSection */
    .evSection .con_tit {margin-bottom: 8%;}
    .evSection .con_tit h4 {font-size: clamp(22px, 4.2vmin, 40px);}
    .evSection .con_tit .sub_tit {font-size: clamp(16px, 2.6vmin, 24px);}
    .evSection .con_tit .sub_tit + h4 {margin-top: 2%;}
    .evSection .con_tit h4 + .sub_tit {margin-top: 3%;}

    /* settings */
    /* con_box */
    .evSection .content_title {font-size: clamp(14px, 2vmin, 18px); padding: 1vmin 3vmin; margin: 0 auto 4%; white-space: nowrap;}
    .evSection .box_wrap {padding: 6vmin 2% 8vmin; margin: 0 auto;}

    /* °øÅë ÅÇ */
    .evSection .tab_base.default li {height: clamp(50px, 8vmin, 77px); font-size: clamp(15px, 2.2vmin, 20px);}
    .evSection .tab_base.default_inner {margin: 2% 1% 6%;}
    .evSection .panel_base_inner > h6 {font-size: clamp(14px, 2vmin, 18px); padding: 2% 0; margin-bottom: 4%;}
    .evSection .panel_base_inner > h5 {font-size: clamp(15px, 2.2vmin, 22px); margin-bottom: 6%;}
    /* °øÅë ÅÇ - ºñµð¿À */
    .eventVideo.with_shadow {margin-bottom: 4%;}
    .eventVideo.system .video_title {padding: 7% 0 0 7%;}
    .eventVideo.system .video_title strong {font-size: clamp(20px, 4vmin, 40px); margin-top: 2%;}
    .eventVideo.system .video_title::before {left: 7%; bottom: 14%;}
    /* °øÅë ÅÇ - Àü·« */
    .evSection .teacher_point .top_box {padding: 4vw 0;}
    .evSection .teacher_point .top_box span {font-size: clamp(12px, 1.6vmin, 15px);}
    .evSection .teacher_point .top_box p {font-size: clamp(13px, 2vmin, 18px); margin-top: 4%;}
    .evSection .tab_subtitle {margin: 0 auto 4%; padding: 1.5vmin 4vmin; font-size: clamp(14px, 2vmin, 18px);}

    /* evCon1 */
    .evCon1 {padding: 15% 0;}
    .evCon1 .box_swiper {margin: 0;}
    .evCon1 .content_wrap {margin-top: 8%;}
    .evCon1 .merit {gap: 2vw;}
    .evCon1 .merit li {width: 30vw; height: 30vw;}
    .evCon1 .merit li .ico {width: 30%; margin-bottom: 4%;}
    .evCon1 .merit li .txt {font-size: clamp(13px, 2.2vmin, 18px); padding-bottom: 2%;}
    .evCon1 .merit li:last-child {padding: 0;}
    .evCon1 .merit li:last-child .txt {margin-bottom: 0;}

    /* evCon2 */
    .evCon2 {padding: 15% 0;}
    .evCon2 .con_box {margin: 0 auto;}
    .evCon2 .box_wrap .box_inner .flex {gap: 1vw;}
    .evCon2 .tab_base li a {font-size: clamp(14px, 2.4vmin, 20px); padding: 2vw 0;}
    .evCon2 .panel_base .part_wrap {height: auto; padding: 5vw 2%;}
    .evCon2 .panel_base .tit {font-size: clamp(14px, 2.4vmin, 22px); margin-bottom: 6%;}
    .evCon2 .panel_base .con {margin-bottom: 12vw;}
    .evCon2 .panel_base .point {width: 100%;}
    .evCon2 .panel_base .point .point_tit {font-size: clamp(13px, 2vmin, 18px); width: 80%; max-width: 304px; padding: 1.5vmin 0;}
    .evCon2 .panel_base .point ul {padding: 8vmin 3vmin 6vmin;}
    .evCon2 .panel_base .point li {font-size: clamp(12px, 1.8vmin, 16px);}

    /* evTip */
    .evTip {padding: 15% 0;}
    .evTip .con_tit .badge {top: -4vw; left: 5%;}
    .evTip .con_box {margin: 0 auto;}
    .evTip .tab_base li a {font-size: clamp(14px, 2vmin, 20px); padding: 2vw 0;}
    .evTip .tab_base li a span {font-size: clamp(12px, 1.6vmin ,16px);}
    .evTip .panel_base {padding: 6vw 2%;}
    .evTip .panel_base .tit {font-size: clamp(14px, 2.2vmin, 22px); margin-bottom: 5%;}

    /* evEssential */
    .evEssential {padding: 15% 0 7.5%;}

    /* evMajor */
    .evMajor {padding: 7.5% 0 15%;}

    /* evBelt */
    .evBelt {padding: 4% 0;}
    .evBelt p {font-size: clamp(16px, 3vmin, 22px);}

    /* evLecture */
    .evLecture {padding: 8% 0 15%;}
    .evLecture .subtitle_line {margin-bottom: 5%;}
    .evLecture .subtitle_line .text {font-size: clamp(15px, 2.8vmin, 22px);}

    /* event */
    .event {padding: 15% 0;}
    .event .con_tit {margin-bottom: 7%;}
    .event .con_tit > img {margin-bottom: 3%;}
    .event .con_tit .end {top: 5%; right: 5%;}
    .event .con_tit h4 {font-size: clamp(22px, 4.2vmin, 40px);}
    .event .con_tit h4 b {font-size: clamp(30px, 6vmin, 60px);}
    .event .coupon_wrap {margin-bottom: 12%;}
    .event .coupon_wrap::before {top: 20vmin;}
    .event .coupon_wrap > img {margin-bottom: 6%;}
    .event .btn_wrap a {max-width: 80%; height: clamp(50px, 8vmin, 80px); font-size: clamp(18px, 2.4vmin, 24px);}
}

@media screen and (max-width: 992px){
    /* evCon1 */
    .evSection .box_wrap {padding: 6vmin 2% 8vmin;}
    .evCon1 .box_swiper {position: relative; overflow: hidden;}
    .evCon1 .box_swiper .swiper-wrapper {gap: 0;}
    .evCon1 .box_swiper .swiper-slide {flex: 1 0 100%; width: 100%;}
    .evCon1 .box_swiper + .swiper-pagination {display: block;}
    .evCon1 .box_swiper .box {height: 22vmin;}
    .evCon1 .box_swiper .box + .box {margin-top: 3%;}
    .evCon1 .box_swiper .box:not(.two_line) > span {margin-top: 0;}
    .evCon1 .box_swiper .box strong {font-size: clamp(16px, 3vmin, 28px);}

    /* evTip */
    .evTip .con_tit .badge {left: 2%;}
}
@media screen and (max-width: 768px){
    /* °øÅë ÅÇ - ºñµð¿À */
    .eventVideo.system .video_title::before {width: 70px; height: 70px;}
    /* °øÅë ÅÇ - Àü·« */
    .evSection .teacher_point .swiper-wrapper {gap: 0;}
    .evSection .teacher_point .swiper-slide {width: 100%;}
    .evSection .teacher_point .swiper-pagination {display: flex; justify-content: center; align-items: center;}
    .evSection .teacher_point .swiper-pagination .swiper-pagination-bullet-active {background: var(--point-color);}
    .evSection .teacher_point .top_box {padding: 4vw 0 6vw;}

    /* evBnr */
    .evBnr ul li {font-size: 13px;}

    /* evCon2 */
    .evCon2 .box_wrap .box_inner .item .txt {font-size: 14px;}

    /* evTip */
    .evTip .con_tit .badge {position: static; display: inline-block; margin: 0 auto 2%;}
    .evTip .con_tit .badge span {font-style: normal; font-size: clamp(13px, 2.4vmin, 16px); color: #fff; background: var(--point-color); border-radius: 16px; padding: 0.5vw 4vw;}

    /* event */
    .event .coupon_wrap .container_info .info_title {width: 110px; font-size: 14px;}
}
@media screen and (max-width: 576px){
    /* °øÅë ÅÇ - ºñµð¿À */
    .eventVideo.system .video_title::before {width: 40px; height: 40px;}

    /* evBnr */
    .evBnr ul li {font-size: 12px;}

    /* main */
    .main .con_box {margin: 0 -8%;}

    /* evCon1 */
    .evCon1 .box_swiper .box {height: 30vmin;}
    .evCon1 .box_swiper .box > span {font-size: 12px;}
    .evCon1 .box_swiper .box .btn {font-size: 12px; padding: 2px 0; margin-top: 5px;}
    .evCon1 .box_swiper .box .box_active .tit {font-size: 12px; padding-bottom: 5px; margin-bottom: 5px;}
    .evCon1 .box_swiper .box .box_active .txt {font-size: 14px;}
    .evCon1 .merit {flex-direction: column;}
    .evCon1 .merit li {width: 100%; height: auto; border-radius: 16px; padding: 3vw 0;}
    .evCon1 .merit li .ico {width: 16%; max-width: 70px; margin-bottom: 3%;}
    .evCon1 .merit li .txt {padding-bottom: 0;}
    .evCon1 .merit li:last-child {padding: 3vw 0;}

    /* evCon2 */
    .evCon2 .tab_base {flex-wrap: wrap; margin-bottom: 2%;}
    .evCon2 .tab_base li {flex-basis: calc(33.333% - 1.5px);}
    .evCon2 .tab_base li a {border-radius: 6px;}

    /* event */
    .event .coupon_wrap .container_info .info_title {width: 80px; font-size: 12px;}
}