.container--wide { width:2560px; position:relative; text-align:center; left:50%; margin-left:-1280px; } 
.container--medium { width: 1050px; margin: 0 auto; text-align: center; position: relative; } 

a { text-decoration: none; color: inherit; } 

#main { overflow: hidden; } 
.section-main { position: relative; } 
.section-main__bnr { width: 2000px; margin: 0 auto; position: relative; } 
.section-main__bnr .bx-controls { display: none; } 
.section-main__bnr #main-counter { position: absolute; display: flex; align-items: center; background: rgba(255, 255, 255, 0.8); border-radius: 30px; padding: 5px 10px; bottom: 60px; left: 480px; font-size: 16px; } 
.section-main__bnr #main-counter .current { color:#222; } 
.section-main__bnr #main-counter .controls a { font-size: 0; width: 6px; height: 12px; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/main_bnr_arrow.png') 0 center / 30% no-repeat; margin: 0 10px; display: block; padding: 10px; } 
.section-main__bnr #main-counter .next a { transform: scale(-1); } 

.section-main__bnr-btn { position: absolute; top: 263px; left: 460px; width: 290px; height: 79px; z-index: 2; } 

.section-main__tab { width: 525px; position: absolute; top: 60px; left: 1280px; } 
.section-main__tab .js-tab-type1 { display: flex; align-items: center; justify-content: flex-end; margin-bottom: 20px; } 
.section-main__tab .js-tab-type1 li.on a { color: #d50057; } 
.section-main__tab .js-tab-type1 li a { display: flex; align-items: center; font-size: 15px; color: #555; } 
.section-main__tab .js-tab-type1 li:not(:last-of-type) a::after { background: #dcdcdc; width: 1px; height: 11px; content: ''; display: block; margin: 0 10px; } 
.main-tab__bannerarea { display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; } 
.section-main__tab .js-tab-type1-con .bnr { width: calc(100%/2 - 5px); margin-bottom: 10px; border-radius: 20px; overflow: hidden; position: relative; } 
.section-main__tab .js-tab-type1-con .bx-wrapper .bx-pager { position: absolute; top: 20px; right: 20px; z-index: 2; display: flex; } 
.section-main__tab .js-tab-type1-con .bx-wrapper .bx-pager.bx-default-pager a { border-radius: 50%; background: #d6d8db; width: 8px; height: 8px; } 
.section-main__tab .js-tab-type1-con .bx-wrapper .bx-pager.bx-default-pager a.active { background: #77787a; } 
.section-main__tab .bnr_more { display: block; } 

.section-main__tab .js-tab-type1-con .bx-wrapper li { position: relative; } 
.section-main__tab .js-tab-type1-con .bx-wrapper .bxslider > li { border-radius: 20px; overflow: hidden; box-sizing: border-box; border: 1px solid #e2e8ef; display: block; } 
.section-main__tab .js-tab-type1-con .bx-wrapper .bxslider > li> a img { width: 100%; } 
.section-main__tab .js-tab-type1-con .bx-wrapper li .hoverItem { position: absolute; top:0; left:0; width: 100%; height: 100%; background: rgba(60, 65, 70, 0.9); color: #fff; z-index: 3; display: none; }
.bannerItem { width: 254px; height: 283px; display: block; border-radius: 20px; box-sizing: border-box; padding: 25px; text-align: left; }
.bannerItem .col01 { font-size: 16px; display: flex; color: #222222; align-items: center; font-weight: 500; }
.bannerItem .col01 .col01__tag-item { font-size: 12px; background: #222222; color: #fff; margin-right: 10px; border-radius: 20px; padding: 5px 10px; }
.bannerItem .col02 { margin-top: 10px; font-size: 18px; color: #222; font-weight: 500; }
.bannerItem .col03 { margin-top: 5px; font-size: 23px; font-weight: bold; color: #222; line-height: 1.2;}
.bannerItem .col04 { color: #97999b; font-size: 11px; margin-top: 15px; }

.hoverItem__inner { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } 
.section-main__tab .hoverItem ul { width: 85%; margin: 20px auto; } 
.section-main__tab .hoverItem li:not(:last-of-type) { border-bottom: 1px solid #676768; } 
.section-main__tab .hoverItem li { position: relative; } 
.section-main__tab .hoverItem li::after { position: absolute; top:50%; transform: translateY(-50%); right: 0; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/hoverItem_icon.png')0 0 no-repeat; content: ''; width: 8px; height: 12px; } 
.section-main__tab .hoverItem li a { display: grid; grid-template-columns: 1fr 3fr; color: #fff; padding: 10px 0; align-items: center; font-size: 16px; } 
.section-main__tab .hoverItem li a span { background: #fff; color: #111; border-radius: 20px; padding: 5px; } 
.section-main__tab .hoverItem li a p { text-align: left; margin-left: 10px; } 
.hoverItem__showBtn { background: #f9f9f9; width: 90%; margin: 0 auto 10px; padding: 10px 0; position: relative; border-radius: 10px; font-weight: 600; display: block; font-size: 16px; color: #222;} 
.section-main .rightBan-wrap { position: absolute; right: 620px; top: 100px; } 
.section-main .rightBan-wrap .right_con1 > li { margin-bottom: 6px; } 
.section-main .rightBan-wrap .right_con2 { width:100%; padding:0 10px; border:1px solid #ccc; box-sizing:border-box; border-radius:8px; background-color:#fff; margin:25px 0; } 
.section-main .rightBan-wrap .right_con2 li { border-bottom:1px solid #eee; } 
.section-main .rightBan-wrap .right_con2 li:last-child { border-bottom:none; } 
.section-main .rightBan-wrap .right_con2 a { display:block; width:100%; padding:10px 0; color:#555; font-size: 13px; } 
.section-main .rightBan-wrap .right_con2 a img { width:100%; } 


.section__line-brn .sd-box { position: relative; box-shadow: 0px 22px 24px 0px rgba(0, 0, 0, 0.16); } 

.section__line-brn .bx-wrapper li { position: relative; border-radius: 10px; overflow: hidden;} 
.section__line-brn .bx-wrapper .bx-pager { position: absolute; top: 14px; right: 30px; z-index: 2; display: flex; } 
.section__line-brn .bx-wrapper .bx-pager.bx-default-pager a { border-radius: 50%; background: #fafafa; z-index: 2; opacity: 0.6; } 
.section__line-brn .bx-wrapper .bx-pager.bx-default-pager a.active { background: #fafafa; opacity: 1; } 

.section--system { margin-top: 130px; } 
.section--system .container--wide > .js-tab-type1 { width: 1050px; margin: 0 auto; display: flex; align-items: center; } 
.section--system .container--wide > .js-tab-type1 li:nth-of-type(1) { font-weight: bolder; color: #111; background: unset; margin-right: 25px; font-size: 40px; letter-spacing: -1px } 
.section--system .container--wide > .js-tab-type1 li { background: #f6f6f6; border-radius: 20px; margin:0 5px 20px 0px; } 
.section--system .container--wide > .js-tab-type1 li a { padding: 8px 20px; display: block; color: #777; font-size: 16px; } 
.section--system .container--wide > .js-tab-type1 li.on { border: 1px solid transparent; background-image: linear-gradient(#fff, #fff), 
linear-gradient(90deg,rgba(252, 82, 175, 1) 0%, rgba(213, 84, 202, 1) 50%, rgba(165, 100, 242, 1) 100%); background-origin: border-box; background-clip: content-box, border-box; } 
.section--system .container--wide > .js-tab-type1 li.on a { color: #222; } 
.section--system .container--wide > .js-tab-type1-con { background: #fff url('https://cdn.hackersut.com/www/images/main/2025/main_renew/re_250429/con03_inner_new.jpg')center center no-repeat; } 
.section--system .container--wide > .js-tab-type1-con .in { width: 1120px; margin: 0 auto; position: relative; } 
.section--system .container--wide > .js-tab-type1-con .in > img { width: 100%; border-radius: 30px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 20px 20px rgba(0, 0, 0, 0.12); } 
.section--system .container--wide > .js-tab-type1-con img { width: 100%; } 

#section--system_tab4 .js-tab-type1 { position: absolute; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: flex-start; left: 25px; } 
#section--system_tab4 .js-tab-type1 a { color: #666666; margin-bottom: 25px; display: flex; align-items: center; font-size: 15px; font-size: 16px; } 
#section--system_tab4 .js-tab-type1 a::before { content: ''; background: #c8cacb; width: 5px; height: 5px; border-radius: 50%; display: inline-block; margin-right: 5px; } 
#section--system_tab4 .js-tab-type1 li.on a { color: #000000; } 
#section--system_tab4 .js-tab-type1 li.on a::before { background: #000000; } 

#section--system_tab5 .sd-box { position: absolute; top: 230px; right: 40px; } 
#section--system_tab5 .sd-box .bx-pager { display: flex; align-items: center; justify-content: center; } 
#section--system_tab5 .sd-box .bx-pager a { background: #cccccc; width: 7px; height: 7px; border-radius: 50%; margin-right: 5px; } 
#section--system_tab5 .sd-box .bx-pager .bx-pager-item:last-of-type a { margin-right: 0; } 
#section--system_tab5 .sd-box .bx-pager a.active { background: #000000; } 

.section--ticker { overflow: hidden; } 
.section--ticker { margin-top: 140px; } 
.section--ticker h3 { font-size: 26px; font-weight: bold; color: #222; text-align: left; } 
.section--ticker .sd-box { margin-top: 30px; overflow: hidden; } 
.section--ticker .sd-box ul li { height: 210px; } 
.section--ticker .sd-box .bx-wrapper { max-width: 100% !important; } 
.section--ticker .sd-box .bx-wrapper li { position: relative; } 
.section--ticker .sd-box .bx-wrapper li .hover__event { position: absolute; top:0; left:0; width: 100%; height: 100%; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); z-index: 2; display: none; } 
.section--ticker .sd-box .bx-wrapper li .hover__event::before { content: ''; position: absolute; top:0; left:0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(197, 91, 141, 1) 0%, rgba(192, 108, 181, 1) 50%, rgba(162, 108, 195, 1) 100%); opacity: 0.7; z-index: -1; } 
.section--ticker .sd-box .bx-wrapper li .hover__event p { font-size: 32px; color: #fff; text-align: left; position: absolute; top: 30px; left: 30px; letter-spacing: -1.5px; } 

/*��������-��������*/
.section--notice { padding:90px 0 130px; } 
.section--notice__wrap { display: flex; width: 100%; justify-content: space-between; } 
.section--notice__wrap >div { width: 47%; } 
.section--notice > .main_inner > div { width:500px; float:left; } 
.section--notice > .main_inner > div:nth-child(1) { margin-right:50px; } 
.section--notice .notice_title { width:100%; position:relative; } 
.section--notice .notice_title a { position:absolute; right:0; top:5px; } 
.section--notice .notice_title h3 { font-size:26px; color:#222; padding-bottom:10px; text-align: left; border-bottom: 1px solid #666666; } 
.section--notice .notice_from > li { padding:15px 0; border-bottom:1px solid #eeeeee; overflow:hidden; text-align: left; } 
.section--notice .notice_from .form_desc > li { float:left; line-height:26px; } 
.section--notice .notice_from .form_desc > li:nth-child(1) span { display:block; width:51px; height:26px; text-align:center; border:1px solid #45474d; line-height:26px; border-radius:15px; margin-right:15px; font-weight:bold; } 
.section--notice .notice_from .form_desc > li:nth-child(1) span.noti_color { background: #ffeff6; color: #222; border: none; font-size: 13px; } 
.section--notice .notice_from .form_desc > li:nth-child(2) a { display:block; width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16px; color:#000; float:left; } 
.section--notice .notice_from .form_desc > li:nth-child(2) > img { float:left; margin-left:3px; vertical-align:bottom; } 
.section--notice .notice_from .form_desc > li:nth-child(3) { float:right; text-align:right; font-size:15px; color: #888; } 
/*��������-��������*/

/* ��Ÿ������ ���ξ� */
.section--teachers { background: #eff1f2; padding-top: 65px; overflow: hidden; } 
.section--teachers .js-tab-type1 { width: 1050px; margin: 0 auto 30px; display: flex; align-items: center; } 
.section--teachers .js-tab-type1 li:nth-of-type(1) { font-weight: bolder; color: #111; background: unset; margin-right: 25px; font-size: 40px; letter-spacing: -1px; } 
.section--teachers .js-tab-type1 li { background: #e7e9ea; border-radius: 20px; margin:0 5px 20px 0px; } 
.section--teachers .js-tab-type1 li a { padding: 8px 20px; display: block; color: #222; font-size: 16px; } 
.section--teachers .js-tab-type1 li.on { border: 1px solid transparent; background-image: linear-gradient(#eff1f2, #eff1f2), 
linear-gradient(90deg,rgba(252, 82, 175, 1) 0%, rgba(213, 84, 202, 1) 50%, rgba(165, 100, 242, 1) 100%); background-origin: border-box; background-clip: content-box, border-box; } 
.section--teachers .js-tab-type1-con .in { width: 1120px; margin: 0 auto; overflow: hidden; } 
.section--teachers .js-tab-type1-con .bx-wrapper { margin:0 auto; }
.section--teachers .js-tab-type1-con .bx-viewport { height: 391px !important; }
.section--teachers .js-tab-type1-con .bxslider { display: flex; flex-wrap: nowrap; overflow: hidden; height: 391px; }
.section--teachers .js-tab-type1-con li {width: 255px !important; flex-shrink: 0; transition: all 1s ease-in-out; height: 391px; }
.section--teachers .js-tab-type1-con li:hover .hover__effect { scale: 1.1; transform: translateY(10px); }
.section--teachers .js-tab-type1-con img { width: 100%; }
.section--teachers .js-tab-type1-con li img.hover__effect { height: 391px; object-fit: contain; }
.section--teachers .js-tab-type1-con li .pos_r img.slider-lazy-image { height: 100px; object-fit: contain; }
.section--teachers .js-tab-type1-con li .pos_r { min-height: 100px; }
.star-teacher__sd-box { position: relative; } 

.star-teacher__slide { height: 380px; } 
.star-teacher__slide .col01 { width: 300px; } 
.star-teacher__slide .teacher__slide--badge { position: relative; } 
.star-teacher__slide .title { position: absolute; background: linear-gradient(90deg, rgba(177, 47, 231, 1) 0%, rgba(209, 25, 171, 1) 50%, rgba(247, 0, 102, 1) 97%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 16px; font-weight: bold; top: 26px; left: 5px; width: 67px; } 
.star-teacher__slide .name { position: absolute; text-align: left; top: 20px; left: 90px; color: #444444; font-size: 16px; } 
.star-teacher__slide .name b { font-size: 26px; font-weight: bold; color: #222222; } 
.star-teacher__slide .col02 { display: flex; width: 60%; } 
.star-teacher__slide .col02 >div { width: calc(100%/4); } 
.star-teacher__slide .col03 { text-align: left; margin-top: 150px; } 
.star-teacher__slide .img-area { position: absolute; right: 100px; bottom: 0; } 
.star-teacher__slide .img-area:hover .hover__effect { scale: 1.1; transform: translateY(10px); } 
.section--teachers .js-tab-type1-con .bx-controls-direction a { font-size: 0; width: 50px; height: 50px; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/con06_control.png') 0 0 /contain no-repeat; display: block; position: absolute; top: 50%; transform: translateY(-50%); } 
.section--teachers .js-tab-type1-con .bx-controls-direction a.bx-prev { left: -80px; } 
.section--teachers .js-tab-type1-con .bx-controls-direction a.bx-next { transform: scale(-1); right: -80px; top:42%; } 
.section--teachers .js-tab-type1-con li .sys_f { position: absolute; } 
.section--teachers .js-tab-type1-con li .sys_f.title { background: linear-gradient(90deg, rgba(177, 47, 231, 1) 0%, rgba(209, 25, 171, 1) 50%, rgba(247, 0, 102, 1) 97%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: bold; font-size: 16px; font-weight: bold; top: 20px; left: 0px; width: 67px; } 
.section--teachers .js-tab-type1-con li .sys_f.name { font-size: 26px; font-weight: bold; color: #222222; top: 16px; left: 80px; } 
.section--teachers .js-tab-type1-con li .sys_f.desc { color: #444444; font-size: 16px; top: 57px; left: 80px; text-align: left; } 
.section--teachers .js-tab-type1-con li .sys_f.descs_title { color: #444444; font-size: 14px; top: 0px; left: 30%; text-align: left; } 

.section--tv { margin-top: 130px; position: relative; background: #fff; overflow: hidden; } 

.section--tv .bg-effect { background: #fff url('https://cdn.hackersut.com/www/images/main/2025/main_renew/con07_bg.png') no-repeat 0 0/contain; animation: deco-particle 3s ease-in-out alternate infinite 5s; position: absolute; top: -230px; left: 32%; width: 1050px; height: 500px; } 

@-webkit-keyframes deco-particle { 
 from { -webkit-transform: translateY(45%); transform: translateY(45%); } 
to { -webkit-transform: translateY(55%); transform: translateY(55%); } 
 }

@keyframes deco-particle { 
 from { -webkit-transform: translateY(45%); transform: translateY(45%); } 
to { -webkit-transform: translateY(55%); transform: translateY(55%); } 
 }


.hackersTV__title { text-align: left; color: #111; } 
.hackersTV__title .col01 { display: grid; grid-template-columns: 3fr 1fr; align-items:end; margin-bottom: 10px; } 
.hackersTV__title .col01 h3 { font-size: 40px; font-weight: bold; letter-spacing: -1.5px; color: #222; } 
.hackersTV__title .col01 a { text-align: right; font-weight: 500; font-size: 14px; color: #222; } 
.hackersTV__title .col02 { font-size: 18px; letter-spacing: -1.5px; color: #222; } 
.section--tv__sd-box { margin-top: 20px; position: relative; min-height: 518px; z-index: 2; } 
.section--tv__sd-box { text-align: left; color: #111; } 

.section--tv__sd-box .slider-container { overflow: hidden; position: relative; width: 100%; } 
.section--tv__sd-box .slider-container ul { display: flex; transition: transform 0.5s ease; padding: 0; margin: 0; justify-content: space-around; gap:20px; transition: 1s all ease; padding: 0 10px; } 
.section--tv__sd-box .slider-container li { width: calc((100% - 20px * 2) / 3); margin-top: 20px; list-style: none; box-sizing: border-box; border-radius: 20px; padding-bottom: 50px; padding: 20px 0 70px; flex:none; transition: all ease-out 1s; } 

.section--tv__sd-box .hackersTV_sli_col01 { text-align: center; padding: 0 20px; } 
.section--tv__sd-box .hackersTV_sli_col01 img { width: 100%; } 
.section--tv__sd-box .hackersTV_sli_col02 { font-size: 22px; font-weight: bold; margin-top: 30px; color: #222; padding: 0 20px; letter-spacing: -1.5px; } 

.section--tv__sd-box .hackersTV_sli_col03 { margin-top: 14px; color: #555; padding: 0 20px; font-size: 15px; letter-spacing: -1.5px; } 
.section--tv__sd-box .hackersTV_sli_col04 { margin-top: 20px; padding: 0 20px; } 
.section--tv__sd-box .hackersTV_sli_col04 span { background: #f4f6f7; color: #678ed7; padding: 5px 10px; border-radius: 10px; display: inline-block; } 

.section--tv__sd-box li.hover__event { position: relative; } 
.section--tv .pseudo-element { background: #fff url('https://cdn.hackersut.com/www/images/main/2025/main_renew/re_250508/con07_hover.png') 0 0 / contain no-repeat; height: 520px; opacity: 1; position: absolute; width: 340px; top: 70px; right: 10px; filter: drop-shadow(0 0px 21px rgba(109, 148, 165, 0.34)); border-radius: 20px; } 


.section--tv__sd-box li.hover__event .hackersTV_sli_col02 p:nth-of-type(1) { position: relative; display: inline-block; } 
.section--tv__sd-box li.hover__event .hackersTV_sli_col02 p:nth-of-type(1)::after { position: absolute; top: 0; right: -17px; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/hackertv_new.png')0 0 no-repeat; width: 15px; height: 15px; content: ''; } 

.section--tv__sd-box .slide-control { font-size: 0; width: 50px; height: 50px; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/con06_control.png') 0 0 /contain no-repeat; display: block; position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer; } 
.section--tv__sd-box .slide-control.slide-prev { left: -80px; } 
.section--tv__sd-box .slide-control.slide-next { transform: scale(-1); right: -80px; top:42%; } 

.section--interview__title { text-align: left; color: #111; display: flex; align-items:end; margin-bottom: 30px; justify-content: space-between; } 
.section--interview__title >div { display: flex; align-items: end; } 
.section--interview__title >div h3 { font-size: 40px; font-weight: bold; letter-spacing: -1.5px; color: #222; } 
.section--interview__title >div p { color: #222; margin-bottom: 5px; margin-left: 10px; font-size: 14px; } 
.section--interview__title> a { font-weight: 500; font-size: 14px; color: #222; margin-bottom: 5px; } 
.section--interview-wrap { display: flex; justify-content: space-between; align-items: center; } 
.section--interview-box { position: relative; width: calc(100%/3 - 10px); } 
.section--interview-box img { width: 100%; filter: drop-shadow(0 20px 20px rgba(0, 0, 0, 0.12)); } 
.section--interview-box .pub_vid_box { position: absolute; top: 167px; left: 49%; width: 306px; height: 169px; transform: translateX(-50%); border-radius: 5px; overflow: hidden; cursor: pointer; } 

.section--service { margin: 100px auto 130px; } 
.section--service__wrap { display: flex; justify-content: space-between; } 
.section--service__right a { display: block; } 
.section--service__right a img { border-radius: 20px 20px 0 20px; box-shadow:0 1px 3px rgba(0, 0, 0, 0.08),0 10px 20px rgba(0, 0, 0, 0.10); } 
.section--service__right a:nth-of-type(1) { margin-bottom: 10px; } 

map { cursor: pointer; } 

.js-tab-type1-con { display: none; } 
.js-tab-type1-con.on { display: block; }