@charset "UTF-8";

.p-gallery__tabList{
	display: flex;
	justify-content: center;
	gap: clamp(1.125rem, -3.3159rem + 9.2399vw, 5rem);
	flex-wrap: wrap;
	max-width: 820px;
	margin: auto;
}
.p-gallery__tabBtn{
	border: 0;
	padding: 0;
	margin: 0;
}
.p-gallery__tabBtn.c-title::before{
	height: 56%;
	transition: transform 0.3s cubic-bezier(0.76, 0, 0.24, 1) 0.15s;
}
.p-gallery__tabBtn.c-title[aria-selected="false"]::before{
	transform: translateX(10px) translateY(-50%) scaleX(0);
}
@media(hover: hover){
	.p-gallery__tabBtn.c-title[aria-selected="false"]:hover::before{
		transform: translateX(0) translateY(-50%) scaleX(1);
	}
}
.p-gallery__tabBtnTxt{
	color: #fff;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.02em;
	display: inline-block;
	padding: 4px 10px;
}

.p-gallery__tabPanel{
	margin-top: 56px;
}
.p-gallery__tabPanelList{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 36px;
}
.p-gallery__tabPanelListItem{
	width: 260px;
}
.p-gallery__tabPanelListItem button{
	cursor: pointer;
	border: none;
	padding: 0;
	margin: 0;
}
.p-gallery__tabPanelListThumb{
	overflow: hidden;
	background: #000;
	border: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	aspect-ratio: 1420 / 2000;
}
.p-gallery__tabPanelListThumb img{
	transition: transform .6s cubic-bezier(0.25, 1, 0.5, 1);
}
@media(hover: hover){
	.p-gallery__tabPanelListItem button:hover .p-gallery__tabPanelListThumb img{
		transform: scale(1.2);
	}
}
.p-gallery__tabPanelListCaption{
	color: #fff;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 16px;
}

.p-gallery__dialog{
	background: none;
	border: none;
	max-width: none;
	width: 100%;
	max-height: 100svh;
	height: 100%;
	padding: 0;
	margin: 0;

  opacity: 0;
  transition: opacity 0.3s ease;
}
.p-gallery__dialog.open{
	opacity: 1;
}
.p-gallery__dialog::backdrop{
	background: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(4px);
}
.p-gallery__dialogInner{
	position: relative;
	max-width: 940px;
	padding: 0 20px;
	margin: 100px auto;
}
.p-gallery__visuallyHidden{
  overflow: hidden;
  border: 0;
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  clip: rect(0 0 0 0);
}
.p-gallery__dialogCloseBtn{
	cursor: pointer;
	color: #fff;
	background: transparent;
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1;
	border: none;
	position: absolute;
	top: -60px;
	right: 10px;
	min-height: auto;
	padding: 0;
	margin: 0;
}

@media screen and (max-width:768px){
	.p-gallery__tabList{
    flex-wrap: wrap;
		gap: 20px;
	}
	.p-gallery__tabBtnTxt{
    font-size: 1.125rem;
	}

	.p-gallery__tabPanel{
		margin-top: 40px;
	}
	.p-gallery__tabPanelList{
		justify-content: space-between;
		gap: 28px 0;
	}
	.p-gallery__tabPanelListItem{
		width: 48%;
	}
	.p-gallery__tabPanelListCaption{
		font-size: clamp(0.8125rem, 0.6336rem + 0.7634vw, 1rem);
		margin-top: 10px;
	}

	.p-gallery__dialogInner{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
		width: 80%;
		padding: 0;
    margin: 0 auto;
	}
	.p-gallery__dialogCloseBtn{
		font-size: 2.5rem;
		font-weight: 400;
		top: -40px;
		right: 0px;
	}
}

@media screen and (max-width:374px){
	.p-gallery__tabPanelListCaption{
		font-size: 0.6875rem;
	}
}