#wait{text-align:center} /**/ #skipBtnWrap a {display: block;width: 1px;height: 0;line-height: 0;text-align: center;background: #333;color: #fff;} #skipBtnWrap a:focus, #skipBtnWrap a:hover, #skipBtnWrap a:active {width: 100%;height: 30px;line-height: 30px;} /**/ #poplayer{position:absolute;z-index:99999;top:120px;left:50%;margin:0 0 0 -280px;width:560px;height:595px;} #poplayer *{margin:0;padding:0;border:0} #poplayer img{display:block} #poplayer .todays{padding:2px 20px 8px 20px;text-align:right;background:#323232} #poplayer .todays a{font-size:14px;color:#fff} #poplayer area{cursor:pointer} /**/ #popupbar{position:relative;background:#0e6faf url(../img/popupbarbg.png) no-repeat 50% 50%;overflow:hidden;display:none} #popupbar .popupbar{max-height:117px !important;overflow:hidden} #popupbar .popupbar .slide h3{display:inline-block;margin:0;padding:0 20px 5px 0;font-size:26px;color:#fff;text-shadow:-1px -1px 2px rgba(0,0,0,0.2)} #popupbar .popupbar .slide .close{display:inline-block} #popupbar .popupbar .slide .close button{font-size:14px;font-weight:800;letter-spacing:-1px;color:#fff;border:0;background:none} #popupbar .popupbar img{display:block} #popupbar .bx-controls{position:absolute;z-index:100;bottom:3px;left:50%} #popupbar .bx-pager{float:left;display:block} #popupbar .bx-pager .bx-pager-item{display:inline;*zoom:1} #popupbar .bx-pager.bx-default-pager a{display:inline-block;margin-right:5px;width:12px;height:12px;border:2px solid #fff;background:transparent;border-radius:50px;text-indent:-9999px} #popupbar .bx-pager.bx-default-pager a.active{border:2px solid #00558b;background:#00558b} #popupbar .bx-prev{position:absolute;top:0px;right:80px;display:none;width:10px;height:19px;text-indent:-9999px;background:url(../img/banner_prev.png) no-repeat} #popupbar .bx-next{position:absolute;top:0px;right:20px;display:none;width:10px;height:19px;text-indent:-9999px;background:url(../img/banner_next.png) no-repeat} #popupbar i.b1{position:absolute;z-index:3;top:0px;left:0%;display:block;width:100%;height:5px;background:#00558b} #popupbar i.b2{position:absolute;z-index:4;top:0px;left:50%;margin:0 0 0 570px;display:block;width:100%;height:5px;background:#ffbd3f} #popupbar .holidays{padding-top:40px;text-align:center} #popupbar .opens{text-align:center} #popupbar .opens a{display:block;text-align:center} #popupbar .opens a img{display:block;margin:0 auto} /*1640-all*/ @media all and (min-width: 1640px) { #divpop { display:none;} #mm-blocker{display:none} #popupWindow{position:absolute} #OpenLayer {position: absolute;top: 150px;left: 100px;z-index: 9999;background: #fff;padding: 10px;border-radius: 5px;border: 1px solid #ccc;box-shadow: 5px 5px 20px rgba(0,0,0,0.3);text-align: right;} #OpenLayer > a {clear: both;font-size: 14px;} #OpenLayer #TodayClose {float: left;margin-right: 20px;} #moblieCard {display: none;} /* header */ #header{overflow:hidden;position:absolute;top: 0;left: 0;z-index:30002;width:100%;height: 100px;} #header.sel {height: 500px;border-bottom: 3px solid #0d60dc;box-sizing: border-box;background:#fff;} #header .header {position:relative;margin: 0 60px 0;text-align: center;} #header h1{position:absolute;top: 0;left: 0;} #header h1 a {display: inline-block;width: 200px;height: 42px;margin-top: 32px;line-height: 1em;background:url(../img/logo.png) no-repeat 0 0 / auto 33px;} #header h1 > img {margin: 17px 0 0 7px;vertical-align: middle;} #header .header .h_right {display:inline-block;} #header button{display:none} #header .btn-menu {display:none;} /**/ #header nav {float:left;} #header nav::after {content: "";clear: both;} #gnb{} #gnb .gnb{} #gnb .depth1 {overflow:hidden;height: 100px;} #gnb .depth1 > li {float:left;text-align: center;} #gnb .depth1 > li > a{position:relative;display:block;height: 100px;padding: 0 20px;margin: 0;line-height: 100px;font-size:20px;font-weight:400;color:#fff;box-sizing: border-box;} #gnb .depth1 > li > a::after {content: "";position:absolute;top: 50%;left: 0;display:none;margin-top: -5px;width: 100%;height: 10px;background: #0d60dc;opacity: 0.1;animation: menuOn 1s ease 1;} #gnb .depth1 > li > a:hover::after {display:block;} #gnb .depth1 > li > a em{position:absolute;top:23px;right:0;display:block;margin:-10px 0 0 0;width:1px;height:16px;background:#ccc;display:none} #gnb .depth1 > li.sel > a {color:#558fff} #gnb .depth2{display:none;overflow:hidden;position:absolute;top: 80px;left: 0;z-index: 10;width: 100%;min-height: 150px !important;padding: 25px 0 45px 25%;box-sizing: border-box;text-align:center;} #gnb .depth2 li {float:left;width: 33.33333%;} #gnb .depth2 li a{display:block;padding:18px 5px;line-height:15px;font-size:15px;color:#333;border-bottom: 1px solid #ddd;margin:0 50px 0 0;text-align: left;} #gnb .depth2 li a:hover{font-size: 15px;color:#fff;background:#2e4287 url(../img/depth2_arr.png) no-repeat 97% 50%;} #gnb .g1 .depth2 {background: url(../img/g1_icon.png) no-repeat 5% bottom;} #gnb .g2 .depth2 {background: url(../img/g2_icon.png) no-repeat 8% bottom;} #gnb .g3 .depth2 {background: url(../img/g3_icon.png) no-repeat 6% bottom;} #gnb .g4 .depth2 {background: url(../img/g4_icon.png) no-repeat 7% bottom;} #gnb .g5 .depth2 {background: url(../img/g5_icon.png) no-repeat 7% bottom;} #gnb .g6 .depth2 {background: url(../img/g6_icon.png) no-repeat 7% bottom;} #gnb .g7 .depth2 {background: url(../img/g7_icon.png) no-repeat 7% bottom;} #gnb .g8 .depth2 {background: url(../img/g8_icon.png) no-repeat 9% bottom;} #gnb .nav_bg {display:none;position:absolute;top: 54px;left: 0;width: 100%;height: 270px;background: #fff;} @keyframes menuOn { from {width: 0;} to {width: 100%;} } #header .etc_btn {position: absolute;right: 0;top:0} #header .etc_btn li {display:inline-block;} #header .etc_btn li a {margin-right: 13px;font-size: 15px;line-height: 100px;font-weight:400;color:#fff;text-transform: uppercase;} #header .etc_btn li:last-child a {margin-right: 0;} #header .etc_btn li.etc04 a {display:inline-block;width:30px;height:30px;background:url(../img/btn_h_search.png) no-repeat center 50%;text-indent:-99999em} #header .etc_btn li.etc05 a {display:inline-block;width:30px;height:30px;background:url(../img/btn_h_sitemap.png) no-repeat center 50%;text-indent:-99999em} #header.fix_menu {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.fix_menu #gnb .depth1 > li > a {color:#333;} #header.fix_menu #gnb .depth1 > li.sel > a {color:#2e4287} #header.fix_menu h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.fix_menu h1 a.logo_is {background-image: url(../img/logo_island_on.png);} #header.fix_menu .etc_btn li a {color:#333;} #header.fix_menu .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.fix_menu .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #header.header_active {background:#fff;border-bottom:1px solid #ddd;} #header.header_active #gnb .depth1 > li > a {color:#333;} #header.header_active #gnb .depth1 > li.sel > a {color:#2e4287} #header.header_active h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.header_active h1 a.logo_is {background-image: url(../img/logo_island_on.png);} #header.header_active .etc_btn li a {color:#333;} #header.header_active .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.header_active .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #header.bg_white {background:#fff;border-bottom:1px solid #ddd;} #header.bg_white #gnb .depth1 > li > a {color:#333;} #header.bg_white h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.bg_white h1 a.logo_is {background-image: url(../img/logo_island_on.png);} #header.bg_white .etc_btn li a {color:#333;} #header.bg_white .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.bg_white .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #allbg{position:fixed;z-index:30000;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.2);display:none} /**/ #menu{position:absolute;z-index:10;top:0;right:0;background: #252525;} #menu a{display:block;width: 50px;height: 50px;background:url(../img/menu.png) no-repeat 50%;text-indent:-9999em;overflow:hidden} /**/ #container {position: relative;padding-top: 100px;} /*메인visual*/ #section0 .mVisual {height:100%;} #section0 .mVisual .swiper-container {width: 100%;height: 100%;} #section0 .mVisual .swiper-slide {text-align: center;background: #fff;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center; justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center; align-items: center;} #section0 .mVisual .swiper-slide .mvText{margin-top: -180px;font-size: 60px;font-weight:100;color:#fff;line-height:76px;} #section0 .mVisual .swiper-slide .mvText strong {display:block;font-weight:700;} #section0 .mVisual .swiper-slide.mvimg01 {background: url(../img/mvimg01.png) no-repeat 0 0;background-size:cover;} #section0 .mVisual .swiper-slide.mvimg02 {background: url(../img/mvimg02.png) no-repeat 0 0;background-size:cover;} #section0 .mVisual .swiper-slide.mvimg03 {background: url(../img/mvimg03.png) no-repeat 0 0;background-size:cover;} #section0 .mVisual .mvBtn_wp {position:absolute;top:50%;left:0;width:100%;height:44px;} #section0 .mVisual .mvBtn_wp .swiper-pagination-fraction {padding-right: 40px;} #section0 .mVisual .mvBtn_wp .mvBtn {width:360px;margin:0 auto;position:relative;} #section0 .mVisual .mvBtn_wp .mvBtn img {padding:10px 0;} #section0 .mVisual .mvBtn_wp .ctrBtn {position: absolute;left: 50%;top: 9px;z-index: 99;margin-left: 10px;} #section0 .mVisual .mvBtn_wp .ctrBtn .start {display:inline-block;width:20px;height:20px;line-height:20px;background:url(../img/v_start.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;margin-right:1px} #section0 .mVisual .mvBtn_wp .ctrBtn .stop {display:inline-block;width:20px;height:20px;line-height:20px;background:url(../img/v_stop.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;} /*메인-검색*/ #section0 .mVisual .search {position:absolute;top:70%;left:0;width:100%;text-align: center;z-index: 99999;} #section0 .mVisual .search .search_wp { width:1200px;margin:0 auto;box-sizing:border-box;position:relative;padding: 14px 0;border-left: 1px solid #fff;background-color: rgba( 255, 255, 255, 0.8 );} #section0 .mVisual .search fieldset{} #section0 .mVisual .search fieldset label{width:0;font-size:0;overflow:hidden;} #section0 .mVisual .search fieldset label.label_st {position: absolute;top: 20px;left: 0px;width: 125px;color: #1e2c5d;font-size: 24px;font-weight: 500;background: url(../img/ms_tit_line.png) no-repeat right 50%;} _::-moz-svg-foreign-content, :root #section0 .mVisual .search fieldset select{position:relative;top:10px} #section0 .mVisual .search fieldset input{float:left;width:980px;height:42px !important;line-height:42px !important;font-size:17px !important;padding: 0 20px !important;margin: 0 80px 0 125px;border:0 !important;color:#333;background:none} #section0 .mVisual .search fieldset button{position: absolute;right: 0;top: 0;width: 70px;height: 70px;background:#fff url(../img/m_search_icon.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em} /*메인스크롤 아이콘*/ #section0 .mVisual .main_scroll {position:absolute;top:90%;left:0;width:100%;text-align: center;z-index: 99999;} #section0 .mVisual .main_scroll .main_scroll_wp {display:inline-block;width:94px;height:60px;background:url(../img/main_scroll.png) no-repeat 0 0;text-indent:-99999em;} /*2026여수세계섬박람회*/ #section0 .mVisual .banner_2026 {position:absolute;top:145px;right:120px;z-index:1;} #section0 .mVisual .banner_2026 a {display:block;} #section0 .mVisual .banner_2026 a > .b2026_s {display:none;} /*공지사항-문화프로그램*/ #section1 .mCont01 {width:1200px;margin:0 auto;padding-top:100px;overflow:hidden;} #section1 .mCont01 .mBoard {float:left;width:680px;padding-right:60px;} #section1 .mCont01 .mBoard .tab.list{height:160px} #section1 .mCont01 .mBoard .tab.list ul{position:relative;} #section1 .mCont01 .mBoard .tab.list ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li{float:left;width:50%;} #section1 .mCont01 .mBoard .tab.list li a{float:left;position:relative;margin-left: 20px;text-decoration:none;} #section1 .mCont01 .mBoard .tab.list li:first-child a {float:right;margin-right: 20px;} #section1 .mCont01 .mBoard .tab.list li a span{display:inline-block;font-size:38px;font-weight:600;color:#888;cursor:pointer} #section1 .mCont01 .mBoard .tab.list li ul{width:100%;position:absolute;top:96px;left:0;list-style:none;border:0;margin:0;padding:0;} #section1 .mCont01 .mBoard .tab.list li ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li li{float:none;position:relative;padding:4% 0 4% 78px;width: 100%;box-sizing: border-box;border-bottom:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li:first-child {border-top:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li a{display:inline-block;float:left !important;color:#222 !important;font-weight:400;font-size:21px;width:90%;margin-left: 0;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;transition:all 0.1s;} #section1 .mCont01 .mBoard .tab.list li li:first-child a {float:left;} #section1 .mCont01 .mBoard .tab.list li li strong.kind {position:absolute;top:32px;left:0;width:60px;height:28px;line-height:30px;border:1px solid #000;font-size:15px;font-weight:500;color:#555;text-align:center;} #section1 .mCont01 .mBoard .tab.list li li a:hover, #section1 .mCont01 .mBoard .tab.list li li a:active, #section1 .mCont01 .mBoard .tab.list li li a:focus{color:#466db8 !important;text-decoration:none} #section1 .mCont01 .mBoard .tab.list li li time, #section1 .mCont01 .mBoard .tab.list li li .time{display:block;font-size:18px;color:#222;} #section1 .mCont01 .mBoard .tab.list li li.more{position:absolute;top:-30px;right:0;border:0 !important;background:transparent} #section1 .mCont01 .mBoard .tab.list li.active a{color:#333} #section1 .mCont01 .mBoard .tab.list li.active a span{font-size:38px;font-weight:600;color:#222;position:relative;} #section1 .mCont01 .mBoard .tab.list li a span::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section1 .mCont01 .mBoard .tab.list li.active a span::after {width:100%;transition:all 0.5s} #section1 .mCont01 .mBoard .tab.list.jx{height:auto} #section1 .mCont01 .mBoard .tab.list.jx ul{border:0} #section1 .mCont01 .mBoard .tab.list.jx li{float:none;position:relative} #section1 .mCont01 .mBoard .tab.list.jx li a{float:none;display:block;font-weight:bold;color:#333;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important} #section1 .mCont01 .mBoard .tab.list.jx li ul{position:static;display:block;left:0;top:0;padding:5px 0} #section1 .mCont01 .mBoard .tab.list.jx li li a{display:inline;border:0 !important;background:none !important;font-weight:normal} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore {position:absolute;bottom:-110px;left:50%;margin-left:-75px;padding:0;border:none;width:150px;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a {display:block;width:100%;height:64px;line-height:66px;margin-right: 0;border:1px solid #ddd;font-size:20px;color:#222;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} /*팝업존*/ #section1 .mCont01 .mPop {float:left;width:460px;padding-top:95px;} #section1 .mCont01 .mPop .swiper-slide {width:460px;height:560px;margin-bottom:30px;background-color: #fff;} #section1 .mCont01 .mPop .swiper-slide a {display:block;height: 100%;} #section1 .mCont01 .mPop .swiper-slide a img {max-width: 100%;height: 100%;} #section1 .mCont01 .mPop .swiper-pagination-fraction, #section1 .mCont01 .mPop .swiper-pagination-custom, #section1 .mCont01 .mPop .swiper-container-horizontal > #section1 .mCont01 .mPop .swiper-pagination-bullets {width: 50px;color: #333;margin: 0 auto 0;position: relative;padding-top: 10px;} #section1 .mCont01 .mPop .pzBtn_wp {height:35px;position:relative;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn {position: absolute;top: 0;left: 0;width: 100%;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn img {padding:10px 0;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-prev, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-next {left: 125px;right: auto;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-next, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-prev {right: 125px;left: auto;} /*여수시립도서관 소개*/ #section2 {background: url(../img/bg_section2.png) no-repeat left bottom;} #section2 .mCont02 {} #section2 .mCont02 h2.tit {font-size:38px;font-weight:700;color:#fff;padding-bottom:25px;text-align:center;} #section2 .mCont02 .tit_text {font-size:23px;line-height:30px;color:#fff;padding-bottom:60px;text-align:center;} #section2 .mCont02 .mIntro_wp {width:100%;height:470px;position:relative;} #section2 .mCont02 .mIntro_wp .mIntro {position:absolute;width:100%;top:0;left:50%;margin-left:-600px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area {height:470px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info {position: absolute;top: 0;left: 0;z-index: 999;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit {font-size:48px;font-weight:100;color:#fff;line-height:1.2em} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit strong {display:block;font-size:80px;font-weight:900;color:#464f73;margin-bottom:10px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day {padding-top:35px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .stit {font-size:20px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li {float:left;width:46px;height:44px;line-height:44px;border-radius:5px;background:#fff;margin:0 5px 5px 0;font-size:20px;font-weight:500;color:#1e2c5d;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more {width:102px;height:44px;line-height:44px;border:1px solid rgba(255, 255, 255, .5);box-sizing:border-box;border-radius:5px;background:#1e2c5d;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more a {display:block;font-size:17px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time {padding-top:20px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time .stit {font-size:20px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl {padding-bottom:6px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dt {font-size:18px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dd {font-size:18px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom {padding-top:10px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit {font-size:18px;font-weight:500;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit a {color:#ff8400;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li {float:left;margin-right:24px;font-size:15px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span {display:inline-block;border-radius:50%;width:24px;height:24px;line-height:24px;border:1px solid #fff;margin-right:5px;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span.oth {border-radius:24px;width:44px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img {margin-left: 600px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img .slick-slide {width:600px !important;margin-right: 50px; -webkit-box-shadow: 20px 20px 40px 0px rgba(0,0,0,0.3); -moz-box-shadow: 20px 20px 40px 0px rgba(0,0,0,0.3); box-shadow: 20px 20px 40px 0px rgba(0,0,0,0.3);} /*주요서비스 안내*/ #section3 {background: url(../img/bg_section3.png) no-repeat center top;background-size:cover;} #section3 .mCont03 {} #section3 .mCont03 h2.tit {font-size:38px;font-weight:700;color:#fff;margin-top:-200px;padding-bottom:35px;text-align:center;} #section3 .mCont03 .tit_text {font-size:23px;line-height:30px;color:#fff;text-align:center;} #section3 .mCont03 .mIcon {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index:1;} #section3 .mCont03 .mIcon ul {overflow: hidden;height: 100%;} #section3 .mCont03 .mIcon ul li {float:left;width:16.66666%;height: 100%;border-left: 1px solid rgba(255,255,255,0.2);box-sizing:border-box;} #section3 .mCont03 .mIcon ul li a {display:block;height: 100%;padding-top: 560px;text-align:center;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a:hover {background-color: rgba( 0, 0, 0, 0.2 );} #section3 .mCont03 .mIcon ul li a span {display: inline-block;padding:130px 5px 0;font-size:22px;color:#fff;} #section3 .mCont03 .mIcon ul li a span.micon01 {background: url(../img/micon01.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon02 {background: url(../img/micon02.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon03 {background: url(../img/micon03.png) no-repeat center 12px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon04 {background: url(../img/micon04.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon05 {background: url(../img/micon05.png) no-repeat center 12px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon06 {background: url(../img/micon06.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a:hover span.micon01 {background: url(../img/micon01.png) no-repeat center 8px;} #section3 .mCont03 .mIcon ul li a:hover span.micon02 {background: url(../img/micon02.png) no-repeat center 8px;} #section3 .mCont03 .mIcon ul li a:hover span.micon03 {background: url(../img/micon03.png) no-repeat center 0;} #section3 .mCont03 .mIcon ul li a:hover span.micon04 {background: url(../img/micon04.png) no-repeat center 8px;} #section3 .mCont03 .mIcon ul li a:hover span.micon05 {background: url(../img/micon05.png) no-repeat center 0;} #section3 .mCont03 .mIcon ul li a:hover span.micon06 {background: url(../img/micon06.png) no-repeat center 8px;} /*추천신착도서*/ #section4 {background: url(../img/bg_section4.png) repeat-y center top;} #section4 .mCont04 {} #section4 .mCont04 .in {width:1200px;margin:0 auto;padding-top: 110px;overflow:hidden;} #section4 .mCont04 .in #mBook {float:left;width:850px;background:#fff;position:relative;} #section4 .mCont04 .in #mBook > div {} #section4 .mCont04 .in #mBook > div > ul {overflow:hidden;display:none;padding-top: 15%;margin-bottom: 10%;} #section4 .mCont04 .in #mBook .tab_on > ul {display:block;} #section4 .mCont04 .in #mBook .btn_mMore {display:none;margin:0 auto;width:152px;height:64px;line-height:66px;border:1px solid #ddd;font-size:20px;color:#222;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section4 .mCont04 .in #mBook .tab_on .btn_mMore {display:block;} #section4 .mCont04 .in #mBook .tab_on .btn_mMore:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} #section4 .mCont04 .in #mBook h2 {position:absolute;top: 3px;z-index: 109;height: 52px;line-height: 52px;text-align:center;color:#fff;font-size: 38px;font-weight:700;} #section4 .mCont04 .in #mBook h2 > a {display:block;color:#ccc;} #section4 .mCont04 .in #mBook h2 > a::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section4 .mCont04 .in #mBook .tab_on h2 > a {color: #333;position:relative;} #section4 .mCont04 .in #mBook .tab_on h2 > a::after {width:100%;transition:all 0.5s} #section4 .mCont04 .in #mBook .mBook01 h2 {left: 50%;margin-left:-160px;} #section4 .mCont04 .in #mBook .mBook02 h2 {left: 50%;margin-left:20px;} #section4 .mCont04 .in #mBook > div > ul li {float: left;width:210px;margin-right:70px;font-size: 16px;color:#333;box-sizing: border-box;} #section4 .mCont04 .in #mBook > div > ul li:last-child {margin-right:0;} #section4 .mCont04 .in #mBook > div > ul li a {display:block;} #section4 .mCont04 .in #mBook > div > ul li a .mBimg {display:inline-block;width:210px;height:310px;margin-bottom:35px;overflow:hidden;transition:all 0.2s; -webkit-box-shadow: 30px 30px 42px 0px rgba(0,0,0,0.3); -moz-box-shadow: 30px 30px 42px 0px rgba(0,0,0,0.3); box-shadow: 30px 30px 42px 0px rgba(0,0,0,0.3);} #section4 .mCont04 .in #mBook > div > ul li a .mBimg:hover {margin-top:-10px;} #section4 .mCont04 .in #mBook > div > ul li a .mBimg img {width:100%;height:100%;transition:all 0.2s;} #section4 .mCont04 .in #mBook > div > ul li a strong {display:block;width:210px;font-size:20px;font-weight:500;color:#333;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;text-align:center;} #section4 .mCont04 .in #mBook > div > ul li a strong i {display:block;font-size:17px;font-weight:400;color:#666;font-style:normal;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;} /*영화*/ #section4 .mCont04 .in #mMovie {float:left;width:345px;margin-left:5px;} #section4 .mCont04 .in #mMovie h2 {font-size:38px;font-weight:700;color:#fff;text-align:center;} #section4 .mCont04 .in #mMovie .btn_mMore {display:block;margin:0 auto;width:152px;height:64px;line-height:66px;border:1px solid #fff;font-size:20px;color:#fff;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section4 .mCont04 .in #mMovie .btn_mMore:hover {background:#fff;border:1px solid #fff;color:#1e2c5d !important;} #section4 .mCont04 .in #mMovie .swiper-container {margin-left: auto;margin-right: auto;position: relative;overflow: hidden;list-style: none;padding: 0;z-index: 1;width: 100%;;padding-top:72px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide {position:relative;margin-bottom:35px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a {display: block;width:100%;background: #1e2c5d;text-align:center;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a img {width:260px;height:370px;margin:0 auto; -webkit-box-shadow: 15px 30px 30px 0px rgba(0,0,0,0.3); -moz-box-shadow: 15px 30px 30px 0px rgba(0,0,0,0.3); box-shadow: 15px 30px 30px 0px rgba(0,0,0,0.3);} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mark {position:absolute;top:0;left:43px;padding:8px 24px;font-size:16px;letter-spacing:-1px;color:#fff;background:#3a6ae3;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivTit {width:70%;padding:0 15%;font-size:19px;color:#fff;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;margin-top:30px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivDay {width:70%;padding:0 15%;font-size:17px;color:#aaa;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp {position:absolute;top:20px;left:0;width:100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn {position: absolute;top: 0;left: 0;width: 100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn img {padding:10px 0;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-prev, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-next {left: 70px;right: auto;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-next, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-prev {right: 70px;left: auto;} /*기타*/ #section5 {background: url(../img/bg_section5.png) no-repeat center top;background-size:cover;} #section5 .mCont05 {width:1200px;margin:0 auto;padding-top: 100px;overflow:hidden;} #section5 .mCont05 .mEtc01 {float:left;width:380px;height:460px;margin-right:20px;background: url(../img/bg_mEtc01.png) no-repeat center top;transition:all 0.2s;} #section5 .mCont05 .mEtc01:hover {background: url(../img/bg_mEtc01_on.png) no-repeat center top;} #section5 .mCont05 .mEtc01 a {display:block;padding-left:40px;box-sizing:border-box;height:100%;background: url(../img/go_arr01.png) no-repeat 85% 90%;transition:all 0.3s;} #section5 .mCont05 .mEtc01 a:hover {background: url(../img/go_arr01.png) no-repeat 90% 90%;} #section5 .mCont05 .mEtc01 a .tit {display:block;font-size:23px;font-weight:700;color:#fff;padding-top:36px;margin-bottom:12px;} #section5 .mCont05 .mEtc01 a .tit_text {display:block;font-size:18px;line-height:22px;color:#fff;} #section5 .mCont05 .mEtc02 {float:left;width:380px;height:460px;margin-right:20px;background:#fff;} #section5 .mCont05 .mEtc02 .tit {display:block;padding-left:40px;box-sizing:border-box;font-size:23px;font-weight:700;color:#222;padding-top:36px;} #section5 .mCont05 .mEtc02 ul {padding:0 40px;} #section5 .mCont05 .mEtc02 ul li {padding:26px 0;border-bottom:1px solid #eaeaea;} #section5 .mCont05 .mEtc02 ul li:last-child {border-bottom:none;} #section5 .mCont05 .mEtc02 ul li a {display:inline-block;width:90%;font-size:17px;color:#222;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;transition:all 0.1s;} #section5 .mCont05 .mEtc02 ul li a:hover {color:#466db8;} #section5 .mCont05 .mEtc02 ul li .date {display:block;font-size:16px;color:#757575;} #section5 .mCont05 .mEtc02 .btn_mMore {display:block;width:150px;height:44px;line-height:44px;margin:0 auto;border:1px solid #ddd;font-size:17px;color:#222;text-align:center;transition:all 0.2s;} #section5 .mCont05 .mEtc02 .btn_mMore:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} #section5 .mCont05 .mEtc03 {float:right;width:400px;} #section5 .mCont05 .mEtc03 .mBan01 {height:220px;margin-bottom:20px;background:#d94200;transition:all 0.2s;} #section5 .mCont05 .mEtc03 .mBan01:hover {background:#c03a00;} #section5 .mCont05 .mEtc03 .mBan01 a {display:block;height:100%;padding:0 0 0 40px;background: url(../img/go_arr01.png) no-repeat 85% 80%;transition:all 0.3s;} #section5 .mCont05 .mEtc03 .mBan01 a:hover {background: url(../img/go_arr01.png) no-repeat 90% 80%;} #section5 .mCont05 .mEtc03 .mBan01 a .tit {display:block;padding-top:36px;margin-bottom:12px;font-size:18px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan01 a .tit_text {display:block;line-height:22px;font-size:18px;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 {height:220px;background:#1e2c5d;transition:all 0.2s;} #section5 .mCont05 .mEtc03 .mBan02:hover {background:#152045;} #section5 .mCont05 .mEtc03 .mBan02 a {display:block;height:100%;padding:0 0 0 40px;background: url(../img/go_arr01.png) no-repeat 85% 80%;transition:all 0.3s;} #section5 .mCont05 .mEtc03 .mBan02 a:hover {background: url(../img/go_arr01.png) no-repeat 90% 80%;} #section5 .mCont05 .mEtc03 .mBan02 a .tit {display:block;padding-top:36px;margin-bottom:12px;font-size:18px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 a .tit_text {display:block;line-height:22px;font-size:17px;color:#fff;} /**/ #foot_section .mFooter {} #foot_section .mFooter .f_menu {background:#1a1c20;height:60px;line-height:60px;} #foot_section .mFooter .f_menu .in {width:1200px;margin:0 auto;} #foot_section .mFooter .f_menu .in ul {} #foot_section .mFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #foot_section .mFooter .f_menu .in ul li a {display:block;font-size:15px;color:#ccc;transition:all 0.2s;} #foot_section .mFooter .f_menu .in ul li a:hover, #foot_section .mFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #foot_section .mFooter .f_menu .in ul li:first-child a {color:#e85c31} #foot_section .mFooter .f_info{background:#121316;padding:30px 0 50px;} #foot_section .mFooter .f_info .in {width:1200px;margin:0 auto;position:relative;} #foot_section .mFooter .f_info .in ul li {margin-bottom:1px;color:#aaa;} #foot_section .mFooter .f_info .in ul li br {display:none;} #foot_section .mFooter .f_info .in ul li strong {display:inline-block;width:55px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:20px;font-size:inherit;font-weight:400;} #foot_section .mFooter .f_info .in ul li span.tel {font-size:14px;color:#aaa;margin-left:20px;} #foot_section .mFooter .f_info .in ul li span.fax {font-size:14px;color:#aaa;margin-left:20px;} #foot_section .mFooter .f_info .in .copyright {font-size:15px;color:#aaa;padding-top:20px;} #foot_section .mFooter .f_info .in .f_logo {position:absolute;top:0;right:0;} /**/ #s_foot_section .sFooter {} #s_foot_section .sFooter .f_menu {background:#1a1c20;height:60px;line-height:60px;} #s_foot_section .sFooter .f_menu .in {width:1200px;margin:0 auto;} #s_foot_section .sFooter .f_menu .in ul {} #s_foot_section .sFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #s_foot_section .sFooter .f_menu .in ul li a {display:block;font-size:15px;color:#ccc;transition:all 0.2s;} #s_foot_section .sFooter .f_menu .in ul li a:hover, #s_foot_section .sFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #s_foot_section .sFooter .f_menu .in ul li:first-child a {color:#e85c31} #s_foot_section .sFooter .f_info{background:#121316;padding:30px 0 50px;} #s_foot_section .sFooter .f_info .in {width:1200px;margin:0 auto;position:relative;} #s_foot_section .sFooter .f_info .in ul li {margin-bottom:1px;color:#aaa;} #s_foot_section .sFooter .f_info .in ul li br {display:none;} #s_foot_section .sFooter .f_info .in ul li strong {display:inline-block;width:55px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:20px;font-size:inherit;font-weight:400;} #s_foot_section .sFooter .f_info .in ul li span.tel {font-size:14px;color:#aaa;margin-left:20px;} #s_foot_section .sFooter .f_info .in ul li span.fax {font-size:14px;color:#aaa;margin-left:20px;} #s_foot_section .sFooter .f_info .in .copyright {font-size:15px;color:#aaa;padding-top:20px;} #s_foot_section .sFooter .f_info .in .f_logo {position:absolute;top:0;right:0;} /**/ #contain{width: 100%;} #contain .contain {margin: 0 auto;max-width:1200px;overflow: hidden;position:relative;} #contain + #footer .contact {display:none;} /* 서브비주얼 */ #contain #subVisual {height: 300px;padding-top: 100px;background:url(../img/sub_v_img.png) no-repeat 50% 0;background-size: cover;text-align: center;} #contain #subVisual .sub_slogan {padding-top: 74px;max-width: 1200px;margin: 0 auto;font-size: 46px;font-weight: 300;color: #fff;line-height:58px;text-align:center;} #contain #subVisual .sub_slogan strong {display:block;font-size:inherit;font-weight:500;} /**/ #aside{float:left;width:250px;margin-right: 50px;padding-bottom: 50px;} #aside h2{height:130px;line-height: 130px;font-size:28px;font-weight:500;color:#fff;text-align:center;background: #1e2c5d} #aside ul{padding:0 0 0px 0} #aside ul > li > a{display:block;padding: 18px 15px;font-size:17px;font-weight: 400;color:#555;border-bottom:1px solid #ddd;border-top:0;background: url(../img/left_menu.png) no-repeat 95% 50%;transition:all 0.3s;} #aside ul > li > a:hover, #aside ul > li:hover > a {color: #2e4287;background:#efefef url(../img/left_menu.png) no-repeat 95% 50%;transition: all 0.3s;} #aside ul > li.sel > a, #aside ul > li.sel > a:hover{color:#fff;border: 0;border-bottom: 1px solid #ddd;background:#2e4287 url(../img/left_menu_on.png) no-repeat 95% 50%;transition:all 0.5s} #aside ul > li ul{padding:12px 10px 8px 20px;border:1px solid #ddd; background:#fafafa; border-top:0;} #aside ul > li li a{display:block;border:0;font-size:15px; height:auto;line-height:22px; padding:0; margin:0;color:#888; padding-bottom:4px; border-bottom:0;background:none} #aside ul > li li:last-child a{border:0} #aside ul > li li a:hover, #aside ul > li li a.sel{font-size:15px;color:#2e4287; border:0;background:none} #aside ul > li li a.sel:before { content:'→'; padding-right:3px; font-family:'dotum';} #aside .sub_quick { overflow:hidden; padding:16px 4px;} #aside .sub_quick a { float:left; width:33.3%; display:block; padding:68px 0 5px 0; background:url(../img/sub_quick01.png) no-repeat center top; font-size:13px; text-align:center; } #aside .sub_quick a.a02 { background:url(../img/sub_quick02.png) no-repeat center top;} #aside .sub_quick a.a03 { background:url(../img/sub_quick03.png) no-repeat center top;} #aside .sub_quick a:hover { opacity:.8;} /**/ #contain .contain .subtit_area {position:absolute;top:0;left:300px;height:130px;width:900px;} #contain .contain .subtit_area h1 {font-size:34px;font-weight:700;padding-top:40px;} #contain .contain .subtit_area .web_locator {position:absolute;right:0;top:54px;} #contain .contain .subtit_area .web_locator span {display:inline-block;} #contain .contain .subtit_area .web_locator .home {font-size:16px;color:#888;} #contain .contain .subtit_area .web_locator .wdepth {font-size:16px;color:#888;padding-left:28px;background:url(../img/wdepth_arr.png) no-repeat 12px 50%;} #contain .contain .subtit_area .web_locator .wdepth:last-child {color:#445db2} #design {float:left;width: 900px;min-height:650px;margin:130px 0 100px;background: #fff;position:relative;} #design .visual {padding: 20px 0 40px;} #subVisual {position:relative;} #subVisual h1 {padding: 100px 0;font-size: 30px;font-weight: 600;color:#fff;text-align:center;} #subVisual h1 .en {display:block;padding-top: 8px;color:#fcdd4b;font-size: 17px;font-weight: 500;text-transform: uppercase;} #subVisual .visual .locator {display:none;} @keyframes naviEf { from {width: 0;} to {width: 100%;} } #blind{position:absolute;z-index:99998;top:0px;left:0px;width:100%;height:100%;background:rgba(0,0,0,0.7)} #dkleft{display:none;} #gotop, #gotop a{display:none !important} @keyframes mv00 { from {background-position:center 110px; } to {background-position:center 0px; } } @keyframes mv01 { from {top:100px; opacity:0;} to {top:170px; opacity:1;} } @keyframes mv02 { from {top:200px;opacity:0;} to {top:295px;opacity:1;} } @keyframes v_img { from {right:50px; opacity:0} to {right:0px; opacity:1} } @keyframes v_text { from {padding-left:30px; opacity:0} to {padding-left:0px; opacity:1} } @keyframes v_navi { from {margin-top:-20px; opacity:0} to {margin-top:0px; letter-spacing:-1px; opacity:1} } @keyframes con_bg { from {background:url(../img/sub_con_bg.png) repeat-x left -30px; } to {background:url(../img/sub_con_bg.png) repeat-x left 138px; } } } /*1240-1639*/ @media all and (min-width: 1240px) and (max-width: 1639px) { #divpop { display:none;} #mm-blocker{display:none} #popupWindow{position:absolute} #OpenLayer {position: absolute;top: 150px;left: 100px;z-index: 9999;background: #fff;padding: 10px;border-radius: 5px;border: 1px solid #ccc;box-shadow: 5px 5px 20px rgba(0,0,0,0.3);text-align: right;} #OpenLayer > a {clear: both;font-size: 14px;} #OpenLayer #TodayClose {float: left;margin-right: 20px;} #mobileCard {display: none;} /* header */ #header{overflow:hidden;position:absolute;top: 0;left: 0;z-index:30002;width:100%;height: auto;} #header.sel {height: 500px;border-bottom: 3px solid #0d60dc;box-sizing: border-box;background:#fff;} #header .header {position:relative;margin: 0;text-align: center;} #header h1{position:absolute;top: 54px;left:30px;} #header h1 a {display: inline-block;width: 200px;height: 38px;margin-top:0;line-height: 1em;background:url(../img/logo.png) no-repeat 0 0;background-size:100%;} #header h1 > img {margin: 0 0 0 7px;height: 35px; vertical-align: middle;} #header .header .h_right {display: block;float: right;margin-top: 38px;margin-right: 30px;} #header button{display:none} #header .btn-menu {display:none;} /**/ #header nav {float:left;} #header nav::after {content: "";clear: both;} #gnb{} #gnb .gnb{} #gnb .depth1 {overflow:hidden;height: auto;} #gnb .depth1 > li {float:left;text-align: center;} #gnb .depth1 > li > a{position:relative;display:block;height: auto;padding: 20px 20px 20px;margin: 0;line-height: initial;font-size:20px;font-weight:400;color:#fff;box-sizing: border-box;} #gnb .depth1 > li > a::after {content: "";position:absolute;top: 50%;left: 0;display:none;margin-top: -5px;width: 100%;height: 10px;background: #0d60dc;opacity: 0.1;animation: menuOn 1s ease 1;} #gnb .depth1 > li > a:hover::after {display:block;} #gnb .depth1 > li > a em{position:absolute;top:23px;right:0;display:block;margin:-10px 0 0 0;width:1px;height:16px;background:#ccc;display:none} #gnb .depth1 > li.sel > a {color:#558fff} #gnb .depth1 > li:last-child > a {padding-right:0;} #gnb .depth2{display:none;overflow:hidden;position:absolute;top: 80px;left: 0;z-index: 10;width: 100%;min-height: 150px !important;padding: 25px 0 45px 25%;box-sizing: border-box;text-align:center;} #gnb .depth2 li {float:left;width: 33.33333%;} #gnb .depth2 li a{display:block;padding:18px 5px;line-height:15px;font-size:15px;color:#333;border-bottom: 1px solid #ddd;margin:0 50px 0 0;text-align: left;} #gnb .depth2 li a:hover{font-size: 15px;color:#fff;background:#2e4287 url(../img/depth2_arr.png) no-repeat 97% 50%;} #gnb .g1 .depth2 {background: url(../img/g1_icon.png) no-repeat 5% bottom;} #gnb .g2 .depth2 {background: url(../img/g2_icon.png) no-repeat 8% bottom;} #gnb .g3 .depth2 {background: url(../img/g3_icon.png) no-repeat 6% bottom;} #gnb .g4 .depth2 {background: url(../img/g4_icon.png) no-repeat 7% bottom;} #gnb .g5 .depth2 {background: url(../img/g5_icon.png) no-repeat 7% bottom;} #gnb .g6 .depth2 {background: url(../img/g6_icon.png) no-repeat 7% bottom;} #gnb .g7 .depth2 {background: url(../img/g7_icon.png) no-repeat 7% bottom;} #gnb .g8 .depth2 {background: url(../img/g8_icon.png) no-repeat 9% bottom;} #gnb .nav_bg {display:none;position:absolute;top: 54px;left: 0;width: 100%;height: 270px;background: #fff;} @keyframes menuOn { from {width: 0;} to {width: 100%;} } #header .etc_btn {position: absolute;right: 0;top:0} #header .etc_btn li {display:inline-block;} #header .etc_btn li a {margin-right: 13px;font-size: 15px;line-height: 100px;font-weight:400;color:#fff;text-transform: uppercase;} #header .etc_btn li:last-child a {margin-right: 0;} #header .etc_btn li.etc04 a {display:inline-block;width:30px;height:30px;background:url(../img/btn_h_search.png) no-repeat center 50%;text-indent:-99999em} #header .etc_btn li.etc05 a {display:inline-block;width:30px;height:30px;background:url(../img/btn_h_sitemap.png) no-repeat center 50%;text-indent:-99999em} #header.fix_menu {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.fix_menu #gnb .depth1 > li > a {color:#333;} #header.fix_menu #gnb .depth1 > li.sel > a {color:#2e4287} #header.fix_menu h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.fix_menu h1 a.logo_is {background-image: url(../img/logo_island_on.png);} #header.fix_menu .etc_btn li a {color:#333;} #header.fix_menu .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.fix_menu .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #header.header_active {background:#fff;border-bottom:1px solid #ddd;} #header.header_active #gnb .depth1 > li > a {color:#333;} #header.header_active #gnb .depth1 > li.sel > a {color:#2e4287} #header.header_active h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.header_active h1 a.logo_is {background-image: url(../img/logo_island.png);} #header.header_active .etc_btn li a {color:#333;} #header.header_active .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.header_active .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #header.bg_white {background:#fff;border-bottom:1px solid #ddd;} #header.bg_white #gnb .depth1 > li > a {color:#333;} #header.bg_white h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.bg_white h1 a.logo_is {background-image: url(../img/logo_island.png);} #header.bg_white .etc_btn li a {color:#333;} #header.bg_white .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.bg_white .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #header .etc_wp {width:100%;position:relative;height:45px;border-bottom: 1px solid rgba(255, 255, 255, .3);} #header .etc_wp .etc_btn {top:8px;right: 30px;} #header .etc_wp .etc_btn li a {line-height: 0;} #header.bg_white .etc_wp {border-bottom: 1px solid #ddd;} #allbg{position:fixed;z-index:30000;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.2);display:none} /**/ #menu{position:absolute;z-index:10;top:0;right:0;background: #252525;} #menu a{display:block;width: 50px;height: 50px;background:url(../img/menu.png) no-repeat 50%;text-indent:-9999em;overflow:hidden} /**/ #container {position: relative;padding-top: 100px;} /*메인visual*/ #section0 .mVisual {height:100%;} #section0 .mVisual .swiper-container {width: 100%;height: 100%;} #section0 .mVisual .swiper-slide {text-align: center;background: #fff;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center; justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center; align-items: center;} #section0 .mVisual .swiper-slide .mvText{margin-top: -180px;font-size: 60px;font-weight:100;color:#fff;line-height:76px;} #section0 .mVisual .swiper-slide .mvText strong {display:block;font-weight:700;} #section0 .mVisual .swiper-slide.mvimg01 {background: url(../img/mvimg01.png) no-repeat 0 0;background-size:cover;} #section0 .mVisual .swiper-slide.mvimg02 {background: url(../img/mvimg02.png) no-repeat 0 0;background-size:cover;} #section0 .mVisual .swiper-slide.mvimg03 {background: url(../img/mvimg03.png) no-repeat 0 0;background-size:cover;} #section0 .mVisual .mvBtn_wp {position:absolute;top:50%;left:0;width:100%;height:44px;} #section0 .mVisual .mvBtn_wp .swiper-pagination-fraction {padding-right: 40px;} #section0 .mVisual .mvBtn_wp .mvBtn {width:360px;margin:0 auto;position:relative;} #section0 .mVisual .mvBtn_wp .mvBtn img {padding:10px 0;} #section0 .mVisual .mvBtn_wp .ctrBtn {position: absolute;left: 50%;top: 9px;z-index: 99;margin-left: 10px;} #section0 .mVisual .mvBtn_wp .ctrBtn .start {display:inline-block;width:20px;height:20px;line-height:20px;background:url(../img/v_start.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;margin-right:1px} #section0 .mVisual .mvBtn_wp .ctrBtn .stop {display:inline-block;width:20px;height:20px;line-height:20px;background:url(../img/v_stop.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;} /*메인-검색*/ #section0 .mVisual .search {position:absolute;top:70%;left:0;width:100%;text-align: center;z-index: 99999;} #section0 .mVisual .search .search_wp { width:1200px;margin:0 auto;box-sizing:border-box;position:relative;padding: 14px 0;border-left: 1px solid #fff;background-color: rgba( 255, 255, 255, 0.8 );} #section0 .mVisual .search fieldset{} #section0 .mVisual .search fieldset label{width:0;font-size:0;overflow:hidden;} #section0 .mVisual .search fieldset label.label_st {position: absolute;top: 20px;left: 0px;width: 125px;color: #1e2c5d;font-size: 24px;font-weight: 500;background: url(../img/ms_tit_line.png) no-repeat right 50%;} _::-moz-svg-foreign-content, :root #section0 .mVisual .search fieldset select{position:relative;top:10px} #section0 .mVisual .search fieldset input{float:left;width:980px;height:42px !important;line-height:42px !important;font-size:17px !important;padding: 0 20px !important;margin: 0 80px 0 125px;border:0 !important;color:#333;background:none} #section0 .mVisual .search fieldset button{position: absolute;right: 0;top: 0;width: 70px;height: 70px;background:#fff url(../img/m_search_icon.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em} /*메인스크롤 아이콘*/ #section0 .mVisual .main_scroll {position:absolute;top:90%;left:0;width:100%;text-align: center;z-index: 99999;} #section0 .mVisual .main_scroll .main_scroll_wp {display:inline-block;width:94px;height:60px;background:url(../img/main_scroll.png) no-repeat 0 0;text-indent:-99999em;} /*2026여수세계섬박람회*/ #section0 .mVisual .banner_2026 {position:absolute;top:130px;right:75px;z-index:1;} #section0 .mVisual .banner_2026 a {display:block;} #section0 .mVisual .banner_2026 a > .b2026_s {display:none;} /*공지사항-문화프로그램*/ #section1 .mCont01 {width:1200px;margin:0 auto;padding-top:100px;overflow:hidden;} #section1 .mCont01 .mBoard {float:left;width:680px;padding-right:60px;} #section1 .mCont01 .mBoard .tab.list{height:160px} #section1 .mCont01 .mBoard .tab.list ul{position:relative;} #section1 .mCont01 .mBoard .tab.list ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li{float:left;width:50%;} #section1 .mCont01 .mBoard .tab.list li a{float:left;position:relative;margin-left: 20px;text-decoration:none;} #section1 .mCont01 .mBoard .tab.list li:first-child a {float:right;margin-right: 20px;} #section1 .mCont01 .mBoard .tab.list li a span{display:inline-block;font-size:38px;font-weight:600;color:#888;cursor:pointer} #section1 .mCont01 .mBoard .tab.list li ul{width:100%;position:absolute;top:96px;left:0;list-style:none;border:0;margin:0;padding:0;} #section1 .mCont01 .mBoard .tab.list li ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li li{float:none;position:relative;padding:3% 0 3% 78px;width: 100%;box-sizing: border-box;border-bottom:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li:first-child {border-top:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li a{display:inline-block;float:left !important;color:#222 !important;font-weight:400;font-size:19px;width:90%;margin-left: 0;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;transition:all 0.1s;} #section1 .mCont01 .mBoard .tab.list li li:first-child a {float:left;} #section1 .mCont01 .mBoard .tab.list li li strong.kind {position:absolute;top:32px;left:0;width:60px;height:28px;line-height:30px;border:1px solid #000;font-size:15px;font-weight:500;color:#555;text-align:center;} #section1 .mCont01 .mBoard .tab.list li li a:hover, #section1 .mCont01 .mBoard .tab.list li li a:active, #section1 .mCont01 .mBoard .tab.list li li a:focus{color:#466db8 !important;text-decoration:none} #section1 .mCont01 .mBoard .tab.list li li time, #section1 .mCont01 .mBoard .tab.list li li .time{display:block;font-size:18px;color:#222;} #section1 .mCont01 .mBoard .tab.list li li.more{position:absolute;top:-30px;right:0;border:0 !important;background:transparent} #section1 .mCont01 .mBoard .tab.list li.active a{color:#333} #section1 .mCont01 .mBoard .tab.list li.active a span{font-size:38px;font-weight:600;color:#222;position:relative;} #section1 .mCont01 .mBoard .tab.list li a span::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section1 .mCont01 .mBoard .tab.list li.active a span::after {width:100%;transition:all 0.5s} #section1 .mCont01 .mBoard .tab.list.jx{height:auto} #section1 .mCont01 .mBoard .tab.list.jx ul{border:0} #section1 .mCont01 .mBoard .tab.list.jx li{float:none;position:relative} #section1 .mCont01 .mBoard .tab.list.jx li a{float:none;display:block;font-weight:bold;color:#333;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important} #section1 .mCont01 .mBoard .tab.list.jx li ul{position:static;display:block;left:0;top:0;padding:5px 0} #section1 .mCont01 .mBoard .tab.list.jx li li a{display:inline;border:0 !important;background:none !important;font-weight:normal} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore {position:absolute;bottom:-110px;left:50%;margin-left:-75px;padding:0;border:none;width:150px;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a {display:block;width:100%;height:64px;line-height:66px;margin-right: 0;border:1px solid #ddd;font-size:20px;color:#222;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} /*팝업존*/ #section1 .mCont01 .mPop {float:left;width:460px;padding-top:45px;} #section1 .mCont01 .mPop .swiper-slide {width:460px;height:560px;margin-bottom:30px;background-color: #fff;} #section1 .mCont01 .mPop .swiper-slide a {display:block;height: 100%;} #section1 .mCont01 .mPop .swiper-slide a img {max-width:100%;height: 100%;} #section1 .mCont01 .mPop .swiper-pagination-fraction, #section1 .mCont01 .mPop .swiper-pagination-custom, #section1 .mCont01 .mPop .swiper-container-horizontal > #section1 .mCont01 .mPop .swiper-pagination-bullets {width: 50px;color: #333;margin: 0 auto 0;position: relative;padding-top: 10px;} #section1 .mCont01 .mPop .pzBtn_wp {height:35px;position:relative;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn {position: absolute;top: 0;left: 0;width: 100%;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn img {padding:10px 0;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-prev, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-next {left: 125px;right: auto;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-next, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-prev {right: 125px;left: auto;} /*여수시립도서관 소개*/ #section2 {background: url(../img/bg_section2.png) no-repeat left bottom;} #section2 .mCont02 {} #section2 .mCont02 h2.tit {font-size:38px;font-weight:700;color:#fff;padding-bottom:25px;text-align:center;} #section2 .mCont02 .tit_text {font-size:23px;line-height:30px;color:#fff;padding-bottom:50px;text-align:center;} #section2 .mCont02 .mIntro_wp {width:100%;height:470px;position:relative;} #section2 .mCont02 .mIntro_wp .mIntro {position:absolute;width:100%;top:0;left:50%;margin-left:-600px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area {height:470px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info {position: absolute;top: 0;left: 0;z-index: 999;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit {font-size:48px;font-weight:100;color:#fff;line-height:1.2em} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit strong {display:block;font-size:80px;font-weight:900;color:#464f73;margin-bottom:10px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day {padding-top:35px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .stit {font-size:20px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li {float:left;width:46px;height:44px;line-height:44px;border-radius:5px;background:#fff;margin:0 5px 5px 0;font-size:20px;font-weight:500;color:#1e2c5d;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more {width:102px;height:44px;line-height:44px;border:1px solid rgba(255, 255, 255, .5);box-sizing:border-box;border-radius:5px;background:#1e2c5d;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more a {display:block;font-size:17px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time {padding-top:20px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time .stit {font-size:20px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl {padding-bottom:6px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dt {font-size:18px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dd {font-size:18px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom {padding-top:10px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit {font-size:18px;font-weight:500;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit a {color:#ff8400;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li {float:left;margin-right:24px;font-size:15px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span {display:inline-block;border-radius:50%;width:24px;height:24px;line-height:24px;border:1px solid #fff;margin-right:5px;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span.oth {border-radius:24px;width:44px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img {margin-left: 600px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img .slick-slide {width:600px !important;margin-right: 50px; -webkit-box-shadow: 20px 20px 40px 0px rgba(0,0,0,0.3); -moz-box-shadow: 20px 20px 40px 0px rgba(0,0,0,0.3); box-shadow: 20px 20px 40px 0px rgba(0,0,0,0.3);} /*주요서비스 안내*/ #section3 {background: url(../img/bg_section3.png) no-repeat center top;} #section3 .mCont03 {} #section3 .mCont03 h2.tit {font-size:38px;font-weight:700;color:#fff;margin-top:-200px;padding-bottom:35px;text-align:center;} #section3 .mCont03 .tit_text {font-size:23px;line-height:30px;color:#fff;text-align:center;} #section3 .mCont03 .mIcon {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index:1;} #section3 .mCont03 .mIcon ul {overflow: hidden;height: 100%;} #section3 .mCont03 .mIcon ul li {float:left;width:16.66666%;height: 100%;border-left: 1px solid rgba(255,255,255,0.2);box-sizing:border-box;} #section3 .mCont03 .mIcon ul li a {display:block;height: 100%;padding-top: 560px;text-align:center;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a:hover {background-color: rgba( 0, 0, 0, 0.2 );} #section3 .mCont03 .mIcon ul li a span {display: inline-block;padding:130px 5px 0;font-size:22px;color:#fff;} #section3 .mCont03 .mIcon ul li a span.micon01 {background: url(../img/micon01.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon02 {background: url(../img/micon02.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon03 {background: url(../img/micon03.png) no-repeat center 12px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon04 {background: url(../img/micon04.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon05 {background: url(../img/micon05.png) no-repeat center 12px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a span.micon06 {background: url(../img/micon06.png) no-repeat center 20px;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a:hover span.micon01 {background: url(../img/micon01.png) no-repeat center 8px;} #section3 .mCont03 .mIcon ul li a:hover span.micon02 {background: url(../img/micon02.png) no-repeat center 8px;} #section3 .mCont03 .mIcon ul li a:hover span.micon03 {background: url(../img/micon03.png) no-repeat center 0;} #section3 .mCont03 .mIcon ul li a:hover span.micon04 {background: url(../img/micon04.png) no-repeat center 8px;} #section3 .mCont03 .mIcon ul li a:hover span.micon05 {background: url(../img/micon05.png) no-repeat center 0;} #section3 .mCont03 .mIcon ul li a:hover span.micon06 {background: url(../img/micon06.png) no-repeat center 8px;} /*추천신착도서*/ #section4 {background: url(../img/bg_section4.png) repeat-y center top;} #section4 .mCont04 {} #section4 .mCont04 .in {width:1200px;margin:0 auto;padding-top: 110px;overflow:hidden;} #section4 .mCont04 .in #mBook {float:left;width:850px;background:#fff;position:relative;} #section4 .mCont04 .in #mBook > div {} #section4 .mCont04 .in #mBook > div > ul {overflow:hidden;display:none;padding-top: 15%;margin-bottom: 10%;} #section4 .mCont04 .in #mBook .tab_on > ul {display:block;} #section4 .mCont04 .in #mBook .btn_mMore {display:none;margin:0 auto;width:152px;height:64px;line-height:66px;border:1px solid #ddd;font-size:20px;color:#222;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section4 .mCont04 .in #mBook .tab_on .btn_mMore {display:block;} #section4 .mCont04 .in #mBook .tab_on .btn_mMore:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} #section4 .mCont04 .in #mBook h2 {position:absolute;top: 3px;z-index: 109;height: 52px;line-height: 52px;text-align:center;color:#fff;font-size: 38px;font-weight:700;} #section4 .mCont04 .in #mBook h2 > a {display:block;color:#ccc;} #section4 .mCont04 .in #mBook h2 > a::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section4 .mCont04 .in #mBook .tab_on h2 > a {color: #333;position:relative;} #section4 .mCont04 .in #mBook .tab_on h2 > a::after {width:100%;transition:all 0.5s} #section4 .mCont04 .in #mBook .mBook01 h2 {left: 50%;margin-left:-160px;} #section4 .mCont04 .in #mBook .mBook02 h2 {left: 50%;margin-left:20px;} #section4 .mCont04 .in #mBook > div > ul li {float: left;width:210px;margin-right:70px;font-size: 16px;color:#333;box-sizing: border-box;} #section4 .mCont04 .in #mBook > div > ul li:last-child {margin-right:0;} #section4 .mCont04 .in #mBook > div > ul li a {display:block;} #section4 .mCont04 .in #mBook > div > ul li a .mBimg {display:inline-block;width:210px;height:310px;margin-bottom:35px;overflow:hidden;transition:all 0.2s; -webkit-box-shadow: 30px 30px 42px 0px rgba(0,0,0,0.3); -moz-box-shadow: 30px 30px 42px 0px rgba(0,0,0,0.3); box-shadow: 30px 30px 42px 0px rgba(0,0,0,0.3);} #section4 .mCont04 .in #mBook > div > ul li a .mBimg:hover {margin-top:-10px;} #section4 .mCont04 .in #mBook > div > ul li a .mBimg img {width:100%;height:100%;transition:all 0.2s;} #section4 .mCont04 .in #mBook > div > ul li a strong {display:block;width:210px;font-size:20px;font-weight:500;color:#333;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;text-align:center;} #section4 .mCont04 .in #mBook > div > ul li a strong i {display:block;font-size:17px;font-weight:400;color:#666;font-style:normal;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;} /*영화*/ #section4 .mCont04 .in #mMovie {float:left;width:345px;margin-left:5px;} #section4 .mCont04 .in #mMovie h2 {font-size:38px;font-weight:700;color:#fff;text-align:center;} #section4 .mCont04 .in #mMovie .btn_mMore {display:block;margin:0 auto;width:152px;height:64px;line-height:66px;border:1px solid #fff;font-size:20px;color:#fff;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section4 .mCont04 .in #mMovie .btn_mMore:hover {background:#fff;border:1px solid #fff;color:#1e2c5d !important;} #section4 .mCont04 .in #mMovie .swiper-container {margin-left: auto;margin-right: auto;position: relative;overflow: hidden;list-style: none;padding: 0;z-index: 1;width: 100%;;padding-top:72px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide {position:relative;margin-bottom:35px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a {display: block;width:100%;background: #1e2c5d;text-align:center;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a img {width:260px;height:370px;margin:0 auto; -webkit-box-shadow: 15px 30px 30px 0px rgba(0,0,0,0.3); -moz-box-shadow: 15px 30px 30px 0px rgba(0,0,0,0.3); box-shadow: 15px 30px 30px 0px rgba(0,0,0,0.3);} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mark {position:absolute;top:0;left:43px;padding:8px 24px;font-size:16px;letter-spacing:-1px;color:#fff;background:#3a6ae3;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivTit {width:70%;padding:0 15%;font-size:19px;color:#fff;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;margin-top:30px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivDay {width:70%;padding:0 15%;font-size:17px;color:#aaa;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp {position:absolute;top:20px;left:0;width:100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn {position: absolute;top: 0;left: 0;width: 100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn img {padding:10px 0;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-prev, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-next {left: 70px;right: auto;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-next, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-prev {right: 70px;left: auto;} /*기타*/ #section5 {background: url(../img/bg_section5.png) no-repeat center top;} #section5 .mCont05 {width:1200px;margin:0 auto;padding-top: 100px;overflow:hidden;} #section5 .mCont05 .mEtc01 {float:left;width:380px;height:460px;margin-right:20px;background: url(../img/bg_mEtc01.png) no-repeat center top;transition:all 0.2s;} #section5 .mCont05 .mEtc01:hover {background: url(../img/bg_mEtc01_on.png) no-repeat center top;} #section5 .mCont05 .mEtc01 a {display:block;padding-left:40px;box-sizing:border-box;height:100%;background: url(../img/go_arr01.png) no-repeat 85% 90%;transition:all 0.3s;} #section5 .mCont05 .mEtc01 a:hover {background: url(../img/go_arr01.png) no-repeat 90% 90%;} #section5 .mCont05 .mEtc01 a .tit {display:block;font-size:23px;font-weight:700;color:#fff;padding-top:36px;margin-bottom:12px;} #section5 .mCont05 .mEtc01 a .tit_text {display:block;font-size:18px;line-height:22px;color:#fff;} #section5 .mCont05 .mEtc02 {float:left;width:380px;height:460px;margin-right:20px;background:#fff;} #section5 .mCont05 .mEtc02 .tit {display:block;padding-left:40px;box-sizing:border-box;font-size:23px;font-weight:700;color:#222;padding-top:36px;} #section5 .mCont05 .mEtc02 ul {padding:0 40px;} #section5 .mCont05 .mEtc02 ul li {padding:26px 0;border-bottom:1px solid #eaeaea;} #section5 .mCont05 .mEtc02 ul li:last-child {border-bottom:none;} #section5 .mCont05 .mEtc02 ul li a {display:inline-block;width:90%;font-size:17px;color:#222;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;transition:all 0.1s;} #section5 .mCont05 .mEtc02 ul li a:hover {color:#466db8;} #section5 .mCont05 .mEtc02 ul li .date {display:block;font-size:16px;color:#757575;} #section5 .mCont05 .mEtc02 .btn_mMore {display:block;width:150px;height:44px;line-height:44px;margin:0 auto;border:1px solid #ddd;font-size:17px;color:#222;text-align:center;transition:all 0.2s;} #section5 .mCont05 .mEtc02 .btn_mMore:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} #section5 .mCont05 .mEtc03 {float:right;width:800px;} #section5 .mCont05 .mEtc03 .mBan01 {height:220px;margin-bottom:20px;background:#d94200;transition:all 0.2s;} #section5 .mCont05 .mEtc03 .mBan01:hover {background:#c03a00;} #section5 .mCont05 .mEtc03 .mBan01 a {display:block;height:100%;padding:0 0 0 40px;background: url(../img/go_arr01.png) no-repeat 85% 80%;transition:all 0.3s;} #section5 .mCont05 .mEtc03 .mBan01 a:hover {background: url(../img/go_arr01.png) no-repeat 90% 80%;} #section5 .mCont05 .mEtc03 .mBan01 a .tit {display:block;padding-top:36px;margin-bottom:12px;font-size:18px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan01 a .tit_text {display:block;line-height:22px;font-size:18px;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 {height:220px;background:#1e2c5d;transition:all 0.2s;} #section5 .mCont05 .mEtc03 .mBan02:hover {background:#152045;} #section5 .mCont05 .mEtc03 .mBan02 a {display:block;height:100%;padding:0 0 0 40px;background: url(../img/go_arr01.png) no-repeat 85% 80%;transition:all 0.3s;} #section5 .mCont05 .mEtc03 .mBan02 a:hover {background: url(../img/go_arr01.png) no-repeat 90% 80%;} #section5 .mCont05 .mEtc03 .mBan02 a .tit {display:block;padding-top:36px;margin-bottom:12px;font-size:18px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 a .tit_text {display:block;line-height:22px;font-size:17px;color:#fff;} /**/ #foot_section .mFooter {} #foot_section .mFooter .f_menu {background:#1a1c20;height:60px;line-height:60px;} #foot_section .mFooter .f_menu .in {width:1200px;margin:0 auto;} #foot_section .mFooter .f_menu .in ul {} #foot_section .mFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #foot_section .mFooter .f_menu .in ul li a {display:block;font-size:15px;color:#ccc;transition:all 0.2s;} #foot_section .mFooter .f_menu .in ul li a:hover, #foot_section .mFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #foot_section .mFooter .f_menu .in ul li:first-child a {color:#e85c31} #foot_section .mFooter .f_info{background:#121316;padding:30px 0 50px;} #foot_section .mFooter .f_info .in {width:1200px;margin:0 auto;position:relative;} #foot_section .mFooter .f_info .in ul li {margin-bottom:1px;color:#aaa;} #foot_section .mFooter .f_info .in ul li br {display:none;} #foot_section .mFooter .f_info .in ul li strong {display:inline-block;width:55px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:20px;font-size:inherit;font-weight:400;} #foot_section .mFooter .f_info .in ul li span.tel {font-size:14px;color:#aaa;margin-left:20px;} #foot_section .mFooter .f_info .in ul li span.fax {font-size:14px;color:#aaa;margin-left:20px;} #foot_section .mFooter .f_info .in .copyright {font-size:15px;color:#aaa;padding-top:20px;} #foot_section .mFooter .f_info .in .f_logo {position:absolute;top:0;right:0;} /**/ #s_foot_section .sFooter {} #s_foot_section .sFooter .f_menu {background:#1a1c20;height:60px;line-height:60px;} #s_foot_section .sFooter .f_menu .in {width:1200px;margin:0 auto;} #s_foot_section .sFooter .f_menu .in ul {} #s_foot_section .sFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #s_foot_section .sFooter .f_menu .in ul li a {display:block;font-size:15px;color:#ccc;transition:all 0.2s;} #s_foot_section .sFooter .f_menu .in ul li a:hover, #s_foot_section .sFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #s_foot_section .sFooter .f_menu .in ul li:first-child a {color:#e85c31} #s_foot_section .sFooter .f_info{background:#121316;padding:30px 0 50px;} #s_foot_section .sFooter .f_info .in {width:1200px;margin:0 auto;position:relative;} #s_foot_section .sFooter .f_info .in ul li {margin-bottom:1px;color:#aaa;} #s_foot_section .sFooter .f_info .in ul li br {display:none;} #s_foot_section .sFooter .f_info .in ul li strong {display:inline-block;width:55px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:20px;font-size:inherit;font-weight:400;} #s_foot_section .sFooter .f_info .in ul li span.tel {font-size:14px;color:#aaa;margin-left:20px;} #s_foot_section .sFooter .f_info .in ul li span.fax {font-size:14px;color:#aaa;margin-left:20px;} #s_foot_section .sFooter .f_info .in .copyright {font-size:15px;color:#aaa;padding-top:20px;} #s_foot_section .sFooter .f_info .in .f_logo {position:absolute;top:0;right:0;} /**/ #contain{width: 100%;} #contain .contain {margin: 0 auto;max-width:1200px;overflow: hidden;position:relative;} #contain + #footer .contact {display:none;} /* 서브비주얼 */ #contain #subVisual {height: 300px;padding-top: 100px;background:url(../img/sub_v_img.png) no-repeat 50% 0;background-size: cover;text-align: center;} #contain #subVisual .sub_slogan {padding-top: 74px;max-width: 1200px;margin: 0 auto;font-size: 46px;font-weight: 300;color: #fff;line-height:58px;text-align:center;} #contain #subVisual .sub_slogan strong {display:block;font-size:inherit;font-weight:500;} /**/ #aside{float:left;width:250px;margin-right: 50px;padding-bottom: 50px;} #aside h2{height:130px;line-height: 130px;font-size:28px;font-weight:500;color:#fff;text-align:center;background: #1e2c5d} #aside ul{padding:0 0 0px 0} #aside ul > li > a{display:block;padding: 18px 15px;font-size:17px;font-weight: 400;color:#555;border-bottom:1px solid #ddd;border-top:0;background: url(../img/left_menu.png) no-repeat 95% 50%;transition:all 0.3s;} #aside ul > li > a:hover, #aside ul > li:hover > a {color: #2e4287;background:#efefef url(../img/left_menu.png) no-repeat 95% 50%;transition: all 0.3s;} #aside ul > li.sel > a, #aside ul > li.sel > a:hover{color:#fff;border: 0;border-bottom: 1px solid #ddd;background:#2e4287 url(../img/left_menu_on.png) no-repeat 95% 50%;transition:all 0.5s} #aside ul > li ul{padding:12px 10px 8px 20px;border:1px solid #ddd; background:#fafafa; border-top:0;} #aside ul > li li a{display:block;border:0;font-size:15px; height:auto;line-height:22px; padding:0; margin:0;color:#888; padding-bottom:4px; border-bottom:0;background:none} #aside ul > li li:last-child a{border:0} #aside ul > li li a:hover, #aside ul > li li a.sel{font-size:15px;color:#2e4287; border:0;background:none} #aside ul > li li a.sel:before { content:'→'; padding-right:3px; font-family:'dotum';} #aside .sub_quick { overflow:hidden; padding:16px 4px;} #aside .sub_quick a { float:left; width:33.3%; display:block; padding:68px 0 5px 0; background:url(../img/sub_quick01.png) no-repeat center top; font-size:13px; text-align:center; } #aside .sub_quick a.a02 { background:url(../img/sub_quick02.png) no-repeat center top;} #aside .sub_quick a.a03 { background:url(../img/sub_quick03.png) no-repeat center top;} #aside .sub_quick a:hover { opacity:.8;} /**/ #contain .contain .subtit_area {position:absolute;top:0;left:300px;height:130px;width:900px;} #contain .contain .subtit_area h1 {font-size:34px;font-weight:700;padding-top:40px;} #contain .contain .subtit_area .web_locator {position:absolute;right:0;top:54px;} #contain .contain .subtit_area .web_locator span {display:inline-block;} #contain .contain .subtit_area .web_locator .home {font-size:16px;color:#888;} #contain .contain .subtit_area .web_locator .wdepth {font-size:16px;color:#888;padding-left:28px;background:url(../img/wdepth_arr.png) no-repeat 12px 50%;} #contain .contain .subtit_area .web_locator .wdepth:last-child {color:#445db2} #design {float:left;width: 900px;min-height:650px;margin:130px 0 100px;background: #fff;position:relative;} #design .visual {padding: 20px 0 40px;} #subVisual {position:relative;} #subVisual h1 {padding: 100px 0;font-size: 30px;font-weight: 600;color:#fff;text-align:center;} #subVisual h1 .en {display:block;padding-top: 8px;color:#fcdd4b;font-size: 17px;font-weight: 500;text-transform: uppercase;} #subVisual .visual .locator {display:none;} @keyframes naviEf { from {width: 0;} to {width: 100%;} } #blind{position:absolute;z-index:99998;top:0px;left:0px;width:100%;height:100%;background:rgba(0,0,0,0.7)} #dkleft{display:none;} #gotop, #gotop a{display:none !important} @keyframes mv00 { from {background-position:center 110px; } to {background-position:center 0px; } } @keyframes mv01 { from {top:100px; opacity:0;} to {top:170px; opacity:1;} } @keyframes mv02 { from {top:200px;opacity:0;} to {top:295px;opacity:1;} } @keyframes v_img { from {right:50px; opacity:0} to {right:0px; opacity:1} } @keyframes v_text { from {padding-left:30px; opacity:0} to {padding-left:0px; opacity:1} } @keyframes v_navi { from {margin-top:-20px; opacity:0} to {margin-top:0px; letter-spacing:-1px; opacity:1} } @keyframes con_bg { from {background:url(../img/sub_con_bg.png) repeat-x left -30px; } to {background:url(../img/sub_con_bg.png) repeat-x left 138px; } } } @media all and (min-width: 768px) and (max-width: 1239px) { #divpop { display:none;} #mm-blocker{display:none} #popupWindow{position:absolute} #hCheon {position:relative;top:0px;padding:0; margin:0;width:100%;} #OpenLayer {position: absolute;top: 180px;left: 100px;z-index: 9999;background: #fff;padding: 10px;border-radius: 5px;border: 1px solid #ccc;box-shadow: 5px 5px 20px rgba(0,0,0,0.3);text-align: right;} #OpenLayer > a {clear: both;font-size: 14px;} #OpenLayer #TodayClose {float: left;margin-right: 20px;} #mobileCard {display: none;} /* header */ #header{overflow:hidden;position:absolute;top: 0;left: 0;z-index:30002;width:100%;border-bottom: 1px solid #ddd;} #header.sel {height: 500px;border-bottom: 3px solid #0d60dc;box-sizing: border-box;/*transition: all 0.4s cubic-bezier(0.785, 0.135, 0.150, 0.860);*/background:#fff;} #header .header {position:relative;} #header h1{display:block;padding: 11px 0;border-bottom: 1px solid #ddd;} #header h1 a {display: inline-block;margin-left:20px;width: 190px;height: 32px;line-height: 1em;background:url(../img/logo.png) no-repeat 0 0;background-size:100%;} #header h1 > img {margin: 0 0 0 7px;vertical-align: middle;} #header button{display:none} #header .btn-menu {display:none;} /**/ #header nav {} #header nav::after {content: "";clear: both;} #gnb{} #gnb .gnb{height: 45px;} #gnb .depth1 {overflow:hidden;} #gnb .depth1 > li {float: left;width: 14.2%;padding: 0 1%;text-align: center;box-sizing: border-box;} #gnb .depth1 > li > a{position:relative;display:block;padding: 10px 0;font-size:17px;font-weight:400;color:#fff;letter-spacing: -0.4px;box-sizing: border-box;} #gnb .depth1 > li > a::after {content: "";position:absolute;top: 50%;left: 0;display:none;margin-top: -4px;width: 100%;height: 8px;background: #1e2c5d;opacity: 0.1;animation-name: menuOn; animation-duration: 1s;} #gnb .depth1 > li > a:hover::after {display:block;} #gnb .depth1 > li.sel > a {color: #558fff;} #gnb .depth1 > li > a em{position:absolute;top:23px;right:0;display:block;margin:-10px 0 0 0;width:1px;height:16px;background:#ccc;display:none} #gnb .depth2{display:none;overflow:hidden;position:absolute;top: 96px;left: 0;z-index: 10;width: 98%;min-height: 150px !important;padding: 25px 0 25px 20%;margin: 0 auto;box-sizing: border-box;/*transition: all 0.4s cubic-bezier(0.785, 0.135, 0.150, 0.860);*/text-align:center;} #gnb .depth2 li {float:left;width: 33.33333%;} #gnb .depth2 li a{display:block;letter-spacing:-0.9px;padding:10px 3px;line-height:15px;font-size:15px;color:#333;border: 1px solid #ddd;margin: 5px} #gnb .depth2 li a:hover{font-size: 15px;color:#fff;background:#1e2c5d;border:1px solid #1e2c5d;} #gnb .g1 .depth2 {background: url(../img/g1_icon.png) no-repeat 2% bottom;background-size:116px;} #gnb .g2 .depth2 {background: url(../img/g2_icon.png) no-repeat 6% bottom;background-size:84px;} #gnb .g3 .depth2 {background: url(../img/g3_icon.png) no-repeat 5% bottom;background-size:100px;} #gnb .g4 .depth2 {background: url(../img/g4_icon.png) no-repeat 4% bottom;background-size:100px;} #gnb .g5 .depth2 {background: url(../img/g5_icon.png) no-repeat 5% bottom;background-size:90px;} #gnb .g6 .depth2 {background: url(../img/g6_icon.png) no-repeat 5% bottom;background-size:110px;} #gnb .g7 .depth2 {background: url(../img/g7_icon.png) no-repeat 6% bottom;background-size:84px;} #gnb .nav_bg {display:none;position:absolute;top: 54px;left: 0;width: 100%;height: 270px;background: #fff;/*transition-property: display;transition-duration: 1s;transition-timing-function: ease-out;*/} @keyframes menuOn { from {width: 0;} to {width: 100%;} } #header .etc_btn {position:absolute;top: 11px;right: 2%;} #header .etc_btn li {display:inline-block;} #header .etc_btn li a {padding-right: 15px;font-size: 14px;letter-spacing: -0.4px;font-weight: 400;color:#fff;text-transform: uppercase;} #header .etc_btn li:last-child a {padding: 0 0 0 15px;} #header .etc_btn li.etc04 a {display:inline-block;width:30px;height:30px;background:url(../img/btn_h_search.png) no-repeat center 50%;text-indent:-99999em} #header .etc_btn li.etc05 a {display:inline-block;width:30px;height:30px;background:url(../img/btn_h_sitemap.png) no-repeat center 50%;text-indent:-99999em} #header.fix_menu {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.fix_menu #gnb .depth1 > li > a {color:#333;} #header.fix_menu h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.fix_menu h1 a.logo_is {background-image: url(../img/logo_island.png);} #header.fix_menu .etc_btn li a {color:#333;} #header.fix_menu .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.fix_menu .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #header.header_active {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.header_active #gnb .depth1 > li > a {color:#333;} #header.header_active h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.header_active h1 a.logo_is {background-image: url(../img/logo_island.png);} #header.header_active .etc_btn li a {color:#333;} #header.header_active .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.header_active .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #header.bg_white {position:fixed; top: 0;background:#fff;border-bottom:1px solid #ddd;} #header.bg_white #gnb .depth1 > li > a {color:#333;} #header.bg_white h1 a {background:url(../img/logo_on.png) no-repeat 0 0;background-size:100%;} #header.bg_white h1 a.logo_is {background-image: url(../img/logo_island.png);} #header.bg_white .etc_btn li a {color:#333;} #header.bg_white .etc_btn li.etc04 a {background:url(../img/btn_h_search_on.png) no-repeat center 50%;} #header.bg_white .etc_btn li.etc05 a {background:url(../img/btn_h_sitemap_on.png) no-repeat center 50%;} #allbg{position:fixed;z-index:30000;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.2);display:none} /**/ #menu{position:absolute;z-index:10;top:0;right:0;background: #252525;} #menu a{display:block;width: 50px;height: 50px;background:url(../img/menu.png) no-repeat 50%;text-indent:-9999em;overflow:hidden} /**/ #container {position: relative;padding-top: 100px;} /*메인visual*/ #section0 .mVisual {height:100%;} #section0 .mVisual .swiper-container {width: 100%;height: 100%;} #section0 .mVisual .swiper-slide {text-align: center;background: #fff;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center; justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center; align-items: center;} #section0 .mVisual .swiper-slide .mvText{margin-top: -180px;font-size: 48px;font-weight:100;color:#fff;line-height:60px;} #section0 .mVisual .swiper-slide .mvText strong {display:block;font-weight:700;} #section0 .mVisual .swiper-slide.mvimg01 {background: url(../img/mvimg01.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .swiper-slide.mvimg02 {background: url(../img/mvimg02.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .swiper-slide.mvimg03 {background: url(../img/mvimg03.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .mvBtn_wp {position:absolute;top:50%;left:0;width:100%;height:44px;} #section0 .mVisual .mvBtn_wp .swiper-pagination-fraction {padding-right: 40px;} #section0 .mVisual .mvBtn_wp .mvBtn {width:360px;margin:0 auto;position:relative;} #section0 .mVisual .mvBtn_wp .mvBtn img {padding:10px 0;} #section0 .mVisual .mvBtn_wp .ctrBtn {position: absolute;left: 50%;top: 9px;z-index: 99;margin-left: 10px;} #section0 .mVisual .mvBtn_wp .ctrBtn .start {display:inline-block;width:20px;height:20px;line-height:20px;background:url(../img/v_start.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;margin-right:1px} #section0 .mVisual .mvBtn_wp .ctrBtn .stop {display:inline-block;width:20px;height:20px;line-height:20px;background:url(../img/v_stop.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;} /*메인-검색*/ #section0 .mVisual .search {position:absolute;top:66%;left:0;width:100%;text-align: center;z-index: 99999;} #section0 .mVisual .search .search_wp {margin:0 60px 0;box-sizing:border-box;position:relative;padding: 14px 0;border-left: 1px solid #fff;background-color: rgba( 255, 255, 255, 0.8 );} #section0 .mVisual .search fieldset{} #section0 .mVisual .search fieldset label{width:0;font-size:0;overflow:hidden;} #section0 .mVisual .search fieldset label.label_st {position: absolute;top: 20px;left: 0px;width: 125px;color: #1e2c5d;font-size: 22px;font-weight: 500;background: url(../img/ms_tit_line.png) no-repeat right 50%;} _::-moz-svg-foreign-content, :root #section0 .mVisual .search fieldset select{position:relative;top:10px} #section0 .mVisual .search fieldset input{float:left;width:65%;height:42px !important;line-height:42px !important;font-size:17px !important;padding: 0 20px !important;margin: 0 80px 0 125px;border:0 !important;color:#333;background:none} #section0 .mVisual .search fieldset button{position: absolute;right: 0;top: 0;width: 70px;height: 70px;background:#fff url(../img/m_search_icon.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em} /*메인스크롤 아이콘*/ #section0 .mVisual .main_scroll {position:absolute;top:90%;left:0;width:100%;text-align: center;z-index: 99999;} #section0 .mVisual .main_scroll .main_scroll_wp {display:inline-block;width:94px;height:60px;background:url(../img/main_scroll.png) no-repeat 0 0;text-indent:-99999em;} /*2026여수세계섬박람회*/ #section0 .mVisual .banner_2026 {position:absolute;top:130px;right:75px;z-index:1;} #section0 .mVisual .banner_2026 a {display:block;} #section0 .mVisual .banner_2026 a > .b2026 {display:none;} /*공지사항-문화프로그램*/ #section1 .mCont01 {margin:0 60px 0;padding-top: 130px;overflow:hidden;} #section1 .mCont01 .mBoard {float:left;width:60%;margin-right:2%;} #section1 .mCont01 .mBoard .tab.list{height: 530px !important;} #section1 .mCont01 .mBoard .tab.list ul{position:relative;} #section1 .mCont01 .mBoard .tab.list ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li{float:left;} #section1 .mCont01 .mBoard .tab.list li a{float:left;position:relative;text-decoration:none;} #section1 .mCont01 .mBoard .tab.list li:first-child a {float:right;margin-right: 10px;} #section1 .mCont01 .mBoard .tab.list li a span{display:inline-block;font-size:30px;font-weight:600;color:#888;cursor:pointer} #section1 .mCont01 .mBoard .tab.list li ul{width:100%;position:absolute;top:66px;left:0;list-style:none;border:0;margin:0;padding:0;} #section1 .mCont01 .mBoard .tab.list li ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li li{float:none;position:relative;padding:10px 0 10px 78px;width: 100%;box-sizing: border-box;border-bottom:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li:first-child {border-top:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li a{display:inline-block;float:left !important;color:#222 !important;font-weight:400;font-size:17px;width:90%;margin-left: 0;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;transition:all 0.1s;} #section1 .mCont01 .mBoard .tab.list li li:first-child a {float:left;} #section1 .mCont01 .mBoard .tab.list li li strong.kind {position:absolute;top:20px;left:0;width:60px;height:28px;line-height:30px;border:1px solid #000;font-size:15px;font-weight:500;color:#555;text-align:center;} #section1 .mCont01 .mBoard .tab.list li li a:hover, #section1 .mCont01 .mBoard .tab.list li li a:active, #section1 .mCont01 .mBoard .tab.list li li a:focus{color:#466db8 !important;text-decoration:none} #section1 .mCont01 .mBoard .tab.list li li time, #section1 .mCont01 .mBoard .tab.list li li .time{display:block;font-size:17px;color:#222;} #section1 .mCont01 .mBoard .tab.list li li.more{position:absolute;top:-30px;right:0;border:0 !important;background:transparent} #section1 .mCont01 .mBoard .tab.list li.active a{color:#333} #section1 .mCont01 .mBoard .tab.list li.active a span{font-size:30px;font-weight:600;color:#222;position:relative;} #section1 .mCont01 .mBoard .tab.list li a span::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section1 .mCont01 .mBoard .tab.list li.active a span::after {width:100%;transition:all 0.5s} #section1 .mCont01 .mBoard .tab.list.jx{height:auto} #section1 .mCont01 .mBoard .tab.list.jx ul{border:0} #section1 .mCont01 .mBoard .tab.list.jx li{float:none;position:relative} #section1 .mCont01 .mBoard .tab.list.jx li a{float:none;display:block;font-weight:bold;color:#333;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important} #section1 .mCont01 .mBoard .tab.list.jx li ul{position:static;display:block;left:0;top:0;padding:5px 0} #section1 .mCont01 .mBoard .tab.list.jx li li a{display:inline;border:0 !important;background:none !important;font-weight:normal} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore {position:absolute;bottom:-90px;left:50%;margin-left:-75px;padding:0;border:none;width:150px;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a {display:block;width:100%;height:58px;line-height:60px;margin-right: 0;border:1px solid #ddd;font-size:18px;color:#222;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} /*팝업존*/ #section1 .mCont01 .mPop {float:left;width:38%;padding-top:8px;} #section1 .mCont01 .mPop .swiper-slide {width:100%;height:420px;margin-bottom:20px;background-color: #fff;} #section1 .mCont01 .mPop .swiper-slide a {display:block;} #section1 .mCont01 .mPop .swiper-slide a img {width:100%;height:420px;} #section1 .mCont01 .mPop .swiper-pagination-fraction, #section1 .mCont01 .mPop .swiper-pagination-custom, #section1 .mCont01 .mPop .swiper-container-horizontal > #section1 .mCont01 .mPop .swiper-pagination-bullets {width: 50px;color: #333;margin: 0 auto 0;position: relative;padding-top: 10px;} #section1 .mCont01 .mPop .pzBtn_wp {height:35px;position:relative;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn {position: absolute;top: 0;left: 0;width: 100%;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn img {padding:10px 0;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-prev, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-next {left: 50px;right: auto;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-next, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-prev {right: 50px;left: auto;} @media all and (max-width: 1000px) { #section1 .mCont01 .mBoard {float:left;width:50%;margin-right:2%;} #section1 .mCont01 .mPop {float:left;width:48%;padding-top:8px;} } /*여수시립도서관 소개*/ #section2 {background: url(../img/bg_section2.png) no-repeat left bottom;} #section2 .mCont02 {} #section2 .mCont02 h2.tit {font-size:30px;font-weight:700;color:#fff;padding-bottom:20px;text-align:center;} #section2 .mCont02 .tit_text {font-size:19px;line-height:28px;color:#fff;padding-bottom:30px;text-align:center;} #section2 .mCont02 .mIntro_wp {width:100%;height:260px;position:relative;} #section2 .mCont02 .mIntro_wp .mIntro {position:absolute;width:100%;top:0;left:0;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area {} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info {position: absolute;top: 0;left: 20px;z-index: 999;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit {font-size:38px;font-weight:100;color:#fff;line-height:1.2em} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit strong {display:block;font-size:60px;font-weight:900;color:#464f73;margin-bottom:10px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day {padding-top:15px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .stit {font-size:18px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li {float: left;width: 36px;height: 34px;line-height: 34px;border-radius: 5px;background: #fff;margin: 0 5px 5px 0;font-size: 17px;font-weight: 500;color: #1e2c5d;text-align: center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more {width:96px;height:35px;line-height:34px;border:1px solid rgba(255, 255, 255, .5);box-sizing:border-box;border-radius:5px;background:#1e2c5d;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more a {display:block;font-size:15px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time {display:none;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time .stit {font-size:20px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl {padding-bottom:6px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dt {font-size:18px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dd {font-size:18px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom {padding-top:10px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit {font-size:18px;font-weight:500;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit a {color:#ff8400;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li {font-size:14px;color:#fff;margin-bottom:3px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span {display:inline-block;border-radius:50%;width:24px;height:24px;line-height:24px;border:1px solid #fff;margin-right:5px;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span.oth {border-radius:24px;width:44px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img {margin-left:50%} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img .slick-slide {margin-right: 30px; -webkit-box-shadow: 10px 10px 30px 0px rgba(0,0,0,0.3); -moz-box-shadow: 10px 10px 30px 0px rgba(0,0,0,0.3); box-shadow: 10px 10px 30px 0px rgba(0,0,0,0.3);} /*주요서비스 안내*/ #section3 {background: url(../img/bg_section3.png) no-repeat center top;} #section3 .mCont03 {} #section3 .mCont03 h2.tit {font-size:30px;font-weight:700;color:#fff;margin-top:-150px;padding-bottom:20px;text-align:center;} #section3 .mCont03 .tit_text {font-size:19px;line-height:28px;color:#fff;text-align:center;} #section3 .mCont03 .mIcon {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index:1;} #section3 .mCont03 .mIcon ul {overflow: hidden;height: 100%;} #section3 .mCont03 .mIcon ul li {float:left;width:16.66666%;height: 100%;border-left: 1px solid rgba(255,255,255,0.2);box-sizing:border-box;} #section3 .mCont03 .mIcon ul li a {display:block;height: 100%;padding-top: 450px;text-align:center;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a:hover {background-color: rgba( 0, 0, 0, 0.2 );} #section3 .mCont03 .mIcon ul li a span {display: inline-block;padding:120px 5px 0;font-size:18px;color:#fff;} #section3 .mCont03 .mIcon ul li a span.micon01 {background: url(../img/micon01.png) no-repeat center 20px;background-size:69px;} #section3 .mCont03 .mIcon ul li a span.micon02 {background: url(../img/micon02.png) no-repeat center 20px;background-size:77px;} #section3 .mCont03 .mIcon ul li a span.micon03 {background: url(../img/micon03.png) no-repeat center 12px;background-size:80px;} #section3 .mCont03 .mIcon ul li a span.micon04 {background: url(../img/micon04.png) no-repeat center 20px;background-size:72px;} #section3 .mCont03 .mIcon ul li a span.micon05 {background: url(../img/micon05.png) no-repeat center 12px;background-size:74px;} #section3 .mCont03 .mIcon ul li a span.micon06 {background: url(../img/micon06.png) no-repeat center 20px;background-size:90px;} /*추천신착도서*/ #section4 {background: url(../img/bg_section4.png) repeat-y 57% top;} #section4 .mCont04 {} #section4 .mCont04 .in {margin:0 60px 0;overflow:hidden;padding-top: 90px;} #section4 .mCont04 .in #mBook {float:left;width:65%;background:transparent;position:relative;text-align:center;} #section4 .mCont04 .in #mBook > div {} #section4 .mCont04 .in #mBook > div > ul {overflow:hidden;display:none;padding-top:116px;margin-bottom:47px;} #section4 .mCont04 .in #mBook .tab_on > ul {display:inline-block;} #section4 .mCont04 .in #mBook .btn_mMore {display:none;margin:0 auto;width:152px;height:58px;line-height:60px;border:1px solid #ddd;font-size:18px;color:#222;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section4 .mCont04 .in #mBook .tab_on .btn_mMore {display:block;} #section4 .mCont04 .in #mBook h2 {position:absolute;top: 3px;z-index: 109;height: 52px;line-height: 52px;text-align:center;color:#fff;font-size: 30px;font-weight:700;} #section4 .mCont04 .in #mBook h2 > a {display:block;color:#ccc;} #section4 .mCont04 .in #mBook h2 > a::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section4 .mCont04 .in #mBook .tab_on h2 > a {color: #333;position:relative;} #section4 .mCont04 .in #mBook .tab_on h2 > a::after {width:100%;transition:all 0.5s} #section4 .mCont04 .in #mBook .mBook01 h2 {left: 50%;margin-left:-140px;} #section4 .mCont04 .in #mBook .mBook02 h2 {left: 50%;margin-left:-10px;} #section4 .mCont04 .in #mBook > div > ul li {float: left;width:170px;margin-right:40px;font-size: 16px;color:#333;box-sizing: border-box;} #section4 .mCont04 .in #mBook > div > ul li:nth-child(3) {display:none;} #section4 .mCont04 .in #mBook > div > ul li a {display:block;} #section4 .mCont04 .in #mBook > div > ul li a .mBimg {display:inline-block;width:170px;height:250px;margin-bottom:25px;overflow:hidden;transition:all 0.2s; -webkit-box-shadow: 20px 20px 20px 0px rgba(0,0,0,0.2); -moz-box-shadow: 20px 20px 20px 0px rgba(0,0,0,0.2); box-shadow: 20px 30px 20px 0px rgba(0,0,0,0.2);} #section4 .mCont04 .in #mBook > div > ul li a .mBimg img {width:100%;height:100%;transition:all 0.2s;} #section4 .mCont04 .in #mBook > div > ul li a strong {display:block;width:170px;font-size:17px;font-weight:500;color:#333;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;text-align:center;} #section4 .mCont04 .in #mBook > div > ul li a strong i {display:block;font-size:15px;font-weight:400;color:#666;font-style:normal;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;} /*영화*/ #section4 .mCont04 .in #mMovie {float:left;width:35%;} #section4 .mCont04 .in #mMovie h2 {font-size:30px;font-weight:700;color:#fff;text-align:center;} #section4 .mCont04 .in #mMovie .btn_mMore {display:block;margin:0 auto;width:152px;height:58px;line-height:60px;border:1px solid #fff;font-size:18px;color:#fff;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section4 .mCont04 .in #mMovie .swiper-container {margin-left: auto;margin-right: auto;position: relative;overflow: hidden;list-style: none;padding: 0;z-index: 1;width: 100%;;padding-top:72px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide {position:relative;margin-bottom:25px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a {display: block;width:100%;background: #1e2c5d;text-align:center;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a img {width:200px;height:285px;margin:0 auto;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mark {position:absolute;top:0;left:50%;margin-left:-100px;padding:8px 24px;font-size:16px;letter-spacing:-1px;color:#fff;background:#3a6ae3;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivTit {width:70%;padding:0 15%;font-size:17px;color:#fff;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;margin-top:20px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivDay {width:70%;padding:0 15%;font-size:16px;color:#aaa;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp {position:absolute;top:20px;left:0;width:100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn {position: absolute;top: 0;left: 0;width: 100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn img {padding:10px 0;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-prev, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-next {left: 18px;right: auto;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-next, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-prev {right: 18px;left: auto;} /*기타*/ #section5 {background: url(../img/bg_section5.png) no-repeat center top;} #section5 .mCont05 {margin:0 60px 0;padding-top:90px;overflow:hidden;} #section5 .mCont05 .mEtc01 {position:absolute;width:300px;height:340px;background: url(../img/bg_mEtc01.png) no-repeat center top;background-size:100%;} #section5 .mCont05 .mEtc01 a {display:block;padding-left:40px;box-sizing:border-box;height:100%;background: url(../img/go_arr01.png) no-repeat 85% 90%;} #section5 .mCont05 .mEtc01 a .tit {display:block;font-size:21px;font-weight:700;color:#fff;padding-top:30px;margin-bottom:12px;} #section5 .mCont05 .mEtc01 a .tit_text {display:block;font-size:17px;line-height:22px;color:#fff;} #section5 .mCont05 .mEtc02 {margin-left:320px;height:340px;background:#fff;} #section5 .mCont05 .mEtc02 .tit {display:block;padding-left:40px;box-sizing:border-box;font-size:21px;font-weight:700;color:#222;padding-top:30px;} #section5 .mCont05 .mEtc02 ul {padding:0 40px;} #section5 .mCont05 .mEtc02 ul li {padding:12px 0;border-bottom:1px solid #eaeaea;} #section5 .mCont05 .mEtc02 ul li:last-child {border-bottom:none;} #section5 .mCont05 .mEtc02 ul li a {display:inline-block;width:90%;font-size:17px;color:#222;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;} #section5 .mCont05 .mEtc02 ul li .date {display:block;font-size:15px;color:#757575;} #section5 .mCont05 .mEtc02 .btn_mMore {display:block;width:150px;height:42px;line-height:42px;margin:0 auto;border:1px solid #ddd;font-size:16px;color:#222;text-align:center;} #section5 .mCont05 .mEtc03 {float:left;width: 100%;/*margin-top:10px;*/padding-left:320px;box-sizing: border-box;} #section5 .mCont05 .mEtc03 .mBan01 {margin-bottom:10px;background:#d94200;} #section5 .mCont05 .mEtc03 .mBan01 a {display:block;height: 139px;padding:0 90px 26px 30px;background: url(../img/go_arr01.png) no-repeat 97% 80%;} #section5 .mCont05 .mEtc03 .mBan01 a .tit {display:block;padding-top:25px;margin-bottom:10px;font-size:17px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan01 a .tit_text {display:block;line-height:22px;font-size:16px;color:#fff;} #section5 .mCont05 .mEtc03 .mBan01 a .tit_text br {display:none;} #section5 .mCont05 .mEtc03 .mBan02 {background:#1e2c5d;} #section5 .mCont05 .mEtc03 .mBan02 a {display:block;height: 139px;padding:0 90px 26px 30px;background: url(../img/go_arr01.png) no-repeat 97% 80%;} #section5 .mCont05 .mEtc03 .mBan02 a .tit {display:block;padding-top:25px;margin-bottom:10px;font-size:17px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 a .tit_text {display:block;line-height:22px;font-size:16px;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 a .tit_text br {display:none;} /**/ #foot_section .mFooter {} #foot_section .mFooter .f_menu {background:#1a1c20;height:60px;line-height:60px;} #foot_section .mFooter .f_menu .in {margin:0 60px 0;} #foot_section .mFooter .f_menu .in ul {} #foot_section .mFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #foot_section .mFooter .f_menu .in ul li a {display:block;font-size:15px;color:#ccc;transition:all 0.2s;} #foot_section .mFooter .f_menu .in ul li a:hover, #foot_section .mFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #foot_section .mFooter .f_menu .in ul li:first-child a {color:#e85c31} #foot_section .mFooter .f_info{background:#121316;padding:30px 0 50px;} #foot_section .mFooter .f_info .in {margin:0 20px 0;position:relative;} #foot_section .mFooter .f_info .in ul li {margin-bottom:1px;color:#aaa;} #foot_section .mFooter .f_info .in ul li br {display:none;} #foot_section .mFooter .f_info .in ul li strong {display:inline-block;width:55px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:20px;font-size:inherit;font-weight:400;} #foot_section .mFooter .f_info .in ul li span.tel {font-size:14px;color:#aaa;margin-left:20px;} #foot_section .mFooter .f_info .in ul li span.fax {font-size:14px;color:#aaa;margin-left:20px;} #foot_section .mFooter .f_info .in .copyright {font-size:15px;color:#aaa;padding-top:20px;} #foot_section .mFooter .f_info .in .f_logo {margin-bottom:20px} #foot_section .mFooter .f_info .in .f_logo img {width:200px;} /**/ #s_foot_section .sFooter {} #s_foot_section .sFooter .f_menu {background:#1a1c20;height:60px;line-height:60px;} #s_foot_section .sFooter .f_menu .in {margin:0 20px 0;} #s_foot_section .sFooter .f_menu .in ul {} #s_foot_section .sFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #s_foot_section .sFooter .f_menu .in ul li a {display:block;font-size:15px;color:#ccc;transition:all 0.2s;} #s_foot_section .sFooter .f_menu .in ul li a:hover, #s_foot_section .sFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #s_foot_section .sFooter .f_menu .in ul li:first-child a {color:#e85c31} #s_foot_section .sFooter .f_info{background:#121316;padding:30px 0 50px;} #s_foot_section .sFooter .f_info .in {margin:0 20px 0;position:relative;} #s_foot_section .sFooter .f_info .in ul li {margin-bottom:1px;color:#aaa;} #s_foot_section .sFooter .f_info .in ul li br {display:none;} #s_foot_section .sFooter .f_info .in ul li strong {display:inline-block;width:55px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:20px;font-size:inherit;font-weight:400;} #s_foot_section .sFooter .f_info .in ul li span.tel {font-size:14px;color:#aaa;margin-left:20px;} #s_foot_section .sFooter .f_info .in ul li span.fax {font-size:14px;color:#aaa;margin-left:20px;} #s_foot_section .sFooter .f_info .in .copyright {font-size:15px;color:#aaa;padding-top:20px;} #s_foot_section .sFooter .f_info .in .f_logo {margin-bottom:20px} #s_foot_section .sFooter .f_info .in .f_logo img {width:200px;} /**/ #contain .contain{position:relative;margin:0 auto;} #contain + #footer .contact {display:none;} /* 서브비주얼 */ #contain #subVisual {height: 260px;padding-top: 100px;background:url(../img/sub_v_img.png) no-repeat 50% 0;background-size: cover;text-align: center;} #contain #subVisual .sub_slogan {padding-top: 68px;margin: 0 auto;font-size: 36px;font-weight: 300;color: #fff;line-height: 42px;text-align: center;} #contain #subVisual .sub_slogan strong {display:block;font-size:inherit;font-weight:500;} /**/ #aside{display:none;} /**/ #contain .contain .subtit_area {height:80px;padding:0 20px;} #contain .contain .subtit_area h1 {font-size:30px;font-weight:700;padding-top:20px;} #contain .contain .subtit_area .web_locator {display:none;} /**/ #design{position:relative; padding:0 20px;background: url(../img/sub-patten.png) no-repeat 100% 0} #design #content > div {} #design #content .sub_visual {margin: 0;} #design #program > div {margin-top: 20px;} #design #program .sub_visual {margin: 0;} #design #content , #design #program { padding-bottom:40px;} #design .visual{padding-bottom: 16px;border-bottom:1px solid #ddd; z-index:1;/*height:140px;border-bottom:1px solid #aaa;*/} #design .visual h1,#design .visual h2{position:relative;z-index:2;padding:20px 0 0;font-size:30px;font-weight:600;letter-spacing:-1px;color:#333;/*;border-bottom:1px solid #c62338*/ transition:all 0.6s cubic-bezier(0.785, 0.135, 0.150, 0.860); animation-duration: 1s; animation-name: v_text; } #design .visual p{font-size:15px;color:#626262;} #design #wait img {width: auto;} #subVisual {position:relative;} #subVisual h1 {padding: 90px 0;font-size: 26px;font-weight: 600;color:#fff;text-align:center;} #subVisual h1 .en {display:block;padding-top: 8px;color:#fcdd4b;font-size: 16px;font-weight: 500;text-transform: uppercase;} #subVisual .visual .locator{position:absolute;bottom: 0;left: 0;z-index: 10;width: 100%;height: 48px;background: rgba(51,54,64,0.7);} #subVisual .visual .locator .path {overflow:hidden;width: 96%;margin: 0 2%;} #subVisual .visual .locator .path li{float:left;width: 25%;text-align:left;border-right: 1px solid rgba(255,255,255,0.3);} #subVisual .visual .locator .path li button{display:block;width: 100%;padding:0 20px;box-sizing: border-box;border:0;font-size: 16px;line-height: 48px;color:#fff;background:url(../img/loc_arrow.png) no-repeat 90% 50%;cursor: pointer;text-align:left;} #subVisual .visual .locator .path li.sel button{color:#666} #subVisual .visual .locator .path li.home {width: 48px;border-left: 1px solid rgba(255,255,255,0.3);background: none;} #subVisual .visual .locator .path li.home a {display: block;height: 48px;line-height:48px;font-size:16px;color:#fff;text-align:center;} #subVisual .vepth .navi{display:none;background: #fff;border: 1px solid #ddd;} #subVisual .vepth .navi div a {position:relative;display:block;padding: 10px 8px;font-size: 15px;border-bottom: 1px solid #ddd;color:#555;letter-spacing: -0.4px;} #subVisual .vepth .navi div a:last-child {border-bottom: 0;} #subVisual .vepth .navi div a:hover {background:#445db2;color:#fff;} @keyframes naviEf { from {width: 0;} to {width: 100%;} } #subVisual .datelist{line-height:20px;text-align:center} #subVisual .datelist strong{padding:0 10px;font-size:20px} #subVisual .datelist a{display:none} #blind{position:absolute;z-index:99998;top:0px;left:0px; bottom:0;width:100%;height:100%;background:rgba(0,0,0,0.7)} #dkleft{display:none;position:absolute;z-index:10;left:0px;top:0px;width:260px;min-height:1000px;background:#fff;overflow:hidden} #dkleft .depth1{display:block;position:relative;padding:0 15px;line-height:45px;font-size:16px;color:#555;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s;text-align:center;} #dkleft .depth1 strong{position:relative;top:-2px;padding:0 4px;height:14px;line-height:14px;font-size:10px;background:#ff0000;border-radius:30px} #dkleft .depth1 span{font-style:normal;color:#ffa800} #dkleft .depth1 em{position:absolute;z-index:2;top:0;right:4px;width:39px;height:39px;background:url(/web/seomun/img/common/plus.png) no-repeat 50% 50%;background-size:11px 11px} #dkleft .depth1.sel{color:#000;border-bottom:1px solid #596170} #dkleft .depth1.sel em{background:url(/web/seomun/img/common/minus.png) no-repeat 50% 50%;background-size:11px 3px} #dkleft .depth1 i{font-family:Linearicons-Free;display:block;margin:15px 0px 0 0;color:#aaa;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s} #dkleft .depth1 i.rightico{float:right} #dkleft .depth1.sel i.rightico{color:#f7941d;-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg);transition:all 0.2s ease-in-out 0s;-webkit-transition:all 0.2s ease-in-out 0s} #dkleft .depth2{display:none;background:#757c89} #dkleft .depth2 a{display:block;padding:0 20px;line-height:40px;font-size:13px;color:#fff;border-bottom:1px solid #596170;text-decoration:none} #dkleft .depth2 a.sel{color:#81c341} #closeleft{position:absolute;z-index:9999999;left:-50px;top:17px;display:block;font-size:30px;font-family:Linearicons-Free;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale} #closeleft:before{content:"\e870";font-size:30px;} #gotop{position:fixed;z-index:90000;bottom:20px;right:20px;display:none} #gotop a{display:block;width:40px;height:30px;padding:30px 0 0 0;font-size:10px;font-weight:800;text-align:center;color:#fff;background:rgba(0,0,0,0.3) url(../img/gotop.png) no-repeat 48% 28%;border-radius:50px;overflow:hidden} @keyframes mv00 { from {background-position:center 110px; } to {background-position:center 0px; } } @keyframes mv01 { from {top:100px; opacity:0;} to {top:170px; opacity:1;} } @keyframes mv02 { from {top:200px;opacity:0;} to {top:295px;opacity:1;} } @keyframes v_img { from {right:50px; opacity:0} to {right:0px; opacity:1} } @keyframes v_text { from {padding-left:30px; opacity:0} to {padding-left:0px; opacity:1} } @keyframes v_navi { from {margin-top:-20px; opacity:0} to {margin-top:0px; letter-spacing:-1px; opacity:1} } @keyframes con_bg { from {background:url(../img/sub_con_bg.png) repeat-x left -30px; } to {background:url(../img/sub_con_bg.png) repeat-x left 138px; } } } @media all and (max-width: 767px) { /**/ #poplayer{position:absolute;z-index:1000;top:120px;left:50%;margin:0 0 0 -150px;width:300px;cursor:move} img{width:auto;max-width:100%;height:auto;} #OpenLayer {position: absolute;top: 150px;left: 10px;width: 70%;z-index: 9999;background: #fff;padding: 5px;border-radius: 5px;border: 1px solid #ccc;box-shadow: 5px 5px 20px rgba(0,0,0,0.3);text-align: right;} #OpenLayer > a {clear: both;font-size: 12px;} #OpenLayer #TodayClose {float: left;margin-right: 20px;} #OpenLayer img {width: 100%;} #fullpage {padding-bottom: 52px;} #mobileCard {position: fixed;bottom: 0;left: 0;z-index: 999;width: 100%;height: 52px;background-color: #1e2c5d;border-top: 1px solid rgba(255,255,255,0.2);} #mobileCard > a {display: block;height: 100%;padding-left: 60px;background: url(../img/momem.png) no-repeat 10px 50% / auto 24px;box-sizing: border-box;color: #fff;line-height: 52px;} /*header*/ #header{position:relative;height: 60px !important;border-bottom:1px solid #ddd;z-index: 9;} #header .header{height: 60px;} #header h1{text-align:center;padding-top:8px;padding-left: 30px;} #header h1 a{display: inline-block;width: 150px;background: url(../img/logo.png) no-repeat 0 0;background-size: 100%;height: 27px;} /*#header h1 img{height: 30px;margin-top: 15px;}*/ #header h1 > img {height: 30px;margin: 0 0 0 7px;vertical-align: middle;} #header button{position:absolute;top:0;left: 3%;width:20px;height:24px;background: none;} #header button i{font-size:24px !important;color: #fff;} #header button.btn-page{height:40px;width:40px;text-align:center;top:36px;right:10px;display:block;line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page2{height:40px;width:48px;text-align:center;top:36px;right:55px;display:block; line-height:14px;font-size:11px;font-family:'Roboto';} #header button.btn-page i{display:block !important;padding:5px 0 0 0;height:20px;font-size:18px !important; } #header .etc_btn {display:none;} /**/ #gnb{display:none} /**/ #menu{position:absolute !important;z-index:10;top:-2px;right:0} #menu a{display:block;width:46px;height:46px;background:url(../img/ico_menuw.png) no-repeat 100% 50%;text-indent:-9999em;overflow:hidden} #menu a.sel{background:url(../img/ddea/ico_menu.png) no-repeat 100% 50%} /*메인visual*/ #section0 .mVisual {height:100%;} #section0 .mVisual .swiper-container {width: 100%;height: 100%;} #section0 .mVisual .swiper-slide {text-align: center;background: #fff;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center; justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center; align-items: center;} #section0 .mVisual .swiper-slide .mvText{margin-top: -180px;font-size: 48px;font-weight:100;color:#fff;line-height:60px;} #section0 .mVisual .swiper-slide .mvText strong {display:block;font-weight:700;} #section0 .mVisual .swiper-slide.mvimg01 {background: url(../img/mvimg01.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .swiper-slide.mvimg02 {background: url(../img/mvimg02.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .swiper-slide.mvimg03 {background: url(../img/mvimg03.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .mvBtn_wp {position:absolute;top:50%;left:0;width:100%;height:44px;} #section0 .mVisual .mvBtn_wp .swiper-pagination-fraction {padding-right: 40px;} #section0 .mVisual .mvBtn_wp .mvBtn {width:360px;margin:0 auto;position:relative;} #section0 .mVisual .mvBtn_wp .mvBtn img {padding:10px 0;} #section0 .mVisual .mvBtn_wp .ctrBtn {position: absolute;left: 50%;top: 9px;z-index: 99;margin-left: 10px;} #section0 .mVisual .mvBtn_wp .ctrBtn .start {display:inline-block;width:16px;height:20px;line-height:20px;background:url(../img/v_start.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;margin-right:1px} #section0 .mVisual .mvBtn_wp .ctrBtn .stop {display:inline-block;width:16px;height:20px;line-height:20px;background:url(../img/v_stop.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;} /*메인visual*/ #section0 {height:600px;margin-top: -62px;} #section0 .mVisual {height:100%;} #section0 .mVisual .swiper-container {width: 100%;height: 100%;} #section0 .mVisual .swiper-slide {text-align: center;background: #fff;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center; justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center; align-items: center;} #section0 .mVisual .swiper-slide .mvText{margin-top: -140px;font-size: 32px;font-weight:100;color:#fff;line-height:40px;word-break:keep-all;} #section0 .mVisual .swiper-slide .mvText strong {display:block;font-weight:700;} #section0 .mVisual .swiper-slide.mvimg01 {background: url(../img/mvimg01.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .swiper-slide.mvimg02 {background: url(../img/mvimg02.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .swiper-slide.mvimg03 {background: url(../img/mvimg03.png) no-repeat 0 0;background-size: cover;} #section0 .mVisual .mvBtn_wp {position:absolute;top:50%;left:0;width:100%;height:44px;} #section0 .mVisual .mvBtn_wp .mvBtn {width:320px;margin:0 auto;position:relative;} #section0 .mVisual .mvBtn_wp .mvBtn img {padding:10px 0;} #section0 .mVisual .mvBtn_wp .ctrBtn {position: absolute;left: 50%;top: 9px;z-index: 99;margin-left: 10px;} #section0 .mVisual .mvBtn_wp .ctrBtn .start {display:inline-block;width:16px;height:20px;line-height:20px;background:url(../img/v_start.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;margin-right:1px} #section0 .mVisual .mvBtn_wp .ctrBtn .stop {display:inline-block;width:16px;height:20px;line-height:20px;background:url(../img/v_stop.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em;} /*메인-검색*/ #section0 .mVisual .search {position:absolute;top:400px;left:0;width:100%;text-align: center;z-index: 99999;} #section0 .mVisual .search .search_wp {margin:0 30px 0;box-sizing:border-box;position:relative;padding: 14px 0;border-left: 1px solid #fff;background-color: rgba( 255, 255, 255, 0.8 );} #section0 .mVisual .search fieldset{} #section0 .mVisual .search fieldset label{width:0;font-size:0;overflow:hidden;} #section0 .mVisual .search fieldset label.label_st {position: absolute;top: 20px;left: 0px;width: 90px;color: #1e2c5d;font-size: 18px;font-weight: 500;background: url(../img/ms_tit_line.png) no-repeat right 50%;} _::-moz-svg-foreign-content, :root #section0 .mVisual .search fieldset select{position:relative;top:10px} #section0 .mVisual .search fieldset input{float: left;width: 58%;height: 34px !important;line-height: 34px !important;font-size: 16px !important;padding: 0 15px !important;margin: 0 0 0 88px;border: 0 !important;color: #333;background: none;} #section0 .mVisual .search fieldset button{position: absolute;right: 0;top: 0;width: 50px;height: 70px;background:#fff url(../img/m_search_icon.png) no-repeat center 50%;cursor: pointer;text-indent:-99999em} /*메인스크롤 아이콘*/ #section0 .mVisual .main_scroll {display:none;} /*2026여수세계섬박람회*/ #section0 .mVisual .banner_2026 {position:absolute;top:80px;right:20px;z-index:1;} #section0 .mVisual .banner_2026 a {display:block;} #section0 .mVisual .banner_2026 a > .b2026 {display:none;} /*공지사항-문화프로그램*/ #section1 {} #section1 .mCont01 {margin:50px 30px;overflow:hidden;} #section1 .mCont01 .mBoard {} #section1 .mCont01 .mBoard .tab.list{height: 510px !important;} #section1 .mCont01 .mBoard .tab.list ul{position:relative;} #section1 .mCont01 .mBoard .tab.list ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li{float:left;width:50%;} #section1 .mCont01 .mBoard .tab.list li a{float:left;position:relative;text-decoration:none;} #section1 .mCont01 .mBoard .tab.list li:first-child a {float:right;margin-right: 10px;} #section1 .mCont01 .mBoard .tab.list li a span{display:inline-block;font-size:22px;font-weight:600;color:#888;cursor:pointer} #section1 .mCont01 .mBoard .tab.list li ul{width:100%;position:absolute;top:56px;left:0;list-style:none;border:0;margin:0;padding:0;} #section1 .mCont01 .mBoard .tab.list li ul:after{content:"";display:block;clear:both} #section1 .mCont01 .mBoard .tab.list li li{float:none;position:relative;padding:10px 0 10px 70px;width: 100%;box-sizing: border-box;border-bottom:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li:first-child {border-top:1px solid #ddd;} #section1 .mCont01 .mBoard .tab.list li li a{display:inline-block;float:left !important;color:#222 !important;font-weight:400;font-size:16px;width:90%;margin-left: 0;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;transition:all 0.1s;} #section1 .mCont01 .mBoard .tab.list li li:first-child a {float:left;} #section1 .mCont01 .mBoard .tab.list li li strong.kind {position: absolute;top: 14px;left: 0;width: 54px;height: 25px;line-height: 26px;border: 1px solid #000;font-size: 14px;font-weight: 500;color: #555;text-align: center;} #section1 .mCont01 .mBoard .tab.list li li a:hover, #section1 .mCont01 .mBoard .tab.list li li a:active, #section1 .mCont01 .mBoard .tab.list li li a:focus{color:#466db8 !important;text-decoration:none} #section1 .mCont01 .mBoard .tab.list li li time, #section1 .mCont01 .mBoard .tab.list li li .time{display:block;font-size:15px;color:#222;} #section1 .mCont01 .mBoard .tab.list li li.more{position:absolute;top:-30px;right:0;border:0 !important;background:transparent} #section1 .mCont01 .mBoard .tab.list li.active a{color:#333} #section1 .mCont01 .mBoard .tab.list li.active a span{font-size:22px;font-weight:600;color:#222;position:relative;} #section1 .mCont01 .mBoard .tab.list li a span::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section1 .mCont01 .mBoard .tab.list li.active a span::after {width:100%;transition:all 0.5s} #section1 .mCont01 .mBoard .tab.list.jx{height:auto} #section1 .mCont01 .mBoard .tab.list.jx ul{border:0} #section1 .mCont01 .mBoard .tab.list.jx li{float:none;position:relative} #section1 .mCont01 .mBoard .tab.list.jx li a{float:none;display:block;font-weight:bold;color:#333;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important} #section1 .mCont01 .mBoard .tab.list.jx li ul{position:static;display:block;left:0;top:0;padding:5px 0} #section1 .mCont01 .mBoard .tab.list.jx li li a{display:inline;border:0 !important;background:none !important;font-weight:normal} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore {position:absolute;bottom:-80px;left:50%;margin-left:-75px;padding:0;border:none;width:150px;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a {display: block;width: 100%;height: 48px;line-height: 48px;margin-right: 0;border: 1px solid #ddd;font-size: 16px;color: #222;box-sizing: border-box;text-align: center;transition: all 0.3s;} #section1 .mCont01 .mBoard .tab.list li li.btn_mMore a:hover {background:#1e2c5d;border:1px solid #1e2c5d;color:#fff !important;} /*팝업존*/ #section1 .mCont01 .mPop {} #section1 .mCont01 .mPop .swiper-container {height: 100%;background: #fff;} #section1 .mCont01 .mPop .swiper-wrapper {background: #fff;} #section1 .mCont01 .mPop .swiper-slide {width:100%;height: 100%;margin-bottom:10px;background-color: #fff;} #section1 .mCont01 .mPop .swiper-slide a {display:block;height: 100%;background-color: #fff;text-align:center;} #section1 .mCont01 .mPop .swiper-slide a img {max-width:100%;height: 360px;} #section1 .mCont01 .mPop .swiper-pagination-fraction, #section1 .mCont01 .mPop .swiper-pagination-custom, #section1 .mCont01 .mPop .swiper-container-horizontal > #section1 .mCont01 .mPop .swiper-pagination-bullets {width: 50px;color: #333;margin: 0 auto 0;position: relative;padding-top: 10px;} #section1 .mCont01 .mPop .pzBtn_wp {height:35px;position:relative;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn {position: absolute;top: 0;left: 0;width: 100%;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn img {padding:10px 0;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-prev, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-next {left: 50px;right: auto;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-next, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-prev {right: 50px;left: auto;} /*여수시립도서관 소개*/ #section2 {padding:50px 0;min-height:400px;background:#1e2c5d url(../img/bg_section2.png) no-repeat left bottom;} #section2 .mCont02 {margin:0 30px} #section2 .mCont02 h2.tit {font-size:22px;font-weight:700;color:#fff;padding-bottom:16px;text-align:center;} #section2 .mCont02 .tit_text {font-size:16px;line-height:24px;color:#fff;padding-bottom:40px;text-align:center;word-break: keep-all;} #section2 .mCont02 .tit_text br {display:none;} #section2 .mCont02 .mIntro_wp {width:100%;position:relative;} #section2 .mCont02 .mIntro_wp .mIntro {} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area {} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info {} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit {font-size:30px;font-weight:100;color:#fff;line-height:1.2em} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .tit strong {display:block;font-size:60px;font-weight:900;color:#464f73;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day {padding:15px 0;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .stit {font-size:17px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li {float: left;width: 36px;height: 34px;line-height: 34px;border-radius: 5px;background: #fff;margin: 0 5px 5px 0;font-size: 17px;font-weight: 500;color: #1e2c5d;text-align: center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more {width:96px;height:35px;line-height:34px;border:1px solid rgba(255, 255, 255, .5);box-sizing:border-box;border-radius:5px;background:#1e2c5d;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .close_day .c_day li.btn_more a {display:block;font-size:15px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time {padding-bottom:15px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time .stit {font-size:17px;font-weight:700;color:#fff;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl {padding-bottom:6px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dt {font-size:15px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .use_time dl dd {font-size:14px;line-height:22px;color:#fff;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom {padding-bottom:20px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit {font-size:17px;font-weight:500;margin-bottom:5px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .stit a {color:#ff8400;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list {overflow:hidden;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li {font-size:14px;color:#fff;margin-bottom:3px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span {display:inline-block;border-radius:50%;width:24px;height:24px;line-height:24px;border:1px solid #fff;margin-right:5px;text-align:center;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_info .rdRoom .rdr_list li span.oth {border-radius:24px;width:44px;} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img {} #section2 .mCont02 .mIntro_wp .mIntro .mIntro_area .mi_img .slick-slide {margin-right: 20px;} /*주요서비스 안내*/ #section3 {background: url(../img/bg_section3.png) no-repeat center top;} #section3 .mCont03 {padding: 50px 0;} #section3 .mCont03 h2.tit {font-size:22px;font-weight:700;color:#fff;padding-bottom:16px;text-align:center;word-break: keep-all;} #section3 .mCont03 .tit_text {margin:0 30px 30px;font-size:16px;line-height:24px;color:#fff;text-align:center;} #section3 .mCont03 .mIcon {z-index:1;} #section3 .mCont03 .mIcon ul {overflow: hidden;height: 100%;} #section3 .mCont03 .mIcon ul li {border-top: 1px solid rgba(255,255,255,0.2);box-sizing: border-box;} #section3 .mCont03 .mIcon ul li a {display:block;height: 100%;text-align:center;transition:all 0.3s;} #section3 .mCont03 .mIcon ul li a:hover {background-color: rgba( 0, 0, 0, 0.2 );} #section3 .mCont03 .mIcon ul li a span {display: inline-block;padding: 20px 0 20px 60px;font-size: 17px;color: #fff;width: 150px;text-align: left;} #section3 .mCont03 .mIcon ul li a span.micon01 {background: url(../img/micon01.png) no-repeat left 50%;background-size:39px;} #section3 .mCont03 .mIcon ul li a span.micon02 {background: url(../img/micon02.png) no-repeat left 50%;background-size:47px;} #section3 .mCont03 .mIcon ul li a span.micon03 {background: url(../img/micon03.png) no-repeat left 50%;background-size:50px;} #section3 .mCont03 .mIcon ul li a span.micon04 {background: url(../img/micon04.png) no-repeat left 50%;background-size:42px;} #section3 .mCont03 .mIcon ul li a span.micon05 {background: url(../img/micon05.png) no-repeat left 50%;background-size:44px;} #section3 .mCont03 .mIcon ul li a span.micon06 {background: url(../img/micon06.png) no-repeat left 50%;background-size:50px;} /*추천신착도서*/ #section4 {} #section4 .mCont04 {margin:50px 0 0;} #section4 .mCont04 .in {overflow:hidden;} #section4 .mCont04 .in #mBook {background:transparent;position:relative;text-align:center;margin-bottom:60px;} #section4 .mCont04 .in #mBook > div {} #section4 .mCont04 .in #mBook > div > ul {overflow:hidden;display:none;padding-top:70px;margin-bottom:30px;} #section4 .mCont04 .in #mBook .tab_on > ul {display:inline-block;padding-left: 40px;} #section4 .mCont04 .in #mBook .btn_mMore {display:none;margin:0 auto;width:152px;height:48px;line-height:48px;border:1px solid #ddd;font-size:16px;color:#222;box-sizing:border-box;text-align:center;} #section4 .mCont04 .in #mBook .tab_on .btn_mMore {display:block;} #section4 .mCont04 .in #mBook h2 {position:absolute;top: 3px;z-index: 109;height: 31px;line-height: 31px;text-align:center;color:#fff;font-size: 22px;font-weight:700;} #section4 .mCont04 .in #mBook h2 > a {display:block;color:#ccc;} #section4 .mCont04 .in #mBook h2 > a::after {content:"";width:0;height:2px;background:#222;position:absolute;bottom:0;left:0} #section4 .mCont04 .in #mBook .tab_on h2 > a {color: #333;position:relative;} #section4 .mCont04 .in #mBook .tab_on h2 > a::after {width:100%;transition:all 0.5s} #section4 .mCont04 .in #mBook .mBook01 h2 {left: 50%;margin-left:-85px;} #section4 .mCont04 .in #mBook .mBook02 h2 {left: 50%;margin-left:5px;} #section4 .mCont04 .in #mBook > div > ul li {float: left;width:140px;margin-right:40px;font-size: 16px;color:#333;box-sizing: border-box;} #section4 .mCont04 .in #mBook > div > ul li:nth-child(3) {display:none;} #section4 .mCont04 .in #mBook > div > ul li a {display:block;} #section4 .mCont04 .in #mBook > div > ul li a .mBimg {display:inline-block;width:140px;height:205px;margin-bottom:20px;overflow:hidden;transition:all 0.2s; -webkit-box-shadow: 20px 20px 20px 0px rgba(0,0,0,0.2); -moz-box-shadow: 20px 20px 20px 0px rgba(0,0,0,0.2); box-shadow: 20px 30px 20px 0px rgba(0,0,0,0.2);} #section4 .mCont04 .in #mBook > div > ul li a .mBimg img {width:100%;height:100%;transition:all 0.2s;} #section4 .mCont04 .in #mBook > div > ul li a strong {display:block;width:140px;font-size:15px;font-weight:500;color:#333;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;text-align:center;} #section4 .mCont04 .in #mBook > div > ul li a strong i {display:block;font-size:14px;font-weight:400;color:#666;font-style:normal;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;} /*영화*/ #section4 .mCont04 .in #mMovie {background: #1e2c5d;padding:50px 0;} #section4 .mCont04 .in #mMovie h2 {font-size:22px;font-weight:700;color:#fff;text-align:center;} #section4 .mCont04 .in #mMovie .btn_mMore {display:block;margin:0 auto;width:152px;height:48px;line-height:48px;border:1px solid #fff;font-size:16px;color:#fff;box-sizing:border-box;text-align:center;transition:all 0.3s;} #section4 .mCont04 .in #mMovie .swiper-container {margin-left: auto;margin-right: auto;position: relative;overflow: hidden;list-style: none;padding: 0;z-index: 1;width: 100%;;padding-top:72px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide {position:relative;margin-bottom:25px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a {display: block;width:100%;background: #1e2c5d;text-align:center;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a img {width:200px;height:285px;margin:0 auto; -webkit-box-shadow: 20px 20px 20px 0px rgba(0,0,0,0.2); -moz-box-shadow: 20px 20px 20px 0px rgba(0,0,0,0.2); box-shadow: 20px 30px 20px 0px rgba(0,0,0,0.2);} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mark {position:absolute;top:0;left:50%;margin-left:-100px;padding:8px 24px;font-size:16px;letter-spacing:-1px;color:#fff;background:#3a6ae3;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivTit {width:70%;padding:0 15%;font-size:16px;color:#fff;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;margin-top:20px;} #section4 .mCont04 .in #mMovie .swiper-container .swiper-slide a .mivDay {width:70%;padding:0 15%;font-size:15px;color:#aaa;text-align:center;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp {position:absolute;top:20px;left:0;width:100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn {position: absolute;top: 0;left: 0;width: 100%;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn img {padding:10px 0;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-prev, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-next {left: 18px;right: auto;} #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-button-next, #section4 .mCont04 .in #mMovie .swiper-container .mviBtn_wp .mviBtn .swiper-container-rtl .swiper-button-prev {right: 18px;left: auto;} /*기타*/ #section5 {background: url(../img/bg_section5.png) no-repeat center top;background-size: cover;} #section5 .mCont05 {padding:50px 30px;overflow:hidden;} #section5 .mCont05 .mEtc01 {height:360px;margin-bottom:10px;background: url(../img/bg_mEtc01.png) no-repeat center top;background-size:cover;} #section5 .mCont05 .mEtc01 a {display:block;padding-left:30px;box-sizing:border-box;height:100%;background: url(../img/go_arr01.png) no-repeat 85% 90%;} #section5 .mCont05 .mEtc01 a .tit {display:block;font-size:18px;font-weight:700;color:#fff;padding-top:30px;margin-bottom:10px;} #section5 .mCont05 .mEtc01 a .tit_text {display:block;font-size:15px;line-height:22px;color:#fff;} #section5 .mCont05 .mEtc02 {background:#fff;padding-bottom:30px;} #section5 .mCont05 .mEtc02 .tit {display:block;padding-left:30px;box-sizing:border-box;font-size:18px;font-weight:700;color:#222;padding-top:30px;} #section5 .mCont05 .mEtc02 ul {padding:0 30px;} #section5 .mCont05 .mEtc02 ul li {padding:14px 0;border-bottom:1px solid #eaeaea;} #section5 .mCont05 .mEtc02 ul li:last-child {border-bottom:none;} #section5 .mCont05 .mEtc02 ul li a {display:inline-block;width:90%;font-size:15px;color:#222;text-overflow:ellipsis;white-space: nowrap;overflow:hidden;} #section5 .mCont05 .mEtc02 ul li .date {display:block;font-size:15px;color:#757575;} #section5 .mCont05 .mEtc02 .btn_mMore {display:block;width:152px;height:42px;line-height:42px;margin:0 auto;border:1px solid #ddd;font-size:16px;color:#222;text-align:center;} #section5 .mCont05 .mEtc03 {clear:left;margin-top:10px;} #section5 .mCont05 .mEtc03 .mBan01 {margin-bottom:10px;background:#d94200;} #section5 .mCont05 .mEtc03 .mBan01 a {display:block;height:100%;padding:0 30px 40px 30px;background: url(../img/go_arr01.png) no-repeat 92% 86%;} #section5 .mCont05 .mEtc03 .mBan01 a .tit {display:block;padding-top:28px;margin-bottom:10px;font-size:17px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan01 a .tit_text {display:block;line-height:22px;font-size:15px;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 {background:#1e2c5d;} #section5 .mCont05 .mEtc03 .mBan02 a {display:block;height:100%;padding:0 30px 40px 30px;background: url(../img/go_arr01.png) no-repeat 92% 86%;} #section5 .mCont05 .mEtc03 .mBan02 a .tit {display:block;padding-top:28px;margin-bottom:10px;font-size:17px;font-weight:700;color:#fff;} #section5 .mCont05 .mEtc03 .mBan02 a .tit_text {display:block;line-height:22px;font-size:15px;color:#fff;} @media all and (max-width: 400px) { /*메인-검색*/ #section0 .mVisual .search fieldset label.label_st {overflow: hidden;position: absolute;width: 0;height: 0;font-size: 0;line-height: 0;text-indent: -9999px;} #section0 .mVisual .search fieldset input {width: 70%;padding: 0 10px !important;margin: 0 0 0 10px;} /*팝업존*/ #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-prev, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-next {left: 30px;right: auto;} #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-button-next, #section1 .mCont01 .mPop .pzBtn_wp .pzBtn .swiper-container-rtl .swiper-button-prev {right: 30px;left: auto;} /*추천신착도서*/ #section4 .mCont04 .in #mBook > div > ul {margin-bottom:0;} #section4 .mCont04 .in #mBook > div > ul li {float: none;width:140px;margin-right:40px;margin-bottom:30px;font-size: 16px;color:#333;box-sizing: border-box;} } /**/ #foot_section .mFooter {} #foot_section .mFooter .f_menu {background:#1a1c20;line-height:30px;} #foot_section .mFooter .f_menu .in {margin:0 30px 0;} #foot_section .mFooter .f_menu .in ul {padding:10px 0;} #foot_section .mFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #foot_section .mFooter .f_menu .in ul li a {display:block;font-size:15px;color:#ccc;transition:all 0.2s;} #foot_section .mFooter .f_menu .in ul li a:hover, #foot_section .mFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #foot_section .mFooter .f_menu .in ul li:first-child a {color:#e85c31} #foot_section .mFooter .f_info{background:#121316;padding:30px 0 50px;} #foot_section .mFooter .f_info .in {margin:0 30px 0;position:relative;} #foot_section .mFooter .f_info .in ul li {margin-bottom:8px;color:#aaa;} #foot_section .mFooter .f_info .in ul li strong {display:inline-block;width:50px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:15px;font-size:13px;font-weight:400;} #foot_section .mFooter .f_info .in ul li span.tel {font-size:13px;color:#aaa;margin-right:15px;} #foot_section .mFooter .f_info .in ul li span.fax {font-size:13px;color:#aaa;} #foot_section .mFooter .f_info .in .copyright {font-size:14px;color:#aaa;padding-top:20px;} #foot_section .mFooter .f_info .in .f_logo {margin-bottom:20px} #foot_section .mFooter .f_info .in .f_logo img {width:200px;} /**/ #s_foot_section .sFooter {} #s_foot_section .sFooter .f_menu {background:#1a1c20;line-height:30px;} #s_foot_section .sFooter .f_menu .in {margin:0 30px 0;} #s_foot_section .sFooter .f_menu .in ul {padding:10px 0;} #s_foot_section .sFooter .f_menu .in ul li {display:inline-block;margin-right:18px;} #s_foot_section .sFooter .f_menu .in ul li a {display:block;font-size:13px;color:#ccc;transition:all 0.2s;} #s_foot_section .sFooter .f_menu .in ul li a:hover, #s_foot_section .sFooter .f_menu .in ul li:first-child a:hover {color:#466db8} #s_foot_section .sFooter .f_menu .in ul li:first-child a {color:#e85c31} #s_foot_section .sFooter .f_info{background:#121316;padding:30px 0 50px;} #s_foot_section .sFooter .f_info .in {margin:0 30px 0;position:relative;} #s_foot_section .sFooter .f_info .in ul li {margin-bottom:8px;color:#aaa;} #s_foot_section .sFooter .f_info .in ul li strong {display:inline-block;width:50px;height:22px;line-height:23px;text-align:center;border:1px solid #545454;margin-right:15px;font-size:13px;font-weight:400;} #s_foot_section .sFooter .f_info .in ul li span.tel {font-size:13px;color:#aaa;margin-right:15px;} #s_foot_section .sFooter .f_info .in ul li span.fax {font-size:13px;color:#aaa;} #s_foot_section .sFooter .f_info .in .copyright {font-size:14px;color:#aaa;padding-top:20px;} #s_foot_section .sFooter .f_info .in .f_logo {margin-bottom:20px} #s_foot_section .sFooter .f_info .in .f_logo img {width:200px;} /**/ #contain {background: url(../img/h_line.gif) no-repeat 50% 0;background-size: 100% 3px;} #contain #subVisual {height: 200px;background: url(../img/sub_v_img.png) no-repeat 50% 0;background-size: cover;text-align: center;margin-top: -62px;} #contain .contain .subtit_area {margin: 0 3%;border-bottom:1px solid #ddd;} #contain .contain .subtit_area h1 {font-size:22px;font-weight:700;padding: 15px 0;text-align:center;} #contain .contain .subtit_area .web_locator {display:none;} #contain #subVisual .sub_slogan {padding-top: 108px;margin: 0 auto;font-size: 22px;font-weight: 300;color: #fff;line-height: 28px;text-align: center;} #contain #subVisual .sub_slogan strong {display:block;} #contain #subVisual .locator {display:none;} #contain + #footer .contact {display:none;} /**/ #aside{display:none} #content{position:relative} /**/ #design{padding: 20px 0 50px;margin:0 3%;} #design .visual{background:url(../img/main_v_img.jpg) no-repeat 50% 0;background-size: cover;} /**/ #design .sub_visual {padding-bottom: 20px;} #design .visual h1 {padding: 30px 0;font-size: 32px;font-weight: 600;text-align:center;letter-spacing: -1px;color: #fff;} #design .visual p {position:absolute; left:10px; top:90px;} #design .visual .locator{display:none;position:relative;z-index:2000;} #design .visual .locator .path{border-bottom:1px solid #1c2645; box-shadow:0px 2px 0px rgba(0,0,0,0.1); background:#1c2645;*zoom:1} #design .visual .locator .path:before, #design .visual .locator .path:after{clear:both;display:table;content:"";line-height:0} #design .visual .locator .path *{font-size:13px;font-weight:400;color:#555} #design .visual .locator .path li{float:left;position:relative;width:33.3%;white-space:nowrap} #design .visual .locator .path li:last-child{border-right:0} #design .visual .locator .path li a{display:block;padding:8px 0;font-weight:normal;font-size:12px;color:#555} #design .visual .locator .path li button{display:block !important;width:100%;height:39px; color:#fff;text-align:left;background:#1c2645 url(../img/ico_path.png) no-repeat 95% 50% / 15px 15px;text-indent:8px;white-space:nowrap;overflow:hidden} #design .visual .locator .path li button.sel{color:#fff;font-weight:800} #design .visual .locator .path li.home{display:none} #design .vepth .navi{position:absolute;top:40px;left:0px;width:100%;border:1px solid #ccc;border-top:0;background:#fff} #design .vepth > div {display:none;} #design .vepth .navi div a{display:block;padding:10px 0;font-size:11px;color:#333;border-top:1px solid #eee;text-indent:8px} #design .vepth .navi div a:hover, #design .vepth .navi div a.on{color:#fff;background:#e04f38;} #design .visual i.img {position:absolute;z-index:2;bottom:0px;right:0px;width:100%;height:90px; background:url(../img/v1.png) no-repeat 98% 100%; background-size:auto 84px; transition:all 0.6s cubic-bezier(0.785, 0.135, 0.150, 0.860); animation-duration: 2s; animation-name: v_img_m; } /**/ #blind{position:absolute;z-index:9999;top:0px;left:0px; bottom:0;width:100%;height:100%;background:rgba(0,0,0,0.7)} #dkleft{display:none;position:absolute;z-index:10;left:0px;top:0px;width:100%;height: 100%;background:#1e2c5d;padding-bottom: 60px;} #dkleft .lefttit{text-align:left;width: 100%;padding:0 20px;box-sizing: border-box;position:absolute;top:0;left:0;height:60px;background:#1e2c5d;z-index:99;} #dkleft .lefttit img{height: 25px;} #dkleft .select {height: 100%;overflow-y: auto;} #dkleft .lefttit button{display:block;position:relative;padding: 14px 0;font-size:14px;color:#fff;border:0;background:transparent} #dkleft .lefttit button i{display:block;padding:5px 10px 0 0;font-size:20px;color:#fff} #dkleft .select .join{display:inline-block;position:relative;padding:0 10px;height:36px;line-height:36px;margin:5px 0;font-size:15px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s} #dkleft .select .join i{padding:0 7px 0 0;font-size:24px;color:#1e2c5d} #dkleft .select .idpw{display:inline-block;position:relative;padding:0 10px;height:36px;line-height:36px;margin:5px 0;font-size:15px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s} #dkleft .select .sel_btn {display:inline-block;position:relative;padding:0 8px;height:36px;line-height:36px;margin:5px 0;font-size:14px;color:#1e2c5d;border:1px solid #1e2c5d;border-radius:5px;background:#eee;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s} #dkleft .lefttit .mobile_member {display: block;padding-bottom: 5px;border-top: 1px solid rgba(255,255,255,0.3);} #dkleft .lefttit .mobile_member > a {display: block;padding: 10px 0 10px 35px;color: #fff;font-size: 15px;box-sizing: border-box;background: url(../img/member_icon.png) no-repeat 0 50%;} #dkleft .select .modify{display:block;position:relative;padding:0 17px;line-height:45px;font-size:16px;color:#000;border-bottom:1px solid #ccc;background:#eee;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s} #dkleft .select .modify span {display:inline-block;padding:0 16px;height:36px;line-height:36px;background:#2e4287;color:#fff;border-radius:5px;} #dkleft .select .modify i{display:inline-block;position:relative;top:1px;padding:0 7px 0 0;font-size:24px;color:#fff} #dkleft .depth1{display:block;width: 90%;position:relative;padding:0 15px;line-height:50px;font-size:16px;color:#fff;text-align:left;border-bottom: 1px solid rgba(255, 255, 255, .1);transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s} #dkleft .depth1 strong{position:relative;top:-2px;padding:0 4px;height:14px;line-height:14px;font-size:10px;background:#ff0000;border-radius:30px} #dkleft .depth1 span{font-style:normal;color:#ffa800} #dkleft .depth1 em{position:absolute;z-index:2;top:0;right:4px;width:39px;height:39px;background:url(/web/seomun/img/common/plus.png) no-repeat 50% 50%;background-size:11px 11px} #dkleft .depth1.sel{background: #2e4287;color:#fff;border-bottom:1px solid #596170} #dkleft .depth1 i{font-family:Linearicons-Free;display:block;margin:15px 0px 0 0;color:#aaa;transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s} #dkleft .depth1 i.rightico{float:right} #dkleft .depth1.sel i.rightico{color:#fff;-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg);transition:all 0.2s ease-in-out 0s;-webkit-transition:all 0.2s ease-in-out 0s} #dkleft .depth2{display:none;background:#fff} #dkleft .depth2 a{display:block;padding:0 20px;line-height:40px;font-size:14px;color:#555;border-bottom:1px solid #ddd;text-decoration:none} #dkleft .depth2 a.sel{color:#81c341} #dkleft .depth2 .depth3 {background-color: #f4f4f4;} #dkleft .depth2 .depth3 > li > a {display: block;font-size: 13px;padding: 7px 20px;color: #555;border-bottom: 0;line-height: 1.2em;} #dkleft .depth2 .depth3 > li:first-child > a {padding-top: 15px;} #dkleft .depth2 .depth3 > li:last-child > a {padding-bottom: 15px;border-bottom: 1px solid #ddd;} #closeleft{position: absolute;z-index: 9999999;left: -60px;top: 15px;width: 35px;height: 35px;display: block;text-align: center;font-size: 30px;font-family: Linearicons-Free;speak: none;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;line-height: 1;color: #fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale} #closeleft:before{content:"\e870";font-size:30px;line-height:1;} #gotop{position:fixed;z-index:90000;bottom:20px;right:20px;display:none} #gotop a{display:block;width:40px;height:30px;padding:30px 0 0 0;font-size:10px;font-weight:800;text-align:center;color:#fff;background:rgba(0,0,0,0.3) url(../img/gotop.png) no-repeat 48% 28%;border-radius:50px;overflow:hidden} @keyframes mv00 { from {background-position:center 110px; } to {background-position:center 0px; } } @keyframes mv01 { from {top:0px; opacity:0;} to {top:34px; opacity:1;} } @keyframes mv02 { from {top:180px;opacity:0;} to {top:240px;opacity:1;} } @keyframes v_img { from {right:50px; opacity:0} to {right:0px; opacity:1} } @keyframes v_text { from {padding-left:30px; opacity:0} to {padding-left:0px; opacity:1} } @keyframes v_navi { from {margin-top:-20px; opacity:0} to {margin-top:0px; letter-spacing:-1px; opacity:1} } @keyframes con_bg { from {background:url(../img/sub_con_bg.png) repeat-x left -30px; } to {background:url(../img/sub_con_bg.png) repeat-x left 138px; } } }