
.top100main{
	padding-top:140px; 
	padding-bottom:100px;
	text-align: center;
}

.top100Wrap{
	width: 100%;
	margin:auto;
	text-align: left;	
}

.top100Wrap .menu{
	padding: 0px 40px;
	position: relative;
	border-bottom: #000 2px solid;
}

.top100Wrap .menu .title{
	display:inline-block;
	font-family: 'TmonMonsori';
	font-size: 40px;
	text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
	color: #fff;
}

.top100Wrap .menu .sub{
	display:inline-block;
	padding: 5px 5px 5px 10px;
	color:  #ccc;
	font-size: 14px;
}

.top100Wrap .mainList{
	border-top: #444 1px solid;
	padding: 20px 40px 50px 40px;
}

.top100Wrap .mainList .subTitle{
	/* font-family: 'Jua';
    font-style: normal; */
    font-weight:bold;
    font-size: 24px;
    color: #aaa;
	text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
	
	border-bottom: #000 2px solid;
	padding: 0px 10px 10px 0px;
	
	letter-spacing: -1px;
	
}

.top100Wrap .mainList .subTitle DIV{
	display: inline-block;
	cursor: pointer;
}

.top100Wrap .mainList .subTitle .rigth{
	margin-left: 20px;
}

.top100Wrap .mainList .subTitle DIV.on{
	color: #00bff3;
}


.top100Wrap .mainList .selectBox{
	border-top: #444 1px solid;
	padding: 20px 10px 5px 0px;
}

.top100Wrap .mainList .selectBox .left{
	display: inline-block;
}

.top100Wrap .mainList .selectBox .right{
	display: inline-block;
}

.top100Wrap .mainList .dataBox{
	padding: 0px 0px;
	position: relative;
	z-index:0; 
	
}

@media all and (max-width:850px) {
	.top100Wrap .menu .sub{
		display: none;
	} 
	
}

/* 모바일 가로, 테블릿 세로 (해상도 480px ~ 767px) 767*/ 
@media all and (max-width:767px) {
	
	.top100Wrap .menu{
		padding: 0px 20px;
	}
	
	.top100Wrap .mainList{
		padding:20px 0px 20px 0px;
	}
	
	.top100Wrap .mainList .subTitle{
		margin-left: 20px;
		padding-bottom: 10px;
		font-size: 16px;
	}
	
	.top100Wrap .mainList .selectBox{
		padding-left: 20px;
		padding-top: 10px;
		
	}
	
	.top100Wrap .mainList .dataBox{
		padding: 0px 20px;
	}
	
	.top100main{
		padding-top:100px; 
	}
	
}

/* 모바일 가로, 테블릿 세로 (해상도 ~ 479px)*/
@media all and (max-width:479px) {
	
	
	.top100Wrap .menu  .title{
		font-size:30px;
		height: 50px;
		padding-top:6px;
	}
	
}



/*******************************************************
 real list
********************************************************/

.realListBox{
	
	
}

.realListBox .daymsg{
	margin-bottom: 20px;
	font-size:30px;
	letter-spacing: -1px;
	text-align: center;
	
	background-color:rgba(0,0,0, 0.8);
	padding: 20px 10px 10px 10px;
	line-height:80%;
	font-family: 'TmonMonsori';
	
	
}

.realListBox .daymsg .ss{
	font-size: 14px;	
	font-family: 'Nanum Gothic', 'sans-serif';
	color: #ccc;
	
}

.realListBox UL{
	width: 100%;
	font-size: 0px;
}

.realListBox  UL LI{
	/* display: inline-block; */
	display:none;
	/* float:left; */
	margin: 0px;
	margin-bottom: 20px;
	
	
	
	padding-right:20px 
}

.realListBox .item{
	/* overflow: hidden; */
	display: inline-block;
	
	width: 100%;
	
	font-size: 12px;
	height: 100%;
	
	background:#000;
	position: relative;
	
	webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.5);
    
}

.realListBox .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;
  	
}

.realListBox .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; 
}

.realListBox .item .bghv:hover .infoBox,
.realListBox .item .bghv:active .infoBox{
	opacity: 1; 
	 -webkit-transition: 0.7s;
     -moz-transition:  0.7s;
     -ms-transition:  0.7s;
     -o-transition:  0.7s;
     transition:  0.7s;  
}


