@charset "utf-8";

/* -----------------------------------------------------------------------
    Large devices (large desktops, 1200px and up)
 ------------------------------------------------------------------------*/
@media (min-width: 1200px) {
  /************** 1200 GLOBAl USE***********/
  
  
  
  /************** 1200 GLOBAl USE END***********/
}

/* -----------------------------------------------------------------------
     Medium devices (desktops, UP TO 1199px~992px)
 ------------------------------------------------------------------------*/
@media (max-width: 1199px) {
  /************** 1199 GLOBAl USE***********/

	.program .programgallery .outphotodiv{
		margin-left: 0px;
		margin-top: 0px;
	}	
	
	.program .programgallery .slider-for img{
		max-width: 537px;
		width: 90%;
		height: auto;
	}
	
	.program .programgallery .outphotodiv{
		margin-left: 0px;
		margin-top: 0px;
	}	
	
	.program .programgallery .slider-for img{
		max-width: 537px;
		width: 100%;
		height: auto;
	}

  /************** 1199 GLOBAl USE END***********/
}

/* -----------------------------------------------------------------------
     Medium devices (desktops, UP TO 1023px~990px)
 ------------------------------------------------------------------------*/
@media (max-width: 1023px) {
  /************** 1024 GLOBAl USE***********/
  

  
}

/* ----------------------------------------------------------------------
     Small devices (tablets, UP TO 991px~768px)
 -----------------------------------------------------------------------*/
@media (max-width: 991px) {
  /************** 991 GLOBAl USE***********/
  
  	.program .programgallery .phpoto_gallery_div .slider-for img{
	  	max-width: 300px;
	  	width: 100%;
  	}
  	
  	.program .programgallery .phpoto_gallery_div .slider-for img{
	  	max-width: 300px;
	  	width: 100%;
  	}
  	
	.program .programgallery s.photodiv {
	    width: 100% !important;
	    padding-left: 20px;
	    padding-right: 20px;
	}  	  	
  
  /************** 991 GLOBAl USE END ***********/
}
/* ---------------------------------------------------------------------
    Extra small devices (phones, less UP TO 767px)
 ----------------------------------------------------------------------*/
