@charset "UTF-8";

#main-container .inner { width:1380px; margin:0 auto; }

#main-visual { position:relative; width:100%; height:777px; border-bottom:1px solid #dcdcdc; overflow: hidden; }
#main-visual .visual-slide { position:relative; width:100%; height:100% ;}
#main-visual .visual-slide .column-bg { display:flex; width:100%; height:100%; position:absolute; left:0; top:0; }
#main-visual .visual-slide .column-bg div { width:20%; height:100%; border-right:1px solid #fff; background-color:rgba(255,255,255,0.5); box-sizing: border-box; }
#main-visual .visual-slide .column-bg div:last-of-type { border-right:0; }
#main-visual .visual-slide .slide-bg { position:absolute; z-index:-1; width:100%; height:100%; background-position:center; background-repeat:no-repeat; }
#main-visual .visual-slide .slide-bg.bg01 { background-image:url(../images/bg01.jpg); }
#main-visual .visual-slide .slide-bg.bg02 { background-image:url(../images/bg02.jpg); }
#main-visual .visual-slide .slide-bg.bg03 { background-image:url(../images/bg03.jpg); }
#main-visual .visual-slide .slide-bg.bg04 { background-image:url(../images/bg04.jpg); }
#main-visual .visual-slide .slide-bg.bg05 { background-image:url(../images/bg05.jpg); }
#main-visual .visual-slide .visual-title { position:absolute; z-index:2; top:100px; left:50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); font-family: 'Makgeolli', 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; letter-spacing: -0.025em; width:100%; }

#main-visual .visual-slide .visual-title p.s-tit { font-size:3em; text-align: center; color:#9d292c; }
#main-visual .visual-slide .visual-title p.tit { font-size:5.5em; text-align: center; }
#main-visual .visual-slide .mbox { display:none; position:absolute; z-index: 3; left:0; bottom:0; align-items: center; justify-content: center; width:100%; height:110px; background-color: rgba(20,115,181,0.85); }
#main-visual .visual-slide .mbox .box {  width:100%; }
#main-visual .visual-slide .mbox .box em { font-family: 'NanumMyeongjoYetHangul', 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; font-weight:bold; text-align: center; display:block; font-size:1em; letter-spacing: -0.025em; color:#fff; }
#main-visual .visual-slide .mbox .box span { display:block; width:30px; height:2px; background-color:#fff; border-radius:3px; margin:15px auto; }
#main-visual .visual-slide .mbox .box p { text-align: center; letter-spacing: -0.025em; font-weight:300; font-size:0.9em; color:#fff;}

#main-visual .visual-slide .visual-nav { position:absolute; display:flex; z-index:3; left:50%; top:300px; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); }
#main-visual .visual-slide .visual-nav a.visual-prev,
#main-visual .visual-slide .visual-nav a.visual-autocontrol,
#main-visual .visual-slide .visual-nav a.visual-next { display:block; background-position:center; background-repeat:no-repeat; text-indent:-9999em; font-size:0; width:46px; height:46px; background-color:rgba(0,0,0,0.4); border-radius:50%; }
#main-visual .visual-slide .visual-nav a.visual-autocontrol { margin:0 10px; background-image:url(../images/auto_stop.png);}
#main-visual .visual-slide .visual-nav a.visual-autocontrol.stop { background-image:url(../images/auto_play.png); }
#main-visual .visual-slide .visual-nav a.visual-prev { background-image:url(../images/visual_prev.png); }
#main-visual .visual-slide .visual-nav a.visual-next { background-image:url(../images/visual_next.png); }

#main-visual .visual-paging { position:absolute; z-index: 3; left:0; bottom:0; width:100%; }
#main-visual .visual-paging ul { display:flex; }
#main-visual .visual-paging ul li { width:calc(20% - 1px); margin-left:1px; }
#main-visual .visual-paging ul li:first-child { margin-left:0; }
#main-visual .visual-paging ul li a { display:flex; align-items: center; justify-content: center; width:100%; height:312px; background-color:rgba(20,115,181,0); transition: all 0.5s; }
#main-visual .visual-paging ul li a em { font-family: 'NanumMyeongjoYetHangul', 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; font-weight:bold; text-align: center; display:block; font-size:2em; letter-spacing: -0.025em; }
#main-visual .visual-paging ul li a span { display:block; width:60px; height:2px; background-color:#515151; margin:30px auto; }
#main-visual .visual-paging ul li a p { text-align: center; letter-spacing: -0.025em; font-weight:300; font-size:1.2em; }
#main-visual .visual-paging ul li.active a { background-color:rgba(20,115,181,0.85); transition: all 0.5s; box-shadow:0 0 25px rgba(0,0,0,0.5)  }
#main-visual .visual-paging ul li.active a em { color:#fff; }
#main-visual .visual-paging ul li.active a span { background-color:#fff }
#main-visual .visual-paging ul li.active a p { color:#fff; }


