/* ================================================
   sw_bbs1 - 스와이퍼 게시판 카드 위젯 (탭 ON/OFF)
   ================================================ */

/* full-right 모드 가로 스크롤 방지 */
.bbstab4 {
  overflow-x: clip;
}

/* 헤더 영역 (타이틀 + 더보기) */
.sw_bbs1_header {
  position: relative;
  width: 100%;
  float: left;
  margin-bottom: clamp(16px, calc(1.56vw + 11px), 30px);
}

.sw_bbs1_titles {
  width: 100%;
  float: left;
}

.sw_bbs1_more {
  position: absolute;
  right: 0;
  bottom: 0;
  display: inline-flex;
  align-items: center;
  gap: clamp(8px, calc(0.47vw + 6.5px), 14px);
  font-size: clamp(14px, calc(0.31vw + 13px), 18px);
  font-weight: 600;
  color: #374151;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s ease;
}

.sw_bbs1_more:hover {
  color: var(--more-hover-color, var(--primary, #111827));
}

.sw_bbs1_more:hover .sw_more_circle {
  background: var(--more-hover-color, var(--primary, #111827));
}

.sw_bbs1_more:hover .sw_more_txt::after {
  background: var(--more-hover-color, var(--primary, #111827));
}

.sw_bbs1_more .sw_more_txt {
  display: inline;
}

/* 텍스트와 원 사이 구분 점 */
.sw_bbs1_more .sw_more_txt::after {
  content: '';
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #9ca3af;
  margin-left: clamp(8px, calc(0.47vw + 6.5px), 14px);
  vertical-align: middle;
}

/* 동그란 화살표 버튼 */
.sw_bbs1_more .sw_more_circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(32px, calc(1.09vw + 28.5px), 46px);
  height: clamp(32px, calc(1.09vw + 28.5px), 46px);
  border-radius: 50%;
  background: #1f2937;
  color: #fff;
  font-size: clamp(16px, calc(0.47vw + 14.5px), 22px);
  transition: background 0.2s ease, transform 0.2s ease;
  flex-shrink: 0;
}

.sw_bbs1_more:hover .sw_more_circle {
  transform: translateX(2px);
}

/* hymore_wrap 기본 위치 (MORE 스타일 사용 시) */
.bbstab4 .sw_bbs1_header .hymore_wrap {
  position: absolute;
  right: 0;
  bottom: 0;
}

/* ================================================
   더보기 위치 프리셋 (data-more-pos)
   ================================================ */

/* 제목 밑 */
.bbstab4 .sw_bbs1_header[data-more-pos="below"] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.bbstab4 .sw_bbs1_header[data-more-pos="below"] .sw_bbs1_titles {
  float: none;
}
.bbstab4 .sw_bbs1_header[data-more-pos="below"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[data-more-pos="below"] .hymore_wrap {
  position: static;
  margin-top: clamp(8px, calc(0.47vw + 6.5px), 14px);
}

/* 우측 상단 */
.bbstab4 .sw_bbs1_header[data-more-pos="right_top"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[data-more-pos="right_top"] .hymore_wrap {
  top: 0;
  bottom: auto;
}

/* 우측 중앙 */
.bbstab4 .sw_bbs1_header[data-more-pos="right_center"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[data-more-pos="right_center"] .hymore_wrap {
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
}
.bbstab4 .sw_bbs1_header[data-more-pos="right_center"] .sw_bbs1_more:hover .sw_more_circle {
  transform: translateX(2px);
}

/* 우측 하단 (기본과 동일하지만 명시) */
.bbstab4 .sw_bbs1_header[data-more-pos="right_bottom"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[data-more-pos="right_bottom"] .hymore_wrap {
  right: 0;
  bottom: 0;
  top: auto;
}

/* 커스텀 오프셋 (CSS변수 오버라이드) */
.bbstab4 .sw_bbs1_header[style*="--mt"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[style*="--mt"] .hymore_wrap {
  top: var(--mt, auto);
}
.bbstab4 .sw_bbs1_header[style*="--mr"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[style*="--mr"] .hymore_wrap {
  right: var(--mr, 0);
}
.bbstab4 .sw_bbs1_header[style*="--mb"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[style*="--mb"] .hymore_wrap {
  bottom: var(--mb, auto);
}
.bbstab4 .sw_bbs1_header[style*="--ml"] .sw_bbs1_more,
.bbstab4 .sw_bbs1_header[style*="--ml"] .hymore_wrap {
  left: var(--ml, auto);
}

/* ================================================
   탭 영역
   ================================================ */
.sw_bbs1_tab_area {
  width: 100%;
  float: left;
}

.sw_bbs1_tabs {
  width: 100%;
  float: left;
  display: flex;
  gap: 0;
  border-bottom: 2px solid #e5e7eb;
  margin-bottom: clamp(16px, calc(1.56vw + 11px), 30px);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.sw_bbs1_tabs::-webkit-scrollbar {
  display: none;
}

.sw_bbs1_tabs .sw_tab {
  position: relative;
  padding: clamp(12px, calc(0.47vw + 10.5px), 18px) clamp(16px, calc(0.94vw + 13px), 28px);
  font-size: clamp(16px, calc(0.47vw + 14.5px), 22px);
  font-weight: 500;
  color: #9ca3af;
  background: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.25s ease, border-color 0.25s ease;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
}

.sw_bbs1_tabs .sw_tab:hover {
  color: #374151;
}

/* on 상태: 라벨컬러가 있으면 --tab-color 사용, 없으면 기본 진한색 */
.sw_bbs1_tabs .sw_tab.on {
  color: var(--tab-color, #111827);
  font-weight: 700;
  border-bottom-color: var(--tab-color, #111827);
}

/* 라벨 숨기기 */
.hide-label .label_css,
.hide-label .card_label {
  display: none !important;
}

/* 탭 패널 */
.sw_bbs1_panel {
  width: 100%;
  float: left;
}

.sw_bbs1_panel[hidden] {
  display: none !important;
}

/* 로딩 스피너 */
.lazy-placeholder {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 200px;
  width: 100%;
}

.loading-spinner {
  width: 40px;
  height: 40px;
  border: 3px solid #f3f3f3;
  border-top: 3px solid var(--main-color, #333);
  border-radius: 50%;
  animation: sw_spin 1s linear infinite;
}

@keyframes sw_spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* ================================================
   스와이퍼 래퍼 (전체 모드 & 탭 패널 공용)
   ================================================ */
.sw_bbs1_swiper_wrap {
  position: relative;
  width: 100%;
  float: left;
}

.sw_bbs1_swiper_wrap .content-swiper {
  width: 100%;
  float: left;
  overflow: hidden;
}

/* Swiper 초기화 전 FOUC 방지: 슬라이드 가로 정렬 + 첫 이미지 크기 제한 */
.sw_bbs1_swiper_wrap .content-swiper:not(.swiper-initialized) .swiper-wrapper {
  display: flex;
  overflow: hidden;
}

.sw_bbs1_swiper_wrap .content-swiper:not(.swiper-initialized) .swiper-slide {
  flex-shrink: 0;
  width: 25%;
  min-width: 0;
}

.sw_bbs1_swiper_wrap .content-swiper:not(.swiper-initialized) .swiper-slide img {
  max-width: 100%;
  height: auto;
}

/* 하단 페이징 영역 */
.sw_bbs1_swiper_wrap .paging-wrap {
  width: 100%;
  float: left;
  display: flex;
  align-items: center;
  gap: clamp(12px, calc(0.78vw + 9.5px), 20px);
  margin-top: clamp(16px, calc(1.17vw + 12.25px), 28px);
}

/* 화살표 버튼 영역 */
.sw_bbs1_swiper_wrap .btn-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.sw_bbs1_swiper_wrap .btn-prev,
.sw_bbs1_swiper_wrap .btn-next {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(44px, calc(1.25vw + 40px), 60px);
  height: clamp(44px, calc(1.25vw + 40px), 60px);
  border-radius: 50%;
  border: 1px solid #d1d5db;
  background: #fff;
  color: #374151;
  font-size: clamp(18px, calc(0.47vw + 16.5px), 24px);
  cursor: pointer;
  transition: all 0.2s ease;
}

.sw_bbs1_swiper_wrap .btn-prev:hover,
.sw_bbs1_swiper_wrap .btn-next:hover {
  background: #f3f4f6;
  border-color: #9ca3af;
}

.sw_bbs1_swiper_wrap .btn-prev.swiper-button-disabled,
.sw_bbs1_swiper_wrap .btn-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: default;
}

/* 프로그레스바 영역 (나머지 공간) */
.sw_bbs1_swiper_wrap .swiper-pagination {
  position: relative;
  flex: 1;
  height: 3px;
  background: #e5e7eb;
  border-radius: 2px;
}

.sw_bbs1_swiper_wrap .swiper-pagination .swiper-pagination-progressbar-fill {
  background: #374151;
  border-radius: 2px;
}

/* ================================================
   관리자 뱃지
   ================================================ */
.sw_bbs1_badge {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 100;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, #059669, #10b981);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
}

.sw_bbs1_badge:hover {
  background: linear-gradient(135deg, #047857, #059669);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
}

.sw_bbs1_badge i {
  font-size: 14px;
}

/* ================================================
   오른쪽 화면 끝까지 확장 (full-right)
   ================================================ */
.sw_bbs1_swiper_wrap.full-right {
  overflow: visible;
}

.sw_bbs1_swiper_wrap.full-right .content-swiper {
  overflow: visible;
  clip-path: inset(0 -100vw 0 0);
}

.sw_bbs1_swiper_wrap.full-right .swiper-wrapper {
  overflow: visible;
}

/* 호버 시 이미지 확대 제거 */
.sw_bbs1_swiper_wrap .card_item:hover .card_img_inner img {
  transform: none;
}

/* ================================================
   모바일
   ================================================ */
@media only all and (max-width: 767px) {
  .sw_bbs1_swiper_wrap.full-right {
    overflow: hidden;
  }
  .sw_bbs1_swiper_wrap.full-right .content-swiper {
    overflow: hidden;
    clip-path: none;
  }
  .sw_bbs1_header {
    margin-bottom: 14px;
  }

  .sw_bbs1_more {
    font-size: 13px;
    gap: 6px;
  }

  .sw_bbs1_more .sw_more_txt::after {
    width: 3px;
    height: 3px;
    margin-left: 6px;
  }

  .sw_bbs1_more .sw_more_circle {
    width: 28px;
    height: 28px;
    font-size: 14px;
  }

  .sw_bbs1_tabs {
    margin-bottom: 14px;
  }

  .sw_bbs1_tabs .sw_tab {
    padding: 10px 14px;
    font-size: 15px;
  }

  .sw_bbs1_swiper_wrap .paging-wrap {
    margin-top: 14px;
    gap: 10px;
  }

  .sw_bbs1_swiper_wrap .btn-prev,
  .sw_bbs1_swiper_wrap .btn-next {
    width: 38px;
    height: 38px;
    font-size: 16px;
  }

  /* 모바일 더보기 위치 프리셋 (data-more-pos-mo) */
  .bbstab4 .sw_bbs1_header[data-more-pos-mo="below"] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .bbstab4 .sw_bbs1_header[data-more-pos-mo="below"] .sw_bbs1_titles { float: none; }
  .bbstab4 .sw_bbs1_header[data-more-pos-mo="below"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[data-more-pos-mo="below"] .hymore_wrap {
    position: static;
    margin-top: 8px;
  }

  .bbstab4 .sw_bbs1_header[data-more-pos-mo="right_top"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[data-more-pos-mo="right_top"] .hymore_wrap {
    top: 0; bottom: auto;
  }

  .bbstab4 .sw_bbs1_header[data-more-pos-mo="right_center"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[data-more-pos-mo="right_center"] .hymore_wrap {
    top: 50%; bottom: auto; transform: translateY(-50%);
  }

  .bbstab4 .sw_bbs1_header[data-more-pos-mo="right_bottom"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[data-more-pos-mo="right_bottom"] .hymore_wrap {
    right: 0; bottom: 0; top: auto;
  }

  /* 모바일 커스텀 오프셋 */
  .bbstab4 .sw_bbs1_header[style*="--mt-mo"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[style*="--mt-mo"] .hymore_wrap {
    top: var(--mt-mo) !important;
  }
  .bbstab4 .sw_bbs1_header[style*="--mr-mo"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[style*="--mr-mo"] .hymore_wrap {
    right: var(--mr-mo) !important;
  }
  .bbstab4 .sw_bbs1_header[style*="--mb-mo"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[style*="--mb-mo"] .hymore_wrap {
    bottom: var(--mb-mo) !important;
  }
  .bbstab4 .sw_bbs1_header[style*="--ml-mo"] .sw_bbs1_more,
  .bbstab4 .sw_bbs1_header[style*="--ml-mo"] .hymore_wrap {
    left: var(--ml-mo) !important;
  }
}
