@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

/************************
**********Û¨ø² **********
************************/

body {font-family: óÝÍú?ðç, 'Nanum-Gothic'; font-size: 12px; position: relative;}

#container {overflow: hidden; position: relative;}
.nav {background: #59493f; border-top: 1px solid #c9c9c9; border-bottom: 1px solid #c9c9c9; height: 57px;}
.nav-inner {width: 100%; margin: 0 auto; overflow: hidden; text-align: center; height: 57px;}
.nav-inner ul {display: inline-block;}
.nav-inner ul li {height: 57px; line-height: 57px; float: left; text-align: center;}
.nav-inner ul li:first-child a {background: none;}
.nav-inner ul li a {display: block; background: url('http://img.imbc.com/broad/tv/culture/memory100/images/menu_bar.png') no-repeat left 23px; color: #FFF; font-size: 16px; font-weight: bold; padding: 0 20px; letter-spacing: -1px;}
#footer {background: #eaeaea; padding: 23px 0; color: #70662d; font-size: 12px;}


/*************************
********** ?Öï **********
************************/
.visual {position: relative; height: 650px; background: #000; overflow: hidden;}
.roll-ban-event {height: 650px; width: 1200px;}
.visual-txt-box {width: 930px; text-align: left; height: 89px; padding-top: 30px; margin: 0 auto; background: url("http://img.imbc.com/broad/tv/drama/again/img/bg-visual-text.png") repeat-x top left; z-index: 100; position: absolute; bottom: 15px; left: 50%; margin-left: -465px;}
.main-page-container .box-visual {z-index: 10; height: 650px; width: 1200px; margin: 0 auto;}
.roll-ban-event li {width: 1200px; height: 650px;}
.main-page-body .visual .btn-front {position: absolute; overflow: hidden; left: 50%; bottom: 30px; margin-left: 455px; padding: 0; border: 0; display: block; z-index: 200; width: 25px; height: 25px; text-indent: 100%; white-space: nowrap; cursor: pointer; background-image: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/btn-play-stopV2.png'); background-repeat: no-repeat; background-color: transparent; background-position: 0 -25px;}
.main-page-body .visual .btn-stop {background-position: 0 0;}
.roll-controll-btn {position: absolute; bottom: 30px; left: 50%; width: 140px; margin-left: -70px; text-align: center; z-index: 100; height: 16px;}
.roll-controll-btn .btn {display: inline-block; width: 16px; height: 16px; padding: 0; margin-right: 10px; border: 0; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/img-dot.png') no-repeat top center; cursor: pointer;}
.roll-controll-btn .btn.on {height: 16px; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/img-dot.png') no-repeat top center; background-position: 0 -16px;}
.visual-txt-box p {z-index: 100; color: #fff; font-size: 30px;}
.visual-txt-box .visual-day {font-size: 16px; letter-spacing: 0; font-weight: normal;}
.visual-txt-box .visual-title {padding-top: 5px;}
.visual-txt-box p a {color: #fff; font-size: 30px; font-family: 'Nanum Gothic'; font-weight: bold; letter-spacing: -3px;}
.btn-preview {position: absolute; bottom: 47px; border: 0; background: none; right: 50%; margin-right: -470px; z-index: 100; cursor: pointer;}
.hotissue_area .swiper-container > ul > .next:first-child {left: 100%;}
.hotissue_area .swiper-container > ul > .prev.last-child {right: 100%;}
.box-player-preview {position: absolute; bottom: 30px; right: 50%; margin-right: -465px; z-index: 9999; display: none;}
.box-player-preview .btn-close {position: absolute; bottom: 545px; right: 50%; margin-right: -465px;}
.bg-visual {display: block; width: 100%; height: 650px; background: url('http://img.imbc.com/broad/tv/culture/peoplegood/images/bg-visual11.png') repeat-x top center; position: absolute; top: 0; left: 0;}
.main-logo {position: absolute; top: 0; left: 50%; z-index: 100; margin-left: -460px; width: 245px; display: none;}
.btn-like-program-wrap {display: inline-block; position: absolute; top: 12px; right: 50%; margin-right: -505px; z-index: 100;}
.info {position: absolute; top: 20px; left: 50%; margin-left: -515px; font-size: 16px; color: #000; letter-spacing: -1px; z-index: 100;}
.content-inner {width: 1024px; margin: 0 auto; overflow: hidden;}
.content-header {text-align: center; padding: 20px 0;}

/* ×»ôü?ËÀ */
.content01 {background: #eaeaea; padding-bottom: 30px;}
.box-vod {position: relative; width: 1024px; height: 510px;}
.vod-list {position: absolute; overflow: hidden;}
.vod-list li {width: 500px; height: 250px; float: left; margin-top: 10px;}
.vod-list li.list-last {width: 512px; margin-left: 12px;}
.vod-list li:first-child {margin: 0 262px;}
.vod-list li a {overflow: hidden;}
.vod-list li a .img,
.vod-list li a .txt {width: 250px; height: 250px; display: inline-block; float: left;}
.vod-list li a .img {position: relative; overflow: hidden;}
.vod-list li a .img img {position: absolute; top: 0; left: 0; height: 250px; margin-left: -50px;}
.vod-list li a .img .bg-box {background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/bg-vod-img.png') no-repeat right center; display: inline-block; width: 250px; height: 250px; position: absolute; top: 0; left: 0; z-index: 111;}
.vod-list li a .txt {background: #fff; width: 205px; *width: 250px; height: 210px; *height: 250px; padding: 20px 20px 20px 25px; overflow: hidden; text-align: left;}
.vod-list li.list-last a .txt {background: #fff; overflow: hidden; text-align: left; width: 205px; *width: 262px; height: 210px; *height: 250px; padding: 20px 26px 20px 31px;}
.vod-list li a .txt .broad-num {color: #5e6c82; font-size: 14px; line-height: 29px; letter-spacing: -1px; height: 29px;}
.vod-list li a .txt .broad-title {color: #000; font-size: 20px; line-height: 29px; letter-spacing: -1px; padding-bottom: 15px; border-bottom: 1px solid #ccc; font-weight: bold;}
.vod-list li a .txt .broad-txt {color: #606060; overflow: hidden; font-size: 14px; line-height: 20px; letter-spacing: -1px; padding-top: 15px; float: none; height: 80px;}
.vod-list li a .txt .broad-day {color: #5e5e5e; font-size: 14px; line-height: 20px; letter-spacing: -1px; padding-top: 15px;}
.content01 .btn-title {position: absolute; width: 250px; height: 250px;}
.content01 .btn-more {position: absolute; top: 195px; left: 195px;}
.box-vod .ad {position: absolute; top: 0; right: 0;}

/* ۨ׻?? */
.content02 {background: #ead354; padding-bottom: 30px;}
.content02 .content-inner {position: relative;}
.main-page-content .img {position: relative;}
.main-page-content .img img {position: absolute; top: 0; left: 0; height: 250px;}
.area-clip .img img {margin-left: -50px;}
.main-page-content .img .bg-box {background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/bg-vod-img.png') no-repeat right center; display: inline-block; width: 250px; height: 250px; position: absolute; top: 0; left: 0; z-index: 111;}
.content-inner div {float: left;}
.box-cont {margin: 0 12px; overflow: hidden; width: 500px; height: 250px;}
.box-cont .img,
.box-cont .txt {width: 250px; height: 250px; overflow: hidden;}
.main-page-content .txt {background: #fff; text-align: left; width: 205px; *width: 250px; height: 210px; *height: 250px; padding: 20px 20px 20px 25px;}
.main-page-content .txt .broad-num {color: #5e6c82; font-size: 14px; line-height: 29px; letter-spacing: -1px;}
.main-page-content .txt .broad-title {color: #000; font-size: 20px; line-height: 29px; letter-spacing: -1px; padding-bottom: 15px; border-bottom: 1px solid #ccc;}
.main-page-content .txt .broad-txt {color: #606060; font-size: 14px; line-height: 20px; letter-spacing: -1px; padding-top: 15px; margin-bottom: 15px;}
.main-page-content .txt .broad-day {color: #5e5e5e; font-size: 14px; line-height: 20px; letter-spacing: -1px;}
.content02 ul {overflow: hidden;}
.content02 ul li {float: left; display: block;}
.content02 .btn {position: absolute; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/btn-next-prev.png') no-repeat; bottom: 30px; display: inline-block; width: 15px; height: 27px; border: 0;}
.content02 .btn-prev {background-position: 0 0; left: 169px;}
.content02 .btn-next {background-position: -43px 0; left: 210px;}
.content02 .sns {width: 250px; height: 250px; background: red;}

/* ?ݤֵ */
.content03 {background: #b2b2b2;}
.content03 .img .bg-box {background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/bg-series-img.png') no-repeat left center; display: inline-block; width: 250px; height: 250px; position: absolute; top: 0; left: 0; z-index: 111;}
.content03 .btn {position: absolute; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/btn-next-prev.png') no-repeat; bottom: 30px; display: inline-block; width: 15px; height: 27px;}
.content03 .btn-prev {background-position: 0 0; left: 169px;}
.content03 .btn-next {background-position: -43px 0; left: 210px;}
.content03 .link-box {width: 250px; height: 250px; background: blue;}
.content03 .link-box img {width: 250px; height: 250px;}
.content03 .txt {background: #fff; width: 205px; *width: 250px; height: 169px; *height: 250px; padding: 61px 20px 20px 25px;}
.content03 .txt .broad-num {background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/bg-series-num.png') no-repeat top center; padding-top: 14px; color: #b37028; font-size: 32px; line-height: 29px; letter-spacing: -1px; text-align: center;}
.content03 .txt .broad-title {color: #404f27; font-size: 24px; line-height: 29px; letter-spacing: -1px; text-align: center; margin-top: 10px; border-bottom: 0; padding-bottom: 0;}
.content03 .txt .broad-link {color: #5e5e5e; font-size: 14px; line-height: 20px; letter-spacing: -1px; padding-top: 15px;}
.content03 .txt {position: relative;}
.content03 .content-inner {position: relative;}
.content03 .txt .btn-more {position: absolute; display: inline-block; padding-right: 15px; text-decoration: underline; bottom: 30px; right: 20px; font-size: 16px; color: #32353d; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/btn-link.jpg') no-repeat right center;}
.content03 .btn {position: absolute; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/btn-next-prev.png') no-repeat; top: 300px; display: inline-block; width: 15px; height: 27px;}
.content03 .btn-prev {background-position: 0 0; left: 169px;}
.content03 .btn-next {background-position: -43px 0; left: 210px;}
.box-player-preview {display: none;}
#bg_layer {display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: .70; filter: alpha(opacity=70); /*IE 5-7*/ z-index: 10;}
.vic-layout {width: 931px; height: 574px; display: none; position: absolute; left: 25%; bottom: 31px; z-index: 999;}
.vic-layout .btn-close {position: absolute; right: -25px; top: 0px; width: 25px; height: 25px; background: #000 url('http://img.imbc.com/broad/tv/culture/peoplegood/images/btn-close.png') no-repeat 0 0; text-indent: -9999px; z-index: 9999;}
.vod_wrap {clear: both; width: 931px; height: 574px; overflow: hidden; z-index: 999;}
.btn-t {display: inline-block; *display: inline; padding: 0 15px;}
.vod_wrap iframe {border: 0 none;}
.bx-wrapper {position: relative; margin: 0 auto 60px; padding: 0; *zoom: 1;}
.bx-wrapper img {max-width: 1200px; height: 650px; display: block;}
.bx-wrapper .bx-viewport {overflow: visible;}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {position: absolute; top: 600px; width: 100%; text-align: center; z-index: 999;}
.bx-controls-direction {width: 120px; height: 80px; position: absolute; top: 0; left: 0;}
.bx-wrapper .bx-pager {text-align: center;}
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {display: inline-block; *zoom: 1; *display: inline;}
.bx-wrapper .bx-pager.bx-default-pager a {display: inline-block; width: 16px; height: 16px; padding: 0; margin-right: 10px; border: 0; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/img-dot.png') no-repeat top center; cursor: pointer; font-size: 0; text-indent: -9999px;}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {height: 16px; background: url('http://img.imbc.com/broad/tv/culture/mbcspecial/img/img-dot.png') no-repeat top center; background-position: 0 -16px;}
.bx-wrapper .bx-prev:hover {background-position: 0 0;}
.bx-wrapper .bx-next:hover {background-position: -43px 0;}
.bx-wrapper .bx-controls-direction a {position: absolute; top: 50%; margin-top: -16px; outline: 0; width: 32px; height: 32px; text-indent: -9999px; z-index: 9999;}
.bx-wrapper .bx-controls-direction a.disabled {display: none;}
.bx-wrapper .bx-controls-auto {text-align: center;}
.bx-wrapper .bx-controls-auto .bx-start {position: absolute; overflow: hidden; left: 50%; top: 9px; margin-left: 46px; padding: 0; border: 0; display: block; z-index: 200; width: 22px; height: 22px; text-indent: 100%; white-space: nowrap; cursor: pointer; background-image: url("http://img.imbc.com/broad/tv/drama/again/img/btn-play-stop.png"); background-repeat: no-repeat; background-color: transparent;}
.bx-wrapper .bx-controls-auto .bx-start.active {background-position: 0 -22px;}
.bx-wrapper .bx-controls-auto .bx-stop {position: absolute; overflow: hidden; left: 50%; margin-left: 46px; padding: 0; top: 9px; border: 0; display: block; z-index: 200; width: 22px; height: 22px; text-indent: 100%; white-space: nowrap; cursor: pointer; background-image: url("http://img.imbc.com/broad/tv/drama/again/img/btn-play-stop.png"); background-repeat: no-repeat; background-color: transparent; background-position: 0 -22px;}
.bx-wrapper .bx-controls-auto .bx-stop.active {background-position: 0 -22px;}
.bx-wrapper .bx-caption {position: absolute; bottom: 0; left: 0; background: #666\9; background: rgba(80, 80, 80, 0.75); width: 100%;}
.bx-wrapper .bx-caption span {color: #fff; font-family: Arial; display: block; font-size: .85em; padding: 10px;}
.bx-wrapper {margin: 0 auto;}
.bx-start {display: none;}
.bx-stop {display: none;}
.slider.opacity {opacity: 0.4;}

.info {display: none;}