/* カスタマイズ用CSS */

/* ECCBUE DETAIL BEGIN */
/* ECCBUE Japanese detail treatment: all rules stay inside the existing product role. */
.is-product-detail { background: #f3f0e8; color: #20211f; }
.is-product-detail .ec-layoutRole { margin-top: 0; background: #f3f0e8; }
.is-product-detail .ec-productRole {
  max-width: 1240px;
  margin: 0 auto;
  padding: 56px 28px 104px;
  color: #20211f;
  font-family: "Yu Gothic", "游ゴシック", "Hiragino Kaku Gothic ProN", sans-serif;
}
.is-product-detail .ec-grid2 { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr); gap: clamp(40px, 6vw, 92px); align-items: start; }
.is-product-detail .ec-grid2__cell:first-child { min-width: 0; }
.is-product-detail .item_visual { background: #e6e7e2; }
.is-product-detail .ec-sliderItemRole img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
.is-product-detail .item_nav { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 10px; width: 100%; margin-top: 14px; overflow-x: auto; padding-bottom: 3px; }
.is-product-detail .item_nav .slideThumb { flex: 0 0 78px; width: 78px; height: 96px; margin: 0; border: 1px solid #c9c8c0; background: #e6e7e2; }
.is-product-detail .item_nav img { width: 100%; height: 100%; object-fit: cover; }
.is-product-detail .ec-productRole__profile { position: sticky; top: 28px; padding-top: 8px; }
.is-product-detail .ec-productRole__title { margin: 0 0 20px; color: #20211f; font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", serif; font-size: clamp(30px, 3.5vw, 48px); font-weight: 500; letter-spacing: .04em; line-height: 1.35; }
.is-product-detail .ec-productRole__price { color: #596b72; font-family: "Yu Gothic", "游ゴシック", sans-serif; font-size: 18px; font-weight: 700; }
.is-product-detail .ec-productRole__actions { margin-top: 28px; padding-top: 24px; border-top: 1px solid #c9c8c0; }
.is-product-detail .ec-productRole__btn { min-height: 54px; border-radius: 0; background: #20211f; border-color: #20211f; color: #fff; font-family: "Yu Gothic", "游ゴシック", sans-serif; letter-spacing: .08em; }
.is-product-detail .ec-productRole__btn:hover { background: #596b72; border-color: #596b72; }
.is-product-detail .ec-blockBtn--cancel { border-radius: 0; color: #596b72; }

@media (min-width: 768px) {
  #page_product_detail.is-product-detail .hermes-detail-shell .item_nav { flex-wrap: nowrap; }
  #page_product_detail.is-product-detail .hermes-detail-shell .item_nav .slideThumb { flex: 0 0 78px; }
}

@media (max-width: 767px) {
  .is-product-detail .ec-productRole { padding: 24px 15px 0; padding-bottom: calc(118px + env(safe-area-inset-bottom)); }
  .is-product-detail .ec-grid2 { display: block; }
  .is-product-detail .ec-grid2__cell + .ec-grid2__cell { margin-top: 30px; }
  .is-product-detail .item_nav { flex-direction: row; width: 100%; overflow-x: auto; padding-bottom: 3px; }
  .is-product-detail .item_nav .slideThumb { flex: 0 0 64px; width: 64px; height: 80px; }
  #page_product_detail.is-product-detail .hermes-detail-shell .item_nav { flex-wrap: nowrap; }
  #page_product_detail.is-product-detail .hermes-detail-shell .item_nav .slideThumb { flex: 0 0 64px; width: 64px; height: 80px; }
  .is-product-detail .ec-productRole__profile { position: static; padding-top: 0; }
  .is-product-detail .ec-productRole__title { font-size: 30px; }
  .is-product-detail .ec-productRole__btn { position: fixed; z-index: 20; right: 15px; bottom: calc(12px + env(safe-area-inset-bottom)); left: 15px; width: calc(100% - 30px); box-shadow: 0 8px 24px rgba(32,33,31,.18); }
}

@media (prefers-reduced-motion: reduce) {
  .is-product-detail *, .is-product-detail *::before, .is-product-detail *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* ECCBUE DETAIL END */

/* ECCBUE PRODUCT LIST BEGIN */
#page_product_list {
  --eccbue-paper: #f3f0e8;
  --eccbue-surface: #fbfaf7;
  --eccbue-ink: #20211f;
  --eccbue-muted: #73756f;
  --eccbue-line: #c9c8c0;
  --eccbue-accent: #596b72;
  background: var(--eccbue-paper);
  color: var(--eccbue-ink);
  font-family: "Yu Gothic", "游ゴシック", "Hiragino Kaku Gothic ProN", sans-serif;
  letter-spacing: 0;
}

#page_product_list .ec-layoutRole__main {
  max-width: 1240px;
  margin: 0 auto;
  padding: 48px 28px 80px;
}

#page_product_list .ec-searchnavRole,
#page_product_list .ec-shelfRole {
  background: transparent;
}

#page_product_list .ec-categoryNaviRole,
#page_product_list .ec-headerCategoryArea {
  padding: 10px 28px;
  border-bottom: 1px solid var(--eccbue-line);
  background: var(--eccbue-paper);
}

#page_product_list .ec-headerCategoryArea__heading {
  display: none;
}

#page_product_list .ec-categoryNaviRole .ec-itemNav__nav,
#page_product_list .ec-headerCategoryArea .ec-itemNav__nav {
  display: flex;
  flex-wrap: nowrap;
  gap: 20px;
  max-width: 1240px;
  margin: 0 auto;
  overflow-x: auto;
  padding: 0 0 4px;
  scrollbar-width: none;
}

#page_product_list .ec-categoryNaviRole .ec-itemNav__nav::-webkit-scrollbar,
#page_product_list .ec-headerCategoryArea .ec-itemNav__nav::-webkit-scrollbar {
  display: none;
}

#page_product_list .ec-categoryNaviRole .ec-itemNav__nav li,
#page_product_list .ec-headerCategoryArea .ec-itemNav__nav li {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
}

#page_product_list .ec-categoryNaviRole .ec-itemNav__nav a,
#page_product_list .ec-headerCategoryArea .ec-itemNav__nav a {
  display: block;
  padding: 7px 0;
  color: var(--eccbue-ink);
  font-size: 12px;
  white-space: nowrap;
}

#page_product_list .ec-searchnavRole__topicpath {
  margin-bottom: 28px;
  color: var(--eccbue-muted);
  font-size: 12px;
}

