@charset "utf-8";
@font-face {
    font-family: 'Tenada';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2210-2@1.0/Tenada.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

section{background: #fafcff;}
.mwrap {/* overflow: hidden; *//* height: calc(100vh - 155px); */width:1660px;margin:0 auto;position:relative;font-size:1.6rem;word-break:keep-all;padding: 2em 0 3em 0;display: flex;justify-content: space-between;}

@media (max-width:1680px) {
	.mwrap {width:calc(100% - 20px); margin:0 10px ; }	
}
@media (max-width:1600px) {
	.mwrap {flex-wrap: wrap;justify-content: space-around; padding: 2em 0 1em 0;}	
}

/* 팝업존 */
.popup-wrap{border-radius: 10px 10px 0px 10px;overflow:hidden;width:504px;/* height:713px; */position: relative;}
.popup-wrap .control-box{width: 187px;height: 71px;position: absolute;bottom: 0px; right: 0px;background: url(/ssc/images/main/popup_ctrl_bg.png) no-repeat center;z-index: 10;align-items: flex-end;}
.popup-wrap .control-box .control{width: 100%;height: 100%;display: flex;padding: 3em 0.75em 0.5em 3em;justify-content: space-between;}
/* .popup-wrap .control-box .control .current-num{font-weight: 600; color: #07347b;} */
.popup-wrap .control-box button{display: block;/* margin-top: 0.2em; */width: 0.5em;height: 1em;}
.popup-wrap .control-box button.prevb{background: url(/ssc/images/main/popup_prev.png) no-repeat center / 100%;}
.popup-wrap .control-box button.nextb{background: url(/ssc/images/main/popup_next.png) no-repeat center / 100%;}
.popup-wrap .control-box button.stopb{background: url(/ssc/images/main/popup_stop.png) no-repeat center / 100%; width:0.6em;}
.popup-wrap .control-box button.playb{background: url(/ssc/images/main/popup_play.png) no-repeat center / 100%; width:0.6em;}
.popup-wrap .control-box button i{font-size:0rem;color:transparent;}
.paging.swiper-pagination-fraction{width:auto; color:#c0c5cc; font-weight:400;}
.swiper-pagination-current{font-weight: 600; color: #07347b;}

@media (max-width:1400px){
    .popup-wrap{width: 35%;}
    /* .popup-wrap .popup-slide{height:100%;} */
}
@media (max-width:1024px){
    .popup-wrap{width: 504px;}
}

@media (max-width:860px){    
    .popup-wrap{margin-bottom:2em;width:100%;max-width:504px;/* height: auto; */}{margin-bottom:2em;width:100%;/* max-width:504px; */height: auto;}
    .popup-wrap img{width:100%;}
}
@media (max-width:780px){    
    .popup-wrap .control-box .control{padding: 3.5em 1.5em 1.5em 3.5em;}
}

/* 콘텐츠 */
.cont-wrap{display: flex;width: 842px;width: 52.63em;height: 713px;flex-direction: column;justify-content: space-between;}
.cont-wrap .big2{display: flex;justify-content: space-between;}
.cont-wrap .big2 div{width: calc(50% - 17px); border-radius:10px;}
.cont-wrap .big2 div a{padding: 2em 3em 2em 2em;display: block; transition: all 0.3s}
.cont-wrap .big2 div a:hover {}
.cont-wrap .big2 div a h4{font-weight: 600;line-height: 3.6rem;font-size: 2em;color: #000c46;}
.cont-wrap .big2 div a p{margin-top: 2em;color: #444;}
.cont-wrap .big2 div:first-child{background: #F9E5FF; background: linear-gradient(135deg, rgba(249, 229, 255, 1) 0%, rgba(243, 202, 255, 1) 100%);}
.cont-wrap .big2 div:first-child a{background: url(/ssc/images/main/btn_big2_img1.png) no-repeat top 24px right 30px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg.png) no-repeat center / 100% 100%;}
.cont-wrap .big2 div:last-child{background: #E8E6FF; background: linear-gradient(135deg, rgba(232, 230, 255, 1) 0%, rgba(208, 204, 255, 1) 100%); transition: all 0.5s;}
.cont-wrap .big2 div:last-child a{background: url(/ssc/images/main/btn_big2_img2.png) no-repeat top 24px right 32px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg2.png) no-repeat center / 100% 100%;}


@media (min-width:1200px){    
    .cont-wrap .big2 div:first-child a:hover{animation: bounce1 0.5s ease;}
    .cont-wrap .big2 div:last-child a:hover{animation: bounce2 0.5s ease;}
    @keyframes bounce1{   
        0%{
            background: url(/ssc/images/main/btn_big2_img1.png) no-repeat top 24px right 30px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg.png) no-repeat center / 100% 100%;
        }
        50%{
            background: url(/ssc/images/main/btn_big2_img1.png) no-repeat top 14px right 30px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg.png) no-repeat center / 100% 100%;
        }
        100%{
            background: url(/ssc/images/main/btn_big2_img1.png) no-repeat top 24px right 30px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg.png) no-repeat center / 100% 100%;
        }
    }
    @keyframes bounce2{
        0%{
            background: url(/ssc/images/main/btn_big2_img2.png) no-repeat top 24px right 32px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg2.png) no-repeat center / 100% 100%;        
        }
        50%{
            background: url(/ssc/images/main/btn_big2_img2.png) no-repeat top 14px right 32px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg2.png) no-repeat center / 100% 100%;
        }
        100%{
            background: url(/ssc/images/main/btn_big2_img2.png) no-repeat top 24px right 32px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg2.png) no-repeat center / 100% 100%;
        }
    }
}

