@charset "euc-kr";

body {}
.header .gnb {width:990px; margin:0 auto; text-align:left;}
.footer {width:990px; margin:0 auto; padding:30px 0 50px 0; font-size:12px; color:#d9ded9; text-align:center;}
article {width:1024px; margin:0 auto;}
.page-sub article nav,
.main-width nav {position:relative; width:100%; height:50px; background:#daf1f0; overflow:hidden;}
.page-sub .nav-popular,
.page-sub .nav-normal,
.main-width nav ul {overflow:hidden; float:left;}
.page-sub .nav-popular li,
.page-sub .nav-normal li,
.main-width nav li {float:left;}
.page-sub .nav-popular a,
.page-sub .nav-normal a,
.main-width nav a {letter-spacing:-1px;}
.page-main {background:#102155 url('http://img.imbc.com/broad/tv/drama/mr/images/bg-main2.jpg') no-repeat center 120px;}
.page-main article {position:relative; width:1264px; text-align:center;}
.ui.like.program {position:absolute; left:50%; top:0; width:1024px; margin-left:-512px;}
.page-main .logo-area-staff {right:121px;}
.logo-area {position:relative; width:100%; height:181px; overflow:hidden;}
.main-logo-area {width:100%; height:600px;}
.logo-area h1 {width:198px; height:149px; margin:19px auto 0; overflow:hidden;}
.logo-area-staff {position:absolute; top:14px; right:4px; z-index:90;}
.logo-area-staff ul {overflow:hidden;}
.logo-area-staff li {float:left; padding:0 13px 0 14px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/staff-border.gif') no-repeat right 2px;}
.logo-area-staff li, .logo-area-staff p {color:#fff; letter-spacing:-1px; font-size:11px; line-height:18px;}
.logo-area-staff p {text-align:right; font-weight:bold;}
.logo-area-staff .staff-last {padding-right:0; background:none;}


.main-width {width:1024px; margin:0 auto; text-align:left;}
.nav-popular {margin-left:19px;}
.nav-popular li {padding:0 22px; line-height:50px;}
.nav-popular a {color:#1c1a49; font-size:14px; font-weight:bold;}
.nav-normal {position:absolute; top:0; right:0;}
.nav-normal li {padding:0 15px 0 13px; line-height:50px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/nav-border.gif') no-repeat right center;}
.nav-normal a {color:#1e3d73; font-size:12px;}
.nav-normal .nav-last {background:none;}
.content-main {position:relative; width:100%; margin-top:8px; overflow:hidden;}
.content-left {position:absolute; top:0; left:0; width:250px; z-index:99; overflow:hidden;}
.preview {width:220px; height:100px; padding:20px 15px 0; background:#fff; overflow:hidden;}
.preview p {letter-spacing:-1px;}
.preview-date, .preview-time {float:left; font-weight:bold; color:#393939; font-size:14px; line-height:17px;}
.preview-date {padding:0 10px 20px 0;}
.preview-txt {clear:both;}
.preview-txt a {color:#686868; font-size:12px; line-height:16px;}
.event {width:250px; height:130px; overflow:hidden;}
.event ul {width:260px; margin-top:8px; overflow:hidden;}
.event li {float:left; margin-right:8px;}
.photo {position:absolute; top:0; right:258px; width:250px; height:508px; background:#fff url('http://img.imbc.com/broad/tv/drama/mr/images/photo-hd.gif') no-repeat 18px 17px; z-index:99; overflow:hidden;}
.photo h2 {margin:22px 0 31px 52px; font-size:11px; color:#000; line-height:14px; letter-spacing:-1px; font-weight:normal;}
.photo p {width:218px; margin:0 20px 20px 12px;}
.photo p a {color:#000; font-size:14px; line-height:20px; letter-spacing:-1px; font-weight:bold;}
.photo ul {width:100%;}
.photo li {width:220px; padding:0 15px; text-indent:9px; line-height:23px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/photo-dotted.gif') no-repeat 15px center; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.photo li a {color:#686868; font-size:12px; letter-spacing:-1px;}
.photo .photo-first {width:100%; margin-bottom:16px; padding:0; background:none; text-indent:0; white-space:normal;}
.photo .photo-first a {display:block; height:100%;}
.photo .photo-first img {width:100%;}
.photo .photo-first em {display:block; width:218px; margin:0 20px 20px 12px; color:#000; font-size:14px; line-height:20px; letter-spacing:-1px; font-weight:bold;}
.photo .photo-first span {display:block; width:100%; height:250px; overflow:hidden;}
.ad250 {position:absolute; top:0; right:0; z-index:99;}
.sketch {position:absolute; top:516px; left:0; width:250px; height:250px; background:#fff url('http://img.imbc.com/broad/tv/drama/mr/images/sketch-hd.gif') no-repeat 16px 24px; z-index:99; overflow:hidden;}
.sketch h2 {margin:28px 0 20px 49px; color:#000; font-weight:normal; font-size:11px; letter-spacing:-1px; line-height:14px;}
.sketch span {display:block;}
.sketch img {width:100%;}
.sketch-txt {width:210px; padding:0 20px 8px; line-height:20px; color:#000; font-size:14px; font-weight:bold; letter-spacing:-1px;}		
.sketch-play {position:absolute; bottom:10px; left:12px; width:36px; height:36px; overflow:hidden; background:url('http://img.imbc.com/broad/tv/ent/tutor/images/btn-play.png') no-repeat; text-indent:-5000px;}
.news {position:relative; width:100%; overflow:hidden;}
.news ul {width:110%; overflow:hidden;}
.news li {position:relative; float:left; width:250px; height:250px; margin:0 8px 8px 0;overflow:hidden;}
.news .photo-txt {position:absolute; left:17px; bottom:15px; display:block; width:220px; z-index:95; font-size:14px; line-height:1.333; letter-spacing:-1px; color: #fffefe; cursor:pointer;}
.news .thumnail-grid {position:absolute; bottom:0; left:0;}
.news .news-first {margin:0 516px 8px 258px;}
.news .news-third {margin-right:266px;}
.news .news-fifth {width:508px; height:250px; margin-left:258px;}
.news .news-fifth a {display:block; width:100%; height:100%;}
.news .news-fifth span {display:block; overflow:hidden;}
.news-txt-left {position:absolute; top:0; left:0; width:267px; height:250px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/news-fifth.png') no-repeat;}
.news-txt-left em {display:block; width:100%; margin:28px 0 20px 0; text-indent:53px; color:#234e70; font-size:11px; letter-spacing:-1px;}
.news-txt-left strong {display:block; width:218px; margin:0 auto 20px; color:#2d315a; font-size:14px; letter-spacing:-1px; line-height:18px;}
.news-txt-left span {width:218px; margin-left:22px; color:#234e70; font-size:12px; letter-spacing:-1px; line-height:18px;}
.news-photo-right {width:250px; height:250px; margin-left:258px;}
.btn-news-more {position:absolute; right:0; bottom:8px; display:block; width:250px; height:250px; padding-top:60px; background:#daf1f0 url('http://img.imbc.com/broad/tv/drama/mr/images/btn-news-more.gif') no-repeat center 98px; color:#2d315a; border:0; letter-spacing:-1px; font-size:11px; cursor:pointer; overflow:hidden;}
.bottom-main {width:100%; height:270px; margin-bottom:30px; overflow:hidden;}
.bottom-main ul {width:100%; padding-top:35px; overflow:hidden;}
.bottom-main li {float:left; width:50%; line-height:36px; text-indent:50px;}
.bottom-main li a {color:#2d315a; font-size:12px; letter-spacing:-1px;}
.bottom-main div {float:left; width:508px; height:270px; background:#daf1f0; overflow:hidden;}
.bottom-main-left {margin-right:8px;}


.page-sub {background:#070a41 url('http://img.imbc.com/broad/tv/drama/mr/images/bg-sub_v2.jpg') no-repeat center 120px; text-align:center;}
.sub-logo-area h1 {width:219px; height:159px; margin-top:20px;}
.content-sub {width:100%; margin-top:8px; background:#fff; text-align:center; overflow:hidden;}
.content-inner {position:relative; width:964px; margin:0 auto; text-align:left; overflow:hidden;}
.content-inner h2 {width:100%; margin:26px 0 22px 0; border-bottom:2px solid #ddd;}
.content-inner h2 img {margin:0 0 10px 6px;}
.inner-left {float:left; width:692px; margin-right:22px; padding-bottom:30px; overflow:hidden;}

.cast-control {position:relative; overflow:hidden; width:692px; height:62px; margin-bottom:20px; background:url("http://img.imbc.com/broad/tv/drama/yaya/images/bg_castbox_x.gif") repeat-x 0 0;}
.cast-control button {position:absolute; top:0; height:62px; border-width:1px 0px; border-style:solid; border-color:#e3e3e3; text-indent:-9999px; cursor:pointer; background-color:#fff; background-image:url("http://img.imbc.com/broad/tv/drama/yaya/images/btn_cast.png"); background-repeat:no-repeat; z-index:10;}
#cast_prev {left:0; width:41px; background-position:9px 17px;}
#cast_next {width:41px; right:0; background-position:-21px 17px;}
.cast-box {position:relative; width:608px; height:100%; margin-left:41px; border-left:1px solid #e3e3e3; border-right:1px solid #e3e3e3;}
.cast-box li {position:relative; float:left; width:122px; height:62px;}
.cast-box li a {display:block; height:62px; border-right:1px solid #e3e3e3; font-size:11px; letter-spacing:-1px; color:#44403e;}
.cast-box .nor a {width:106px; padding-left:15px;}
.cast-box .nor a:hover, .cast-box .nor a:focus, .cast-box .on.nor a {width:105px; padding-left:14px;}
.cast-box li a:hover, .cast-box li a:focus, .cast-box .on a {position:relative; height:58px; margin-left:-1px; border:2px solid #f2a77a;}
.cast-box .cast-tree {background:url("http://img.imbc.com/broad/tv/drama/yaya/images/cast_tree.gif") no-repeat 68px 20px;}
.cast-box li a:hover strong, .cast-box li a:focus strong, .cast-box .on a strong {margin:-2px 0 0 0;}
.cast-box .nor a strong {padding:14px 0 5px;}
.cast-box li a strong {position:relative; display:block; line-height:1.3; font-size:12px; font-weight:bold; z-index:1;}
.cast-box .other a {width:117px; padding:0 2px;}
.cast-box .other a strong {padding: 24px 0 5px; text-align:center;}
.cast-box .other a strong span {font-weight:normal;}
.cast-box .other a:hover, .cast-box .other a:focus, .cast-box .on.other a {width:116px; padding-right:2px; padding-left:1px;}
.cast-box .other a:hover strong, .cast-box .other a:focus strong, .cast-box .on.other a strong {margin-left:1px;}

.cast-data {margin-bottom:20px; border-bottom:2px solid #e5ecec;} 
.cast-data .cast-main-name {height:35px; *height:54px; padding:18px 0 0 21px; background:#f2f5f5; font-weight:bold; color:#737270; font-size:14px;}
.cast-data .img {display:block; margin-bottom:1px; padding-bottom:9px; border-bottom:2px solid #e5ecec;}
.cast-data .img img {width:692px; height:250px;}
.cast-main-txt {padding:19px 22px; line-height:20px}
.cast-main-txt strong {display:block; margin-bottom:10px; font-size:14px; font-weight:bold;}
.cast-other {}
.cast-other dl {position:relative; min-height:150px; *height:150px; margin-bottom:15px; padding:20px 0 0 215px; letter-spacing:-1px;}
.cast-other .img {position:absolute; top:0; left:0; width:200px; height:150px; background:#ebebeb;}
.cast-other .img img {width:100%; height:100%;}
.cast-other .cast-name {padding:0 0 20px; font-weight:bold; color:#737270; font-size:14px;}
.cast-other .cast-name span {font-weight:normal;}
.cast-other .cast-txt {line-height:18px;}

.drama-intro {position:relative; width:100%; height:2460px; overflow:hidden;}
.drama-intro p {position:absolute; left:0; width:100%; color:#555; font-size:12px; letter-spacing:-1px; line-height:20px; text-align:center; overflow:hidden;}
.intro-txt1 {top:87px;}
.intro-txt2 {top:310px;}
.intro-txt3 {top:612px;}
.intro-txt4 {top:953px;}
.staff-prime {position:absolute; left:0; top:1219px; width:100%;}
.staff-prime li {width:100%; color:#48494b; font-size:11px; letter-spacing:-1px; line-height:24px; text-align:center;}
.staff3 {margin-top:88px;}
.staff4 {margin-top:48px;}
.staff-normal {position:absolute; top:1599px;}
.staff-normal li {margin-bottom:3px; color:#494949; font-size:13px; line-height:17px; letter-spacing:-1px; overflow:hidden;}
.staff-normal em {display:block; float:left; margin-right:5px; font-weight:bold;}
.staff-normal span {display:block; float:left;}
.staff-normal-left {left:51px;}
.staff-normal-right {left:374px;}
.span-clear {clear:both;}

.banner-top {position:relative; width:100%; padding:30px 0 28px; margin-bottom:20px; text-indent:40px; background:#ebebeb; font-size:14px; letter-spacing:-0.5px; line-height:1; color:#232323;}
.banner-top a {position:absolute; top:0; right:0; display:block; width:176px; padding:28px 0 26px 0; border:2px solid #d2d2d2; background:#fff url("http://img.imbc.com/broad/tv/drama/jangbori/images/btn_ban_more.gif") no-repeat 130px 20px; font-size:14px; font-weight:bold; color:#232323; text-indent:15px; line-height:1; letter-spacing:-0.5px;}
.event-tab {margin-bottom:30px;  border-top:1px solid #e0e8e8; border-bottom:1px solid #e0e8e8;}
.event-tab ul {overflow:hidden; width:100%; margin-bottom:30px; padding:11px 0; background:#f3f6f6; border-top:1px solid #fff; border-bottom:1px solid #fff; }
.event-tab li {float:left; padding:4px 30px; border-left:1px solid #e0e8e8; line-height:1;}
.event-tab li.none-border {border-left:0 none;}
.event-tab li a {color:#2a7171;}
.event-tab li a.tab-on {font-weight:bold;}
.event-summary {position:relative; padding-bottom:56px; width:100%; *zoom:1;}
.event-summary:after {content:""; display:block; visibility:hidden; clear:both; font-size:0; height:0; line-height:0;}
.event-summary span {float:left; display:block; margin-left:30px;}
.event-summary span img {width:196px; height:196px;}
.event-summary div {float:right; width:415px; margin:0 30px 0 21px;}
.event-summary div strong {font-size:14px; line-height:34px; font-weight:bold; color:#333;}
.event-summary div p {color:#333; font-size:12px; line-height:20px;}
.event-summary div ul {padding-top:23px;}
.event-summary div ul li {padding-left:7px; background:url("http://img.imbc.com/broad/tv/drama/yaya/images/list-style01.gif") no-repeat 0 6px; font-size:12px; line-height:18px; color:#2a7171;}
.event-join {position:absolute; top:201px; left:30px; clear:both; z-index:10;}
.event-join a {display:block; width:194px; padding:9px 0; border:1px solid #ccd7d7; background:#d7e1e1; font-weight:bold; text-align:center; line-height:1; color:#333;}
.event-none {padding:174px 0; font-size:14px; color:#666; text-decoration:underline; text-align:center; letter-spacing:-0.5px;}
.event-title {display:block; padding:15px 0; font-size:12px; color:#2a7171; text-indent:30px; letter-spacing:-0.5px; border-top: 2px solid #e0e8e8;}


.roll-ban-event {position:relative; width:100%;}
.roll-ban-event .img-list {position:relative; overflow:hidden; width:100%; height:600px;}
.roll-ban-event .img-list li {position:absolute; width:100%; left:100%;}
.roll-ban-event .img-list li.fst {left:0;}
.roll-ban-event .img-list li img {width:100%; height:100%;}
.roll-ban-event .btn {position:absolute; z-index:100;}
.roll-ban-event .m-roll-ban-btn {position:absolute; left:0; bottom:13px; width:100%; text-align:center;}
.roll-ban-event .m-roll-ban-btn li {display:inline-block; *display:inline; height:13px; margin-left:4px;}
.roll-ban-event .m-roll-ban-btn li input {display:inline-block; width:12px; height:13px; padding:0; margin:0; border:0; cursor:pointer; background:url('http://img.imbc.com/broad/tv/drama/night/images/btn_roll_off.png') no-repeat 50% 50%;}
.roll-ban-event .m-roll-ban-btn li.on input {width:20px; background:url('http://img.imbc.com/broad/tv/drama/night/images/btn_roll_on.png') no-repeat 50% 50%;}
.roll-ban-event .btn {display:block; z-index:10; position:absolute; bottom:15px; width:32px; height:32px; padding:0; border:0; text-indent:-5000px; cursor:pointer;}
.roll-ban-event .btn-stop {right:126px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/btn-stop.png') no-repeat;}
.roll-ban-event .btn-play {right: 161px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/btn-play.png') no-repeat;}

.op-heading-list li {position:absolute; left:0; top:0;}
.ui.button {display:block; z-index:10; position:absolute; top:555px; width:32px; height:32px; padding:0; border:0; cursor:pointer;}
.ui.buttons {display:inline-block; position:absolute; left:50%; bottom:13px; margin-left:-30px; text-align:center;}
.ui.buttons .ui.button {float:left; position:relative; top:0; width:16px; height:16px; background:url("http://img.imbc.com/broad/tv/drama/op/img/icon-indicator.png") no-repeat;}
.ui.buttons .ui.button.active {width:20px; margin-right:2px; background:url("http://img.imbc.com/broad/tv/drama/op/img/icon-indicator-blank.png") no-repeat;}
.ui.button.play {right:161px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/btn-play.png') no-repeat; text-indent:-5000px;}
.ui.button.pause {right:126px; background:url('http://img.imbc.com/broad/tv/drama/mr/images/btn-stop.png') no-repeat; text-indent:-5000px;}
.op-heading-list {overflow:hidden; position:relative; width:100%; height:600px;}
.btn-like-program-wrap{position:absolute; top:20px; left:20px; z-index:999;}
@media only screen and (min-device-width:768px) and (max-device-width:1264px) {
	.wrapper  {width:1264px;}	
}