/* female/cystitis.html (원본 /sub7/sub7_1.php) 전용 보정
   원본 css/sub.css 는 1200px 고정 전제라 @media 가 한 줄도 없다.
   sub.css 수치는 그대로 두고 좁은 폭에서만 리플로우한다.
   .sub7_nav 는 3칸(33.334%)이라 좁은 폭에서도 3열을 유지하고 글자만 줄인다.
   .list_content_desc3 은 91% 고정이라 좁은 폭에서 float 2단을 푼다. */

@media screen and (max-width: 1024px) {
  .top_content { padding-top: 40px; overflow: hidden; }
  .quickroute { position: static; float: right; clear: both; margin-top: 12px; background-position: 0 50%; }

  .content_nav ul li { height: auto; line-height: 1.4; }
  .content_nav ul li a { padding: 14px 6px; font-size: 16px; box-sizing: border-box; }

  .detail_content { padding: 20px 20px 40px; margin-bottom: 40px; }
  .detail_content > h3 { font-size: 21px; padding: 34px 0 20px 26px; background-size: 16px auto; }
  .detail_content > h3:first-child { padding-top: 14px; background-position-y: 16px; }
  .list_content_img img { max-width: 100%; height: auto; }
  .list_content_text { padding-left: 16px; }
}

@media screen and (max-width: 768px) {
  .sub7_nav li a { font-size: 15px; }

  /* .list_content_title/.list_content_desc 는 원본이 float 2단(제목 - 설명).
     좁은 폭에서 설명 91%가 제목 옆에 못 들어가 한 줄씩 쌓이게 한다. */
  .list_content_text { padding-left: 10px; line-height: 28px; }
  .list_content_title, .list_content_desc { float: none; }
  .list_content_desc, .list_content_desc3 { width: 100%; padding-left: 0; }
}

@media screen and (max-width: 480px) {
  .top_content h2 { font-size: 23px; }
  .quickroute { font-size: 13px; }

  .sub7_nav li a { font-size: 14px; padding: 14px 2px; }

  .detail_content { padding: 14px 14px 30px; }
  .detail_content > h3 { font-size: 19px; padding-left: 22px; }
  .list_content_text { padding-left: 4px; }
}