#main-infobar { width:100%; height:114px; border-bottom:1px solid #dcdcdc; background-color:#fff; }
#main-infobar .flex-wrap { display:flex; align-items: center; justify-content:space-between; height:114px; }
#main-infobar .flex-wrap .info { display:flex; align-items: center; }
#main-infobar .flex-wrap .info h2.infotit { display:flex; align-items: center; font-size:1.5em; letter-spacing: -0.025em; font-weight:600; }
#main-infobar .flex-wrap .info h2.infotit::before { content:""; display:block; width:30px; height:30px; background-image:url(../images/ico_info.png); background-position:center; background-repeat:no-repeat; margin-right:10px;}
#main-infobar .flex-wrap .info .info-list { margin-left:25px;}
#main-infobar .flex-wrap .info .info-list ul { display:flex; align-items: center; }
#main-infobar .flex-wrap .info .info-list ul li { font-size:1.25em; letter-spacing: -0.025em; font-weight:300; margin-right:20px; padding-right:20px; border-right:1px solid #ddd;}
#main-infobar .flex-wrap .info .info-list ul li:last-child { margin-right:0; padding-right:0; border-right:0; }
#main-infobar .flex-wrap .info .info-list ul li strong { font-weight:600; }
#main-infobar .flex-wrap a.loc-link { display:flex; align-items: center; font-weight:500; font-size:1.25em; letter-spacing: -0.025em; }
#main-infobar .flex-wrap a.loc-link::after { content:"→"; display:flex; align-items: center; justify-content: center; width:50px; height:50px; margin-left:10px; border-radius:50%; background-color:#565656; color:#fff; }
#main-infobar .flex-wrap a.loc-link:hover::after { background-color:#000; }

#section01 { position:relative; padding:100px 0; overflow: hidden; background-color:#f4f4f4; }
#section01::before { content:""; position:absolute; left:-50px; top:-300px; display:block; width:610px; height:879px; background-image:url(../images/section01_bg01.png); background-repeat:no-repeat; }
#section01::after { content:""; position:absolute; right:-90px; bottom:-50px; display:block; width:463px; height:707px; background-image:url(../images/section01_bg02.png); background-repeat:no-repeat; }
#section01 .inner { position:relative; z-index:4; }
#section01 .main-notice { height:134px; padding:0 50px; box-sizing: border-box; width:100%; background-color:#fff; margin-bottom:35px; }
#section01 .main-notice .flex-wrap { display:flex; height:134px; align-items: center; justify-content: space-between; }
#section01 .main-notice h2.notice-tit { display:flex; align-items: center; font-size:1.5em; letter-spacing: -0.025em; font-weight:600; line-height:1;}
#section01 .main-notice h2.notice-tit::before { content:""; display:block; width:28px; height:27px; background-image:url(../images/ico_notice.png); background-position:center; background-repeat:no-repeat; margin-right:10px; }
#section01 .main-notice .notice-slide { width:920px; height:35px; overflow: hidden; }
#section01 .main-notice .notice-slide .swiper-slide a { display:flex; align-items: center; justify-content: space-between; height:35px;}
#section01 .main-notice .notice-slide .swiper-slide a p { font-size:1.2em; font-weight:300; letter-spacing: -0.025em; width:calc(100% - 150px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
#section01 .main-notice .notice-slide .swiper-slide a span.date { display:flex; height:35px; align-items: center; font-size:1.1em; color:#888; padding-left:35px; border-left:1px solid #ddd; width:130px; box-sizing: border-box; }
#section01 .main-notice a.notice-more { display:block; width:45px; height:45px; background-color:#fff; border-radius:50%; border:1px solid #ddd; font-size:0; text-indent:-99999em; background-image:url(../images/notice_more.png); background-repeat:no-repeat; background-position:center; }

