@media screen and (max-width: 639px) {
	.actor-all {
		width: 100%;
		overflow: auto;
		height: auto;
	}
	.actor-info{
		display: none !important; 
	}
	.actor-list {
		width: 95%;
		height: auto;
		margin: auto;
	}

	.actor-list-show {
		width: 95%;
		margin: auto;
	}

	.actor-list-show>img {
		width: 100%;
		height: 130vw;
	}

	.actor-list {
		width: 95%;
		height: auto;
		margin:0 auto 15px;
	}
	.x123{
		height: 30px !important;
	}
	.actor-desc {
		width: 95%;
		margin: auto;
		top: 0px;
		left: 0px;
		height: auto;
		opacity: 1;
		z-index: 111;
	}

	.actor-list:nth-child(4n):hover .actor-desc {
		left: 0;
	}
	.my-actor{
		padding-top: 20px !important;
	}
	.actor-list:hover .actor-desc{
		height: auto !important;
	}
}




@media screen and (max-width: 800px) and (min-width: 640px) {
	.actor-all {
		width: 100%;
		overflow: auto;
		justify-content: space-between;
		padding: 0 2% 0 2%;
	}

	.actor-list {
		width: 285px;
	}

	.actor-desc {
		width: 285px;
		margin: auto;
		top: 0px;
		left: 0px;
	}

	.actor-list:nth-child(4n):hover .actor-desc {
		left: 0px;
	}
	.actor-list:hover .actor-desc{
		height: auto !important;
	}
}



@media screen and (max-width: 1199px) and (min-width: 801px) {
	.actor-all {
		width: 100%;
		overflow: auto;
		justify-content: space-between;
		padding: 0 5% 0 5%;
	}

	.actor-desc {
		width: 285px;
		margin: auto;
		top: 0px;
		left: 0px;
	}

	.actor-list:nth-child(4n):hover .actor-desc {
		left: 0px;
	}
	.actor-list:hover .actor-desc{
		height: auto !important;
	}
	

}
	@media only screen and (min-width:1200px ) {
		.actor-desc-cont{
			height:325px
		}
	}