@charset "utf-8";
/* ==========================================================================
   온나라이삿짐센터 브랜드 override
   작성: 2026-08-25

   theme/oncap 의 CSS 를 수정하지 않고 뒤에 덧붙여 덮어씁니다.
   (extend/gut_custom.extend.php 가 우선순위 99 로 마지막에 로드)

   여기서는 "브랜딩에 필요한 최소한"만 건드립니다.
   레이아웃과 견적 화면 스타일은 oncap 원본을 그대로 씁니다.
   ========================================================================== */

:root {
    /* 온나라 브랜드 색상 — 필요할 때 이 값만 바꾸면 됩니다 */
    --gut-brand:      #1E4DB7;
    --gut-brand-deep: #173A7A;
}

/* --------------------------------------------------------------------------
   1. 로고 — 온나라 로고는 온캡 로고와 가로세로 비율이 달라 높이를 맞춥니다.
   -------------------------------------------------------------------------- */
.zim-logo img {
    max-height: 46px;
    width: auto;
    object-fit: contain;
}
.zim-mobile-logo img {
    max-height: 38px;
    width: auto;
    object-fit: contain;
}
.footer-logo {
    max-height: 44px;
    width: auto;
    object-fit: contain;
}

@media (max-width: 768px) {
    .zim-logo img { max-height: 38px; }
    .footer-logo  { max-height: 38px; }
}

/* --------------------------------------------------------------------------
   2. ONCAP 플랫폼 푸터 크롬 숨김 (kfooter 가 정본)
      상담폼(#plustok-fab, #mobile_consult_bar)은 footer 밖이라 유지됩니다.
      카카오상담은 퀵메뉴·푸터에서 완전히 제거합니다.
   -------------------------------------------------------------------------- */
footer.site-footer:not(.gut-site-footer),
.site-footer .footer-cta,
.site-footer .footer-trust,
.site-footer .footer-main,
.site-footer .footer-seo,
.site-footer .footer-bottom,
.site-footer .sns-list,
.site-footer .oncap-pc-only-section,
.oncap-compact-footer,
#ft.oncap-compact-footer,
.oncap-compact-footer .m-footer-cta,
.oncap-compact-footer .m-ssl-box,
#plustok-fab {
    display: none !important;
}

.cta-btn.kakao,
a.cta-btn[href*="pf.kakao.com"],
a[aria-label="카카오톡 상담하기"],
a[aria-label="카카오채널"],
.sns-list a[href*="pf.kakao.com"] {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* ONCAP 다크 푸터 표면 → 기존것 #ft 와 동일한 밝은 하단 */
.site-footer,
.gut-site-footer,
.oncap-compact-footer,
#ft.oncap-compact-footer {
    background: #f5f6f8 !important;
    color: #333 !important;
    border-top: 0 !important;
    padding: 0 !important;
}
.site-footer .footer-bottom { padding: 0 !important; }
.site-footer a {
    color: #333 !important;
}

/* --------------------------------------------------------------------------
   3. 상담센터 전화번호 — 링크로 바뀌었으므로 색을 원래대로 유지합니다.
   -------------------------------------------------------------------------- */
.cs-info .cs-number a {
    color: inherit;
    text-decoration: none;
}
.cs-info .cs-number a:hover {
    text-decoration: underline;
}

/* ==========================================================================
   5. 하단정보 (kfooter)
   ==========================================================================
   www_기존것/theme/basic/tail.php 의 #ft .kfooter 스타일을 그대로 가져왔습니다.
   원본 선택자는 #ft 였는데 theme/oncap 에도 #ft 가 이미 쓰이고 있어
   (mobile/tail.php:279, skin/tail.php:174, shop.tail.php) 충돌을 피하려고
   .gut-kfooter 네임스페이스로만 감쌌습니다. 규칙 내용은 원본과 동일합니다.
   ========================================================================== */

.gut-kfooter {
    background: #f5f6f8;
    border-top: 1px solid #e5e7eb;
    max-width: 100%;
    overflow-x: hidden;
}
.gut-kfooter * { box-sizing: border-box }
.gut-kfooter a[href^="tel:"],
.gut-kfooter a[href^="mailto:"] {
    color: inherit !important;
    text-decoration: none;
    display: inline !important;
}

.gut-kfooter .kfooter { max-width: 1280px; margin: 0 auto; padding: 22px 20px 18px }
.gut-kfooter .kfooter-inner { display: flex; align-items: flex-start; gap: 16px }
.gut-kfooter .kfooter-logo { flex: 0 0 136px; min-width: 110px }
.gut-kfooter .kfooter-logo img { display: block; max-width: 100%; height: auto }
.gut-kfooter .kfooter-text { flex: 1; min-width: 0; text-align: center }

