/* NOTE: ウェディングドレス、カラードレス、着物のアーカイブページ用共通スタイルです */

.productArchive {
  padding-top: min(3.5rem /* 56px (基準16px) */, 3.889vw /* 56px (基準1440px) */);
  background-color: #fffdf8;
  color: #3d3d3d;
}

.s .productArchive {
  padding-top: 3.563rem /* 57px (基準16px) */;
}

.productArchive-inner {
  width: min(80rem /* 1280px (基準16px) */, 88.889vw /* 1280px (基準1440px) */);
  margin: 0 auto;
  padding-top: 7.5rem /* 120px (基準16px) */;
  padding-bottom: 3.75rem /* 60px (基準16px) */;
}

.s .productArchive-inner {
  padding-top: 5rem /* 80px (基準16px) */;
  width: 90%;
}

.productArchive-title {
  width: 19.375rem /* 310px (基準16px) */;
  margin: 0 auto;
}

.productArchive-lead {
  font-size: 0.813rem /* 13px (基準16px) */;
  width: 41.125rem /* 658px (基準16px) */;
  margin: 0 auto;
  margin-top: 3.75rem /* 60px (基準16px) */;
  line-height: 1.8;
}

.s .productArchive-lead {
  width: 100%;
}

.productArchive-text {
  margin-top: 3.75rem /* 60px (基準16px) */;
  text-align: center;
  font-size: 0.813rem /* 13px (基準16px) */;
  line-height: 1.8;
}

.productArchive-narrow {
  width: 42.75rem /* 684px (基準16px) */;
  margin: 0 auto;
  margin-top: 3.75rem /* 60px (基準16px) */;
}

.s .productArchive-narrow {
  width: 100%;
}

.productArchive-narrowSearchLead {
  color: #bb4953;
  line-height: 1.8;
  margin-bottom: 0.5rem /* 8px (基準16px) */;
}

.productArchive-narrowCategoriesAccordion {
  width: 100%;
}

.productArchive-narrowLead {
  color: #bb4953;
  display: flex;
  align-items: end;
  column-gap: 0.5rem /* 8px (基準16px) */;
  font-size: 1rem /* 16px (基準16px) */;
  padding-bottom: 0.75rem /* 12px (基準16px) */;
  border-bottom: 1px solid #bb4953;
}

.productArchive-narrowLead span {
  font-size: 0.5rem /* 8px (基準16px) */;
}

.productArchive-narrowCategories {
  margin-top: 1rem /* 16px (基準16px) */;
  display: flex;
  gap: 0.5rem /* 8px (基準16px) */;
  padding: 1.063rem /* 17px (基準16px) */ 0;
}

.s .productArchive-narrowCategories {
  flex-wrap: wrap;
  gap: 0.375rem /* 6px (基準16px) */;
}

.productArchive-narrowCategory {
  background-color: #fff;
  border: 1px solid #bb4953;
  border-radius: 1.25rem /* 20px (基準16px) */;
  color: #bb4953;
  padding: 0.375rem /* 6px (基準16px) */ 1rem /* 16px (基準16px) */;
}

.s .productArchive-narrowCategory {
  font-size: 0.813rem /* 13px (基準16px) */;
}

.productArchive-narrowCategory._selected {
  background-color: #bb4953;
  color: #fff;
}

.productArchive-Articles {
  margin: 0 auto;
  margin-top: 3.75rem /* 60px (基準16px) */;
  width: min(72.5rem /* 1160px (基準16px) */, 80.556vw /* 1160px (基準1440px) */);
  text-align: center;
}

.s .productArchive-Articles {
  width: 100%;
}

.productArchive-ArticlesNum {
  text-align: left;
  font-size: 0.813rem /* 13px (基準16px) */;
  color: #bb4953;
}

.productArchive-ArticleList {
  margin-top: 1.5rem /* 24px (基準16px) */;
  display: grid;
  grid-template-columns: repeat(auto-fit, 22.5rem /* 360px (基準16px) */);
  column-gap: 2.5rem /* 40px (基準16px) */;
  row-gap: 5rem /* 80px (基準16px) */;
  justify-content: center;
}

.s .productArchive-ArticleList {
  grid-template-columns: repeat(auto-fit, 12.188rem /* 195px (基準16px) */);
  flex-wrap: wrap;
  width: 100vw;
  margin-left: -5vw;
  row-gap: 2.5rem /* 40px (基準16px) */;
}

@media screen and (max-width: 425px) {
  .s .productArchive-ArticleList {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    row-gap: 2.5rem /* 40px (基準16px) */;
  }
}

/* @media screen and (max-width: 390px) {
  .s .productArchive-ArticleList {
    grid-template-columns: repeat(2, 1fr);
  }
} */

.productArchive .Pagination {
  margin-top: 3.75rem /* 60px (基準16px) */;
}

.productArchive .more-link {
  margin-top: 3.75rem /* 60px (基準16px) */;
}

.productArchive-other {
  width: min(45.25rem /* 724px (基準16px) */, 50.278vw /* 724px (基準1440px) */);
  margin: 0 auto;
  margin-top: 3.75rem /* 60px (基準16px) */;
}

.s .productArchive-other {
  width: 90%;
}

.productArchive-otherLead {
  line-height: 1.8;
}

.productArchive-otherLinks {
  display: flex;
  justify-content: space-between;
  margin-top: 1.625rem /* 26px (基準16px) */;
}

.s .productArchive-otherLinks {
  flex-direction: column;
  row-gap: 1.5rem /* 24px (基準16px) */;
}

.productArchive-otherLinks a {
  width: 48%;
  display: block;
}

.s .productArchive-otherLinks a {
  width: 100%;
}