/* ============================================================ 유성에이스 화이트톤 보정 — 블랙톤 잔재 theme-white.css 뒤에 로드되어 남은 다크 카드를 화이트톤으로 통일 1) 기술및인증현황 USE CASE 카드 3개 2) 제품소개 상담 CTA 박스 3) 홈 3D 프리뷰 패널 4) 푸터 5) 부품소개 제품명 라벨 (밝은 회색 → 안 보임) 6) 공지/게시판 앰버 뱃지 대비 보정 7) 홈 시안 라벨 대비 보정 ============================================================ */ /* 1) page-tech USE CASE 카드 */ #page-tech article[class*="from-[#0b1220]"]{background:#ffffff!important;border-color:#e2e8f0!important;box-shadow:0 14px 34px rgba(15,23,42,.07)!important} #page-tech article[class*="from-[#0b1220]"] h3{color:#0f172a!important} #page-tech article[class*="from-[#0b1220]"] p{color:#475569!important} #page-tech article[class*="from-[#0b1220]"] [class*="text-white"]{color:#64748b!important} #page-tech article[class*="from-[#0b1220]"] .text-lg.font-black[class*="text-white"]{color:#0f172a!important} #page-tech article[class*="from-[#0b1220]"] [class*="border-white"]{border-color:#e2e8f0!important} #page-tech article[class*="from-[#0b1220]"] span[class*="rounded-full"]{background:#eff6ff!important;border-color:#bfdbfe!important;color:#1d4ed8!important} /* 2) page-products 상담 CTA */ #page-products [class*="from-blue-950"]{background:#ffffff!important;border-color:#e2e8f0!important;box-shadow:0 20px 50px rgba(15,23,42,.08)!important} #page-products [class*="from-blue-950"] h3{color:#0f172a!important} #page-products [class*="from-blue-950"] p{color:#475569!important} #page-products [class*="from-blue-950"] [class*="text-white"]{color:#475569!important} #page-products [class*="from-blue-950"] [class*="border-white"]{border-color:#cbd5e1!important} #page-products [class*="from-blue-950"] button[class*="border-white"]{color:#334155!important} #page-products [class*="from-blue-950"] a[class*="bg-white"]{background:#2563eb!important;color:#ffffff!important} /* 3) page-home 3D 프리뷰 패널 (내부 video 영역은 유지) */ #page-home [class*="min-h-[720px]"]{background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%)!important;border:1px solid #e2e8f0!important;color:#334155!important} #page-home [class*="min-h-[720px]"] [class*="text-white"]{color:#334155!important} /* 4) 푸터 */ footer[class*="bg-[#0a0a0a]"]{background:#f8fafc!important;border-top-color:#e2e8f0!important;color:#475569!important} footer[class*="bg-[#0a0a0a]"] [class*="text-white"]{color:#334155!important} footer[class*="bg-[#0a0a0a]"] a{color:#475569!important} footer[class*="bg-[#0a0a0a]"] [class*="border-white"]{border-color:#e2e8f0!important} /* 5) 부품소개 제품명 라벨 — 밝은 회색(text-gray-200)이 흰 배경에서 안 보임 */ #page-parts [class*="text-gray-200"]{color:#0f172a!important} #page-parts [class*="text-gray-300"]{color:#334155!important} /* 6) 공지/게시판 앰버 상태 뱃지 — 밝은 앰버가 흰 배경에서 대비 부족 */ #page-notice [class*="bg-amber-500"][class*="text-amber-400"], #page-board [class*="bg-amber-500"][class*="text-amber-400"]{background:#fef3c7!important;color:#b45309!important;border-color:#fcd34d!important} /* 7) 홈 시안 라벨 — 밝은 시안(text-cyan-300)이 밝은 배경에서 안 보임 */ #page-home [class*="text-cyan-300"]{color:#0e7490!important} /* 8) 옅은 회색 라벨(text-white/20~35 → slate-400)이 흰 배경에서 거의 안 보임 → slate-500(#64748b, 대비 4.8:1)로 상향. 화이트테마 페이지(홈 제외) 전역. theme-white.css 와 동일 선택자·범위, 색상값만 한 단계 진하게. */ .page:not(#page-home) [class*="text-white/3"], .page:not(#page-home) [class*="text-white/2"]{color:#64748b!important} /* 9) 제품소개 옅은 파랑 아이브로(text-blue-300, 흰 배경)이 흐릿 → 진한 파랑 */ #page-products [class*="text-blue-300"]{color:#2563eb!important} /* 10) 네비게이션 호버 애니메이션 통일 (S7) 문제: 드롭다운 캐럿이 제각각(회사·제품 11px / 기술 14px·opacity-50 / 고객센터는 캐럿 없음), 호버 피드백도 항목마다 미묘하게 다름. 해결: 기존 svg 캐럿을 모두 숨기고, 드롭다운 있는 항목에만 동일한 pseudo 캐럿을 부여. 모든 메뉴 호버 = 브랜드색 + 옅은 파랑 pill + 살짝 떠오름 + 동일 트랜지션. 드롭다운 항목은 호버 시 캐럿 180° 회전으로 통일. theme-white.css 뒤에 로드되어 우선 적용. 되돌리기: 이 블록만 삭제. */ #navbar .nav-link{transition:color .2s ease,background-color .2s ease,transform .2s ease!important} #navbar .nav-item:hover>.nav-link,#navbar .nav-link:hover{color:var(--brand)!important;background-color:rgba(30,64,175,.08)!important;transform:translateY(-1px)} #navbar .nav-item:has(.dropdown)>.nav-link{gap:0!important} #navbar .nav-item:has(.dropdown)>.nav-link svg{display:none!important} #navbar .nav-item:has(.dropdown)>.nav-link::after{content:"";display:inline-block;width:0;height:0;margin-left:6px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.55;vertical-align:middle;transition:transform .25s ease,opacity .2s ease;transform-origin:50% 40%} #navbar .nav-item:has(.dropdown):hover>.nav-link::after{transform:rotate(180deg);opacity:1} /* 11) 사용방법 '양옆태엽 스윙 구조의 장점' — 네이비 배경 위 제목이 검게 강제됨(theme-white h2 규칙). 블루/네이비 배경에 검은 글씨는 절대 불가 → 흰 글씨로 복원. 대상: #page-manual 안에서 인라인 그라디언트(#12307a 포함) 카드 내부의 h2 만. 흰 배경 제목은 건드리지 않음. 되돌리기: 이 블록만 삭제. */ #page-manual [style*="12307a"] h2{color:#fff!important} /* 12) 색으로 채워진 버튼/링크 위 흰 글씨가 theme-white 의 '.text-white→어둠' 규칙이나 기타 상속에 먹혀 검/적색으로 보이는 문제(제품 상담문의 버튼 등). 파란/남색/그라디언트 버튼은 흰 글씨 유지. 되돌리기: 이 블록만 삭제. */ #ace-product-modal a[href^="tel:"], #ace-product-modal a.text-white{color:#fff!important} .page:not(#page-home) a.text-white[style*="gradient"], .page:not(#page-home) button.text-white[style*="gradient"], .page:not(#page-home) a[style*="linear-gradient"][href^="tel:"], .page:not(#page-home) [class*="bg-blue-5"].text-white, .page:not(#page-home) [class*="bg-blue-6"].text-white, .page:not(#page-home) [class*="bg-blue-7"].text-white, .page:not(#page-home) [class*="bg-blue-8"].text-white, .page:not(#page-home) [class*="bg-indigo-"].text-white, .page:not(#page-home) [class*="bg-sky-5"].text-white, .page:not(#page-home) [class*="bg-sky-6"].text-white{color:#fff!important} /* 13) 네비 드롭다운 마우스오버 완전 통일 (2026-07-12) 문제: 메뉴별로 hover 배경(회사=black/5, 제품=slate-50, 기술=blue/indigo/cyan-50, 고객센터=red/emerald/amber-50)과 글씨색(부제목 회색 유지 vs 파랑 전환)이 제각각 → 마우스오버 인상이 메뉴마다 다르게 보임. 해결: 드롭다운 안의 모든 항목 hover 배경을 동일한 옅은 파랑(#eff6ff)으로, 제목·부제목 글씨를 모두 브랜드 블루(#2563eb)로 통일. 단, 고객센터 '문의하기' 같은 색 채운 CTA 버튼(bg-blue-600/700, hover:bg-blue-600)은 흰 글씨 유지가 맞으므로 제외한다. 이 파일이 가장 마지막에 로드되어 우선 적용. 되돌리기: 이 블록만 삭제. */ #navbar .dropdown [class*="hover:bg-black"]:hover, #navbar .dropdown [class*="hover:bg-white"]:hover, #navbar .dropdown [class*="hover:bg-gray-50"]:hover, #navbar .dropdown [class*="hover:bg-gray-100"]:hover, #navbar .dropdown [class*="hover:bg-slate-50"]:hover, #navbar .dropdown [class*="hover:bg-slate-100"]:hover, #navbar .dropdown [class*="hover:bg-blue-50"]:hover, #navbar .dropdown [class*="hover:bg-indigo-50"]:hover, #navbar .dropdown [class*="hover:bg-cyan-50"]:hover, #navbar .dropdown [class*="hover:bg-sky-50"]:hover, #navbar .dropdown [class*="hover:bg-red-50"]:hover, #navbar .dropdown [class*="hover:bg-rose-50"]:hover, #navbar .dropdown [class*="hover:bg-emerald-50"]:hover, #navbar .dropdown [class*="hover:bg-green-50"]:hover, #navbar .dropdown [class*="hover:bg-amber-50"]:hover, #navbar .dropdown [class*="hover:bg-orange-50"]:hover{background-color:#eff6ff!important;border-color:#bfdbfe!important} /* 제목·부제목 등 내부 텍스트를 hover 시 브랜드 블루로 통일 (색 채운 CTA 버튼 제외) */ #navbar .dropdown button:not([class*="bg-blue-6"]):not([class*="bg-blue-7"]):not([class*="bg-blue-5"]):hover, #navbar .dropdown button:not([class*="bg-blue-6"]):not([class*="bg-blue-7"]):not([class*="bg-blue-5"]):hover *, #navbar .dropdown a:not([class*="bg-blue-6"]):not([class*="bg-blue-7"]):not([class*="bg-blue-5"]):hover, #navbar .dropdown a:not([class*="bg-blue-6"]):not([class*="bg-blue-7"]):not([class*="bg-blue-5"]):hover *, #navbar .dropdown li:hover > a, #navbar .dropdown li:hover > a *{color:#2563eb!important}