.gut-kfooter .kfooter-menu {
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
    gap: 8px 12px; list-style: none; padding: 0; margin: 0 0 10px;
    font-weight: 700; font-size: 13px; line-height: 1.4; text-align: center; width: 100%
}
.gut-kfooter .kfooter-menu span { display: inline-flex; align-items: center }
.gut-kfooter .kfooter-menu a { color: #333; text-decoration: none; white-space: nowrap }

.gut-kfooter .kfooter-info {
    display: block; margin: 0; color: #666; font-size: 12px; line-height: 1.55;
    word-break: keep-all; overflow-wrap: anywhere
}
.gut-kfooter .kfooter-info .line { display: block; margin: 0 0 2px }
.gut-kfooter .kfooter-copy { margin: 6px 0 0; color: #777; font-size: 12px; line-height: 1.4 }

@media (max-width:1280px) {
    .gut-kfooter .kfooter { padding: 20px 18px 16px }
}

@media (max-width:1200px) {
    .gut-kfooter .kfooter { padding: 18px 12px 14px }
    .gut-kfooter .kfooter-inner { justify-content: flex-start; align-items: flex-start; gap: 200px }
    .gut-kfooter .kfooter-logo { flex: 0 0 120px; min-width: 120px; max-width: 120px }
    .gut-kfooter .kfooter-text { flex: 1; min-width: 0; max-width: none; text-align: left }
    .gut-kfooter .kfooter-menu { justify-content: flex-start; gap: 6px 10px }
    .gut-kfooter .kfooter-info,
    .gut-kfooter .kfooter-copy { text-align: left }
}

@media (max-width:991px) {
    .gut-kfooter .kfooter { padding: 18px 16px 14px }
    .gut-kfooter .kfooter-inner { justify-content: flex-start; align-items: flex-start; gap: 120px }
    .gut-kfooter .kfooter-logo { flex: 0 0 110px; min-width: 110px; max-width: 110px }
    .gut-kfooter .kfooter-text { flex: 1; min-width: 0; max-width: none; text-align: left }
    .gut-kfooter .kfooter-menu { gap: 6px 10px; font-size: 12px }
    .gut-kfooter .kfooter-copy,
    .gut-kfooter .kfooter-info { font-size: 11px; line-height: 1.5 }
}

@media (max-width:680px) {
    .gut-kfooter .kfooter { padding: 14px 12px 10px }
    .gut-kfooter .kfooter-inner { display: block }
    .gut-kfooter .kfooter-logo { display: block; margin: 0 0 8px; max-width: 112px }
    .gut-kfooter .kfooter-menu { gap: 4px 8px; font-size: 11px }
    .gut-kfooter .kfooter-copy,
    .gut-kfooter .kfooter-info { text-align: left }
    .gut-kfooter .kfooter-info {
        font-size: 10px; line-height: 1.4; white-space: normal;
        word-break: keep-all; overflow-wrap: anywhere; max-width: 100%
    }
    .gut-kfooter .kfooter-info .line { white-space: normal; overflow-wrap: anywhere }
    .gut-kfooter .kfooter-copy { font-size: 10px; margin-top: 3px }
}

@media (max-width:480px) {
    .gut-kfooter .kfooter { padding: 12px 10px 8px }
    .gut-kfooter .kfooter-logo { max-width: 96px }
    .gut-kfooter .kfooter-menu { display: block; margin-bottom: 8px }
    .gut-kfooter .kfooter-menu span { display: inline }
    .gut-kfooter .kfooter-menu span+span:before { content: ' | '; color: #a8a8a8 }
    .gut-kfooter .kfooter-info {
        font-size: 10px; line-height: 1.35; white-space: normal;
        overflow-wrap: anywhere; word-break: keep-all
    }
    .gut-kfooter .kfooter-info .line { display: block; white-space: normal }
    .gut-kfooter .kfooter-copy { font-size: 10px; margin-top: 2px }
}

/* 모바일 하단 고정 상담버튼(#plustok-fab bottom:72px) / 탭바와 겹치지 않게 */
@media (max-width: 768px) {
    .gut-kfooter { padding-bottom: 88px }
}
@media (max-width: 600px) {
    .gut-kfooter { padding-bottom: 96px }
}

/* ONCAP .site-footer a { display:inline-block; color:#94a3b8 } 을 원본 톤으로 */
.site-footer .gut-kfooter a,
.gut-kfooter .kfooter-menu a {
    color: #333 !important;
    text-decoration: none;
}

/* --------------------------------------------------------------------------
   6. PC 드롭다운 · 모바일 아코디언 (g5_menu 2차 메뉴)
   -------------------------------------------------------------------------- */
.zim-header-nav-wrap {
    overflow: visible !important;
}
.zim-nav.gut-nav {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 8px 28px;
    overflow: visible;
    white-space: normal;
}
.gut-nav-item {
    position: relative;
}
.gut-nav-item > a {
    display: inline-block;
    color: #1f2937;
    text-decoration: none;
    font-size: 15px;
    font-weight: 800;
    padding: 10px 0 12px;
}
.gut-nav-item > a:hover,
.gut-nav-item:hover > a {
    color: #1E4DB7;
}
.gut-nav-sub {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 180px;
    padding: 8px 0;
    background: #fff;
    border: 1px solid #e5eaf1;
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .12);
    z-index: 1200;
}
.gut-nav-item:hover .gut-nav-sub,
.gut-nav-item:focus-within .gut-nav-sub {
    display: block;
}
.gut-nav-sub a {
    display: block;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 700;
    color: #334155;
    text-decoration: none;
    white-space: nowrap;
}
.gut-nav-sub a:hover {
    background: #eef4ff;
    color: #1E4DB7;
}

.gut-mo-nav {
    display: flex !important;
    flex-direction: column;
    grid-template-columns: none !important;
}
.gut-mo-group {
    border: 1px solid #eef2f7;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}
.gut-mo-group summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 12px;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
}
.gut-mo-group summary::-webkit-details-marker { display: none; }
.gut-mo-group summary i { color: #1E4DB7; width: 22px; text-align: center; }
.gut-mo-group a {
    display: block !important;
    padding: 10px 14px 10px 42px !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    font-weight: 700 !important;
    background: #f8fafc !important;
}
.gut-mo-group a span { font-size: 14px !important; }

@media (max-width: 1199.98px) {
    .zim-nav.gut-nav { display: none; }
}

/* --------------------------------------------------------------------------
   7. 퀵메뉴 — PC 우측 고정 / 모바일 하단 고정 (같은 #gut-quick-menu)
      전화상담 · 견적신청 · 관리자. 카카오 없음.
      #plustok-fab(상담신청) 은 별도 유지.
   -------------------------------------------------------------------------- */
.gut-quick-menu {
    position: fixed;
    right: 16px;
    bottom: 88px;
    z-index: 2147482900;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-end;
}
.gut-quick-item {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-width: 132px;
    height: 46px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(24, 34, 51, .94);
    color: #fff !important;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(7, 18, 38, .18);
    box-sizing: border-box;
}
.gut-quick-item:hover {
    background: #1E4DB7;
    color: #fff !important;
    transform: translateX(-4px);
}
.gut-quick-item i {
    width: 18px;
    text-align: center;
    font-size: 16px;
}
.gut-quick-admin {
    background: #173A7A;
}

@media (min-width: 769px) {
    .gut-quick-tel {
        display: none !important;
    }
}

@media (max-width: 768px) {
    /* [2026-08-27] 하단 고정 퀵메뉴가 footer 마지막 줄을 덮는 문제
     *
     * .gut-quick-menu 는 position:fixed · bottom:0 · height:56px 이고
     * z-index 가 사실상 최대값이라 무엇을 올려도 이긴다.
     * body 에 여백이 없으면 문서 맨 아래 56px 이 영구히 가려져
     * 사업자정보·Copyright 끝부분을 스크롤로도 볼 수 없다.
     *
     * 실측 (375x812)
     *   footer  h=333 top=479 bottom=812   ← 뷰포트 끝까지 참
     *   프로브  footer 하단 좌표에서 footer 밖 요소가 잡힘 = 덮임
     *   body padding-bottom = 0
     *
     * 퀵메뉴 자체가 safe-area 를 더하므로 여기서도 같이 더한다.
     * 견적 위저드는 이미 같은 방식으로 처리돼 있다
     *   gut-estimate-wizard.css  .gut-simple-panel { padding-bottom: 96px }
     */
    body {
        padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px));
    }

    .gut-quick-menu {
        left: 0;
        right: 0;
        bottom: 0;
        flex-direction: row;
        align-items: stretch;
        justify-content: stretch;
        gap: 0;
        height: 56px;
        padding: 0;
        background: #fff;
        border-top: 1px solid #e5e7eb;
        box-shadow: 0 -2px 12px rgba(0, 0, 0, .08);
        padding-bottom: env(safe-area-inset-bottom);
    }
    .gut-quick-item,
    .gut-quick-item:hover,
    .gut-quick-admin {
        flex: 1;
        min-width: 0;
        height: auto;
        border-radius: 0;
        background: #fff;
        color: #1f2937 !important;
        box-shadow: none;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2px;
        font-size: 11px;
        padding: 6px 4px;
        transform: none;
    }
    .gut-quick-item + .gut-quick-item {
        border-left: 1px solid #f0f0f0;
    }
    .gut-quick-admin {
        color: #173A7A !important;
    }
    .gut-quick-item i {
        font-size: 18px;
        width: auto;
    }

    .premium-mobile-tabbar,
    #mobile_quick_menu {
        display: none !important;
    }

    .gut-kfooter { padding-bottom: 120px; }
    #plustok-fab { bottom: 72px !important; }
}

