@charset "UTF-8";
.l-container-wrap .l-container-wrap__body {
  padding-top: 0;
  padding-bottom: 0;
}

.p-page-brand__section {
  padding-bottom: 8rem;
}

.p-page-brand .cc-category-section {
  margin: 10rem 0;
}

.p-page-brand__section:has(+ .cc-category-section) {
  padding-bottom: 0;
}

.p-page-brand__keyvisual {
  overflow: hidden;
}

.p-page-brand__keyvisual img {
  width: 100%;
  height: auto;
  aspect-ratio: 375 / 600;
  object-fit: cover;
}

/* .p-page-brand__keyvisual-inner iframe {
  pointer-events: none;
} */

.p-page-brand__section-inner {
  position: relative;
  padding-top: 10rem;
}

.p-page-brand__section-inner::before,
.p-page-brand__section-inner::after {
  content: "";
  position: absolute;
  left: 0;
  z-index: -1;
  display: block;
  width: 100%;
}

.p-page-brand__section-inner::before {
  top: 0;
  background-color: #f5f5f5;
}

.p-page-brand__section-inner::after {
  height: 34rem;
  background-image:
    linear-gradient(
      to bottom,
      #efefef 0%,
      #f2f2f2 56.15%,
      #fff 100%
    );
}

.p-page-brand__logo {
  width: fit-content;
  height: 4.8rem;
  margin: 0 auto;
}

.p-page-brand__logo img {
  width: auto;
  height: 100%;
}

.p-page-brand__item-wrap {
  margin-top: 4rem;
}

.p-page-brand__item-wrap .splide__arrow {
  display: grid;
  place-content: center;
  width: 4.8rem;
  height: 4.8rem;
  background-color: rgb(75 75 75 / 0.7);
  opacity: 1;
}

.p-page-brand__item-wrap .splide__arrow--prev {
  display: none;
  left: 1.5rem;
}

.p-page-brand__item-wrap .splide__arrow--next {
  right: 1.5rem;
}

.p-page-brand__item-wrap .splide__arrow::before {
  content: "";
  width: 0.906rem;
  height: 1.671rem;
  background: center / contain no-repeat;
}

.p-page-brand__item-wrap .splide__arrow--prev::before {
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229.06%22%20height%3D%2216.705%22%20viewBox%3D%220%200%209.06%2016.705%22%3E%0A%20%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_23%22%20data-name%3D%22%E3%83%91%E3%82%B9%2023%22%20d%3D%22M88.953%2C112.222l-.707-.707%2C7.645-7.645-7.645-7.645.707-.707%2C8.353%2C8.353Z%22%20transform%3D%22translate(97.305%20112.221)%20rotate(180)%22%20fill%3D%22%23fff%22%2F%3E%0A%3C%2Fsvg%3E%0A');
}

.p-page-brand__item-wrap .splide__arrow--next::before {
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229.06%22%20height%3D%2216.705%22%20viewBox%3D%220%200%209.06%2016.705%22%3E%0A%20%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_23%22%20data-name%3D%22%E3%83%91%E3%82%B9%2023%22%20d%3D%22M88.953%2C112.222l-.707-.707%2C7.645-7.645-7.645-7.645.707-.707%2C8.353%2C8.353Z%22%20transform%3D%22translate(-88.245%20-95.516)%22%20fill%3D%22%23fff%22%2F%3E%0A%3C%2Fsvg%3E%0A');
}

.p-page-brand__item-inner {
  display: block;
}

.p-page-brand__item-image img {
  width: 60%;
  margin: 0 auto;
  transition: transform var(--transition-default);
}

@media (hover: hover) {
  .p-page-brand__item-inner:hover .p-page-brand__item-image img {
    transform: scale(1.1);
  }
}

.p-page-brand__item-name,
.p-page-brand__item-price {
  text-align: center;
  line-height: 1.3;
  letter-spacing: 0.01em;
}

.p-page-brand__item-name {
  margin-top: 1rem;
  font-size: 1.3rem;
}

.p-page-brand__item-name span {
  font-size: 1rem;
}

.p-page-brand__item-price {
  margin-top: 1.5rem;
  font-size: 1.3rem;
}

.p-page-brand__lead {
  width: var(--container-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
  text-align: center;
  letter-spacing: 0.01em;
}

.p-page-brand__lead > * + * {
  margin-top: 5rem;
}

.p-page-brand__lead .text-sm {
  font-size: 1.2rem;
}

.p-page-brand__sns {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5rem;
  width: var(--container-width);
  margin: 4rem auto 0;
  padding: 0 var(--container-padding);
}

.p-page-brand__sns-account {
  flex-shrink: 0;
}

.p-page-brand__sns-account :where(svg, img) {
  display: block;
  width: 100%;
  height: auto;
}

.p-page-brand__sns-account-link {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 0.2rem;
}

.p-page-brand__sns-account-logo {
  width: 4rem;
  margin: 0 auto;
}

.p-page-brand__sns-account-id {
  text-align: center;
}

@media (max-width: 767px) {
  .p-page-brand__section-inner::before {
    height: 26.7rem;
  }

  .p-page-brand__section-inner::after {
    top: 26.7rem;
  }

  .p-page-brand__item-wrap {
    padding-left: 1.1rem;
    padding-right: 0.5rem;
  }

  .p-page-brand__item {
    width: 12rem;
  }
  
  .p-page-brand__lead {
    margin-top: 8rem;
    font-size: 1.3rem;
    line-height: 2.3;
  }
}

@media (min-width: 768px) {
  .p-page-brand__section {
    padding-bottom: 12rem;
  }

  .p-page-brand__keyvisual img {
    aspect-ratio: 1400 / 600;
  }

  .p-page-brand__section-inner::before {
    height: 34rem;
  }

  .p-page-brand__section-inner::after {
    top: 34rem;
  }

  .p-page-brand__item-wrap {
    width: min(60rem, 600 *(100vw / 1400));
    margin-inline: auto;
  }

  .p-page-brand__item-wrap .splide__arrows {
    display: none;
  }
  
  .p-page-brand__item-list {
    display: flex !important;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 4rem min(4rem, 40 *(100vw / 1400));
  }

  .p-page-brand__item {
    width: min(12rem, 120 *(100vw / 1400));
  }

  .p-page-brand__lead {
    margin-top: 10rem;
    font-size: 1.6rem;
    line-height: 2.25;
  }
}