@charset "utf-8";
@import url(https://www.mbcarchive.com/include/css/font.css);

/*common*/
html {-webkit-text-size-adjuct: none;-ms-text-size-adjuct: none;}
body { min-width:1218px; }
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, textarea, button,
select {margin: 0;padding: 0;border: 0;line-height: 1.42857;font: inherit;color: #333;font-family:'Nanum Gothic','나눔 고딕',dotum,'돋움';font-size: 100%;}
dl, ul, ol, menu, li {list-style: none;}
header,footer,main {display: block;}
table {border-collapse: collapse;}
a {  text-decoration: none;}
fieldset,img {border: 0 none;}
button { font-size:0; border: 0 none;  background-color: transparent;  cursor: pointer;}
button span { font-size:0; position:relative; }
em {font-style: normal;}
input,select,textarea,button {vertical-align: middle;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
svg * {fill: inherit;stroke: inherit;all: inherit;}
caption { position: absolute; left:-9999px; z-index:-1; }
.screen-out {position: absolute;left: 0;top: 0;visibility: hidden;width: 0;height: 0;line-height: 0;font-size: 0;color: transparent;}
.ellipsis-multi { text-overflow: ellipsis; overflow:hidden; display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; }
.ellipsis { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.accessibility {position: absolute;top: 0;left: 0;z-index: 9999;width: 100%;text-align: left;}
.accessibility a {display: block;position: absolute;top: -1000px;left: 0;z-index: 500;width: 100%;text-align: center;}
.accessibility a:focus, .accessibility a:active {position: absolute;top: 0;z-index: 1000;height: 20px;background: #000;font: bold 12px dotum;color: #fff;line-height: 40px;}

.wrapper{width: 1218px; margin:0 auto; position:relative; }
.main { line-height:1; letter-spacing:-1px; }

/* 슬라이드 공통 */
.slide-wrap .slick-arrow { width:75px; height:75px; background:url(../img/slide-arrow.png) no-repeat left center; position:absolute; top:0; bottom:0; margin:auto; z-index:20; }
.slide-wrap .slick-prev { left:18%; }
.slide-wrap .slick-next { right:18%; background-position:right center;}

/* 이전 header*/
/*.header {width: 100%;text-align: cente;}
.gnb-wrap{position: relative;width: 1024px;h eight: 60px;margin: 0 auto;}
.gnb-wrap .gnb {position: absolute;top: 22px;right: 12px;}
.gnb-wrap .gnb a {display: inline-block;zoom: 1;*display: inline;padding: 0 10px;margin-left: -4px;line-height: 1;color: #757575;background: url("../img/header-verticalbar.jpg") no-repeat right center;}
.gnb-wrap .gnb .sitemap {padding-right: 0;background: none;}
*/

/* 2019 개편 header */
.mbcarchive-header * { line-height:1; }
.header-wrap { position:relative; }
.snb-wrap { height:60px; background:url(../img/logo-bg.jpg) repeat-x center top; }
.snb-wrap .wrapper { overflow:hidden; height:60px; line-height:60px; vertical-align:middle; padding-right:7px; }
.snb-wrap a {  }
.snb-wrap .logo { float:left; line-height:60px; }
.snb-wrap .logo a {  }
.snb-wrap .logo a img { vertical-align:middle; }
.snb-wrap .snb { float:right; margin-right:-7px; }
.snb-wrap .snb ul { font-size:0; }
.snb-wrap .snb ul li { line-height:60px; display:inline-block; margin-left:40px; }
.snb-wrap .snb ul li:hover a { background-color:#fff; color:#3030c1; }
.snb-wrap .snb ul li.active a { background-color:#fff; color:#3030c1; }
.snb-wrap .snb ul li:first-child { margin-left:0; }
.snb-wrap .snb ul li a { letter-spacing:-1px; line-height:1; padding:5px 7px; vertical-align:middle; font-size:14px; color:#fff; font-family:'notokr-medium'; }

.gnb-wrap { height:55px; background-color:#562173; }
.gnb-wrap ul li, .gnb-wrap .gnb-sub { display:inline-block; }
.gnb-wrap a {  }
.gnb-wrap .gnb { text-align:center; }
.gnb-wrap .left ul { font-size:0; }
.gnb-wrap .left ul li:hover { background-color:#391d5b; }
.gnb-wrap .left ul li.collection {  }
.gnb-wrap .left ul li a { padding:0 50px; line-height:55px; display:inline-block; }
.gnb-wrap .left ul li strong { vertical-align:middle; font-family:'notokr-medium'; color:#fff; font-size:17px; line-height:1; }
.gnb-wrap .left ul li span.down { vertical-align:middle; text-indent:-9999px; margin-left:20px; display:inline-block; width:10px; height:5px; background:url(../img/common/btn_gnb_down.png) no-repeat left center; }
.gnb-wrap .right { position:absolute; right:0; top:50%; margin-top:-8px; font-size:0; }
.gnb-wrap .gnb-panel { margin-left:18px; }
.gnb-wrap .gnb-search input { cursor:pointer; display:block; width:17px; height:16px; background:url(../img/common/btn_search-v2.png) no-repeat center center; }
.gnb-wrap .gnb-panel input { cursor:pointer; display:block; width:15px; height:14px; background:url(../img/common/btn_menu.png) no-repeat center center; }
.gnb-wrap .gnb-sub button span { font-size:0; }

.header-wrap { position:relative; width:100%; z-index:30; }
.header-wrap .search-panel { width:100%; height:105px; background-color:#6e6ed3; display:none; }
.header-wrap .search-panel.active { display:block; }
.header-wrap .search-panel .search-text { font-size:0; line-height:105px; text-align:center; }
.header-wrap .search-panel .wrapper { height:100%; }
.header-wrap .search-panel form { vertical-align:middle; font-size:0; display:inline-block; }
.header-wrap .search-panel input#search {  }
.header-wrap .search-panel input::placeholder { color:#ccc; }
.header-wrap .search-panel input:-ms-input-placeholder { color: #ccc; }
.header-wrap .search-panel button { font-size:0; }
.header-wrap .search-panel button.search-detail { vertical-align:middle; margin-left:26px; }
.header-wrap .search-panel input.search-close { width:25px; height:24px; background:url(../img/common/btn_search_close_v2.png) no-repeat center center; position:absolute; top:50%; margin-top:-12px; right:-66px; }
.header-wrap .search-panel button span {  }

.header-wrap .menu-panel-wrap { position:relative; }
.header-wrap .menu-panel {background-color:#f3f3f2;position:absolute; top:0; left: 0;width: 100%; display:none; }
.header-wrap .menu-panel.active { display:block; }
.header-wrap .panel-menu { padding:30px 60px 32px; box-sizing:border-box; }
.header-wrap .panel-menu .wrapper { height:100%; overflow:hidden; }
.header-wrap .panel-menu h3 { font-size:25px; font-family:'notokr-bold'; color:#04041e; float:left; width:25%; }
.header-wrap .panel-menu ul { overflow:hidden; float:left; width:75%; }
.header-wrap .panel-menu ul li { float:left; line-height: 35px; }
.header-wrap .collsearch { border-bottom:4px solid #3030c1; }
.header-wrap .collsearch ul li { width:20%;margin-bottom: 3px; }
.header-wrap .collsearch ul li a { font-family:'notokr-bold'; color:#04041e; font-size:16px; padding: 4px 6px 4px; }
.header-wrap .collsearch ul li a:hover { background-color:#3030c1;color:#fff; }
.header-wrap .panel-menu.program { border-bottom:4px solid #01e6cc; }
.header-wrap .panel-menu.program .more-btn {  }
.header-wrap .panel-menu.program .more-btn button.next { display:block; position:absolute; right:5%; top:50%; margin-top:-47px; width:95px; height:95px; text-indent:-9999px; background:url(../img/common/btn_program.png) no-repeat center center; }
.header-wrap .panel-menu.program .more-btn button.prev { display:block;position:absolute; left:13%; top:50%; margin-top:-47px; width:95px; height:95px; text-indent:-9999px; background:url(../img/common/btn_program_prev.png) no-repeat center center; }
.header-wrap .panel-menu .program-list { overflow:hidden; float:left; width:60%; }
.header-wrap .panel-menu .program-list ul { float:none; width:100%; max-height:188px; }
.header-wrap .panel-menu .program-list ul li { width:185px; float:left; }
.header-wrap .panel-menu .program-list ul li:first-child {  }
.header-wrap .panel-menu .program-list ul li a, .header-wrap .program ul li span, .header-wrap .program ul li strong { display:inline-block; }
.header-wrap .panel-menu .program-list ul li a { width:154px; }
.header-wrap .panel-menu .program-list ul li span, .header-wrap .program ul li strong { font-size:16px; font-family:'notokr-bold'; line-height:21px; color:#04041e; word-break:keep-all; }
.header-wrap .panel-menu .program-list ul li a .txt{ display:inline-block; }
.header-wrap .panel-menu .program-list ul li a .txt strong{display: block; padding: 4px 6px 4px;box-sizing: border-box; }
.header-wrap .panel-menu .program-list ul li a .txt span {display: inline;padding: 0 6px 4px;box-sizing: border-box;}
.header-wrap .panel-menu .program-list ul li a:hover .txt strong, 
.header-wrap .panel-menu .program-list ul li a:hover .txt span{background-color:#3030c1;color:#fff;}
.header-wrap .panel-menu .program-list ul li .img { width:154px; height:97px; margin-bottom:14px; overflow:hidden; }
.header-wrap .panel-menu .program-list ul li .img img { width:100%; height:100%; }

/* 메인 visual 슬라이더 */
.visual { position:relative; height:550px; overflow:hidden; }
.visual-slide { width:100%; height:100%; }
.visual-slide .item { position:relative; }
.visual-slide .item a, .visual .item span { display:block; }
.visual-slide .item a {  }
.visual-slide .item .txt-wrap { position:absolute; width:1046px; height:550px; right:0; left:0; }
.visual-slide .item .txt { vertical-align:middle; max-width:60%; position:absolute; bottom:20%; padding:20px; background-color:rgba(0,0,0,0.5); }
.visual-slide .item .sub, .visual .item .tit { color:#fff; line-height:1; font-family:'notokr-medium'; }
.visual-slide .item .sub { font-size:18px; line-height:24px; margin-bottom:15px; }
.visual-slide .item .tit { font-size:60px; text-shadow:2px 2px 10px #222; line-height:67px; }
.visual-slide .item .img { font-size:0; }
.visual-slide .item .img img{width:100%;min-height:550px}
.visual-page-wrap { text-align:center; position:absolute; bottom:30px; left:0; right:0; z-index:20; }
.visual-page-wrap ul { font-size:0; display:inline-block; }
.visual-page-wrap ul li { display:inline-block; font-size:0; margin:0 4px; }
.visual-page-wrap ul li button { width:14px; height:13px; background:url(../img/slide-dot.png) no-repeat right center; }
.visual-page-wrap ul li.slick-active button { background-position:left center; }
.visual-page-wrap .pause { display:inline-block; font-size:0; vertical-align: bottom; }
.visual-page-wrap .pause button { width:14px; height:13px; background:url(../img/slide-stop.png) no-repeat center 1px; }

/**************************************************************** 메인 contents */
/* contents 공통 */
.con-wrap .tit-area { font-size:0; }
.con-wrap .tit-area h2 { line-height:1; vertical-align:middle; letter-spacing:-2px; display:inline-block; font-size:28px; font-family:'notokr-bold'; color:#3030c1; }

/* 오늘의 아카이브 (메인 검색) */ 
.search-wrap { background-color:#f7f7f7; padding:55px 0; margin-bottom:55px; }
.search-wrap .wrapper { width:1046px; }
.search-wrap .tit-area { margin-bottom:20px; }
.search-wrap .today-search { line-height:1; vertical-align:middle; display:inline-block; margin-left:37px; font-size:28px; color:#bf329e; font-family:'notokr-bold'; }

.search { position:relative; text-align: center; }
select{  border:1px solid #C9C9C9; background:#fff; height:30px !important; line-height:30px; box-sizing:border-box;  display:inline-block;} 
input[type=text]{ border:1px solid #C9C9C9; background:#fff; height:28px; line-height:28px;}

.search .hash-list { text-align:left; }
.search .hash-list ul li {display:inline-block;margin-right: 67px;}
.search .hash-list ul li:first-child { margin-left:0; }
.search .hash-list ul li a {font-size:22px;color:#3030c1;font-family:'notokr-medium';line-height: 36px;}
.search .hash-list ul li:nth-child(2n) a { color:#a5a5a5; }

.search .field{position: relative; margin-bottom:27px; }
.search legend{display: none;}
.search .field { font-size:0; }
.search .field input, .search .field a, .search .field img {  }
.search .field input[type=text] { padding:0 20px; border:none; width:829px; height:51px; background:url(../img/common/bg_search_bar_v2.png) no-repeat center center; box-sizing:border-box; font-size:18px; font-family:'notokr-demilight'; }
.search .btn_search { border:1px solid #3030c1;background:#3030c1;font-size:12px;color:#fff;width: 50px; line-height: 28px; }
.search .btn_search_default { width:73px; height:51px; border:none; vertical-align:top; }
.search .btn_search_detail { margin-left:14px; }

.search .keyword_list{position: absolute !important;top: 60px !important; left:0 !important; overflow:auto;width:626px; width:901px; height:200px;background:#fff; z-index:500; border:1px solid #CFCFCF;margin-top: -2px;display: none;z-index: 999;}
.search .keyword_list ul{ cursor: pointer}
.search .keyword_list ul li{ text-align:left;font-size:12px;line-height: 20px;}
.search .keyword_list ul li a{font-size: 12px; color:#6f6f6f;display:block; padding:4px 20px;}

/*메인 상세보기*/
.detail-wrap{position:absolute;top: 62px; left:0; right:0; margin:auto; width: 907px;padding:47px 68px 44px 66px;border:2px solid #545454;border-radius: 2px; background: #fff;text-align: left;z-index: 500;display: none; font-size:14px; }
.detail-top{border-bottom:1px solid #D9D9D9;padding-bottom: 16px;position: relative;}
.detail-top h3{display: inline-block;font-size:18px;color:#333;font-weight: bold;line-height: 1;letter-spacing: -0.5px;}
.detail-top .comment{position: absolute;top: 6px;margin-left: 6px;font-size:13px;color:#666;line-height: 1;letter-spacing: -1px;}

.search_detail > dl{overflow:hidden;}
.search_detail dl{padding-left: 7px;}
.search_detail dl>dt{float:left;padding-left:7px;background: url('../img/detail-dot.jpg') no-repeat;width:89px;font-size:13px;color:#545454;font-weight: bold;line-height: 1;letter-spacing: -1px;}
.search_detail dl.first>dt{padding-top: 28px;padding-bottom: 20px;background-position: left 34px;}
.search_detail dl.second>dt{padding-top: 10px;padding-bottom: 32px;background-position: left 14px;}
.search_detail dl.third>dt{padding-top:38px;padding-bottom:47px;background-position: left 44px;}

.search_detail dl>dd{float:left;width: 538px;}
.search_detail dl.first>dd{padding-top: 28px;padding-bottom: 20px;}
.search_detail dl.second>dd{letter-spacing: -0.5px;}
.search_detail dl.third>dd{padding-top: 30px;padding-bottom: 37px;position: relative;}

/*dl>first*/
.search_detail dl.first input[type=checkbox]{margin-top: -2px;}
.search_detail dl.first label{color:#545454;font-size: 13px;line-height: 1;}
/*dl>second*/
input.date{width: 170px;text-indent: 11px;color:#a9a9a9;}
.ui-datepicker-trigger{vertical-align: top;margin-left: -1px;}
.txt-info{font-size:12px;color:#757575;line-height: 1;padding-top: 12px;padding-left: 5px;}
/*dl>third*/
.search_detail dl.third select{width: 120px;}
.search_detail dl.third input[type=text]{width: 250px;color:#999;text-indent: 11px;}
.serch_more{margin-left: 8px;}

/* 최고의 콜렉션 */
.best-collection { margin-bottom:96px; }
.best-collection .tit-area { width:1046px; margin-bottom:52px; }
.best-coll-wrap .wrapper { width:1070px; }
.best-coll-wrap ul { overflow:hidden; margin-bottom:87px; }
.best-coll-wrap ul li { overflow:hidden; background-color:#ccc; width:49%; height:348px; float:left; text-align:center; }
.best-coll-wrap ul li { margin:0 0 2% 2%; }
.best-coll-wrap ul li.list1, .best-coll-wrap ul li.list3, .best-coll-wrap ul li.list5 { margin-left:0; }
.best-coll-wrap ul li.list5, .best-coll-wrap ul li.list6, .best-coll-wrap ul li.list7 { width:32%; height:214px; margin-bottom:0; }
.best-coll-wrap ul li a { position:relative; width:100%; height:100%; display:table;vertical-align:middle; font-size:0; }
.best-coll-wrap ul li a span {  }
.best-coll-wrap ul li a span.img { position:absolute; top:0; left:0; z-index:0; width:100%; height:100%; }
.best-coll-wrap ul li a span.img img { position:absolute; top:0; bottom:0; right:0; left:0; margin:auto; width:100%; transform-origin:center center; transition:all 0.3s; }
.best-coll-wrap ul li a span.img:after { content:''; display:block; width:100%; height:100%; background:url(../img/thumb-cover.png); position:absolute; top:0; left:0; }
.best-coll-wrap ul li:hover a span.img img { transform:scale(1.1); }
.best-coll-wrap ul li a span.txt { position:relative; z-index:10;  display:table-cell; vertical-align:middle; padding:0 40px; }
.best-coll-wrap ul li a span.txt span { font-family:'notokr-bold'; color:#fff; font-size:28px; line-height:32px; text-shadow:1px 1px 5px #222; }
.best-coll-wrap ul li a span.en { display:none; }
.best-coll-wrap ul li:hover a span.kr { display:none; }
.best-coll-wrap ul li:hover a span.en { display:block; }
.best-coll-wrap .more-btn a { margin:0 auto; display:block; width:200px; height:50px; }

/* 인기있는 아카이브 VOD */
.popular-vod { width:100%; margin:0 auto 98px; padding:73px 0 63px; background-color:#f7f7f7; }
.popular-vod .wrapper { width:1063px; margin:0 auto; height:270px; overflow:hidden; }
.popular-vod .tit-area { margin-bottom:20px; }
.popular-vod .tit-area h2 { line-height:36px; }
.popular-vod .follow { float:right; font-size:0;}
.popular-vod .follow a { font-size:0; display:block; width:117px; height:36px; }
.popular-vod .pvod-wrap { width:1097px; position:absolute; left:-50%; right:-50%; margin:auto; }
.popular-vod .pvod-slide .item { height:187px; }
.popular-vod .pvod-slide .item iframe { padding:0 17px; box-sizing:border-box; }
.popular-vod .pvod-slide a { display:block; margin:0 17px; outline-color:#f7f7f7; }
.popular-vod .pvod-slide a, .popular-vod .pvod-slide strong, .popular-vod .pvod-slide span { display:block; }
.popular-vod .pvod-slide .slick-arrow { width:45px; height:45px; background-size:90px; margin-top:-22px; top:50%; bottom:auto; }
.popular-vod .pvod-slide .slick-prev { left:17px; }
.popular-vod .pvod-slide .slick-next { right:17px; }
.popular-vod .pvod-slide .img { margin-bottom:22px; }
.popular-vod .pvod-slide .tit { font-size:24px; font-family:'notokr-demilight'; color:#040404; }

/* 아카이브 서비스 */
.ac-service { margin-bottom:148px; }
.ac-service.wrapper { width:1063px; }
.ac-service .tit-area { margin-bottom:45px; }
.service-wrap ul { overflow:hidden; }
.service-wrap ul li { float:left; padding:0 50px; box-sizing:border-box; border-left:2px solid #d3d3d3; }
.service-wrap ul li.first {  }
.service-wrap ul li.first { padding-left:0; border:none; }
.service-wrap ul li.last { padding-right:0; }
.service-wrap ul li a, .service-wrap ul li span, .service-wrap ul li strong { display:block; }
.service-wrap ul li a { width:284px; font-size:0; box-sizing:border-box; }
.service-wrap ul li .img { width:100%; height:212px; overflow:hidden; margin-bottom:17px; font-size:0; position:relative; }
.service-wrap ul li .img img { width:100%; position:absolute; top:0; left:0; right:0; }
.service-wrap ul li .tit { font-size:24px; font-family:'notokr-demilight'; color:#15183c; margin-bottom:7px; }
.service-wrap ul li .sub { font-size:14px; font-family:'notokr-demilight'; color:#15183c; line-height:20px; word-break:keep-all; margin-bottom:21px; letter-spacing:0; }
.service-wrap ul li .btn { font-size:0; }

/* 회원가입 */
.join-form { background:url(../img/join-bg.jpg) repeat-x center top; background-size:100%; padding:40px 0 145px; box-sizing:border-box; }
.join-form .tit-area { text-align:center; margin-bottom:70px; }
.join-form .wrapper { width:719px; background:url(../img/join-form-bg.png); padding:45px; box-sizing:border-box; }
.join-wrap .form-list { margin-top:28px; }
.join-wrap .user-id { margin-top:0; }
.join-wrap .user-pw { margin-bottom:60px; }
.join-wrap label, .join-wrap input { display:inline-block; width:100%; }
.join-wrap label { margin-bottom:3px; font-family:'notokr-medium'; font-size:15px; color:#3030c1;}
.join-wrap input { height:42px; border:1px solid #5656cc; padding:0 14px; box-sizing:border-box; font-family:'notokr-demilight'; font-size:14px; }
.join-wrap input::placeholder { color:#3d3dc5; }
.join-wrap input:-ms-input-placeholder { color: #3d3dc5; }
.join-wrap .join-btn { text-align:center; }
.join-wrap .join-btn button { width:343px; height:50px; background-color:#3030c1; }
.join-wrap .join-btn button span { font-size:17px; font-family:'notokr-medium'; color:#fff; }

/*footer*/
#footer { background-color:#000; padding:45px 0; }
#footer .fnb { overflow:hidden; margin-bottom:5px; }
#footer .left { float:left; }
#footer .right { float:right; }
#footer ul { font-size:0; }
#footer ul li { display:inline-block; line-height:20px; }
#footer ul li a { display:inline-block; color:#fff; font-size:12px; font-family:'notokr-regular'; }
#footer ul.foot-menu li { margin-left:34px; }
#footer ul.foot-menu li:first-child { margin-left:0; }
#footer ul.foot-menu li.sitemap a { padding:0 12px; border:1px solid #fff; }
#footer ul.sns-menu li { margin-left:18px; }
#footer ul.sns-menu li:first-child { margin-left:0; }
#footer ul.sns-menu li a { background-position:center center; background-repeat:no-repeat; text-indent:-9999px; height:20px; }
#footer ul.sns-menu li a.twt { background-image:url(../img/common/fnb-sns1.png); width:20px; }
#footer ul.sns-menu li a.fcb { background-image:url(../img/common/fnb-sns2.png); width:10px;  }
#footer ul.sns-menu li a.isg { background-image:url(../img/common/fnb-sns3.png); width:22px;  }
#footer .copyright { color:#fff; font-size:12px; font-family:'notokr-regular'; }

/*datepicker*/
#ui-datepicker-div{display: none;padding: 0;}