@media (max-width: 600px) {
    .gut-kfooter { padding-bottom: 128px; }
    #plustok-fab { bottom: 72px !important; }
}

/* --------------------------------------------------------------------------
   8. 홈 크롬 강제 노출 — GNB + kfooter
      ONCAP html/css/style.css 의 #page{overflow:hidden} 과
      footer.site-footer:not(.gut-site-footer){display:none} 이
      헤더 메뉴·하단정보를 가리지 않게 한다.
   -------------------------------------------------------------------------- */
html, body {
    overflow-x: hidden;
    overflow-y: auto !important;
    height: auto !important;
    max-height: none !important;
}
#page,
.page-wrapper,
#wrapper,
#container_wr,
#container {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
}
.site-header.header-style-3 {
    display: block !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 50;
    background: #fff;
}
@media (min-width: 1200px) {
    .site-header .site-navigation,
    .site-header .site-navigation .main-menu,
    .site-header .site-navigation .navigation {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        overflow: visible !important;
    }
    .site-header .site-navigation .navigation > li > a {
        color: #101722 !important;
    }
}
footer.site-footer.gut-site-footer,
.gut-kfooter,
#gut-kfooter {
    display: block !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 2;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    clip: auto !important;
}

/* --------------------------------------------------------------------------
   FAQ 검색 + 분류 칩 (메인·/bbs/faq.php 공용)
   -------------------------------------------------------------------------- */
