#movieModal small span.mpcrs-19 { color:red }
#movieModal span.btn-like { background: none !important; }
#movieModal span.btn-grade { background: none !important; }

#movieModal { display:none; padding: 0 !important; margin: 0 !important; background-color: rgba(0,0,0,.8); }
#movieModal.show { display:block; }

#movieModal .modal-dialog { position: relative; width: 100%; max-width:800px; min-height: 600px; margin: 130px auto 0; background-color: #000; border: 1px solid transparent; /* border-image: linear-gradient(to right, red 0%, orange 100%); border-image-slice: 1; */ z-index: 2000; border-radius: 20px; }

#movieModal .modal-header { position: absolute; top: 10px; right: 10px; padding: 0; border:0; margin: 0; }
#movieModal .modal-header .close { float: right; font-size: 1.0rem; font-weight: 400; line-height: 1; color: #FFF; text-shadow: 0 1px 0 #999; opacity: 1.0; z-index: 102; margin: 0; padding: 0; }
#movieModal .modal-header .close span { display: inline-block; background-color: rgba(75,75,75,0.8); border:1px solid rgba(65,65,65,0.8); border-radius: 50%; line-height: 1; width: 50px; height: 50px; padding: 2px; font-weight: 400; font-size: 2.5rem; }
#movieModal .modal-header .close:hover { color: #ea3627; text-shadow: 0 1px 0 #ea3627; }

#movieModal .modal-dialog .carousel-inner .carousel-item .logo-area { position:absolute; top:0; left:0; margin: 10px; padding: 5px; background-color: rgba(0,0,0,0.6); border-radius: 10px; }

#movieModal .grade-star { display: inline-block; vertical-align: middle; margin: 0 10px 10px 0; }
#movieModal .grade-star strong { display: block; font-size: 14px; }
#movieModal .grade-star input { position: absolute; width: 0; height: 0; opacity: 0; }
#movieModal .grade-star input:checked ~ label { color: #ccc; }
#movieModal .grade-star.no-check label { color: #CCC; }
#movieModal .grade-star label { color: #ffc000; cursor: pointer; }
#movieModal .grade-star label:hover { color: #ffc000; cursor: pointer; }
#movieModal .btn-like i:hover { color: #ed3626; }
#movieModal .modal-content { background-color: transparent; color: #fff; }

#movieModal .modal-dialog .bg-image { position: absolute; top: 0; left: 0; height: 100%; width: 100%; }

#movieModal .modal-dialog .bg-image > img { position: relative; top: 0; left: 0; height: 60%; width: 100%; object-fit: cover; object-position: center top; max-width:800px; max-height:550px; min-height:550px; }

#movieModal .modal-dialog .carousel-inner { 
    height: 550px; 
}
@media screen and (max-width: 1400px){
    #movieModal .modal-dialog .carousel-inner { 
        height: 550px; 
    }
}
@media screen and (max-width: 1200px){
    #movieModal .modal-dialog .carousel-inner { 
        height: 550px; 
    }
}
@media screen and (max-width: 992px){
    #movieModal .modal-dialog .carousel-inner { 
        height: 550px; 
    }
    #movieModal .modal-dialog {
        margin: 130px auto 0;
    }    
}

@media screen and (max-width: 768px){
    #movieModal .modal-dialog .carousel-inner { 
        height: 550px; 
    }
}

@media screen and (max-width: 650px){
    #movieModal .modal-dialog .carousel-inner { 
        height: 450px; 
    }
    #movieModal .modal-dialog {
        margin: 70px auto 0;
    }
}

@media screen and (max-width: 650px){
    #movieModal .modal-dialog .carousel-inner { 
        height: 400px; 
    }
    #movieModal .modal-dialog {
        margin: 70px auto 0;
    }
}

#movieModal .modal-dialog .carousel-inner .carousel-item { display:block; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); float: none; position: relative; }
#movieModal button.slider_play { border-radius:20px; background: rgba(255,255,255,0.6); color:#000; font-size:20px; height:auto; padding:5px 16px; border:1px solid #000; text-shadow: 1px 1px rgba(255,255,255,0.5); }
#movieModal button.btn_default:hover { background: #DF1F0E !important; }
#movieModal .modal-dialog .movie-info { /* border-top:1px solid transparent; border-image: linear-gradient(to right, red 0%, orange 100%); border-image-slice: 1; */ min-height:80px; height:auto; }
#movieModal .modal-dialog .movie-info .movie-content { background-color:#282828; padding:20px 10px 40px 20px; overflow-y: auto; }
#movieModal .modal-dialog .movie-info .movie-content .btn-point { border-radius:10px; font-size:16px; background: #ff0000;letter-spacing:1.0px; }
#movieModal .modal-dialog .movie-info .movie-content .mpcrs-box { border-radius: 10px; background-color: #d92b36; width: 80px; height: 80px; font-size: 3.5rem; line-height: 1.0; padding: 8px; }
#movieModal .modal-dialog .movie-info .movie-content .mpcrs-box .mpcrs { text-align:center; display: inherit; font-weight: 700; }

#movieModal a.marker {
	position: absolute !important;
    top: 8px;
    left: 8px;
    width: 80px;
    height: 80px;
/*
	background-color: rgba(255,255,255,1.0);
	border: 1px solid rgba(0,0,0,0.4);
	border-radius: 50%;
*/
}

#movieModal a.marker.s:before {
	content:"";
	color: rgba(255,0,0,1.0);
	font-weight: 700;
	font-size: 4.0rem;
	position: absolute;
	top: 8px; left: 0;
	font-family: 'Abril Fatface';
	width:90px; height: 90px;
	background-image: url('/images/bb160212-981f-4b54-90a8-f1de9edb59de.png');
	background-size:  90px 90px;
	background-repeat: no-repeat;
}

#movieModal a.marker.f:before {
	content:"";
	color: rgba(0,0,255,1.0);
	font-weight: 700;
	font-size: 4.0rem;
	position: absolute;
	top:10px; left:10px;
	font-family: 'Abril Fatface';
	width:80px; height: 80px;
	background-image: url('/images/bb160212-981f-4b54-90a8-f1de9edb59df.png');
	background-size:  80px 80px;
	background-repeat: no-repeat;
}

#movieModal .hide { display:none; }