@charset "utf-8";

/* ----- photoGallery ----- */
.photoGallery {
	--gap:15px;
	--target-height:300px;
	--min-height:200px;
	--max-height:400px;
	display:flex;
	flex-wrap:wrap;
	column-gap:var(--gap);
	row-gap:0;
	margin-bottom:calc(-1 * var(--gap));
	list-style:none;
	margin-left:0;
	margin-right:0;
	padding:0;
}
.photoGallery li {
	display:block;
	flex:0 0 auto;
	margin-bottom:var(--gap);
}
.photoGallery li.pending {
	visibility:hidden;
	width:0;
	height:0;
}  
.photoGallery li a {
	display:block;
	width:100%;
	height:100%;
	overflow:hidden;
	-webkit-border-radius:10px;
	   -moz-border-radius:10px;
			border-radius:10px;
}
.photoGallery li a figure {
	position:relative;
	display:block;
	overflow:hidden;
	width:100%;
	height:100%;
	margin:0;
}
.photoGallery li a figure figcaption {
	position:absolute;
	top:100%;
	width:100%;
	color:#fff;
	font-size:1.7em;
	line-height:130%;
	font-weight:normal;
	text-align:center;
	padding:25px 15px 20px 15px;
	box-sizing:border-box;
	background-color:transparent;
	background-image:linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 90%);
	transform:translateY(100%);
	-webkit-transition:all 0.5s ease;
	   -moz-transition:all 0.5s ease;
		 -o-transition:all 0.5s ease;
			transition:all 0.5s ease;
}
.photoGallery li a:hover figure figcaption,
.photoGallery li a:focus figure figcaption {
	transform:translateY(-100%);
}
.photoGallery li a .pic {
	display:block;
	overflow:hidden;
	width:100%;
	height:100%;
}
.photoGallery li a .pic img {
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform 0.3s ease;
}
.photoGallery li a:hover .pic img,
.photoGallery li a:focus .pic img {
	transform:scale(1.08);
}
.photoGallery .breaker {
	flex-basis:100%;
	width:0;
	height:0;
	margin:0;
	padding:0;
}
@media (max-width:768px) {
	.photoGallery {
		--gap:10px;
		--target-height:240px;
		--min-height:140px;
		--max-height:320px;
	}
}
@media (max-width:480px) {
	.photoGallery {
		--gap:8px;
		--target-height:150px;
		--min-height:100px;
		--max-height:210px;
	}
}
@media (min-width:1200px) {
	.pageRight .photoGallery {
		--target-height:240px;
	}
}