
#themaView{
	text-align: center;
	
}


/***************************************************************
메인 배경 
***************************************************************/



#themaView .mainbg{
	 
  	background-position: center center;
  	background-size: cover;
  	font-family: Nanum Gothic;  	 
  	background-repeat: no-repeat;
   /*  height:45vw; */ 
   
    height:100%;
     
	max-width:1800px;	
	position: relative;	
	margin: auto;
	
	z-index: 1;
	/* border-bottom: #000 solid 2px; */
	
}

#themaView .sp{
	/* border-top: #444 solid 1px; */
	max-width:1800px;	
	margin: auto;
}

/***************************************************************
메인  
***************************************************************/
.mainView{
	
	width:100%;
	 
	position: absolute;
	top:60px;
	left:0px;
	z-index: 10;
	text-align: center;
	padding: 80px 40px  80px 40px;
	
}


.mainView .mainWrap{
	width:100%;
	max-width:1800px;	
	min-height: 1000px;
	margin: auto;
	text-align: left;
}

.mainView .mainWrap .toppadding{
	
}

.mainView .mainWrap .dan{
	text-align: left;	
}


.mainView .mainWrap .dan .danTitle{
	padding: 10px 10px 5px 10px;
	font-family: 'Jua';
	font-style: normal;
	font-size: 24px;	
	color: #aaa;
	letter-spacing: -1px;
	text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
}


.mainView .mainWrap .titleBox{
	margin-top:10px;
	text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
	width: 100%;
}

.mainView .mainWrap .titleBox .title{	
	font-family: 'TmonMonsori';
	
	white-space: nowrap;
	width: 100%;
	overflow: hidden; 
	text-overflow: ellipsis;
}

.mainView .mainWrap .titleBox .subMsg{
	margin-top:5px;	
	width: 100%;
	overflow: hidden; 	
	/* font-size:18px;	 */
	
	text-overflow: ellipsis;
	white-space: nowrap;
	
}

.mainView .topsp{
	margin-top: 20px;
}

.mainView .listbox{
	/* padding: 10px;
	background-color:rgba(0, 0, 0, 0.5);
	
	webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    
    -webkit-border-radius: 3px;
    border-radius: 3px; */
    
    overflow: hidden;
}

.mainView .listbox UL{
	
	width: 100%;
	overflow: hidden;
	font-size: 0px;
	
}

/* .mainView .listbox .imgbox{
	overflow: hidden;
}

.mainView .listbox UL LI{
	display: inline-block;
	float:left;
	margin: 0px;
	margin-bottom: 20px;
	overflow: hidden;
	
	padding-right:20px;
	
	
	
}

.mainView .listbox UL .item{
	background-color:rgba(0, 0, 0, 0.5);
	cursor: pointer;
	font-size: 14px;
	position: relative;
}

.mainView .listbox UL .item .itt{
	position:absolute;
	z-index:110;
	top: 0px;
	right:0px;
	width: 100%;	
	display: inline-block;
	padding:5px;	
}

.mainView .listbox UL .item .dispClassBox{
	position:absolute;
	z-index:110;
	right: 5px;
	top:5px;
}

.mainView .listbox UL LI .title{
	font-size: 14px;
	padding: 10px;
	color: #999;
	
	white-space: nowrap;
	width: 100%;
	overflow: hidden; 
	text-overflow: ellipsis;
}
.mainView .listbox UL .itemimg{
 	-webkit-transition: 0.5s;
     -moz-transition:  0.5s;
     -ms-transition:  0.5s;
     -o-transition:  0.5s;
     transition:  0.5s;  
}
.mainView .listbox UL .item:hover .itemimg{
	-webkit-transform: scale(1.2);
    transform: scale(1.2);
}

.mainView .listbox UL .item:hover .title{
	color: #00bff3;
}
 */

/*******************************************************
  list
********************************************************/
.mainView .list{
	overflow: hidden;
}

.mainView .list UL{
	width: 100%;
	overflow: hidden;
	font-size: 0px;
}

.mainView .list LI{
	display: none;
	/* display: inline-block; */
	/* float:left; */
	margin: 0px;
	margin-bottom: 20px;
	overflow: hidden;
	
	
	
	padding-right:20px 
}

.mainView .list .item{
	overflow: hidden;
	display: inline-block;
	
	width: 100%;
	
	font-size: 12px;
	height: 100%;
	
	background:#000;
}

.mainView .list .item .bg{
	
	position: relative;
  	z-index:0;
  	
	background: url('/_cinefox.com_v7/assets/images/module/logobg-h.png');
	width: 100%;
	height: 100%;
	
	background-position: center center;
  	background-size: cover;
  	
  	overflow: hidden;
  	
}

.mainView .list .item .bg .itt{
	position:absolute;
	z-index:110;
	top: 0px;
	left:0px;
	width: 100%;	
	display: inline-block;
	padding:5px;	
}

.mainView .list .item .bg .dispClassBox{
	position:absolute;
	z-index:110;
	right: 5px;
	top:5px;
}

.mainView .list .item .bg .infoBox{	
	position:absolute;
	z-index:100;
	width: 100%;
	height: 100%;
	color: #ccc;
	/* cursor: pointer; */
	background: rgba(0, 0, 0, 0.7);
	
	opacity: 0;
	
	-webkit-transition: 0.3s;
     -moz-transition:  0.3s;
     -ms-transition:  0.3s;
     -o-transition:  0.3s;
     transition:  0.5s; 
}

.mainView .list .item .bghv:hover .infoBox{
	opacity: 1; 
	 -webkit-transition: 0.7s;
     -moz-transition:  0.7s;
     -ms-transition:  0.7s;
     -o-transition:  0.7s;
     transition:  0.7s;  
}

