#main{padding-top: 137px;}

#visual{padding: 80px 0; background: #ffdf35; border-top-left-radius: 72px; margin-top: 86px;}
#visual .visual-tit{ position: absolute; left: 20px; top: 165px; z-index: 10;}
#visual h2{display: inline-flex; flex-direction: column;}
#visual h2 p{font-weight: 800; font-size: 50px; color: #fff; padding: 16px 14px; background: #000; display: inline-flex; align-items: center; max-height: 73px;}
#visual h2 p span{opacity: 0;  display: inline-block;}
#visual h2.animate{animation: h2Reveal 1.2s forwards;}
#visual h2.animate p span{animation: fadeChar 1s forwards;}
#visual h2 p span:nth-child(1) { animation-delay: .05s; }
#visual h2 p span:nth-child(2) { animation-delay: .10s; }
#visual h2 p span:nth-child(3) { animation-delay: .15s; }
#visual h2 p span:nth-child(4) { animation-delay: .20s; }
#visual h2 p span:nth-child(5) { animation-delay: .25s; }
#visual h2 p span:nth-child(6) { animation-delay: .30s; }
#visual h2 p span:nth-child(7) { animation-delay: .35s; }
#visual h2 p span:nth-child(8) { animation-delay: .40s; }
#visual h2 p span:nth-child(9) { animation-delay: .45s; }
#visual h2 p span:nth-child(10) { animation-delay: .50s; }
#visual h2 p span:nth-child(11) { animation-delay: .55s; }
#visual h2 p span:nth-child(12) { animation-delay: .60s; }
#visual h2 p span:nth-child(13) { animation-delay: .65s; }
#visual h2 p span:nth-child(14) { animation-delay: .70s; }
#visual h2 p span:nth-child(15) { animation-delay: .75s; }

#visual h2 p:last-of-type{display: inline-block; width: max-content; line-height: 40px;}
#visual h2 p em{color: #ffdf32;}
#visual h2 p em.v1,
#visual h2 p em.v2{padding-left: 13px; display: inline-block;}
#visual h2 p + p{margin-top: 7px;}
#visual h2 > span{font-size: 48px; font-weight: 800; display: inline-block; padding-top: 23px; text-shadow: 1px 1px 2px rgba(255,255,255,0.7), 0 0 6px rgba(255,255,255,0.5);}

#visual .control{position: absolute; left: 20px; top: 428px; z-index: 15; display: flex; gap: 13px;}
#visual .control button img{width: 60px;}
#visual .control button.prev{background: url(/page/bomnae/images/main/arrow1_2on.png)no-repeat; width: 60px; height: 60px; background-size: cover;}
#visual .control button.next{background: url(/page/bomnae/images/main/arrow1_1on.png)no-repeat; width: 60px; height: 60px; background-size: cover;}
#visual .control button.prev.active{background-image: url(/page/bomnae/images/main/arrow1_2.png);}
#visual .control button.next.active{background-image: url(/page/bomnae/images/main/arrow1_1.png);}
#visual .slick-wrap{margin-top: -165px; position: relative; z-index: 5; width: 1600px;}
#visual .slick > div{animation: fadeChar01 .8s forwards;}
#visual .slick > div .text{flex-shrink: 0; width: 367px; padding-right: 10px;}
#visual .slick > div .text strong{font-size: 32px; display: inline-block; color: #101212; line-height: 1.2; font-weight: 700; padding-bottom: 16px;}
#visual .slick > div .text p{font-size: 20px; font-weight: 300; line-height: 1.9; word-break: keep-all;}
#visual .slick .slick-list{ margin-right: -71px;}
#visual .slick > div .slick-slide{display: flex !important; align-items: flex-end;}
#visual .slick > div .slick-slide img{border-radius: 12px;}
#visual .slick .img-wrap{width: 1304px !important; flex-shrink: 0; overflow: hidden;}
#visual .slick .img-wrap img{display: block; width: 100% !important; height: 715px; object-fit: cover;}