@media (max-width: 767px) {
  /************** 767 GLOBAl USE***********/
  
	footer .fooitem2 .inner_wrap ul li.snsicon img{
		height: 60px;
	}
	
	.recommendedprograms .in{
		width: 400px !important;
	}

	.recommendedprograms img.m{
		width: 400px !important;
		height: auto;
	}
	
	.recommendedprograms .txt{
		width: 400px !important;
	}
	
	.community .in ul.arl li img{
		max-width: 140px !important;
	}
	
	.community .in{
		padding-left: 10px;
		padding-right: 10px;
	}
	
	.latestnewslist .post-image{
	
	}
	
	.latestnewslist img{
		max-width: 200px;
	}
  
	.pageTopBanner {
		bottom: 120px !important;
	}
	
	.community .in ul.arl li.li img{
		height: 140px;
	}
	
	.gener .genediv ul li {
	    width: 33.3%;
	}	

	.relbroadcast .in{
		width:inherit !important;
	}
  
  /************** 767 GLOBAl USE END***********/
}
/*767 END*/
/* ----------------------------------------------------------------
      Custom, iPhone Retina  UP TO 480px
-------------------------------------------------------------------*/
@media (max-width: 480px) {
  /************** 480 GLOBAl USE***********/  

	header nav .logo img {
	    height: 27px;
	    margin-top: 17px;
	}
	
	.gnavicon div span{
    	font-size: 15px;
	}
	
	.gnavicon li:nth-child(1) div{
    	width: 40px;
	}
	
	.gnavicon li:nth-child(2) div{
		width: 50px;
	}
	
	.gnavicon li:nth-child(3) div{
		width: 70px;
	}
	
	.gnavicon{
		margin-right: 15px;
	}
	
	header nav .menu .bar{
		width: 30px;
	    height: 4px;
	}
	
	header nav .menu.toggle .bar1{
		margin-bottom: 6px;
	}
	
	footer .fooitem1 .inner_wrap ul li{
	    padding-left: 10px;
	    padding-right: 10px;
	}
	
	footer .fooitem1 .inner_wrap ul li a{
		font-size: 18px;
	}
	
	footer .fooitem3 .inner_wrap .kyotaku{
		font-size: 14px;
	}
	
	.mnetsmartvod .outsliderrepdiv .in img{
		width: 200px;
		height: auto;
	}
	
	.recommendedprograms .in{
		width: 300px !important;
	}

	.recommendedprograms img.m{
		width: 300px !important;
		height: auto;
	}
	
	.recommendedprograms .txt{
		width: 300px !important;
	}
	
	/**/
	.latestnews .in{
		width: 300px !important;
	}

	.latestnews img.m{
		max-width: 300px !important;
		height: auto;
		max-height: 168px;
	}
	
	.latestnews .txt{
		width: 300px !important;
	}
	
	.community .in ul.arl li img{
		max-width: 120px !important;
	}
	
	.gnbbanner ul li{
		padding: 5px;
	}
	
	.gener .generkinddiv ul{
		width: 528px;
	}
	
	.latestnewslist .datenm {
    	font-size: 13px;
    }
    
    .latestnewslist .txt .intxt {
    	font-size: 18px;
    }
    
    
	.program .programgallery .slider-nav img{
		width: 60px !important;
	}
	
	.programdetail .desctxt ul li .img img{
		max-width: 120px;	
	}
	
	.programdetail .desctxt ul li .txt{
		padding-left: 130px;
	}
    
	.bodycontent h1{
		font-size: 25px;
	    line-height: 30px;
	}
	
	.relnews .post-item {
		float: none;
		width: 100%;
	}
	
	.mnetsmartplus img{
		
	}
	
	.mnetsmartapp .txt{
		text-align: center;
	}
	
	.mnetsmartapp .txt br{
		display: inline;
	}
	
	.latestnewslist .post-image{
    	max-width: 323px;	
	}
	
	.latestnewslist img{
		max-width: 125px;
	}
	
	footer .fooitem1 .inner_wrap div {
	    margin-bottom: 5px;
	}
	
	.mnetsmartvod h2 br{
		display: inline-block;
	}
	
	.gnavicon ul li:nth-child(1), .gnavicon ul li:nth-child(2){
		margin-right: 5px;
	}
	
	.recommendedprograms h2{
		font-size: 30px;
	}
	
	.recommendedprograms .txt .intxt{
    	font-size: 18px;
	}
	
	.recommendedprograms .txt img{
		top: 3px;
	}
	
	.gnbbanner{
		padding-top: 30px;
	}
	
	.mb50{
		margin-bottom: 30px;
	}
	
	.recommendedprograms{
	    padding-top: 50px;
	    padding-bottom: 50px;
	}
	
	.recommendedprograms .listbtn{
		margin-top: 30px;
	}
	
	.mb95{
		margin-bottom: 75px;
	}
	
	.genediv{
	    padding-top: 50px;
		padding-bottom: 10px;
	}
	
	.mnetsmartvod{
	    padding-top: 50px;
	    padding-bottom: 50px;
	}
	
	.latestnews h2{
		margin-bottom: 50px;
	}
	
	.latestnews .listbtn{
    	margin-top: 30px;
	}
	
	.community{
	    padding-top: 50px;
	    padding-bottom: 50px;
	}
	
	.latestnews .txt .intxt{
		font-size: 18px;
	}
	
	.community .in ul li .frmlay .txt{
		font-size: 18px;
	}
	
	.bottomsnsdiv .fooitem2 .inner_wrap{
		padding-top: 50px;
	    padding-bottom: 50px;
	}
	
	.community h2{
		margin-bottom: 50px;
	}
	
	.tnmonth .txt .intxt{
		font-size: 18px;
	}
	
	.tnmonth .subdetail{
		font-size: 16px;
	}
	
	.gener .recommendedprograms .subdetail{
		font-size: 16px;
	}
	
	.gerelist .in ul li .txt{
		font-size: 18px;
	}
	
	.specialdiv .in ul li .btmlay .item2{
		font-size: 18px;
	}
	
	.specialdiv .in ul li .btmlay .item3{
		font-size: 16px;
	}
	
	.defaultbtn a{
		font-size: 16px;
		line-height: 23px;
	}
	
	.specialdiv .in ul li .btmlay .item1 .sp1{
		font-size: 20px;
	}
	
	.specialdiv .in ul li .btmlay .item1 .sp2{
		font-size: 20px;
	}
	
	.specialdiv.detail .descdiv{
		font-size: 16px;
		line-height: 25px;
	}
	
	.program .programdetail .in .desc{
		font-size: 16px;
	}
	
	.program .programdetail .in{
		padding-left: 10px;
		padding-right: 10px;
	}
	
	.program .programgallery .in .title h2{
		font-size: 27px;
	}
	
	.news .title .item2 span{
	    font-size: 18px;
	    font-weight: bold;
	    line-height: 25px;
	}
	
	.news .newdetail .txtdiv p{
	    font-size: 17px;
	    line-height: 30px;
	}
	
	.news .tags ul li a, .news .tags ul li .fa-tags{
		font-size: 16px;
	}
	
	.program .programdetail .in .title h2{
		font-size: 27px;
	}
	
	.latestnewslist img{
    	max-height: 93px;
	}
	
	.pageTopBanner {
		bottom: 70px !important;
	}
	
	.mnetsmartvod h2 span{
		display: inline-block;
		width: 100%;
		margin-top: 5px;
	}

	.community .in ul.arl li.li img{
		height: 100px;
	}
	
	.program .relnews h2 {
	    font-size: 27px;
	}
	
	.program .relnews .sliderrepdiv2 {
	    grid-template-columns: repeat(1, 100%);
	}
	
	.relnews img{
		max-height: inherit;
	}
	
	.relbroadcast .in{
		width:inherit !important;
	}
	
	
	.epsodelist .topep ul li a span{
		font-size: 12px;
	}
	
	.epsodelist .bottomep ul li .frmlay{
		display: block;
	}
	
	.epsodelist .bottomep ul li .frmlay .lf{
		width: 100%;
	}
	
	.epsodelist .bottomep ul li .frmlay .rf{
		width: 100%;		
	}

	.footermargin{
		margin-bottom: 65px;
	}
	
	.epsodelist .topep ul li a span{
	    width: 110px;
	}

}