#section01 .lr-wrap { display:flex; justify-content: space-between; align-items: center; }
#section01 .quick-links { width:calc(100% - 705px); height:480px; box-sizing: border-box; }
#section01 .quick-links ul { display:flex; flex-wrap:wrap; }
#section01 .quick-links ul li { margin:27.5px 42.5px; }
#section01 .quick-links ul li a { display:block; }
#section01 .quick-links ul li a i { display:block; width:140px; height:140px; border-radius:50%; background-color:#fff; background-position:center; background-repeat:no-repeat; }
#section01 .quick-links ul li:nth-child(1) a i { background-image:url(../images/quick_ico01.png); } 
#section01 .quick-links ul li:nth-child(2) a i { background-image:url(../images/quick_ico02.png); } 
#section01 .quick-links ul li:nth-child(3) a i { background-image:url(../images/quick_ico03.png); } 
#section01 .quick-links ul li:nth-child(4) a i { background-image:url(../images/quick_ico04.png); } 
#section01 .quick-links ul li:nth-child(5) a i { background-image:url(../images/quick_ico05.png); } 
#section01 .quick-links ul li:nth-child(6) a i { background-image:url(../images/quick_ico06.png); } 
#section01 .quick-links ul li a p { text-align: center; font-size:1.2em; height:20px; letter-spacing: -0.025em; margin-top:25px;}

#section01 .popup-zone { width:655px; height:480px; margin-left:50px; overflow: hidden; }
#section01 .popup-zone .popupzone-slide { height:412px; }
#section01 .popup-zone .swiper-slide a { display:block; width:100%; height:100%; position:relative }
#section01 .popup-zone .swiper-slide .nolink { display:block; width:100%; height:100%; position:relative }
#section01 .popup-zone .swiper-slide .img-wrap { position:relative; width:100%; padding-top:calc(412 / 655 * 100%);}
#section01 .popup-zone .swiper-slide .img-wrap img { position:absolute; width:100%; height:100%; left:0; top:0; }
#section01 .popup-zone .popupzone-box { display:flex; align-items: center; justify-content: space-between; width:100%; height:68px; padding:15px 25px; box-sizing: border-box; background-color:#454545 }
#section01 .popup-zone .popupzone-box p.popupzone-tit { color:#fff; letter-spacing: -0.025em; font-weight:500; font-size:1.1em;}
#section01 .popup-zone .popupzone-box .popupzone-controls { display:flex; align-items: center; }
#section01 .popup-zone .popupzone-box .popupzone-controls a.popupzone-prev { display:block; width:19px; height:14px; background-image:url(../images/popup_prev.png); background-repeat:no-repeat; font-size:0; text-indent:-99999em; }
#section01 .popup-zone .popupzone-box .popupzone-controls a.popupzone-next { display:block; width:19px; height:14px; background-image:url(../images/popup_next.png); background-repeat:no-repeat; font-size:0; text-indent:-99999em; }
#section01 .popup-zone .popupzone-box .popupzone-controls .popupzone-utils { display:flex; align-items: center; margin:0 20px; }
#section01 .popup-zone .popupzone-box .popupzone-controls .popupzone-utils .popupzone-pagination { font-family: 'S-CoreDream','Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; color:#fff; font-weight:100; }
#section01 .popup-zone .popupzone-box .popupzone-controls .popupzone-utils .popupzone-pagination .swiper-pagination-current { font-weight:500; }
#section01 .popup-zone .popupzone-box .popupzone-controls .popupzone-utils .popupzone-pagination .swiper-pagination-total {  }
#section01 .popup-zone .popupzone-box .popupzone-controls .popupzone-utils a.popupzone-autocontorl { font-size:0; text-indent:-9999em; margin-left:15px; width:16px; height:15px; background-image:url(../images/popup_stop.png); background-repeat:no-repeat; background-position:center; }
#section01 .popup-zone .popupzone-box .popupzone-controls .popupzone-utils a.popupzone-autocontorl.stop { background-image:url(../images/popup_play.png); }

#section02 { position:relative; padding:100px 0; overflow: hidden; background-color:#fff; }
#section02 .inner { position:relative; z-index:4; }
#section02 .section-tit h2 { font-size:1.6em; letter-spacing: -0.025em; font-weight:600; margin-bottom:20px; }
#section02 .section-tit p.stit { font-size:1.2em; color:#555; letter-spacing: -0.025em; font-weight:300; }
#section02 a.archive-more { display:flex; align-items: center; height:40px; padding:0 20px; position:absolute; top:0; right:0; letter-spacing: -0.025em; font-size:0.95em; color:#004444; border:1px solid #dddddd; border-radius:50px; box-sizing: border-box; }
#section02 a.archive-more::after { content:""; display:block; width:12px; height:12px; background-image:url(../images/archive_more.png); background-repeat:no-repeat; margin-left:10px; }

