/* ===================================================== CEO SHIELD MOBILE ACTION FINAL V5.2 최종 확인 이미지 기준 ===================================================== */ /* ---------- 공통 ---------- */ .ceo-v52-card{ position:relative !important; box-sizing:border-box !important; display:flex !important; flex-direction:column !important; align-items:flex-start !important; justify-content:flex-start !important; min-width:0 !important; padding:14px 13px 12px !important; border-radius:13px !important; border:1px solid rgba(255,255,255,.16) !important; overflow:hidden !important; text-align:left !important; text-decoration:none !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 7px 17px rgba(0,0,0,.18) !important; cursor:pointer !important; } /* 기존 카드 기능은 그대로 유지하고 이전 패치에서 생성된 시각 요소만 숨김 */ .ceo-v52-card .ceo-v50-title, .ceo-v52-card .ceo-v50-sub, .ceo-v52-card .ceo-v50-icon, .ceo-v52-card .ceo-v50-arrow, .ceo-v52-card .ceo-old-exact-icon-v49, .ceo-v52-card .ceo-v48-old-icon, .ceo-v52-card .ceo-old-icon-v47, .ceo-v52-card .ceo-v46-icon, .ceo-v52-card .ceo-sms-v511-title, .ceo-v52-card .ceo-sms-v511-sub, .ceo-v52-card .ceo-sms-v511-icon, .ceo-v52-card .ceo-sms-v511-arrow, .ceo-v52-card .ceo-v51-push-title, .ceo-v52-card .ceo-v51-push-sub, .ceo-v52-card .ceo-v51-push-icon, .ceo-v52-card .ceo-v51-push-arrow, .ceo-v52-card .ceo-v51-detail-title, .ceo-v52-card .ceo-v51-detail-sub, .ceo-v52-card .ceo-v51-detail-icon, .ceo-v52-card .ceo-v51-detail-arrow{ display:none !important; } /* V5.2 표시 내용 */ .ceo-v52-title{ position:absolute !important; top:14px !important; left:13px !important; margin:0 !important; padding:0 !important; color:#fff !important; font-size:13px !important; line-height:1.1 !important; font-weight:950 !important; letter-spacing:-.15px !important; z-index:60 !important; pointer-events:none !important; } .ceo-v52-sub{ position:absolute !important; top:34px !important; left:13px !important; margin:0 !important; padding:0 !important; color:rgba(255,255,255,.86) !important; font-size:8px !important; line-height:1.15 !important; font-weight:800 !important; white-space:nowrap !important; z-index:60 !important; pointer-events:none !important; } .ceo-v52-icon{ position:absolute !important; left:13px !important; bottom:12px !important; width:42px !important; height:42px !important; box-sizing:border-box !important; display:flex !important; align-items:center !important; justify-content:center !important; border-radius:11px !important; background:rgba(255,255,255,.17) !important; border: 1px solid rgba(255,255,255,.12) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.16) !important; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important; font-size:22px !important; line-height:1 !important; z-index:60 !important; pointer-events:none !important; } .ceo-v52-arrow{ position:absolute !important; right:10px !important; bottom:19px !important; margin:0 !important; padding:0 !important; color:#fff !important; font-family:Arial,sans-serif !important; font-size:26px !important; line-height:1 !important; font-weight:500 !important; z-index:61 !important; pointer-events:none !important; } /* ===================================================== 상단 4개 ===================================================== */ .ceo-v52-top{ min-height:112px !important; height:112px !important; } /* 전화 */ .ceo-v52-phone{ background: linear-gradient( 145deg, #4eb748 0%, #31973c 100% ) !important; border-color: rgba(100,220,104,.56) !important; } /* 문자 - 반드시 BLUE */ .ceo-v52-sms{ background: linear-gradient( 145deg, #6682f5 0%, #506ce8 48%, #3853cf 100% ) !important; border-color: rgba(139,164,255,.90) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.20), 0 7px 18px rgba(40,67,190,.30) !important; } /* 문자 제목/아이콘 위치를 별도로 다시 강제. 이전 CSS보다 이 파일이 마지막 로드됨. */ .ceo-v52-sms .ceo-v52-title{ top:14px !important; left:13px !important; } .ceo-v52-sms .ceo-v52-sub{ top:34px !important; left:13px !important; } .ceo-v52-sms .ceo-v52-icon{ top:auto !important; left:13px !important; right:auto !important; bottom:12px !important; background: rgba(255,255,255,.20) !important; } .ceo-v52-sms .ceo-v52-arrow{ top:auto !important; left:auto !important; right:10px !important; bottom:19px !important; } /* 카카오 */ .ceo-v52-kakao{ background: linear-gradient( 145deg, #ffd533 0%, #efbd11 100% ) !important; border-color: rgba(255,223,73,.90) !important; } .ceo-v52-kakao .ceo-v52-title{ color:#171300 !important; } .ceo-v52-kakao .ceo-v52-sub{ color:rgba(41,32,0,.82) !important; } .ceo-v52-kakao .ceo-v52-arrow{ color:#171300 !important; } .ceo-v52-kakao .ceo-v52-icon{ background: radial-gradient( circle at 35% 30%, #ffe88a 0%, #ffd443 42%, #dca915 100% ) !important; } /* 푸시 */ .ceo-v52-push{ background: linear-gradient( 145deg, #9342d5 0%, #741fb2 52%, #561283 100% ) !important; border-color:#a950ec !important; } /* ===================================================== 하단 3개 ===================================================== */ .ceo-v52-bottom{ min-height:96px !important; height:96px !important; padding:13px 12px 10px !important; } .ceo-v52-bottom .ceo-v52-title{ top:13px !important; left:12px !important; } .ceo-v52-bottom .ceo-v52-sub{ top:32px !important; left:12px !important; } .ceo-v52-bottom .ceo-v52-icon{ left:12px !important; bottom:10px !important; width:38px !important; height:38px !important; border-radius:10px !important; font-size:20px !important; } .ceo-v52-bottom .ceo-v52-arrow{ right:10px !important; bottom:17px !important; font-size:25px !important; } /* AI */ .ceo-v52-ai{ background: linear-gradient( 145deg, #e55b49 0%, #c64034 100% ) !important; border-color: rgba(255,116,93,.72) !important; } /* 업로드 */ .ceo-v52-history{ background: linear-gradient( 145deg, #58b7c4 0%, #35949f 100% ) !important; border-color: rgba(114,222,230,.60) !important; } /* 상세보기 */ .ceo-v52-detail{ background: linear-gradient( 145deg, #5478d5 0%, #395db9 52%, #294997 100% ) !important; border-color: rgba(132,165,246,.78) !important; } /* ===================================================== 좁은 모바일 ===================================================== */ @media(max-width:430px){ .ceo-v52-top{ min-height:108px !important; height:108px !important; } .ceo-v52-title{ top:12px !important; left:10px !important; font-size:12px !important; } .ceo-v52-sub{ top:30px !important; left:10px !important; font-size:7px !important; } .ceo-v52-icon{ left:10px !important; bottom:10px !important; width:38px !important; height:38px !important; font-size:20px !important; } .ceo-v52-arrow{ right:9px !important; bottom:18px !important; font-size:22px !important; } .ceo-v52-bottom{ min-height:92px !important; height:92px !important; } .ceo-v52-bottom .ceo-v52-title{ top:11px !important; left:10px !important; } .ceo-v52-bottom .ceo-v52-sub{ top:29px !important; left:10px !important; } .ceo-v52-bottom .ceo-v52-icon{ left:10px !important; bottom:9px !important; } } /* ===================================================== CEO SHIELD V5.2.1 PUSH + DETAIL RESTORE ===================================================== */ /* ----------------------------------------------------- 기존 V5.2 visibility:hidden 영향 해제 ----------------------------------------------------- */ .ceo-v521-push > *, .ceo-v521-detail > * { visibility:visible !important; } /* V5.2에서 숨겼던 기존 직접 자식은 다시 보여주지 않고, V5.2.1 전용 시각 요소만 사용. */ .ceo-v521-push > :not(.ceo-v521-title) :not(.ceo-v521-sub) :not(.ceo-v521-icon) :not(.ceo-v521-arrow), .ceo-v521-detail > :not(.ceo-v521-title) :not(.ceo-v521-sub) :not(.ceo-v521-icon) :not(.ceo-v521-arrow) { visibility:hidden !important; } /* ----------------------------------------------------- 푸시 ----------------------------------------------------- */ .ceo-v521-push { position:relative !important; display:flex !important; flex-direction:column !important; align-items:flex-start !important; justify-content:flex-start !important; min-height:112px !important; height:112px !important; box-sizing:border-box !important; padding:14px 13px 12px !important; border-radius:13px !important; background: linear-gradient( 145deg, #9342d5 0%, #741fb2 52%, #561283 100% ) !important; border: 1px solid #a950ec !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 7px 17px rgba(55,13,88,.25) !important; overflow:hidden !important; } .ceo-v521-push .ceo-v521-title { position:absolute !important; top:14px !important; left:13px !important; color:#fff !important; font-size:13px !important; line-height:1.1 !important; font-weight:950 !important; z-index:100 !important; visibility:visible !important; } .ceo-v521-push .ceo-v521-sub { position:absolute !important; top:34px !important; left:13px !important; color:rgba(255,255,255,.86) !important; font-size:8px !important; line-height:1.1 !important; font-weight:800 !important; z-index:100 !important; visibility:visible !important; } .ceo-v521-push .ceo-v521-icon { position:absolute !important; left:13px !important; bottom:12px !important; width:42px !important; height:42px !important; display:flex !important; align-items:center !important; justify-content:center !important; border-radius:11px !important; background:rgba(255,255,255,.17) !important; border: 1px solid rgba(255,255,255,.12) !important; font-size:22px !important; z-index:100 !important; visibility:visible !important; } .ceo-v521-push .ceo-v521-arrow { position:absolute !important; right:10px !important; bottom:19px !important; color:#fff !important; font-size:26px !important; line-height:1 !important; font-weight:500 !important; z-index:100 !important; visibility:visible !important; } /* ----------------------------------------------------- 상세보기 ----------------------------------------------------- */ .ceo-v521-detail { position:relative !important; display:flex !important; flex-direction:column !important; align-items:flex-start !important; justify-content:flex-start !important; min-height:96px !important; height:96px !important; box-sizing:border-box !important; padding:13px 12px 10px !important; border-radius:12px !important; background: linear-gradient( 145deg, #5478d5 0%, #395db9 52%, #294997 100% ) !important; border: 1px solid rgba(132,165,246,.78) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 6px 15px rgba(20,42,95,.23) !important; overflow:hidden !important; } .ceo-v521-detail .ceo-v521-title { position:absolute !important; top:13px !important; left:12px !important; color:#fff !important; font-size:13px !important; line-height:1.1 !important; font-weight:950 !important; z-index:100 !important; visibility:visible !important; } .ceo-v521-detail .ceo-v521-sub { position:absolute !important; top:32px !important; left:12px !important; color:rgba(255,255,255,.83) !important; font-size:8px !important; line-height:1.1 !important; font-weight:800 !important; z-index:100 !important; visibility:visible !important; } .ceo-v521-detail .ceo-v521-icon { position:absolute !important; left:12px !important; bottom:10px !important; width:38px !important; height:38px !important; display:flex !important; align-items:center !important; justify-content:center !important; border-radius:10px !important; background:rgba(255,255,255,.16) !important; border: 1px solid rgba(255,255,255,.11) !important; color:#fff !important; font-size:20px !important; z-index:100 !important; visibility:visible !important; } .ceo-v521-detail .ceo-v521-arrow { position:absolute !important; right:10px !important; bottom:17px !important; color:#fff !important; font-size:25px !important; line-height:1 !important; font-weight:500 !important; z-index:100 !important; visibility:visible !important; } /* 좁은 모바일 */ @media(max-width:430px){ .ceo-v521-push{ min-height:108px !important; height:108px !important; } .ceo-v521-push .ceo-v521-title{ top:12px !important; left:10px !important; } .ceo-v521-push .ceo-v521-sub{ top:30px !important; left:10px !important; } .ceo-v521-push .ceo-v521-icon{ left:10px !important; bottom:10px !important; width:38px !important; height:38px !important; } .ceo-v521-push .ceo-v521-arrow{ right:9px !important; bottom:18px !important; } .ceo-v521-detail{ min-height:92px !important; height:92px !important; } } /* ===================================================== CEO SHIELD V5.2.2 PUSH / DETAIL STABLE DISPLAY DOM 내부 내용에 의존하지 않고 CSS로 직접 표시 ===================================================== */ /* ----------------------------------------------------- 푸시 ----------------------------------------------------- */ .ceo-v522-push{ position:relative !important; display:block !important; min-height:112px !important; height:112px !important; box-sizing:border-box !important; padding:0 !important; overflow:hidden !important; border-radius:13px !important; background: linear-gradient( 145deg, #9342d5 0%, #741fb2 52%, #561283 100% ) !important; border: 1px solid #a950ec !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 7px 17px rgba(55,13,88,.25) !important; color:#fff !important; } /* 기존 내부 표시가 어떤 JS에 의해 바뀌어도 화면에는 영향을 주지 않게 함. */ .ceo-v522-push > *{ visibility:hidden !important; } /* 제목 + 설명 + 아이콘을 CSS가 직접 그림 */ .ceo-v522-push::before{ content: "푸시\A" "푸시 보내기\A" "\A" "🔔"; white-space:pre !important; position:absolute !important; left:13px !important; top:14px !important; width:60px !important; height:86px !important; box-sizing:border-box !important; color:#fff !important; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif !important; font-size:13px !important; line-height:1.55 !important; font-weight:950 !important; z-index:500 !important; visibility:visible !important; pointer-events:none !important; } /* > */ .ceo-v522-push::after{ content:">" !important; position:absolute !important; right:10px !important; bottom:18px !important; color:#fff !important; font-family:Arial,sans-serif !important; font-size:22px !important; line-height:1 !important; font-weight:700 !important; z-index:501 !important; visibility:visible !important; pointer-events:none !important; } /* 아이콘 위치가 old_mobile처럼 아래로 보이도록 🔔 줄 위치 조정용 */ .ceo-v522-push{ --ceo-push-stable:1; } /* ----------------------------------------------------- 상세보기 ----------------------------------------------------- */ .ceo-v522-detail{ position:relative !important; display:block !important; min-height:96px !important; height:96px !important; box-sizing:border-box !important; padding:0 !important; overflow:hidden !important; border-radius:12px !important; background: linear-gradient( 145deg, #5478d5 0%, #395db9 52%, #294997 100% ) !important; border: 1px solid rgba(132,165,246,.78) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 6px 15px rgba(20,42,95,.23) !important; color:#fff !important; } .ceo-v522-detail > *{ visibility:hidden !important; } /* 제목 + 설명 + 목록 아이콘 */ .ceo-v522-detail::before{ content: "상세보기\A" "더 많은 정보\A" "\A" "☷"; white-space:pre !important; position:absolute !important; left:12px !important; top:12px !important; width:85px !important; height:78px !important; color:#fff !important; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif !important; font-size:13px !important; line-height:1.45 !important; font-weight:950 !important; z-index:500 !important; visibility:visible !important; pointer-events:none !important; } /* > */ .ceo-v522-detail::after{ content:">" !important; position:absolute !important; right:10px !important; bottom:16px !important; color:#fff !important; font-family:Arial,sans-serif !important; font-size:22px !important; line-height:1 !important; font-weight:700 !important; z-index:501 !important; visibility:visible !important; pointer-events:none !important; } /* ----------------------------------------------------- 이전 V5.2.1 표시요소는 중복 방지 ----------------------------------------------------- */ .ceo-v522-push .ceo-v521-title, .ceo-v522-push .ceo-v521-sub, .ceo-v522-push .ceo-v521-icon, .ceo-v522-push .ceo-v521-arrow, .ceo-v522-detail .ceo-v521-title, .ceo-v522-detail .ceo-v521-sub, .ceo-v522-detail .ceo-v521-icon, .ceo-v522-detail .ceo-v521-arrow{ display:none !important; } /* 모바일 */ @media(max-width:430px){ .ceo-v522-push{ min-height:108px !important; height:108px !important; } .ceo-v522-push::before{ left:10px !important; top:12px !important; font-size:12px !important; } .ceo-v522-push::after{ right:9px !important; bottom:17px !important; font-size:20px !important; } .ceo-v522-detail{ min-height:92px !important; height:92px !important; } .ceo-v522-detail::before{ left:10px !important; top:11px !important; font-size:12px !important; } .ceo-v522-detail::after{ right:9px !important; bottom:15px !important; font-size:20px !important; } }