@media (max-width:1440px) {
    #main{padding-top: 67px;}

    #visual{margin-top: 52px;}
    #visual .slick{width: 100%; overflow: hidden;}
    #visual .slick > div .slick-slide{justify-content: space-between;}
    #visual .slick .img-wrap{width: 820px !important;}
    #visual .slick .img-wrap img{height: 650px;}
    #visual .slick > div .text{width: auto;}
    #visual .slick-wrap{width: 100%; overflow: hidden; margin-top: -130px;}
    #visual .slick .slick-list{margin-right: 0;}
    #visual .slick{border-radius: 15px;}
    #visual .slick > div .slick-slide{border-radius: 15px;}
}

@media (max-width:991px) {
    #visual{margin-top: 31px; padding: 80px 0 40px;}
    #visual .visual-tit{top: 50px;}
    #visual h2 p{padding: 15px; max-height: 50px; display: flex !important; align-items: center; font-size: 28px;}
    #visual h2 > span{font-size: 25px; padding-top: 15px;}
    #visual .slick .img-wrap{width: 600px !important;}
    #visual .slick .img-wrap img{height: 400px;}
    #visual .slick-wrap{overflow: hidden; margin-top: -110px;}
    #visual .slick > div .text strong{font-size: 20px; padding-bottom: 5px;}
    #visual .slick > div .text p{font-size: 16px;}
    #visual .control{top: 230px;}
    #visual .control button.prev,
    #visual .control button.next{width: 40px; height: 40px;}
}

@media (max-width:760px) {
    #visual{margin-top: 0;}
    #visual .visual-tit{top: auto; left: auto; position: relative;}
    #visual h2 p{font-size: 24px;}
    #visual h2 > span{font-size: 22px;}
    #visual{padding: 40px 0 20px;}
    #visual .slick-wrap{width: 100%; overflow: hidden; padding-top: 100px; margin-top: 0;}
    #visual .slick .img-wrap{width: 100% !important;}
    #visual .slick .img-wrap img{width: 100% !important; height: 220px !important;}
    #visual .slick > div .slick-slide{flex-direction: column; align-items: flex-start;}
    #visual .slick > div .text{order: 2; padding-top: 15px;}
    #visual .control{top: 180px;}
    #visual .slick .slick-list{margin-right: 0;}
    #visual .slick > div .text strong{font-size: 18px;}
    #visual .slick > div .text p{font-size: 14px; line-height: 1.4;}
}


#bomker{text-align: center;  position: relative; overflow: hidden; }
#bomker.show{padding-right: 20px;}
#bomker::before{content: ''; width: 732px; height: 734px; background: url(/page/bomnae/images/main/bg_logo1.png)no-repeat;
position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); animation: fadeChar03 4s forwards;}
#bomker .bomker-bx{position: relative; padding:327px 0;}
#bomker .bomker-bx::before{content: ''; background: url(/page/bomnae/images/main/illust1.png)no-repeat; background-size: cover; width:373px; height: 351px;
position: absolute; left: 90px; top: 78px; z-index: -1;}
#bomker .bomker-bx::after{content: ''; background: url(/page/bomnae/images/main/illust2_1.png)no-repeat; background-size: cover; width:450px; height: 466px;
position: absolute; right: -60px; bottom: 0;  z-index: -1;}
#bomker .bomker-bx::after,
#bomker .bomker-bx::before{opacity: 0;}
#bomker .bomker-bx::after,
#bomker .bomker-bx::before{animation: fadeChar01 6s forwards;animation-delay: 2s;}
#bomker.show::before{opacity: 0.15; filter: blur(15px);  transition-delay: 0.5s;}
#bomker h2{display: flex; gap: 20px; align-items: flex-end; justify-content: center; font-size: 84px; font-weight: 700; animation: fadeChar01 2s forwards; animation-delay: .8s;}
#bomker h2 img{display: block; width: 176px; position: relative; top: -20px;}
#bomker span{font-size: 58px; font-weight: 500; animation: slideInRight 2s forwards;animation-delay: 1.8s;}
#bomker h2{opacity: 0; transform: translateY(40px); transition: opacity .6s ease-out, transform .6s ease-out;}
#bomker span{display: inline-block; opacity: 0;  transform: translateX(-50px);}

