/* =========================================================
   /css/style_review.css  (FULL REPLACE / 2026-01)
   - ✅ body.page-review 범위로만 적용
   - ✅ header 배경은 headwords까지만 (real header에만 배경)
   - ✅ navbar_under는 header 밖(완전 분리)
   - ✅ wrapper div.header가 있든 없든(case A/B) 호환
   - ✅ 기존 리뷰 테이블 디자인 유지 (+ 모바일 안전)
   ========================================================= */

* { box-sizing: border-box; }

/* =========================================================
   0) wrapper div.header가 있을 때: 배경/높이 제거
   - 진짜 배경은 header.header 에만 적용
   ========================================================= */
body.page-review .container > .header{
  background: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* =========================================================
   1) real header (배경은 여기만)
   - ✅ “반 정도” 높이
   ========================================================= */
body.page-review header.header{
  position: relative;

  background-image: url("/img/review_title-s.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;

  min-height: clamp(180px, 32vh, 340px);
  height: auto;

  padding-bottom: 10px;
}

/* (선택) 가독성 오버레이: 너무 세면 alpha(0.20)를 0.10~0.15로 */
body.page-review header.header::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0.18),
    rgba(255,255,255,0.00)
  );
}
body.page-review header.header > *{
  position: relative;
  z-index: 1;
}

/* =========================================================
   2) navbar (상단 바) : 삐져나옴 방지 + 슬림
   ========================================================= */
body.page-review header.header .navbar{
  display: grid;
  grid-template-columns: auto 1fr;  /* 로고 / 텍스트 */
  align-items: center;

  height: 34px;
  padding: 0 12px;
  overflow: hidden;

  background-color: teal;
}

/* navbar 내부 리셋 */
body.page-review header.header .navbar *{
  margin: 0;
  padding: 0;
  line-height: 1;
}

/* 로고 */
body.page-review header.header .navbar .logo{
  display: flex;
  align-items: center;
  justify-self: start;
  margin-left: 6px;
}
body.page-review header.header .navbar .logo img{
  width: 65px;     /* 당신 기존 값 유지 */
  height: auto;
  display: block;
}

/* 중앙 텍스트 */
body.page-review header.header .navbar .logo_text{
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
body.page-review header.header .navbar .logo_text p{
  color: #fff;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.12em;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* =========================================================
   3) headwords (리뷰 타이틀/문구)
   ========================================================= */
body.page-review header.header .headwords{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;

  gap: 16px;
  flex-wrap: wrap;

  padding: 22px 12px 10px;
}

/* 당신 기존 row02 p 스타일 유지 */
body.page-review header.header .headwords .row02 p{
  color: #fff;
  letter-spacing: 0.1em;
  word-spacing: 0.2em;
  line-height: 150%;
  text-shadow: -0.5px 0 Green, 0 0px Green, 0.5px 0 Green, 0 -0.5px Green;
  margin: 0;
}

/* 오른쪽 로고(있을 때만) */
body.page-review header.header .headwords .row03 img{
  max-width: 180px;
  height: auto;
  display: block;
}

/* =========================================================
   4) navbar_under (✅ header 밖 / 얇게 / 중앙)
   - case A: wrapper div.header 아래에 있는 navbar_under
   - case B: container 바로 아래에 있는 navbar_under
   ========================================================= */
body.page-review .container > .header > .navbar_under,
body.page-review .container > .navbar_under{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;

  gap: 8px 14px;
  min-height: 38px;
  padding: 6px 10px;

  background: #263343;
}

/* 메뉴 링크 */
body.page-review .navbar_under .menu_under a{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  text-decoration: none;
  color: #fff;

  font-size: 12px;
  padding: 6px 10px;
  line-height: 1.1;
  white-space: nowrap;

  border-radius: 8px;
  background: rgba(255,255,255,0.10);

  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
body.page-review .navbar_under .menu_under a:hover{
  background: rgba(255,255,255,0.90);
  color: #263343;
}

/* span(작은 글씨) - 기존 유지 */
body.page-review .navbar_under .menu_under span{
  font-size: 10px;
  -webkit-transform: scale(0.7);
  display: inline-block;
  margin-right: 4px;
}

/* =========================================================
   5) 리뷰 본문 테이블 (당신 기존 디자인 유지)
   ========================================================= */
body.page-review .table_review{
  width: 100%;
  border: 0;
  border-collapse: collapse;
  align-items: center;
}

body.page-review .table_review p{
  padding-top: 15px;
  border: 0 dotted silver;
  background-color: teal;
  color: white;
}

/* 기존 table 폭(1000px) 유지하되, 모바일에서 튐 방지 */
body.page-review table{
  align-content: left;
  align-items: center;
  width: 1000px;
  max-width: 100%;
}

body.page-review .table_review .c3,
body.page-review .table_review .c4{
  border-bottom: 1px dotted #444444;
}

body.page-review .c1{
  width: 400px;
  margin: 6px 10px 0px 15px;
  font-size: 9px;
  text-align: left;
  line-height: 0.2px;
  padding: 4px 0 0 10px;
}

body.page-review .c2{
  margin: 6px 10px 0px 10px;
  font-size: 9px;
  text-align: left;
  line-height: 0.2px;
  padding: 4px 0 0 4px;
}

body.page-review .c1,
body.page-review .c2{
  padding-top: 10px;
}

body.page-review .table_review .c12{
  line-height: 0.2px;
}

body.page-review .c3{
  width: 450px;
  text-align: left;
  padding: 0 10px 2px 9px;
}

body.page-review .c3 a{
  text-decoration: none;
  color: black;
}

/* 기존: .c3 :hover → 의도대로 링크 hover만 */
body.page-review .c3 a:hover{
  color: white;
  background-color: teal;
}

body.page-review .c4{
  width: auto;
  text-align: left;
  padding: 0 10px 2px 4px;
}

body.page-review .c4 span{
  text-align: left;
  font-style: italic;
}

/* =========================================================
   6) 모바일
   ========================================================= */
@media screen and (max-width: 700px){
  body.page-review .c2,
  body.page-review .c4,
  body.page-review .c5{
    display: none;
    visibility: hidden;
  }

  body.page-review .table_review{
    align-items: center;
  }
}

/* 추가 안전: navbar 텍스트 */
@media (max-width: 768px){
  body.page-review header.header .navbar .logo_text p{
    font-size: 10px;
    letter-spacing: 0.10em;
  }
}
body.page-review .header_search{
  background:#fff;
  padding: 14px 0 18px;
  text-align:center;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
body.page-review .header_search form{
  display:inline-flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:center;
}
body.page-review .header_search input{
  padding:10px;
  width:min(520px, 80vw);
}
body.page-review .header_search button{
  padding:10px 16px;
}