/* ===========================================================
   화면 아래에 따라다니는 바 — 폰용 홈(m.html)과 같은 모양으로 맞춘 것
   2026-08-25

   ⚠️ 이 파일은 옛 웹플로우 페이지 7개에서만 부릅니다.
      (옥상·지붕·주차장·외벽·테라스·이중복합·시공사례)
      견적신청 페이지엔 원래 바가 없고, index 는 PC용이라 없습니다.

   ⚠️ m.css 를 그대로 가져오면 안 됩니다. m.css 에는 html{font-size:62.5%} 와
      전체 box-sizing 같은 '페이지 전체' 규칙이 들어 있어서, 웹플로우 페이지에
      씌우면 배치가 통째로 무너집니다. 그래서 여기서는 px 로 다시 적었습니다.

   ⚠️ 바에만 쓰이는 클래스만 건드립니다(link-block-20/21, div-block-142/143).
      div-block-140·text-block-83 은 다른 곳에도 쓰이므로 자식 선택으로만 좁혀 씁니다.
   =========================================================== */

/* 바 전체 — 화면 아래 고정, 가운데 정렬, 폰 폭(430px)까지만 */
.w-layout-blockcontainer.senter.bottom.mobile > .div-block-140 {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 430px; z-index: 40;
  display: flex; gap: 10px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  margin: 0;
  background: rgba(255, 255, 255, .97);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border: 0; border-top: 1px solid #e3e1db;   /* ⚠️ 좌우·아래 테두리를 지워야 홈과 폭이 같아집니다 */
  box-sizing: border-box; height: auto;
}

/* 두 버튼 공통
   ⚠️ height:auto 가 꼭 필요합니다 — 웹플로우가 버튼·속칸·글자에 각각 35px·91px·74px 로
      높이를 못 박아 둬서, 안 풀면 글자가 버튼 밖으로 밀려 나옵니다. */
.div-block-140 > a.link-block-20,
.div-block-140 > a.link-block-21 {
  display: block; text-decoration: none; box-sizing: border-box;
  border-radius: 7px; padding: 14px; margin: 0; height: auto; min-width: 0;
  text-align: center; font-size: 15.5px; line-height: 1.65;   /* ★ 폰용 홈(m.css)과 같은 값 — 다르면 크기가 달라집니다 */
}
/* ⚠️ 반드시 link-block-20/21 까지 붙여서 좁힙니다.
      div-block-140 과 text-block-83 은 페이지 안 다른 곳에도 쓰여서, 그냥 두면 거기까지 바뀝니다. */
.div-block-140 > a.link-block-20 .div-block-142,
.div-block-140 > a.link-block-21 .div-block-143 {
  display: block; height: auto; width: auto;
  margin: 0; padding: 0; background: none; border: 0;
}
/* 전화 상담 — 앞에 전화 아이콘. ★ 16px = 아이콘 크기 · 6px = 글자와의 사이 */
.div-block-140 > a.link-block-21 .div-block-143 {
  display: flex; align-items: center; justify-content: center; gap: 6px;
}
.div-block-140 .ico-tel { flex: none; display: block; width: 19px; height: 19px; fill: currentColor; color: #16171a; }   /* ★ 아이콘 크기 */
.div-block-140 > a.link-block-20 .text-block-83,
.div-block-140 > a.link-block-21 .text-block-83 {
  font-family: Pretendard, -apple-system, "Apple SD Gothic Neo", sans-serif;
  font-size: 15.5px; font-weight: 700; line-height: 1.65;
  height: auto; width: auto; margin: 0; padding: 0; letter-spacing: -0.01em;
}

/* 왼쪽 — 전화 상담 (테두리만) */
.div-block-140 > a.link-block-21 {
  flex: 2; border: 1.5px solid #16171a; background: none;
}
.div-block-140 > a.link-block-21 .text-block-83 { color: #16171a; }

/* 오른쪽 — 무료 견적 받기 (빨강 채움) */
.div-block-140 > a.link-block-20 {
  flex: 3; background: #a11d1f; border: 1.5px solid #a11d1f;
}
.div-block-140 > a.link-block-20 .text-block-83 { color: #fff !important; }
.div-block-140 > a.link-block-20:active { background: #8a1719; border-color: #8a1719; }

/* 원래 있던 전화 아이콘은 안 씁니다 (폰용 홈과 같게 — 글자만) */
.div-block-140 .image-196 { display: none; }
