@charset "utf-8";


.wrap{max-width: 160rem;}
#container{padding-bottom: 0;}
#header.on,
body:has(#lnb) #header{border-bottom: 0;}

@keyframes fadeUp{
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 10rem, 0);
        transform: translate3d(0, 10rem, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
.fadeUp{opacity: 0;}
.fp-completely .fadeUp{animation-name: fadeUp;animation-duration: 0.7s;animation-play-state: running;animation-fill-mode: forwards;}
[data-aos]{opacity: 1;}
[data-aos=fade-up] {transform: translate3d(0, 0, 0); opacity:1;}

.main_content .section{padding-top: 7rem;}
.main_content .section .con_tit{font-size: 5.6rem; color: #fff; line-height: normal; text-align: center;}
.main_content .section .sm_con_tit{font-size: 2.8rem; color: #97AAF5; display: block; font-weight: 700; text-align: center; text-transform: uppercase; margin-bottom: 1.2rem; line-height: normal;}
.fp-overflow{overflow-y: visible !important;}

/* fp-nav */
#fp-nav{right: auto !important;left: 4rem;}
#fp-nav ul li .fp-tooltip{right: auto !important; left: 2rem; background-color: #fff; border-radius: 100rem; border: 1px solid var(--primary); color: var(--primary); font-size: 1.5rem; font-weight: 500; line-height: 1.5; padding: 0.4rem 1.2rem; font-family: 'Pretendard'; top: 50%; transform: translateY(-50%); display: none;}
#fp-nav ul li:hover .fp-tooltip,
#fp-nav ul li:has(.active) .fp-tooltip{display: block;}
#fp-nav ul li:last-of-type{display: none;}
#fp-nav ul li + li{margin-top: 4rem;}
#fp-nav ul li a{display: flex; align-items: center; justify-content: center;}
#fp-nav ul li a span{width: 0.8rem;height: 0.8rem;background: #B7B7B7;box-sizing: content-box;position: static;margin: 0;display: block;}
#fp-nav ul li:hover a span{width: 0.8rem;height: 0.8rem; margin: 0;}
#fp-nav .fp-sr-only{display: none; }
#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span{width: 0.8rem; height: 0.8rem; margin: 0 auto; background:#193EC4; border: 0.3rem solid #B7B7B7;}
#fp-nav ul li, .fp-slidesNav ul li{width: 1.4rem; height: 1.4rem; margin: 0;}

/* main_con1 */
@keyframes bganimation{
    0% {transform:scale(1.05)}
    100% {transform:scale(1)}
}
.main_con1{position: relative;}
.main_con1 .wrap{position: relative;  overflow: visible;}
.main_con1 .visual_slider{position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden;}
.main_con1 .visual_slider .swiper-slide{height: 100%; height: 100%;}
.main_con1 .visual_slider .swiper-slide::before{content:''; display:block; position:absolute; left:0; top:0; width:100%; height:100%; transform:scale(1.05);}
.main_con1 .visual_slider .bg1::before{background: url(../images/main/bg_sec01_01.png) no-repeat center / cover;}
.main_con1 .visual_slider .bg2::before{background: url(../images/main/bg_sec01_02.png) no-repeat center / cover;}
.main_con1 .visual_slider .bg3::before{background: url(../images/main/bg_sec01_03.png) no-repeat center / cover;}
.main_con1 .visual_slider .bg4::before{background: url(../images/main/bg_sec01_04.png) no-repeat center / cover;}
.main_con1 .visual_slider .bg5::before{background: url(../images/main/bg_sec01_05.png) no-repeat center / cover;}
.main_con1 .visual_slider .swiper-slide.bganimation::before{animation: bganimation 5s;}
.main_con1 .wrap{position: relative;z-index: 99;height: 60rem;display: flex;justify-content: space-between;align-items: center;}
.main_con1 .con_tit{font-size: 8.8rem !important; color: #fff; font-weight: 700; text-transform: uppercase; line-height: normal; text-align: left !important; transition: padding 0.4s; height: 10.5rem; padding-top: 10.5rem; overflow: hidden; transition-delay: 0.2s;}
.main_con1 .con_tit + p{font-size: 3.2rem; color: #fff; font-weight: 500; margin-top: 2rem; height: 4.64rem; padding-top: 4.63rem; overflow: hidden; transition: padding 0.4s;  transition-delay: 0.4s;}
.main_con1.fp-completely .con_tit,
.main_con1.fp-completely .con_tit + p{padding-top: 0;}

.main_con1 .utils{display: flex;align-items: center;margin-top: 13rem;animation-delay: 0.4s;margin-bottom: 2rem;}
.main_con1 .utils .btn_control{display: inline-block; width: 2.4rem; height: 2.4rem; background: url(../images/icon/ico_pause.svg) no-repeat center; margin-left: 2.4rem;}
.visual_pagination{display: inline-block; width: auto !important;}
.main_con1 .utils .btn_control.play{background: url(../images/icon/ico_play.svg) no-repeat center;}
.main_con1 .visual_pagination .swiper-pagination-bullet{width: 12rem; height: 0.6rem; border-radius: 100rem; background: rgba(255,255,255,0.5); position: relative; opacity: 1 !important;}
.main_con1 .visual_pagination .swiper-pagination-bullet::after {content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;border-radius: 100rem;background: #193EC4;transform: scaleX(0);transform-origin: left;
}
.main_con1 .visual_pagination .swiper-pagination-bullet-active::after {animation: bulletProgress 4s linear forwards;}
.main_con1 .visual_pagination .swiper-pagination-bullet-active.stop::after{display: none;}
.main_con1 .visual_pagination .swiper-pagination-bullet.done::after{transform: scaleX(1);}
@keyframes bulletProgress {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}

.main_con1 .intro_box{width: 41.6rem;border-radius: 1.6rem;background: rgba(255, 255, 255, 0.20);backdrop-filter: blur(1rem);padding: 3.2rem;border: 1px solid #FFF;}
.intro_box.fadeUp {}
.main_con1 .intro_box .img_area{height: 23.5rem; border-radius: 1.6rem; overflow: hidden; margin-bottom: 2.4rem;}
.main_con1 .intro_box .img_area img{display: block; object-fit: cover; width: 100%; height: 100%;}
.main_con1 .intro_box strong{font-size: 3.2rem; color: #fff; margin-bottom: 1.4rem; display: block; line-height: 1.2;}
.main_con1 .intro_box p{font-size: 1.5rem; font-weight: 500; line-height: 1.5; color: #fff; margin-bottom: 2.4rem;}
.main_con1 .intro_box:not(.active) p{ text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;}
.main_con1 .intro_box  .btn_more{display: inline-block; border-radius: 100rem; padding: 1rem 2rem; background: rgba(44, 46, 65, 0.70); color: #fff; font-size: 1.5rem; font-weight: 700; line-height: 1.2;}
.main_con1 .intro_box  .btn_more::after{content: '';display: inline-block;width: 1.6rem;height: 1.6rem;background: url(../images/icon/ico_arrow_more.svg) no-repeat center;margin-left: 0.8rem;vertical-align: -0.2rem;transition: all 0.15s;float: right;}
.main_con1 .intro_box  .btn_more:hover{background: rgba(44, 46, 65, 0.85);}
.main_con1 .intro_box.active .btn_more::after{transform: rotate(180deg);}

/* main_con2 */
.main_con2{background: url(../images/main/bg_sec02.png) no-repeat center / cover;}
.main_con2 .con_tit{margin-bottom: 4rem;}

.main_con2 .org_list{}
.main_con2 .org_list ul{display: flex; gap: 0 3.2rem; }
.main_con2 .org_list ul li{flex:1; height: 46rem; border-radius: 2.4rem; position: relative; overflow: hidden;}
.main_con2 .org_list ul li{opacity: 1;}
.main_con2 .org_list ul li.yongsan{background: url(../images/main/img_sec02_01.png) no-repeat center / cover; animation-delay: 0.4s;}
.main_con2 .org_list ul li.chungbuk{background: url(../images/main/img_sec02_02.png) no-repeat center / cover; animation-delay: 0.5s;}
.main_con2 .org_list ul li.deagu{background: url(../images/main/img_sec02_03.png) no-repeat center / cover; animation-delay: 0.6s;}
.main_con2 .org_list ul li a{display: block; width: 100%; height: 100%; position: relative;}
.main_con2 .org_list ul li a::after{background-color: var(--primary); opacity: 0.8; content: ''; display: block; width: 100%; height: 100%; transition: all 0.2s; opacity: 0; position: absolute; left: 0; top: 0;}
.main_con2 .org_list ul li .txt_area{position: absolute;left: 0;bottom: 0;width: 100%;height: 22.1rem;padding:4rem;padding-top: 10.7rem;z-index: 9;}
.main_con2 .org_list ul li.yongsan .txt_area{background: url(../images/main/bg_sec02_01.png) no-repeat center bottom -0.1rem/ 51.2rem;}
.main_con2 .org_list ul li.chungbuk .txt_area{background: url(../images/main/bg_sec02_02.png) no-repeat center bottom / 51.2rem;}
.main_con2 .org_list ul li.deagu .txt_area{background: url(../images/main/bg_sec02_03.png) no-repeat center bottom / 51.2rem;}
.main_con2 .org_list ul li .txt_area span{display: block; font-size: 2rem;color: var(--primary); font-weight: 700; line-height: 1.6; text-transform: uppercase;}
.main_con2 .org_list ul li .txt_area strong{font-size: 3.2rem; line-height: 1.6; font-weight: 500;}
.main_con2 .org_list ul li .txt_area strong::after{content: ''; display: inline-block; width: 10rem; height: 2rem; background: url(../images/icon/ico_arrow.svg) no-repeat center; margin-left: 0rem; opacity: 0; transition: all 0.2s;}

.main_con2 .org_list ul li a:hover::after{opacity: 0.8;}
.main_con2 .org_list ul li a:hover .txt_area{background: transparent; backdrop-filter: none;}
.main_con2 .org_list ul li a:hover .txt_area span,
.main_con2 .org_list ul li a:hover .txt_area strong{color: #fff;}
.main_con2 .org_list ul li a:hover .txt_area strong::after{margin-left: 2rem; opacity: 1;}


/* main_con3 */
/* .main_con3 .fp-overflow{overflow: hidden;} */
.main_con3{background: #FFF; background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(231, 234, 245, 1) 100%); }
.main_con3 .wrap{position: relative;}
.main_con3 .flexbox{display: flex;justify-content: space-between;margin-bottom: 6.4rem;}
.main_con3 .sm_con_tit{text-align: left !important; color: #193EC4 !important;}
.main_con3 .con_tit{color: #000 !important; text-align: left !important;}
.main_con3 .right{display: flex;align-items: flex-end;gap: 0 1.6rem;margin-right: 8.8rem;animation-delay: 0.4s;}
.main_con3 .right button,
.main_con3 .btn_more{display: inline-block; width: 7.2rem; height: 7.2rem; border-radius: 100rem; border: 1px solid #CDD2D7; background-color: #fff; transition: all 0.1s; animation-delay: 0.2s;}
.main_con3 .right .btn_recent_prev{background:#fff url(../images/icon/ico_prev.svg) no-repeat center;}
.main_con3 .right .btn_recent_next{background:#fff url(../images/icon/ico_next.svg) no-repeat center;}
.main_con3 .right button:hover{background-color: #f1f1f1;}
.main_con3 .btn_more:hover{background-color: #d4d4d4;}

.main_con3 .tab_menu{position: absolute;top: -12.5rem;left:30rem;display: flex;gap: 0 1rem;}
.main_con3 .tab_menu li{}
.main_con3 .tab_menu li button{line-height: 1.3; font-size: 2rem; color: #878D96; font-weight: 600; border-radius: 100rem; background: #fff; border: 1px solid #CDD2D7; padding: 1.2rem 2.2rem;}
.main_con3 .tab_menu li button.on{background-color: #001C83; color: #fff !important; border-color: #001C83;}
.main_con3 .tab_menu li button:hover{color: #001C83;}
.main_con3 .tab{position: relative;}
.main_con3 .btn_more{position: absolute;right: 0;top: -13.5rem;background: #E2E2E2 url(../images/icon/ico_more.svg) no-repeat center;border-color: #E2E2E2;}

.main_con3 .tab_contWrap{animation-delay: 0.4s;min-height: 38.4rem;}
.main_con3 .recent_slider{ width: calc(100dvw - (100dvw - 160rem) / 2); overflow: hidden;}
/* .main_con3 .recent_slider .swiper-slide.swiper-slide-prev{opacity: 0;} */
.main_con3 .recent_slider .swiper-slide{width: 41.2rem; height: 38.4rem; background: #fff; border-radius: 2.4rem; border: 2px solid #fff; transition: border-color 0.1s; }
.main_con3 .recent_slider:not(.swiper-initialized)  .swiper-slide{margin-right: 2.4rem;}
.main_con3 .recent_slider .swiper-slide a{display: block;padding: 4.8rem 4rem;cursor: pointer;}
.main_con3 .recent_slider .swiper-slide .top{margin-bottom: 2.4rem; display: flex; align-items: center; gap: 0 0.8rem;}
.main_con3 .txt_area .cate{font-size: 2rem; color: #33499C; font-weight: 700; display: inline-block;}
.main_con3 .txt_area .new_icon{display: inline-block; line-height: 1; padding: 0.5rem 0.7rem 0.4rem; border-radius: 100rem; background: #193EC4; font-size: 1.5rem; font-weight: 600; color: #fff;}
.main_con3 .txt_area strong{font-size:2.4rem; font-weight:600; line-height:1.5; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;  height: 7rem; margin-bottom: 1.6rem;}
.main_con3 .txt_area p{font-size: 2rem; line-height:1.5; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;  height: 6rem; margin-bottom: 6.4rem;}
.main_con3 .txt_area .date{font-size: 1.7rem; color: #656565; line-height: 1.3;}
.main_con3 .recent_slider .swiper-slide:hover{border: 2px solid #193EC4;;}
body.fp-viewing-3 .main_con3 .fadeUp,
.main_con3.noanimation .fadeUp{ opacity: 1 !important; -webkit-transform: translate3d(0, 0, 0) !important; transform: translate3d(0, 0, 0) !important;}
.main_con3 [data-aos]{opacity: 1;}
.main_con3 [data-aos].fadeUp{opacity: 0;}
.main_con3 [data-aos=fade-up] {transform: translate3d(0, 0, 0); opacity:1;}

.fp-watermark{display: none;}

/* pc 작은화면 */
@media all and (max-width:1600px){
    #fp-nav{left: 2rem;}
    .main_con1 .con_tit{font-size: 7rem !important;}
}
@media all and (max-width:1400px){
    .main_con2 .org_list ul li .txt_area{padding-left: 2rem; padding-right: 2rem;}
    .main_con2 .org_list ul li .txt_area strong{font-size: 2.8rem;}
}
@media all and (max-width:1280px){
    .main_content .section{display: flex; flex-direction: column; justify-content: center; width: 100%; height: 100dvh;  padding-top: 0;}
    .main_con3 .recent_slider{overflow: hidden;}
    .main_con3 .recent_slider .swiper-slide{width: calc((118rem - 4rem)/3);}
}
@media all and (max-height:700px){
    .main_content .section{min-height: 75rem;}
    .main_content .main_con1{min-height: 70rem; padding-top: 10rem;}
    .main_content .main_con3{overflow: hidden;}
}

/** 반응형 **/
@media screen and (max-width: 1024px) {
    .fadeUp{opacity: 1;}
    [data-aos]{opacity: 0;}
    [data-aos=fade-up] {transform: translate3d(0, 100px, 0);}
    #container{padding-bottom: 0;}

    /* 태블릿 버전 스타일 (모바일~태블릿 공통 스타일) */
    .main_content .section{height: auto; min-height: 0; padding: 5.2rem 0; overflow: hidden;}
    .main_content .section .sm_con_tit{font-size: 1.7rem; margin-bottom: 1rem;}
    .main_content .section .con_tit{font-size: 3.2rem;}

    .main_content .main_con1{min-height: 0; padding-bottom: 8rem; position: relative; padding-top: 10.2rem;}
    .main_con1 .wrap{display: block; position: static; height: auto;}
    .main_con1 .con_tit{font-size: 3.6rem !important; font-weight: 600; height: auto; padding-top: 0;}
    .main_con1 .con_tit + p{font-size: 2rem; height: auto; padding-top: 0; margin-top: 1.2rem;}
    .main_con1 .intro_box{width: 100%;padding: 1.6rem;margin-top: 2.4rem;position: static;}
    .main_con1 .intro_box .img_area{display: none;}
    .main_con1 .intro_box p{margin-top:2rem;margin-bottom: 0;height: auto;}
    .main_con1 .intro_box p:not(.active){display: none;}
    /*.main_con1 .intro_box.active p{display: block;}*/
    .main_con1 .intro_box strong{font-size: 2rem; margin: 0;}
    .main_con1 .intro_box .btn_more{padding: 0.8rem 1.2rem;position: absolute;right: 1.6rem;top: 1.2rem;width: 8.6rem;}
    .main_con1 .intro_box.active{transform: none !important; margin-top: 2.4rem;}

    .main_con1 .utils{position: absolute;bottom: -4.5rem;margin: 0;width: calc(100% - 3.6rem);z-index: 99;}
    .visual_pagination{width: calc(100% - 2.4rem) !important; display: flex; gap: 0 0.6rem;}
    .main_con1 .visual_pagination .swiper-pagination-bullet{flex: 1; width: auto; margin: 0; height: 0.3rem;}
    .main_con1 .utils .btn_control{width: 1.6rem; height: 1.6rem; background-size: 1.6rem !important;}
    .main_con1 .visual_slider .bg1{background: url(../images/main/bg_sec01_01_mo.png) no-repeat center / cover;}
    .main_con1 .visual_slider .bg2{background: url(../images/main/bg_sec01_02_mo.png) no-repeat center / cover;}
    .main_con1 .visual_slider .bg3{background: url(../images/main/bg_sec01_03_mo.png) no-repeat center / cover;}
    .main_con1 .visual_slider .bg4{background: url(../images/main/bg_sec01_04_mo.png) no-repeat center / cover;}
    .main_con1 .visual_slider .bg5{background: url(../images/main/bg_sec01_05_mo.png) no-repeat center / cover;}


    .main_con2 .org_list ul{flex-wrap: wrap; gap: 2.4rem;}
    .main_con2 .org_list ul li{flex:none; width: calc((100% - 2.4rem) / 2);  height: auto; opacity: 0;}
    .main_con2 .org_list ul li a{padding-bottom: 90%;}
    .main_con2 .org_list ul li .txt_area{height: 100%; background-size: 100% !important; padding-top: 0;}
    .main_con2 .org_list ul li .txt_area span{font-size: 1.5rem; position: absolute; bottom: 5.5rem;}
    .main_con2 .org_list ul li .txt_area strong{font-size: 2.4rem; position: absolute; bottom: 2.4rem; height: 3rem;}
    .main_con2 .org_list ul li .txt_area strong::after{width: 6rem; background-size: 6rem;}
    .main_con2 .org_list ul li a:hover .txt_area strong::after{margin-left: 1rem;}

    .main_con3 .flexbox{align-items: flex-end;margin-bottom: 0;}
    .main_con3 .right{margin-right: 4rem; gap: 0 0.8rem;}
    .main_con3 .right button, .main_con3 .btn_more{width: 3.2rem; height: 3.2rem; background-size: 1.6rem !important;}
    .main_con3 .btn_more{top: -4.8rem;}
    .main_con3 .tab_menu{position: static;margin-top: 1.6rem;gap: 0 0.8rem;margin-bottom: 2.4rem;}
    .main_con3 .tab_menu li button{font-size: 1.7rem; padding: 1rem 2.2rem;}
    .main_con3 .recent_slider{overflow: visible; width: 100%;}
    .main_con3 .recent_slider .swiper-slide a{padding: 2.4rem;}
    .main_con3 .recent_slider .swiper-slide{width: calc((100% - 3.2rem - 3.2rem)/2); height: 28.4rem;}
    .main_con3 .recent_slider .swiper-slide.swiper-slide-prev{opacity: 1;}
    .main_con3 .img_area{height: 22.6rem;}
    .main_con3 .txt_area .cate{font-size: 1.6rem;}
    .main_con3 .txt_area strong{font-size: 2rem; height: 6rem; margin-bottom: 1.6rem;}
    .main_con3 .txt_area p{font-size: 1.6rem; height: 5rem; margin-bottom: 4rem;}
    .main_con3 .txt_area .new_icon{font-size: 1.4rem;}
    .main_con3 .txt_area .date{font-size: 1.5rem;}
    .main_con3 [data-aos^=fade][data-aos^=fade].aos-animate{opacity: 1;}
    .main_con3 [data-aos=fade-up] {transform: translate3d(0, 100px, 0); opacity:0;}
}
@media screen and (max-width: 767px) {
    /* 모바일 버전 스타일 (태블릿 대비 모바일에서 달라지는 스타일) */
    .main_con2 .org_list ul{display: block;}
    .main_con2 .org_list ul li{width: 100%;  height: auto;}
    .main_con2 .org_list ul li + li{margin-top: 2.4rem;}
    .main_con3 .recent_slider .swiper-slide{width: calc((100% - 3.2rem - 1.6rem));}
}
@media screen and (max-width: 480px) {
    /* 모바일 버전 스타일2 (모바일 작은 화면에서 달라지는 스타일) */

}


/*  */