.realListBox .item .bg .infoBox .im{
	text-align: center;
	position: absolute;
	z-index:200;
	width:100%;
	top:100px;
	color: #fff;
	
}

.realListBox .item .bg .infoBox .im .fa{
	font-size:80px;
	cursor: pointer;
}

.realListBox .item .bg .infoBox .im .btnl{
	padding-right: 10px;
}

.realListBox .item .bg .infoBox .im .btnr{
	padding-left: 10px;
}
.realListBox .item .bg .infoBox .im .btnl:hover,
.realListBox .item .bg .infoBox .im .btnr:hover,
.realListBox .item .bg .infoBox .im .btnl:active,
.realListBox .item .bg .infoBox .im .btnr:active{
	 color:#d9534f;
	 -webkit-transition: 0.3s;
     -moz-transition:  0.3s;
     -ms-transition:  0.3s;
     -o-transition:  0.3s;
     transition:  0.3s; 
}


.realListBox .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 10px 10px;
	color: #a5a5a5;
}

.realListBox .item .btclickBox{
	
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 150;
	
	/* background: #ccc;  */
}

.realListBox .item .zimmon{
	border: solid #d9534f 1px;
}

.realListBox .item .itemimg{
	
	-webkit-transition: 0.5s;
     -moz-transition:  0.5s;
     -ms-transition:  0.5s;
     -o-transition:  0.5s;
     transition:  0.5s;  
     
}

.realListBox .item .bghv{
	width: 100%;
	height: 100%;
	
	
    
	overflow: hidden;	
}

.realListBox .item .bghv:hover .itemimg,
.realListBox .item .bghv:active .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;  
}

.realListBox .item .topbox{
	position: absolute;
	z-index: 100;
	/* background-color:rgba(237, 28, 36, 0.8); */
	/* background-color:rgba(0,0,0, 0.8); */
	width: 100%;
	height: 30px;
}

.realListBox .item .topbox .label{
    display: inline-block;
    border-radius: 50px;
    background: #444;
    font-size: 16px;
    position: absolute;
    z-index: 1;
    top:-10px;
    left:-10px;
    
    height: 50px;
    width: 50px;
    
    overflow:hidden;
    text-align:center;
    vertical-align:middle;
    
    webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.5);
    
}

.realListBox .item .topbox .label.red{
	background: #ed145b;	
}

.realListBox .item .topbox .label SPAN{
	position: relative;
	top:14px;
	left:-1px;
}

.realListBox .item .topbox .iconBox{
	position: absolute;
	right:2px;
	top:2px;
	color: #ccc;
	padding:5px 10px;
	background-color:rgba(0,0,0, 0.8); 
	
	webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.5);
    
     border-radius: 5px;
}

.realListBox .item .iup{
	font-size:14px;
	color: #e23a3a;
}


.realListBox .item .idown{
	font-size: 14px;
	color: #1588d9;
}

/*******************************************************
log list
********************************************************/

.logListBox{
}



.logListBox .bt{
	background: rgba(0, 0, 0, 0.7);
	
	width:100%;
	position:relative;
	overflow: hidden;
	
	
}

.logListBox .bt .contain{
	 width: 100%;	
	 padding: 10px 0px;
}

.logListBox .bt .contain .btnn {
 	 width: 50px;
 	 height: 100%;
 	/*  background: rgba(0, 0, 0, 0.7); */
 	background-color:rgba(34, 34, 34, 0.7);
 	 position: absolute;
 	 top: 0;
 	 z-index: 1000;
 	 cursor: pointer; 	 
 	 text-align: center;
 	 font-size: 22px;
 	 color: #fff; 	 
}

.logListBox .bt .contain .btnn.prev {
	left: 0px;
	height: 100%;
	display: table;
}
.logListBox .bt .contain .btnn.next {
	right: 0px;
	height: 100%;
	display: table;  
}

.logListBox .bt .contain .prev:hover .glyphicon,
.logListBox .bt .contain .next:hover .glyphicon,
.logListBox .bt .contain .prev:active .glyphicon,
.logListBox .bt .contain .next:active .glyphicon{
	 -webkit-transition: 0.7s;
     -moz-transition:  0.7s;
     -ms-transition:  0.7s;
     -o-transition:  0.7s;
     transition:  0.7s; 
	 opacity: 1; 
}

.logListBox .bt .contain .btnn .glyphicon{
	 display: table-cell;
	 vertical-align: middle;
	 opacity: 0; 
	 -webkit-transition: 0.7s;
     -moz-transition:  0.7s;
     -ms-transition:  0.7s;
     -o-transition:  0.7s;
     transition:  0.7s; 
}