#page_product_list .product-list__heading {
  margin-bottom: 30px;
}

#page_product_list .product-list__eyebrow {
  margin: 0 0 8px;
  color: var(--eccbue-accent);
  font-size: 11px;
}

#page_product_list .product-list__heading h1 {
  margin: 0;
  color: var(--eccbue-ink);
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", serif;
  font-size: 34px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0;
}

#page_product_list .product-list__toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 20px;
  margin-bottom: 32px;
  padding: 14px 0;
  border-top: 1px solid var(--eccbue-line);
  border-bottom: 1px solid var(--eccbue-line);
}

#page_product_list .ec-searchnavRole__counter {
  color: var(--eccbue-muted);
  font-size: 13px;
}

#page_product_list .ec-searchnavRole__counter .ec-font-bold {
  margin-right: 4px;
  color: var(--eccbue-ink);
  font-weight: 500;
}

#page_product_list .ec-searchnavRole__actions .ec-select {
  display: flex;
  align-items: end;
  gap: 12px;
  margin: 0;
}

#page_product_list .product-list__control {
  display: grid;
  gap: 6px;
}

#page_product_list .product-list__control label {
  margin: 0;
  color: var(--eccbue-muted);
  font-size: 11px;
  font-weight: 400;
}

#page_product_list .product-list__control select {
  min-width: 132px;
  height: 44px;
  margin: 0;
  padding: 0 34px 0 12px;
  border: 1px solid var(--eccbue-line);
  border-radius: 0;
  background-color: var(--eccbue-surface);
  color: var(--eccbue-ink);
  font-size: 13px;
}

#page_product_list .product-list__control select:focus {
  border-color: var(--eccbue-accent);
  outline: 2px solid var(--eccbue-accent);
  outline-offset: 2px;
}

#page_product_list .ec-shelfGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 48px 22px;
  margin: 0;
}

#page_product_list .ec-shelfGrid__item {
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
}

#page_product_list .ec-shelfGrid__item > a {
  display: block;
  color: var(--eccbue-ink);
  text-decoration: none;
}

#page_product_list .product-list__image {
  aspect-ratio: 3 / 4;
  margin: 0;
  overflow: hidden;
  background: #e8e5dd;
}

#page_product_list .product-list__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 180ms ease;
}

#page_product_list .ec-shelfGrid__item > a:hover .product-list__image img {
  opacity: .9;
}

#page_product_list .product-list__name {
  display: -webkit-box;
  min-height: 3em;
  margin: 12px 0 6px;
  overflow: hidden;
  color: var(--eccbue-ink);
  font-size: 13px;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

#page_product_list .product-list__description,
#page_product_list .ec-shelfGrid__item > form,
#page_product_list .ec-shelfGrid__item > .ec-productRole__btn {
  display: none;
}

#page_product_list .price02-default {
  margin: 0;
  color: var(--eccbue-ink);
  font-size: 14px;
  font-weight: 500;
}

#page_product_list .product-list__pagination {
  margin-top: 58px;
}

#page_product_list .product-list__pagination .ec-pager {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 6px;
  margin: 0;
}

#page_product_list .product-list__pagination .ec-pager__item,
#page_product_list .product-list__pagination .ec-pager__item--active,
#page_product_list .product-list__pagination a,
#page_product_list .product-list__pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
}

#page_product_list .product-list__pagination a {
  border: 1px solid var(--eccbue-line);
  background: var(--eccbue-surface);
  color: var(--eccbue-ink);
  text-decoration: none;
}

#page_product_list .product-list__pagination .ec-pager__item--active a {
  border-color: var(--eccbue-ink);
  background: var(--eccbue-ink);
  color: var(--eccbue-surface);
}

@media (max-width: 767px) {
  #page_product_list .ec-headerCategoryArea {
    padding: 8px 15px;
  }

  #page_product_list .ec-headerCategoryArea .ec-itemNav__nav {
    gap: 16px;
    margin: 0;
  }

  #page_product_list .ec-layoutRole__main {
    padding: 28px 15px 56px;
  }

  #page_product_list .product-list__heading h1 {
    font-size: 27px;
  }

  #page_product_list .product-list__toolbar {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  #page_product_list .ec-searchnavRole__actions .ec-select {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  #page_product_list .product-list__control select {
    width: 100%;
    min-width: 0;
  }

  #page_product_list .ec-shelfGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 12px;
  }

  #page_product_list .product-list__pagination {
    overflow-x: auto;
    padding-bottom: 6px;
  }

  #page_product_list .product-list__pagination .ec-pager {
    width: max-content;
    justify-content: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  #page_product_list .product-list__image img {
    transition: none;
  }
}
/* ECCBUE PRODUCT LIST END */