@media (max-width:1440px) {
    #bomker .bomker-bx::before{left: 15px; top: 15px;}
    #bomker .bomker-bx::after{width: 350px; height: 350px; background-size: cover; right: 0;}
}

@media (max-width:991px) {
    #bomker::before{width: 500px; height: 500px; background-size: cover;}
    #bomker .bomker-bx{padding: 180px 0 250px;}
    #bomker .bomker-bx::before{width: 200px; height: 200px; background-size: cover;}
    #bomker .bomker-bx::after{width: 280px; height: 280px;}
    #bomker h2{font-size: 50px;}
    #bomker h2 img{width: 100px;}
    #bomker span{font-size: 30px;}
}

@media (max-width:760px) {
    #bomker.show::before{filter: blur(5px);}
    #bomker::before{width: 200px; height: 200px;}
    #bomker .bomker-bx{padding: 100px 0 120px;}
    #bomker .bomker-bx::before{left: 0; top: 0;}
    #bomker .bomker-bx::before{width: 100px; height: 100px;}
    #bomker .bomker-bx::after{width: 140px; height: 140px;}
    #bomker h2{font-size: 30px; gap: 10px;}
    #bomker h2 img{width: 70px; top: -10px;}
    #bomker span{font-size: 20px;}
}

#business{background: #f7f8f9; padding-top: 75px; height: 925px; position: relative;}
#business::before{content: ''; width: 522px; height: 548px; background: url(/page/bomnae/images/main/business_bg.png)no-repeat;
position: absolute; left: 0; bottom: 0;}
#business .business-bx{display: flex; justify-content: space-between; position: relative;}
#business .business-bx .title{flex-shrink: 0;  z-index: 20; width: 300px; will-change: transform; transition: transform 0.25s ease-out;}
#business .business-bx h3{font-size: 60px; font-weight: 700;}
#business  a.more{position: absolute; left: 0; top: 99px; padding: 10px 75px 10px 27px; font-weight: 500; transition: all .3s;  background: #ffdf32 url(/page/bomnae/images/main/plus4.png)no-repeat 92% 50%; height: 66px; display: inline-flex; align-items: center; border-radius: 38px;}
#business .business-bx a.more:hover{background-color: #000; color: #fff; transition: all .3s;}
#business .list-bx{position: absolute; right: 0; top: 0;  max-height: calc(100vh - 100px); overflow-y: scroll;  scrollbar-width: none; box-sizing: content-box; }
#business .list-bx::-webkit-scrollbar{display: none;}
#business .list-bx ul{display: grid; gap: 25px 33px; grid-template-columns: repeat(2,1fr);}
#business .list-bx ul li{position: relative;}
#business .list-bx ul li:nth-child(2n){top: 94px;}
#business .list-bx ul li:last-child{padding-bottom: 50px;}
#business .list-bx ul li.v4{position: absolute; right: 0; top: 472px;}
#business .list-bx ul li a{border-radius: 12px; position: relative; width: 613px; display: flex; border-radius: 10px; overflow: hidden;}
#business .list-bx ul li a::before{content: ''; opacity: 0;}
#business .list-bx ul li a:hover::before{content: ''; width: 100%; height: 100%; background: #ffdf35; position: absolute; left: 0; top: 0; right: 0; bottom: 0; opacity: 1; transition: all .3s; border-radius: 10px;}
#business .list-bx ul li:nth-child(3) a:hover::before,
#business .list-bx ul li:nth-child(4) a:hover::before{background: #c1e600;}
#business .list-bx ul li:nth-child(5) a:hover::before,
#business .list-bx ul li:nth-child(6) a:hover::before{background: #b6e6f6;}
#business .list-bx ul li a:hover::before{opacity: 1; transition: all .3s;}
#business .list-bx ul li a img{display: block; width: 613px; height: 351px; border-radius: 12px; object-fit: cover;}
#business .list-bx ul li a > div{position: absolute; left: 41px; bottom: 12%; transition: all .3s; display: flex; flex-direction: column; color: #fff;}
#business .list-bx ul li a:hover > div::before{content: ''; width: 30px; height: 2px; background: #000; position: absolute; top: 94px; left: 0;}
#business .list-bx ul li a:hover > div::after{content: ''; width: 56px; height: 56px; background: url(/page/bomnae/images/main/arrow2_1.png)no-repeat; background-size: cover; position: absolute; right: 30px; top: -80px; z-index: 10;}
#business .list-bx ul li a:hover > div{bottom: 50%; right: 0; transition: all .3s; color: #000;}
#business .list-bx ul li a > div strong{font-size: 34px; font-weight: 700; padding-bottom: 4px; line-height: 1.2;}
#business .list-bx ul li a > div span{font-size: 22px;}
#business .list-bx ul li a > div p{display: none; position: absolute; left: 0; bottom: 0%; transition: all .3s; }
#business .list-bx ul li a:hover > div p{display: block;  bottom: -158%; transition: all .3s; font-size: 18px;  color: #333; font-weight: 300;  overflow: hidden;  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis;}

