/* stone/treatment.html (원본 /sub2/sub2_2.php) 전용 보정 — 원본 css/sub.css 는 그대로 두고
   여기서 캐스케이드로 보탠다(R5 v1). 두 가지만 한다.
   (1) 원본이 연속 <br> 로 만들던 빈 줄 여백을 CSS 여백으로 환산(R1 BR-RUN 금지, 수치는 원본 실측값)
   (2) 1200px 고정 레이아웃의 반응형 리플로우(원본에 @media 없음) */

/* --------------------------------------------------------------------------
   1. 연속 <br> → CSS 여백 (원본 _styles/sub2-sub2_2.json 실측 그대로)
      · 본문 p 의 line-height 는 28px → 빈 줄 1개 = 28px
      · detail_content 직계 <br> 의 line box 는 16px → <br><br> = 32px
   -------------------------------------------------------------------------- */
.detail_content > p:nth-of-type(2) { min-height: 112px; }              /* 원본: 문단 끝 <br><br> = 빈 줄 1 */
.detail_content > p:nth-of-type(4) > span { display: block; }          /* 원본: 한 <p> 안 두 문단 */
.detail_content > p:nth-of-type(4) > span + span { margin-top: 28px; } /* 원본: 문단 사이 <br><br> = 빈 줄 1 */
.detail_content > p:nth-of-type(4) { margin-bottom: 32px; }            /* 원본: </p> 뒤 <br><br> = 16px 줄 2 */

/* 이미지 라인박스 디센더 보정은 전 페이지 공통 사안이라 css/h8-overlay.css 정본으로
   올렸다(img{vertical-align:top}) — 이 파일의 중복 선언은 제거. */

/* --------------------------------------------------------------------------
   2. 반응형 — 1240 이하: 본문 고정폭 해제에 맞춘 내부 리플로우
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1240px) {
  .text_box { padding-left: 0; }
  .text_box li { width: calc(50% - 14px); }
  .box_right { margin-right: 28px; }
  .detail_content dl dd p { margin-left: 0; }
}

/* --------------------------------------------------------------------------
   3. 반응형 — 1024 이하: 서브 탭 2열
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1024px) {
  .sub2_nav li { width: 50%; }
  .content_nav ul li:nth-child(2n) { border-right: none; }
  .content_nav ul li a { font-size: 16px; }
}

/* --------------------------------------------------------------------------
   4. 반응형 — 768 이하: 상단 타이틀/경로 세로 배치, 본문 여백 축소
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  .top_content { padding-top: 40px; }
  .top_content h2 { font-size: 22px; }
  .quickroute { position: static; margin-top: 12px; }
  .detail_content { padding: 20px 15px 40px; margin-bottom: 40px; }
  .detail_content > h3 { font-size: 20px; padding: 34px 0 20px 26px; }
  .detail_content > h3:first-child { padding-top: 14px; background-position-y: 15px; }
  .detail_content > h4 { margin-left: 0; }
  .detail_content dl dd { padding-left: 20px; }
  .h4_text { padding-left: 10px; }
}

/* --------------------------------------------------------------------------
   5. 반응형 — 560 이하: 서브 탭 1열, 식이요법 카드 1열
   -------------------------------------------------------------------------- */
@media screen and (max-width: 560px) {
  .sub2_nav li { width: 100%; border-right: none; border-bottom: 1px solid #ccc; }
  .content_nav ul li a { font-size: 15px; }
  .text_box li,
  .text_box li.box_right { width: 100%; margin-right: 0; }
}