@charset "utf-8";
/************************************************
Version : JTBC 1.0
Date : 2017-10-17
*************************************************/

/* **** reset **** */
html, body, div, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, img, ins, kbd, q, samp,small, var, i,dl, dt, dd, ol, ul, li,fieldset, form, legend,table, caption, tbody, tfoot, thead, tr, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time,  audio, video {margin:0; padding:0; border:0;  vertical-align:baseline; background:transparent; list-style:none; box-sizing:border-box; font-family:AppleSDGothicNeo, roboto, sans-serif; font-size:100%; letter-spacing:-0.05em }
span, em, mark, strong, b, label {margin:0; padding:0; border:0; vertical-align:baseline; background:transparent; list-style:none; box-sizing:border-box }
body {line-height:1; -webkit-text-size-adjust:none; color:#000; min-width:320px;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display:block }
fieldset, img, abbr, acronym {border:0 }
ol, ul {list-style:none }
em,i{font-style:normal}
a, a:link, a:visited, a:active {text-decoration:none; box-sizing:border-box }
a:hover {text-decoration:none }
button {margin:0; padding:0; border:0; cursor:pointer; background:none; font-family:AppleSDGothicNeo, roboto, sans-serif }
button:focus {outline:none}


 /* 탑 이동 버튼 */
.topScroll {display:block; position:fixed; right:9px; bottom:17px; width:45px; height:45px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_top.png) no-repeat 0 0; text-indent:-999px; overflow:hidden; z-index:10; background-size:45px 45px }
  @media all and (min-width:360px) and (max-width:740px) {
    .topScroll {right:9px; bottom:12px; width:55px; height:55px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_top.png) no-repeat 0 0;  background-size:55px 55px }
  }

 /* list(목록형) */