@media (max-width:1440px) {
    #business{height: 790px;}
    #business::before{width: 400px; height: 400px; background-size: cover;}
    #business .list-bx{width: 900px;}
    #business .list-bx ul li a,
    #business .list-bx ul li a img{width: 100%; height: 300px;}   
    #business .list-bx ul li a > div p{word-break: keep-all;}
    #business .list-bx ul li a:hover > div::after{right: 20px; top: -50px;}
    #business .list-bx ul li a:hover > div::before{top: 98px;}
}

@media (max-width:1200px) {
    #business{height: 800px; padding-top: 60px;}
    #business::before{width: 300px; height: 300px;}
    #business .list-bx{width: 600px;}
    #business .business-bx h3{font-size: 36px;}
    #business  a.more{font-size: 14px; padding: 10px 65px 10px 20px; margin-top: 0; height: 50px; background-size: 35px 35px; top: 69px;}
    #business .list-bx ul li a, 
    #business .list-bx ul li a img{height: 220px;}
    #business .list-bx ul li a > div{left: 20px;}
    #business .list-bx ul li a > div strong{font-size: 20px;}
    #business .list-bx ul li a > div span{font-size: 16px;}
    #business .list-bx ul li a:hover > div p{font-size: 15px;}
    #business .list-bx ul li a:hover > div::before{top: 82px;}
    #business .list-bx ul li a:hover > div::after{width: 30px; height: 30px; top: -60px; right: 15px;}
}

@media (max-width:760px) {
    #business{height: auto; padding: 30px 0 140px;}
    #business::before{width: 150px; height: 150px;}
    #business .business-bx{position: relative;}
    #business .business-bx .title{display: flex; align-items: center; justify-content: center; width: 100%;}
    #business .business-bx h3{font-size: 22px;}
    #business  a.more{top: auto; left: 50%; bottom: -90px; transform: translateX(-50%); margin-top: 0; height: 50px; background-size: 35px 35px; padding: 10px 55px 10px 20px; font-size: 14px;}
    #business .list-bx{position: relative; right: auto; top: auto; width: 100%; overflow-x: scroll;  padding-right: 20px;}
    #business .business-bx{flex-direction: column;}
    #business .list-bx ul{display: flex; gap: 0 20px; padding-top: 30px;}
    #business .list-bx ul li{flex: 1; height: 250px;}
    #business .list-bx ul li a, #business .list-bx ul li a img{height: 250px;}
    #business .list-bx ul li:nth-child(2n){top: auto;}
    #business .list-bx ul li a{width: 356px;}
    #business .list-bx ul li a:hover > div p{padding-right: 15px;}
    #business .list-bx ul li a > div strong{font-size: 18px;}
    #business .list-bx ul li a > div span{font-size: 15px;}
    #business .list-bx ul li a:hover > div::before{top: 65px;}
    #business .list-bx ul li a:hover > div::after{width: 20px; height: 20px;}
}

