/* 이연시 새 홈페이지 공통 틀 — 지금 홈페이지(mvwiz) 모양을 그대로 맞춘 기본 규칙 + 위쪽 메뉴 */

/* ── 기본 규칙 (지금 홈페이지와 같은 값) ── */
*, *::before, *::after { box-sizing: border-box; }
html { min-width: 360px; }
body { margin: 0; padding: 0; min-width: 360px; overflow-x: hidden; background: #fff;
  font-family: 'pretendard', sans-serif; font-size: 14px; line-height: 1; color: #333; letter-spacing: -0.5px; }
h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, blockquote, form, fieldset, table, th, td {
  margin: 0; padding: 0; font: inherit; color: inherit; letter-spacing: inherit; }
strong, b, em, i { font: inherit; }
ul, ol { list-style: none; }
a { color: #000; text-decoration: none; cursor: pointer; }
img { border: 0; vertical-align: baseline; }
table { border-collapse: collapse; }
button { margin: 0; padding: 0; border: 0; background: transparent; font-family: inherit; cursor: pointer; }
input, select, textarea { margin: 0; font-family: inherit; }

/* ── 위쪽 메뉴 (PC: 1200px 이상) ── */
#header { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; transition: background-color .15s linear; }
#header .top-area { height: 0; }
#header .top-area .member { position: absolute; top: 0; right: 20px; z-index: 2; }
#header .top-area .member ul { font-size: 0; }
#header .top-area .member li { display: inline-block; }
#header .top-area .member li + li { margin-left: 30px; }
#header .top-area .member a { display: block; font-size: 15px; font-weight: 600; line-height: 38px; color: #fff; }
#header .inner { position: relative; padding: 30px 0 36px; }
#header .inner .container { position: relative; }
#header .logo { display: block; width: 110px; margin: 0 auto; }
#header .logo a, #header .logo img { display: block; width: 100%; }
#header .btn-nav { display: none; }
#header .gnb-close { display: none; position: absolute; top: 43px; left: 60px; width: 21px; z-index: 3; }
#header .gnb-close img { display: block; width: 21px; }

#gnb { text-align: center; padding-bottom: 40px; }
#gnb > ul { font-size: 0; }
#gnb > ul > li { position: relative; display: inline-block; vertical-align: top; padding: 0 25px; }
/* 지금 홈페이지는 애플 글꼴을 인터넷에서 받아 씀(사용 허락이 불분명). 새 홈페이지는 애플 기기에선 기기 글꼴,
   그 밖에선 모양·폭이 거의 같은 무료 글꼴 Pretendard를 씀 (메뉴 한 칸 폭 차이 1px 이하) */
#gnb > ul > li > a { position: relative; display: inline-block; font-size: 20px; line-height: 1; color: #fff; font-weight: 500;
  font-family: "Apple SD Gothic Neo", "pretendard", sans-serif; transition: all .15s linear; }
#gnb > ul > li > a::after { content: ""; position: absolute; bottom: -5px; left: 50%; width: 0; height: 1px; background: #fff;
  transform: translateX(-50%); transition: all .15s linear; }
#gnb > ul > li:hover > a::after { width: 100%; }
#gnb > ul > li > div { display: none; margin-top: 20px; }
#gnb > ul > li > div > ul > li { padding: 5px 0 20px; }
#gnb > ul > li > div > ul > li > a { display: inline-block; font-size: 15px; line-height: 130%; color: rgba(255, 255, 255, .5);
  transition: color .15s linear; }
#gnb > ul > li > div > ul > li > a:hover { color: #fff; }

/* 메뉴에 마우스를 올리면 큰 검은 판이 펼쳐짐 */
body.gnb-opened #header { height: 450px; background-color: rgba(0, 0, 0, .6); }
body.gnb-opened #header .inner { padding-bottom: 45px; }
body.gnb-opened #header .gnb-close { display: block; }
body.gnb-opened #gnb > ul > li > div { display: block; }

/* 스크롤을 내리면 얇은 검은 띠 */
body.scrolled #header { background-color: rgba(0, 0, 0, .7); }
body.scrolled #header .inner { padding-bottom: 0; }
body.scrolled #header .logo { display: none; }
body.scrolled.gnb-opened #header { background-color: rgba(0, 0, 0, .6); }
body.scrolled.gnb-opened #header .inner { padding-bottom: 45px; }
body.scrolled.gnb-opened #header .logo { display: block; }

@media (min-width: 1600px) {
  #gnb > ul > li { padding: 0 54px; }
  #gnb > ul > li > div > ul > li > a { font-size: 17px; }
}

/* ── 폰·태블릿 (1199px 이하): 점 3개 버튼 + 왼쪽에서 나오는 메뉴 ── */
#nav { display: none; }
@media (max-width: 1199px) {
  #header .top-area { display: none; }
  #header .inner { padding: 10px 0; }
  #header .logo { width: 100px; }
  #gnb { display: none; }
  #header .btn-nav { display: flex; align-items: center; gap: 2px; position: absolute; top: 39px; left: 20px; width: 20px; height: 20px;
    padding-left: 1px; font-size: 0; z-index: 3; }
  #header .btn-nav span { flex: none; width: 5px; height: 5px; background: #fff; }
  body.gnb-opened #header { height: auto; background-color: transparent; }

  body.scrolled #header { height: 64px; background-color: rgba(0, 0, 0, .7); }
  body.scrolled #header .inner { height: 64px; padding: 0; }
  body.scrolled #header .btn-nav { top: 50%; transform: translateY(-50%); }

  #nav { display: block; position: fixed; top: 0; left: -100%; width: 100%; height: 100%; z-index: 101; background: #fff;
    transition: left .15s linear; }
  body.nav-opened #nav { left: 0; }
  body.nav-opened { overflow: hidden; }
  #nav .nav-wrap { height: 100%; }
  #nav .nav-top { position: relative; height: 119px; padding: 10px 0; }
  #nav .nav-top .nav-close { position: absolute; top: 48px; left: 20px; width: 15px; }
  #nav .nav-top .nav-close img { display: block; width: 100%; }
  #nav .nav-top .logo { width: 100px; margin: 0 auto; }
  #nav .nav-top .logo img { display: block; width: 100%; }
  #nav .nav-top .member { position: absolute; top: 24px; right: 20px; }
  #nav .nav-top .member ul { font-size: 0; }
  #nav .nav-top .member li { display: inline-block; }
  #nav .nav-top .member li + li { margin-left: 16px; }
  #nav .nav-top .member a { display: inline-block; font-size: 14px; font-weight: 600; line-height: 14px; color: #909090; }
  #nav .nav-content { position: relative; height: calc(100% - 119px); overflow-y: auto; }
  #nav .depth1 { position: relative; min-height: 100%; background: #000; }
  #nav .depth1::after { content: ""; position: absolute; top: 0; left: 130px; width: calc(100% - 130px); height: 100%; background: #fff; }
  #nav .depth1 > li { height: 80px; text-align: center; }
  #nav .depth1 > li > a { position: relative; z-index: 1; display: block; width: 130px; font-size: 16px; font-weight: 500;
    line-height: 80px; color: #fff; }
  #nav .depth1 > li > div { display: none; position: absolute; top: 0; left: 130px; width: calc(100% - 130px); height: 100%;
    padding-bottom: 50px; background: #fff; z-index: 2; }
  #nav .depth1 > li.active > div { display: block; }
  #nav .depth2 > li > a { display: block; padding-top: 30px; font-size: 16px; font-weight: 500; line-height: 26px; color: #223d3c; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  #header .inner { padding: 30px 0; }
  #header .logo { width: 110px; }
  #header .btn-nav { top: 50%; left: 80px; width: 40px; height: 40px; transform: translateY(-50%); }
  #header .btn-nav { gap: 4px; }
  #header .btn-nav span { width: 8px; height: 8px; }
  body.scrolled #header, body.scrolled #header .inner { height: 76px; }
  #nav .nav-top { height: auto; padding: 30px 0; }
  #nav .nav-top .nav-close { width: 31px; left: 25px; top: 50%; transform: translateY(-50%); }
  #nav .nav-top .logo { width: 244px; }
  #nav .nav-top .member { right: 25px; }
  #nav .nav-top .member li + li { margin-left: 30px; }
  #nav .nav-top .member a { font-size: 15px; }
  #nav .nav-content { height: calc(100vh - 243px); }
  #nav .depth1::after { left: 355px; width: calc(100% - 355px); }
  #nav .depth1 > li > a { width: 355px; font-size: 24px; }
  #nav .depth1 > li > div { left: 355px; width: calc(100% - 355px); }
  #nav .depth2 > li > a { padding-top: 0; font-size: 24px; line-height: 80px; }
}