.quick{/* margin:3em 0; */}
.quick ul{display:flex;justify-content: space-between;}
.quick ul li{width: 22%;transition:all 0.5s;border: 2px solid transparent;border-radius: 10px;background-image: linear-gradient(transparent, transparent), linear-gradient(135deg, transparent 0%, transparent 100%);background-origin: border-box;background-clip: content-box, border-box;}
.quick ul li a{text-align: center;font-size: 1.8rem;line-height: 1.8rem;display: block;padding: 1.4em 0em 1.3em;border-radius: 10px;box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);/* position:relative; */background:#fff;}
.quick ul li a span{position: relative;padding-left:2.3em;transition: all 0.3s}
.quick ul li a span::after{content:"";display:block;position:absolute;width:25px;height:25px;background-repeat:no-repeat;top:50%;left: 0em;transform:translate(0, -50%);background-size: 100% 100%;}
.quick ul li:nth-child(1) a span::after{background-image:url(/ssc/images/main/ico_quick01.png);}
.quick ul li:nth-child(2) a span::after{background-image:url(/ssc/images/main/ico_quick02.png);}
.quick ul li:nth-child(3) a span::after{background-image:url(/ssc/images/main/ico_quick03.png);}
.quick ul li:nth-child(4) a span::after{background-image:url(/ssc/images/main/ico_quick04.png);}
.quick ul li:hover{border-radius: 10px; background-image: linear-gradient(#fff, #fff), linear-gradient(135deg, #3e419e 0%, #242873 100%);}
.quick ul li:hover a{color:#242873;}
.quick ul li:nth-child(1):hover a span::after{background-image:url(/ssc/images/main/ico_quick01_hover.png);}
.quick ul li:nth-child(2):hover a span::after{background-image:url(/ssc/images/main/ico_quick02_hover.png);}
.quick ul li:nth-child(3):hover a span::after{background-image:url(/ssc/images/main/ico_quick03_hover.png);}
.quick ul li:nth-child(4):hover a span::after{background-image:url(/ssc/images/main/ico_quick04_hover.png);}

.notice{padding:2em 2.5em; background:#fff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05); border-radius:10px;}
.notice .tit{position:relative;margin-bottom: 1.6em;}
.notice .tit h3{font-size:2.6rem; font-weight:600;}
.notice .tit h3 span{color:#2225a7;}
.notice .tit a{position:absolute; top:0px; right:0px; font-size:0rem;color:transparent; transition: all 0.3s;}
.notice .tit a:hover{transform:rotate(90deg);}
.notice ul{display:flex;justify-content: space-between;}
.notice ul li{width: 50%;font-family:'Pretendard';}
.notice ul li:first-child{padding-right:2em;border-right: 1px solid #eee;}
.notice ul li:last-child{padding-left:2em;}
.notice ul a:hover{text-decoration:underline;}
.notice ul a h4{font-size:2.2rem;font-weight:600;color:#333;}
.notice ul a p.txt{height: 2.5em;font-size:1.8rem;color:#444;margin: 1em 0 1em; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 2;}
.notice ul a p.date{color:#999;}

.guide{/* margin-top: 3em; */padding: 1.3em 2em 1.3em;display: flex;background: #fff;box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);border-radius:10px;line-height: 1;font-size: 1.8rem;justify-content: space-between;}
.guide div{display:flex; color:#333;}
.guide div h4{margin-right:0.5em;position:relative;padding-left:1.6em;line-height: 1em;padding-top: 0.2em; font-weight:600;}
.guide div h4::after{content:"";display:block;position:absolute;width: 21px;height: 22px;top: 50%;left:0px;transform:translateY(-50%); background-repeat:no-repeat; background-size:100% 100%}
.guide div:first-child h4::after{background-image:url(/ssc/images/main/icon_time.png);}
.guide div:last-child h4::after{background-image:url(/ssc/images/main/icon_phone.png);}
.guide div p{padding-top:0.2em;}

@media (max-width:1600px){
    .cont-wrap{width:60%;}
}
@media (max-width:1400px){
    .quick ul li{width:24%;}
    .guide{display: block;/* flex-wrap:wrap; */}
    .guide div:first-child{margin-bottom:1em;}
}
@media (max-width:1200px){
    .cont-wrap .big2 div a p{max-width: 200px;}
    .cont-wrap .big2 div:first-child a{background: url(/ssc/images/main/btn_big2_img1.png) no-repeat top 24px right 0px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg.png) no-repeat center / 100% 100%;}
    .cont-wrap .big2 div:last-child a{background: url(/ssc/images/main/btn_big2_img2.png) no-repeat top 24px right 0px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg2.png) no-repeat center / 100% 100%;}

    .quick ul li a span::after{/* left: 1.5em; */}
}
@media (max-width: 1024px){
    .cont-wrap{width:calc(100% - 534px);}
    .cont-wrap .big2{display:block;}
    .cont-wrap .big2 div{width:100%;}
    .cont-wrap .big2 div a{padding: 1.5em 3em 1.5em 1.5em;}
    .cont-wrap .big2 div a h4{margin-right:1em;font-size: 2.4rem;line-height: 2.4rem;}
    .cont-wrap .big2 div a h4 br{display:none;}
    .cont-wrap .big2 div a p{font-size: 1.4rem;max-width:100%;margin-top:1em;}
    .cont-wrap .big2 div:first-child a{background: url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg.png) no-repeat center / 100% 100%;}
    .cont-wrap .big2 div:first-child{margin-bottom:0.8em;}
    .cont-wrap .big2 div:last-child a{background: url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right, url(/ssc/images/main/btn_big2_bg2.png) no-repeat center / 100% 100%;}
    
    .quick ul{flex-wrap:wrap;}
    .quick ul li{width:48%;}
    .quick ul li:nth-child(1), .quick ul li:nth-child(2){margin-bottom:0.6em;}
    .quick ul li a{padding: 1.1em 0 1em;font-size: 1.6rem;}
    .quick ul li a span::after{width:20px; height:19px;}

    .notice{padding: 1.2em 1.4em;}
    .notice .tit h3{font-size: 2.2rem;}
    .notice ul li{width:100%; padding:0; border:none;}
    .notice ul li:first-child{border:none;}
    .notice ul li:last-child{display:none;}
    .notice ul a h4{font-size: 1.8rem;}
    .notice ul a p.txt{font-size:1.6rem;}
    .notice ul a p.date{font-size:1.4rem;}

    .guide{font-size:1.4rem;}
    .guide div h4::after{width: 16px;height: 16px;top: 0;transform: none;}
}

@media (max-width:860px){
    .cont-wrap{height: auto;width:100%;}
    .cont-wrap > div{margin-bottom:1.5em;}
    .cont-wrap .big2{display:flex;}
    .cont-wrap .big2 div:first-child{margin-bottom:0;}
    .cont-wrap .big2 div{width:49%;}
    .cont-wrap .big2 div:first-child a{background: url(/ssc/images/main/btn_big2_img1.png) no-repeat top 12px right 40px / 60px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right / 48px, url(/ssc/images/main/btn_big2_bg.png) no-repeat center / 100% 100%;}
    .cont-wrap .big2 div:last-child a{background: url(/ssc/images/main/btn_big2_img2.png) no-repeat top 12px right 40px / 60px, url(/ssc/images/main/btn_big2_arrow.png) no-repeat bottom right / 48px, url(/ssc/images/main/btn_big2_bg2.png) no-repeat center / 100% 100%;}
    .cont-wrap .big2 div a h4 br{display:block;}
    
    .quick ul li{width:49%}

    .notice ul li{width: 50%;}
    .notice ul li:first-child{border-right: 1px solid #eee;}
    .notice ul li:last-child{display:block;}
}

@media (max-width:768px){
    .guide div h4{line-height: 1.4em;padding-left:2em;}
    .guide div p{line-height:1.4em;}
}
        
@media (max-width:600px){
    .cont-wrap .big2{display:block;}
    .cont-wrap .big2 div{width:100%;}
    .cont-wrap .big2 div:first-child a{margin-bottom:1em;}
    .cont-wrap .big2 div a p{max-width: 175px;}

    .notice ul{display:block;}
    .notice ul li{width:100%;}
    .notice ul li:first-child{border-right:none;margin-bottom: 1.5em;padding-right:0px;padding-bottom: 1.5em;border-bottom: 1px solid #eee;}
    .notice ul li:last-child{padding-left:0}
    .notice ul a{display:flex;flex-wrap:wrap;justify-content: space-between;}
    .notice ul a h4{width:100%; margin-bottom:0.6em;}
    .notice ul a p.txt{margin:0; width:calc(100% - 70px);}
    
}
@media (max-width:480px){
    .guide div{display:block;}
    .guide div h4{line-height: 1.6em;}
}


/* 프로그램 */
.program-wrap{overflow: hidden;height: 713px;width: 191px;width: 14em;padding: 2em 1em;position: relative;}
.programSlide{height: 654px;height: 40.5em;overflow: hidden;}
.program-wrap ul li{border-radius:10px;box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);display:block;background-repeat:no-repeat;background-size:100% 100%;}
.program-wrap ul li a{display: flex;text-align:center;justify-content: center;align-items: center;width: 100%;height: 100%;overflow:hidden;padding: 0.5em;flex-wrap: wrap;align-content: center;transition: all 0.5s ease;}
.program-wrap ul li a::after{display:block;content:"";width:100%;height:100%;background:rgba(0, 0, 0, 0.5);position:absolute;top:0px;left:0px;z-index:1;border-radius: 10px; transition:all 0.3s;}
.program-wrap ul li a:hover::after{background:rgba(0, 0, 0, 0.8);}
.program-wrap ul li.p01{background-image:url(/ssc/images/main/program_img07.png)}
.program-wrap ul li.p02{background-image:url(/ssc/images/main/program_img10.png)}
.program-wrap ul li.p03{background-image:url(/ssc/images/main/program_img03.png)}
.program-wrap ul li.p04{background-image:url(/ssc/images/main/program_img05.png)}
.program-wrap ul li.p05{background-image:url(/ssc/images/main/program_img01.png)}
.program-wrap ul li.p06{background-image:url(/ssc/images/main/program_img04.png)}
.program-wrap ul li.p07{background-image:url(/ssc/images/main/program_img02.png)}
.program-wrap ul li.p08{background-image:url(/ssc/images/main/program_img06.png)}
.program-wrap ul li.p09{background-image:url(/ssc/images/main/program_img06.png)}
.program-wrap ul li.p10{background-image:url(/ssc/images/main/program_img08.png)}
.program-wrap ul li.p11{background-image:url(/ssc/images/main/program_img13.png)}
.program-wrap ul li.p12{background-image:url(/ssc/images/main/program_img09.png)}
.program-wrap ul li.p13{background-image:url(/ssc/images/main/program_img12.png)}
.program-wrap ul li.p14{background-image:url(/ssc/images/main/program_img11.png)}
.program-wrap ul li h4{z-index: 2;font-size:2.4rem;font-weight:600;color:#fff;word-break: keep-all;transition: all 0.5s ease;}
.program-wrap ul li a:hover h4{color:#fff59f; margin-bottom:0.8em; }
.program-wrap ul li p{/* display:none; */ width:100%; line-height:1.5em; transition: all 0.5s ease; opacity:0; position:absolute;}
.program-wrap ul li a:hover p{display:block; color:#fff; z-index:2; opacity:1; position:static;}
.program-wrap .control-box button{display: block;width: 1.75em;height: 1.06em;position: absolute;}
.program-wrap .control-box button.prevb{background: url(/ssc/images/main/program_up.png) no-repeat center / 100%;top: 0px;left: 50%;transform: translateX(-50%);}
.program-wrap .control-box button.nextb{background: url(/ssc/images/main/program_down.png) no-repeat center / 100%;bottom: 0px;left: 50%;transform: translateX(-50%);}
.program-wrap .control-box button i{font-size:0rem;color:transparent;}

@media (max-width:1600px){
    .program-wrap{margin-top: 3em;width:100%;padding: 1em 4em;height: 240px;}
    .programSlide{height:auto;}
    .program-wrap ul li a{height:191px;}
    .program-wrap .control-box button.prevb{top:50%;left: 0px;transform: translateX(0) translateY(-50%) rotate(-90deg);}
    .program-wrap .control-box button.nextb{top:50%;right:0px;left: auto;transform: translateX(0) translateY(-50%) rotate(-90deg);}
}