#live{position: relative; padding: 126px 0 108px; background: url(/page/bomnae/images/main/bgimg.jpg)no-repeat; background-size: cover; background-attachment: fixed;}
#live .live-tit{text-align: center; color: #fff;}
#live .live-tit h3{font-size: 60px; font-weight: 700;}
#live .live-tit p{font-size: 28px; padding-top: 10px;}

#live .slick-wrap{position: relative;}
#live .slick{padding-top: 45px;}
#live .slick .slick-list{margin: 0 -7px;}
#live .slick a > div{overflow: hidden; border-radius: 15px;}
#live .slick.item a img{max-width: 180%; max-height: 180%;}
#live .slick a img{border-radius: 15px; transition: all .3s; object-fit: cover; height: 374px;}
#live .slick a:hover img{transform: scale(1.1);}
#live .slick a{color: #fff; margin: 0 8px;}
#live .slick a .text_box{display: flex; align-items: center; padding-top: 29px;}
#live .slick a .text_box strong{font-size: 24px; font-weight: 700;  display: block;}
#live .slick a .text_box em{color: #ffb432; font-size: 18px; font-weight: 600; white-space: nowrap; margin-right: 12px; padding-right: 12px; position: relative;}
#live .slick a .text_box em::after{content: ''; width: 1px; height: 16px; background: #888; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}


#live .slick a span{display: inline-block; font-size: 18px; font-weight: 300; padding-top: 6px; line-height: 1.7; overflow: hidden;  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis;}
#live .more{position: absolute; right: 0; top: -34px; color: #fff; display: flex; gap: 23px; align-items: center; }
#live .more img{display: block; width: 47px; transition: all .3s;}
#live .more:hover img{transform: rotate(45deg); transition: all .3s}
#live .control{position: absolute; left: 13px; top: 220px; z-index: 10; width: 100%;}
#live .control button{position: absolute; left: 0; top: 0; transition: all .3s;}
#live .control button:hover{transform: scale(1.1); transition: all .3s;}
#live .control button.next{right: 26px; left: auto;}
#live .control button img{display: block; width: 56px; filter: drop-shadow(1px 1px 8px rgba(0,0,0,.3));}

@media (max-width:1440px) {
    #live .slick a img{height: 250px;}
    #live .control{top: 150px;}
    #live .slick a span{word-break: keep-all;}
    #live .slick a span br{display: none;}
}

@media (max-width:991px) {
    #live{padding: 60px 0 70px;}
    #live .live-tit h3{font-size: 40px;}
    #live .live-tit p{font-size: 20px;}
    #live .more{gap: 15px;}
    #live .more img{width: 35px;}
}

@media (max-width:760px) {
    #live{padding: 30px 0;}
    #live .live-tit h3{font-size: 22px;}
    #live .live-tit p{font-size: 16px;}
    #live .slick-wrap{padding-top: 50px;}
    #live .more{top: 45px; gap: 10px; font-size: 13px;}
    #live .more img{width: 30px;}
    #live .control{display: none;}
    #live .slick a .text_box{padding-top: 10px;}
    #live .slick a .text_box strong{font-size: 16px;}
    #live .slick a .text_box em{font-size: 13px; margin-right: 8px; padding-right: 8px;}
    #live .slick a .text_box em::after{height: 12px;}
    #live .slick a span{font-size: 14px; padding-top: 3px;}
}

