@charset "utf-8";

/* ════════════════════════════════════════════════════════════════
   inc-nss / editorial mode
   ────────────────────────────────────────────────────────────────
   PHP: /php/include/inc-nss/editorial.php
   CSS: /css/inc-nss/editorial.css

   mode와 layout은 분리합니다.
   - mode=editorial : 헤더, tone, 상품 카드 표면, 탭 표현
   - layout          : scroll(기본), 2dan, rank, wide, promo

   이 파일은 showcase 전용이 아닙니다. inc-nss.php를 사용하는 홈/이벤트 등
   다른 페이지에서도 mode=editorial과 함께 재사용할 수 있습니다.
═══════════════════════════════════════════════════════════════════ */

/* 공용 editorial NSS */
.c-nss--editorial:not(.c-nss--tabs) {
  --nss-ed-paper: #fbfaf7;
  --nss-ed-ink: #151817;
  --nss-ed-sub: #666b68;
  --nss-ed-accent: #1b5a4e;
  --nss-ed-line: rgba(21, 24, 23, .11);
  margin: 10px 0 0;
  padding: 30px 0 40px;
  overflow: hidden;
  background: var(--nss-ed-paper);
}
.c-nss--editorial:not(.c-nss--tabs).is-tone-paper { background: #fbfaf7; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-white { background: #fff; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-ivory { background: #f7f4ec; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-sand  { background: #ece5d8; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-mint  { background: #dfece7; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-sage  { background: #eef3ef; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-blue  { background: #e1eaf0; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-mist  { background: #eef1f7; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-rose     { background: #f2e3e5; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-lavender { background: #e9e5f0; }
.c-nss--editorial:not(.c-nss--tabs).is-tone-slate    { background: #e5e9ec; }

.c-nss--editorial:not(.c-nss--tabs) .c-nss-container {
  padding: 0 16px;
}

.c-nss-editorial__head {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
  margin-bottom: 18px;
}
.c-nss-editorial__head.is-no-number {
  grid-template-columns: minmax(0, 1fr) auto;
}
.c-nss-editorial__head.is-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.c-nss-editorial__head.is-link:active { opacity: .72; }
.c-nss-editorial__head.is-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.c-nss-editorial__number {
  padding-top: 4px;
  color: #888e8a;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
}
.c-nss-editorial__eyebrow {
  display: block;
  margin-bottom: 7px;
  color: var(--nss-ed-accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .15em;
}
.c-nss-editorial__title {
  margin: 0;
  color: var(--nss-ed-ink);
  font-size: 25px;
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -1.05px;
}
.c-nss-editorial__title small {
  font-size: .55em;
  font-weight: 700;
}
.c-nss-editorial__desc {
  max-width: 430px;
  margin: 9px 0 0;
  color: var(--nss-ed-sub);
  font-size: 12px;
  line-height: 1.6;
}
.c-nss-editorial__more {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding-top: 3px;
  color: #505652;
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
}
.c-nss-editorial__more span:last-child { font-size: 15px; }

.c-nss-editorial__rail {
  display: flex;
  gap: 12px;
  padding: 0 16px 3px;
  margin: 0 -16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 16px;
  scroll-padding-inline-start: 16px;
  scrollbar-width: none;
}
.c-nss-editorial__rail::-webkit-scrollbar { display: none; }

/* 일반 editorial 상품 레일 끝의 보조 더보기 타일.
   - moreUrl이 있으면 헤더 전체가 링크이며 우측 '전체' 표시는 유지
   - 일반 상품 카드보다 좁고 상품 이미지 높이에 맞춘 작은 end-cap
   - moreUrl이 있고 moreCard가 true일 때만 inc-nss/editorial.php에서 출력 */
.c-nss-editorial__more-card {
  flex: 0 0 84px;
  align-self: flex-start;
  display: flex;
  min-height: clamp(133px, 37.44vw, 156px);
  padding: 14px 10px;
  border: 1px solid var(--nss-ed-line);
  border-radius: 18px;
  background: rgba(255,255,255,.38);
  color: #505652;
  box-sizing: border-box;
  text-decoration: none;
  scroll-snap-align: start;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.c-nss-editorial__more-card span {
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
  white-space: nowrap;
}
.c-nss-editorial__more-card i {
  color: var(--nss-ed-accent);
  font-size: 18px;
  font-style: normal;
  line-height: 1;
}
.c-nss-editorial__more-card:active {
  background: rgba(255,255,255,.62);
  transform: scale(.98);
}

/* 일반 NSS(125px)보다 조금 크게, lead 카드만 한 단계 강조합니다. */
.c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial {
  flex: 0 0 clamp(128px, 36vw, 150px);
  width: auto;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--nss-ed-ink);
  scroll-snap-align: start;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial-lead {
  flex-basis: clamp(168px, 52vw, 210px);
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__img {
  aspect-ratio: 1 / 1.04;
  overflow: hidden;
  border-radius: 18px;
  background: rgba(255,255,255,.68);
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial-lead .c-gc__img {
  aspect-ratio: 1 / 1.1;
  border-radius: 21px;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .22s ease;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial:active .c-gc__img img {
  transform: scale(.98);
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__body {
  padding: 12px 2px 0;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__brand {
  display: block;
  margin-bottom: 3px;
  color: #858b87;
  font-size: 9px;
  font-weight: 700;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__name {
  display: -webkit-box;
  min-height: 35px;
  margin: 0;
  overflow: hidden;
  color: var(--nss-ed-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.35px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial-lead .c-gc__name {
  min-height: auto;
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: -.65px;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__price {
  display: flex;
  align-items: baseline;
  gap: 5px;
  margin-top: 4px;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__rate {
  color: var(--nss-ed-accent);
  font-size: 12px;
  font-weight: 900;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__sale {
  color: var(--nss-ed-ink);
  font-size: 15px;
  font-weight: 800;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial-lead .c-gc__sale { font-size: 16px; }
.c-nss--editorial:not(.c-nss--tabs) .c-gc__sale small { font-size: .72em; }
.c-nss--editorial:not(.c-nss--tabs) .c-gc__point {
  margin-top: 2px;
  color: #6b726e;
  font-size: 9px;
}
.c-nss--editorial:not(.c-nss--tabs) .c-gc__soldout {
  background: rgba(21,24,23,.62);
}


@media (min-width: 720px) {
  .c-nss--editorial:not(.c-nss--tabs) .c-nss-container {
    padding-left: 24px;
    padding-right: 24px;
  }
  .c-nss--editorial:not(.c-nss--tabs) .c-nss-editorial__rail {
    padding-left: 24px;
    padding-right: 24px;
    margin-left: -24px;
    margin-right: -24px;
    scroll-padding-left: 24px;
    scroll-padding-inline-start: 24px;
  }
  .c-nss--editorial:not(.c-nss--tabs) .c-nss-editorial__more-card {
    flex-basis: 88px;
    min-height: 156px;
  }
  /*
   * PC 일반 카드 규칙은 lead 카드를 제외해야 합니다.
   * :not(.c-gc--wide)만 사용하면 이 선택자의 우선순위가 lead 규칙보다 높아져
   * 720px 이상에서 lead 카드도 일반 카드 폭(150px)으로 되돌아갑니다.
   */
  .c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial:not(.c-gc--wide):not(.c-gc--editorial-lead) {
    flex-basis: 150px;
  }
  .c-nss--editorial:not(.c-nss--tabs) .c-gc--editorial.c-gc--editorial-lead {
    flex-basis: 220px;
  }
}


/* --------------------------------------------------------------------------
   Editorial tabbedNss
   --------------------------------------------------------------------------
   mode=editorial인 tabbedNss에 붙는 공용 스킨입니다.

   layout(scroll/2dan/rank/wide)은 배치 의미를 유지하고,
   이 영역에서는 카드 표면·간격·타이포만 editorial 톤으로 바꿉니다.
   -------------------------------------------------------------------------- */
.c-nss.c-nss--tabs.c-nss--editorial {
  --nss-ed-paper: #fff;
  --nss-ed-ink: #151817;
  --nss-ed-sub: #666b68;
  --nss-ed-accent: #1b5a4e;
  --nss-ed-line: rgba(21, 24, 23, .11);
  margin: 10px 0 0;
  padding: 38px 0 48px;
  overflow: hidden;
  background: var(--nss-ed-paper);
}
.c-nss--tabs.c-nss--editorial.is-tone-paper { background: #fbfaf7; }
.c-nss--tabs.c-nss--editorial.is-tone-white { background: #fff; }
.c-nss--tabs.c-nss--editorial.is-tone-ivory { background: #f7f4ec; }
.c-nss--tabs.c-nss--editorial.is-tone-sand  { background: #ece5d8; }
.c-nss--tabs.c-nss--editorial.is-tone-mint  { background: #dfece7; }
.c-nss--tabs.c-nss--editorial.is-tone-sage  { background: #eef3ef; }
.c-nss--tabs.c-nss--editorial.is-tone-blue  { background: #e1eaf0; }
.c-nss--tabs.c-nss--editorial.is-tone-mist  { background: #eef1f7; }
.c-nss--tabs.c-nss--editorial.is-tone-rose     { background: #f2e3e5; }
.c-nss--tabs.c-nss--editorial.is-tone-lavender { background: #e9e5f0; }
.c-nss--tabs.c-nss--editorial.is-tone-slate    { background: #e5e9ec; }

.c-nss--tabs.c-nss--editorial .c-nss-container {
  padding: 0 16px;
}
.c-nss--tabs.c-nss--editorial .c-nss-head {
  align-items: flex-end;
  margin-bottom: 18px;
  padding: 0;
}
.c-nss--tabs.c-nss--editorial .c-nss__title {
  max-width: 240px;
  margin: 0;
  color: var(--nss-ed-ink);
  font-size: 25px;
  font-weight: 850;
  line-height: 1.2;
  letter-spacing: -1px;
}
.c-nss--tabs.c-nss--editorial .c-nss__more {
  color: #505652;
  font-size: 10px;
  font-weight: 800;
}

/* number / eyebrow / desc / more는 일반 editorial NSS의 헤더 구조를 그대로 공유합니다. */
.c-nss--tabs.c-nss--editorial .c-nss-editorial__head {
  margin-bottom: 18px;
}
.c-nss--tabs.c-nss--editorial .c-nss-editorial__title {
  max-width: 310px;
}

/* home-v3 계열: pill 대신 얇은 기준선 + 활성 밑줄 */
.c-nss--tabs.c-nss--editorial .c-nss-tabs__nav {
  gap: 0;
  margin: 0 0 17px;
  padding: 0;
  border-bottom: 1px solid var(--nss-ed-line);
  scroll-padding-left: 0;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__btn {
  min-height: 40px;
  padding: 0 14px 7px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #858b87;
  font-size: 11px;
  font-weight: 700;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__btn.is-active,
.c-nss--tabs.c-nss--editorial .c-nss-tabs__btn[aria-selected="true"] {
  border-bottom-color: var(--nss-ed-accent);
  background: transparent;
  color: var(--nss-ed-ink);
}
/* editorial 탭: 현재 탭의 더보기는 상품 영역 오른쪽에 텍스트 링크로 표시 */
.c-nss--tabs.c-nss--editorial .c-nss-tabs__panel:not([hidden]) {
  display: flex;
  flex-direction: column;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__panel-more {
  order: 2;
  display: flex;
  justify-content: flex-end;
  margin: 20px 0 0;
  padding: 0 2px;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__panel-more a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #505652;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.4;
  text-decoration: none;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__panel-more a:active {
  color: var(--nss-ed-accent);
}

/* lead=true: 큰 카드보다 아래로 내려가지 않고 패널 우측 하단선에 맞춥니다. */
.c-nss--tabs.c-nss--editorial .c-nss-tabs__panel.has-lead {
  position: relative;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__panel.has-lead .c-nss-tabs__panel-more {
  position: absolute;
  right: 2px;
  bottom: 2px;
  z-index: 2;
  margin: 0;
  padding: 0;
}

/* 상품 프레임은 일반 editorial NSS와 같은 규격을 공유합니다. */
.c-nss--tabs.c-nss--editorial .c-nss-wrapper {
  order: 1;
  gap: 12px;
  margin: 0 -16px;
  padding: 0 16px;
  scroll-padding-left: 16px;
}

/* 상품 레일 끝의 보조 더보기 타일.
   - 기존 패널 하단 텍스트 더보기는 그대로 유지
   - 상품 카드보다 좁고 이미지 높이에 맞춘 작은 end-cap
   - 2dan은 구조상 렌더링하지 않고 scroll/rank/wide에만 사용 */
.c-nss--tabs.c-nss--editorial .c-nss-tabs__more-card {
  flex: 0 0 84px;
  align-self: flex-start;
  display: flex;
  min-height: clamp(133px, 37.44vw, 156px);
  padding: 14px 10px;
  border: 1px solid var(--nss-ed-line);
  border-radius: 18px;
  background: rgba(255,255,255,.38);
  color: #505652;
  box-sizing: border-box;
  text-decoration: none;
  scroll-snap-align: start;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__more-card span {
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
  white-space: nowrap;
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__more-card i {
  font-size: 18px;
  line-height: 1;
  font-style: normal;
  color: var(--nss-ed-accent);
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__more-card:active {
  background: rgba(255,255,255,.62);
  transform: scale(.98);
}
.c-nss--tabs.c-nss--editorial .c-nss-tabs__more-card.is-wide {
  flex-basis: 112px;
  min-height: 142px;
  border-radius: 18px;
}
.c-nss--tabs.c-nss--editorial .c-nss__card.c-gc {
  flex: 0 0 clamp(128px, 36vw, 150px);
  width: auto;
  min-width: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--nss-ed-ink);
}
.c-nss--tabs.c-nss--editorial .c-gc__img {
  aspect-ratio: 1 / 1.04;
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  background: rgba(255,255,255,.68);
}
.c-nss--tabs.c-nss--editorial .c-gc__img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .22s ease;
}
.c-nss--tabs.c-nss--editorial .c-nss__card.c-gc:active .c-gc__img img {
  transform: scale(.98);
}
.c-nss--tabs.c-nss--editorial .c-gc__body {
  padding: 12px 2px 0;
}
.c-nss--tabs.c-nss--editorial .c-gc__brand {
  display: block;
  margin-bottom: 3px;
  color: #858b87;
  font-size: 9px;
  font-weight: 700;
}
.c-nss--tabs.c-nss--editorial .c-gc__name {
  min-height: 35px;
  color: var(--nss-ed-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.35px;
}
.c-nss--tabs.c-nss--editorial .c-gc__price {
  gap: 5px;
  margin-top: 4px;
}
.c-nss--tabs.c-nss--editorial .c-gc__rate {
  color: var(--nss-ed-accent);
  font-size: 12px;
  font-weight: 900;
}
.c-nss--tabs.c-nss--editorial .c-gc__sale {
  color: var(--nss-ed-ink);
  font-size: 15px;
  font-weight: 800;
}
.c-nss--tabs.c-nss--editorial .c-gc__point {
  color: #6b726e;
  font-size: 9px;
}
.c-nss--tabs.c-nss--editorial .c-gc__soldout {
  background: rgba(21,24,23,.62);
}

/* lead=true는 scroll/default 탭의 첫 상품에만 적용합니다. */
.c-nss--tabs.c-nss--editorial .c-nss__card.c-gc--editorial-lead {
  flex-basis: clamp(168px, 52vw, 210px);
}
.c-nss--tabs.c-nss--editorial .c-gc--editorial-lead .c-gc__img {
  aspect-ratio: 1 / 1.1;
  border-radius: 21px;
}
.c-nss--tabs.c-nss--editorial .c-gc--editorial-lead .c-gc__name {
  min-height: auto;
  font-size: 18px;
  line-height: 1.35;
  letter-spacing: -.65px;
}
.c-nss--tabs.c-nss--editorial .c-gc--editorial-lead .c-gc__sale {
  font-size: 18px;
}

/* 2dan: 2줄 구조는 유지하고 카드 규격은 일반 editorial과 맞춤 */
.c-nss--tabs.c-nss--editorial .c-nss-wrapper--2dan {
  grid-auto-columns: clamp(128px, 36vw, 150px);
  column-gap: 12px;
  row-gap: 18px;
}
.c-nss--tabs.c-nss--editorial .c-nss-wrapper--2dan .c-nss__card.c-gc {
  width: clamp(128px, 36vw, 150px);
}

/* rank: 기존 순위 의미는 유지하고 배지만 편집형으로 정리 */
.c-nss--tabs.c-nss--editorial .c-gc__rank {
  top: 10px;
  left: 10px;
  min-width: 28px;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 50%;
  background: rgba(21,24,23,.88);
  font-size: 11px;
  box-shadow: none;
}
.c-nss--tabs.c-nss--editorial .c-gc--rank .c-gc__soldout {
  top: 42px;
}

/* wide: 가로형 구조는 유지하되 한 장의 editorial 카드처럼 표현 */
.c-nss--tabs.c-nss--editorial .c-nss__card.c-gc--wide {
  flex-basis: clamp(270px, 78vw, 320px);
  min-height: 142px;
  flex-direction: row;
  overflow: hidden;
  border-radius: 18px;
  background: rgba(255,255,255,.68);
}
.c-nss--tabs.c-nss--editorial .c-gc--wide .c-gc__img {
  width: 122px;
  flex: 0 0 122px;
  min-height: 142px;
  aspect-ratio: auto;
  border-radius: 0;
  background: rgba(255,255,255,.52);
}
.c-nss--tabs.c-nss--editorial .c-gc--wide .c-gc__body {
  flex: 1 1 auto;
  justify-content: center;
  padding: 15px 14px 13px;
}
.c-nss--tabs.c-nss--editorial .c-gc--wide .c-gc__name {
  min-height: auto;
  -webkit-line-clamp: 3;
}

@media (min-width: 720px) {
  .c-nss--tabs.c-nss--editorial .c-nss-container {
    padding-left: 24px;
    padding-right: 24px;
  }
  .c-nss--tabs.c-nss--editorial .c-nss-wrapper {
    margin-left: -24px;
    margin-right: -24px;
    padding-left: 24px;
    padding-right: 24px;
    scroll-padding-left: 24px;
  }
  .c-nss--tabs.c-nss--editorial .c-nss-tabs__more-card {
    flex-basis: 88px;
    min-height: 156px;
  }
  .c-nss--tabs.c-nss--editorial .c-nss-tabs__more-card.is-wide {
    flex-basis: 116px;
    min-height: 142px;
  }
  /*
   * wide 카드는 270~320px 가로형 폭을 유지하고, 일반/랭킹 카드만 150px로 맞춥니다.
   * lead 카드를 일반 카드 selector에서 제외하지 않으면 선택자 우선순위 때문에
   * PC 구간에서 lead 폭(220px)이 적용되지 않습니다.
   */
  .c-nss--tabs.c-nss--editorial .c-nss__card.c-gc:not(.c-gc--wide):not(.c-gc--editorial-lead) {
    flex-basis: 150px;
  }
  .c-nss--tabs.c-nss--editorial .c-nss__card.c-gc.c-gc--editorial-lead {
    flex-basis: 220px;
  }
}



/* ────────────────────────────────────────────────────────────────
   Standalone editorial + layout 조합
   ──────────────────────────────────────────────────────────────── */
.c-nss--editorial:not(.c-nss--tabs).is-layout-2dan .c-nss-editorial__rail {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(2, auto);
  grid-auto-columns: clamp(128px, 36vw, 150px);
  column-gap: 12px;
  row-gap: 18px;
}
.c-nss--editorial:not(.c-nss--tabs).is-layout-2dan .c-nss__card.c-gc {
  width: clamp(128px, 36vw, 150px);
}
.c-nss--editorial:not(.c-nss--tabs).is-layout-rank .c-gc__rank {
  top: 10px;
  left: 10px;
  min-width: 28px;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 50%;
  background: rgba(21,24,23,.88);
  font-size: 11px;
  box-shadow: none;
}
.c-nss--editorial:not(.c-nss--tabs).is-layout-rank .c-gc--rank .c-gc__soldout {
  top: 42px;
}
.c-nss--editorial:not(.c-nss--tabs).is-layout-wide .c-nss__card.c-gc--wide {
  flex-basis: clamp(270px, 78vw, 320px);
  min-height: 142px;
  flex-direction: row;
  overflow: hidden;
  border-radius: 18px;
  background: rgba(255,255,255,.68);
}
.c-nss--editorial:not(.c-nss--tabs).is-layout-wide .c-gc--wide .c-gc__img {
  width: 122px;
  flex: 0 0 122px;
  min-height: 142px;
  aspect-ratio: auto;
  border-radius: 0;
  background: rgba(255,255,255,.52);
}
.c-nss--editorial:not(.c-nss--tabs).is-layout-wide .c-gc--wide .c-gc__body {
  flex: 1 1 auto;
  justify-content: center;
  padding: 15px 14px 13px;
}
.c-nss--editorial:not(.c-nss--tabs).is-layout-wide .c-gc--wide .c-gc__name {
  min-height: auto;
  -webkit-line-clamp: 3;
}
.c-nss--editorial:not(.c-nss--tabs) .c-nss-editorial__more-card.is-wide {
  flex-basis: 112px;
  min-height: 142px;
}

@media (min-width: 720px) {
  .c-nss--editorial:not(.c-nss--tabs) .c-nss-editorial__more-card.is-wide {
    flex-basis: 116px;
  }
}