@charset "UTF-8";

/*==================================================
Gallery List
==================================================*/
.gallery-list {
	padding: 0 40px 120px;
}

.gallery-list__inner {
	width: min(1100px, 100%);
	margin: 0 auto;
}


/*==================================================
Gallery List Item
==================================================*/
.gallery-list__item {
	border-bottom: 1px solid #ddd;
}

.gallery-list__item:first-child {
	border-top: 1px solid #ddd;
}

.gallery-list__item a {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 50px;
	align-items: center;
	padding: 30px 10px;
	color: #222;
	text-decoration: none;
}


/* Year
==================================================*/
.gallery-list__year {
	grid-column: 1;
	margin-bottom: 5px;
	color: #777;
}


/* Title
==================================================*/
.gallery-list__title {
	grid-column: 1;
	font-size: 1.8rem;
	font-weight: 600;
}


/* Arrow
==================================================*/
.gallery-list__arrow {
	grid-column: 2;
	grid-row: 1 / 3;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	color: #222849;
	font-size: 1.4rem;
	transition: transform .3s ease;
}


/* Hover
==================================================*/
@media (hover: hover) {

	.gallery-list__item a:hover .gallery-list__arrow {
		transform: translateX(6px);
	}

}


/*==================================================
Gallery Empty
==================================================*/
.gallery-list__empty {
	padding: 60px 0;
	color: #777;
	text-align: center;
}


/*==================================================
Pagination
==================================================*/
.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin: -50px auto 120px;
}

.pagination__item,
.pagination__prev,
.pagination__next {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border: 1px solid #ddd;
	border-radius: 50%;
	background-color: #fff;
	color: #222849;
	font-size: 1.4rem;
	font-weight: 500;
	text-decoration: none;
	transition:
		background-color .3s ease,
		border-color .3s ease,
		color .3s ease;
}

.pagination__item.is-current {
	border-color: #222849;
	background-color: #222849;
	color: #fff;
}

.pagination__prev,
.pagination__next {
	font-size: 1.2rem;
}


/* Pagination Hover
==================================================*/
@media (hover: hover) {

	.pagination__item:not(.is-current):hover,
	.pagination__prev:hover,
	.pagination__next:hover {
		border-color: #222849;
		background-color: #222849;
		color: #fff;
	}

}


/*==================================================
Gallery Detail
==================================================*/
.gallery-detail {
	padding: 0 40px 120px;
}

.gallery-detail__inner {
	width: min(1200px, 100%);
	margin: 0 auto;
}


/*==================================================
Gallery Detail Header
==================================================*/
.gallery-detail__header {
	margin-bottom: 50px;
	padding-bottom: 30px;
	border-bottom: 1px solid #ddd;
}

.gallery-detail__year {
	margin-bottom: 5px;
	color: #777;
}

.gallery-detail__title {
	color: #222849;
	font-size: clamp(2.2rem, 3vw, 3rem);
	font-weight: 600;
	line-height: 1.6;
}


/*==================================================
Gallery Detail Content
==================================================*/
.gallery-detail__content {
	width: 100%;
}


/*==================================================
WordPress Gallery
==================================================*/
.gallery-detail__content .wp-block-gallery,
.gallery-detail__content .wp-block-gallery.has-nested-images {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 15px;
	align-items: start;
	width: 100%;
	margin: 0;
}


/*==================================================
Gallery Item
==================================================*/
.gallery-detail__content .wp-block-gallery .wp-block-image,
.gallery-detail__content .wp-block-gallery.has-nested-images figure.wp-block-image {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	aspect-ratio: auto !important;
}


/*==================================================
Gallery Image
==================================================*/
.gallery-detail__content .wp-block-gallery .wp-block-image img,
.gallery-detail__content .wp-block-gallery.has-nested-images figure.wp-block-image img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	aspect-ratio: auto !important;
	object-fit: contain !important;
}


/*==================================================
Caption
==================================================*/
.gallery-detail__content .wp-block-gallery figcaption,
.gallery-detail__content .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	position: static;
	width: 100%;
	margin: 8px 0 0;
	padding: 0;
	background: none;
	color: #777;
	font-size: 1.2rem;
	line-height: 1.5;
	text-align: left;
}


/*==================================================
Gallery Detail Back
==================================================*/
.gallery-detail__back {
	display: flex;
	justify-content: center;
	margin-top: 80px;
	padding-top: 40px;
	border-top: 1px solid #ddd;
}

.gallery-detail__back a {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: #222849;
	font-weight: 500;
	text-decoration: none;
}

.gallery-detail__back i {
	transition: transform .3s ease;
}


/* Back Hover
==================================================*/
@media (hover: hover) {

	.gallery-detail__back a:hover i {
		transform: translateX(-6px);
	}

}


/*==================================================
Responsive
==================================================*/
@media screen and (max-width: 900px) {

	/* Gallery List
	==================================================*/
	.gallery-list {
		padding: 0 20px 80px;
	}

	.gallery-list__item a {
		grid-template-columns: minmax(0, 1fr) auto;
		padding: 25px 5px;
	}

	.gallery-list__year {
		grid-column: 1;
		font-size: 1.2rem;
	}

	.gallery-list__title {
		grid-column: 1;
		font-size: 1.6rem;
	}

	.gallery-list__arrow {
		grid-column: 2;
		grid-row: 1 / 3;
		font-size: 1.2rem;
	}


	/* Pagination
	==================================================*/
	.pagination {
		gap: 8px;
		margin: -30px auto 80px;
	}

	.pagination__item,
	.pagination__prev,
	.pagination__next {
		width: 44px;
		height: 44px;
		font-size: 1.3rem;
	}


	/* Gallery Detail
	==================================================*/
	.gallery-detail {
		padding: 0 20px 80px;
	}

	.gallery-detail__header {
		margin-bottom: 35px;
		padding-bottom: 25px;
	}

	.gallery-detail__year {
		margin-bottom: 5px;
		font-size: 1.2rem;
	}

	.gallery-detail__title {
		font-size: 2.2rem;
	}


	/* Gallery
	==================================================*/
	.gallery-detail__content .wp-block-gallery,
	.gallery-detail__content .wp-block-gallery.has-nested-images {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}


	/* Back
	==================================================*/
	.gallery-detail__back {
		margin-top: 50px;
		padding-top: 30px;
	}

}