/* ========================================
 * 콘텐츠 뷰 (개인정보처리방침 등)
 * 계층: pages (단일 JSP 전용)
 * JSP: /WEB-INF/jsp/vasanta/mber/cntnts/view.jsp
 * 네임스페이스: .page-cntnts-view
 * ======================================== */

/**
 * 법률 문서 타이포그래피
 * 약관/개인정보처리방침 정적 콘텐츠용 스타일
 *
 * @since 2026-03-14
 */

/* Quill의 white-space: pre-wrap 오버라이드 — JSP 소스 공백이 렌더링되는 문제 방지 */
.page-cntnts-view .ql-editor {
  white-space: normal;
}

/* 조항 제목 (제1조, 제2조...) — 상단 여백으로 조항 구분 */
.page-cntnts-view .sfn-onboard-title {
  margin-top: 1.8rem;
  margin-bottom: 0.5rem;
}

/* 본문 단락 */
.page-cntnts-view .cntnts-text {
  margin-bottom: 0.4em;
  line-height: 1.6;
}

/* 1단계 목록 */
.page-cntnts-view .cntnts-list {
  padding-left: 1.2em;
  margin-bottom: 0.4em;
  list-style: none;
}

/* 2단계 목록 */
.page-cntnts-view .cntnts-sublist {
  padding-left: 1.4em;
  margin-top: 0.2em;
  margin-bottom: 0;
  list-style: none;
}

/* 목록 항목 */
.page-cntnts-view .cntnts-item {
  padding-left: 0;
  margin-bottom: 0.15em;
  line-height: 1.5;
}

/* 조항 구분선 */
.page-cntnts-view .cntnts-divider {
  margin: 1.4rem 0;
  border: none;
  border-top: 1px solid #dee2e6;
  border-top: 1px solid oklch(88% 0.005 250);
}

/**
 * 탑 버튼
 * position fixed, 1080px 카드 우측 바로 바깥 + 수직 중앙 고정
 * 아이콘 + TOP 텍스트 세로 배치, 처음부터 노출
 *
 * @since 2026-03-14
 */
.page-cntnts-view .cntnts-btn-top {
  position: fixed;
  top: 50%;
  left: calc(50% + 552px);
  transform: translateY(-50%);
  z-index: 1040;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: rgb(255 255 255 / 0.45);
  color: #222;
  color: oklch(20% 0 0);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  box-shadow:
    0 1px 3px rgb(0 0 0 / 0.12),
    inset 0 1px 0 rgb(255 255 255 / 0.6);
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.page-cntnts-view .cntnts-btn-top:hover {
  background: rgb(255 255 255 / 0.7);
  box-shadow:
    0 2px 6px rgb(0 0 0 / 0.15),
    inset 0 1px 0 rgb(255 255 255 / 0.8);
}

.page-cntnts-view .cntnts-btn-top:active {
  background: rgb(255 255 255 / 0.85);
  box-shadow:
    0 0 2px rgb(0 0 0 / 0.1),
    inset 0 1px 2px rgb(0 0 0 / 0.08);
}

.page-cntnts-view .cntnts-btn-top-label {
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.03em;
}

/**
 * 탑 버튼 반응형
 * 뷰포트 1200px 이하에서 카드 우측 바깥 배치가 화면 밖으로 밀리는 문제 해결
 * 우하단 고정 배치로 전환
 *
 * @since 2026-03-14
 */
@media (max-width: 1199.98px) {
  .page-cntnts-view .cntnts-btn-top {
    left: auto;
    top: auto;
    right: 16px;
    bottom: 24px;
    transform: none;
  }
}
