@charset "utf-8";

/*main-header*/
#header.header-main { height:112px; }
#header.header-main h2 { position:absolute; top:23px; }
#header.header-main .logo-open { left:10px; }
#header.header-main .logo-alright { right:10px; }
#header.header-main .search-select { width:60px; height:28px; margin-right:10px; border:0; font-size:16px; color:#212121; }
#header.header-main .search-area { width:529px; margin:0 auto; }
#header.header-main .search-area .placeholder { left:96px; }
#header.header-main .search-area input { width:333px; padding-left:10px; caret-color:#06b596; }
#header.header-main .search-area a { background-image:url('../../images/images_2018/main/btn_search.png'); vertical-align:top;}
#header.header-main .search-area.alright input { caret-color:#f64a0a; }
#header.header-main .search-area.alright a { background-image:url('../../images/images_2018/main/btn_search_alright.png');}

/*main-nav*/
.nav-main { position:relative; z-index:1002; width:100%; min-width:1000px; background-color:#4162a3; border-top:1px solid #e5e5e5; letter-spacing:-1px; }
.nav-main:before, .nav-main:after { clear:both; display:table; content:''; }
.nav-main ul {  margin:0; padding:0; list-style:none; }
.nav-main .nav-wrap { width:1000px; margin:0 auto; }
.nav-main .nav-wrap > li { float:left; width:50%; }
.nav-main .nav-wrap .nav-alright { text-align:right; }
.nav-main .nav-wrap > li > a { display:inline-block; height:40px; margin-top:3px; padding:6px 15px 11px; background:url('../../images/images_2018/main/icon_menu.png') no-repeat; font-weight:500; font-size:16px; color:#fff; box-sizing:border-box; }
.nav-main .nav-wrap > li > a:hover, .nav-main .nav-wrap > li > a:focus, .nav-main .nav-wrap > li.on > a { position:relative; background-color:#fff; background-image:url('../../images/images_2018/main/icon_menu_on.png'); color:#231f20; }
.nav-main .nav-wrap > li > a:hover:after, .nav-main .nav-wrap > li > a:focus:after, .nav-main .nav-wrap > li.on > a:after { position:absolute; bottom:-1px; left:0; z-index:1; width:100%; height:1px; background-color:#fff; content:''; }
.nav-main .nav-wrap .nav-open > a { padding-left:47px; background-position:15px 9px; }
.nav-main .nav-wrap .nav-alright > a { padding-right:47px; background-position:92.5% 9px; text-align:right; }
.nav-main .nav-box { display:none; position:absolute; top:43px; left:0; width:100%; border-top:1px solid #e5e5e5; border-bottom:2px solid #4162a3; background-color:#fff; }
.nav-main .nav-box:before { position:absolute; top:56px; left:0; width:100%; height:1px; background-color:#e5e5e5; content:''; }
.nav-main .nav-list { width:1000px; margin:0 auto; background-color:#fff; box-sizing:border-box; }
.nav-main .nav-list > li { float:left; width:16.66%; }
.nav-main .nav-alright .nav-list > li { width:25%; text-align:left; }
.nav-main .nav-list > li > a { display:block; padding:15px 0 12px; border-bottom:3px solid #fff; font-weight:500; font-size:18px; color:#231f20; text-align:center; }
.nav-main .nav-list > li > a:hover, .nav-main .nav-list > li > a:focus, .nav-main .nav-list > li.on > a { border-bottom:3px solid #4162a3; }
.nav-main .nav-list > li ul { height:260px; padding-top:20px; border-left:1px solid #e5e5e5; }
.nav-main .nav-list > li:last-child ul { border-right:1px solid #e5e5e5; }
.nav-main .nav-list > li li a { display:inline-block; padding:8px 19px; font-size:15px; color:#555; }
.nav-main .nav-list > li li a:hover:before, .nav-main .nav-list > li li a:focus:before, .nav-main .nav-list > li li.on a:before { display:inline-block; width:3px; height:15px; margin:0 16px 0 -19px; background-color:#4162a3; vertical-align:-2px; content:''; }
.nav-main .member-link { position:absolute; top:74px; right:50%; margin-right:-644px; }
.nav-main .member-link li { display:table; padding:4px 0; }
.nav-main .member-link a { display:table-cell; width:71px; height:59px; padding-left:62px; border:1px solid #e5e5e5; font-weight:500; font-size:14px; color:#4466a7; vertical-align:middle; }
.nav-main .member-link .loginUser a { background:url('../../images/images_2018/main/icon_loginUser.png') no-repeat 21px 50%; }
.nav-main .member-link .login a { background:url('../../images/images_2018/main/icon_login.png') no-repeat 21px 50%; }
.nav-main .member-link .oslogin a { background:url('../../images/images_2018/main/icon_oslogin.png') no-repeat 21px 50%; }
.nav-main .member-link .logout a { background:url('../../images/images_2018/main/icon_logout.png') no-repeat 21px 50%; }
.nav-main .member-link .join a { background:url('../../images/images_2018/main/icon_join.png') no-repeat 21px 50%; }
.nav-main .member-link .manager a { background:url('../../images/images_2018/main/icon_manager.png') no-repeat 21px 50%; }

/*main-content*/
.contents-main { background-color:#fff; }

/*상단 비주얼*/
.visual-area { position:relative; overflow:hidden; margin-bottom:469px; }
.visual-area .visual:after { position:absolute; top:0; left:0; z-index:1000; width:100%; height:100%;background-color:rgba(0,0,0,.28); content:''; }
.visual-area .visual div { float:left; width:100%; height:740px; background:no-repeat center; background-size:cover; }
.visual-area .visual div.slick-current { -webkit-animation:bgScale 8000ms 1 ease-out; -o-animation:bgScale 8000ms 1 ease-out; animation:bgScale 8000ms 1 ease-out; }
@-webkit-keyframes bgScale {
    0% { -webkit-transform: scale(1.4); }
    100% { -webkit-transform: scale(1) rotate(0.02deg); }
}
@-o-keyframes bgScale {
    0% { -o-transform: scale(1.4); }
    100% { -o-transform: scale(1) rotate(0.02deg); }
}
@keyframes bgScale {
    0% { transform: scale(1.4); }
    100% { transform: scale(1) rotate(0.02deg); }
}
.visual-area .control { position:absolute; bottom:169px; right:50%; z-index:1001; margin-right:-505px; }
.visual-area .control button { display:inline-block; width:24px; height:24px; margin:0 4px; cursor:pointer; }
.visual-area .control .btn-prev { background:url('../../images/images_2018/main/visual_prev.png') no-repeat center; }
.visual-area .control .btn-next { background:url('../../images/images_2018/main/visual_next.png') no-repeat center; }
.visual-area .control .btn-play { background:url('../../images/images_2018/main/visual_stop.png') no-repeat center; }
.visual-area .control .btn-play.stop { background:url('../../images/images_2018/main/visual_play.png') no-repeat center; }
/*상단 비주얼-텍스트*/
.visual-area .visual-text { position:absolute; top:163px; left:50%; z-index:1001; width:696px; height:241px; margin:0 0 0 -348px; }
.text_step02 { position:absolute; top:45px; left:15px; }
.text_step03 { position:absolute; top:112px; left:219px; }
.visual-area .visual-text span { float:left; height:30px; margin-top:30px; opacity:0; transition:.8s ease all; font-size:0; line-height:0; }
.visual-area .visual-text span.on { margin-top:0; opacity:1 }
.visual-area .visual-text .text01 { width:24px; height:30px; background:url('../../images/images_2018/main/text/main_text01.png') no-repeat 0 0; }
.visual-area .visual-text .text02 { width:24px; height:30px; background:url('../../images/images_2018/main/text/main_text02.png') no-repeat 0 0; }
.visual-area .visual-text .text03 { width:24px; height:30px; background:url('../../images/images_2018/main/text/main_text03.png') no-repeat 0 0; }
.visual-area .visual-text .text04 { width:24px; height:30px; background:url('../../images/images_2018/main/text/main_text04.png') no-repeat 0 0; }
.visual-area .visual-text .text05 { width:25px; height:30px; background:url('../../images/images_2018/main/text/main_text05.png') no-repeat 0 0; }
.visual-area .visual-text .text06 { width:31px; height:30px; background:url('../../images/images_2018/main/text/main_text06.png') no-repeat 0 0; }
.visual-area .visual-text .text07 { width:29px; height:30px; background:url('../../images/images_2018/main/text/main_text07.png') no-repeat 0 0; }
.visual-area .visual-text .text08 { width:27px; height:30px; background:url('../../images/images_2018/main/text/main_text08.png') no-repeat 0 0; }
.visual-area .visual-text .text09 { width:25px; height:30px; background:url('../../images/images_2018/main/text/main_text09.png') no-repeat 0 0; }
.visual-area .visual-text .text10 { width:24px; height:30px; background:url('../../images/images_2018/main/text/main_text10.png') no-repeat 0 0; }
.visual-area .visual-text .text11 { width:24px; height:30px; background:url('../../images/images_2018/main/text/main_text11.png') no-repeat 0 0; }
.visual-area .visual-text .text12 { width:27px; height:30px; background:url('../../images/images_2018/main/text/main_text12.png') no-repeat 0 0; }
.visual-area .visual-text .text13 { width:96px; height:97px; background:url('../../images/images_2018/main/text/main_text13.png') no-repeat 0 0; }
.visual-area .visual-text .text14 { width:96px; height:97px; background:url('../../images/images_2018/main/text/main_text14.png') no-repeat 0 0; }
.visual-area .visual-text .text15 { width:49px; height:52px; margin-left:-8px; background:url('../../images/images_2018/main/text/main_text15.png') no-repeat 0 0; }
.visual-area .visual-text .text16 { width:50px; height:52px; background:url('../../images/images_2018/main/text/main_text16.png') no-repeat 0 0; }
.visual-area .visual-text .text17 { width:75px; height:128px; background:url('../../images/images_2018/main/text/main_text17.png') no-repeat 0 0; }
.visual-area .visual-text .text18 { width:83px; height:128px; margin-left:-6px; background:url('../../images/images_2018/main/text/main_text18.png') no-repeat 0 0; }
.visual-area .visual-text .text19 { width:76px; height:128px; background:url('../../images/images_2018/main/text/main_text19.png') no-repeat 0 0; }
.visual-area .visual-text .text20 { width:89px; height:128px; background:url('../../images/images_2018/main/text/main_text20.png') no-repeat 0 0; }
.visual-area .visual-text .text21 { width:75px; height:128px; margin-left:-11px; background:url('../../images/images_2018/main/text/main_text21.png') no-repeat 0 0; }
.visual-area .visual-text .text22 { width:96px; height:128px; background:url('../../images/images_2018/main/text/main_text22.png') no-repeat 0 0; }

/*중간 배너*/
.banner-area { position:absolute; top:582px; left:50%; z-index:1001; width:980px; margin-left:-500px; padding:10px; background-color:#fff; }
.banner-area:before, .banner-area:after { clear:both; display:table; content:''; }
.banner-area > div { float:left; }
.banner-link { overflow:hidden; width:294px; margin:0 0 9px; padding:0; list-style:none; }
.banner-link li { float:left; width:50%; padding:1px 0 0 1px; box-sizing:border-box;}
.banner-link li:nth-child(odd) { padding-left:0;}
.banner-link a { display:block; height:112px; padding-top:35px; font-weight:500; font-size:15px; line-height:18px; color:#fff; text-align:center; }
.banner-link a:before { display:block; width:66px; height:57px; margin:0 auto 15px; background:no-repeat 50% 0; content:''; }
.banner-open .banner-link a { background-color:#1d7ead; }
.banner-alright .banner-link a { background-color:#444fa7; }
.banner-open .banner-link li:nth-child(1) a:before { background-image:url('../../images/images_2018/main/banner_icon_intro.png'); }
.banner-open .banner-link li:nth-child(2) a:before { background-image:url('../../images/images_2018/main/banner_icon_open.png'); }
.banner-open .banner-link li:nth-child(3) a:before { background-image:url('../../images/images_2018/main/banner_icon_recommend.png'); }
.banner-open .banner-link li:nth-child(4) a:before { margin-bottom:5px; background-image:url('../../images/images_2018/main/banner_icon_curation.png'); }
.banner-alright .banner-link li:nth-child(1) a:before { background-image:url('../../images/images_2018/main/banner_icon_alrightIntro.png'); }
.banner-alright .banner-link li:nth-child(2) a:before { background-image:url('../../images/images_2018/main/banner_icon_joinInfo.png'); }
.banner-alright .banner-link li:nth-child(3) a:before { background-image:url('../../images/images_2018/main/banner_icon_useProcess.png'); }
.banner-alright .banner-link li:nth-child(4) a:before { background-image:url('../../images/images_2018/main/banner_icon_alright.png'); }
.banner-area .slider { position:relative; overflow:hidden; width:294px; height:286px; }
.banner-area .slider > div div { float:left; width:294px; height:286px; }
.banner-area .slider > div div img { width:100%; }
.banner-area .slider .control { position:absolute; top:9px; right:10px; z-index:1; font-size:0; }
.banner-area .slider .control button { display:inline-block; width:18px; height:18px; border:1px solid #ddd; background:#fff no-repeat center; cursor:pointer; }
.banner-area .slider .control .btn-prev { background-image:url('../../images/images_2018/main/banner_prev.gif'); }
.banner-area .slider .control .btn-next { background-image:url('../../images/images_2018/main/banner_next.gif'); }
.banner-area .slider .control .btn-play { background-image:url('../../images/images_2018/main/banner_stop.gif'); }
.banner-area .slider .control .btn-play.stop { background-image:url('../../images/images_2018/main/banner_play.gif'); }
.banner-area .slider .banner-count { position:absolute; top:9px; right:64px; z-index:1; margin:0; }
.banner-area .slider .banner-count li { display:none; height:16px; padding:0 5px; border:1px solid #ddd; background-color:#fff; font-size:12px; line-height:16px; color:#555; text-align:center; }
.banner-area .slider .banner-count li strong { font-weight:500; }
.banner-area .slider .banner-count li.slick-active { display:block; }
/*저작물 안내 탭*/
.banner-info { width:372px; padding:0 10px; }
.banner-info .tab-list { overflow:hidden; margin:0; padding:0; border:2px solid #4162a3; border-bottom:0; background-color:#4162a3; list-style:none; }
.banner-info li { float:left; width:33.33%; box-sizing:border-box; }
.banner-info li a { display:block; background-color:#4162a3; font-weight:500; font-size:15px; line-height:38px; color:#fff; text-align:center; }
.banner-info li.on a { background-color:#fff; color:#2b2b2b; }
.banner-info .info-area div { display:none; height:519px; padding:30px 0 0 30px; font-weight:200; font-size:15px; line-height:24px; }
.banner-info .info-area div:nth-child(1) { display:block; background:url('../../images/images_2018/main/tab_banner_img1.jpg') no-repeat 0 100%; }
.banner-info .info-area div:nth-child(2) { background:url('../../images/images_2018/main/tab_banner_img2.jpg') no-repeat 0 100%; }
.banner-info .info-area div:nth-child(3) { background:url('../../images/images_2018/main/tab_banner_img3.jpg') no-repeat 0 100%; }
.banner-info .info-area div strong { font-weight:500; }

/*공공저작물 큐레이션*/
.curation-area { position:relative; background-color:#dfe8f3; }
.curation-inner { width:980px; height:473px; margin:0 auto; padding:30px 0 45px; }
.curation-inner:before, .curation-inner:after { clear:both; display:table; content:''; }
.curation-area ul { margin:0; padding:0; list-style:none; }
.curation-area .curation-title { float:left; display:inline-block; margin:0 10px 0 0; padding:12px 27px 18px; border-top:2px solid #4466a7; border-bottom:2px solid #4466a7; font-weight:500; font-size:33px; color:#2e4470; }
.curation-area .curation-title span { display:block; margin-top:-3px; font-size:16px; }
.curation-category { float:left; }
.curation-category li { float:left; padding:0 8px; }
.curation-category li > a { position:relative; display:block; width:90px; height:90px; border:5px solid #4466a7; background-color:#fff; font-weight:500; font-size:18px; color:#2e4470; text-align:center; }
.curation-category li.on > a { background-color:#4466a7; color:#fff; }
.curation-category li.on > a:after { position:absolute; bottom:-17px; left:50%; margin-left:-12px; border-top:12px solid #4466a7; border-left:12px solid transparent; border-right:12px solid transparent; content:''; }
.curation-category li.on .curation-content { display:block; }
.curation-category li > a:before { display:block; width:39px; height:39px; margin:12px auto 4px; background:no-repeat 50%; content:''; }
.curation-category li > a.icon-recommend:before { background-image:url('../../images/images_2018/main/curation_icon_recommend.png'); }
.curation-category li > a.icon-literary:before { background-image:url('../../images/images_2018/main/curation_icon_literary.png'); }
.curation-category li > a.icon-photo:before { background-image:url('../../images/images_2018/main/curation_icon_photo.png'); }
.curation-category li > a.icon-video:before { background-image:url('../../images/images_2018/main/curation_icon_video.png'); }
.curation-category li > a.icon-font:before { background-image:url('../../images/images_2018/main/curation_icon_font.png'); }
.curation-category li.on > a.icon-recommend:before { background-image:url('../../images/images_2018/main/curation_icon_recommend_on.png'); }
.curation-category li.on > a.icon-literary:before { background-image:url('../../images/images_2018/main/curation_icon_literary_on.png'); }
.curation-category li.on > a.icon-photo:before { background-image:url('../../images/images_2018/main/curation_icon_photo_on.png'); }
.curation-category li.on > a.icon-video:before { background-image:url('../../images/images_2018/main/curation_icon_video_on.png'); }
.curation-category li.on > a.icon-font:before { background-image:url('../../images/images_2018/main/curation_icon_font_on.png'); }

.curation-content { display:none; position:absolute; top:153px; left:50%; width:988px; margin-left:-494px; }
.curation-content .slide-list { overflow:hidden; }
.curation-content .slide-list .slide-elm { float:left; padding:0 6px; }
.curation-content .slide-list .slide-elm > a { display:block; width:223px; border:6px solid #fff; background-color:#fff; }
.curation-content .slide-list .slide-elm.on > a,
.curation-content .slide-list .slick-slide:hover > a,
.curation-content .slide-list .slide-elm > a:focus { border:6px solid #4466a7; }
.curation-content .slide-list .slide-elm span { position:relative; overflow:hidden; display:block; height:217px; line-height:22px; }
.curation-content .slide-list .slide-elm span img { position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; width:100%; }
.curation-content .slide-list .slide-elm span.text { display:table; width:100%; height:115px; margin-top:6px; padding:0 15px; box-sizing:border-box; }
.curation-content .slide-list > div span.text em { display:table-cell; font-size:16px; color:#222; font-style:normal; text-align:center; vertical-align:middle; }
.curation-content .control { position:absolute; top:-121px; right:23px; }
.curation-content .control button { display:block; width:24px; height:24px; margin:6px 0; border:0; background:no-repeat center; cursor:pointer; }
.curation-content .control .btn-prev { background-image:url('../../images/images_2018/main/curation_prev.png'); }
.curation-content .control .btn-next { background-image:url('../../images/images_2018/main/curation_next.png'); }
.curation-content .control .btn-play { background-image:url('../../images/images_2018/main/curation_stop.png'); }
.curation-content .control .btn-play.stop { background-image:url('../../images/images_2018/main/curation_play.png'); }

/*공공저작물 SNS*/
.main-sns-area { position:relative; width:980px; margin:0 auto 80px; text-align:center; }
.main-sns-area .sns-title { margin:40px 0 40px; font-weight:500; font-size:33px; color:#2e4470; }
.main-sns-area .sns-title span { display:block; margin-top:5px; font-weight:400; font-size:16px; }
.main-sns-area .sns-img-area { margin:0; padding:0; font-size:0; text-align:left; list-style:none; }
.main-sns-area .sns-img-area li { display:inline-block; width:153px; padding-left:12px; }
.main-sns-area .sns-img-area li:first-child { padding-left:0; }
.main-sns-area .sns-img-area li img { width:100%; }
.main-sns-area .link-sns { position:absolute; top:7px; right:0; }
.main-sns-area .link-sns a { margin-left:7px; }