.logListBox .bt .row {
  /* overflow: scroll;
  overflow:hidden; */
   
  width: 100%;
  margin:0px;
  padding-left:50px;
 /*  background: #000; */
 
 	position: relative;
  left:0px;
    
   
    
   /*  transition: 450ms -webkit-transform;
  	transition: 450ms transform;
  	transition: 450ms transform, 450ms -webkit-transform; */
}

.logListBox .bt .row .rowinner{
	transition: 450ms -webkit-transform;
  	transition: 450ms transform;
  	transition: 450ms transform, 450ms -webkit-transform;
  	font-size: 0;
  	white-space: nowrap;
  	margin: 10px 0px 0px 0px;
  	padding-bottom: 10px;
  	
  	vertical-align: top;
  	
}

.logListBox .bt .row .rowinner .item {
  	position: relative;
  	top:0px;
  	z-index:0;
  	display: inline-block;
 	width: 350px;
 	
 	background: #222;

  	margin-right: 10px;
  	font-size:14px;
  	
   	-webkit-transform-origin: center left;
    transform-origin: center left;
    
   overflow: hidden;
   
   text-align: left;
   
   padding: 5px;
   
   webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.5);
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.logListBox .bt .row .rowinner .item .titleBox{
	text-align:  center;
	/* font-family: 'TmonMonsori'; */
    font-size:20px;
    font-weight:bold;
    text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
    color: #fff;
    margin-top:20px;
    margin-bottom:20px;
}

.logListBox .bt .row .rowinner .item .titleBox SPAN{
	font-size: 12px;
	color: #ccc;
	font-weight: normal;
}

.logListBox .bt .row .rowinner .item TABLE{
	border-collapse:separate;
	table-layout:fixed;
	width: 100%;
}

.logListBox .bt .row .rowinner .item TABLE TD{
	padding: 10px 0px;;
	border-top: #444 1px solid;
	border-bottom: #000 2px solid;
	white-space:normal;
	text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
	
}

.logListBox .bt .row .rowinner .item TABLE .rankingTD{
 	padding: 0px 5px 0px 0px; 
	text-align: center;
	font-weight:bold;
	width:35px;
	vertical-align: middle;
}

.logListBox .bt .row .rowinner .item TABLE .imgTD{
	width:55px;
}

.logListBox .bt .row .rowinner .item TABLE .imgTD .imgbox{
	width: 50px;
	height: 71px;
	webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.5);
    -webkit-border-radius: 3px;
    border-radius: 3px;
    overflow: hidden;
}

.logListBox .bt .row .rowinner .item TABLE .imgTD .nnoneimgbox{
	width: 50px;
	height: 71px;
	
}

.logListBox .bt .row .rowinner .item TABLE .imgTD IMG{
	
}

.logListBox .bt .row .rowinner .item TABLE .infoTD{
	padding: 12px 10px 0px 10px;
	vertical-align: top;
	color: #ccc;
	font-size: 12px;
	letter-spacing: -1px;
	
}

.logListBox .bt .row .rowinner .item TABLE .infoTD .none{	
	padding-top: 20px;
}

.logListBox .bt .row .rowinner .item TABLE .infoTD .abox{
	width: 100%;
	height:69px;
}

.logListBox .bt .row .rowinner .item TABLE .infoTD .title{
	color: #f7f7f7;
	margin-top: 5px;
	font-size: 15px;
	
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.logListBox .bt .row .rowinner .item TABLE TR{
	 -webkit-transition: 0.7s;
     -moz-transition:  0.7s;
     -ms-transition:  0.7s;
     -o-transition:  0.7s;
     transition:  0.7s; 
     cursor: pointer;
}

.logListBox .bt .row .rowinner .item TABLE TR:hover,
.logListBox .bt .row .rowinner .item TABLE TR:active{
	background: #000;
	 -webkit-transition: 0.7s;
     -moz-transition:  0.7s;
     -ms-transition:  0.7s;
     -o-transition:  0.7s;
     transition:  0.7s; 
}


.logListBox .bt .rowtransition{
	 -webkit-transition: 0.7s;
     -moz-transition:  0.7s;
     -ms-transition:  0.7s;
     -o-transition:  0.7s;
     transition:  0.7s; 
}









