.mainView .list .item .bg .infoBox .im{
	text-align: center;
	position: absolute;
	z-index:200;
	width:100%;
	top:100px;
	color: #fff;
	
}

.mainView .list .item .bg .infoBox .im .fa{
	font-size:80px;
	cursor: pointer;
}

.mainView .list .item .bg .infoBox .im .btnl{
	padding-right: 10px;
}

.mainView .list .item .bg .infoBox .im .btnr{
	padding-left: 10px;
}
.mainView .list .item .bg .infoBox .im .btnl:hover,
.mainView .list .item .bg .infoBox .im .btnr:hover{
	 color:#d9534f;
	 -webkit-transition: 0.3s;
     -moz-transition:  0.3s;
     -ms-transition:  0.3s;
     -o-transition:  0.3s;
     transition:  0.3s; 
}

.mainView .list .item .bg .infoBox .ibt{
	position:absolute;
	bottom: 0px;
	left:0px;
	width: 100%;
	
	display: inline-block;
	 
	padding: 10px;
}

.mainView .list .item .bg .infoBox .ibt .title{
	letter-spacing: -1px;
	/* font-size: 16px; */
	font-size: 20px;
	white-space: nowrap;
	width: 100%;
	overflow: hidden; 
	text-overflow: ellipsis;
	color: #fff;
	padding-bottom: 0px;
}

.mainView .list .item .bg .infoBox .ibt .info1{
	letter-spacing: -1px;
	/* font-size: 14px; */
	font-size: 14px;
	white-space: nowrap;
	width: 100%;
	overflow: hidden; 
	text-overflow: ellipsis;
}

.mainView .list .item .bg .infoBox .ibt .price{
	letter-spacing: -1px;
	/* font-size: 16px; */
	font-size: 16px; 
	white-space: nowrap;
	width: 100%;
	overflow: hidden; 
	text-overflow: ellipsis;
	padding-bottom: 5px;
}

.mainView .list .item .titleBox{
	letter-spacing: -1px;
	/* font-size: 16px; */
	font-size: 14px;
	white-space: nowrap;
	width: 100%;
	overflow: hidden; 
	text-overflow: ellipsis;
	color: #fff;
	padding: 10px 10px 0px 10px;
	color: #a5a5a5;
}

.mainView .list .item .starBox{
	padding: 5px 10px 10px 10px;
	overflow: hidden;
	height: 24px;
	margin-bottom: 10px;
}

.mainView .list .item .starBox .title{
	display: inline-block;
	position: relative;
	top:-6px;
	font-size: 14px;
	letter-spacing: -1px;
	margin-right: 5px;
	color: #a5a5a5;
}

.mainView .list .item .starBox .title B{
	color: #fff200;
	letter-spacing: -1px;
}

.mainView .list .item .starBox .start{
	background: url('/_cinefox.com_v7/assets/images/module/view_star_off.png') no-repeat; 

	height: 20px;
	width: 100px;
	
	/*  background-position: center center;  */
  	background-size: 100px;
  	
	display: inline-block;
	zoom:1;
	*display:inline;
	font-size: 0px;
}

.mainView .list .item .starBox .startOn{
	
	background: url('/_cinefox.com_v7/assets/images/module/view_star_on.png') no-repeat; 
	height: 100%;
	width: 100px;
	
	/* background-position: center center; */
  	background-size: 100px;
  	
	display: inline-block;
	zoom:1;
	*display:inline;
	
	font-size: 0px;
}

.mainView .list .item .btclickBox{
	
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 150;
	
	/* background: #ccc;  */
}


.mainView .list .item .itemimg{
	
	-webkit-transition: 0.5s;
     -moz-transition:  0.5s;
     -ms-transition:  0.5s;
     -o-transition:  0.5s;
     transition:  0.5s;  
     
}

.mainView .list .item .bghv:hover .itemimg{
	-webkit-transform: scale(1.2);
    transform: scale(1.2);
    
    -webkit-transition: 0.5s;
     -moz-transition:  0.5s;
     -ms-transition:  0.5s;
     -o-transition:  0.5s;
     transition:  0.5s;  
}


@media all and (max-width:479px) {
	
	
	
}

@media all and (max-width:767px) {
	
	

	.mainView{
		padding: 80px 20px  80px 20px;
	}
	
	.mainView .listbox{
		padding: 10px 0px;
	}
}

/*  (해상도 ~ 900px)*/
@media all and (max-width:900px) { 
	
	
	.header-container .topmenu{
		display: none;
	}
	
	.header-web-logoBox{
		display: none;
	}
	
	.header-container .mobtopmenu{
		display: block;
	} 
	
	.mobileWrap{
		display: block;
	}
	
	
	
	
}

























/***************************************************************
메인 이미지 배경 효과
***************************************************************/
.be4{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#222222+10,000000+100&0.65+10,0+100 */
background: -moz-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(360deg,  rgba(34,34,34,1) 10%,rgba(0,0,0,0)50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6222222', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	width: 100%;
	height: 100%;
	
}

.be3{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#222222+10,000000+100&0.65+10,0+100 */
background: -moz-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(90deg,  rgba(34,34,34,1) 10%,rgba(0,0,0,0)50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6222222', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	width: 100%;
	height: 100%;
	
}

.be2{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#222222+10,000000+100&0.65+10,0+100 */
background: -moz-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(-90deg,  rgba(34,34,34,1) 10%,rgba(0,0,0,0)50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6222222', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	width: 100%;
	height: 100%;
	
}

.be1{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#222222+10,000000+100&0.65+10,0+100 */
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#222222+10,000000+100&0.65+10,0+100 */
background: -moz-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(34,34,34,0.65) 10%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(34,34,34,0.65) 10%,rgba(0,0,0,0) 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6222222', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	width: 100%;
	height: 100%;
	
}