#notice{padding: 122px 0 140px;}
#notice .inner{display: flex; gap: 110px;}
#notice .board{width: 70%;}
#notice .board .board-tit h3{font-size: 36px; font-weight: 700; color: #222;}
#notice .board .board-tit p{font-size: 18px; color: #444; display: inline-block; padding-top: 7px;}
#notice .board .box-wrap{position: relative;}
#notice .board .box{padding-top: 70px; display: flex; gap: 50px;}
#notice .board .box a{flex: 1; height: 194px; transition: all .3s; border-radius: 10px; position: relative;}
#notice .board .box a > div{display: flex; gap: 14px; align-items: center;}
#notice .board .box a > div em{padding: 0 21px; background: #efefef; height: 36px; font-weight: 600; border-radius: 16px; display: inline-flex; align-items: center;}
#notice .board .box a.event > div em{color: #ffba00;}
#notice .board .box a.steady > div em{color: #adce00;}
#notice .board .box a.news > div em{color: #007ea7;}
#notice .board .box a > div span{font-size: 14px; color: #b1b1b1; font-weight: 600;}
#notice .board .box a strong{font-weight: 500; position: relative; font-size: 20px; color: #121212; line-height: 1.7; 
text-decoration: underline;   text-decoration-color: transparent;  text-decoration-thickness: 2px;  transition: text-decoration-color .3s;   text-decoration-skip-ink: none;  padding-top: 29px; overflow: hidden;  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis;}
#notice .board .box a.event:hover strong{text-decoration-color: #ffba00;}
#notice .board .box a.steady:hover strong{text-decoration-color: #adce00;}
#notice .board .box a.news:hover strong{text-decoration-color: #007ea7;}
#notice .board .box a:hover strong{text-decoration-color: #000;}
#notice .board .box a > span{display: flex; gap: 5px; align-items: center; font-size: 14px; position: absolute; left: 0; bottom: 0;}
#notice .board .box a > span img{display: inline-block; width: 11px; transition: all .3s;}
#notice .board .box a:hover > span img{transform: rotate(45deg); transition: all .3s;}
#notice .board .box-wrap .more{position: absolute; right: 0; top: -25px; font-size: 12px; transition: all .3s; padding: 0 15px 0 20px; border-radius: 25px; width: 112px; height: 45px; border: 1px solid #000; display: flex; align-items: center;}
#notice .board .box-wrap .more:hover{background: #000; color: #fff; transition: all .3s;}
#notice .board .box-wrap .more span{flex: 1;}
#notice .board .box-wrap .more img{display: inline-block; width: 17px;}
#notice .board .box-wrap .more:hover img{filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7410%) hue-rotate(14deg) brightness(105%) contrast(109%);}

#notice .slick-wrap{width: 490px;}
#notice .slick-wrap .slick-title{display: flex; justify-content: space-between;}
#notice .slick-wrap .control{display: flex; gap: 5px; align-items: center;}
#notice .slick-wrap .control .count{background: #eeeeee; padding: 0 12px; height: 32px; color: #6a6a6a; font-size: 14px; display: flex; align-items: center; border-radius: 15px;}
#notice .slick-wrap .control .count strong{font-weight: 800; color: #ff9600;}
#notice .slick-wrap .control .count span{margin: 0 4px;}
#notice .slick-wrap .control button img{display: block; width: 33px;}
#notice .slick-wrap .control button.play{display: none;}
#notice .slick-wrap h3{font-size: 36px; font-weight: 700; color: #2e2e2e;}
#notice .slick{padding-top: 3px;}
#notice .slick a img{height: 352px; object-fit: cover; border-radius: 14px;}

@media (max-width:1440px) {
    #notice .inner{gap: 20px; justify-content: space-between;}
    #notice .board{width: 60%;}
    #notice .board .box{gap: 30px;}
    #notice .board .box a > div{white-space: nowrap;}
    #notice .slick-wrap{width: 400px;}
    #notice .slick a img{height: auto;}
    #notice .board .box a > span{bottom: 15px;}
}

@media (max-width:1024px) {
    #notice{padding: 50px 0 70px;}
    #notice .slick-wrap{width: 300px;}
    #notice .board .box-wrap .more{width: 85px; padding: 0 10px; font-size: 13px; height: 35px; top: -20px;}
    #notice .board .box-wrap .more img{width: 13px;}
    #notice .board .box{gap: 15px; padding-top: 30px;} 
    #notice .board .board-tit h3{font-size: 25px;}
    #notice .board .board-tit p{font-size: 16px;}
    #notice .board .box a{height: 170px;}
    #notice .board .box a > div{gap: 10px;}
    #notice .board .box a > div em{padding: 0 12px; font-size: 13px; height: 30px;}
    #notice .board .box a strong{font-size: 16px;}
    #notice .board .box a > span{font-size: 14px;}

    #notice .slick-wrap h3{font-size: 25px;}
    #notice .slick-wrap .control .count{font-size: 13px; height: 25px;}
    #notice .slick-wrap .control button img{width: 25px;}
}

