@import url(https://font.imbc.com/nanumgothic/nanumgothic.css);
@import url(https://font.imbc.com/noto/noto.css);

/* common style */
a {color:inherit;}
button {border:0 none;background:none;cursor:pointer;}
body { text-align:center; }
.wrapper {min-width:1024px;font-family:'Malgun Gothic', '맑은 고딕', dotum, sans-serif;}
.ellipsis{
 overflow: hidden;
 text-overflow: ellipsis;
 display: -webkit-box;
 -webkit-line-clamp:2;
 -webkit-box-orient: vertical;
 word-wrap:break-word; 
} 

/*main top visual - teaser  */
.visual-top {position:relative;overflow:hidden;width:1024px;margin:0 auto;height:150px;background:url(http://img.imbc.com/broad/tv/drama/welcome2life/images/main-top.jpg) no-repeat 50% bottom;}
.visual-top .broad_info {overflow:hidden;margin:40px 0 0 40px; }
.visual-top .broad_info .tit-logo {float:left;width:73px;margin-right:20px;}
.visual-top .broad_info .broad_about {margin-top:0;line-height: 28px;text-align:left;}
.visual-top .broad_info .broad_about h2 {color:#fff; font-size:22px; font-weight:bold;letter-spacing:-0.1em; margin-bottom:7px; }
.visual-top .broad_info .broad_about .broad_staff {color:#fff;font-size:12px;letter-spacing:-0.05em; line-height:20px; }
.visual-top .broad_info .broad_about .broad_staff img { vertical-align:middle; margin:0 3px; }
.visual-top .btn-like-program-wrap {display:inline-block;position:absolute;z-index:200; right:20px; top:42px;}

/* main top visual */
.main.visual-top { overflow:hidden; width:1024px; height:auto; background:none; margin:10px auto 0; position:relative;}  
.main.visual-top .broad_info { width:1024px; overflow:hidden; position:absolute; bottom:57px; left:40px; z-index: 200; margin:0; }
.main.visual-top .broad_info .tit-logo {float:left;width:73px;margin-right:17px;}
.main.visual-top .broad_info .broad_about {margin-top:0; line-height: 28px;text-align:left;}
.main.visual-top .broad_info .broad_about h2 {color:#fff; font-size:22px; font-weight:bold;letter-spacing:-0.09em; margin-bottom:3px; }
.main.visual-top .broad_info .broad_about .broad_staff {color:#fff;font-size:12px;letter-spacing:-0.12px; display:inline-block; margin-left:1.5px; margin-top:2px; line-height:20px;}
.main.visual-top .broad_info .broad_about .broad_staff img { vertical-align:middle; }
.main.visual-top .btn-like-program-wrap {display:inline-block;position:absolute;z-index:200; right:20px; top:20px;}

/*preview visual-txt-box */
.roll-ban-event { width:1024px; height:580px; position:relative; margin-bottom:15px; background-color:#000;}
.roll-ban-event li { position: absolute; top: 0; left: 0; width:1024px; height: 580px;opacity: 0; -ms-filter: "alpha(opacity=0)"; z-index:10;}
.roll-ban-event li img { width:100%; height:100%; }
.roll-ban-event li:first-child{ opacity: 1; -ms-filter: "alpha(opacity=100)"; }
.roll-controll-btn .btn:last-child {margin-right: 0;}
.roll-controll-btn .btn { vertical-align:middle; background-color:#dcdcdc; border-radius:50%; border:2px solid #dcdcdc; box-sizing:border-box; display: inline-block; width: 12px; height: 12px;margin-right: 18px; border: 0; cursor: pointer; } 
.roll-controll-btn .btn.on { border:2px solid #000; background-color:#fff;} 
.btn-front { position:absolute; right:0; width: 22px; height: 22px; text-indent: 100%; white-space: nowrap; cursor: pointer; background-image:url('http://img.imbc.com/broad/tv/drama/fantasy2017/images/btn-play-stop.png'); background-repeat: no-repeat; background-color: transparent; background-position: 0 0; background-color:#ddd; z-index: 1000; }
.btn-stop { background-position: 0 -22px; }
.btn-preview{ position:absolute; top:23px;right: 15px;cursor:pointer;}

/*sub top visual*/
.sub .visual-top {position:relative;overflow:hidden;width:1024px;margin:0 auto;height:150px;background:url(http://img.imbc.com/broad/tv/drama/welcome2life/images/main-top.jpg) no-repeat 50% bottom;}
.sub .visual-top .broad_info {overflow:hidden;margin:43px 0 0 40px; position:static; }
.sub .visual-top .broad_info .tit-logo {float:left;width:73px;margin-right:20px;}
.sub .visual-top .broad_info .broad_about {margin-top:0;line-height: 28px;text-align:left;}
.sub .visual-top .broad_info .broad_about h2 {color:#fff; font-size:22px; font-weight:bold;letter-spacing:-0.1em; margin-bottom:7px; }
.sub .visual-top .broad_info .broad_staff {color:#fff;font-size:12px;letter-spacing:-0.05em; line-height:20px; }
.sub .visual-top .broad_info .broad_about .broad_staff img { vertical-align:middle; margin:0 3px; }
.sub .btn-like-program-wrap {display:inline-block;position:absolute;z-index:200; right:20px; top:42px;}

/*nav*/
.nav {margin: 0 auto; height: 94px;font-size:15px;line-height:45px;letter-spacing:-.5px}
.nav ul { height:45px;text-align: center;margin-top:12px;border-bottom:1px solid #ccc;}
.nav li {display: inline-block;*display: inline; text-align: center;vertical-align: top; position:relative; margin:0 15px; }
.nav li .item{display: inline-block;*display: inline;position: relative;height: 45px;vertical-align: top;color:#222; font-size:15px; }
.nav li .item:hover{color:#005897;font-weight:bold; border-bottom:3px solid #005897; box-sizing:border-box;}
.nav .hidden {display: none;}
.nav li .dropdown {display:none;z-index:50;position: absolute;top:45px; text-align: center; padding:2px 0; }
.nav li .dropdown a {display:inline-block;*display: inline;color: #000;font-family: 'Nanum Gothic';font-size: 15px;line-height: 30px;margin-left:22px;}
.nav li .dropdown a:hover {color: #005897;	text-decoration: underline;border:0; font-family: 'Nanum Gothic Bold';}
.nav li .dropdown a:first-child { margin-left:0; }

/*section paging*/
.section .num { display:none; }
.section .paging{position:absolute;top:0px; right:0px;}
.section .paging a{ display: block;float: left}
.section .paging a img { width:28px; height:28px; }

/*contents*/
.section { width:1024px; margin:0 auto; position:relative; text-align:left; margin-bottom:45px; overflow:hidden; }
.section h2 {width:228px;height: 34px;color:#010101;font-size:14px;font-weight: bold;line-height:2;} 
.section .box-wrap { width:714px; position: relative; float:left; margin-bottom:40px; }
.section .con_box { height:216px; overflow:hidden; }
.section .con_box ul { float:left; }
.section .con_box ul li { position:relative; float:left; width:228px; height: 214px; margin-right:12px; border:1px solid #dcdcdc; }
.section .con_box ul li:nth-child(3n){margin-right:0;}
.section .con_box a {line-height:20px; font-weight:bold; font-size:14px; letter-spacing:-.5px; color:#424242; font-weight:bold;}
.section .con_box .img {position:relative; display:block; width:100%; height:128px; margin-bottom:7px; overflow:hidden;}
.section .con_box .img img{width:228px;}
.section .con_box .txt {padding:3px 15px; display:block;font-size:14px;text-align:left;color:#424242;font-weight: normal;}
.section .con_box img.ico-m-play {width:30px; height:30px;position:absolute; bottom:10px; right:10px; width:auto; height:auto; z-index:10;}
.date {position: absolute;color:#959595; font-size:11px;bottom:7px; left:15px;line-height: 20px;}
.content .section-bottom {  }
.content .section-main-right { width:250px; position:absolute; top:0; right:0; }

/* main - preview section */
.ad-wrap {margin-bottom: 40px;}
.section-preview {position:relative;overflow:hidden;text-align:left;margin-bottom: 40px;display: none;}
.section-preview .left{float:left;width:714px;}
.section-preview .vod{ overflow:hidden; width:384px; float:left;}
.section-preview .vod a img { margin-left:-10%; height:263px; }
.section-preview .vod-txt {float:left;width:298px;height:238px;padding:20px 12px 0 20px;letter-spacing:-0.1em;color:#222;font-size:14px;position:relative;}
.section-preview .vod-txt p:nth-child(1){font-weight:bold;}
.section-preview .vod-txt div:nth-child(2){font-size:22px;line-height:30px;margin-top:14px;}
.section-preview .vod-txt p:nth-child(3){color:#757575;letter-spacing:0;position:absolute;bottom:20px;}

/* main - sketch section */
.section .sketch { width:230px; margin-right:12px; }

/* main - photo section */
.section .photo { width:472px; } 
.section .photo_box ul li:nth-child(2n) { margin-right:0; } 

/* main - news section */
.section .news { width:714px; } 

/* main - clip section */
.section .clip {width:714px;/* display:none; */} 

/* main - insta section */
.section .insta-wrap { display:none; }
.section .insta-wrap .insta { width:250px; height:250px; }
.section .insta-wrap .insta a { display:inline-block; width:100%; height:100%; background-color:#ff9900; }

/* main - cast slide */
.castList { margin-bottom:40px; position:relative; width: 250px; height: 250px;overflow: hidden; }
.castList ul li { float: left;position: relative; width: 250px; height: 250px; background: #e3f1ff;overflow: hidden;}
.castList ul li a{ position: absolute; top: 0; right: 0; }
.castList .name{ font-size:22px; color:#000; position:absolute; top:19px; left:25px; line-height:29px;letter-spacing: -1.5px;}
.castList li a img { width:250px; }

/* main - event banner */
.event-wrap { margin-bottom:45px; width: 250px; height: 250px; overflow: hidden; }
.event-wrap a { display:block; width:100%; height:100%; }

/* footer */
#footer { padding:55px 0; color:#424242; background-color:#ececec; }

/*----------------------------------------------- 서브 ----------------------------------------*/
/*sub*/
.sub .content { width:1024px; *width:1024px;margin: 0 auto; padding-bottom:50px;background: #fff; text-align: left; overflow: hidden;}
.sub .content h2.tit-content { color:#000; padding-left:50px; background:#f3f3f3 url(http://img.imbc.com/broad/tv/ent/livingwith/img/sub-title.png) 28px no-repeat; border:1px solid #e0e0e0; margin-bottom: 15px;line-height: 44px;font-size:15px;font-weight:bold;}
.sub .content h2.tit-content span { font-size:12px; color:#005897; background:url(http://img.imbc.com/broad/tv/drama/welcome2life/images/sub-tit-line.png) no-repeat left 2px; padding-left:10px; margin-left:9px; vertical-align:bottom; }
.sub .content .section-left {position:relative; margin-right: 48px; width: 725px; float: left; }
.sub .content .section-left .imbbs {text-align:center;padding-top:10px;margin-top:10px;border:1px solid #dbdbdb; }
.sub .content .section-right { float: left;}
.sub .border_box {text-align:center;}

/* board */
.recommend-banner { margin-bottom:20px; }

/* concept */
.concept-txt { padding:95px 100px 95px 155px; box-sizing:border-box; background:url(http://img.imbc.com/broad/tv/drama/welcome2life/images/concept-bg.jpg) no-repeat center top; height:1185px; box-sizing:border-box; }
.concept-txt .top-txt { margin-bottom:28px; }
.concept-txt .bottom-txt { color:#000; font-family:'notokr-regular'; font-size:16px; line-height:26px; letter-spacing:-1px; }
.concept-txt .bottom-txt strong.blue { font-family:'notokr-bold'; color:#005897; }

/* staff */
.staff-wrap { padding:0 275px; box-sizing:border-box; background:url(http://img.imbc.com/broad/tv/drama/welcome2life/images/staff-bg.jpg) no-repeat center top; height:489px; }
.staff-main { width:100%; height:489px; text-align:left; }
.staff-main ul { width:100%; height:100%; padding-top:80px; box-sizing:border-box; }
.staff-main ul li { margin:20px auto 0; overflow:hidden; font-size:0; }
.staff-main ul li:first-child { margin-top:0; }
.staff-main ul li strong, .staff-main ul li span { font-size:16px; line-height:26px; }
.staff-main ul li strong { display:inline-block; vertical-align:bottom; color:#000; width:37%; margin-right:3%; }
.staff-main ul li span { font-family: 'notokr-regular'; font-weight:normal; display:block; }
.staff-main ul li span.name-wrap { display:inline-block; overflow:hidden; width:60%; vertical-align:bottom; letter-spacing:-1px; word-break:keep-all; }
.staff-main ul li span.name { color:#000; clear:both; }
.staff-main ul li span.portfolio { color:#000; word-break:keep-all; }

.staff-name { padding:30px 0; box-sizing:border-box; overflow:hidden; background-color:#9cd1d3; }
.staff-name table { box-sizing:border-box; width:50%; float:left; overflow:hidden; font-family:'돋움', 'dotum', sans-serif; }
.staff-name table tr {  }
.staff-name table tr:first-child { border-top:none; }
.staff-name table th, .staff-name table td { text-align:left; letter-spacing:-1px; vertical-align:middle; font-size:14px; padding:0 10px; color:#333; height:30px; }
.staff-name table th { font-family:'notokr-medium'; font-weight:normal; color:#0b3233; padding-left:50px; }
.staff-name table td { font-family:'notokr-regular'; color:#383838; }
.staff-name table td.spacing-none { letter-spacing:0px; }
.staff-name table tr.first-item th, .staff-name table tr.first-item td { }
.staff-name table tr.last-item th, .staff-name table tr.last-item td {  }
.staff-name table.left { border-right:1px solid #b0dadc; }
.staff-name table.right { border-left:1px solid #8cbcbd; }
.staff-name table.right th { box-sizing:border-box; }

/*cast*/
.ui-list-cast-slide { width:725px; margin-bottom:13px; }
.ui-list-cast-slide ul { width:733px; margin-left:-4px; overflow:hidden; }
.ui-list-cast-slide ul li { float:left; width:33.3333%; padding:0 4px 8px; box-sizing:border-box; background:#fff; }
.ui-list-cast-slide ul li a { font-size:14px; color:#333; border:1px solid #e3e3e3; box-sizing:border-box; display:inline-block; width:100%; text-align:center;padding:15px 0;}
.ui-list-cast-slide ul li.active a { color:#005897; border:1px solid #005897; text-decoration: underline; }
.ui-list-cast-slide ul li.active a span {font-weight: bold;}
.ui-list-cast-slide ul li a:hover { color:#005897; border:1px solid #005897; text-decoration: underline; font-weight:bold; }

.ui-list-cast-slide ul.sub-cast li { width:25%; }
.ui-list-cast-slide ul.main-cast li a:hover { border:1px solid #005897; }
.ui-list-cast-slide ul.main-cast li.active a { border:1px solid #005897; }
.ui-list-cast-slide ul.sub-cast li a:hover { border:1px solid #005897; }

.ui-list-cast-slide ul.sub-cast li.cast1 { width:33.3333%; } 

.ui-dividing-cast-main { overflow: hidden; position: relative; overflow: hidden;}
.ui-dividing-cast-main .image { overflow: hidden; position: relative; width: 300px; height: 450px; margin: 0 0 10px;  float: left; margin-right: 21px; }
.ui-dividing-cast-main .header { height: 53px; padding: 0 0 0 20px; background-color: #f2f5f5; border-top: 2px solid #e0e8e8; font-size: 14px; font-weight: bold; color: #737270; line-height: 53px; float: left; width: 384px; *width: 360px; }
.ui-dividing-cast-main .header .extra { margin: 0 0 0 6px; padding: 0 0 0 8px; background: url("http://img.imbc.com/broad/tv/drama/hwajung/img/bg-cast-main.png") repeat-y left; }
.ui-dividing-cast-main .description { margin: 0 0 16px; padding: 20px 25px; line-height: 18px; border-bottom: 2px solid #e0e8e8; width: 354px; *width: 360px; float: left; }
.ui-dividing-cast-main .description .meta { font-weight: bold; font-size:13px;margin-bottom: 18px}
.ui-dividing-cast-child { overflow: hidden; position: relative; }
.ui-dividing-cast-child .item { overflow: hidden; position: relative; float: left; width: 200px; height: 206px; margin: 0 5px 0 0; }
.ui-dividing-cast-child .item .image { overflow: hidden; position: relative; width: 200px; height: 150px; margin: 0 0 1px;}
.ui-dividing-cast-child .item .header { height: 53px; padding: 0 20px; background-color: #f2f5f5; border-top: 2px solid #e0e8e8; font-size: 14px; font-weight: bold; color: #737270; line-height: 53px; }
.ui-dividing-cast-child .item .header .extra { margin: 0 0 0 13px; padding: 0 0 0 8px; background: url("http://img.imbc.com/broad/tv/drama/hwajung/img/bg-cast-main.png") repeat-y left; }
.ui-button-cast-main { position: absolute;right: 12px;top: 2px;height: 53px;padding: 0 9px 0 0;line-height: 53px;color: #3c7a72;text-decoration: underline;background: url("http://img.imbc.com/broad/tv/drama/hwajung/img/icon-arrow-right.png") no-repeat right center; }
.ui-button-cast-main strong { font-weight: bold; }
.ui-button-cast-side { display: block; position: absolute; right: 13px; top: 2px; height: 53px; padding: 0 9px 0 0; line-height: 53px; color: #3c7a72;  text-decoration: underline; background: url("http://img.imbc.com/broad/tv/drama/hwajung/img/icon-arrow-right.png") no-repeat right center; }
.ui-dividing-cast-side { overflow: hidden; position: relative; padding: 76px 0 0; background: url("http://img.imbc.com/broad/tv/drama/hwajung/img/bg-cast-header.png") repeat-x top; }
.ui-dividing-cast-side .category { display: block; position: absolute; left: 13px; top: 2px; height: 53px; padding: 0 9px 0 0; line-height: 53px; color: #3c7a72; }
.ui-button-cast-side strong { font-weight: bold; }
.ui-list-cast-side { overflow: hidden; position: relative; }
.ui-list-cast-side .item { position: relative; width: 475px; *width:669px;min-height: 140px; margin-bottom: 20px; *margin-bottom: 45px; padding: 10px 0 0 218px; }
.ui-list-cast-side .item.item_m { margin: 0; } 
.ui-list-cast-side .item .image { overflow: hidden; position: absolute; left: 0; top: 0; width: 200px; height: 150px; }
.ui-list-cast-side .item .image img { width: 200px; *margin-top:-20px; }
.ui-list-cast-side .item .header { margin: 0 0 15px; font-size: 14px; color: #777574; font-weight: bold; }
.ui-list-cast-side .item .header .extra { margin: 0 0 0 13px; padding: 0 0 0 8px; background: url("http://img.imbc.com/broad/tv/drama/hwajung/img/bg-cast-main.png") repeat-y left; font-weight:normal; }
.ui-list-cast-side .item .meta { margin: 0 0 15px; color: #44403e; line-height: 18px; }
.ui-list-cast-side .item .description { color: #44403e; line-height: 1.5; font-weight:bold; }

/*news*/

/*vod preview  */
.preview_wrapper p { text-align:center !important; font-size:12px; }
.preview_wrapper em { text-align:center !important; font-size:12px; }
.preview_wrapper .vod_btn { margin-left:10% !important; }

/* 제작발표회 */
.live { padding-top:236px; box-sizing:border-box; margin-bottom:20px; background:#1c2135 url(http://img.imbc.com/broad/tv/drama/welcome2life/images/live-bg.jpg) no-repeat center top; letter-spacing:-1px; height:938px; }
.live .live-top {  }
.live .live-info { text-align:center; margin-bottom:120px; }
.live .live-info img { margin-right:-40px; }
.live .live-info .live-text { font-family:'Malgun Gothic', '맑은 고딕', dotum, sans-serif; }
.live .live-info .cast-txt { font-size:16px; color:#000; margin-bottom:8px; text-decoration:underline; }
.live .live-info .date-txt {  }
.live .live-info .date-txt strong, .live .live-info .date-txt span { font-size:18px; color:#2221a6; font-weight:bold; }
.live .live-vod { margin-bottom:17px; text-align:center; }
.live .live-vod-wrap { width:640px; margin:0 auto; box-sizing:border-box; }
.live .live-vod-wrap img { width:100%; }
.live .on-air { margin-bottom:42px; }
.live .live-bottom { text-align:center; padding:0 12px; }
.live .heyo-banner { margin-bottom:23px; }
.live .btn-area { margin-bottom:36px; }
.live .btn-area ul { width:458px; margin:0 auto; overflow:hidden; }
.live .btn-area ul li { float:right; }
.live .btn-area ul li:first-child { float:left; }
.live .btn-area ul li a { display:block; }
.live .bbs-img { padding:18px 0; border-top:2px solid #333333; }
.live .bbs-img span { font-size:15px; color:#fff; font-family:'notokr-regular', 'Malgun Gothic', '맑은 고딕', dotum, sans-serif; }
.live-boardtxt { margin-bottom:30px; background:#000 url(http://img.imbc.com/broad/tv/drama/hideandseek/images/botton-line.png) repeat-x center bottom; color:#fff; text-align:center; padding-bottom:20px; font-family:'notokr-light'; letter-spacing:-1px; font-size:16px; }

/**/
#rptView_ctl00_tblAdamMedia { text-align:center; }
.btn-like-program-wrap .btn-like-program-summary { margin-top:5px !important; }