@media (max-width: 414px) {
  /************** 360 GLOBAl USE***********/
  /************** 360 GLOBAl USE***********/

	.community .in ul.arl li img{
		max-width: 100px !important;
	}
	
	.mnetsmartplus a{
	    border-radius: 10px;
	    padding-top: 20px;
	    padding-bottom: 20px;
	}
	
	.mnetsmartplus a img{
		height: 40px;
	}
	
	.relbroadcast .in{
		width:inherit !important;
	}
	
	.epsodelist .topep ul li a span{
	    width: 117px;
	}	
  
}

@media (max-width: 375px) {
	footer .fooitem1 .inner_wrap ul li a {
	    font-size: 17px;
	}
	
	footer .fooitem1 .inner_wrap div {
	    margin-bottom: 15px;
	}
	
	footer .fooitem1 .inner_wrap ul li a{
		font-size: 16px;
	}
	
}

/* ----------------------------------------------------------------
      Custom, iPhone Retina  UP TO 480px
-------------------------------------------------------------------*/
@media (max-width: 360px) {
  /************** 360 GLOBAl USE***********/
  /************** 360 GLOBAl USE***********/

	.program .programgallery .slider-nav img{
		width: 50px !important;
	}
	
	.relbroadcast .in{
		width:inherit !important;
	}

	.epsodelist .topep ul li a span{
		padding: 10px 15px 10px 15px;
	}
	
	.epsodelist .topep ul li a span{
	    width: 103px;
	}	

}

