/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jan 17 2026 | 12:06:15 */
/* ----------------------------- 軽量YouTube動画スライダー -----------------------------*/
.custom-video-slider {
  position: relative;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.slider-track {
  display: flex;
  transition: transform 0.5s ease;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.slider-track:active {
  cursor: grabbing;
}

.slider-item {
  flex: 0 0 auto;
  box-sizing: border-box;
  padding: 0 10px;
}

/* レスポンシブ対応 */
@media (min-width: 1024px) {
  .slider-item {
    width: 33.333%;
  }
}

@media (min-width: 576px) and (max-width: 1023px) {
  .slider-item {
    width: 50%;
  }
}

@media (max-width: 575px) {
  .slider-item {
    width: 100%;
  }
}

.slider-item a {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  text-decoration: none;
}

/* ホバー時のアクション秒数（画面が大きくなる秒数的な） */
.slider-item img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.3s ease;
}

.slider-item a:hover img {
  transform: scale(1.05);
}

/* ビデオオーバーレイアイコン */
.video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.slider-item a:hover .video-overlay {
  opacity: 1;
}

.video-overlay::before {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 0 20px 35px;
  border-color: transparent transparent transparent #ffffff;
  margin-left: 5px;
}

/* キャプション（画像の下に配置） */
.video-caption {
  display: block;
  background: transparent;
  color: #3a3230;
  padding: 15px 0 0 0;
  font-size: 16px;
  text-align: center;
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  line-height: 1.5;
}

/* Enfoldのimage-overlayを非表示 */
.slider-item .image-overlay {
  display: none !important;
}

/* ドラッグ中は画像選択を無効化 */
.slider-track img {
  pointer-events: none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

/* リンクのデフォルトスタイルをリセット */
.slider-item a:hover {
  text-decoration: none;
}

/* モバイル対応 */
@media (max-width: 767px) {
  .video-caption {
    font-size: 14px;
    padding: 10px 0 0 0;
  }
}

/* タッチデバイスでのスクロール改善 */
.slider-track {
  touch-action: pan-y;
}


/* ----------------------------- 軽量アルバムスライダー -----------------------------*/
.custom-album-slider {
  position: relative;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.custom-album-slider .slider-track {
  display: flex;
  transition: transform 0.5s ease;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.custom-album-slider .slider-track:active {
  cursor: grabbing;
}

.custom-album-slider .slider-item {
  flex: 0 0 auto;
  box-sizing: border-box;
  padding: 0 10px;
}

/* レスポンシブ対応 - 最低2枚表示 */
@media (min-width: 1024px) {
  .custom-album-slider .slider-item {
    width: 33.333%;
  }
}

@media (min-width: 576px) and (max-width: 1023px) {
  .custom-album-slider .slider-item {
    width: 50%;
  }
}

/* 576px未満でも2枚表示 */
@media (max-width: 575px) {
  .custom-album-slider .slider-item {
    width: 50%;
  }
}

.custom-album-slider .slider-item a {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  text-decoration: none;
}

/* ホバー時のアクション */
.custom-album-slider .slider-item img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.3s ease;
}

.custom-album-slider .slider-item a:hover img {
  transform: scale(1.05);
}

/* 画像オーバーレイ */
.custom-album-slider .image-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.custom-album-slider .slider-item a:hover .image-overlay {
  opacity: 1;
}

/* キャプション（画像の下に配置） */
.custom-album-slider .album-caption {
  display: block;
  background: transparent;
  color: #3a3230;
  padding: 15px 0 0 0;
  font-size: 16px;
  text-align: center;
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  line-height: 1.5;
}

/* ドラッグ中は画像選択を無効化 */
.custom-album-slider .slider-track img {
  pointer-events: none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

/* リンクのデフォルトスタイルをリセット */
.custom-album-slider .slider-item a:hover {
  text-decoration: none;
}

/* モバイル対応 */
@media (max-width: 767px) {
  .custom-album-slider .album-caption {
    font-size: 14px;
    padding: 10px 0 0 0;
  }
}

/* タッチデバイスでのスクロール改善 */
.custom-album-slider .slider-track {
  touch-action: pan-y;
}

/* ----------------------------- Storeスライダー -----------------------------*/
.custom-store-slider {
  position: relative;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.custom-store-slider .slider-track {
  display: flex;
  transition: transform 0.5s ease;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.custom-store-slider .slider-track:active {
  cursor: grabbing;
}

.custom-store-slider .slider-item {
  flex: 0 0 auto;
  box-sizing: border-box;
  padding: 0 3px; /* 余白を小さく */
}

/* レスポンシブ対応 - 最低2枚表示 */
@media (min-width: 1280px) {
  .custom-store-slider .slider-item {
    width: 25%;  /* 4枚表示 */
  }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .custom-store-slider .slider-item {
    width: 33.333%;  /* 3枚表示 */
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .custom-store-slider .slider-item {
    width: 33.333%;  /* 3枚表示 */
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .custom-store-slider .slider-item {
    width: 50%;  /* 2枚表示 */
  }
}

/* 576px未満でも2枚表示 */
@media (max-width: 575px) {
  .custom-store-slider .slider-item {
    width: 50%;
  }
}

.custom-store-slider .slider-item a {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  text-decoration: none;
}

/* ホバー時のアクション */
.custom-store-slider .slider-item img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.3s ease;
}

.custom-store-slider .slider-item a:hover img {
  transform: scale(1.05);
}

/* 画像オーバーレイ */
.custom-store-slider .image-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.custom-store-slider .slider-item a:hover .image-overlay {
  opacity: 1;
}

/* ドラッグ中は画像選択を無効化 */
.custom-store-slider .slider-track img {
  pointer-events: none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

/* リンクのデフォルトスタイルをリセット */
.custom-store-slider .slider-item a:hover {
  text-decoration: none;
}

/* タッチデバイスでのスクロール改善 */
.custom-store-slider .slider-track {
  touch-action: pan-y;
}

/* 既存のcarousel-sliderを上書き（storeページのみ適用される想定） */
.custom-store-slider .carousel-slider-outer,
.custom-store-slider .owl-carousel {
  display: none !important;
}