/** Shopify CDN: Minification failed

Line 10:0 Unexpected "<"
Line 104:0 Unexpected "<"

**/


/* CSS from section stylesheet tags */
<style>
.page-slider {
  padding: 4rem 0;
}

.page-slider__inner {
  padding-left: clamp(1rem, 5vw, 4rem);
  padding-right: clamp(0.5rem, 2vw, 1rem); /* 右側のパディングを減らして最後のアイテムが少し見えるように */
}

.page-slider .slider {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 120px; /* モバイルでより小さく */
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 8px; /* スクロールバー分のスペース */
}

.page-slider .slider::-webkit-scrollbar {
  height: 4px;
}

.page-slider .slider::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 2px;
}

.page-slider .slider::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 2px;
}

.page-slider .slider::-webkit-scrollbar-thumb:hover {
  background: #999;
}

.page-slider .item {
  scroll-snap-align: start;
  text-align: center;
  transition: transform 0.2s ease;
}

.page-slider .item:hover {
  transform: translateY(-2px);
}

.page-slider .item img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.page-slider .item-title {
  margin-top: 0.5rem;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #333;
}

/* タブレット */
@media screen and (min-width: 768px) {
  .page-slider .slider {
    grid-auto-columns: 140px;
    gap: 16px;
  }
  
  .page-slider .item-title {
    font-size: 13px;
  }
}

/* デスクトップ */
@media screen and (min-width: 1024px) {
  .page-slider .slider {
    grid-auto-columns: 160px;
    gap: 20px;
  }
  
  .page-slider .item-title {
    font-size: 14px;
  }
}

/* 大きなデスクトップ */
@media screen and (min-width: 1400px) {
  .page-slider .slider {
    grid-auto-columns: 180px;
  }
}
</style>