/* ════════ 📱 폰 화면 (768px 이하) — 10-28 모바일 시안 3-2 사장님 확정 → 모든 페이지 공통. PC는 그대로 ════════
   ① 왼쪽 위 ☰ → 어두운 전체 화면 메뉴(site.js ysMm) ② 내리면 맨 위 탭 3개(모집현황·리얼 후기·1:1 소개) ③ 로고 조금 작게
   ④ 오른쪽 위 [신청하기] — ☰·로고·신청하기 한 줄 가운데 ⑤ 첫 화면 슬라이드 버튼 5개 같은 크기로 크게 ⑥ 숫자 아래 '2023년부터 광주에서만' 한 줄
   ⑦ 메인 달력 위 '내가 참여할 수 있는 기수 찾기' ⑧ 프라이빗한 대화 공간 사진 정사각형 ⑨ 커플·후기 인증 사진 같은 크기 정사각형
   ⑩ 상담문의 번호 그림·떠 있는 예약하기·오른쪽 퀵메뉴 뺌 ⑪ AI 버튼 'AI' 글자 아래 + 그 자리에 ✕ */
#mm-tabs, #mm-menu, .mm-find, .mm-apply, .mm-ai-x, .mm-since { display: none; }

@media (max-width: 768px) {
  .emblem, #ysFloatingReserve, #rightMenu, #nav { display: none !important; }
  #mm-tabs, #mm-tabs *, #mm-menu, #mm-menu *, .mm-find, .mm-find * { box-sizing: border-box; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; }

  /* ⑪ AI 상담 버튼 */
  #chatFab .ai-tag { top: auto !important; bottom: -7px !important; right: auto !important; left: 50% !important; transform: translateX(-50%); }
  .mm-ai-x { display: flex; position: absolute; top: -4px; right: -4px; left: auto; bottom: auto; z-index: 2147483647 !important; width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(32,28,40,.9); color: #fff; font: 800 12px/1 'Pretendard', 'Noto Sans KR', sans-serif; cursor: pointer; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,.28); padding: 0; }

  /* ① ☰ · ③ 로고 · ④ [신청하기] — 셋 다 머리띠 안 같은 칸(.container) 기준, 로고(76×75) 가운데 높이에 맞춤 */
  #header .btn-nav { display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 5px; top: 17px !important; left: 12px !important; width: 40px !important; height: 40px !important; transform: none !important; border-radius: 12px; background: rgba(0,0,0,.22) !important; }
  #header .btn-nav span { width: 20px !important; height: 2.5px !important; border-radius: 2px; background: #fff !important; }
  #header .logo { width: 76px !important; }
  .mm-apply { display: inline-flex; position: absolute; z-index: 5; top: 17px; right: 12px; height: 40px; padding: 0 16px; align-items: center; justify-content: center; border-radius: 999px; background: linear-gradient(135deg, #f45da8, #8b5cf6); color: #fff !important; text-decoration: none; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-size: 14px; font-weight: 800; letter-spacing: -.04em; box-shadow: 0 8px 22px rgba(244,93,168,.35); white-space: nowrap; }
  body.scrolled #header .btn-nav, body.scrolled #header .mm-apply { top: 12px !important; }
  body.scrolled #header { background-color: transparent; }

  /* ⑤ 첫 화면 슬라이드 버튼 5개 같은 크기 (class를 붙이면 원래 버튼의 0.25초 움직임이 보여서 이름으로 고름) */
  .yeonsi-hero .ys-slide .ys-btn { min-width: 250px; height: 60px; padding: 0 34px; font-size: 18px; font-weight: 800; box-shadow: 0 16px 40px rgba(244,93,168,.45); }
  .yeonsi-hero .ys-content { top: 36%; }
  @media (max-width: 380px) { .yeonsi-hero .ys-content { top: 34%; } }

  /* ⑥ 숫자 칸 아래 한 줄 — 숫자와 쪽 번호(01—05) 사이 */
  .mm-since { display: flex; align-items: center; justify-content: center; gap: 7px; position: absolute; z-index: 6; left: 0; right: 0; bottom: 64px; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-size: 12.5px; line-height: 20px; font-weight: 600; letter-spacing: -.03em; color: rgba(255,255,255,.86); pointer-events: none; }
  .mm-since::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #f45da8; box-shadow: 0 0 12px #f45da8; }
  .mm-since b { font-weight: 800; color: #fff; }

  /* ⑧ 프라이빗한 대화 공간 사진 — 4:3 → 정사각형 */
  .ys-private-section .ys-private-slide { aspect-ratio: 1 / 1 !important; }

  /* ⑨ 후기 인증 사진 = 정사각형 / 커플 인증 사진 = 화면에 2장 조금 넘게 보이는 정사각형 (10-28 사장님 "커플 사진이 왜 이렇게 커?" —
     예전엔 후기 사진 폭을 따라갔는데, 폰의 후기 사진은 화면 폭을 거의 다 써서 커플 사진도 화면만큼 커졌음) — 390폰 약 148px(2.2장), 360폰 137px, 넓어도 220px까지 */
  .board-list .review-thumb { height: auto !important; aspect-ratio: 1 / 1 !important; }
  .board-list .review-thumb img { width: 100%; height: 100% !important; object-fit: cover; }
  .couple-insta-section .instaView .lview > div { width: clamp(130px, 38vw, 220px) !important; height: clamp(130px, 38vw, 220px) !important; }

  /* ② 내리면 머리띠는 올라가고 맨 위에 탭 3개 */
  #header { transition: transform .25s ease; }
  html.mm-down #header { transform: translateY(-110%); }
  #mm-tabs { display: grid; grid-template-columns: repeat(3, 1fr); position: fixed; top: 0; left: 0; right: 0; z-index: 10000; height: 60px; background: rgba(18,12,26,.55); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); transform: translateY(-110%); transition: transform .25s ease; box-shadow: 0 10px 26px rgba(0,0,0,.22); }
  #mm-tabs::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(244,93,168,.85), rgba(139,92,246,.85), transparent); }
  html.mm-down #mm-tabs { transform: none; }
  #mm-tabs a { position: relative; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.88) !important; font-size: 17.5px; font-weight: 700; letter-spacing: -.04em; text-decoration: none; text-shadow: 0 1px 6px rgba(0,0,0,.4); }
  #mm-tabs a.on { color: #fff !important; }
  #mm-tabs a.on::after { content: ''; position: absolute; left: 26%; right: 26%; bottom: 9px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #f45da8, #8b5cf6); box-shadow: 0 0 10px rgba(244,93,168,.6); }

  /* ☰ 메뉴 — 어두운 전체 화면 */
  #mm-menu { display: block; position: fixed; inset: 0; z-index: 2147483640; background: radial-gradient(circle at 12% 0%, rgba(244,93,168,.20), transparent 42%), radial-gradient(circle at 100% 30%, rgba(139,92,246,.20), transparent 45%), #0f0d14; color: #fff; overflow-y: auto; opacity: 0; visibility: hidden; transform: translateY(-12px); transition: opacity .2s, transform .2s, visibility 0s .2s; }
  html.mm-menu-open #mm-menu { opacity: 1; visibility: visible; transform: none; transition: opacity .2s, transform .2s; }
  html.mm-menu-open, html.mm-menu-open body { overflow: hidden; }
  .mm-mtop { position: relative; display: flex; align-items: center; justify-content: center; height: 84px; }
  .mm-mtop img { width: 66px; height: auto; display: block; }
  .mm-mx { position: absolute; left: 8px; top: 20px; width: 44px; height: 44px; border: 0; border-radius: 12px; background: rgba(255,255,255,.08); color: #fff; font-size: 21px; font-weight: 300; cursor: pointer; line-height: 1; }
  .mm-mapply { position: absolute; right: 12px; top: 23px; display: inline-flex; align-items: center; height: 38px; padding: 0 15px; border-radius: 999px; background: linear-gradient(135deg, #f45da8, #8b5cf6); color: #fff !important; font-size: 14px; font-weight: 800; text-decoration: none; }
  .mm-mlist { padding: 6px 0 0; }
  .mm-m1 { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 58px; padding: 0 24px; border: 0; border-top: 1px solid rgba(255,255,255,.08); background: transparent; color: #fff !important; font-size: 18px; font-weight: 700; letter-spacing: -.04em; text-align: left; text-decoration: none; cursor: pointer; }
  .mm-m1 i { font-style: normal; color: rgba(255,255,255,.45); font-size: 16px; transition: transform .2s; }
  .mm-g.open .mm-m1 i { transform: rotate(90deg); color: #f45da8; }
  .mm-m2 { display: none; padding: 0 0 10px; }
  .mm-g.open .mm-m2 { display: block; }
  .mm-m2 a { display: flex; align-items: center; gap: 10px; padding: 11px 24px 11px 34px; color: rgba(255,255,255,.78) !important; font-size: 15.5px; text-decoration: none; }
  .mm-m2 a::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #f45da8; box-shadow: 0 0 10px rgba(244,93,168,.8); }
  .mm-mfoot { display: flex; gap: 8px; padding: 22px 20px 32px; border-top: 1px solid rgba(255,255,255,.08); }
  .mm-mfoot a { flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 6px; height: 48px; border-radius: 999px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #fff !important; font-size: 14.5px; font-weight: 700; text-decoration: none; }
  html.mm-menu-open #chatFabWrap, html.mm-menu-open .scroll-top { display: none !important; }

  /* ⑦ 메인 달력 바로 위 '내가 참여할 수 있는 기수 찾기' — 위(배너)·아래(달력 칸) 간격 똑같이 40px */
  .mm-find + div .recruit-calendar-board { padding-top: 34px !important; }
  .mm-find { display: block; margin: 40px 16px 6px; padding: 20px 18px 18px; border-radius: 24px; background: linear-gradient(135deg, #f45da8 0%, #a46cf3 55%, #8b5cf6 100%); color: #fff; position: relative; overflow: hidden; box-shadow: 0 16px 36px rgba(139,92,246,.28); }
  .mm-find::before { content: ''; position: absolute; right: -50px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: rgba(255,255,255,.12); }
  .mm-find > * { position: relative; }
  .mm-find h3 { margin: 0; font-size: 19px; font-weight: 800; letter-spacing: -.05em; color: #fff; }
  .mm-find p { margin: 4px 0 0; font-size: 13px; color: rgba(255,255,255,.92); letter-spacing: -.03em; }
  .mm-frow { display: flex; gap: 8px; margin-top: 14px; }
  .mm-fy { flex: 1 1 0; min-width: 0; display: flex; align-items: center; height: 48px; padding: 0 14px; border-radius: 999px; background: #fff; }
  .mm-fy input { flex: 1 1 0; min-width: 0; width: 0; border: 0; outline: 0; background: transparent; font-size: 17px; font-weight: 700; color: #222; letter-spacing: .02em; padding: 0; }
  .mm-fy input::placeholder { color: #b9a5f5; font-weight: 600; font-size: 15px; }
  .mm-fy span { font-size: 14px; font-weight: 700; color: #5B34C9; margin-left: 4px; white-space: nowrap; }
  .mm-fg { display: flex; flex: 0 0 auto; height: 48px; padding: 4px; border-radius: 999px; background: rgba(255,255,255,.2); }
  .mm-fg button { border: 0; background: transparent; color: #fff; font-size: 16px; font-weight: 800; width: 44px; border-radius: 999px; cursor: pointer; font-family: inherit; }
  .mm-fg button.on { background: #fff; color: #5B34C9; }
  .mm-fgo { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 10px; height: 50px; border: 0; border-radius: 999px; background: #1a1426; color: #fff; font-size: 16px; font-weight: 800; letter-spacing: -.04em; cursor: pointer; font-family: inherit; }
  .mm-fmsg { margin: 8px 0 0; font-size: 13px; font-weight: 700; color: #fff; min-height: 0; }
  .mm-fmsg:empty { display: none; }

  /* 첫 화면 팝업은 site.js가 폰 폭에 맞게 통째로 줄임 · 페이지가 옆으로 13px 밀리던 것 막기 */
  #swiper_popup { left: 50% !important; transform-origin: top center; }
  #wrap { overflow-x: clip; }
}

/* ════════ 🦶 새 푸터 — 10-28 푸터 시안 사장님 확정 (폰) · 10-30 PC도 새 푸터(사장님 "모바일에 맞춰 만든 걸 PC에도") — PC 모양은 맨 아래 '🖥 PC에도' ════════ */
@media all {
  #footer { display: none !important; }
  #yf { display: block; position: relative; overflow: hidden; background: #17151c; color: #fff; padding: 34px 18px 110px; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; letter-spacing: -.02em; line-height: 1.5; word-break: keep-all; text-align: left; }
  #yf::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, #f45da8 30%, #8b5cf6 70%, transparent); }
  #yf::after { content: ''; position: absolute; left: 50%; top: -130px; width: 420px; height: 240px; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(244,93,168,.16), transparent); pointer-events: none; }
  #yf a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
  #yf button { font-family: inherit; letter-spacing: inherit; color: inherit; -webkit-tap-highlight-color: transparent; }
  #yf .yf-in { position: relative; z-index: 1; max-width: 520px; margin: 0 auto; }
  #yf .yf-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  #yf .yf-logo { font-family: 'Gowun Batang', 'Noto Serif KR', 'Batang', serif; font-size: 28px; font-weight: 700; line-height: 1; letter-spacing: .06em; color: #fff; }
  #yf .yf-sns { display: flex; gap: 8px; }
  #yf .yf-sns a { width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); display: flex; align-items: center; justify-content: center; }
  #yf .yf-sns img { width: 21px; height: auto; filter: brightness(0) invert(1); opacity: .85; }
  #yf .yf-lab { margin: 28px 0 10px; font-size: 13px; font-weight: 700; color: rgba(255,255,255,.55); letter-spacing: .02em; }
  #yf .yf-call { display: grid; grid-template-columns: 1.32fr 1fr; gap: 8px; }
  #yf .yf-call a { display: flex; align-items: center; gap: 10px; min-height: 62px; padding: 10px 12px; border-radius: 16px; }
  #yf .yf-call i { font-style: normal; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; background: rgba(255,255,255,.2); }
  #yf .yf-call span { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
  #yf .yf-call small { font-size: 12px; font-weight: 600; opacity: .85; }
  #yf .yf-call b { font-size: 15.5px; font-weight: 800; letter-spacing: -.03em; white-space: nowrap; }
  #yf .yf-tel { background: linear-gradient(135deg, #f45da8, #8b5cf6); box-shadow: 0 10px 26px rgba(244,93,168,.28); }
  #yf .yf-kakao { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); }
  #yf .yf-kakao i { background: #FEE500; color: #3c1e1e; }
  #yf .yf-docs { border-radius: 18px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); overflow: hidden; }
  #yf .yf-docs button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 54px; padding: 0 16px; border: 0; background: none; text-align: left; cursor: pointer; font-size: 15.5px; font-weight: 600; color: #fff; }
  #yf .yf-docs button + button { border-top: 1px solid rgba(255,255,255,.09); }
  #yf .yf-docs button:active { background: rgba(255,255,255,.06); }
  #yf .yf-docs i { font-style: normal; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 9px; background: rgba(255,255,255,.1); display: flex; align-items: center; justify-content: center; font-size: 15px; }
  #yf .yf-docs span { flex: 1 1 auto; }
  #yf .yf-docs em { font-style: normal; font-size: 20px; line-height: 1; color: rgba(255,255,255,.45); }
  #yf .yf-docs .key span { font-weight: 800; }
  #yf .yf-docs .key span::after { content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 6px; vertical-align: 3px; border-radius: 50%; background: #f45da8; }
  #yf .yf-place { display: flex; gap: 12px; margin-top: 10px; padding: 14px 16px; border-radius: 18px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
  #yf .yf-place i { font-style: normal; font-size: 18px; line-height: 1.3; }
  #yf .yf-place b { display: block; font-size: 15px; font-weight: 800; }
  #yf .yf-place span { display: block; margin-top: 3px; font-size: 13px; line-height: 1.6; color: rgba(255,255,255,.62); }
  #yf .yf-biz { margin-top: 22px; border-top: 1px solid rgba(255,255,255,.1); }
  #yf .yf-biz summary { display: flex; align-items: center; justify-content: space-between; list-style: none; cursor: pointer; padding: 16px 2px; font-size: 14px; font-weight: 700; color: rgba(255,255,255,.72); }
  #yf .yf-biz summary::-webkit-details-marker { display: none; }
  #yf .yf-biz summary em { font-style: normal; font-size: 12px; transition: transform .2s; }
  #yf .yf-biz[open] summary em { transform: rotate(180deg); }
  #yf .yf-biz dl { margin: 0 0 4px; padding: 0 2px; }
  #yf .yf-biz dl div { display: flex; gap: 12px; padding: 4px 0; font-size: 13px; line-height: 1.55; }
  #yf .yf-biz dt { flex: 0 0 92px; color: rgba(255,255,255,.45); }
  #yf .yf-biz dd { margin: 0; color: rgba(255,255,255,.75); }
  #yf .yf-copy { margin: 14px 2px 0; font-size: 12px; color: rgba(255,255,255,.35); }
}

/* ════════ 📄 약관 읽기 창 (site.js ysDocOpen) — 폰 푸터 약관 줄 · 앞으로 예약 신청서 '자세히 보기'도 같이. 폰은 아래에서 올라오는 판 ════════ */
#yd { position: fixed; inset: 0; z-index: 2147483646; background: rgba(20,24,22,.55); display: flex; align-items: flex-end; justify-content: center; }
#yd[hidden] { display: none; }
#yd .yd-box { width: 100%; max-height: 92vh; max-height: 92dvh; display: flex; flex-direction: column; background: #F8F8F6; border-radius: 20px 20px 0 0; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.28); font-family: 'Pretendard', 'Noto Sans KR', sans-serif; letter-spacing: -.02em; color: #222; line-height: 1.5; text-align: left; }
#yd .yd-head { position: relative; flex: 0 0 auto; background: linear-gradient(120deg, #1F5B49 0%, #2C7A61 100%); color: #fff; padding: 18px 60px 16px 18px; overflow: hidden; }
#yd .yd-head::after { content: ''; position: absolute; right: -50px; top: -70px; width: 200px; height: 200px; border-radius: 50%; background: rgba(255,255,255,.08); }
#yd .yd-tag { position: relative; z-index: 1; display: inline-block; font-size: 12.5px; font-weight: 700; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.4); border-radius: 999px; padding: 3px 11px; }
#yd .yd-head h4 { position: relative; z-index: 1; margin: 10px 0 0; font-size: 19.5px; font-weight: 800; letter-spacing: -.05em; display: flex; gap: 10px; align-items: center; color: #fff; word-break: keep-all; }
#yd .yd-head h4 i { font-style: normal; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 18px; }
#yd .yd-x { position: absolute; z-index: 2; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.45); background: rgba(255,255,255,.14); color: #fff; font-size: 17px; font-weight: 700; cursor: pointer; line-height: 1; }
#yd .yd-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 12px; }
#yd .yd-load { padding: 40px 10px; text-align: center; color: #5F6661; font-size: 15px; }
#yd .yd-card { background: #fff; border: 1px solid #D9DED8; border-radius: 14px; padding: 14px; margin-top: 10px; }
#yd .yd-card:first-child { margin-top: 0; }
#yd .yd-card h5 { margin: 0 0 10px; padding-left: 11px; border-left: 4px solid #1F5B49; font-size: 16px; font-weight: 800; color: #1F5B49; line-height: 1.35; word-break: keep-all; }
#yd .yd-card p { margin: 8px 0 0; font-size: 14.5px; line-height: 1.75; color: #333; word-break: keep-all; }
#yd .yd-card h5 + p, #yd .yd-card > p:first-child, #yd .yd-card h5 + ul, #yd .yd-card > ul:first-child { margin-top: 0; }
#yd .yd-card ul { margin: 8px 0 0; padding: 0; list-style: none; }
#yd .yd-card li { position: relative; padding-left: 18px; margin-top: 6px; font-size: 14.5px; line-height: 1.7; color: #333; word-break: keep-all; }
#yd .yd-card li:first-child { margin-top: 0; }
#yd .yd-card li::before { content: ''; position: absolute; left: 4px; top: .72em; width: 7px; height: 7px; border-radius: 50%; background: #8B5CF6; }
#yd .yd-card li.n { padding-left: 0; }
#yd .yd-card li.n::before { display: none; }
#yd .yd-card li.sub { padding-left: 14px; color: #5F6661; font-size: 14px; }
#yd .yd-card .note { background: #FEF3DC; border: 1.5px solid #F59E0B; border-radius: 12px; padding: 11px 14px; color: #4A3000; font-weight: 600; }
#yd .yd-card .hl { color: #B45309; font-weight: 800; }
#yd .yd-foot { flex: 0 0 auto; display: flex; padding: 12px 16px; padding-bottom: calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #E6E9E5; }
#yd .yd-foot button { flex: 1 1 auto; height: 52px; border: 1px solid #D9DED8; border-radius: 999px; background: #fff; color: #222; font: 700 15.5px/1 'Pretendard', sans-serif; cursor: pointer; }
html.yd-open, html.yd-open body { overflow: hidden; }
html.yd-open #chatFabWrap { display: none !important; }
@media (min-width: 769px) {
  #yd { align-items: center; padding: 20px; }
  #yd .yd-box { max-width: 660px; max-height: calc(100vh - 40px); border-radius: 20px; }
}
/* 🏠 (10-28) 첫 화면 팝업 — 관리 프로그램에서 넣은 사진 (assets/site.js ysPopupShow) · 지금 팝업은 설정 읽는 동안 가림 */
.ys-home-wait .main_wrap_pop_up,.ys-home-wait #dimm_roll_popup{visibility:hidden!important}
#ys-pop{position:fixed;inset:0;z-index:2147483000;background:rgba(0,0,0,.55);display:flex;align-items:flex-start;justify-content:center;padding-top:8vh}
#ys-pop .ys-pop-box{width:min(560px,calc(100% - 24px));max-height:84vh;display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.35)}
#ys-pop .ys-pop-img{position:relative;background:#eee;min-height:0;display:flex;justify-content:center}
#ys-pop .ys-pop-img img{display:block;width:100%;max-height:calc(84vh - 48px);object-fit:contain}
#ys-pop .ys-pop-img img.go{cursor:pointer}
#ys-pop .ys-pop-nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:20px;line-height:1;cursor:pointer}
#ys-pop .ys-pop-nav.p{left:8px}#ys-pop .ys-pop-nav.n{right:8px}
#ys-pop .ys-pop-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;border-top:1px solid #e3e3e3;font-size:13px;color:#666}
#ys-pop .ys-pop-bar i{width:9px;height:9px;border-radius:50%;background:#bbb}#ys-pop .ys-pop-bar i.on{background:#000}
#ys-pop .ys-pop-bar button{border:0;background:none;font-family:inherit;font-size:13px;color:#666;cursor:pointer;padding:4px 2px}
#ys-pop .ys-pop-bar button.day{margin-left:auto}
#ys-pop .ys-pop-bar button.x{font-weight:800;color:#333;margin-left:10px}

/* ── (10-29) 메인 '이연시는 어떤 곳인가요?' 카드 4개에 사진 — 사진 위, 번호는 사진 왼쪽 위, 아이콘은 사진 아래에 걸치게
   (카드 HTML은 도구\polish.py가 사진 칸을 넣음 · 폰은 2칸씩) */
.yeonsi-about-cards.ys-ab-photos .yeonsi-about-card { padding: 0 0 28px; min-height: 0; }
.yeonsi-about-cards.ys-ab-photos .yeonsi-about-card::before { display: none; }
.ys-ab-photo { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: #f3eefb; }
.ys-ab-photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.yeonsi-about-cards.ys-ab-photos .yeonsi-about-card:hover .ys-ab-photo img { transform: scale(1.05); }
.yeonsi-about-cards.ys-ab-photos .yeonsi-card-num { position: absolute; top: 14px; left: 14px; right: auto; z-index: 2; margin: 0; box-shadow: 0 4px 12px rgba(0,0,0,.14); }
.yeonsi-about-cards.ys-ab-photos .yeonsi-about-icon { position: relative; z-index: 2; width: 64px; height: 64px; border-radius: 22px; margin: -32px auto 16px; border: 3px solid #fff; box-shadow: 0 10px 24px rgba(109,40,217,.16); }
.yeonsi-about-cards.ys-ab-photos .yeonsi-about-icon svg { width: 36px; height: 36px; }
.yeonsi-about-cards.ys-ab-photos .yeonsi-about-card h3,
.yeonsi-about-cards.ys-ab-photos .yeonsi-about-card p { padding: 0 18px; }
@media (min-width: 769px) and (max-width: 1024px) {
  .ys-ab-photo { aspect-ratio: 16 / 10; }
}
@media (max-width: 768px) {
  .yeonsi-about-cards.ys-ab-photos { grid-template-columns: 1fr 1fr; gap: 12px; }
  .yeonsi-about-cards.ys-ab-photos .yeonsi-about-card { display: block; padding: 0 0 16px; border-radius: 22px; text-align: center; }
  .yeonsi-about-cards.ys-ab-photos .yeonsi-card-num { top: 10px; left: 10px; height: 22px; padding: 0 9px; font-size: 10.5px; }
  .yeonsi-about-cards.ys-ab-photos .yeonsi-about-icon { grid-row: auto; width: 46px; height: 46px; border-radius: 16px; margin: -23px auto 9px; border-width: 2px; }
  .yeonsi-about-cards.ys-ab-photos .yeonsi-about-icon svg { width: 26px; height: 26px; }
  .yeonsi-about-cards.ys-ab-photos .yeonsi-about-card h3 { padding: 0 8px; font-size: 15.5px; margin-bottom: 5px; letter-spacing: -.06em; }
  .yeonsi-about-cards.ys-ab-photos .yeonsi-about-card p { padding: 0 8px; font-size: 12.8px; line-height: 1.42; }
}

/* ── (10-29) 프라이빗 공간 사진 — 몇 번째 사진인지 점으로 (site.js가 점을 만듦) · 폰 화살표 조금 크게 */
.ys-pv-dots { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 4; display: flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; background: rgba(0,0,0,.32); pointer-events: none; }
.ys-pv-dots i { width: 7px; height: 7px; border-radius: 4px; background: rgba(255,255,255,.55); transition: width .2s ease, background .2s ease; }
.ys-pv-dots i.on { width: 18px; background: #fff; }
@media (max-width: 768px) {
  .ys-private-slider .ys-private-arrow { width: 42px; height: 42px; box-shadow: 0 6px 18px rgba(0,0,0,.22); }
}

/* ── (10-29) 폰 첫 화면 화살표 — 맨 아래 숫자 옆(작음) → '모집현황 보기' 버튼 줄 양옆에 조금 크게 (손가락으로 밀어도 넘어감) */
@media (max-width: 768px) {
  .yeonsi-hero button.ys-nav,
  .yeonsi-hero button.ys-nav:hover { top: 50.5%; bottom: auto; width: 44px; height: 44px; transform: translateY(-50%); background: rgba(0,0,0,.38); border: 1px solid rgba(255,255,255,.34); box-shadow: 0 6px 18px rgba(0,0,0,.3); }
  .yeonsi-hero button.ys-nav.prev { left: 10px; right: auto; }
  .yeonsi-hero button.ys-nav.next { right: 10px; left: auto; }
}

/* ── (10-29) 폰 맨 아래 로고 글씨 — 이(제) 연(애를) 시(작할 때) : 큰 글자 옆에 작은 글씨 */
#yf .yf-logo b { font-weight: 700; }
#yf .yf-logo small { font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-size: 11.5px; font-weight: 600; letter-spacing: -.02em; color: rgba(255,255,255,.72); margin: 0 7px 0 2px; }
#yf .yf-logo small:last-child { margin-right: 0; }

/* ── (10-29) 테스트 표시 띠 — 폰에서 탭 줄(모집현황·리얼 후기·1:1 소개)이 내려오면 가운데 글자를 가려서 그동안만 숨김 (테스트 주소에만 있는 띠) */
#ys-test-badge { transition: opacity .2s ease; }
html.mm-down #ys-test-badge { opacity: 0; }

/* ── (10-29) 메인 '참여방법 한눈에 보기' — 양옆 화살표(site.js가 만듦) + 점 크게·누르기 쉽게 */
.ys-pc-arrow { position: absolute; top: calc(50% - 43px); z-index: 9; width: 44px; height: 44px; padding: 0; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: rgba(20,14,28,.55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 8px 20px rgba(0,0,0,.35); cursor: pointer; transition: background .2s ease; }
.ys-pc-arrow:hover { background: rgba(244,93,168,.55); }
.ys-pc-arrow::before { content: ''; position: absolute; left: 50%; top: 50%; width: 11px; height: 11px; border-left: 2.5px solid #fff; border-bottom: 2.5px solid #fff; }
.ys-pc-arrow.prev { left: max(12px, calc(50% - 290px)); }
.ys-pc-arrow.next { right: max(12px, calc(50% - 290px)); }
.ys-pc-arrow.prev::before { transform: translate(-35%, -50%) rotate(45deg); }
.ys-pc-arrow.next::before { transform: translate(-65%, -50%) rotate(-135deg); }
.yeonsi-process-slider .process-dots { gap: 10px; }
.yeonsi-process-slider .process-dots button { position: relative; width: 10px; height: 10px; }
.yeonsi-process-slider .process-dots button.active { width: 30px; }
.yeonsi-process-slider .process-dots button::after { content: ''; position: absolute; inset: -12px -5px; }
@media (max-width: 768px) {
  .ys-pc-arrow { width: 40px; height: 40px; top: calc(50% - 41px); }
  .ys-pc-arrow.prev { left: 6px; }
  .ys-pc-arrow.next { right: 6px; }
}

/* ── (10-29) 첫 화면 글 줄바꿈 — 폰에서 낱말 중간에서 안 잘리게(keep-all) + 1번 제목만 폰에서 한 번 더 끊음(polish.py가 br.ys-mbr 넣음) */
.yeonsi-hero .ys-title br.ys-mbr, .yeonsi-hero .ys-desc br.ys-mbr { display: none; }
@media (max-width: 768px) {
  .yeonsi-hero .ys-title, .yeonsi-hero .ys-desc { word-break: keep-all; }
  .yeonsi-hero .ys-title br.ys-mbr, .yeonsi-hero .ys-desc br.ys-mbr { display: inline; }
}

/* ── (10-29) 메인 팝업 — 사진을 한 줄로 놓고 미끄러지듯 넘김 + 손가락 따라 끌림 (site.js ysPopupDraw·ysPopupSwipe) */
#ys-pop .ys-pop-img { display: block; overflow: hidden; touch-action: pan-y; }
#ys-pop .ys-pop-track { display: flex; transition: transform .45s cubic-bezier(.22,.61,.36,1); will-change: transform; }
#ys-pop .ys-pop-slide { flex: 0 0 100%; display: flex; align-items: center; justify-content: center; background: #eee; }
#ys-pop .ys-pop-slide img { -webkit-user-drag: none; user-select: none; }

/* ── (10-29) 메인 미니 육각형 칸 — B 내용 정리형 (어두운 카드·배지 그대로, 글은 polish.py MINI_NEW) */
.ys-signature-content .ys-mh-lead { font-size: 24px; line-height: 1.45; font-weight: 800; color: #fff; letter-spacing: -.05em; word-break: keep-all; }
.ys-mh-chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 22px 0 26px; padding: 0; list-style: none; }
/* 칸 모양·분홍 동그라미 = 원래 설명 칸(.ys-signature-list li)과 같게 (10-29 사장님 "아이콘 촌스러워, 원래 분홍 동그라미로") */
.ys-mh-chips li { position: relative; display: block; padding: 15px 14px 14px 44px; border-radius: 20px; background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.075)); border: 1px solid rgba(255,255,255,.22); box-shadow: 0 14px 34px rgba(0,0,0,.13); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); word-break: keep-all; }
.ys-mh-chips li::before { content: ''; position: absolute; left: 18px; top: 21px; width: 12px; height: 12px; border-radius: 50%; background: #ff4fac; box-shadow: 0 0 0 6px rgba(255,79,172,.13), 0 0 20px rgba(255,79,172,.62); }
.ys-mh-chips b { display: block; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-size: 15.5px; line-height: 1.4; font-weight: 800; color: #fff; letter-spacing: -.04em; }
.ys-mh-chips span { display: block; margin-top: 3px; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-size: 13px; line-height: 1.4; color: rgba(255,255,255,.74); }
.ys-mh-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.ys-mh-btns .ys-signature-btn { position: static; left: auto; right: auto; bottom: auto; margin: 0; }   /* 원래는 카드 바닥에 고정(absolute) — 링크와 나란히 놓으려고 글 흐름으로 */
.ys-mh-sub { font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-size: 15px; font-weight: 700; color: rgba(255,255,255,.88) !important; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 600px) {
  .ys-signature-content .ys-mh-lead { font-size: 19px; }
  .ys-mh-chips { grid-template-columns: 1fr; gap: 8px; margin: 18px 0 22px; }
  .ys-mh-chips li { padding: 12px 14px 12px 42px; border-radius: 18px; }
  .ys-mh-chips li::before { left: 17px; top: 50%; margin-top: -6px; }
  .ys-mh-chips b { font-size: 15px; }
  .ys-mh-chips span { font-size: 12.5px; }
}
.ys-signature-content .ys-mh-lead .ys-signature-highlight { display: inline-block; margin-top: 0; white-space: nowrap; }
.ys-signature-content .ys-mh-lead .ys-signature-highlight::before { content: none; }   /* 폰에서 강조 앞 줄바꿈(원래 규칙) 끔 — 큰 글 2줄 */

/* ── (10-29 사장님 시안 '신청버튼_시안' 확정) 메인 신청 버튼 — ① 폰 맨 아래 신청 바(site.js applyBar) ② 중간 신청 칸 3곳(polish.py INLINE_CTA)
   위 탭 줄 반투명은 #mm-tabs 줄에서 같이 바꿈(.9 → .55 + 흐림) */
#ysc-bar { display: none; }
@media (max-width: 768px) {
  #ysc-bar { display: flex; gap: 10px; align-items: center; position: fixed; left: 0; right: 0; bottom: 0; z-index: 99990; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.56); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); border-top: 1px solid rgba(255,255,255,.6); box-shadow: 0 -8px 24px rgba(40,20,60,.10); transform: translateY(110%); transition: transform .28s ease; }
  html.ysc-on #ysc-bar { transform: none; }
  #ysc-bar .ysc-main { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; height: 50px; border-radius: 15px; background: linear-gradient(135deg, #f45da8, #8b5cf6); color: #fff !important; font: 800 16.5px 'Pretendard', 'Noto Sans KR', sans-serif; letter-spacing: -.04em; text-decoration: none; box-shadow: 0 8px 20px rgba(244,93,168,.35); }
  #ysc-bar .ysc-kakao { flex: 0 0 50px; height: 50px; border-radius: 15px; background: #FEE500; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 16px rgba(0,0,0,.12); }
  #chatFabWrap { transition: transform .28s ease; }
  html.ysc-on #chatFabWrap { transform: translateY(-74px); }
  html.ysc-on .scroll-top { bottom: 74px !important; transition: bottom .28s ease; }
  html.mm-menu-open #ysc-bar, html.yd-open #ysc-bar { display: none; }
}
.ysc-inline { padding: 26px 16px; background: #f7f1ff; }
.ysc-card { max-width: 860px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; border-radius: 22px; background: #fff; border: 1.5px solid rgba(244,93,168,.28); box-shadow: 0 12px 30px rgba(120,60,160,.10); font-family: 'Pretendard', 'Noto Sans KR', sans-serif; }
.ysc-card p { margin: 0; font-size: 17px; font-weight: 800; color: #241b2b; letter-spacing: -.04em; line-height: 1.45; word-break: keep-all; }
.ysc-card p small { display: block; margin-top: 3px; font-size: 13.5px; font-weight: 600; color: #6d6375; }
.ysc-card a { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; height: 46px; padding: 0 20px; border-radius: 999px; background: linear-gradient(135deg, #f45da8, #8b5cf6); color: #fff !important; font-size: 15px; font-weight: 800; text-decoration: none; white-space: nowrap; box-shadow: 0 8px 20px rgba(244,93,168,.3); }
@media (max-width: 768px) {
  .ysc-inline { padding: 20px 14px; }
  .ysc-card { flex-direction: column; align-items: stretch; text-align: center; gap: 12px; padding: 18px 16px; }
  .ysc-card p { font-size: 16px; }
  .ysc-card a { justify-content: center; height: 48px; }
}

/* ── (10-29) 폰 모든 쪽 — 한글이 낱말 중간에서 안 끊기게 (예: '진행됩 / 니다' '두가 / 지' '기수 / 를') — 너무 긴 낱말만 칸 끝에서 끊음 */
@media (max-width: 768px) {
  #wrap { word-break: keep-all; overflow-wrap: break-word; }
}

/* ════════ 🖥 (10-30 사장님) 폰에만 넣었던 것을 PC에도 — ① 새 푸터 ② 달력 위 '내 기수 찾기' ③ 숫자 아래 한 줄 ④ AI ✕ (769px 이상) ════════ */
@media (min-width: 769px) {
  /* ① 새 푸터 — 맨 위 로고·SNS 한 줄, 아래 3칸(상담 문의 / 이용 안내 / 장소·사업자 정보) */
  #yf { padding: 60px 40px 44px; }
  #yf::after { width: 1000px; height: 340px; top: -190px; }
  #yf .yf-in { max-width: 1160px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto auto 1fr auto; column-gap: 40px; align-items: start; }
  #yf .yf-top { grid-column: 1 / -1; grid-row: 1; padding-bottom: 26px; border-bottom: 1px solid rgba(255,255,255,.09); }
  #yf .yf-logo { font-size: 32px; }
  #yf .yf-logo small { font-size: 12.5px; }
  #yf .yf-sns a { width: 44px; height: 44px; transition: background .2s; }
  #yf .yf-sns a:hover { background: rgba(255,255,255,.16); }
  #yf .yf-in > .yf-lab:nth-of-type(1) { grid-column: 1; grid-row: 2; }
  #yf .yf-in > .yf-lab:nth-of-type(2) { grid-column: 2; grid-row: 2; }
  #yf .yf-call { grid-column: 1; grid-row: 3 / span 2; align-self: start; grid-template-columns: 1fr; gap: 10px; }
  #yf .yf-call a { min-height: 70px; padding: 12px 18px; transition: transform .15s, filter .2s; }
  #yf .yf-call a:hover { transform: translateY(-2px); filter: brightness(1.08); }
  #yf .yf-call b { font-size: 18px; }
  #yf .yf-docs { grid-column: 2; grid-row: 3 / span 2; align-self: start; }
  #yf .yf-docs button { min-height: 56px; transition: background .2s; }
  #yf .yf-docs button:hover { background: rgba(255,255,255,.07); }
  #yf .yf-place { grid-column: 3; grid-row: 3; margin-top: 0; }
  #yf .yf-biz { grid-column: 3; grid-row: 4; align-self: start; margin-top: 10px; border-top: 0; padding: 0 16px; border-radius: 18px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); }
  #yf .yf-biz summary { padding: 14px 0; }
  #yf .yf-copy { grid-column: 1 / -1; grid-row: 5; margin: 34px 0 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.08); }
  #yf .yf-in > .yf-lab { margin-top: 30px; }

  /* ② 메인 달력 바로 위 '내가 참여할 수 있는 기수 찾기' — 한 줄(제목 · 출생연도 · 남/여 · 찾기) */
  .mm-find, .mm-find * { box-sizing: border-box; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; }
  .mm-find { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; column-gap: 12px; width: calc(100% - 48px); max-width: 1100px; margin: 64px auto 0; padding: 26px 30px; border-radius: 28px; background: linear-gradient(135deg, #f45da8 0%, #a46cf3 55%, #8b5cf6 100%); color: #fff; position: relative; overflow: hidden; box-shadow: 0 18px 40px rgba(139,92,246,.26); }
  .mm-find::before { content: ''; position: absolute; right: -60px; top: -90px; width: 260px; height: 260px; border-radius: 50%; background: rgba(255,255,255,.12); }
  .mm-find > * { position: relative; }
  .mm-find h3 { grid-column: 1; grid-row: 1; margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -.05em; color: #fff; }
  .mm-find > p:not(.mm-fmsg) { grid-column: 1; grid-row: 2; margin: 6px 0 0; font-size: 15px; color: rgba(255,255,255,.92); letter-spacing: -.03em; }
  .mm-frow { grid-column: 2; grid-row: 1 / span 2; display: flex; gap: 8px; }
  .mm-fy { width: 240px; display: flex; align-items: center; height: 56px; padding: 0 18px; border-radius: 999px; background: #fff; }
  .mm-fy input { flex: 1 1 0; min-width: 0; width: 0; border: 0; outline: 0; background: transparent; font-size: 18px; font-weight: 700; color: #222; letter-spacing: .02em; padding: 0; }
  .mm-fy input::placeholder { color: #b9a5f5; font-weight: 600; font-size: 15.5px; }
  .mm-fy span { font-size: 15px; font-weight: 700; color: #5B34C9; margin-left: 4px; white-space: nowrap; }
  .mm-fg { display: flex; flex: 0 0 auto; height: 56px; padding: 5px; border-radius: 999px; background: rgba(255,255,255,.2); }
  .mm-fg button { border: 0; background: transparent; color: #fff; font-size: 17px; font-weight: 800; width: 52px; border-radius: 999px; cursor: pointer; font-family: inherit; }
  .mm-fg button.on { background: #fff; color: #5B34C9; }
  .mm-fgo { grid-column: 3; grid-row: 1 / span 2; display: flex; align-items: center; justify-content: center; height: 56px; padding: 0 28px; border: 0; border-radius: 999px; background: #1a1426; color: #fff; font-size: 17px; font-weight: 800; letter-spacing: -.04em; cursor: pointer; font-family: inherit; white-space: nowrap; transition: background .2s; }
  .mm-fgo:hover { background: #2c2142; }
  .mm-fmsg { grid-column: 1 / -1; grid-row: 3; margin: 12px 0 0; font-size: 14px; font-weight: 700; color: #fff; }
  .mm-fmsg:empty { display: none; }
  .mm-find + div .recruit-calendar-board { padding-top: 56px !important; }

  /* ③ 첫 화면 숫자 4칸 아래 한 줄 — 숫자 칸(아래 105px)과 쪽 번호(아래 46px) 사이 가운데 */
  .mm-since { display: flex; align-items: center; justify-content: center; gap: 9px; position: absolute; z-index: 6; left: 0; right: 0; bottom: 70px; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-size: 15px; line-height: 22px; font-weight: 600; letter-spacing: -.03em; color: rgba(255,255,255,.86); pointer-events: none; }
  .mm-since::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #f45da8; box-shadow: 0 0 12px #f45da8; }
  .mm-since b { font-weight: 800; color: #fff; }

  /* ④ AI 상담 버튼 ✕ — 'AI' 글자는 아래 가운데로, 그 자리(오른쪽 위)에 ✕ (폰과 같은 모양) */
  #chatFab .ai-tag { top: auto !important; bottom: -7px !important; right: auto !important; left: 50% !important; transform: translateX(-50%); }
  .mm-ai-x { display: flex; position: absolute; top: -4px; right: -4px; left: auto; bottom: auto; z-index: 2147483647 !important; width: 26px; height: 26px; border-radius: 50%; border: 0; background: rgba(32,28,40,.9); color: #fff; font: 800 12.5px/1 'Pretendard', 'Noto Sans KR', sans-serif; cursor: pointer; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,.28); padding: 0; }
  .mm-ai-x:hover { background: #000; }
}
/* 좁은 PC·태블릿(769~1023px): 푸터 2칸 · 기수 찾기는 제목 아래 한 줄 */
@media (min-width: 769px) and (max-width: 1023px) {
  #yf .yf-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: none; }
  #yf .yf-call { grid-row: 3; }
  #yf .yf-place { grid-column: 1; grid-row: 4; margin-top: 10px; }
  #yf .yf-biz { grid-column: 1 / -1; grid-row: 5; }
  #yf .yf-copy { grid-row: 6; }
  .mm-find { grid-template-columns: minmax(0, 1fr) auto; row-gap: 0; }
  .mm-find h3, .mm-find > p:not(.mm-fmsg) { grid-column: 1 / -1; }
  .mm-frow { grid-column: 1; grid-row: 3; margin-top: 16px; }
  .mm-fy { flex: 1 1 0; width: auto; }
  .mm-fgo { grid-column: 2; grid-row: 3; margin-top: 16px; }
  .mm-fmsg { grid-row: 4; }
}