@charset "utf-8";

.members__section {}
.members__section .section__header {
  display: flex;
  flex-direction: column;
  margin-bottom: calc(40 * var(--vw-400));
  color: #373B32;
  text-align: center;
}
.members__section .section__title {
  font-size: calc(26 * var(--vw-400));
  font-weight: 900;
  line-height: 1.4;
  letter-spacing: -0.05em;
}
.members__section .section__desc {
  margin-top: calc(16 * var(--vw-400));
}

.members__content--coupon {
  padding: calc(60 * var(--vw-400)) 0;
}

.members__content--event {
  padding: calc(60 * var(--vw-400)) 0 calc(40 * var(--vw-400));
}
.members__content--event .event__list--column {
  display: flex;
  flex-direction: column;
  padding: 0 calc(16 * var(--vw-400));
  gap: calc(30 * var(--vw-400));
}
.members__content--event .event__list--column .event__list-item {
  display: flex;
  gap: calc(16 * var(--vw-400));
  width: 100%;
  margin: 0;
}
.members__content--event .event__list--column .event__thumb {
  flex: 0 0 calc(150 * var(--vw-400));
  max-width: calc(150 * var(--vw-400));
  margin-bottom: 0;
}
.members__content--event .event__list--column .event__thumb + div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-bottom: calc(4 * var(--vw-400));
}
.members__content--event .event__list--column .event__title {
  font-size: calc(16 * var(--vw-400));
}
.members__content--event .event__list--column .event__title .font--en {
  font-size: calc(18 * var(--vw-400));
}
.members__content--event .event__list--column .event__btn {
  margin-top: auto;
}
.members__content--event .event__list--column .event__badge .badge {
  padding: calc(4 * var(--vw-400)) calc(5 * var(--vw-400)) calc(2 * var(--vw-400)) calc(25 * var(--vw-400));
}

/* ================================================================
 * 첫구매 기획전 (First.jsp) :: S
 * "첫 구매 고객 혜택" 섹션 — Welcome Coupon + Members Week Event
 * ================================================================ */

/* 첫구매 — 섹션 공통 */
.members__content--first {
  background-color: #BCBFC1;
  padding: calc(60 * var(--vw-400)) calc(16 * var(--vw-400));
  text-align: center;
}
.members__content--first .section__label {
  font-size: calc(16 * var(--vw-400));
  line-height: calc(26 * var(--vw-400));
  letter-spacing: -0.05em;
  color: #fff;

}

/* 첫구매 — 그룹 (Welcome Coupon / Members Week Event) */
.members__content--first .first__group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(20 * var(--vw-400));
  margin-top: calc(40 * var(--vw-400));
}
.members__content--first .first__group-title {
  font-size: calc(18 * var(--vw-400));
  font-weight: 700;
  line-height: calc(26 * var(--vw-400));
  color: #373B32;
}

/* 첫구매 — Welcome Coupon 카드 (실제 마크업은 .coupon__item / .coupon__info / .coupon__status 사용) */
/* iOS Safari sub-pixel overflow 차단을 위해 부모 overflow:hidden + flex 폭 미세 보정 */
.members__content--first .coupon__item {
  width: 100%;
}
.members__content--first .coupon__info {
  flex: 1 1 auto;
  min-width: 0;
  max-width: calc(279 * var(--vw-400));
}
.members__content--first .first__coupon--disabled {
  opacity: 0.5;
  pointer-events: none;
}

