/* ============================================================
   WEADD(2026-10-17): 시술 세부 페이지 추가 요소 스타일
   - 검수 표시(상단 한 줄 .dt_rvline / 하단 서명 .dt_rvsign)
   - 주의사항 영상(.dt_vid - 클릭 전 썸네일, 클릭 후 유튜브 플레이어)
   - 상담 영역(.dt_cta2 버튼 4종 + 진료시간/주소 .dt_cta_info)
   기존 procedure-detail.css 뒤에 불러오며, 새 클래스만 씁니다(기존 규칙 변경 없음).
   ============================================================ */

/* ① 상단 한 줄 */
.dt_rvline { margin: 0 0 6px; padding: 14px 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px;
    font-size: 14px; line-height: 1.5; color: #7b7267; border-bottom: 1px solid #eee; }
.dt_rvline .dt_rvline_k { color: #3d3429; font-weight: 600; }
.dt_rvline .dt_rvline_s { color: #cfc6b8; }
.dt_rvline a { color: #3d3429; font-weight: 600; text-decoration: none; }
.dt_rvline a:hover { color: #8a6d2b; text-decoration: underline; text-underline-offset: 3px; }
.dt_rvline time { color: #3d3429; font-weight: 600; }

/* ② 주의사항 영상 */
.dt_vidwrap { margin: 28px 0 6px; }
.dt_vid_lead { margin: 0 0 14px; font-size: 15.5px; line-height: 1.7; color: #555; }
.dt_vid_lead strong { color: #1e1e1e; font-weight: 700; }
.dt_vid_grid { display: grid; grid-template-columns: minmax(0, 560px); gap: 20px; }
.dt_vid_grid.is_two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 1000px; }
.dt_vid { margin: 0; }
.dt_vid_box { position: relative; aspect-ratio: 16 / 9; background: #111; border-radius: 12px; overflow: hidden; }
.dt_vid_play { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: #000; cursor: pointer; display: block; }
.dt_vid_play img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: .94; transition: transform .35s ease, opacity .2s ease; }
.dt_vid_play:hover img { transform: scale(1.03); opacity: 1; }
.dt_vid_ico { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%;
    background: rgba(255,255,255,.92); box-shadow: 0 6px 20px rgba(0,0,0,.25); }
.dt_vid_ico::after { content: ''; position: absolute; left: 25px; top: 19px; border-style: solid; border-width: 13px 0 13px 20px; border-color: transparent transparent transparent #b99a63; }
.dt_vid_play:hover .dt_vid_ico { background: #fff; }
.dt_vid_play:focus-visible { outline: 3px solid #b99a63; outline-offset: 2px; }
.dt_vid_box iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.dt_vid figcaption { margin: 10px 2px 0; font-size: 14px; line-height: 1.6; color: #555; }
.dt_vid_meta { color: #9a9083; }
.dt_vid_yt { margin-left: 8px; color: #8a6d2b; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
@supports not (aspect-ratio: 16 / 9) { .dt_vid_box { height: 0; padding-bottom: 56.25%; } }

/* ③ 하단 서명 (A 서명형) */
.dt_rvsign { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 36px; flex-wrap: wrap;
    margin: 44px 0 10px; padding: 26px 0 0; border-top: 1px solid #d9cfbd; }
.dt_rvsign_txt { margin: 0; max-width: 680px; font-size: 16px; line-height: 1.8; color: #3d3429; word-break: keep-all; }
.dt_rvsign_who { text-align: right; padding-left: 18px; border-left: 2px solid #b99a63; }
.dt_rvsign_who b { display: block; font-size: 16px; font-weight: 700; color: #1e1e1e; }
.dt_rvsign_who small { display: block; margin-top: 3px; font-size: 12.5px; color: #9a9083; }
.dt_rvsign_who a { color: #8a6d2b; text-decoration: none; }
.dt_rvsign_who a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ④ 상담 영역 */
.dt_cta2 { display: flex; flex-wrap: wrap; gap: 12px; margin: 18px 0 12px; }
.dt_cta2 .dt_btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 12px 22px;
    border-radius: 10px; font-size: 15.5px; font-weight: 600; line-height: 1.2; text-decoration: none; transition: filter .15s ease, background .15s ease; box-sizing: border-box; }
.dt_cta2 .dt_btn:hover { filter: brightness(.96); text-decoration: none; }
.dt_cta2 .kakao { background: #fee500; color: #3c1e1e; }
.dt_cta2 .nbook { background: #03c75a; color: #fff; }
.dt_cta2 .ntalk { background: #fff; color: #03a04a; border: 1.5px solid #03c75a; }
.dt_cta2 .tel   { background: #fff; color: #5b4d33; border: 1.5px solid #d5b491; }
.dt_cta2 .dt_btn_ico { font-size: 17px; line-height: 1; }
.dt_cta_info { margin: 0 0 6px; font-size: 14px; line-height: 1.8; color: #7b7267; display: flex; flex-wrap: wrap; gap: 4px 22px; }
.dt_cta_info b { color: #4a4036; font-weight: 600; margin-right: 6px; }
.dt_cta_info a { color: #8a6d2b; text-decoration: underline; text-underline-offset: 3px; }

/* ⑤ 전후사진 페이지 링크 - 03 섹션 타임라인 아래 버튼 모양 (기존 작은 글자 링크 스타일 대체) */
.dt_page .dt_sec a.dt_balink { display: inline-flex !important; align-items: center; gap: 6px; margin: 22px 0 4px !important; padding: 12px 22px !important;
    border: 1.5px solid #d5b491 !important; border-radius: 10px; background: #fff; color: #5b4d33 !important; font-size: 15px !important; font-weight: 600;
    line-height: 1.2; text-decoration: none !important; transition: background .15s ease; }
.dt_page .dt_sec a.dt_balink:hover { background: #faf7f1; }

/* 폰 */
@media (max-width: 600px) {
    .dt_rvline { padding: 12px 0; font-size: 13px; gap: 4px 8px; }
    .dt_vid_lead { font-size: 14.5px; }
    .dt_vid_grid.is_two { grid-template-columns: 1fr; }
    .dt_vid figcaption { font-size: 13px; }
    .dt_rvsign { margin-top: 34px; gap: 16px; }
    .dt_rvsign_txt { font-size: 15px; }
    .dt_cta2 .dt_btn { flex: 1 1 46%; padding: 12px 10px; font-size: 14.5px; }
    .dt_cta_info { font-size: 13.5px; }
    .dt_page .dt_sec a.dt_balink { width: 100%; justify-content: center; }
}
