.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; } 
.banner_top { margin: 0 auto; position: relative; max-height: 146px; }
.banner_top a{display: block;width: 100%;}
.banner_top .bx-wrapper .bx-controls { position: absolute; top: 6%; right: 860px; } 
.banner_top .bx-wrapper .bx-pager a { display: inline-block; background: #adadada4; border-radius: 100%; } 
.banner_top .bx-wrapper .bx-pager a.active { background: #fff; } 
.banner_top .bx-wrapper .bx-has-pager .bx-pager-item { display: inline-block; } 

.header-2025__grid { display: grid; grid-template-columns: 2fr 1fr 2fr; } 
.header-2025__grid.login { grid-template-columns: 2fr 0.5fr 2.5fr; } 

#header-2025 { background: #f1f3f4; box-sizing: border-box; padding-top: 5px; position: relative; z-index: 101; } 
.header-2025__inner { width:1050px; position:relative; text-align:center; left:50%; transform: translateX(-50%); } 
.header-2025__col__ul { display: flex; align-items: center; } 
.header-2025__col03 .header-2025__col__ul { justify-content: flex-end; } 
.header-2025__col__ul > li > a { padding: 8px 18px 10px; display: block; color: #555555; position: relative; font-weight: 500; } 
.header-2025__col01__ul li.on { background: #fff; border-radius: 12px 12px 0 0; } 
.header-2025__col01__ul li:nth-of-type(2) { background: #fff; } 
.header-2025__col01__ul li:nth-of-type(2) a { background: #f1f3f4; border-radius:0 0 0 12px; } 
.header-2025__col__ul > li:not(.on, :last-of-type) > a::after { position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 15px; background: #e2e2e2; content: ''; display: block; } 

.header-2025__col01__ul li:nth-of-type(4) a { display: flex; align-items: center; } 
.header-2025__col01__ul li:nth-of-type(4) a::before { background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/star_icon.png') no-repeat; display: inline-block; width: 17px; height: 17px; content: ''; margin-right: 3px; } 

.header-2025__col03__ul li.join { position: relative; } 
.header-2025__col03__ul li.join .join__icon { position: absolute; top: 30px; box-shadow: 1px 5px 6px rgba(247, 0, 102, 0.1); } 

.user_class { position: relative; } 
#header-2025 .my_class_menu { display: none; width: 160px; padding: 15px; position: absolute; top: 41px; left: -39px; background: #fff; border: 1px solid #333; z-index: 1001; box-sizing: border-box; border-radius: 3px; } 
#header-2025 .my_class_menu:before { position: absolute; top: -9px; left: 50%; transform: translateX(-50%); width: 18px; height: 11px; content: ''; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/ic_gnb_arrow.png') no-repeat; } 
#header-2025 .my_class_menu li { width: 100%; text-align: left; padding: 10px 0; } 
#header-2025 .my_class_menu li a:hover { font-weight: 600; } 


.header__grid { padding: 45px 0; position: relative; } 
.header__grid .miniBan { position: absolute; top: 8%; left:17.5%;} 
.header__grid .miniBan a{background-color: #ffe2ee; padding:3px 10px; display: block; border-radius: 6px; font-size: 12px; color: #000; letter-spacing: -0.02em;}
.header__grid .miniBan a:after{content: ''; background-color: #ffe2ee; display: inline-block; width: 8px; height: 8px; position: absolute; bottom: -22%; left: 50%; transform: translateX(-50%) rotate(45deg);}
.header__grid .miniBan a span{color: #d50057; font-weight: 600;}
.landing-btn { display: flex; align-items: center; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } 
.landing-btn a { padding: 8px 15px; text-align: center; box-sizing: border-box; font-weight: 500; color: #555555; font-size: 13px; } 
.btn_calendar{position: absolute; top:28px; right:0; width: 23%;}
.hackersut-wrap { display: flex; align-items: center; } 
.hackersut-wrap a:nth-of-type(1) { display: flex; align-items: center; border: 1px solid #dadada; border-right:none; border-radius: 8px 0 0 8px; } 
.hackersut-wrap a:nth-of-type(1)::after { content: ''; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/academy_icon.png')no-repeat; display: inline-block; width: 10px; height: 8px; margin-left: 5px; } 
.hackersut-wrap a:nth-of-type(2) { border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; } 
.hackersut-wrap a:nth-of-type(3) { border:1px solid #dadada; border-left: none; border-radius: 0 8px 8px 0; } 
.hackersut-wrap a.on { background: #d50057; color: #fff; border: none; border-radius: 5px; box-shadow: 1px 10px 11px 0px rgba(213, 0, 87, 0.12); border: 1px solid #d50057; } 

.ingang-wrap { margin-left: 10px; } 
.ingang-wrap a { color: #d50057; border: 1px solid transparent; border-radius: 8px; display: flex; align-items: center; justify-content: center; background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #fe72bc 20%, #ab7dfb 100%); background-origin: border-box; background-clip: content-box, border-box; padding:0; width: 88px; height: 35px;} 
.ingang-wrap a::after { content: ''; background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/re_250804/ingang_icon.png') no-repeat; display: inline-block; width: 8px; height: 8px; margin-left: 5px; } 
.ingang-wrap a:hover { background: #d50057; color: #fff; } 
.ingang-wrap a:hover::after { background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/ingang_icon_on.png') no-repeat; } 

#header { position: relative; z-index: 100; } 
#header .h_lnb_div { position: relative; z-index: 2; } 
.lnb-wrap { display: flex; width: 100%; align-items: center; } 
.lnb-wrap >li { position: relative; width: calc(100%/7); text-align: center; margin: 5px 0; } 
.lnb-wrap >li >a { padding: 15px 0; font-weight: 600; color: #444; box-sizing: border-box; display: block; font-size: 16px; text-align: left;} 
.lnb-wrap >li >a:hover { color: #222; } 
.lnb-wrap >li .lnb-2depth { position: absolute; top:50px; left: 50%; transform: translateX(-50%); z-index: 2; background: #fff; border: 1px solid #333; border-radius: 12px; padding: 20px 5px; max-width: 1000px; width: 100%; display: none; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 20px 20px rgba(0, 0, 0, 0.12); border-radius: 20px;} 
.lnb-wrap >li .lnb-2depth div { text-align: left; } 
.lnb-wrap >li .lnb-2depth div:not(.m4__banner-area) a { width: 100%; color: #222; font-weight: 500; padding:5px 20px; display: inline-block; box-sizing: border-box; font-size: 14px; } 
.lnb-wrap >li .lnb-2depth >div >a:hover { font-weight: 800; text-decoration: underline; } 

.lnb-wrap .m2 .lnb-2depth { width: 130%; } 
.lnb-wrap .m3 .lnb-2depth { width: 120%; } 
.lnb-wrap .m5 .lnb-2depth { width: 130%; } 
.lnb-wrap .m6 .lnb-2depth { width: 120%; } 

.lnb-wrap .m3 .lnb-2depth div:nth-of-type(1) a:hover { text-decoration: none; } 
.lnb-wrap .m3 .lnb-2depth div:not(:nth-of-type(1)) a:before { content: ''; display: inline-block; width: 5px; height: 5px; border-left: 1px solid #747474; border-bottom: 1px solid #747474; margin-right: 7px; } 

.lnb-wrap .m4 .lnb-2depth { width: 1050px; padding: 25px; box-sizing: border-box; max-width: 1050px; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol { display: table; width: 1000px; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li { display: table-cell; box-sizing: border-box; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li:not(:last-of-type) { border-right:1px solid #eeeeee } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li div a { padding:0 23px 14px 0; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li:not(:nth-of-type(1)) div a { padding-left: 20px; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li:last-of-type div a { padding-right: 0px; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li div:nth-of-type(1) a { color: #d50057; font-weight: 600; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li div:nth-of-type(1) a:hover { text-decoration: none; } 
.lnb-wrap .m4 .lnb-2depth .m4__menu ol li div:not(:nth-of-type(1)) a:hover { text-decoration: underline; font-weight: 600; } 
.lnb-wrap .m4 .lnb-2depth .m4__banner-area { width: 1000px; margin: 30px auto 0; } 
.lnb-wrap .m4 .lnb-2depth .m4__banner-area img { width: 100%; } 

.lnb-wrap .m7 { background: #f5f7f8; box-sizing: border-box; border-radius: 30px; animation: blink 0.8s linear infinite alternate;} 
.lnb-wrap .m7>a { display: flex; align-items: center; justify-content: center; padding:10px 0; animation: blink3 0.8s linear infinite alternate;} 

.lnb-wrap .m7>a::before {  width: 18px; height: 27px; content: ''; display: inline-block; margin-right: 5px; animation: blink2 0.8s linear infinite alternate;} 
.lnb-wrap .m7:hover { 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; animation: none; } 
.lnb-wrap .m7:hover>a::before { background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/m7_icon_on.png')0 0 no-repeat; animation: none;} 
.lnb-wrap .m7:hover a { color: #d50057; animation: none;} 

@keyframes blink{
    /* 테두리(border) */
    0%, 49%{border: none; background: #f5f7f8;}
    50%, 100%{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; }
}
@keyframes blink2{
    /* 아이콘 */
    0%, 49%{background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/m7_icon.png')0 0 no-repeat;}
    50%, 100%{background: url('https://cdn.hackersut.com/www/images/main/2025/main_renew/m7_icon_on.png')0 0 no-repeat;}
}
@keyframes blink3{
    /* 폰트 색상 */
    0%, 49%{color: #444}
    50%, 100%{color: #d50057;}
}

.lnb-wrap .m7 .lnb-2depth { border: none; padding: 0; background: transparent; padding: 5px 0; box-shadow: none;width: 110%;} 
.lnb-wrap .m7 .lnb-2depth .border-gradient { 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; border-radius: 20px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 20px 20px rgba(0, 0, 0, 0.12);} 
.lnb-wrap .m7 .lnb-2depth:before { display: none; } 

.lnb-wrap .m7 .chevron { display: inline-block; width: 10px; height: 10px; position: relative; margin: 0 8px; } 
.lnb-wrap .m7 .chevron::before,
.lnb-wrap .m7 .chevron::after { content: ''; position: absolute; width: 8px; height: 1px; background-color: #222; top: 50%; right: 0; transform-origin: right center; transition: background 0.3s; } 

.lnb-wrap .m7 .chevron::before { transform: rotate(45deg); } 

.lnb-wrap .m7 .chevron::after { transform: rotate(-45deg); } 

.lnb-wrap .m7:hover .chevron::before,
.lnb-wrap .m7:hover .chevron::after { background: linear-gradient(90deg,
 rgba(252, 82, 175, 1) 0%,
 rgba(213, 84, 202, 1) 50%,
 rgba(165, 100, 242, 1) 100%); } 


.lnb-wrap .m7 .lnb-2depth .border-gradient div { text-align: center; } 
.lnb-wrap .m7 .lnb-2depth .border-gradient div:nth-of-type(1) { margin-top: 10px; } 
.lnb-wrap .m7 .lnb-2depth .border-gradient div:last-of-type { margin-bottom: 10px; } 
.lnb-wrap .m7 .lnb-2depth .border-gradient div a { padding: 6px 18px; color: #222; } 
.lnb-wrap .m7 .lnb-2depth .border-gradient div a:hover { font-weight: bold; }