/* 첫구매 — Members Week Event 카드 리스트 */
.members__content--first .first__event-list {
  display: flex;
  flex-direction: column;
  gap: calc(10 * var(--vw-400));
  width: 100%;
}
.members__content--first .first__event-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: calc(20 * var(--vw-400));
  background-color: #FFFFFF;
  text-align: left;
}
.members__content--first .first__event-thumb {
  flex-shrink: 0;
  width: calc(120 * var(--vw-400));
  height: calc(120 * var(--vw-400));
  margin: 0;
}
.members__content--first .first__event-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.members__content--first .first__event-info {
  display: flex;
  flex-direction: column;
  gap: calc(4 * var(--vw-400));
}
.members__content--first .first__event-title {
  font-size: calc(18 * var(--vw-400));
  font-weight: 700;
  line-height: calc(28 * var(--vw-400));
  letter-spacing: -0.05em;
  color: #373B32;
}
.members__content--first .first__event-desc {
  font-size: calc(16 * var(--vw-400));
  line-height: calc(22 * var(--vw-400));
  letter-spacing: -0.05em;
  color: #373B32;
}
/* 네이버혜택 종료 케이스 :: S */
.members__content--first .first__event-item.end::after {
  content: '모두 소진되었습니다.';
  z-index: 1;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.70);
  font-size: calc(24 * var(--vw-400));
  font-weight: 900;
  letter-spacing: calc(-1.2 * var(--vw-400));
  color: #fff;
}
/* 네이버혜택 종료 케이스 :: E */

/* 첫구매 — 유의사항 링크 */
.members__content--first .first__notice {
  display: inline-block;
  margin-top: calc(40 * var(--vw-400));
  padding: 0;
  background: none;
  border: 0;
  font-size: calc(14 * var(--vw-400));
  letter-spacing: -0.05em;
  line-height: 1;
  color: #727272;
  text-decoration: underline;
  cursor: pointer;
  font-weight: 700;
}

/* 첫구매 — 카테고리별 추천 상품 */
.members__section--category {
  padding: 0!important;
  margin-top: calc(70 * var(--vw-400)) !important;
}
/* 카테고리 탭 메뉴 — 가로 스크롤 (탭 6개 → 화면 폭 초과 방지) */
.members__section--category .members__tab {
  display: flex;
  flex-wrap: nowrap;
  gap: calc(8 * var(--vw-400));
  justify-content: flex-start;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 calc(16 * var(--vw-400));
}
.members__section--category .members__tab::-webkit-scrollbar {
  display: none;
}
.members__section--category .members__tab .tab {
  flex-shrink: 0;
}
/* 카테고리 — CSS grid 2행 × N열 + 가로 스크롤 (column-flow로 항상 2줄 보장) */
/* 순서: 카드 1,3,5,7,9 → 1행 / 카드 2,4,6,8,10 → 2행 */
.members__section--category .category__list {
  display: grid;
  grid-template-rows: repeat(2, auto);
  grid-auto-flow: column;
  grid-auto-columns: calc(160 * var(--vw-400));
  column-gap: calc(8 * var(--vw-400));
  row-gap: calc(20 * var(--vw-400));
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 calc(16 * var(--vw-400));
}
.members__section--category .category__list::-webkit-scrollbar {
  display: none;
}
.members__section--category .category__thumb {
  width: 100%;
  aspect-ratio: 1 / 1;
  background-color: #E5E5E5;
  overflow: hidden;
  margin: 0;
}
.members__section--category .category__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.members__section--category .category__title {
  margin-top: calc(10 * var(--vw-400));
  font-size: calc(14 * var(--vw-400));
  line-height: 1.5;
  letter-spacing: calc(-0.3 * var(--vw-400));
  color: #373B32;
}
.members__section--category .category__price {
  margin-top: calc(6 * var(--vw-400));
  color: #373B32;
}
.members__section--category .category__price .origin {
  display: block;
  font-size: calc(14 * var(--vw-400));
  line-height: calc(15 * var(--vw-400));
  color: #BCBFC1;
  text-decoration: line-through;
}
.members__section--category .category__price .discount {
  font-size: calc(16 * var(--vw-400));
  font-weight: 700;
  color: #B81821;
  margin-right: calc(8 * var(--vw-400));
}
.members__section--category .category__price .price {
  font-size: calc(16 * var(--vw-400));
  font-weight: 700;
  color: #373B32;
}
/* 카테고리 — 더 보러가기 버튼 */
.members__section--category .members__btns {
  display: flex;
  justify-content: center;
  margin-top: calc(40 * var(--vw-400));
  padding: 0 calc(20 * var(--vw-400));
}

/* ================================================================
 * 첫구매 기획전 (First.jsp) :: E
 * ================================================================ */