@charset "utf-8";
.PhotoList_i1 {}
.PhotoList_i1 li{ width:32%; margin:0 2% 30px 0; float:left;}
.PhotoList_i1 li:nth-child(3n+3){margin-right:0;}
.PhotoList_i1 li a{ position:relative; display: inline-block; width:100%;height:300px;text-align:center;border:1px solid #e5e5e5;background:#f8f8f8;box-sizing:border-box;vertical-align: middle;overflow: hidden; transition:all 0.5s;}
.PhotoList_i1 li a img{ transform: scale(1);transition: all 1s ease 0s;-webkit-transform: scale(1);-webkit-transform: all 1s ease 0s; height:100%;vertical-align: middle; }
.PhotoList_i1 li a:hover{border:1px solid #12b504; }
.PhotoList_i1 li span{ font-size:16px; line-height:50px; text-align:center; height:50px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block;}
.PhotoList_i1 li:hover span{ color:#12b504;}
.PhotoList_i1 li a:hover img{transform: scale(1.1);transition: all 1s ease 0s;-webkit-transform: scale(1.1);-webkit-transform: all 1s ease 0s;}
.PhotoList_i1 li a h4{ display:none;position: absolute;z-index:10;display:block;transition: 0.6s;color:#fff; top:0%; left:0; width:90%; padding:0 5%; text-align:center; line-height:40px; font-size:22px; opacity:0; overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.PhotoList_i1 li a:hover h4{ display:none;opacity:1; top:30%;transition: 0.6s;}
.PhotoList_i1 li a::after{ display:none;content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 0%; background:rgba(0,0,0,.5); background-size:10%;z-index: 1;transition: 0.6s;}
.PhotoList_i1 li a:hover::after{display:none;width: 100%; height: 100%;z-index: 1;transition: 0.6s;}

@media only screen and (max-width: 1200px){
.PhotoList_i1 li{ width:49%;}
.PhotoList_i1 li:nth-child(2n+2){margin-right:0;}
.PhotoList_i1 li:nth-child(3n+3){margin-right:2%;}
	}
@media only screen and (max-width: 800px){
.PhotoList_i1 li{ width:100%;margin:0 0 20px 0; }
.PhotoList_i1 li:nth-child(2n+2){margin-right:0;}
.PhotoList_i1 li:nth-child(3n+3){margin-right:0;}
.PhotoList_i1 li a{height:260px}
.PhotoList_i1 li a:hover{border:1px solid #e5e5e5; }
.PhotoList_i1 li a h4{ display:none;}
.PhotoList_i1 li a:hover::after{ display:none;}
.PhotoList_i1 li:hover span{ color:#333;}
.PhotoList_i1 li a img{transform: scale(1);transition: all 1s ease 0s;-webkit-transform: scale(1);-webkit-transform: all 1s ease 0s; vertical-align: middle; display: inline-block;}
.PhotoList_i1 li a:hover img{transform: scale(1);transition: all 1s ease 0s;-webkit-transform: scale(1);-webkit-transform: all 1s ease 0s;}
	}