/* ----------------------------------------------------------------
      Custom, iPhone Retina  UP TO 480px
-------------------------------------------------------------------*/
@media (max-width: 280px) {
  /************** 280 GLOBAl USE***********/
  /************** 280 GLOBAl USE***********/
  
	header nav .logo img {
	    height: 22px;
	    margin-top: 17px;
	}
	
	header nav{
		line-height: 25px;
	}
	
	.gnavicon div span{
    	font-size: 11px;
	}
	
	.gnavicon li:nth-child(1) div{
    	width: 30px;
	}
	
	.gnavicon li:nth-child(2) div{
		width: 40px;
	}
	
	.gnavicon li:nth-child(3) div{
		width: 55px;
	}
	
	.gnavicon{
		margin-right: 10px;
	}
	
	header nav .menu .bar{
	    width: 23px;
	    height: 3px;
	}
	
	header nav .menu.toggle .bar1{
		margin-bottom: 3px;
	}  
	
	footer .fooitem1 .inner_wrap ul li{
		padding-left: 10px;
		padding-right: 10px;
	}
	
	footer .fooitem1 .inner_wrap ul li a{
		font-size: 11px;
	}
	
	footer .fooitem3 .inner_wrap .kyotaku{
		font-size: 11px;		
	}
	
	footer .fooitem4 .inner_wrap .copyrighttxt{
		font-size: 10px;
	}
	
	footer .fooitem2 .inner_wrap ul li.snsicon img{
		height: 40px;
	}
	
	.recommendedprograms .in{
		width: 200px !important;
	}

	.recommendedprograms img.m{
		width: 200px !important;
		height: auto;
	}
	
	.recommendedprograms .txt{
		width: 200px !important;
	}
	
	.recommendedprograms h2{
		font-size: 30px;
	}
	
	.recommendedprograms .txt .intxt{
		font-size: 15px;
	}
	
	.recommendedprograms .txt img{
		top: 0px;
	}
	
	.mnetsmartvod .outsliderrepdiv .in img{
		width: 150px;
		height: auto;
	}
	
	.mnetsmartvod h2 .logo{
	    height: 40px;
	}
	
	.genediv h2{
		font-size: 30px;
	}
	
	.mnetsmartvod h2{
		font-size: 30px;
	}
	
	/*latestnews*/
	.latestnews .in{
		width: 200px !important;
	}
	
	.latestnews img{
		border-radius: 3px;
	}

	.latestnews img.m{
		max-width: 200px !important;
		height: auto;
		max-height: 112px;
	}
	
	.latestnews .txt{
		width: 200px !important;
	}
	
	.latestnews h2{
		font-size: 30px;
	}
	
	.latestnews .txt .intxt{
		font-size: 15px;
	}
	
	.latestnews .txt img{
		top: 0px;
	}
	
	.community .in ul.arl li img{
		max-width: 70px !important;
	}
	
	.gnbbanner ul li{
		padding: 5px;
	}
	
	.searchdiv .in{
    	padding-left: 87px;
	}
	
	.bodycontent h1{
    	font-size: 20px;
	}
	
	.program .programgallery .slider-nav img {
	    width: 45px !important;
	}	
	
	.programdetail .desctxt ul li .img img{
		max-width: 100px;	
	}
	
	.programdetail .desctxt ul li .txt {
	    padding-left: 107px;
	}
	
	.fa-x-twitter{
	    padding: 10px;
	}
	
	.fa-instagram{
	    padding: 10px;
	}
	
	.fa-youtube{
	    padding: 10px;
	}
	
	.fa-line{
	    padding: 10px;
	}
	
	.bottomsnsdiv .fooitem2 .inner_wrap ul li.snsicon img{
		height: 55px;
	}
	
	.community .in ul.arl li.li img{
		height: 70px;
	}
	
	.relbroadcast .in{
		width:inherit !important;
	}
	

	
}