/******************************/
/* category */
/******************************/
.p-category__ttl {
  margin: 10px 0 30px 0;
  line-height: 1.4;
  font-size: 30px;
  font-weight: normal;
}
.p-category-free {
  margin-bottom: 60px;
  line-height: 2;
}
/***** カテゴリ一覧 *****/
.p-category-list {
  display: flex;
  flex-wrap: wrap;
  margin-top: 60px;
  margin-bottom: 60px;
  margin-left: -15px;
  margin-right: -15px;
}
@media screen and (max-width: 767px) {
  .p-category-list {
    display: block;
    margin-left: 0;
    margin-right: 0;
  }
}
.p-category-list__item {
  box-sizing: border-box;
  margin-bottom: 60px;
  padding-left: 15px;
  padding-right: 15px;
  width: 33.3333%;
  font-size: 16px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-category-list__item {
    margin-bottom: 15px;
    padding-left: 0;
    padding-right: 0;
    width: auto;
    text-align: left;
  }
}
.p-category-list__link {
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-category-list__link {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
}
.p-category-list__link:hover {
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .p-category-list__link:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 5px;
    margin-top: -6px;
    width: 8px;
    height: 8px;
    border-right: 1px solid #aaaaaa;
    border-bottom: 1px solid #aaaaaa;
    transform: rotate(-45deg);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
}
.p-category-list__img {
  display: block;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .p-category-list__img {
    margin-right: 10px;
    margin-bottom: 0;
    width: 75px;
  }
}
.p-category-list__name:hover {
  text-decoration: underline;
}
@media screen and (max-width: 767px) {
  .p-category-list__name:hover {
    text-decoration: none;
  }
}
@media screen and (max-width: 767px) {
  .p-category-list__name {
    flex: 1;
  }
}
/***** 商品件数・ソート *****/
.p-item-list-head {
  display: flex;
  justify-content: space-between;
  padding: 30px;
  border-top: 1px solid #7d7d7d;
}
@media screen and (max-width: 767px) {
  .p-item-list-head {
    padding: 30px 0;
  }
}
.p-item-list-num {
  font-size: 16px;
}
@media screen and (max-width: 767px) {
  .p-item-list-num {
    font-size: 14px;
  }
}
.p-item-sort-list {
  display: flex;
  flex-wrap: wrap;
}
.p-item-sort-list__item {
  margin-left: 30px;
}
@media screen and (max-width: 767px) {
  .p-item-sort-list__item {
    margin-left: 25px;
  }
}
.p-item-sort-list__item:first-child {
  margin-left: 0;
}
.p-item-sort-list__item span {
  text-decoration: underline;
}

/* 商品リスト：5列に調整 */
.c-item-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 20px;
  padding-left: 0;
}

/* 商品アイテム幅：5列（PC） */
.c-item-list__item {
  width: calc((100% - 80px) / 5) !important;
  margin-bottom: 40px;
  list-style: none;
}

.c-item-list__item {
  width: calc((100% - 80px) / 5) !important;
}

/* 商品一覧ページ：商品エリアを全幅に */
.l-contents-wrap {
  display: flex;
}

.l-contents-main {
  width: 100% !important;
  padding-right: 0 !important;
}

/* サイドカラムを非表示に */
.l-contents-side {
  display: none;
}

/* スマホ：2列に上書き（!importantで強制） */
@media screen and (max-width: 768px) {
  .c-item-list__item {
    width: calc((100% - 20px) / 2) !important;
  }
}

.c-breadcrumbs-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
}

.c-breadcrumbs-list__item::after {
  content: ">";
  margin: 0 0.5em;
  color: #999;
}

.c-breadcrumbs-list__item:last-child::after {
  content: "";
}

.c-pager-list {
  list-style: none;
  padding: 0;
  margin: 2em 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  justify-content: center;
  font-size: 14px;
  color: #444;
}

.c-pager-list__item {
  display: inline;
}

.c-pager-list__link {
  text-decoration: none;
  padding: 0.4em 0.8em;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #444;
  transition: background 0.2s;
}

.c-pager-list__link:hover {
  background: #eee;
}

.c-pager-list__link.is-current,
.c-pager-list__link.is-disabled.is-current {
  font-weight: bold;
  background: #222;
  color: #fff;
  border-color: #222;
  pointer-events: none;
}

.c-pager-list__link.is-disabled {
  color: #aaa;
  border-color: #ddd;
  background: #f9f9f9;
  pointer-events: none;
}

/* カテゴリーの全体マージン（上下の余白）を削る */
.p-category-list {
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 2rem; /* カテゴリー間の横スペース、必要に応じて調整 */
  flex-wrap: wrap; /* スマホ対策で折り返し可 */
}

/* 各カテゴリー要素の上下スペースも調整 */
.p-category-list__item {
  margin: 0;
  padding: 0.5rem 0; /* 上下に少しだけスペースを残す */
  list-style: none;
}

/* カテゴリ名の文字サイズやスタイルも必要に応じて */
.p-category-list__name {
  font-size: 1rem;
  letter-spacing: 0.02em;
}

.p-category__ttl {
  display: none !important;
}

.c-breadcrumbs {
  margin-top: 40px;
  margin-bottom: 20px;
  padding-left: 2em; /* 内側に寄せる */
}

.p-category-list {
  justify-content: flex-start; /* ←中央から左寄せに変更 */
  padding-left: 2em; /* 左の余白で内寄せ感を出す */
  margin-bottom: 40px;
}

.p-category-list__item {
  padding: 0.5rem 1.5rem; /* タブ同士の間隔を少し内側に */
}

.l-contents-main > h3 {
  display: none !important;
}

.c-item-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px; /* 必要に応じて調整 */
  padding: 0;
  margin: 0 auto;
  max-width: 100%;
  box-sizing: border-box;
}

.c-item-list__item {
  margin: 0;
}
