/* --------------------------------------------------
Contents
-------------------------------------------------- */
.contents { padding: 8.5rem 0 0; }
.contents__title { font-size: 2.2rem; margin: 0 0 4rem; }

.stockist__contents { padding: 0 var(--padding-base); }
.stockist__contentsList { display: flex; flex-wrap: wrap; column-gap: 1rem; row-gap: 1rem; }
.stockist__contentsListItem { width: calc((100% - 1rem) / 2); border: 0.2rem solid; background: var(--white-color); aspect-ratio: 284 / 135; }
.stockist__contentsListItem img { height: 100%; object-fit: contain; object-position: center; }
.stockist__popup { position: fixed; height: calc(calc(var(--vh) * (1 * 100)) - 9rem); left: calc(var(--padding-base) * 2); right: calc(var(--padding-base) * 2); top: 7rem; border: 0.2rem solid; z-index: 3; background: var(--white-color); overflow: auto; display: none; }
.stockist__popupInner { position: relative; padding: 2rem 0 6rem; }
.stockist__popupClose { width: 4.6rem; position: absolute; right: 0; top: 0; }
.stockist__popupCloseLink { aspect-ratio: 1; display: flex; justify-content: center; align-items: center; }
.stockist__popupCloseIcon { width: 2.6rem; }

@media screen and (min-width: 768px) { .contents { padding: 13.5rem 0 0; }
  .contents__title { font-size: 3rem; margin: 0 0 5.5rem; }
  .stockist__contents { padding: 0; width: 100.6rem; max-width: 96%; margin: 0 auto; }
  .stockist__contentsList { column-gap: 2rem; row-gap: 2rem; }
  .stockist__contentsListItem { width: calc((100% - 4rem) / 3); }
  .stockist__popup { height: calc(calc(var(--vh) * (1 * 100)) - 10rem); width: 106.6rem; max-width: 96%; margin: 0 auto; left: 0; right: 0; top: 8rem; }
  .stockist__popupInner { padding: 6.5rem 0; }
  .stockist__popupClose { width: 6.6rem; } }