#section02 .archive-list { margin-top:40px; }
#section02 .archive-list ul { display:flex; flex-wrap:wrap;  }
#section02 .archive-list ul li { width:calc(25% - 30px); margin-right:40px; }
#section02 .archive-list ul li:nth-child(4n) { margin-right:0; }
#section02 .archive-list ul li:nth-child(n+5) { margin-top:40px;}
#section02 .archive-list ul li a { display:block; }
#section02 .archive-list ul li .archive-thumb { position:relative; width:100%; height:100%; overflow: hidden; }
#section02 .archive-list ul li .archive-thumb.video::after { content:""; position:absolute; width:35px; height:35px; border:2px solid #fff; box-sizing: border-box; border-radius:50%; right:10px; bottom:10px; background-image:url(../images/video_play.png); background-position: center; background-repeat:no-repeat; box-shadow:0 0 8px rgba(0,0,0,0.5); }
#section02 .archive-list ul li .archive-thumb .img-wrap { position:relative; width:100%; padding-top:calc(215 / 315 * 100%); }
#section02 .archive-list ul li .archive-thumb .img-wrap img { position:absolute; left:0; top:0; width:100%; height:100%;transform: scale(1); transition: transform 0.2s; }
#section02 .archive-list ul li a:hover .archive-thumb .img-wrap img { transform: scale(1.1); }
#section02 .archive-list ul li span.cate { display:flex; align-items: center; height:30px; padding:0 25px; width:max-content; border:1px solid #ddd; background-color:#fff; border-radius:50px; box-sizing: border-box; line-height:1; margin:15px 0; }
#section02 .archive-list ul li p.subj { max-height:2.6em; height:2.6em; font-size:1.2em; line-height:1.3; font-weight:500; overflow: hidden; text-overflow: ellipsis; display:-webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }


@media all and (max-width:1380px){
    #main-container .inner { width:100%; padding:0 15px; box-sizing: border-box; }

    #main-visual { height:640px;}
    #main-visual .visual-paging ul li a { height:220px; }
    #main-visual .visual-paging ul li a em { font-size:1.5em; }
    #main-visual .visual-paging ul li a p { font-size:1em; }

    #main-visual .visual-slide .visual-title p.s-tit { font-size:2.2em; }
    #main-visual .visual-slide .visual-title p.tit { font-size:4.5em; }

    #main-visual .visual-slide .visual-nav { top:250px;}
    #main-infobar .flex-wrap .info h2.infotit { font-size: 1.3em; }
    #main-infobar .flex-wrap .info .info-list { margin-left:35px;}
    #main-infobar .flex-wrap .info .info-list ul li { font-size:1.1em; }
    #main-infobar .flex-wrap a.loc-link { font-size:1em; }
    #main-infobar .flex-wrap a.loc-link::after { width:35px; height:35px; }

    #section01 { padding:55px 0; }
    #section01 .main-notice { height:auto; padding:25px 35px; }
    #section01 .main-notice .flex-wrap { flex-wrap:wrap; height:auto; }
    #section01 .main-notice h2.notice-tit { width:100%; margin-bottom:10px; font-size:1.3em; }
    #section01 .main-notice .notice-slide { width:calc(100% - 75px); }
    #section01 .main-notice .notice-slide .swiper-slide a { height:30px; }
    #section01 .main-notice .notice-slide .swiper-slide a p { font-size:1.1em; }
    #section01 .main-notice .notice-slide .swiper-slide a span.date { height:30px; font-size:1em; }
    #section01 .main-notice a.notice-more { margin-left:28px;}

    #section01 .lr-wrap { display:block; }
    #section01 .quick-links { margin:0 auto 50px auto; width:100%; height:auto; }
    #section01 .quick-links ul li { margin:0; width:calc(100% / 6);}
    #section01 .quick-links ul li a i { margin:0 auto; }
    #section01 .quick-links ul li a p { font-size:1.1em; font-weight:500;}
    #section01 .popup-zone { margin:0 auto;}
    
    #section02 a.archive-more { right:15px;}
    #section02 .archive-list ul li { width:23.5%; margin-right:2%;}
}


