@charset "utf-8";
/* CSS Document */

.pix-image-gallery ul{
	margin: 0;
	padding: 0;
	text-align: center;
	font-weight: 600;
	font-size: 1.2rem;
	line-height: 1.6rem;
}
.pix-image-gallery ul li{
	padding: 0;
	background: none;
	border: 3px solid #fff;
	box-shadow: 0 0 5px 2px #ebebebe0;
}
.pix-image-gallery ul li a{
	display: block;
	position: relative;
}
.pix-image-gallery ul li a .image-thumb{
	display: block;
	position: relative;
}
.pix-image-gallery ul li a .image-thumb img{
	width: 100%;
	height: auto;
	display: block;
}
.pix-image-gallery ul li a .image-title{
	display: block;
	padding: 8px 5px;
	color: #333;
}
.zoom-icon{
	width:40px;
	height:40px;
	position:absolute;
	left:50%;
	top:50%;
	margin:-20px 0 0 -20px;
	display:block;	
	background-color:#0da107;
	border: 3px solid rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30' fill='%23fff'%3E%3Cpath d='M0 13.7h30v2.6H0z'/%3E%3Cpath d='M13.7 0h2.6v30h-2.6z'/%3E%3C/svg%3E") 50% 50% no-repeat rgba(255,255,255,.0);
	background-size: 20px 15px;
}

@media only screen and (min-width: 500px){
	
}
@media only screen and (min-width: 768px){
	.pix-image-gallery ul li a .video-thumb{
		display: block;
	}
}
@media only screen and (min-width: 921px){
		
}
@media only screen and (min-width: 1025px){
	.pix-image-gallery ul{
		font-size: 1.4rem;
		line-height: 2.0rem;
	}
	.pix-image-gallery ul li a .image-title{
		padding: 10px 5px;
	}
	.pix-image-gallery ul li a:hover .image-title{
		color: #2dc127;
	}
	.zoom-icon {
        width: 40px;
        height: 40px;
        margin: -20px 0 0 -20px;
        background-size: 20px 20px;
		opacity: 1;
		webkit-transition: all .3s;
        -khtml-transition: all .3s;
        -moz-transition: all .3s;
        -ms-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
    }
	.pix-image-gallery li:hover .zoom-icon {
		opacity: 0.7;
	}
	.image-thumb{
		overflow: hidden;
	}
	.pix-image-gallery ul li .image-thumb img {
		scale: 1.0;
		webkit-transition: all .3s;
        -khtml-transition: all .3s;
        -moz-transition: all .3s;
        -ms-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
	}
	.pix-image-gallery ul li:hover .image-thumb img {
		scale: 1.2;
	}
}
@media only screen and (min-width: 1500px){
			
}