
/* 페이지 컨테이너 — 왼쪽 사이드바 없음(요구사항). 기존 .sub_con_wrapC 는 항상 aside 를 전제로
   #content 폭을 calc(100% - 332px) 로 잡아서 이 페이지엔 그대로 못 쓴다(사이드바 없이는 좌측이 빈다) —
   그래서 시각 언어(상단 여백·구분선·본문 최대폭)만 그대로 옮겨 자체 래퍼로 둔다. */
.clip_wrap[data-v-2b7aa748] {
  position: relative;
  margin-top: 120px; /* PC 헤더 높이(layout.css · 2026-10-12 130→120) */
  border-top: 1px solid #1D1E20;
}
.clip_wrap #content[data-v-2b7aa748] {
  margin: 0 auto;
  padding: 80px 40px;
  max-width: 1340px;
  width: 100%;
}
@media (max-width: 950px) {
.clip_wrap[data-v-2b7aa748] { margin-top: 14.4rem;
}
  /* padding-top 3.2rem — 표준 후기 목록(videoReview.vue 등)이 #lnb_my(아래 2차메뉴 탭) 아래에 두는
     여백(aside_full #content padding-top 3.2rem)을 실측 이식. 탭이 위로 옮겨진 만큼 제목 위 공간을
     맞춰야 제목 위치가 다른 목록 페이지와 같아 보인다(직접 대조 확인 — 아래 §검증 참고). */
.clip_wrap #content[data-v-2b7aa748] { padding: 3.2rem 4.8rem 8rem; width: 100%;
}
}
.title[data-v-2b7aa748] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
}
.clip_title_ico[data-v-2b7aa748] { display: inline-flex; align-items: center; flex: 0 0 auto;
}

/* 카테고리 2차메뉴 — asideReview.vue 가 모바일 폭에서 렌더링하는 밑줄 탭(#lnb_my .lnb_menu.lnb_tabs,
   layout.css 약 467~480행)과 동일한 시각 언어(활성=흰색 굵게+하단 흰 밑줄바, 비활성=흐린 회색, 하단
   전체폭 구분선). 그 CSS는 모바일 전용 미디어쿼리 안에만 있어 PC 엔 적용되지 않는데, 이 페이지는
   좌측 사이드바가 없어 PC도 같은 탭 형태를 그대로 쓴다 — 모바일 rem 값을 그대로 px 로 옮기지 않고
   PC 폭에 어울리는 크기로 재조정했다(실측 대조: /reviews 모바일 폭 렌더링 vs 이 블록, 2026-08-11).
   구분선은 GNB 바로 아래 폭 전체(.clip_wrap 상단 구분선과 동일하게 풀블리드), 탭 목록만 본문 폭
   (1340px)에 맞춰 정렬. 우측 여백은 스크롤 끝까지 0 — scroll-snap 미사용(마지막 탭이 잘려 보이지 않게). */
.clip_tabs[data-v-2b7aa748] {
  position: relative;
  border-bottom: 1px solid #282A2C;
}
.clip_tabs ul[data-v-2b7aa748] {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 48px;
  max-width: 1340px;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 0 40px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  box-sizing: border-box;
}
.clip_tabs ul[data-v-2b7aa748]::-webkit-scrollbar { display: none;
}
.clip_tabs li[data-v-2b7aa748] { flex: 0 0 auto;
}
.clip_tabs button[data-v-2b7aa748] {
  position: relative;
  display: block;
  padding: 18px 0;
  font-size: 15px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.36);
  white-space: nowrap;
  transition: color 0.2s;
}
.clip_tabs button[data-v-2b7aa748]:hover { color: rgba(255, 255, 255, 0.7);
}
.clip_tabs li.on button[data-v-2b7aa748] { color: #fff; font-weight: 700;
}
/* 밑줄 인디케이터 — 활성 탭 아래 흰 바가 위 border-bottom 라인 위에 겹쳐 앉는다(모바일 정본과 동일 비율). */
.clip_tabs li.on button[data-v-2b7aa748]::after {
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 2px;
  content: '';
  background-color: #fff;
  border-radius: 2px 2px 0 0;
}
@media (max-width: 950px) {
.clip_tabs[data-v-2b7aa748] { margin-bottom: 6rem;
}
.clip_tabs ul[data-v-2b7aa748] { max-width: none; gap: 6.4rem; padding: 0 0 0 4.8rem;
}
.clip_tabs button[data-v-2b7aa748] { padding: 2.8rem 0; font-size: 2.6rem;
}
.clip_tabs li.on button[data-v-2b7aa748]::after { bottom: -0.2rem; height: 0.4rem; border-radius: 0.2rem 0.2rem 0 0;
}
}

/* 유튜브 채널 쇼츠 탭처럼 — PC 5열 */
.review_clip ul[data-v-2b7aa748] {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.review_clip ul li[data-v-2b7aa748] {
  width: calc((100% - 24px * 4) / 5);
}
/* 태블릿 — 3열 */
@media (max-width: 1200px) {
.review_clip ul li[data-v-2b7aa748] { width: calc((100% - 24px * 2) / 3);
}
}
.review_clip .photo.photo_portrait[data-v-2b7aa748] {
  position: relative;
  aspect-ratio: 9 / 16;
  border-radius: 8px;
  overflow: hidden;
  background: #000;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.review_clip .photo.photo_portrait img[data-v-2b7aa748] {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.review_clip .infor[data-v-2b7aa748] {
  padding: 10px 2px 0;
}
/* 제목 — 카드 하단 주 정보 (조회수 표기 제거됨, 제목만 노출). 최대 2줄까지 표시 후 말줄임. */
.review_clip .infor .tit[data-v-2b7aa748] {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: 14px;
  line-height: 1.4;
  opacity: 0.85;
  overflow: hidden;
}
.clip_empty[data-v-2b7aa748] {
  padding: 80px 0;
  text-align: center;
  opacity: 0.5;
}
/* 모바일 — 2~3열 (좁은 화면 2열) */
@media (max-width: 640px) {
.review_clip ul[data-v-2b7aa748] { gap: 14px;
}
.review_clip ul li[data-v-2b7aa748] { width: calc((100% - 14px) / 2);
}
}

