@charset "utf-8";
/* @import url(https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css); */
/* @import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@2.0/nanumsquare.css); */
@import url(https://hangeul.pstatic.net/hangeul_static/css/nanum-square.css);

.tv-wrap .sub-banner{
	display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 270px;
    background: url(/resources/user2/img/sub3/tv_top_banner.jpg) no-repeat center 30%;
    background-size: cover;}
.tv-wrap .sub-banner .txt-banner{font-size: 50px; font-weight:800; color: #fff; font-family: 'NanumSquare', sans-serif;}

.tv-wrap .title-box-tv{margin: 80px 0; text-align: center;}
.tv-wrap .title-box-tv .sub-title{font-size: 20px; color: #cccccc; margin-bottom: 16px;}
.tv-wrap .title-box-tv .main-title{font-size: 50px; font-weight: 800; color: #3d3d3d;}

.tv-wrap .tit {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 14px;
}
.tv-wrap .btn-more {
    display: none; 
    width: 100%;
    padding: 17px 0;
    font-size: 17px;
    text-align: center;
    background: #000;
    color: #fff;
}

.tv-wrap .tab {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 40px;
    font-family: 'NanumSquare', sans-serif;
}
.tv-wrap .tab .tab-span { 
    display: flex;
    align-items: center;
    justify-content: center;
    width: 450px;
    height: 70px;
    border: 1px solid #dcdcdc;
    background: #f8f8f8;
    font-size: 30px; font-weight: 500;
}

.tv-wrap .tab .tab-span.active-tv{background: #bda17b ; color: white;}

.tv-wrap .content .sub-tit {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #999;
}

.tv-wrap .content .sub-tit h2 { 
    font-size: 18;
    font-weight: bold;
}
.tv-wrap .content .sub-tit a {
    padding: 8px 30px;
    font-size: 12px;
    border: 1px solid #666666;
}
/* 새로운컨텐츠 */
.tv-wrap .new { margin-bottom: 50px; }
.tv-wrap .new .cont-box{ display: flex; align-items: center;}
/* .tv-wrap .new .cont-box a {
    display: flex;
    align-items: center;
} */

.tv-wrap .new .cont-box img {
    width:582px;
    height: 326px;
    object-fit: cover;
    margin-right: 53px;
}
.tv-wrap .new .cont-box h3 {
    font-size: 18px;
    font-weight: bold;
    word-break: keep-all;
    margin-bottom: 24px;
}
.tv-wrap .new .cont-box p { 
    font-size: 12px;
    margin-top:10px; 
    line-height: 1.2;
    -webkit-line-clamp: 3;
}
.tv-wrap .new .cont-box .txt-box {
    /* width: 100%; */
    width: 30%;
   font-size: 12px;
   }

/* 추천 컨텐츠 */
.tv-wrap .recommend {
    margin-bottom: 140px;
}
.tv-wrap .recommend .sub-tit {
    padding-bottom: 16px;
    border-bottom: 1px solid #999;
}
.tv-wrap .cont-list {
    display: flex;
    flex-flow: row wrap;
   /*  justify-content: center; */
    justify-content: space-between;
}
.tv-wrap .recommend .cont-list { 
  /* justify-content: flex-start; */
  justify-content: space-between;
}
.tv-wrap .recommend .cont-list li:nth-child(9) { display: none; ;}
.tv-wrap .recommend .cont-list li {
  /* width: 206px; */
  /* height: 116px; */
  margin-bottom: 36px;
}
  
.tv-wrap .cont-list .cont-box {
    /* width: 25%; */
    width: 214px;
    
    /* margin-right: 21px; */
    margin-bottom: 36px;
}
/* .tv-wrap .cont-list li:nth-child(4n) { margin-right: 0; } 
.tv-wrap .cont-list li:nth-child(17) { display: none; } */
.tv-wrap .cont-list img {
    width: 100%;
    object-fit: cover;
    margin-bottom: 18px;
}
.tv-wrap .cont-list .overtext {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}
.tv-wrap .cont-list .info {
    display: flex;
    font-size: 12px;
}
.tv-wrap .cont-list .info > div {
  display: flex;
  flex-direction: row;
  white-space: nowrap;
}
.tv-wrap .cont-list .info div:nth-child(1) { 
  margin-right: 8px;
}

/* tv 상세페이지 */
.tv-wrap .detail .tit-area { display: none; }

.tv-wrap .detail .video { 
  width: 100%;
  height: auto;
  /* object-fit: cover; */
 }
 .tv-wrap .detail .video iframe {width: 100%; height: 518px;}
.tv-wrap .detail .title { margin: 39px 0; }
.tv-wrap .detail .txt-box {
  width: 100%;
  padding: 24px; 
  margin-bottom: 33px;
  font-size: 14px;
  line-height: 1.4;
  background: #F2F2F2;
  border-radius: 10px;
  box-sizing: border-box;
}
.tv-wrap .detail .txt-box p {
   margin-bottom: 40px;
   overflow: hidden;
 }
.tv-wrap .detail .txt-box .btn-list {
  padding: 9px 33px;
  font-size: 14px;
  border: 1px solid #000;
  border-radius: 30px;
  background: #fff;
}
.tv-wrap .detail .cont-area { margin-bottom: 120px; }
.tv-wrap .detail .card {
  width: 214px;
  font-size: 12px;
}
/* .tv-wrap .detail .card a {
  width: 214px;
} */
.tv-wrap .detail .card img {
    width: 100%;
    object-fit: cover;
}
.tv-wrap .detail .card .overtext { font-weight: bold; } 
.tv-wrap .detail .card p { margin: 18px 0 8px 0;}
.tv-wrap .detail .card .info { display: flex; }
.tv-wrap .detail .btn-are { 
  display: flex;
  margin-top: 16px;
 }
  
.tv-wrap .detail .swiper-button-next,
.tv-wrap .detail .swiper-button-prev { 
  position: unset;
  width: 32px;
  height: 32px;
  color: #000;
  border: 1px solid #666;
  font-size: 14px;
}
.tv-wrap .detail .swiper-button-next { margin-left: 4px; }
.tv-wrap .detail .swiper-button-next:after,
.tv-wrap .detail .swiper-button-prev:after { font-size: 14px; }


/******* 반응형 ******/
/* 모바일 공통 */
@media (min-width: 320px) and (max-width: 1024px) {
  
}
/* 모바일 */
@media (max-width: 575px) {
  .tv-wrap .content { margin: 0 18px; }
  .tv-wrap .tab { display: none; }
  .tv-wrap .new { margin-bottom: 60px; }
  .tv-wrap .new .cont-box {
  	display: block;
    /* flex-direction: column;
    align-items: flex-start; */
   }
   /* .tv-wrap .new .cont-box a {
    flex-direction: column;
    align-items: flex-start;
   } */
  .tv-wrap .new .cont-box .txt-box{ width:100%;}
  .tv-wrap .new .cont-box p { display: none; }
  .tv-wrap .new .cont-box img { 
    width: 100%;
    margin: 0 0 15px 0;
    height: 260px;
   }
   .tv-wrap .detail .video { 
  width: 100%;
  height: 530px;
  /* object-fit: cover; */
 }
  .tv-wrap .new .cont-box h3 { 
    max-width: 90%;
    margin-bottom: 4px;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  
  .tv-wrap .detail .card a
  .tv-wrap .new .cont-box .overtext { display: none; }
  
  .tv-wrap .btn-more { 
    display: block;
    margin-bottom: 89px;
   }
  .tv-wrap .cont-list .cont-box {
    width: 464px;
    max-width: unset;
  }
 
  .tv-wrap .recommend .cont-list .cont-box{ 
    display: flex;
    flex-direction: row;
    align-items: center;
   }
   .tv-wrap .content.cont-m .cont-list .cont-box img{width: 100%; height:260px; margin-bottom: 10px;}
   
   
   .tv-wrap .cont-list .cont-box img { margin: 0 16px 0 0; }
   .tv-wrap .tab-content .cont-list .cont-box { margin: 0 0 29px 0; }
   .tv-wrap .tab-content .cont-list li img { margin-right: 0; }
   .sub-page .tv-wrap .pagination { display: none; }
   .sub-page .tv-wrap .cont-list .overtext { 
    line-height: 1.3;
    -webkit-line-clamp: 3;
   }
   .tv-wrap .cont-list .cont-box a { margin: 0 10px 0 0; }
   .tv-wrap .cont-list .cont-box img { margin: 0 10px 0 0; width: 206px; }
   .sub-page .tv-wrap .cont-list li img { margin-bottom: 15px; }

   /* TV 상세페이지 */
   .tv-wrap .detail .video {height: 260px;}
   .tv-wrap .detail .video iframe {height: 260px;}
   .tv-wrap .detail .card { width: 100%; }
   
   .tv-wrap .detail .card img { width: 100%; height: 260px; }
   .sub-page .tv-wrap .tit-area { display: flex; }
   .tv-wrap .detail .cont-area{margin-bottom: 60px;}
   /* .tv-wrap .detail .cont-area .swiper-wrapper{height: 330px;} */
   
   .tv-wrap .sub-banner .txt-banner{font-size: 40px;}
   .tv-wrap .title-box-tv .sub-title{font-size: 16px; margin-bottom: 8px;}
   .tv-wrap .title-box-tv .main-title{font-size: 36px; }
   
   .tv-wrap .sub-banner{height: 160px;}
   .tv-wrap .title-box-tv{margin: 40px 0;}
}
  
  /* 테블릿 */
@media (min-width: 576px) and (max-width: 1024px) {
  .tv-wrap .new .cont-list img { 
    width: 560px;
    margin-right: 20px;
  }
  .tv-wrap .cont-list li,
  .tv-wrap .cont-list li:nth-child(4n) { margin-right: 55px; }
  .tv-wrap .cont-list li:nth-child(3n) { margin-right: 0; }
  
    /* 인덱스 추천컨텐츠 섹션 */
  .tv-wrap .recommend .cont-list .overtext { width: 80%; }
  .tv-wrap .recommend .cont-list { justify-content: space-around; }
  .tv-wrap .recommend .cont-list li:nth-child(3n) { margin-right: 0; }
  .tv-wrap .recommend .cont-list li:nth-child(9),
  .tv-wrap .cont-list li:nth-child(17) { display: block; }

  /* .tv-wrap .cont-list li:nth-child(3n) { margin-right: 55px; } */
  /* 상세페이지 */
  .tv-wrap .detail .video iframe {height: 566px;}
  .tv-wrap .detail .card img { width: 100%; height: 152px; }
  .tv-wrap .detail .cont-area .swiper { margin: 0 40px; }
  .sub-page .tv-wrap .tit-area { display: none; }
}