.gm-faq-tools { margin: 0 0 18px; max-width: 100%; }
.gm-faq-search {
    display: flex;
    align-items: stretch;
    gap: 8px;
    width: 100%;
    margin: 0 0 12px;
}
.gm-faq-search input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    height: 44px;
    padding: 0 14px;
    border: 1px solid #e6eaf0;
    border-radius: 8px;
    background: #fff;
    font-size: 15px;
    color: #16233a;
    box-sizing: border-box;
}
.gm-faq-search input[type="search"]::placeholder { color: #94a3b8; }
.gm-faq-search__btn {
    flex: 0 0 auto;
    height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: 8px;
    background: #0f57d6;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}
.gm-faq-search__btn:hover { background: #0d4ab8; }
.gm-faq-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    max-width: 100%;
}
.gm-faq-cats__chip {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 14px;
    border: 1px solid #e6eaf0;
    border-radius: 999px;
    background: #fff;
    color: #16233a;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    box-sizing: border-box;
}
.gm-faq-cats__chip:hover { border-color: #0f57d6; color: #0f57d6; }
.gm-faq-cats__chip.is-on {
    background: #0f57d6;
    border-color: #0f57d6;
    color: #fff;
}

@media (max-width: 767px) {
    .gm-faq-search { width: 100%; }
    .gm-faq-search__btn { padding: 0 14px; }
    .gm-faq-cats {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        margin-left: -16px;
        margin-right: -16px;
        padding: 0 16px 8px;
        max-width: none;
        width: auto;
    }
    .gm-faq-cats__chip { flex: 0 0 auto; }
}

/* ── 카카오 소셜로그인 숨김 [2026-08-28 사용자 지시] ──
 * 스킨(theme/oncap/skin/member/basic/login.skin.php)은 IMMUTABLE_CORE 라
 * 수정하지 않고 CSS 로만 감춘다. PC·모바일 스킨 모두 #sns_login 블록.
 * 버튼만 숨기면 「소셜계정으로 로그인」 제목과 「또는 아이디로 로그인」
 * 구분선이 빈 채 남으므로 블록과 구분선을 함께 숨긴다.
 * 되살리기 = 이 블록 삭제. */
#mb_login #sns_login,
#mb_login .login-divider {
    display: none !important;
}

/* [2026-08-28] 간편접수 라벨 — 모바일=간편모바일접수 · PC(우측 퀵메뉴)=간편접수 */
.gut-quick-estimate .gut-ql-pc { display: none; }
@media (min-width: 768px) {
  .gut-quick-estimate .gut-ql-m { display: none; }
  .gut-quick-estimate .gut-ql-pc { display: inline; }
}