.event_area * { font-family: noto,sans-serif; box-sizing: border-box; }
.event_area > section {display: block; width: 100vw; max-width: 750px; overflow: hidden; position: relative;}
.event_area img { width: 100%; }
.p_r { position:relative; }
.p_c { position: absolute; left: 50%; transform: translate(-50%, -50%); }

.cont01{background: #F1FDE5; padding: 10% 0;}

/* timer */
.timer{position: relative; top: 0; z-index: 999; background: #fff; border-bottom: 1px solid #333;}
.timer.fixed{position: fixed; top: 0; left: 0; width: 100%;}
.timer_inner{ display: flex; align-items: center; justify-content: left; max-width: 750px; margin: 0 auto; padding: 3%; gap: 4%;}
.timer_info{ font-size: 2.7vw; color: #333; font-weight: 700; margin-right: 8%;text-align: center;}
.timer_countdown{ font-size: 5.4vw; color: #111; font-weight: 700; letter-spacing: 1px;display: flex; gap:0.1vw}
.timer_countdown em{font-style: normal; font-weight: 700;}
.timer_btn{display: inline-block; padding: 1% 3%; border: 1px solid #333; border-radius: 20px; font-size: 13px; color: #333; text-decoration: none; font-weight: 500;background: #fff;}
.timer.fixed{ background: #000;}
.timer.fixed .timer_info{color: #83E662;}
.timer.fixed .timer_info span{color: #fff;}
.timer.fixed .timer_countdown{color: #83E662;}
.timer.fixed .timer_btn{background: #83E662; color: #000;border: 1px solid #83E662;}

.bot_banner{display: block; width: 100%; transform: translateX(-50%); left: 50%; position: fixed; bottom: 12%; z-index: 999;}
.bot_banner img{width: 100%;}


.main_txt{color: #222; font-size: 9vw; font-style: normal; font-weight: 900; letter-spacing: -3.32px; top: 12%; width: 100%; text-align: center;}
.main_txt p{background: linear-gradient(90deg, #3566ED 0%, #00AD52 49.52%, #008314 84.62%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-align: center; font-weight: 900; letter-spacing: -3.32px; font-size: 13vw; margin-top: -3%;}
.sub_txt{ color: #222; font-size: 6vw; font-style: normal; font-weight: 700; line-height: 80px; letter-spacing: -1.35px; top: 19%; text-align: center; width: 100%;}

.section_tit{ color: #252525; text-align: center; font-size: 7vw; font-weight: 700; letter-spacing: -1.8px;}
.section_tit p{ background: linear-gradient(90deg, #3568E8 24.04%, #00948B 58.17%, #227900 84.62%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 8vw; font-weight: 700; letter-spacing: -1.8px;}
.evt_info{ top: 21.7%; max-width: 750px; width: 70%; left: 54%;}
.evt_info li{display: flex; justify-content: left; align-items: center; gap: 8%; width: 100%; margin-bottom: 11%;}
.evt_info li strong{ font-size: 4vw;}
.evt_info li span{ font-size: 4vw;}
.lect_tit{color: #000;font-size: 45px;font-style: normal;font-weight: 700;line-height: 57px; letter-spacing: -1.8px; top:39%}

.lect_tab_area{ max-width: 690px; width: 90%; margin: 5% auto;}
.lect_tab_area .tab_btn{display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%;}
.lect_tab_area .tab_btn li{ width: 32%; margin-bottom: 3%;}
.lect_tab_area .tab_btn li a{ display: block; position: relative; padding: 2vw 3vw; border-radius: 6vw; background: #C1E5B7B2; color: #222; text-align: center; font-size: 3.7vw; font-weight: 700; text-decoration: none; transition: all 0.2s; width: 100%;}
.lect_tab_area .tab_btn li a.active{background:#2e7d32;color:#fff;}
.lect_tab_area .tab_cont{display: none;margin-top: 5.5%;}
.lect_tab_area .tab_cont.active{display: block;}
.lect_tab_area .tab_cont .lect_wrap li{ width: 100%; border: 1px solid #3568E8; border-radius: 4vw; background: #fff; padding: 5%; margin-bottom: 5%;}
.lect_tab_area .tab_cont .lect_wrap li:nth-last-of-type(1){margin-bottom: 0;}
.lect_tab_area .tab_cont .lect_wrap li.v2{border-color: #227900;}
.lect_tab_area .tab_cont .lect_wrap li .lect_top{display: flex; justify-content: space-between; align-items: start;}
.lect_tab_area .tab_cont .lect_wrap li .lect_top > p{color: #3568E8; font-size: 6vw; letter-spacing: -1.211px; font-weight: 700; text-align: left;}
.lect_tab_area .tab_cont .lect_wrap li.v2 .lect_top > p{color: #227900;}
.lect_tab_area .tab_cont .lect_wrap li .lect_top > span{display: inline-block; font-size: 3vw; font-weight: 700; padding: 1% 0; text-align: center; width: 24%; border-radius: 5px; background: #D8F2FF; color: #3568E8;}
.lect_tab_area .tab_cont .lect_wrap li.v2 .lect_top > span{background:#E3F6D8 ; color:#227900}
.lect_tab_area .tab_cont .lect_wrap li .lect_bot{margin-top: 4%;}
.lect_tab_area .tab_cont .lect_wrap li .lect_bot span{display: block; text-align: end; color: #888; font-size: 3.6vw;}
.lect_tab_area .tab_cont .lect_wrap li .lect_bot p{ text-align: end; font-weight: 700; font-size: 8vw; color: #000; margin-top: -1%;}


.lect_info_list{ top: 62%; width: 90%;}
.lect_info_list li{ width: 100%;margin-bottom: 25%;}
.lect_info_list li a{ display: block; font-size: 0;height: 150px;}


.add_lect_area{ max-width: 690px; width: 90%; margin: 0 auto;}
.add_lect_area .tab_btn{ display: flex; flex-wrap: wrap; justify-content: center; width: 100%; margin: 0 auto 1%; gap: 1%;}
.add_lect_area .tab_btn li{ width: 32%; margin-bottom: 2%;}
.add_lect_area .tab_btn li a{ display: block; position: relative; padding: 2vw 3vw; border-radius: 6vw; background: #C1E5B7B2; color: #222; text-align: center; font-size: 3vw; font-weight: 700; text-decoration: none; transition: all 0.2s; width: 100%;}
.add_lect_area .tab_btn li a::before{ content: ''; position: absolute; top: -11px; left: 50%; width: 20px; height: 20px; background: url('//cdn.edu2080.co.kr/edu2080/images/event/evt_lectures/2026/0608/icon02.png') no-repeat center / contain; opacity: 0; transition: opacity 0.2s; transform: translateX(-50%); background-size: 100%;}
.add_lect_area .tab_btn li a.active{color: #fff; background: linear-gradient(90deg, #227900 0%, #009A78 49.04%, #008ADF 100%);}
.add_lect_area .tab_btn li a.active::before{opacity:1;}
.add_lect_area .tab_cont{display: none;}
.add_lect_area .tab_cont.active{display: block;}
.add_lect_area .tab_cont .lect_btn{width: 90%; display: block; margin: 3% auto 7%;}
.add_lect_area .tab_cont .lect_btn img{ width: 100%;}


.evt_tab_area{ max-width: 690px; width: 90%; margin: 5% auto;}
.evt_tab_area .tab_btn{display: flex; flex-wrap: wrap; justify-content: center; width: 100%; margin: 0 auto 2%; gap: 1%;}
.evt_tab_area .tab_btn li{ width: 32%; margin-bottom: 2%;}
.evt_tab_area .tab_btn li a{ display: block; position: relative; padding: 2vw 3vw; border-radius: 6vw; background: #C1E5B7B2; color: #222; text-align: center; font-size: 3.7vw; font-weight: 700; text-decoration: none; transition: all 0.2s; width: 100%;}
.evt_tab_area .tab_btn li a.active{color: #fff;
background: linear-gradient(90deg, #227900 0%, #009A78 49.04%, #008ADF 100%);}
.evt_tab_area .tab_cont{display: none; width: 100%; }
.evt_tab_area .tab_cont img{width: 100%;}
.evt_tab_area .tab_cont.active{display: block;}
.evt_tab_area .tab_cont .evt_tab_btn{ display: block; width: 90%; height: 11%; bottom: 3%;}

.benefit_list{max-width: 690px; width: 90%; top: 54%; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}
.benefit_list li{ width: 49%; margin-bottom: 2%;}
.benefit_list li a{ display: block; width: 100%; height: 100px;font-size: 0;}

/* ?? */
.evt_btn{position: absolute !important; left: 50%; transform: translateX(-50%);width: 94%; max-width: 750px; height: 11%;font-size: 0;}
.evt_btn01{ top: 50%; height: 7%;}
.evt_btn02{ bottom: 4%; width: 23%; height: 3%;}
.evt_btn03{ top: 3.6%;width: 20%; height: 4%;}
.evt_btn04{ top: 50.6%;width: 24%;height: 4%;}

.free_giude { top: 59%; display: flex; justify-content: center; width: 90%; align-items: center; flex-wrap: wrap; gap: 2%; max-width: 690px;}
.free_giude button{ display: block; width: 49%; height: 130px; position: relative; margin-bottom: 7%; font-size: 0;}

/* ??? */
.package_info { width: 90%; display: flex; justify-content: left; align-items: center; color: #222; margin: 4% auto 3%; border-radius: 4vw; border: 1px solid #227900; background: #FFF; box-shadow: 0 11px 32.3px 0 rgba(0, 0, 0, 0.10); flex-wrap: wrap; padding: 5%;} 
.package_info .package { font-size: 5.8vw; background: linear-gradient(90deg, #217A05 0%, #2171E8 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 7%;} 
.package_info >div{ width: 100%; position: relative; display: flex; justify-content: space-between; align-items: end;} 
.package_info >div >p{ display: block; text-align: end; width: 60%;} 
.package_info .package_type { font-size: 2.7vw; font-weight: 700; background: #E7FAD7; padding: 1% 5%; border-radius: 7px; display: inline-block; color: #1D6800;} 
.package_info .discount {font-size: 3vw; text-decoration: line-through; color: #666; display: block} 
.package_info .price { font-size: 6vw; color: #EA1111;} 

.add_txt{ width: 70%;margin: 6% auto 3%;}
.add_txt img{width: 100%;}
.package_list { width: 80%;margin: 0 auto 7%;} 
.package_list li { justify-content: space-between; align-items: center; border-bottom: 1px dotted #c8c8c8; display: flex; padding: 2% 0;} 
.package_list li:last-child { border-bottom: none } 
.package_list li strong { display: block;font-size: 4vw;color: #333;text-align: left;} 
.package_list li .price {display: flex;align-items: center;width: 60%;justify-content: right;font-weight: 700;} 
.package_list li .price p {font-size: 5.8vw;color: #ea1111;} 
.package_list li .price em {font-size: 3vw;color: #333;margin-right: 4vw;display: block;width: 33%;} 

/* ?? ?? */
.reason { position: absolute; width:95%; left:50%; padding: 5%; box-sizing: border-box; background:rgba(0,0,0,0.85); color:#fff; text-align: left; border-radius: 1rem; font-size:0.95rem; line-height: 1.5rem; letter-spacing: -0.04em; display:none; transform: translateX(-50%); z-index: 9999; } 
.reason.v1{bottom: 8%;}
.reason.v2{top:8%;}
.reason.v3{top:55%;}
.reason.active { display:block; }
.reason .close { position: absolute; width:4vw; height:4vw; top:4%; right:1.5%; cursor: pointer; } 
.reason .close::before, .reason .close::after { content:''; display:block; width:100%; height:1px; background:rgba(255,255,255,0.7); position: absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotate(45deg); } 
.reason .close::after { transform: translate(-50%,-50%) rotate(-45deg); } 
.reason strong { font-size:1.2rem; }