@media all and (max-width:960px){

    #main-visual .visual-paging ul li a { height:180px; }
    #main-visual .visual-paging ul li a em { font-size:1.3em; }
    #main-visual .visual-paging ul li a p { font-size:0.95em; }

    #main-infobar { height:100%; }
    #main-infobar .flex-wrap { flex-wrap:wrap; height:100%; padding:20px 0; }
    #main-infobar .flex-wrap .info { width:100%; justify-content: center; flex-wrap:wrap; margin-bottom:25px;}
    #main-infobar .flex-wrap .info h2.infotit { width:100%; justify-content: center;}
    #main-infobar .flex-wrap .info .info-list { margin-left:0; margin-top:20px;}
    #main-infobar .flex-wrap .info .info-list ul li { font-size:1em; margin-right:10px; padding-right:10px; }
    #main-infobar .flex-wrap a.loc-link { width:100%; justify-content: center; }
    #main-infobar .flex-wrap a.loc-link::after { width:25px; height:25px; font-size:0.9em; }

    #section01 { padding:35px 0; }
    #section01 .quick-links { margin:0 auto 30px auto; }
    #section01 .quick-links ul li a { width:100px; margin:0 auto; }
    #section01 .quick-links ul li a i { width:100px; height:100px;}
    #section01 .quick-links ul li a p { font-size:1em; margin-top:15px; }

    #section01 .popup-zone { width:100%; height:auto; }
    #section01 .popup-zone .popupzone-slide { height:auto; }

    #section01 .main-notice { padding:20px; }
    #section01 .main-notice h2.notice-tit { font-size:1.2em; }
    #section01 .main-notice h2.notice-tit::before { width:20px; height:19px; background-size:cover;}
    #section01 .main-notice .notice-slide .swiper-slide a p { font-size:1em;}
    #section01 .main-notice a.notice-more { width:35px; height:35px; background-size:8px 15px; }
    #section01 .main-notice .notice-slide { height:25px; }
    #section01 .main-notice .notice-slide .swiper-slide a { height:25px; }
    #section01 .main-notice .notice-slide .swiper-slide a span.date { height:25px; }

    #section01 .quick-links ul li { width:calc(100% / 3); margin:2% 0; }

    #section02 { padding:35px 0;}
    #section02 .section-tit h2 { font-size:1.3em; }
    #section02 .section-tit p.stit { font-size:1em; }
    #section02 a.archive-more { height:30px; padding:0 15px; font-size:0.9em; }
    #section02 .archive-list ul li p.subj { font-size:1em;}
    #section02 .archive-list ul li span.cate { margin:10px 0; font-size:0.9em; height:25px; padding:0 15px; }

}

@media all and (max-width:768px){

    #main-visual { height:400px}
    #main-visual .visual-slide .column-bg div { border:none; }
    #main-visual .visual-slide .mbox { display:flex; }
    #main-visual .visual-slide .visual-title { top:55px; }
    #main-visual .visual-slide .visual-title p.s-tit { font-size:2em; }
    #main-visual .visual-slide .visual-title p.tit { font-size:3em; margin-top:5px;}
    #main-visual .visual-slide .visual-nav { top:175px }
    #main-visual .visual-paging { display:none; }

    #main-visual .visual-slide .visual-nav a.visual-prev, 
    #main-visual .visual-slide .visual-nav a.visual-autocontrol, 
    #main-visual .visual-slide .visual-nav a.visual-next { width:40px; height:40px; }

    #section02 .archive-list ul li { width:48%; margin-bottom:4%; margin-right:4%; }
    #section02 .archive-list ul li:nth-child(2n) { margin-right:0; }
    #section02 .archive-list ul li:nth-child(n+5) { margin-top:0; }
    #section02 .archive-list ul li:nth-child(n+7) { margin-bottom:0; }
    #section02 a.archive-more { border:none; border-radius:0; padding:0; }
}

@media all and (max-width:420px){
    #main-infobar .flex-wrap { padding:15px 0; }
    #main-infobar .flex-wrap .info .info-list ul { flex-wrap:wrap; justify-content: center; }
    #main-infobar .flex-wrap .info .info-list ul li { margin-right:0; padding-right:0; text-align: center; margin-bottom:10px; }
    #main-infobar .flex-wrap .info .info-list ul li:last-child { margin-bottom:0; }
    
    #section01 .main-notice { padding: 15px; }
    #section01 .main-notice .notice-slide { width:100%; }
    #section01 .main-notice h2.notice-tit  { font-size:1em; }
    #section01 .main-notice a.notice-more { position:absolute; top:15px; right:15px; margin:0; width:max-content; height:auto; border:none; font-size:0.9em; text-indent: 0; background-image:none; }
    #section01 .main-notice .notice-slide .swiper-slide a p { width:calc(100% - 92px); font-size:0.85em; }
    #section01 .main-notice .notice-slide .swiper-slide a span.date { width:82px; font-size:0.85em; padding-left:10px;}

}