@charset "UTF-8";

/*-------------------------------------------------------------------
적용영역 : 메인페이지
속성순서 : 레이아웃, 박스 모델, 배경, 폰트/정렬, 기타
최종변경일 : 2025.04.07
-------------------------------------------------------------------*/
#container{padding-top:0}
#main {position:relative;}

.section {padding-top: var(--sp-92); padding-bottom: var(--sp-92);}
.section-wrap {display: block; max-width: 140rem; margin: 0 auto;}
.section-wrap .title-area {display: flex;}
.section-wrap .section-title {display: block; line-height: 1; font-weight: 600; font-size: 3.6rem; font-family: 'S-CoreDream', 'Pretendard', 'Noto Sans KR', sans-serif;}
.thumb{background:#ddd url(../../../images/site/kor/common/img_noimg80.png) center no-repeat}

#main_pop{
    opacity: 0; visibility: hidden; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; position: fixed; top: 0; left: 0; width: 100%; height: 100%; padding: 0 2rem; z-index: 999; background-color: rgba(0,0,0,0.7); 
    -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
#main_pop.show{opacity: 1; visibility: visible; }
#main_pop .ins{display: inline-block; position: relative; }
#main_pop .ins >.close{
    display: block; position: absolute; top: 2rem; right: 2rem; width: 2.5rem; height: 2.5rem; background: url(../../../images/site/kor/main/popup_close.svg) no-repeat center center / 100% auto; text-indent: -9999px;
    -webkit-transform: rotate(0); transform: rotate(0);
    -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
#main_pop .ins >.close:hover{
    -webkit-transform: rotate(180deg); transform: rotate(180deg);
}
#main_pop .ins .imgs{display: block; max-width: 100%;}
#main_pop .ins .bot{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; padding: 0 0 0 2rem; background-color: #EFEFEF;}
#main_pop .ins .bot .checks{position: relative; padding-left: 24px;}
#main_pop .ins .bot .checks input{display: none;}
#main_pop .ins .bot .checks label{color: #151515; font-size: 14px; font-weight: 400; line-height: 46px; letter-spacing: -0.028rem; cursor: pointer;}
#main_pop .ins .bot .checks label:before{
    content: ""; display: block; position: absolute; top: 13px; left: 0; width: 18px; height: 18px; background-color: #fff; border: 2px solid #12629D; border-radius: 3px;
    -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
#main_pop .ins .bot .checks input:checked + label:before{background-color: #12629D;}
#main_pop .ins .bot .checks label:after{
    content: ""; opacity: 0; display: block; position: absolute; top: 13px; left: 0; width: 18px; height: 18px; background: url(../../../images/site/kor/main/popup_check.svg) no-repeat center center / 100% auto;
    -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
#main_pop .ins .bot .checks input:checked + label:after{opacity: 1;}
#main_pop .ins .bot .close{display: flex; align-items: center; justify-content: center; width: 16.5rem; height: 46px; margin-left: auto; color: #151515; font-size: 14px; font-weight: 500; letter-spacing: -0.028rem; border-left: 1px solid #DDD;}

/*-------------------------------------------------------------------
분류이름 : 비주얼 영역
분류그룹 : section-01
-------------------------------------------------------------------*/
.visual{position:relative;/* overflow:hidden; */}
.visual:after{position:absolute;left:0;top: 100%;content:"";width:100%;height:5.6rem;background: url(../../../images/site/kor/main/visual_pattern.png) left center repeat-x;z-index:1;background-size:contain;mix-blend-mode: luminosity;}
.visual_slide .swiper-slide{position:relative;overflow:hidden}
.visual_slide .swiper-slide > a{display:block;height:100%}
.visual_slide .visual_box{position: relative; height: 0 !important; min-height: auto !important; padding-top: 39%;}
.visual_slide .visual_box.t1 .bg{position:absolute;left:0;bottom:calc(50% - 4rem)}
.visual_slide .visual_box.t1 .desc{position:absolute;right:calc(50% - 4rem);top:12.4rem;}
.visual_slide .swiper-slide img:not(.bg, .desc){position: absolute; top: 0; left: 0; width:100%;height:100%;object-fit:cover}
.visual_slide .controls{display: inline-flex;flex-wrap: wrap;justify-content:flex-start;align-items: center;gap: 3.4rem;position: absolute;bottom: 4.1rem;left: 50%;z-index: 1;width: auto;height: auto;padding:1.2rem 2.2rem;background-color: rgba(0, 0, 0, 0.60);border-radius: 50px;transform: translate(-50%,0);}
.visual_slide .controls:before{content: ""; display: block; position: absolute; top: 50%; left: 50%; width: 1px; height: 1.8rem; background-color: rgba(255,255,255,0.5);transform: translateY(-50%)}
.visual_slide .controls > button{position: relative;width:3rem;height:3rem;z-index:1}
.visual_slide .controls > button.next{}
.visual_slide .controls > button:before{content:"";position:absolute;left:50%;top:50%;width:1.17rem;height:1.8rem;background:url(../../../images/site/kor/common/icon_white_prev.svg) center no-repeat;background-size:contain;transform:translate(-50%, -50%)}
.visual_slide .controls > button.next:before{background-image:url(../../../images/site/kor/common/icon_white_next.svg)}
.visual_slide .controls > button.play:before{background-image:url(../../../images/site/kor/common/icon_white_play.svg)}
.visual_slide .controls > button.play.on:before{background-image:url(../../../images/site/kor/common/icon_white_stop.svg)}