@media (max-width:760px) {
    #notice{padding: 30px 0;}
    #notice .inner{flex-direction: column; gap: 35px;}
    #notice .board{width: 100%;}
    #notice .board .board-tit h3{font-size: 22px;}
    #notice .board .board-tit p{display: none;}
    #notice .board .box{flex-direction: column; gap: 25px; padding-top: 20px;}
    #notice .board .box a{flex: none; width: 100%; height: 130px; border-bottom: 1px solid #ccc; border-radius: 0;}
    #notice .board .box a strong{padding-top: 19px;}
    #notice .board .box a > span{display: none;}
    #notice .board .box-wrap .more{top: -36px;}

    #notice .slick-wrap{width: 100%;}
    #notice .slick-wrap h3{font-size: 22px;}
}

#program{padding-bottom: 145px;}
#program .program-tit{display: flex; justify-content: space-between; align-items: center;}
#program .program-tit h3{font-size: 36px; font-weight: 700; color: #222;}
#program .program-tit .more{display: flex; gap: 23px; align-items: center; font-weight: 500;}
#program .program-tit .more img{width: 47px; transition: all .3s;}
#program .program-tit .more:hover img{transform: rotate(45deg); transition: all .3s;}

#program .slick{position: relative;}
#program .slick .slick-list{margin: 0 -8px;}
#program .slick a{margin: 0 8px; padding: 25px 0; position: relative;}
#program .slick a em{position: absolute; right: 16px; top: 41px; background: #4b4b4b; transition: all .3s; z-index: 1; display: flex; justify-content: center; align-items: center; color: #fff; border-radius: 50%; font-weight: 500; width: 76px; height: 76px; box-shadow: 1px 1px 8px rgb(0, 0, 0, .3);}
#program .slick a em.accepting{background: rgba(255, 161, 11, .89);}
#program .slick a:hover em{top: 16px; transition: all .3s;}
#program .slick .slick-slide img{transition: all .3s;}
#program .slick .slick-slide:hover img{margin-top: -25px; transition: all .3s;} 
#program .slick a img{display: block; border-radius: 12px; object-fit: cover;}
#program .slick a span{padding-top: 14px; display: block; line-height: 1.5; font-size: 18px;}
#program  .control{position: absolute; left: 0; top: 50%; z-index: 10; transform: translateY(-50%); width: 100%;}
#program  .control button{position: absolute; left: 34px; top: 0; transition: all .3s;}
#program  .control button:hover{transform: scale(1.1); transition: all .3s;}
#program  .control button.next{right: 34px; left: auto;}
#program  .control button img{display: block; width: 56px; filter: drop-shadow(1px 1px 8px rgba(0,0,0,.3));}

@media (max-width:1440px) {
    #program .slick a span{font-size: 16px;  overflow: hidden;  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis;}
    #program .slick a em{width: 60px; height: 60px; font-size: 14px; right: 5px; top: 30px;}
    #program .slick a:hover em{top: 5px;}
}

@media (max-width:991px) {
    #program{padding-bottom: 40px;}
    #program .program-tit h3{font-size: 25px;}
    #program .program-tit .more{gap: 15px;}
    #program .program-tit .more img{width: 35px;}
}

@media (max-width:760px) {
    #program{padding-bottom: 20px;}
    #program .program-tit h3{font-size: 22px;}
    #program .program-tit .more{font-size: 13px; gap: 10px;}
    #program .program-tit .more img{width: 30px;}
    #program .control{display: none;}

    #program .slick a em{width: 50px; height: 50px; font-size: 12px;}
    #program .slick a span{font-size: 14px; padding-top: 8px;}
}

@keyframes h2Reveal {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeChar {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeChar01 {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeChar02 {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeChar03 {
    0% {
         filter: blur(0); 
    }
    100% {
        filter: blur(40px); 
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(-50px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}