@charset "utf-8";

.gallery_body{
	width:var(--spwidth);
	margin: 0 auto;
}
@media screen and (min-width: 769px) {
.gallery_body{
	width:var(--pcwidth);
	}
}
.gallery_notice{
	margin:0px 0 60px;
	font-size:clamp(13px,2vw,15px);
	letter-spacing:1px;
}
.gallery_notice li{
	margin:0px 0 4px;
	text-indent:-1em;
	padding-left:1em;
}
.gallery_notice li:before{
	content:"※";
}

/*------------------------------------------------------

タブ切り替え

-------------------------------------------------------*/
.tab-container {
  width: 100%;
  margin: 60px auto 0;
}
.tab-menu {
  display: flex;
  gap: 4px;
}
.tab-item {
  flex: 1;
  padding: 20px;
  border: none;
  cursor: pointer;
  background-color: #d1d5db;
  color: #374151;
  transition: background-color 0.3s;
	font-size:clamp(15px,2vw,19px);
	letter-spacing:.5px;
}
.tab-item.active {
  background-color:var(--green-color); 
  color: white;
}
.tab-content {
  display: none;
  padding: 20px 0;
  border-top: none;
}
.tab-content.active {
  display: block;
}

.tab-content.active .slick-list,
.tab-content.active .slick-track {
  transition: none !important;
/*  transform: none !important;  初期位置での固定を促す */
}
.tab-content.active {
  display: block;
  animation: tabFadeIn 0.3s ease forwards;
}

@keyframes tabFadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
/*------------------------------------------------------

ギャラリースライドショー

-------------------------------------------------------*/
.gallery li{
	list-style:none;
	position:relative;
}
.gallery-name{
	position:absolute;
	left:15px;
	bottom:8px;
	display:block;
	color:#fff;
	font-size:.9rem;
	filter: drop-shadow(2px 0px 3px #000);
	font-family: "MFW-HiraKakuStd-W2";
}
/*矢印の設定*/
.slick-prev, 
.slick-next {
    position: absolute;
	z-index: 3;
    top: 50%;
    cursor: pointer;
    outline: none;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    height: 15px;
    width: 15px;
}
@media screen and (min-width: 769px) {
.slick-prev, 
.slick-next {
    top: 42%;
    height: 25px;
    width: 25px;
	}
}

.slick-prev {
    left:2.5%;
    transform: rotate(-135deg);
}

.slick-next {
    right:2.5%;
    transform: rotate(45deg);
}

/*選択するサムネイル画像の設定*/
.choice-btn li{
	cursor: pointer;
	outline: none;
	background:#333;
list-style:none;
}

.choice-btn li img{
	opacity: 0.2;
}

.choice-btn li.slick-current img{
	opacity: 1;
}
.gallery .slick-prev, 
.gallery .slick-next {
  filter: drop-shadow(0 0 4px rgba(0,0,0,0.6));
  border-top: 3px solid #fff; 
  border-right: 3px solid #fff;
}
.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;
  color: transparent;
}
.choice-btn .slick-prev,
.choice-btn .slick-next {
  display: none !important;
}
.gallery {
  margin-bottom: -1px;
}
.slick-slider div { transition: none; }