html,body {height:100%}
body {text-align:center; font-family:'µ¸¿ò',dotum,Helvetica,sans-serif; font-size:12px; color:#333; line-height:1.41578; -webkit-text-size-adjust:none}
.ui-main {background:#272533 url(http://img.imbc.com/broad/tv/drama/soc/img/bg-main.jpg) no-repeat center 120px}
.ui-sub {background:#272533 url(http://img.imbc.com/broad/tv/drama/soc/img/bg-sub.jpg) no-repeat center 120px}
a {color:#333}

.wrapper {overflow:hidden; position:relative; width:100%}
.header {}
.container {overflow:hidden; position:relative; width:1024px; margin:0 auto; text-align:left}
.footer {clear:both; width:1024px; height:110px; margin:0 auto; text-align:center; color:#fff; line-height:110px; letter-spacing:0.2px}

.ui-main .p-content {overflow:hidden; position:relative; width:964px; *width:1024px; padding:16px 30px 30px; margin-bottom:8px; background:#fff}
.ui-sub .p-content {overflow:hidden; position:relative; width:964px; *width:1024px; padding:0 30px 30px; background:#fff}
.p-title {width:100%; height:27px; padding:26px 0 0 5px; margin-bottom:22px; border-bottom:2px solid #ddd}
.p-section {overflow:hidden; float:left; width:692px; margin-right:22px}
.p-right-common {overflow:hidden; float:left; position:relative; width:250px; padding-bottom:18px; text-align:center}

.p-front {position:relative; height:221px}
.p-front .logo {padding:31px 0 0 388px}
.ui-main .logo {display:block; overflow:hidden; position:absolute; left:-9999px; width:0px; height:0px; padding:0 !important; font-size:0; line-height:0; text-indent:-9999px}
.p-front .p-staff {z-index:30; position:absolute; top:10px; left:18px; font-size:11px; color:#fff}
.p-front .p-staff .bor {padding-right:11px; margin-right:7px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/line-staff-v2.gif) no-repeat right top}
.p-front .p-staff .onair-time {font-weight:bold; font-size:11px; color:#fff}
.btn-like-program-wrap {position:absolute; top:10px; right:0; z-index:999}

.soc-front {position:relative; width:1024px; height:619px}
.soc-front button {overflow:hidden; display:block; border:none; cursor:pointer}
.soc-front button.btn-play {z-index:20; position:absolute; top:572px; right:44px; width:32px; height:31px; background: url(http://img.imbc.com/broad/tv/drama/soc/img/icon-play.png) no-repeat}
.soc-front button.btn-pause {z-index:20; position:absolute; top:572px; right:8px; width:32px; height:31px; background: url(http://img.imbc.com/broad/tv/drama/soc/img/icon-pause.png) no-repeat}
.soc-front .control {z-index:20; position:absolute; top:593px; left:480px}
.soc-front .control .indicator {float:left; display:block; width:13px; height:13px; margin-right:6px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/indicator-off.png) no-repeat}
.soc-front .control .indicator.active {width:21px; height:13px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/indicator-on.png) no-repeat}
.soc-front-list {}
.soc-front-list li {z-index:10; position:absolute; top:0; left:0}

.p-nav {overflow:hidden; position:relative; height:50px; background:#603d4c}
.p-nav ul {margin-left:19px}
.p-nav li {float:left; height:50px}
.p-nav li a {display:inline-block; height:50px; line-height:52px; color:#e1c9d6} 
*::-ms-backdrop, .p-nav li a {line-height:54px} /* IE11 */
.p-nav .nav {padding:0 7px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/bg-nav-v2.gif) no-repeat right center; font-size:12px}
.p-nav .nav-on {padding:0 10px; font-size:14px; font-weight:bold}
.p-nav .nav-on a {color:#fff}
.p-nav .nav-board {margin-right:5px}
.p-nav .last {background:none}

.font-txt {font-weight:bold; font-size:14px; line-height:20px}
.soc-tit {overflow:hidden; height:29px; margin-bottom:10px; background:#eee; font-weight:normal; font-size:12px; line-height:32px; text-indent:12px}

.soc-bob {overflow:hidden; float:left; position:relative; width:224px; height:231px; margin-right:16px}
.soc-bob .img {overflow:hidden; display:block; width:224px; height:126px}
.soc-bob .img img {width:100%}
.soc-bob .txt {display:block; padding-top:7px}
.soc-bob .btn-more {position:absolute; top:10px; right:9px; font-size:11px; color:#333}
.soc-bob .btn-more:after {content:"+"; padding-left:3px}

.grid-landscape {overflow:hidden; float:left; width:458px; height:231px; margin-right:266px}
.grid-landscape ul {overflow:hidden; width:470px}
.grid-landscape li {float:left; width:224px; margin-right:11px}
.grid-landscape .img {overflow:hidden; display:block; position:relative; width:224px; height:126px}
.grid-landscape .img img {width:100%}
.grid-landscape .txt {display:block; padding-top:7px}
.soc-sketch .icon-vod {z-index:10; position:absolute; bottom:8px; left:7px; width:26px; height:26px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/icon-vod.png) no-repeat}

.soc-enews {overflow:hidden; z-index:100; position:absolute; top:16px; right:30px; width:250px; height:462px}
.soc-enews ul {border-bottom:1px solid #e5e5e5}
.soc-enews .first {overflow:hidden; height:192px}
.soc-enews .first .img {overflow:hidden; display:block; width:250px; height:126px}
.soc-enews .first .img img {width:100%}
.soc-enews .first .txt {display:block; padding-top:7px}
.soc-enews .news {height:29px; padding:0 7px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/dot-news.gif) no-repeat left center; border-top:1px solid #e5e5e5; font-size:11px; line-height:30px}
.soc-enews .news a {overflow:hidden; display:block; text-overflow:ellipsis; white-space:nowrap}

.soc-box {overflow:hidden; float:left; width:224px; height:231px; margin-right:16px}
.soc-preview {display:block; height:74px; padding:19px 17px 0; margin-bottom:3px; background:#eee}
.soc-preview .date {display:block; margin-bottom:14px; font-weight:bold; font-size:12px; color:#000}
.soc-preview .txt {color:#727272; line-height:17px}

.soc-banner {overflow:hidden; width:220px; height:108px; border:2px solid #eee}
.soc-banner li {float:left; width:109px; height:53px}
.soc-banner li a {display:block}
.soc-banner li img {overflow:hidden; width:109px; height:53px}
.soc-banner .banner1 {border-right:2px solid #f1f1f1; border-bottom:2px solid #f1f1f1}
.soc-banner .banner2 {border-bottom:2px solid #f1f1f1}
.soc-banner .banner3 {border-right:2px solid #f1f1f1}

.soc-clip {overflow:hidden; width:698px; height:250px;}
.soc-clip ul {width:711px}
.soc-clip li {float:left; width:224px; margin-right:13px}
.soc-clip li .img {overflow:hidden; display:block; position:relative; width:224px; height:126px}
.soc-clip li .img img {width:100%}
.soc-clip li .txt {display:block; padding-top:7px}
.soc-clip li .icon-vod {z-index:10; position:absolute; bottom:8px; left:7px; width:26px; height:26px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/icon-vod.png) no-repeat}

.ad250 {overflow:hidden; z-index:200; position:absolute; /*top:247px;*/ top:478px; right:30px; width:250px; height:250px; background:#fff}

.p-sitemap {overflow:hidden; width:1024px; padding:26px 0 28px; background:#fff}
.p-sitemap h2 {height:25px; padding-left:36px; font-weight:bold; font-size:12px; color:#000}
.p-sitemap-grid {overflow:hidden; float:left; width:512px}
.p-sitemap-grid ul {height:147px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/line-gray.gif) repeat-y center 0}
.p-sitemap-grid ul li {float:left; width:256px; height:21px}
.p-sitemap-grid ul li a {display:block; padding-left:36px; color:#2b2b2b; line-height:21px}
.onair-drama {margin-left:-1px; border-left:1px solid #d6d6d6}


.tit-sketch img {display:inline-block}
.tit-sketch span {display:inline-block; padding-left:9px; margin-left:8px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/line-tit.gif) no-repeat left 6px; font-weight:normal; font-size:12px; color:#555; line-height:24px; vertical-align:top}

.cast-control {position:relative; overflow:hidden; width:692px; height:62px; margin-bottom:20px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/common/bg_castbox_x.gif) repeat-x 0 0}
.cast-control button {z-index:10; position:absolute; top:0; height:62px; border-width:1px 0px; border-style:solid; border-color:#e3e3e3; text-indent:-9999px; cursor:pointer; background:#fff url(http://img.imbc.com/broad/tv/drama/soc/img/common/btn_cast.png) no-repeat}
#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 .cast-tree {background:url(http://img.imbc.com/broad/tv/drama/soc/img/common/cast_tree.gif) no-repeat 68px 20px}
.cast-box li a {display:block; height:62px; border-right:1px solid #e3e3e3; font-size:11px; letter-spacing:-1px; color:#44403e}
.cast-box li a strong {position:relative; display:block; line-height:1.3; font-size:12px; font-weight:bold; z-index:1}
.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; *text-indent:-1px}
.cast-box li a:hover strong, .cast-box li a:focus strong, .cast-box .on a strong {margin:-2px 0 0 0; *text-indent:-1px}
.cast-box .nor a {width:106px; padding-left:15px}
.cast-box .nor a strong {padding:14px 0 5px}
.cast-box .nor a:hover, .cast-box .nor a:focus, .cast-box .on.nor a {width:105px; padding-left:14px}
.cast-box .other a {width:117px; padding:0 2px}
.cast-box .other a strong {padding:24px 0 5px}
.cast-box .other a strong span {font-weight:normal}
.cast-box .other a strong {text-align:center}
.cast-box .other a:hover, .cast-box .other a:focus, .cast-box .on.other a {width:116px; padding:0 2px 0 1px} 
.cast-box .other a:hover strong, .cast-box .other a:focus strong, .cast-box .on.other a strong {margin-left:1px; *text-indent:1px}
.cast-box li.p-end {margin:0 1px 0 -1px}
.cast-data {margin-bottom:20px; border-bottom:2px solid #e5ecec}
.cast-data .cast-main-name {height:35px; padding:18px 0 0 21px; background:#f2f5f5; font-weight:bold; color:#737270; font-size:14px}
.cast-data .cast-main-name span:before {content:'| '}
.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 dl {position:relative; min-height:150px; margin-bottom:15px; padding:20px 0 0 215px; letter-spacing:-1px}
.cast-other .img {position:absolute; top:17px; 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-name span:before {content:'| '}
.cast-other .cast-txt {line-height:18px}
.cast-other .cast-txt strong {display:block; margin-bottom:10px; font-weight:bold}
.other-cast-more {display:block; float:right; width:153px; margin:20px 0 0 0; border:1px solid #b5c9c9; line-height:1; padding:12px 0; *padding: 14px 0 13px; color:#3e4f4f; font-weight:bold; text-align:center; background:#c0d5d5}

.event-section {padding-bottom:10px; border-top:1px solid #e0e8e8; border-bottom:2px solid #e0e8e8; font-size:12px; line-height:18px; letter-spacing:-0.5px}
.sec-common {border-bottom:2px solid #e0e8e8}
.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/soc/img/common/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%; 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/soc/img/common/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}
.event .event-img {margin-bottom:20px}


.info-box {height:58px; margin-bottom:10px; border-top:1px solid #9d9fa6; border-bottom:1px solid #9d9fa6}
.info-box p {float:left; padding:13px 0 0 13px}
.share {float:right; position:relative; width:150px; *width:175px; height:44px; *height:58px; padding:14px 0 0 25px; background:#e6e6e6}
.share .tit-share {position:absolute; top:21px; right:29px}
.share a {display:block; float:left; margin-right:3px}

.soc-staff {overflow:hidden; width:694px; height:1848px; background:url(http://img.imbc.com/broad/tv/drama/soc/img/bg-staff-v2.jpg) no-repeat}
.soc-staff .staff-name {width:640px; padding:60px 0 47px 54px}
.soc-staff ul {padding-left:34px}
.soc-staff ul .column {float:left; width:310px; margin-left:20px}
.soc-staff ul li {font-family:dotum; font-size:14px; color:#6b6b6b; line-height:26px; letter-spacing:-1px}
.soc-staff ul li strong {font-weight:bold; padding-right:11px}
.soc-staff .line2 {float:left; height:52px}
.soc-staff .line4 {float:left; height:104px}
.soc-staff .line5 {float:left; height:130px}