/* common */
body { overflow-x:hidden; } 
.re_f_wrap { margin-top:0; } 
.evt_wrap { overflow:hidden; } 
.ov { overflow:hidden; } 
.main_inner { width:1050px; margin:0 auto; position:relative; text-align:center; } 
.in { width:1000px; margin:0 auto; position:relative; text-align:center; } 
.in2 { width:1200px; margin:0 auto; position:relative; text-align:center; } 
.in_wide { width: 2560px; position: relative; text-align: center; left: 50%; transform: translateX(-50%); margin: 0; } 
.in_wide:after { content:""; display: block; clear:both } 
:focus { outline:none; } 
.pos_r { position:relative; } 
.fc_red { color:#ff0000 !important; } 
.c_green { color:#c3ff51; } 
.c_purple { color:#6f39d2 !important } 
.c_blue { color:#2538b4 !important } 
.re_f_wrap .re_f_top { background: #000; } 
.t_r { text-align: right; } 
.mt-1{margin-top: -3px;}

.bx-wrapper .bx-viewport { background: transparent; } 
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after,
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after { content:""; } 

/*bg*/
.con05_1{padding-bottom: 100px;}

.con01__ani-effect{position: absolute;top: 120px;left: 50%;transform: translateX(-50%);}
.con01__ani-effect .bar{position: absolute;bottom: 100px;left: 50%;transform: translateX(-50%);width: 50%;background: #3c1838;height: 5px;border-radius: 5px;overflow: hidden;}
.con01__ani-effect .bar_effect{position: absolute;top: 0;left: 0;background: #b54df7;height: 100%;width: 1%;animation: graph__ani 1s 0.5s forwards ;transition: 1s all;}

.con01__ani-effect2{display: none;}
.con01__btn {position: absolute;top: 89%;left: 50%;transform: translateX(-50%);padding: 25px 90px;background: #fff;border-radius: 50px;color: #111;font-size: 27px;font-weight: bold;animation: color_cg 5s 2s infinite;transition: 1s all;}
.con01__btn  span{color: #8407c6;}

@keyframes color_cg {
  0%{background:#fff;}
  70%{background:#ffdd55;}
  75%{background:#fff;}
  80%{background:#ffdd55;}
  100%{background:#fff;}
}

@keyframes graph__ani {
  0%{width: 1%;}
  100%{width: 100%;}
}

.sd_box .bx-wrapper .bx-controls-direction a { background:url("//cdn.hackersut.com/ingang/images/event/2023/08/2800/arrow.png") 0 0 no-repeat; width: 30px; height: 50px; margin-top: -25px !important; } 
.sd_box .bx-wrapper .bx-controls-direction a.bx-prev { transform: scale(-1); left: -5%; } 
.sd_box .bx-wrapper .bx-controls-direction a.bx-next { right: -5%; } 
.con06 .sd_box { width: 1006px; margin:65px auto 40px } 

.evt_date { position: absolute; left: 50%; top: 280px; background: #f5f5f5; border-radius: 50px; font-size: 20px; padding:5px 15px; margin-left: -445px; color:#222; } 


/* timer css*/
.timer_wrap { background-color:#060606; width:100%; z-index: 10; padding: 0.5% 0 1%;} 
.timer_wrap img { display: block; padding-left: 75px;} 
.timer_wrap .in { width: 1000px; text-align: left; } 
.timer_wrap .timer { position: absolute;top: 37.7%;left: 31%;transform: translateY(-50%);}  
.timer_wrap .timer span { display:inline-block; font-size:44px; color:#fff; letter-spacing: 0.55em; font-weight:bold; } 
.timer_wrap .timer span.time1 { margin-right: 53px; } 
.timer_wrap .timer span.time2, .timer_wrap .timer span.time3, .timer_wrap .timer span.time4 { margin-right: 17px; } 
.timer_wrap .gisu { border: 2px dashed #93d4ff; color: #93d4ff; width: 120px; height: 35px; line-height: 35px; position: absolute; left: 5px; top: 50%; transform: translateY(-50%); text-align: center; font-size: 19px; font-weight: bold; } 
.timer_wrap .timer_txt { position: absolute; left:110px; top: 50%; transform: translateY(-50%); color: #93d4ff; font-size: 16px; font-weight: bold; } 
.timer_wrap .timer_txt p:last-child { color:#fff; text-align: center; font-size: 1.15rem; } 
.timer_wrap .gisu_txt {color: #ccc;position: absolute;left: 50%; bottom: -13%;width: 1000px;text-align: left;display: flex; justify-content: center; align-items: center;font-size: 12px;word-break: keep-all;transform: translateX(-50%);} 
.timer_wrap .gisu_txt p:nth-of-type(1){margin-right: 10px;}
.timer_wrap .apply_btn { width: 159px;line-height: 20px; position: absolute; top: 12px; right: 30px; text-align: center; padding-top: 9px; cursor: pointer; border-radius: 14px; } 
.timer_wrap .apply_btn p { font-size: 18px; font-weight: bold; color: #000;padding:10px 0; } 

.con03{background: #121212;}
.con03__gisu{position: absolute;top: 9.1%;right:63%;font-size: 35px;color: #fff;}
.con03 .benefit-img{position: absolute;top: 30%;left: 50%;transform: translateX(-50%);display: flex;width: 55%;justify-content: space-between;margin: 0 auto;}
.con03 .benefit-img img{width: 45%;}

/* 수강리스트 */
.lect_icon{position: absolute; bottom: 180px; right: -2%; z-index: 1;}
.lect_area{width: 920px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.lect_area li{width: 49%; margin-bottom: 15px; position: relative;}
.lect_area li input{position: absolute; top: 30px; right: 30px; width: 40px; height: 40px; appearance: none; background: #d6d6d6; border-radius: 25px;}
.lect_area li input::after{content: '\2714'; font-size: 22px; color: #fff; width: 35px; height: 35px; text-align: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.lect_area li label{display: block; border: 3px solid #d6d6d6; border-radius: 25px;}
.lect_area li label .lect_tit{width: 75%; position: absolute; top: 50px; left: 50%; transform: translateX(-50%); text-align: left; font-size: 34px; font-weight: bold; color: #222;}
.lect_area li label .lect_tit p{position: relative; z-index: 2;}
.lect_area li label .lect_tit .underline{width: 110%; height: 15px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); background: #ffe9ec; border-radius: 25px;}
.lect_area li:nth-child(2) label .lect_tit .underline{background: #f8e8ff;}
.lect_area li .price_area .dc{position: absolute; top: 180px; left: 50px; padding: 5px 20px; font-size: 14px; color: #fff; background: #222; border-radius: 25px;}
.lect_area li .price_area .price{position: absolute; top: 220px; left: 65px; font-size: 24px;}
.lect_area li .price_area .dc_price{position: absolute; top: 200px; right: 55px; font-size: 48px; font-weight: bold;}
.lect_area li label .lect_info{width: 135px; height: 45px; position: absolute; bottom: 55px; left: 230px; font-size: 0;}

.lect_area li:nth-child(n+3) .price_area .dc{top: 130px;}
.lect_area li:nth-child(n+3) .price_area .price{top: 168px;}
.lect_area li:nth-child(n+3) .price_area .dc_price{top: 148px;}

.lect_area li:nth-child(2n+1) .price_area .dc_price{color: #ff2443;}
.lect_area li:nth-child(2n) .price_area .dc_price{color: #bc1aff;}

/* .lect_area li:last-child{width: 100%;}
.lect_area li:last-child .price_area .dc_price{top: 155px; right: unset; left: 55px; color: #2079ff;} */

/* checked css */
.lect_area li:nth-child(2n+1) input:checked{background: #ff2443;}
.lect_area li:nth-child(2n+1) input:checked + label{border: 3px solid #ff2443;}
.lect_area li:nth-child(2n+1) input:checked + label .price_area .dc{background: #ff2443;}
.lect_area li:nth-child(2n+1) input:checked + label .lect_tit span{color: #ff2443;}

.lect_area li:nth-child(2n) input:checked{background: #bc1aff;}
.lect_area li:nth-child(2n) input:checked + label{border: 3px solid #bc1aff;}
.lect_area li:nth-child(2n) input:checked + label .price_area .dc{background: #bc1aff;}
.lect_area li:nth-child(2n) input:checked + label .lect_tit span{color: #bc1aff;}

.lect_area li:nth-child(5) input:checked{background: #2079ff;}
.lect_area li:nth-child(5) input:checked + label{border: 3px solid #2079ff;}

.lect_btn{width: 340px; margin: 10px auto; display: flex; justify-content: space-between; align-items: center;}
.lect_btn li a{display: block; padding: 10px 20px; font-size: 16px; color: #727272; border: 1px solid #b8b8b8; border-radius: 10px;}

.lect_regist{width: 750px; margin: 0 auto 20px;}
.lect_regist h2{text-align: left; font-size: 26px; color: #222;}
.lect_regist .flex_wrap{display: flex; justify-content: space-between; align-items: flex-start;}
.lect_regist .flex_wrap p{width: 100%; margin-right: 5%; text-align: right; font-size: 66px; font-weight: bold; color: #222; border-bottom: 2px solid #bcbcbc;}

.con08 .sd_box{position: absolute;top: 30%;left: 50%;transform: translateX(-50%);width: 600px;}
.con08 .sd_box .bx-wrapper .bg{filter: drop-shadow(2px 2px 7px rgba(0, 0, 0, 0.3));border-radius: 20px;padding: 20px;}

.rol_list_wrap.t2 {width: 640px;margin: 0 auto;border-radius: 15px;position: absolute;top: 80%;left: 50%;transform: translateX(-50%);} 
.rol_list_wrap.t2 .list_hk_v2 { width: 100%; margin: 0 auto; box-sizing: border-box; overflow: hidden; background:transparent; height: 220px; line-height: 30px; } 
.rol_list_wrap.t2 .list_hk_v2 ul { padding:5%; } 
.rol_list_wrap.t2 .list_hk_v2 li p { text-align: center; font-size: 16px; color:#000; text-align: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all; width: 100%; } 
.rol_list_wrap.t2 .list_hk_v2 li p span { margin-right: 20px; } 

.con08__sys-f{background: linear-gradient(to right top, #c40ece, #ff367c);color: transparent;-webkit-background-clip: text;font-size: 50px;font-weight: bold;}

.con10{background:url('https://cdn.hackersut.com/ingang/images/event/2024/11/2700/con10_tab_bg.jpg')0 0 repeat-x;}
.con10 .js-tab-type1{width: 420px; margin: 0 auto 50px; justify-content: space-between;}
.con10 .js-tab-type1 li{width: 33%;}
.con10 .js-tab-type1 li a{display: block; padding-bottom: 15px; font-size: 24px; font-weight: bold; color: #599eb0;}
.con10 .js-tab-type1 li.on a{color: #121212; border-bottom: 4px solid #121212;}
.con10 video{width: 500px; height: 285px; position: absolute; left: 47.3%; transform: translateX(-50%); border-radius: 30px;bottom:81px;}
#tab2 .con10 video{bottom: 224px;width: 499px;height: 285px;position: absolute;left: 47.3%;transform: translateX(-50%);border-radius: 30px;}
.con10 .js-tab-type1-con{padding-bottom: 0;}
.con10_tab{position: absolute;display: flex;flex-wrap: wrap;top: 3%;left: 50%;transform: translateX(-50%);width:24%;}
.con10_tab a{display: block;width: calc(100%/3);padding-bottom: 78px;height: 0;}

.con11{background:url('https://cdn.hackersut.com/ingang/images/event/2024/11/2700/con11_bg.jpg')0 0 repeat;padding-bottom: 150px;}

/* 적중 리스트 */
.book_slide {width: 1030px; margin: 0 auto 30px;}
.book_slide li{width: 158px;}
.book_slide .book_swiper{padding-bottom: 80px}
.book_slide .swiper-horizontal>.swiper-scrollbar {bottom:25px;background: #d9d9d9 ;width: 540px;left: 50%; margin-left: -250px;}
.book_slide .swiper-scrollbar-drag{background: #222;padding: 3px;border-radius: 10px;margin-top: -3px;}

.con11 .sd_box{width: 690px; margin: 0 auto;}
.con11 .sd_box .bx-wrapper .bx-controls-direction a {top: unset; bottom: -80px;width: 52px;height: 52px;}
.con11 .sd_box .bx-wrapper .bx-controls-direction a.bx-prev {left: 40%; background: url(https://dev-cdn.hackers.com/ingang/images/event/2024/09/0500/con10_prev.png);transform: unset;} 
.con11 .sd_box .bx-wrapper .bx-controls-direction a.bx-next {right: 40%; background: url(https://dev-cdn.hackers.com/ingang/images/event/2024/09/0500/con10_next.png);} 

.con13 .slide_box{ position: absolute; top: 218px; left: 50%; transform: translateX(-50%); width: 100%; } 
.con13 .win_list { position: absolute; top: 828px; left:30.5%; padding:50px 0 80px; } 
.con13 .win_list .list_hk_v2 { height: 210px; } 
.con13 .win_list .list_hk_v2 p { color:#222; } 
.con13 .sd_box{position: absolute;top: 66%;left: 50%;transform: translateX(-50%);width: 700px;}
.con13 .video-slider {display: flex;overflow: hidden;position: relative;width: 100%;}
.con13 .video-slider li {flex: 0 0 100%;list-style: none;display: none;position: relative;}
.con13 .video-slider li iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: none;}
.con13 .video-slider li.active {display: block;}
.con13 .slider-pager {display: flex;justify-content: center;margin-top: 30px;align-items: center;}
.con13 .slider-pager button {width: 60px;height: 5px;background-color: #cabd87;border: none;cursor: pointer;}
.con13 .slider-pager button.active {background-color: #927a30;border-radius: 10px;height: 8px;}

.con14 .input_area{width: 570px; position: absolute; top: 41%; left: 50%; transform: translateX(-50%); display: flex; justify-content: space-between; align-items: center;}
.con14 .input_area.v2{top: 74%;}
.con14 .input_area input[type='text']{width: 75%; padding: 25px 0; font-size: 16px; text-indent: 10px; border: 1px solid #c2c2c2; border-radius: 10px;}
.con14 .input_area button{width: 24%; padding: 23px 0; font-size: 16px; color: #fff; background: #222; border-radius: 10px;}

.con14_pop { position: fixed; height: 100vh; width: 100%; top: 0; left: 0; z-index: 20; display: none; } 
.con14_pop .bg { display: block; width: 100%; height: 100%; background:rgba(0,0,0,0.7) } 
.con14_pop .pop_con {display: none; position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); } 
.con14_pop .pop_con img{width: 500px;} 
.con14_pop .pop_con .close{display: block; position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; line-height: 30px; font-size: 25px; font-weight: bold; color: #222;} 
.con14_pop .pop_con.type1 {padding: 50px 30px; background: #fff; border-radius: 20px; max-height: 600px; overflow-y: auto;} 
.con14_pop .pop_con.type1 h1{margin-bottom: 20px; font-size: 30px; color: #222;} 
.con14_pop .pop_con.type1 table{width: 100%; text-align: center; border-radius: 10px; overflow: hidden;} 
.con14_pop .pop_con.type1 th, .con14_pop .pop_con.type1 td{padding: 10px 0; font-size: 16px; border: 1px solid #efefef; border-collapse:collapse;} 
.con14_pop .pop_con.type1 th{color: #fff; background: #222;}

/* 쿠폰 팝업 배너 등록 */
.main_pop {width:100%;height:100%;position:fixed;left:0;top:0;z-index:9999;}
.main_pop .layer_con{position: absolute;left: 50%;transform: translate(-50%,-50%);top: 50%;width:50%;}
.main_pop .layer_con img{position:relative;width: 100%;}
.main_pop .bg{width:100%;height:100%;position:absolute;left:0;top:0;background-color:rgba(0,0,0,0.5)}
.layer_con  .rel > ul:after{clear:both;content:"";display:block;}
.layer_con  .rel > ul li a{display:block;font-size:14px;color:#fff;font-weight:bold;}
.layer_con  .rel > ul{display:flex;justify-content: space-between;font-size: 15px;position: absolute;top: -4%;right: 0;}
.layer_con  .rel > ul li:nth-of-type(1){margin-right: 15px;}

/* 비디오 팝업 */
.video_box { position: fixed; height: 100vh; width: 100%; top: 0; left: 0; z-index: 20; display: none; } 
.video_box .bg { display: block; width: 100%; height: 100%; background:rgba(0,0,0,0.7) } 
.video_box .video_content { position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); width: 1000px; } 
.video_box .video_content video { width: 100%; } 


/* 레이어 팝업 용 */
.layer_wrap { display:none; } 
.layer_bg { position:fixed; left:0; top:0; width:100%; height:100%; background:#000; filter:alpha(opacity=50); opacity:0.5; z-index:8; } 
.layer_wrap .layer_pop {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 9; width: 90%; max-width: 690px;} 
.layer_wrap:not(#evt_pop0) .layer_pop { background: url('//cdn.hackersut.com/ingang/images/event/2023/06/2000/pop_bg.png') 0 0 no-repeat; height: 600px; } 
.layer_wrap:not(#evt_pop0) .pop_add_tit { color:#f83f5e; font-size: 32px; text-align: center; margin-top: 40px; } 
.layer_wrap:not(#evt_pop0) .pop_add_tit em { font-size: 20px; } 
.layer_wrap:not(#evt_pop0) .pop_add_tit span { color:#222 } 
.layer_wrap:not(#evt_pop0) .sale_txt { font-size: 30px; font-weight: bold; color:#f83f5e; margin-bottom: 15px; } 
.layer_wrap .layer_pop img { max-width:100%; } 
.layer_wrap .layer_close { position:absolute; top:0; right:0; margin-top:-20px; } 
.layer_wrap .layer_close a { color:#fff; font-size:16px; padding:10px 5px; } 
.pop_add_wrap { padding: 0 15px 30px; text-align:center; } 
.pop_add_wrap .file_wrap { text-align:center; } 
.pop_add_wrap .file_wrap strong { color:#222; font-size:20px; display: block; width: 90px; } 
.pop_add_wrap .file_wrap input[type="file"] { display: none; } 
.pop_add_wrap .file_wrap input[type="file"] + label { display: flex; align-items: center; width: 500px; height: 45px; position: relative; margin: 0 auto; overflow: hidden; border-radius: 5px; } 
.pop_add_wrap .file_wrap input[type="file"] + label::after { content: "파일선택"; font-size: 18px; color:#fff; width: 105px; height: 47px; line-height: 47px; position: absolute; right: 0; top: 0; background: #222; } 
.pop_add_wrap .file_wrap input[type="text"]:disabled { background: #f3f3f3; width: 100%; height: 100%; border: 1px solid #e2e2e2; margin-left:15px; border-radius: 5px; padding-left: 10px; box-sizing: border-box; } 
.pop_add_wrap .user_info { width: 610px; height:100px; overflow-y: scroll; padding:10px; background:#f3dde1; box-sizing: border-box; text-align:left; color:#b1828b; line-height:1.2; font-size:14px; border-radius: 10px; } 
.pop_add_wrap .user_info strong { font-size: 14px; color:red; } 
.pop_add_wrap .user_info li { text-align:left; color:#777; line-height:23px; font-size:11px; } 
.pop_add_wrap .user_info li.first { font-size:14px; font-weight:bold; padding-bottom:5px; } 

.layer_pop a.close { position:absolute; right:15px; top:15px; width:35px; height:35px; } 
.infoBox_text_w { display:block; text-align: left; width: 610px; margin-left: 30px; margin-top: 15px; } 
.infoBox_text_w input[type="checkbox"] { width: 28px; height: 28px; vertical-align: middle; margin-bottom: 5px; } 
.infoBox_text_w input[type="checkbox"] + label { font-size: 20px; color:#735056; padding-left: 10px; vertical-align: middle; display: inline-block; margin-bottom: 5px; } 

/* 강의리스트 팝업 */
#evt_pop0 .pop_add_wrap {position: relative;background: #fff;border-radius: 0 0 20px 20px;} 
.pop_add_wrap select#lect_list { width: 95%; text-align: center; height: 40px; color: #217bff; border-radius: 5px; background: #e7e7e7; font-size: 15px; font-weight: bold; border: 0; -webkit-appearance:none; /* 크롬 화살표 없애기 */-moz-appearance:none; /* 파이어폭스 화살표 없애기 */appearance:none /* 화살표 없애기 */ } 
.pop_add_wrap select#lect_list option { background: #eee; } 
.pop_add_wrap .lec_txt { margin: 0 0 10px; width: 100%; text-align: left; } 
.pop_add_wrap .lec_txt li { font-size: 14px; color: #aaa; padding: 2px; } 
.pop_add_wrap .lec_txt li b.lec_date { color: #217bff; } 
.pop_add_wrap .lec_tit {margin-bottom: 20px; padding: 0 3px; display: flex; justify-content: space-between; align-items: center;} 
.pop_add_wrap .lec_tit h2 { font-size: 22px; color: #000; text-align: left; } 
.pop_add_wrap .lec_tit select {padding: 10px; color: #666; border: 1px solid #bebebe; border-radius: 5px;} 
.pop_add_wrap .lect_table { width: 100%; position: relative; } 
.pop_add_wrap .lect_table th { height: 40px; background: #606060; color: #fff; border-right: 1px solid #fff; font-size: 14px; } 
.pop_add_wrap .lect_table td { height: 40px; background: #d2e9ff; color: #000; font-size: 13px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; } 
.pop_add_wrap .lect_table td:nth-child(4) { padding: 5px; box-sizing: border-box; } 
.pop_add_wrap .lect_table th:last-child,.pop_add_wrap .lect_table td:last-child { border-right:0; } 

#evt_pop0 .pop_add_tit{display: flex; margin-top: -10px; position: relative; z-index: 1; color: #111; background: #fff; align-items: center; justify-content: center; border-radius: 20px 20px 0 0; padding: 20px 0 5px; font-size: 25px; font-weight: bold;}
#evt_pop0 #big_type{margin-left: 20px;padding: 10px 5px;}

.table_layout { height:auto; max-height: 400px; overflow-y: scroll; -ms-overflow-style: none; /* IE and Edge */scrollbar-width: none; /* Firefox */width: 100%; } 
.table_layout::-webkit-scrollbar { display: none; /* Chrome, Safari, Opera*/ } 
.table_layout table { width:100%; border-top: 1px solid #fff; border-left: 1px solid #fff; } 
.table_layout table th { background:rgb(128,128,128); font-size:16px; font-weight:bold; color:#fff; } 
.table_layout table td { background:#fff; font-size:14px; color:#505050; } 
.table_layout table th, .table_layout table td { padding:5px 10px; word-break: keep-all; border-right: 1px solid #fff; border-bottom: 1px solid #fff; } 

.pop_carry{position: fixed; top: 24%; right: 2.5%; z-index: 999;}

/* 하단 유의사항 하드코딩 */
.e_faq_box{color: #fff; background: #444;}
.e_faq_box .tit_faq{background: #444;}
.e_faq_box .tit_faq strong{color: #fff;}
.e_faq_box .user_info li{font-size: 20px; font-weight: bold; border-bottom: 1px solid #666;}
.e_faq_box .user_info li a{width: 100%; padding: 15px 5px; display: flex; justify-content: space-between; color: #fff;}
.e_faq_box .user_info li .txt{display: none; width: 100%; padding: 0 5px 20px 5px; font-size: 14px; font-weight: normal;}
.e_faq_box .user_info li .txt table{margin-top: 30px;}
.e_faq_box .user_info li .txt table td{padding: 5px; color: #fff; border: 1px solid #fff;}

/* 플로팅 배너 - 관리자단 연동 */
.ban_bottom{width:100%;text-align:center;position:fixed;left:0;bottom:0;z-index:5;}
.ban_bottom .bg {background: #090dc4;position: absolute;bottom: 0;height: 120px;width: 100%;}
.ban_bottom .in_wide {position: relative;width: 2540px;bottom: 0;left: 50%;transform: translateX(-50%);}