.clipList {margin-bottom:39px }
.clipList li {margin-left:13px; margin-right:13px; margin-top:14px; padding-top:14px; border-top:1px solid #ededed }
.clipList li:first-child {margin-top:0; padding-top:0; border-top:0 }
.clipList > li > span {display:block;}
.clipList li a {/*display:table;*/ width:100%; table-layout:fixed; }
.clipList li figure {position:relative; display:table-cell; width:107px;  height:61px; vertical-align:middle; background:#ccc }
.clipList li figure mark {display:block; position:absolute; left:0; top:0; width:21px; height:21px; line-height:21px; text-align:center; background:#f62e8f; color:#fff; font-size:11px }
.clipList li figure i {display:block; position:absolute; right:0; bottom:0;  width:35px; height:16px; line-height:16px; text-align:center; font-size:9px; color:#ccc; background:rgba(0,0,0, 0.5) }
.clipList li figure img {width:100%;  display:block; height:100%;}
.clipList li div {display:table-cell; vertical-align: middle; padding-left:14px }
.clipList li div p a{font-size:13px; color:#222; max-height:30px; line-height:120%; margin-bottom:7px; font-family:AppleSDGothicNeo-Medium,roboto-medium; overflow: hidden; white-space: normal; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;text-overflow: ellipsis }
.clipList li div span{position:relative; margin-left:11px; display: block; float:left; font-size:11px; line-height:100%; color:#797d84 }
.clipList li div span a{color:#797d84 }
.clipList li div span a img {height:17px; width:auto;}
.clipList li div span:first-of-type {margin-left:0; }
.clipList li div span:after {content:""; position:absolute; left:-6px; top:0; border-left:1px solid #ccc; height:10px }
.clipList li div span:first-of-type:after {display:none }
  @media all and (min-width:360px) and (max-width:740px) {
    .clipList {margin-bottom:45px }
    .clipList li {margin-left:13px; margin-right:13px; margin-top:15px; padding-top:15px }
    /*.clipList li a {height:67px }*/
    .clipList li figure {width:120px; height:69px} /*640*/
    .clipList li figure mark {width:23px; height:23px; line-height:23px;  font-size:12px }
    .clipList li figure i {width:39px; height:18px; line-height: 19px; font-size: 11px;font-family: Helvetica Neue,Helvetica,sans-serif; letter-spacing:0 }
    .clipList li div {padding-left:15px }
    .clipList li div p a{font-size:14px; max-height:38px; margin-bottom:6px; line-height:130% }
    .clipList li div span{margin-left:13px; font-size:13px }
    .clipList li div span:after { height:12px }
  }

 /* list(슬라이드형) */
.clipColList {position:relative; overflow:hidden }
.clipColList li {float:left }
.clipColList li a {display:block; width:127px; margin-left:8px}
.clipColList li:first-child a {margin-left:0}
.clipColList li figure {position:relative; display:block; height:72px; /*background:#ccc;*/ overflow: hidden }
.clipColList li figure i {display:block; position:absolute; right:0; bottom:0;  width:35px; height:16px; line-height:16px; text-align:center; font-size:9px; color:#ccc; font-weight:300; background:rgba(0,0,0, 0.5) }
.clipColList li figure img {width:127px; height:72px; display:block;}
.clipColList li div p {max-height:29px; line-height:120%; margin-top:7px; margin-bottom:6px; font-family:AppleSDGothicNeo-Medium,roboto-medium; font-size:13px; color:#222; overflow: hidden; white-space: normal;display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;text-overflow: ellipsis }
.clipColList li div p a{color:#222;}
.clipColList li div {position:relative}
.clipColList li div span {display:block; font-size:11px; color:#797d84}
.clipColList li div span a{color:#797d84}
.clipColList li div span:nth-of-type(1) {white-space:nowrap;  text-overflow: ellipsis; overflow:hidden; padding-top:1px }
.clipColList li div span:nth-of-type(2) {margin-top:4px}
  @media all and (min-width:360px) and (max-width:740px) {
    .clipColList li a {width:142px; margin-left:10px }
    .clipColList li figure {height:80px }
    .clipColList li figure img {width:142px; height:80px}
    .clipColList li figure i {width:39px; height:18px; line-height: 19px; font-size: 11px;font-family: Helvetica Neue,Helvetica,sans-serif;letter-spacing:0 }
    .clipColList li div p {font-size:13px; max-height:38px;  margin-bottom:5px; line-height:130%; font-size:14px ; }
    .clipColList li div span {font-size:12px;  margin-top:8px }
  }



 /* tab */
.tabWrap {padding:0 13px; margin-bottom:13px; border-bottom:1px solid #e7e7e7; transform: translateZ(10px); -webkit-transform: translateZ(10px); -webkit-overflow-scrolling: touch}
.tabWrap:after {content:""; display:block;clear:both;}
.tabWrap > a {position:relative; display:block; float:left; width:50%; height:39px; line-height:39px; text-align:center; font-size:14px; font-weight:bold;  color:#83878e }
.tabWrap > a.selected {color:#f62e8f }
.tabWrap > a.selected:after {content:""; position:absolute; left:0; bottom:-1px; right:0; border-bottom:3px solid #f62e8f }
  @media all and (min-width:360px) and (max-width:740px) {
    .tabWrap {padding:0 15px; margin-bottom:15px; transform: translateZ(10px); -webkit-transform: translateZ(10px); -webkit-overflow-scrolling: touch}
    .tabWrap > a {height:44px; line-height:44px;  font-size:16px }
  }


/* popup */
.popupArea {position:absolute; left:0; top:0; bottom:0; right:0; height:100%; z-index:1000}
.popupArea header {position: fixed; left:0; top:0; z-index:2; width:100%; height:42px; background:#262930}
.popupArea header .btnClose {position:absolute; right:0; top:0; width:43px; height:41px; text-indent:-999px; overflow:hidden;background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_close.png) no-repeat 50% 50%; background-size:15px 15px}
.popupArea header h1 {font-size:17px; color:#fff; height:41px; line-height:41px; text-align:center}
.popupArea .popCont {position:relative; z-index:1; padding-top:42px }
  @media all and (min-width:360px) and (max-width:740px) {
    .popupArea header {height:45px}
    .popupArea header .btnClose {width:45px; height:45px; background-size:18px 18px}
    .popupArea header h1 {font-size:19px; height:45px; line-height:45px}
    .popupArea .popCont {padding-top:45px}
  }


/* Title  */
.h2Title {margin-bottom:13px; padding:0 13px; font-size:16px; font-weight:700; line-height:100%; font-family:AppleSDGothicNeo-Bold,roboto-bold; font-weight:bold}
.h2Title button{font-size:16px; font-family:AppleSDGothicNeo-Bold,roboto-bold; font-weight:bold; line-height:100%;  padding-right:14px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_h201.png) no-repeat 100% 49.7%; background-size:6px 9px }
.h2Title.type02 {font-size:14px; }
  @media all and (min-width:360px) and (max-width:740px) {
    .h2Title {margin-bottom:15px; padding:0 15px; font-size:18px}
    .h2Title button{font-size:18px; }
    .h2Title.type02 {font-size:17px; }
  }

 /* btnMore  */
.btnMore {height:52px; text-align:center; width:100%; border-bottom:1px solid #ededed;border-top:1px solid #ededed}
.btnMore span {display:inline-block; padding-right:13px; background: url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_more.png) no-repeat 100% 50%; background-size:10px 6px ; color:#939393; font-size:13px}
.clipList + .btnMore {margin-top:-26px;}
  @media all and (min-width:360px) and (max-width:740px) {
    .btnMore {height:59px; text-align:center; width:100%}
    .btnMore span {display:inline-block; padding-right:15px; background-position:100%  50%;  font-size:15px}
    .clipList + .btnMore {margin-top:-30px;}
  }

 /* **** main **** */
 /* topclipArea(NEW CLIPS) */
.topclipArea {margin-bottom:35px; padding:18px 0 28px; background:#272930}
.topclipArea .h2Title {color:#fff; margin-bottom:14px; font-size:17px}
.topclipArea .slideWrap {overflow: hidden; position: relative}
.topclipArea .slide {}
.topclipArea .slide ul {position: relative}
.topclipArea .slide ul li {float:left; padding-left:13px; width:290px;   box-sizing:border-box}
.topclipArea .slide ul li a {display:block; color:#fff}
.topclipArea .slide ul li a figure {position:relative; min-height:155px;background:#444750 }
.topclipArea .slide ul li a figure:before {content:""; position:absolute; left:0; right:0; bottom:0; height:100%;   background: url(https://nstatic.jtbc.co.kr/tvclips/m/images/bg_sh.png) repeat-x 50% bottom; background-size: contain}
.topclipArea .slide ul li a figure:after  {content:""; position:absolute; left:50%; top:50%; width:38px; height:38px; margin:-16px 0 0 -16px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_play.png) no-repeat 0 0; background-size:38px 38px }
.topclipArea .slide ul li a img {width:100%; display:block }
.topclipArea .slide ul li a mark {display:block; color:#f9459c; font-size:12px; margin-top:15px; margin-bottom:6px; line-height:100%;overflow: hidden; white-space: nowrap; text-overflow: ellipsis}
.topclipArea .slide ul li a p {font-size:13px; max-height:38px; line-height:17px; margin-bottom:1px;  overflow: hidden; white-space: normal; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;text-overflow: ellipsis}
  @media all and (min-width:360px) and (max-width:740px) {
    .topclipArea {margin-bottom:40px; padding:20px 0 30px}
    .topclipArea .h2Title {margin-bottom:15px; font-size:20px }
    .topclipArea .slide ul li {padding-left:15px; width:326px }
    .topclipArea .slide ul li a figure {min-height:175px }
    .topclipArea .slide ul li a figure:after  {width:44px; height:44px; margin:-22px 0 0 -22px;  background-size:44px 44px }
    .topclipArea .slide ul li a mark {font-size:13px; margin-top:17px; margin-bottom:7px }
    .topclipArea .slide ul li a p {font-size:15px; max-height:43px; line-height:20px }
  }


 /* clipArea(최신클립) */
.clipAreaNew {padding:35px 0 20px; border-top:7px solid #f2f2f2 }
.clipAreaNew .slideWrap {position:relative; overflow: hidden; padding-bottom:15px; padding-left:13px }
.clipAreaNew .slide {width:2700px }
  @media all and (min-width:360px) and (max-width:740px) {
    .clipAreaNew {padding:40px 0 25px }
    .clipAreaNew .slideWrap {padding-left:15px }
    .clipAreaNew .slide {width:3040px }
  }

 /* brandArea(방송사 브랜드관) */
.brandArea {padding:35px 0 45px; background:#ebebeb}
.brandArea .h2Title {margin-bottom:16px }
.brandArea .slideWrap {overflow: hidden; position:relative; padding-bottom:15px; margin-bottom:8px; padding-left:13px }
.brandArea .slide {width:580px}

.brandTab {position:relative; overflow:hidden }
.brandTab li {float:left; margin-right:11px; height:61px }
.brandTab li a {display: block; width:61px; height:61px; border-radius:50%; background:#dfdfdf; text-indent:-999px; overflow:hidden }
.brandTab li a.selected {background:#ddd }

.brandTab li.logoJTBC a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoCJ a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cj.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoSBS a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_sbs.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoCHA a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cha2.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoKBS a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_kbs.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoMBC a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbc.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoCH a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_ch.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoMBN a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbn.png) no-repeat 0 0; background-size:61px 61px }

.brandTab li.logoJTBC.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc_on.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoCJ.selected  a{background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cj_on.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoSBS.selected a{background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_sbs_on.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoCHA.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cha2_on.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoKBS.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_kbs_on.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoMBC.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbc_on.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoCH.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_ch_on.png) no-repeat 0 0; background-size:61px 61px }
.brandTab li.logoMBN.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbn_on.png) no-repeat 0 0; background-size:61px 61px }

.brandGo {padding:0 13px; margin-bottom:17px; font-family:AppleSDGothicNeo-Bold,roboto-bold; font-size:13px; line-height:100%; text-align:right }
.brandGo a {display:block; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow.png) no-repeat 100% 1px; padding-right:18px; color:#333; background-size:11px 9px }

.brandList {overflow:hidden; padding:0 11px }
.brandList li {float:left; width:33.3%; padding:0 2px 5px 3px }
.brandList li a {display:block; height:137px }
.brandList li a img {display:block; width:100%; height:100%;}
  @media all and (min-width:360px) and (max-width:740px) {
    .brandArea {padding:40px 0 48px}
    .brandArea .h2Title {margin-bottom:19px }
    .brandArea .slideWrap {margin-bottom:12px }
    .brandArea .slide {width:650px }

    .brandTab li {margin-right:13px; height:68px }
    .brandTab li a {width:68px; height:68px; overflow:hidden }

    .brandGo {padding:0 15px; margin-bottom:20px; font-size:15px }
    .brandGo a {background-position:100% 2px; padding-right:20px; background-size:12px 10px }

    .brandList {padding:0 12px }
    .brandList li {padding:0 3px 6px }

    .brandTab li.logoJTBC a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoCJ a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cj.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoSBS a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_sbs.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoCHA a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cha2.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoKBS a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_kbs.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoMBC a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbc.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoCH a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_ch.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoMBN a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbn.png) no-repeat 0 0; background-size:68px 68px}

    .brandTab li.logoJTBC.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc_on.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoCJ.selected  a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cj_on.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoSBS.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_sbs_on.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoCHA.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cha2_on.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoKBS.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_kbs_on.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoMBC.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbc_on.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoCH.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_ch_on.png) no-repeat 0 0; background-size:68px 68px }
    .brandTab li.logoMBN.selected a {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbn_on.png) no-repeat 0 0; background-size:68px 68px }
  }
  @media all and (min-width:321px) and (max-width:360px) {
    .brandList li a {height:153px }
  }
  @media all and (min-width:361px) and (max-width:375px) {
    .brandList li a {height:160px }
  }
  @media all and (min-width:376px) and (max-width:414px) {
    .brandList li a {height:178px }
  }
  @media all and (min-width:415px) and (max-width:740px) {
    .brandList li {width:16.66666% }
    .brandList li a {height:auto }
  }


 /* **** 프로그램 홈 **** */
.programHead {position:fixed; height:55px; top:0;left:0; width:100%; z-index:20; background:#262930; transform: translateZ(20px); -webkit-transform: translateZ(20px); -webkit-overflow-scrolling: touch}
.programHead button {position:absolute; top:0; width:55px; height:55px; text-indent:-999px; overflow:hidden; z-index:2 }
.programHead .btnBack {left:0; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_back.png) no-repeat 15px 13px; background-size:13px 22px}
.programHead .btnSreach {right:0; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_search.png) no-repeat 21px 15px; background-size: 19px 20px; }
.programHead .programLogo {position:absolute; left:50%; top:6px; margin-left:-35px; width:70px; height:70px; -webkit-overflow-scrolling: touch}
.programHead .programLogo img {width:70px; height:70px; background:#eee7df; border-radius:50%; border:2px solid #fff }

.programTop {padding:26px 13px 34px; margin-top:60px;  border-bottom: 1px solid #e7e7e7 }
.programTop h1{font-size:23px; line-height:120%; margin-bottom:13px; margin-left:-1px; font-family:AppleSDGothicNeo-Medium,roboto-medium }
.programTop > div {display:block; margin-bottom:15px; line-height:100%; font-size:14px; }
.programTop > div:after { content:""; display:block;clear:both}
.programTop > div span { display:block; float:left;position:relative; font-size:14px; line-height: 95.555%;; padding-right:9px }
.programTop > div span.type02 { font-size:13px; line-height: 100%; }
.programTop > div span i{ font-size:13px; }
.programTop > div span:after {content:""; position:absolute; right:0; top:2px; height:10px; border-left:1px solid #b8bbbf }
.programTop > div em {display: block; float:left;  background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02.png) no-repeat 100% 2px;   margin-left:8px; background-size:5px 9px }
.programTop > div em a {color:#f62e8f; display: block; font-size:13px;  padding-right:10px; line-height:100%}
.programTop dl {position:relative; margin-bottom:15px }
.programTop dl dt {position:absolute; left:0; top:0; font-size:13px; line-height: 100% }
.programTop dl dd {margin-left:35px }
.programTop dl dd span {color:#797d84; line-height:140%;font-size:13px; display:block; line-height:100%; margin-bottom:5px }
.programTop dl dd span + span { text-indent:1px}
.programTop p {color:#797d84; line-height:130%; font-size:13px;  }
.programTop pre {color:#797d84; line-height:130%; font-size:13px;  }

.programConts {padding:7px 10px 10px }
.programConts .h2Title {font-size:14px; margin-bottom:12px;  padding:0 3px}
.programConts .clipColList li {width:50%; margin-bottom:13px }
.programConts .clipColList li a {width: auto; margin-left:3px; margin-right:3px }
.programConts .clipColList li:first-child a {margin-left:3px }
.programConts .clipColList li figure {height:auto }

.programConts .clipColList li figure img {width:100%; height:100%}

.programMov { position:relative}
.programMov > img {width:100%; display:block }

.playExpl {padding:13px 13px 20px; position:relative }
.playExpl .btnToggle {position:absolute; right:0; top:0; width:45px; height:45px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_show.png) no-repeat 50% -19px; text-indent:-999px; overflow:hidden; background-size:25px 48px }
.playExpl .btnToggle.selected {background-position: 50% 12px}
.playExpl dl {margin-bottom:24px;}
.playExpl dl dt {font-size:17px;line-height:130%; margin-bottom:7px; padding-right:30px;font-family:AppleSDGothicNeo-Medium,roboto-medium }
.playExpl dl dd {font-size:13px; line-height:100% }
.playExpl dl dd a {color:#000;}
.playExpl dl dd i {display:inline-block; position:relative; font-size:13px; line-height:100%; padding-right:10px }
.playExpl dl dd i:after {content:""; position:absolute; right:0; top:50%; margin-top:-6px; height:10px; border-left:1px solid #b8bbbf }
.playExpl dl dd em {display:inline-block; color:#797d84;margin-left:4px }
.playExpl.ios dl dd em {margin-left:3px }
.playExpl .explan pre {color:#797d84; line-height:130%; font-size:14px; margin-bottom:6px }
.playExpl .explan .date {display:block; font-size:12px; line-height:100%; margin-bottom:25px }
.playExpl .explan .date mark {color:#868990; margin-left:5px; font-size:12px }
.playExpl .explan li {font-size:12px; margin-bottom:10px }
.playExpl .explan li a {display:inline-block; color:#333; height:14px; line-height:16px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/icon_link.png) no-repeat 0 0; padding-left:18px; background-size:14px 14px }

.programSlide {padding:24px 0 0; background:#f2f3f3 }
.programSlide .proHead {overflow:hidden; padding:0 13px }
.programSlide .proHead p {float:left; width:75%; margin-bottom:10px }
.programSlide .proHead p span {float:left; display:block; max-width:86%; font-family:AppleSDGothicNeo-Medium,roboto-medium; font-size:14px; white-space:nowrap; overflow:hidden;text-overflow: ellipsis }
.programSlide .proHead p i {display:block; float:left; margin-left:3px; line-height:17px; font-size:11px; color:#777 }
.programSlide .proHead .playbackC {float:right; padding-left:20px; line-height:15px; height:15px; color:#777; font-size:11px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_play02.png) no-repeat 0 -1px; background-size:15px auto }
.programSlide .proHead .playbackC.selected {color: #f62e8f; background-position:0 -17px; }
.programSlide .slideWrap {position:relative; overflow: hidden; padding-bottom:15px; padding-left:13px }
.programSlide .slide {width:2700px }
.programSlide .slide .clipColList li.selected figure:before {content:""; position:absolute; left:0; top:0; bottom:0; right:0; background:#b0167d; opacity:0.45}
.programSlide .slide .clipColList li.selected figure:after  {content:""; position:absolute; left:50%; top:50%; width:24px; height:24px; margin:-12px 0 0 -12px; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_play.png) no-repeat 0 0; background-size:24px 24px }
.programSlide .slide .clipColList li.selected figure i {display:none }
.programSlide .clipColList li a {  margin-left:6px;}
.programSlide .clipColList li:first-child a {margin-left: 0;}
.tabContsSlide {padding:24px 0 0 }
.tabContsSlide:nth-of-type(1) {margin-top:-18px }
.tabContsSlide:nth-of-type(even) {background:#f2f3f3}
.tabContsSlide .h3Title  {color: #f62e8f; margin:0 13px 11px; font-size:14px; line-height:100% }
.tabContsSlide .slideWrap {position:relative; overflow: hidden; padding-bottom:15px; padding-left:13px }
.tabContsSlide .slide {width:2700px }
.tabContsSlide .clipColList li a { margin-left:6px }
.tabContsSlide .clipColList li:first-child a {margin-left:0}
  @media all and (min-width:360px) and (max-width:740px) {
    .programHead .programLogo { margin-left:-40px; width:81px; height:81px }
    .programHead .programLogo img {width:81px; height:81px }
    .programTop {padding:34px 14px 34px }
    .programTop h1 {font-size:26px; margin-bottom:15px }
    .programTop > div {margin-bottom:18px  }
    .programTop > div span {  font-size:15px; }
    .programTop > div span.type02 { font-size:14px; }
    .programTop > div span i{ font-size:14px;  }
    .programTop > div em a { padding-right:11px; font-size:14px;  }


    .programTop dl {margin-bottom:16px }
    .programTop dl dt {font-size:14px }
    .programTop dl dd {margin-left:37px }
    .programTop dl dd span {font-size:14px }
    .programTop p {font-size:14px }
    .programTop pre {font-size:14px }
    .programConts {padding:7px 12px 10px }
    .programConts .h2Title {font-size:15px }
    .programConts .clipColList li div p { height:38px;}
    .programConts .clipColList li figure img {width:100%; height:100% }

    .playExpl {padding:16px 15px 25px; }
    .playExpl .btnToggle {width:50px; height:50px; background-position:50% -16px }
    .playExpl .btnToggle.selected {background-position: 50% 15px}
    .playExpl dl {margin-bottom:29px;}
    .playExpl dl dt {font-size:19px; margin-bottom:8px; padding-right:45px }
    .playExpl dl dd {font-size:14px; }
    .playExpl .explan p {font-size:13px; margin-bottom:8px }
    .playExpl .explan .date {font-size:13px; margin-bottom:27px }
    .playExpl .explan .date mark {font-size:13px;}
    .playExpl .explan li {font-size:13px; margin-bottom:10px }
    .playExpl .explan li a {height:15px; line-height:17px; background-size:15px 15px }
    .programSlide {padding:26px 0 2px }
    .programSlide .proHead {padding:0 15px }
    .programSlide .proHead p span {font-size:15px; max-width:88% }
    .programSlide .proHead p i {font-size:12px; margin-left:3px;}
    .programSlide .proHead .playbackC {font-size:12px; padding-left:23px; background-size:16px auto }
    .programSlide .proHead .playbackC.selected {background-position:0 -20px }
    .programSlide .slideWrap {padding-left:15px }
    .programSlide .slide {width:3040px }
    .programSlide .slide .clipColList li.selected figure:after {width:26px; height:26px; margin:-13px 0 0 -13px; background-size:26px 26px }
    .tabContsSlide {padding:26px 0 2px; }
    .tabContsSlide .h3Title  {margin:0 15px 11px; font-size:15px}
    .tabContsSlide .slideWrap {padding-left:15px}
  }

  @media all and (min-width:320px) and (max-width:321px) {/* iPhone 4 5 세로 */

    .programTop > div span { line-height:100% }
    .programTop > div span:after {top:1px }
    .programTop > div em  { background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02.png) no-repeat 100% 1px ; background-size:5px 9px }
    .playExpl dl dd i:after {  margin-top: -5px !important; }
    .tabWrap > a.selected:after { bottom: -5px; }
    .programConts .clipColList li figure {height:auto }
    .programConts .clipColList li div p { max-height: none;line-height: 1.3;margin-top: 7px;margin-bottom: 6px;font-family: AppleSDGothicNeo-Medium,roboto-medium;font-size: 13px;color: #222;overflow: hidden;white-space: normal;display: block;-webkit-line-clamp: 1;-webkit-box-orient: horizontal;text-overflow: ellipsis;width: 100%;white-space: nowrap;word-wrap: normal;}
  }

  @media all and (min-width:374px) and (max-width:375px) { /* iPhone 6 세로 */
    .programTop > div span { line-height:100% }
    .programTop > div span:after {top:1px }
    .programTop > div em { background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02.png) no-repeat 100% 1px;  margin-left:8px; background-size:6px 10px }
    .playExpl dl dd em { margin-left:9px }
    .playExpl.ios dl dd em { margin-left:4px }
  }

  @media all and (min-width:413px) and (max-width:414px) { /* iPhone 6 Plus 세로 */
    .programTop > div span {  line-height:100% }
    .programTop > div span:after {top:1px }
    .programTop > div em { background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02.png) no-repeat 100% 1px;  margin-left:8px; background-size:6px 10px }
    .playExpl dl dd em { margin-left:9px }
    .playExpl.ios dl dd em { margin-left:4px }
  }

  @media all and (min-width:480px) and (max-width:580px) {/* iPhone 4,5 가로 */
    .programTop > div span { line-height:100% }
    .programTop > div span:after {top:1px }
    .programTop > div em  { background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02.png) no-repeat 100% 1px ; background-size:5px 9px }
    .playExpl dl dd i:after {  margin-top: -5px !important; }
    .playExpl.ios dl dd em { margin-left:4px }
  }
  @media all and (min-width:641px) and (max-width:667px) {/* iPhone 6 가로 */
    .programTop > div span { line-height:100% }
    .programTop > div span:after {top:1px }
    .programTop > div em { background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02.png) no-repeat 100% 1px;  margin-left:8px; background-size:6px 10px }
    .playExpl dl dd em { margin-left:9px }
    .playExpl.ios dl dd em { margin-left:4px }
  }

  @media all and (min-width:732px) and (max-width:736px) {/* iPhone 6 Plus 가로 */
    .programTop > div span { line-height:100% }
    .programTop > div span:after {top:1px }
    .programTop > div em { background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02.png) no-repeat 100% 1px;  margin-left:8px; background-size:6px 10px }
    .playExpl dl dd em { margin-left:9px }
    .playExpl.ios dl dd em { margin-left:4px }

  }
  @media all and (min-width:399px) and (max-width:402px) {/* 스카이 세로 */
    .programTop > div span {  font-size:14px  !important; }
    .playExpl dl dd i:after {  margin-top: -5px !important; }
  }

  @media all and (min-width:500px) and (max-width:740px) {/* 갤럭시s8 가로 */
    .programConts .clipColList li {float:left; width:33.3333% }
  }

 /* **** 방송사 홈 **** */
.smrBrand {position: relative; z-index:2;  height: 260px;  background-repeat: no-repeat; background-position: 50% 0; background-size:cover }
.smrBrand:after {content:""; position:absolute; top:0; left:0; bottom:0;right:0; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/bg_sh03.png) no-repeat 0 0;  background-size: cover; z-index:1 }
.smrBrand button {position:absolute; top:0; width:42px; height:42px; text-indent:-999px; overflow:hidden; z-index:2 }
.smrBrand .btnBack {left:0; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_back.png) no-repeat 50% 50%; background-size:13px 22px }
.smrBrand .btnSreach {right:0; background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_search.png) no-repeat 50% 50%; background-size:18px 19px }
.smrBrand .slogun {position:absolute; left:13px; bottom:22px; z-index:2 }
.smrBrand .slogun h2 {height:60px;width:130px; margin-bottom:5px; text-indent:-999px }
.smrBrand .slogun p {height:20px; line-height:20px;color:#fff; font-size:11px }
.smrBrand .slogun p i {opacity:0.7; display: inline-block; padding:0; margin:0; text-indent:-1px; }
.smrBrand .slogun p a {position:relative; color:#fff; display:inline-block; padding-left:7px; margin-left:3px; padding-right:24px;  background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/icon_home.png) no-repeat 100% 50%; background-size:21px 20px }
.smrBrand .slogun p a:before {content:""; position:absolute; left:0; top:50%; margin-top:-6px; height:10px; border-left:1px solid #ccc }

.brpadAreaSlide {position:relative; padding:33px 0 20px; border-bottom:1px solid #ededed }
.brpadAreaSlide:after {content:""; position:absolute; bottom:-8px; left:0; width:100%; border-bottom:7px solid #f2f2f2 }
.brpadAreaSlide .slideWrap {position:relative; overflow:hidden; padding-bottom:14px; padding-left:13px }
.brpadAreaSlide .slide {width:2700px}
.brpadAreaSlide .clipColList li div span {  margin-top:6px;}
.brpadArea {position:relative; padding:40px 0 0; border-bottom:7px solid #f2f2f2 }
.brpadArea.noBod {margin-bottom:48px;  border-bottom:0}
.brpadArea.type03 {padding:27px 0 0; margin-bottom:48px;  border-bottom:0}
.brpadArea.type02 .clipList {margin-bottom:37px;}
.brpadArea .clipList li {margin-left:13px; margin-right:13px; margin-top:12px; padding-top:12px;}
.brpadArea .clipList li:first-child{margin-top:0; padding-top:0; border-top:0 }
.popularSlide {position:relative; padding:35px 0 20px; border-bottom:1px solid #ededed; margin-bottom:4px }
.popularSlide:after {content:""; position:absolute; bottom:-8px; left:0; width:100%; border-bottom:7px solid #f2f2f2 }
.popularSlide .slideWrap {position:relative; overflow:hidden; padding-bottom:15px; padding-left:13px }
.popularSlide .slide {width:2700px }
.popularList {position:relative; overflow:hidden }
.popularList li {float:left }
.popularList li a {display:block; width:92px; margin-left:5px; color:#333; font-size:14px }
.popularList li:first-child a {margin-left:0 }
.popularList li figure {position:relative }
.popularList li figure img {width:100%; display:block}
.popularList li figcaption {margin-top:10px; font-size:12px }

.smrBrandMenu .menuConts {display:none }
.smrBrandMenu .menuConts:after {content:""; position: fixed; top:0; left:0; height:100%; right:0;  background: rgba(0, 0, 0, 0.6); z-index:1 }
.smrBrandMenu .menuWrap {position:relative }
.smrBrandMenu .slideBtn {z-index:3; position:absolute; right:0; top:0; width:40px; height:40px; position:absolute; background-image: url(https://nstatic.jtbc.co.kr/tvclips/m/images/icon_down.png) ; background-repeat:no-repeat; background-size:25px 50px; background-position:50% -21px }
.smrBrandMenu .slideBtn.selected {background-position:50% 10px }
.smrBrandMenu .slideBtn button {width:100%; height:40px; display:block; text-indent:-999px; overflow:hidden }
.smrBrandMenu .slideBtn:after {content:""; position:absolute; left:-10px; width:10px; top:0; bottom:0 }
.smrBrandMenu .slideWrap {height:40px; position:relative; z-index:2;overflow:hidden }
.smrBrandMenu .slideWrap .slide {width:1500px }
.smrBrandMenu .BrandMenu {position:relative; z-index:2; overflow:hidden; padding:0 8px }
.smrBrandMenu .BrandMenu li {float:left }
.smrBrandMenu .BrandMenu li a {display:block; height:40px; line-height:40px; color:#fff; padding:0 11px; font-size:13px; opacity:0.4;font-family:AppleSDGothicNeo-Medium,roboto-medium }
.smrBrandMenu .BrandMenu li.selected a {opacity:1 }
.smrBrandMenu .BrandsubMenu {position: absolute; left:0; top:300px; width:100%; z-index:2;  overflow:hidden; background:#fff; padding:12px 7px 18px}
.smrBrandMenu .BrandsubMenu li {float:left; width:33.333% }
.smrBrandMenu .BrandsubMenu li a {display:block; height:27px; line-height:27px; color:#797d84;  border:1px solid #ccc; box-sizing:border-box; text-align:center; font-size:11px; margin:3px 5px; border:1px solid #dbdddf;font-family:AppleSDGothicNeo-Medium,roboto-medium }

.brpadAreaSlide + .brpadArea,
.brpadArea.type02 {padding: 40px 0 0}
.broadConts.jtbc h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.cj h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cj_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.kbs h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_kbs_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.mbc h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbc_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.sbs h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_sbs_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.cha h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_cha2_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.tvch h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_tvch_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.mbn h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_mbn_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.obs h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_obs_home.png) no-repeat 0 0; background-size:130px 60px }
.broadConts.knn h2.bi {background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_knn_home.png) no-repeat 0 0; background-size:130px 60px }

.broadConts.jtbc .slideBtn  {background-color:#e62d87 }
.broadConts.cj .slideBtn  {background-color:#e31c23 }
.broadConts.kbs .slideBtn  {background-color:#1d5dc7 }
.broadConts.mbc .slideBtn  {background-color:#51bedf }
.broadConts.sbs .slideBtn  {background-color:#0573c8 }
.broadConts.cha .slideBtn  {background-color:#0098db }
.broadConts.tvch .slideBtn  {background-color:#d52635 }
.broadConts.mbn .slideBtn  {background-color:#f47b20 }
.broadConts.obs .slideBtn  {background-color:#f47b20 }
.broadConts.knn .slideBtn  {background-color:#f47b20 }

.broadConts.jtbc .slideBtn:after {background :#e62d87; background: -webkit-linear-gradient(left, rgba(230,45,135,0), rgba(230,45,135,1)); background: linear-gradient(to right, rgba(230,45,135,0), rgba(230,45,135,1)) }
.broadConts.cj .slideBtn:after {background:#e31c23;background: -webkit-linear-gradient(left, rgba(227,28,35,0), rgba(227,28,35,1)); background: linear-gradient(left, rgba(227,28,35,0), rgba(227,28,35,1)) }
.broadConts.kbs .slideBtn:after {background:#1d5dc7; background: -webkit-linear-gradient(left, rgba(29,93,199,0), rgba(29,93,199,1)); background: linear-gradient(to right, rgba(29,93,199,0), rgba(29,93,199,1)) }
.broadConts.mbc .slideBtn:after {background:#51bedf; background: -webkit-linear-gradient(left, rgba(81,190,223,0), rgba(81,190,223,1)); background: linear-gradient(to right, rgba(81,190,223,0), rgba(81,190,223,1)) }
.broadConts.sbs .slideBtn:after {background:#0573c8; background: -webkit-linear-gradient(left, rgba(5,115,200,0), rgba(5,115,200,1)); background: linear-gradient(to right, rgba(5,115,200,0), rgba(5,115,200,1)) }
.broadConts.cha .slideBtn:after {background:#0098db; background: -webkit-linear-gradient(left, rgba(0,152,219,0), rgba(0,152,219,1)); background: linear-gradient(to right, rgba(0,152,219,0), rgba(0,152,219,1)) }
.broadConts.tvch .slideBtn:after {background:#d52635; background: -webkit-linear-gradient(left, rgba(213,38,53,0), rgba(213,38,53,1)); background: linear-gradient(to right, rgba(213,38,53,0), rgba(213,38,53,1)) }
.broadConts.mbn .slideBtn:after {background:#f47b20 ;background: -webkit-linear-gradient(left, rgba(244,123,32,0), rgba(244,123,32,1)); background: linear-gradient(to right, rgba(244,123,32,0), rgba(244,123,32,1)) }
.broadConts.obs .slideBtn:after {background:#f47b20 ;background: -webkit-linear-gradient(left, rgba(244,123,32,0), rgba(244,123,32,1)); background: linear-gradient(to right, rgba(244,123,32,0), rgba(244,123,32,1)) }
.broadConts.knn .slideBtn:after {background:#f47b20 ;background: -webkit-linear-gradient(left, rgba(244,123,32,0), rgba(244,123,32,1)); background: linear-gradient(to right, rgba(244,123,32,0), rgba(244,123,32,1)) }

.broadConts.jtbc .smrBrandMenu .slideWrap {background:#e62d87 }
.broadConts.cj .smrBrandMenu .slideWrap {background:#e31c23 }
.broadConts.kbs .smrBrandMenu .slideWrap {background:#1d5dc7 }
.broadConts.mbc .smrBrandMenu .slideWrap {background:#51bedf }
.broadConts.sbs .smrBrandMenu .slideWrap {background:#0573c8 }
.broadConts.cha .smrBrandMenu .slideWrap {background:#0098db }
.broadConts.tvch .smrBrandMenu .slideWrap {background:#d52635 }
.broadConts.mbn .smrBrandMenu .slideWrap {background:#f47b20 }
.broadConts.obs .smrBrandMenu .slideWrap {background:#f47b20 }
.broadConts.knn .smrBrandMenu .slideWrap {background:#f47b20 }

.broadConts.jtbc .smrBrandMenu .BrandsubMenu li.selected a {color:#e62d87; border-color:#e62d87 }
.broadConts.cj .smrBrandMenu .BrandsubMenu li.selected a {color:#e31c23; border-color:#e31c23 }
.broadConts.kbs .smrBrandMenu .BrandsubMenu li.selected a {color:#1d5dc7; border-color:#1d5dc7 }
.broadConts.mbc .smrBrandMenu .BrandsubMenu li.selected a {color:#51bedf; border-color:#51bedf }
.broadConts.sbs .smrBrandMenu .BrandsubMenu li.selected a {color:#0573c8; border-color:#0573c8 }
.broadConts.cha .smrBrandMenu .BrandsubMenu li.selected a {color:#0098db; border-color:#0098db }
.broadConts.tvch .smrBrandMenu .BrandsubMenu li.selected a {color:#d52635; border-color:#d52635 }
.broadConts.mbn .smrBrandMenu .BrandsubMenu li.selected a {color:#f47b20;; border-color:#f47b20 }
.broadConts.obs .smrBrandMenu .BrandsubMenu li.selected a {color:#f47b20;; border-color:#f47b20 }
.broadConts.knn .smrBrandMenu .BrandsubMenu li.selected a {color:#f47b20;; border-color:#f47b20 }

  @media all and (min-width:360px) and (max-width:740px) {
    .smrBrand {height: 293px }
    .smrBrand button {width:45px; height:45px }
    .smrBrand .slogun {position:absolute; left:15px; bottom:27px }
    .smrBrand .slogun h2 {height:60px;width:130px; margin-bottom:5px; text-indent:-999px;  background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc_home.png) no-repeat 0 0; background-size:130px 60px }
    .smrBrand .slogun p {font-size:13px }
    .smrBrand .slogun p a {padding-left:9px; margin-left:5px; padding-right:26px;  background:url(https://nstatic.jtbc.co.kr/tvclips/m/images/icon_home.png) no-repeat 100% 50%; background-size:21px 20px }

    .brpadAreaSlide{padding:33px 0 25px }
    .brpadAreaSlide .slideWrap {padding-left:15px }
    .brpadAreaSlide .slide {width:3040px }

    .brpadArea.noBod {margin-bottom:55px }
    .brpadArea .clipList li {margin-top:13px; padding-top:13px; }

    .popularSlide{padding:40px 0 24px; margin-bottom:6px }
    .popularSlide .slideWrap {padding-left:15px }
    .popularSlide .slide {width:3040px }
    .popularList li a {display:block; width:104px }
    .popularList li figcaption {font-size:14px }

    .smrBrandMenu .BrandsubMenu {top:338px; padding:13px 8px 19px}
    .smrBrandMenu .slideBtn {width:45px; height:45px; background-position:50% -19px }
    .smrBrandMenu .slideBtn button {height:45px }
    .smrBrandMenu .slideBtn.selected {background-position:50% 13px }
    .smrBrandMenu .slideWrap {height:45px }
    .smrBrandMenu .BrandMenu {padding:0 10px }
    .smrBrandMenu .BrandMenu li a {font-size:15px; height:45px; line-height:45px }
    .smrBrandMenu .BrandsubMenu li a {height:30px; line-height:30px; font-size:13px; margin:4px 5px }
  }







/* 2018-01-02 */

header {transform: translateZ(0);-moz-transform: translatez(0);-ms-transform: translatez(0);-o-transform: translatez(0);-webkit-transform: translateZ(0);-webkit-font-smoothing: antialiased;}

.clipList li.outlink_ex_class {position:relative; margin-left:0; margin-right:0; padding-left:13px; padding-right:13px; padding-bottom:13px;}
.clipList li.outlink_ex_class::before {content:''; display:inline-block; position:absolute; left:0; top:-1px; width:13px; border-top:1px solid #fff;}
.clipList li.outlink_ex_class::after {content:''; display:inline-block; position:absolute; right:0; top:-1px; width:13px; border-top:1px solid #fff;}


.swipe {overflow: hidden;visibility: hidden;position: relative;}
.swipe-wrap {overflow: hidden;position: relative;}
.swipe-wrap > div {float: left;width: 100%;position: relative;}

.modal {position:fixed; z-index:999; height:100%; width:100%; top:0; left:0;}
.modal_center {z-index: 1000; width: auto; height:100%; text-align:center;}
.modal_center img {position:absolute; display:inline-block; height: auto; width: auto; width:60px; height:60px; top:50%; left:50%; margin-top:-30px; margin-left:-30px;}

.spinimage{-webkit-animation: spin 2s infinite linear;-o-animation: spin 2s infinite linear;-moz-animation: spin 2s infinite linear;animation: spin 2s infinite linear;}

@-webkit-keyframes spin {0% {-webkit-transform: rotate(0deg);}100% {-webkit-transform: rotate(360deg);}}
@-moz-keyframes spin {0%  {-moz-transform: rotate(0deg);}100% {-moz-transform: rotate(360deg);}}
@keyframes spin {0%  {transform: rotate(0deg);}100% {transform: rotate(360deg);}}

.tabtop {position:fixed; top:55px; width:100%; z-index:10; background:#fff; transform: translatez(10px); -webkit-transform: translatez(11px);}
.tabtop_notop {position:fixed; width:100%; z-index:10; background:#fff; transform: translatez(10px); -webkit-transform: translatez(11px);}
.tabtop_notop2 {width:100%; z-index:50; background:#fff; transform: translatez(10px); -webkit-transform: translatez(11px);}




/* 2018-01-15 */
.link_bn {text-align: center; padding:33px 13px 0;}
.link_bn img {max-width: 100%; height:auto;}

@media(max-width: 740px) and (min-width: 360px){
.link_bn {padding:33px 15px 0}
}

/* 플레이어 클릭 하이라이트 제거 */
.wrap {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}




/* 2018-02-20 */
.cont2 {overflow-y:scroll; -webkit-overflow-scrolling:touch;
  -ms-user-select: none;
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}


/* 플랫폼브랜딩 DESI-20 2023-07-04 lim.cheolho */
:root {
  /* 공통 컬러 */
  --color-primary: #bb50ff;
  --color-primary-hover: #9640cc;
  --color-white-hover: #d3d3d3;
  --color-sub-gray: #404040;
}
/* TV CLIPS > 메인 */
.clipList li figure mark {background-color: var(--color-primary);}
.topclipArea .slide ul li a mark,
.programTop > div em a,
.tabContsSlide .h3Title {color: var(--color-primary);}
.programTop > div em {background-image: url(https://nstatic.jtbc.co.kr/tvclips/m/images/bul_arrow02n.png);}
/* TV CLIPS > 인기 클립 TOP 20 > 인기 탭 / 최신 탭 */
.tabWrap > a.selected {color: var(--color-primary);}
.tabWrap > a.selected::after {border-bottom-color: var(--color-primary);}
/* TV CLIPS > 영상 재생 > 바로 하단 프로그램별 클립 모음 > 연속재생 및 현재 재생 위치 표기 */
.programSlide .proHead .playbackC {background-image: url(https://nstatic.jtbc.co.kr/tvclips/m/images/btn_play02n.png);}
.programSlide .proHead .playbackC.selected {color: var(--color-primary);}
.programSlide .slide .clipColList li.selected figure:before {background: var(--color-primary); opacity: 0.3;}
/* JTBC 방송관 */
.broadConts.jtbc .smrBrandMenu .slideWrap,
.broadConts.jtbc .slideBtn {background-color: var(--color-primary);}
.broadConts.jtbc .slideBtn:after {background: linear-gradient(to right, rgba(187,80,255,0), rgba(187,80,255,1));}
.broadConts.jtbc .smrBrandMenu .BrandsubMenu li.selected a {border-color: var(--color-primary); color: var(--color-primary);}
.broadConts.jtbc h2.bi,
/* JTBC 브랜드관 원복 
.smrBrand .slogun h2 {background-image:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc_home_n.png);}
.brandTab li.logoJTBC.selected a {background-image:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc_on_n.png);}
@media all and (min-width:360px) and (max-width:740px) {
  .brandTab li.logoJTBC.selected a {background-image:url(https://nstatic.jtbc.co.kr/tvclips/m/images/logo/logo_jtbc_on_n.png);}
}*/


/* //CSS */