.visual_slide .videoWrapper{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.visual_slide .videoWrapper iframe{display: block; overflow: hidden; position: absolute; top: 50%; left: 50%; width: 100%; aspect-ratio: 16/9; pointer-events: none; transform: translate(-50%,-50%);}


/*-------------------------------------------------------------------
분류이름 : 섹션 공통
-------------------------------------------------------------------*/
.section .inner{max-width:141rem;margin:0 auto}
.title1{margin-bottom:4rem;font-family:'gmarket','Pretendard';font-size:3.4rem;letter-spacing:-.05rem;font-weight:700;color:#125a9b;text-align:center}
.title1 span{color:#e83641}
.title2{position:relative;font-family:'gmarket','Pretendard';margin-bottom:1rem;padding-left:3rem;font-size:2.6rem;line-height:1.4;letter-spacing:-.05rem;font-weight:500;color:#151515}
.title2:before{content:"";position:absolute;left:0;top:.7rem;width:1.7rem;height:1.7rem;background:url(../../../images/site/kor/common/bul_tit2.svg) center no-repeat;background-size:contain}
.col_wrap{display:flex;flex-wrap:wrap;position:relative;width: calc(100%  + 2.5rem);}
.col_wrap + .col_wrap{margin-top:6rem}
.col_wrap .item{position:relative;flex:1;margin-right: 2.5rem;overflow:hidden}
.col_wrap .item.last{flex:none;width:32rem;overflow:visible}
.col_wrap .shrink{flex-shrink:0}
.section .more{position:absolute;right:0;top:0;width:2.9rem;height:2.9rem;border:1px solid #222;background:#fff}
.section .more:before{content:"";position:absolute;left:55%;top:50%;transform:translate(-50%, -50%);width:1.2rem;height:1.2rem;background:url(../../../images/site/kor/common/icon_plus_black.svg) center no-repeat;transition:all .3s}
.section .more:hover:before,
.section .more:hover:after{transform:translate(-50%, -50%) rotate(180deg)}
.col_wrap .item.item1{flex:none;flex-shrink:0;width:68rem}

/*-------------------------------------------------------------------
분류이름 : 사업정보
분류그룹 : section-02
-------------------------------------------------------------------*/
#section-02{padding:9rem 0 13rem;}
#section-02 .inner{position:relative}
.vertical_tab .lst{position:relative;padding:1.35rem 0;border-left:2px solid #ddd}
.vertical_tab .lst > li + li{margin-top:2.1rem}
.vertical_tab .lst > li > a{position:relative;display:inline-block;max-width:21.8rem;padding:.5rem 0 .5rem 1.3rem;line-height:2rem;font-size:1.7rem;letter-spacing:-.16rem;font-weight:600;color:#222;transition:all .3s;vertical-align:top}
.vertical_tab .lst > li > a:hover,
.vertical_tab .lst > li > a:focus{text-decoration:underline}
.vertical_tab .lst > li.active > a{color:#125a9b}
.vertical_tab .lst > li.active > a:before{content:"";position:absolute;left:-2px;top:0;width:2px;height:100%;background:#125a9b}
.vertical_tab .lst .tab_cont{display:none;position:absolute;top:0;right:0;width:calc(100% - 22.8rem);border-radius:.6rem;overflow:hidden;z-index:1}
.vertical_tab .lst .tab_cont a{display:block;height:100%;text-align:center}
.vertical_tab .lst .tab_cont a:focus{border: 2px solid black;}
.vertical_tab .lst li.active .tab_cont{display:block;height:100%;overflow:hidden}
.vertical_tab .lst .tab_cont .img{max-width:inherit}
.vertical_tab .bn{width:100%;height:100%;padding:2.6rem 3rem;letter-spacing:-.04rem}
.vertical_tab .bn .text{position:relative;max-width:23.7rem;z-index:1;text-align:left}
.vertical_tab .bn .tit{display:block;font-size:1.8rem;font-weight:700;color:#222;line-height:2.4rem}
.vertical_tab .bn .desc{margin-top:1.3rem;font-size:1.6rem;font-weight:400;color:#555;line-height:2.1rem}
.vertical_tab .bn.t1{background:#e8f0f7}
.vertical_tab .bn.t1 img{position:absolute;right:-7.7rem;top:-6.2rem}

.schedule_top{display:inline-flex;align-items:center;position:absolute;top:0;right:0;}
.schedule_top > button{position:relative;width:3rem;height:3rem;background:none}
.schedule_top > button:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:.9rem;height:1.4rem;background:url(../../../images/site/kor/common/icon_black_prev.svg) center no-repeat;background-size:contain}
.schedule_top > button.next:before{background-image:url(../../../images/site/kor/common/icon_black_next.svg)}
.schedule_top .month{flex-shrink:0;margin:0 1rem;font-size:1.9rem;font-weight:900;color:#222}
.schedule_lst.nolist{position: relative; min-height: 19.4rem; padding-top: 2.4rem; color: #222; line-height: 2.1rem; font-size: 1.8rem; font-weight: 600; text-align: center; border-radius: 0.6rem; background-color: #f5f8fb}
.schedule_lst.nolist:after{content: ""; opacity: 0.5; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:  url(../../../images/site/kor/main/img_nolist.png) no-repeat bottom center / 38rem auto; }
.schedule_lst .schedule_box{position:relative;width:24rem;min-height:19rem;padding:1.9rem;background:#f8f8f8;border-radius:.6rem;letter-spacing:-.05rem}
.schedule_lst .schedule_box.disable{background:#f5f8fb}
.schedule_lst .schedule_box:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;border:1px solid transparent;border-radius:.6rem}
.schedule_lst .schedule_box .subTitle{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;max-height:4rem;margin-bottom:1.2rem;font-size:1.6rem;color:#125a9b;line-height:2rem;font-weight:500;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.schedule_lst .schedule_box .title{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;max-height:6.1rem;color:#222;line-height:2.1rem;font-size:1.8rem;font-weight:700;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.schedule_lst .schedule_box .date{position:absolute;left:1.9rem;bottom:2rem;padding-left:3rem;font-size:1.6rem;line-height:2rem}
.schedule_lst .schedule_box .date:before{content:"";position:absolute;left:0;top:0;width:2rem;height:2rem;background:url(../../../images/site/kor/common/icon_calendar.svg) center no-repeat;background-size:contain}
.schedule_lst a:hover .schedule_box:before,
.schedule_lst a:focus .schedule_box:before{border-color:var(--color-main)}
.schedule_lst .swiper-slide{width:auto}
.schedule_lst .controls{display:none}

.work_box{display:flex}
.work_box .thumb{flex-shrink:0;width:19rem;height:19rem;overflow:hidden}
.work_box .thumb img{width:100%;height:100%;object-fit:cover}
.work_box .info{position:relative;width:calc(100% - 20rem);padding:1rem 0;margin-left:1.3rem;letter-spacing:-.04rem}
.work_box .info .title{display:-webkit-box;max-height:4.8rem;margin-bottom:1.2rem;overflow:hidden;text-overflow:ellipsis;line-height:2.4rem;font-size:1.8rem;font-weight:700;color:#222;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.work_box .info .desc{display:-webkit-box;max-height:6.3rem;overflow:hidden;text-overflow:ellipsis;font-size:1.6rem;color:#555;-webkit-line-clamp:3;-webkit-box-orient:vertical;line-height:2.1rem}
.work_box .info .date{position:absolute;left:0;bottom:.4rem;padding-left:3rem;font-size:1.6rem;line-height:2rem}
.work_box .info .date:before{content:"";position:absolute;left:0;top:0;width:2rem;height:2rem;background:url(../../../images/site/kor/common/icon_calendar.svg) center no-repeat;background-size:contain}
.work_slide .controls{display:flex;position:absolute;right:0;bottom:0;background:#fff;z-index:1}
.work_slide .controls > button{position:relative;width:2.8rem;height:2.8rem;border:1px solid #222;background:#fff}
.work_slide .controls > button:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:1.3rem;height:1.3rem;background:url(../../../images/site/kor/common/icon_barrow_prev.svg) center no-repeat;background-size:contain}
.work_slide .controls > button.next:before{background-image:url(../../../images/site/kor/common/icon_barrow_next.svg)}
.work_slide .controls .num{display:flex;align-items:center;justify-content:center;width:5.7rem;color:#222;font-size:1.6rem;font-weight:700;text-align:center}
.vdo_box{position:relative}
.vdo_box:before{content:"";position:absolute;right:-7.3rem;top:-7.6rem;width:14.5rem;height:11.2rem;background:url(../../../images/site/kor/main/bg_mugunghwa.png) center no-repeat;background-size:contain}
.vdo_box .thumb{height:19rem;border-radius:.6rem}

/*-------------------------------------------------------------------
분류이름 : 광복 80주년 기념사업
분류그룹 : section-02
-------------------------------------------------------------------*/
#section-02{}
#section-02 .col_wrap{justify-content: flex-start; align-items: stretch;}
#section-02 .col_wrap .item .item_in + .item_in{margin-top: 6rem;}


/*-------------------------------------------------------------------
분류이름 : 최신글 / 알림판 / 행사 / 정보 / SNS
분류그룹 : section-03
-------------------------------------------------------------------*/
#section-03{position:relative;padding:5.6rem 0;}
#section-03:before,
#section-03:after{content:"";position:absolute;left:0;top:0;width:100%;height:5.6rem;background:url(../../../images/site/kor/main/img_pattern_red.jpg) center repeat-x;background-size:contain}
#section-03:after{background-image:url(../../../images/site/kor/main/img_pattern_blue.jpg)}
#section-03 .section_content{padding:8rem 0 12.7rem;background:linear-gradient(180deg, #fde9ea, #e8f0f7)}
#section-03:after{top:auto;bottom:0}
#section-03 .col_wrap .item.last{width:33rem}
.row_wrap{position:relative;margin-top:6rem}

.latest{position:relative;padding-top:2.5rem;min-height:19rem;border-top:2px solid #1661ae}
.latest:before{content:"";position:absolute;left:0;top:-2px;width:3rem;height:2px;background:#e60020}
.latest > li + li{margin-top:1.6rem}
.latest > li > a{display:block;position:relative;padding:0 7.3rem 0 .7rem;font-size:1.8rem;color:#222;transition:all .3s}
.latest > li > a:before{content:"";position:absolute;left:0;top:1.2rem;width:.3rem;height:.3rem;border-radius:50%;background:#222}
.latest > li > a .title{display:block;overflow:hidden;text-overflow:ellipsis;font-weight:500;white-space:nowrap}
.latest > li > a .date{position:absolute;right:0;top:0;color:#555}
.latest > li > a:hover,
.latest > li > a:focus{color:var(--color-main);text-decoration:underline}

.events div.latest{padding: 2.4rem 3rem; border-top: 0; border-radius: 0.6rem; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.events div.latest:before{display: none;}
.events div .title2{padding-right: 3.4rem;font-size: 2.4rem;letter-spacing: -0.1rem;}
.events div.latest >strong{display: block; height: 10.8rem; margin-bottom: 2.6rem; font-family: "Gmarket Sans TTF"; font-size: 3rem; color: #fff; font-weight: 600; line-height: 1.2;}
.events div.latest >p{margin-top: 1rem; margin-bottom: 2.5rem; font-size: 1.6rem; color: #fff; line-height: 1.6; font-weight: 400;}
.events div.latest >a{
    display: inline-flex; justify-content: flex-start; align-items: center; height: 3.6rem; margin-right: 0.4rem; padding: 0 1.6rem; background-color: #115A9B; color: #fff; font-size: 1.6rem; font-weight: 600; letter-spacing: -0.016rem;
    -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.events div.latest >a:hover{background-color: #fff; color: #214687;}
.events div.latest >a:nth-child(2n){background-color: #fff; color: #214687;}
.events div.latest >a:nth-child(2n):hover{background-color: #115A9B; color: #fff;}
#section-04 .events + .row_wrap {margin-top: 2.5rem;}

.thumb_list{display:flex;width:calc(100% + 3.5rem)}
.thumb_list > li{width:calc(33.3% - 3.5rem);margin-right:3.5rem}
.thumb_list > li .thumb{width:100%;height:19rem/* padding-top:59.375% */}
.thumb_list > li .thumb img{position:absolute;top:0;max-width:inherit}
.thumb_list > li .title{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;height:4.8rem;margin-top:1.5rem;font-size:1.8rem;font-weight:500;line-height:2.4rem;letter-spacing:-.05rem;color:#222;transition:all .3s;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.thumb_list > li a:hover .title,
.thumb_list > li a:focus .title{color:var(--color-main);text-decoration:underline}

.mid_banner{display:block;width:100%;height:12.9rem;margin-top:3.1rem;padding:2.8rem 3rem;background:url(../../../images/site/kor/main/bg_mid_banner.jpg) center no-repeat;background-size:cover;border-radius:.6rem}
.mid_banner .title{font-size:2.1rem;font-family:'gmarket', 'Pretendard';font-weight:900;color:#111}
.mid_banner .arrow_txt{display:block;margin-top:1.5rem}

.arrow_txt{display:inline-block;font-size:1.8rem;color:var(--color-main);font-weight:700}
.arrow_txt:after{content:"";position:relative;top:-.1rem;display:inline-block;margin-left:1.2rem;width:1.3rem;height:1.3rem;background:url(../../../images/site/kor/common/icon_blue_right.svg) center no-repeat;background-size:contain;vertical-align:middle}
a:hover .arrow_txt:after,
a:focus .arrow_txt:after{animation:arrow_move .8s infinite linear}
@keyframes arrow_move{
    0%{left:0}
    50%{left:.3rem}
    100%{left:0}
}

.bannerZone{width:100%;height:33rem;overflow:hidden;border-radius:.6rem;background:#e7d9dd url(../../../images/site/kor/common/img_noimg80.png) center no-repeat}
.bannerZone.swiper{position:static}
.bannerZone a{display:block;height:100%}
.bannerZone .controls{display:flex;position:absolute;right:0;top:0;gap:0 .4rem}
.bannerZone .controls > button{position:relative;width:2.8rem;height:2.8rem;border:1px solid #222;background:#fff}
.bannerZone .controls > button:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:1.3rem;height:1.3rem;background:url(../../../images/site/kor/common/icon_barrow_prev.svg) center no-repeat;background-size:contain}
.bannerZone .controls > button.next:before{background-image:url(../../../images/site/kor/common/icon_barrow_next.svg)}
.bannerZone .controls > button.con_btn:before{width:1rem;height:1.2rem}
.bannerZone .controls > button.play:before{background-image:url(../../../images/site/kor/common/icon_black_play.svg)}
.bannerZone .controls > button.stop:before{background-image:url(../../../images/site/kor/common/icon_black_stop.svg)}

.info_link{display:flex;width:calc(100% + 3rem)}
.info_link .link{flex:1;margin-right:3rem}
.info_link .link_box{position:relative;height:19.4rem;padding:1.4rem 0 1.9rem 0;border-bottom:2px solid #e83641}
.info_link .link_box.type2,
.info_link .link_box.type3{border-bottom-color:#125a9b}
.info_link .link_box .title{position:relative;display:block;font-size:1.7rem;font-weight:700;color:#222;z-index:1;letter-spacing:-.07rem}
.info_link .link_box .arrow{display:block;margin-top:2rem;position:relative;width:2.9rem;height:2.9rem;border:1px solid #222;background:#fff;z-index:1}
.info_link .link_box .arrow:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:1.3rem;height:1.3rem;background:url(../../../images/site/kor/common/icon_barrow_next.svg) center no-repeat;background-size:contain}
.info_link .link_box .img{position:absolute;right:.5rem;bottom:0}
.info_link .link_box.type2 .img{height:6rem}

.sns_link{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:stretch;gap:2rem;width:100%;height: calc(100% - 4.64rem);}
.sns_link > li{width: calc((100% - 2rem) / 2); height: calc((100% - 2rem) / 2);}
.sns_link > li >a{display: block; position: relative; width: 100%; height: 100%;}
.sns_link > li .thumb{position:absolute;top:0;left:0;width:100%;height:100%}
.sns_link .sns_icon{position:absolute;left:0;top:0;width:4rem;height:4rem;border-radius:0  0 .6rem 0;background-size:cover;z-index:1}
.sns_link .sns_icon:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:1.8rem;height:1.6rem;background:url(../../../images/site/kor/common/icon_sns_ytb.svg) center no-repeat;background-size:contain}
.sns_link .sns_icon.ytb{background:#fe0032}
.sns_link .sns_icon.insta{background:linear-gradient(33deg, #5257A6 11.87%, #E2358C 34.98%, #EF6834 62.43%, #EDC768 84.1%), #F00;}
.sns_link .sns_icon.blog{background:#5ab533}
.sns_link .sns_icon.insta:before{height:1.8rem;background-image:url(../../../images/site/kor/common/icon_sns_insta.svg)}
.sns_link .sns_icon.blog:before{height:1.8rem;background-image:url(../../../images/site/kor/common/icon_sns_blog.svg)}

/*-------------------------------------------------------------------
분류이름 : 국민제안공모 / 협업제안 / 진행중인 이벤트 / 상징물 소개
분류그룹 : section-04
-------------------------------------------------------------------*/
#section-04{padding:7rem 0 13rem}
#section-04 .row_wrap{margin-top:5.5rem}
#section-04 .col_wrap .item.last{width:33rem}
#section-04 .title2{font-size: 2.4rem; letter-spacing: -0.1rem;}
.bottom_banner{display:block !important}/* 사용자 에이전트 스타일시트 상쇄 */
.bottom_banner .bb_item{position:relative;height:13.3rem;background:#e3e6f2 url(../../../images/site/kor/main/bg_bottom_banner.jpg) left center no-repeat;background-size:cover;overflow:hidden;border-radius:.6rem}
.bottom_banner .bb_item .desc{position:absolute;left:57%;top:50%;transform:translate(-50%, -50%);z-index:1}
.bottom_banner .bb_item .desc .title{display:block;font-size:2.6rem;font-family:'gmarket','Pretendard';color:#111}
.bottom_banner .bb_item > img{position:absolute}
.bottom_banner .bb_item .flower{right:0;bottom:0}
.bottom_banner .bb_item .y_80{right:11.3rem;top:50%;top:50%;transform:translateY(-50%)}

.swiper.eventZone{height:37.8rem;border-radius:.6rem;background:#eaeff6 url(../../../images/site/kor/common/img_noimg80.png) center no-repeat}
.event_wrap .pagination{margin-top:2rem}
.pagination{display:flex;justify-content:center;gap:0;width:100%;text-align:center}
.pagination button{opacity:1;margin:0 .4rem;width:1.2rem;height:1.2rem;border-radius:50%;background:#ddd}
.pagination button.on{background:var(--color-main)}

/*-------------------------------------------------------------------
분류이름 : 배너모음
분류그룹 : section-05
-------------------------------------------------------------------*/
#section-05{padding:1.5rem 0;border-top:1px solid #eee}
.bot_banner_wrap{position:relative;padding-left:24rem}
.bot_banner_wrap .title{position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:2.1rem;color:#151515;font-weight:700}
.bot_banner_wrap .controls{display:flex;position:absolute;left:10rem;top:50%;transform:translateY(-50%)}
.bot_banner_wrap .controls > button{position:relative;width:3rem;height:3rem;margin-right:.9rem;background:#aaa;border-radius:50%}
.bot_banner_wrap .controls > button:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:.8rem;height:1.3rem;background:url(../../../images/site/kor/common/icon_white_prev.svg) center no-repeat;background-size:contain}
.bot_banner_wrap .controls > button.next:before{background-image:url(../../../images/site/kor/common/icon_white_next.svg)}
.bot_banner_wrap .controls > button.con_btn:before{height:1.1rem;background-image:url(../../../images/site/kor/common/icon_white_stop.svg)}
.bot_banner_wrap .controls > button.play:before{height:1.1rem;background-image:url(../../../images/site/kor/common/icon_white_play.svg)}
.bot_banner_wrap .swiper-slide{width:auto;margin-right:5rem;text-align:center}


/*-------------------------------------------------------------------
@media
-------------------------------------------------------------------*/
@media screen and (max-width: 1920px) {
    .visual_slide .visual_box{min-height:inherit;height:76rem}
}
@media screen and (max-width: 1500px) {
    .visual_slide .visual_box.t1 .desc{height:20rem;right:auto;left:10%}
}
@media screen and (max-width: 1430px) {
    #content{padding:0}
    .visual_slide .visual_box{height:52rem}
}
@media screen and (max-width: 1380px) {
    .col_wrap .item.item1{width:61rem}
    .vertical_tab .bn.t1 img{right:-11rem}
    
    #section-04 .inner >.col_wrap >.item.last{width: calc(100% - 2rem); margin-top: 4rem;}
    .eventZone a{height: 100%; text-align: center;}
    .eventZone a img{height: 100%;}
}
@media screen and (max-width: 1300px) {
    .work_slide.swiper{padding-bottom:5rem}
    .work_slide .controls{right:auto;left:50%;transform:translateX(-50%)}
    .work_slide .controls .num{width:5rem}
    .col_wrap{width:calc(100% + 3rem)}
    .col_wrap .item{margin-right:3rem}

    .bottom_banner .bb_item{background-position:left -21rem center}
    .bottom_banner .bb_item .y_80{right:7rem;height:8rem}
    .bottom_banner .bb_item .flower{height:7rem}
    .bottom_banner .bb_item .desc{left:16rem;transform:translateY(-50%)}
    .info_link .link_box .img{height:12rem}
    .info_link .link_box.type2 .img{width:17rem;height:auto}

}
@media screen and (max-width: 1240px) {

    #section-03 .inner >.col_wrap >.item.last{width: calc(100% - 2rem); margin-top: 4rem;}
    .bannerZone a, .eventZone a{text-align: center;}
    .bannerZone a img, .eventZone a img{height: 100%;}
}
@media screen and (max-width: 1100px) {
    .schedule_top .month{margin:0 1.5rem}
    .schedule_top .month{font-size:1.7rem}
    #section-02 .col_wrap .item.item1,
    #section-02 .col_wrap .item.item2{flex:none;width:calc(100% - 2rem);margin-right:0}
    .sns_link{gap:1.5rem;}
    .sns_link > li{width:calc((100% - 4.5rem) / 4);height: auto;gap:1.5rem;}
    .sns_link > li >a{height: 0;padding-top: 80%;}
    .vertical_tab .bn .text{max-width: calc(100% - 18rem)}
    .vertical_tab .bn .tit br{display: none;}
}
@media screen and (max-width: 1024px) {
    .visual_slide .visual_box{height:47.2rem}
    .visual_slide .visual_box.t1 .bg{right:auto;bottom:auto;left:0;top:-7rem;height:20rem}
    .visual_slide .visual_box.t1 .desc{height:14.9rem;left:11rem;top:6.4rem}
    .visual_slide .controls{bottom: 2rem;padding: 1rem 1.5rem;}
    .visual_slide .controls > button:before{width: 1.04rem; height: 1.6rem;}
    .visual:after{height: 4rem;}
    .work_box .thumb{width:21rem}
    .work_box .info{width:calc(100% - 13rem)}
    .title2{padding-left:2.5rem;font-size:2.4rem}
    .title2:before{top:.5rem}

    .col_wrap{width:calc(100% + 2rem)}
    .col_wrap .item{margin-right:2rem}
    .col_wrap .item.last{width:25rem}

    .col_wrap .item.item1,
    .col_wrap .item.item2{flex:none;width:calc(100% - 2rem);margin-right:0}
    .col_wrap .item.item2{margin-top:5rem}
    .schedule_top{}
    .schedule_top .month{font-size:2.1rem}
    .schedule_lst .schedule_box{width:100%}

    #section-02{padding:8rem 0}
    #section-03{padding:3.5rem 0}
    #section-03:before,
    #section-03:after{height:3.5rem}
    #section-03 .section_content{padding:8rem 0}
    #section-04{padding:8rem 0}

    .thumb_list{width:calc(100% + 2rem)}
    .thumb_list > li{margin-right:2rem;width:calc(33.3% - 2rem)}
    .thumb_list > li .thumb{width:100%;}

    #section-03 .col_wrap.sec_link{width:100%}
    #section-03 .col_wrap.sec_link .item{width:100%;flex:none}
    #section-03 .col_wrap.sec_link .item + .item{margin-top:5rem}

    .info_link{width:100%}
    .info_link .link{margin-right:3rem}
    .info_link .link:last-child{margin-right:0}
}
@media screen and (max-width:900px){
    .bottom_banner .bb_item{background-position:left -27rem center}
    .bottom_banner .bb_item .flower{height:5rem}
    .bottom_banner .bb_item .y_80{right:3rem}
    .bottom_banner .bb_item .desc{left:11rem}
    .bottom_banner .bb_item .desc .title{font-size:2.3rem;letter-spacing:-.1rem}
}
@media screen and (max-width: 860px){
    #section-04 .events.col_wrap .item{flex: none; width: calc(100% - 2rem);}
    #section-04 .events.col_wrap .item + .item{margin-top: 2.5rem;}
    .events div.latest >strong{height: auto; min-height: 8rem;}
    .events div.latest >strong br{display: none;}
}
@media screen and (max-width: 840px){
    #section-04 .row_wrap{margin-top:4rem}
    #section-04 .col_wrap .item.last{width:calc(100% - 2rem);margin-top:4rem}

    .bannerZone,
    .swiper.eventZone{height:auto}
    .bannerZone a,
    .eventZone a{position: relative;height: 0;padding-top: 100%;text-align: center;}
    .bannerZone a img, .eventZone a img{height: auto;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}


    .vertical_tab .bn .text{max-width: calc(100% - 10rem)}
}
@media screen and (max-width: 768px){    

    #section-02,
    #section-03 .section_content,
    #section-04{padding:5rem 0}

    #section-02{padding: 6rem 0 5rem;}

    .vertical_tab .bn.t1 img{right:-14rem;width:25rem}
    .col_wrap + .col_wrap,
    #section-03 .col_wrap.sec_link .item + .item{margin-top:4rem}
    .col_wrap.sec2_col3 .last{width:calc(100% - 2rem);margin-top:4rem}
    .work_box{flex-direction:column}
    .work_box .thumb{position:relative;width:100%;padding-top:68.079%}
    .work_box .info{width:100%;margin-left:0}
    .work_box .info .desc{max-height:4.2rem;-webkit-line-clamp:2;}
    .work_box .info .date{display:block;position:relative;bottom:auto;margin-top:1.5rem}
    .work_slide.swiper{padding-bottom:3.5rem}
    .vdo_box .thumb{position:relative;padding-top:59.375%}
    .work_box .thumb > img,
    .vdo_box .thumb > img{position:absolute;left:0;top:0;width:100%;height:100%}
    .vdo_box .thumb::before{z-index:2}
    .sns_link > li >a{padding-top: 85%;}

    .thumb_list > li .thumb{width:100%;height:0;padding-top:59.375%}



    #section-03 .col_wrap .item.last{width:calc(100% - 2rem);margin-top:4rem}
    .info_link .link{margin-right:2rem}
    .info_link .link_box .img{height:12rem}
}
@media screen and (max-width: 640px){
    #main_pop .ins .bot .close{width: 11rem;}

    .visual_slide .controls{bottom: 2rem; padding: 0.5rem 1.2rem; gap: 1.6rem;}

    .vertical_tab{height:33rem}
    .vertical_tab .lst{display:flex;flex-wrap:wrap;padding:0;border-left:0}
    .vertical_tab .lst > li{width:50%}
    .vertical_tab .lst > li + li{margin-top:0}
    .vertical_tab .lst > li > a{max-width:inherit;width:100%;padding:1.2rem 0;font-size:1.6rem;text-align:center;border-bottom:2px solid #ddd}
    .vertical_tab .lst > li.active > a{border-bottom-color:var(--color-main)}
    .vertical_tab .lst > li > a:hover,
    .vertical_tab .lst > li > a:focus,
    .vertical_tab .lst > li.active > a{text-decoration:none}
    .vertical_tab .lst > li.active > a:before{display:none}
    .vertical_tab .lst .tab_cont{width:100%;right:auto;left:0}
    .vertical_tab .lst .tab_cont > a{background:#f4f8fb}
    .vertical_tab .lst li.active .tab_cont{height:21rem;top:11.8rem}
    .vertical_tab .lst .tab_cont .img{max-width:inherit;height:100%}
    .visual:after{height: 4rem;}
    .visual_slide .visual_box{height:auto}
    .visual_slide .visual_box.t1 .desc{top:4rem;height:12rem}
    .schedule_lst .schedule_box{width:26rem;height:17rem;min-height:inherit}
    .sns_link{gap: 1.25rem;}
    .sns_link > li{width: calc((100% - 1.25rem) / 2);}
    .sns_link > li >a{padding-top: 85%;}

    .bot_banner_wrap{padding:0}
    .bot_banner_wrap .title{position:static;transform:none}
    .bot_banner_wrap .controls{left:auto;right:0;top:0;transform:none}

    #section-04 .events.col_wrap .item{flex: none; width: calc(100% - 2rem);}
    #section-04 .events.col_wrap .item + .item{margin-top: 2.5rem;}
    .events div.latest >strong{font-size: 2.9rem;}
}
@media screen and (max-width:600px){
    .event_wrap .pagination{padding-top:0;margin-top:3rem}
}
@media screen and (max-width: 500px){
    .visual_slide .visual_box.t1 .desc{height:9rem}
    .visual_slide .visual_box{padding-top: 220px;}
    .visual_slide .visual_box.t1 img:not(.bg, .desc){width: auto;height: 100%;max-width: none;object-fit: unset;}

    .col_wrap.sec2_col3{width:100%}
    .col_wrap.sec2_col3 .item{width:100%;flex:none}

    /*.sns_link{width:calc(100% + 2rem)}
    .sns_link > li{margin-right:2rem}
    .sns_link > li .thumb{height:auto;padding-top:100%}
    .sns_link > li .thumb img{position:absolute;top:0}
    .sns_link > li:first-child{width:100%;margin-bottom:2rem}
    .sns_link > li:first-child .thumb{padding-top:71.428%}*/

    .col_wrap.latest_wrap{width:100%}
    .col_wrap.latest_wrap .item{flex:none;width:100%;margin-right:0}
    .col_wrap.latest_wrap .item + .item,
    .col_wrap.sec2_col3 .item + .item{margin-top:4rem}
    .latest{min-height:inherit}

    .bottom_banner .bb_item .desc{left:5rem;top:60%}
    .bottom_banner .bb_item .y_80{height:6rem}

    #section-04 .events.col_wrap .item{width: 100%;}

    .bannerZone a,
    .eventZone a{padding-top: 100%;}
}
@media screen and (max-width: 450px){
    .thumb_list{flex-wrap:wrap;width:100%;gap:3rem 0}
    .thumb_list > li{width:100%;margin:0}
}
@media screen and (max-width: 400px){
    .visual_slide .videoWrapper iframe{min-width: 100%; width: auto; height: 100%;}

    .info_link .link_box .img{height:10rem}
    .bot_banner_wrap .swiper-slide{margin:0}
}
