/* =========================
   스킨 독립화 - custom.css 없이도 작동
   외부 의존 변수 자체 정의
========================= */
:root {
    --background-color: #ffffff;
    --background-color-gray: #dadada;
    --base-color-black: #000000;
    --base-color-darkblack: #1a1a1a;
    --base-color-sub-black: #555;
    --base-color-white: #fff;
    --color-accent-red: #c43a31;
    --color-black-rgb: 0, 0, 0;
    --color-gray-100: #f4f4f4;
    --color-gray-150: #ececec;
    --color-gray-200: #eeeeee;
    --color-gray-300: #C0C0C0;
    --color-gray-400: #919191;
    --color-gray-500: #666666;
    --color-gray-600: #555555;
    --color-hex-b94a48: #b94a48;
    --color-ui-input-bg: #d0d3db;
    --color-white-rgb: 255, 255, 255;
    --font-KR-base: "europa", sans-serif;
    --signature-color: #181d60;
    --sidebar-width-min: 14rem;
    --sidebar-width-pref: 18vw;
    --sidebar-width-max: 20rem;
    --sidebar-width: clamp(var(--sidebar-width-min), var(--sidebar-width-pref), var(--sidebar-width-max));
    --svh-100: 100svh;
    --sub-title-font-size-min: 1.375rem;
    --sub-title-font-size-pref: 1.4583vw;
    --sub-title-font-size-max: 2.125rem;
    --sub-title-font-size: clamp(var(--sub-title-font-size-min), var(--sub-title-font-size-pref), var(--sub-title-font-size-max));
    --sub-title-font-size-line-min: 2.125rem;
    --sub-title-font-size-line-pref: 2.0833vw;
    --sub-title-font-size-line-max: 2.875rem;
    --sub-title-font-size-line: clamp(var(--sub-title-font-size-line-min), var(--sub-title-font-size-line-pref), var(--sub-title-font-size-line-max));
    --text-font-size-min: 0.9375rem;
    --text-font-size-pref: 0.8333vw;
    --text-font-size-max: 1.0625rem;
    --text-font-size: clamp(var(--text-font-size-min), var(--text-font-size-pref), var(--text-font-size-max));
    --text-font-size-s-min: 0.875rem;
    --text-font-size-s-pref: 0.7552vw;
    --text-font-size-s-max: 0.9375rem;
    --text-font-size-s: clamp(var(--text-font-size-s-min), var(--text-font-size-s-pref), var(--text-font-size-s-max));

    /* hardcode 변환 신규 토큰 (자동 추가) */
    --space-1: 0.0625rem;
    --space-2-min: 0.0625rem;
    --space-2-pref: 0.13vw;
    --space-2-max: 0.125rem;
    --space-2: clamp(var(--space-2-min), var(--space-2-pref), var(--space-2-max));
    --space-3-min: 0.125rem;
    --space-3-pref: 0.2vw;
    --space-3-max: 0.1875rem;
    --space-3: clamp(var(--space-3-min), var(--space-3-pref), var(--space-3-max));
    --space-4-min: 0.1875rem;
    --space-4-pref: 0.26vw;
    --space-4-max: 0.25rem;
    --space-4: clamp(var(--space-4-min), var(--space-4-pref), var(--space-4-max));
    --space-5-min: 0.25rem;
    --space-5-pref: 0.33vw;
    --space-5-max: 0.3125rem;
    --space-5: clamp(var(--space-5-min), var(--space-5-pref), var(--space-5-max));
    --space-6-min: 0.3125rem;
    --space-6-pref: 0.39vw;
    --space-6-max: 0.375rem;
    --space-6: clamp(var(--space-6-min), var(--space-6-pref), var(--space-6-max));
    --space-8-min: 0.375rem;
    --space-8-pref: 0.52vw;
    --space-8-max: 0.5rem;
    --space-8: clamp(var(--space-8-min), var(--space-8-pref), var(--space-8-max));
    --space-10-min: 0.5rem;
    --space-10-pref: 0.65vw;
    --space-10-max: 0.625rem;
    --space-10: clamp(var(--space-10-min), var(--space-10-pref), var(--space-10-max));
    --space-12-min: 0.625rem;
    --space-12-pref: 0.78vw;
    --space-12-max: 0.75rem;
    --space-12: clamp(var(--space-12-min), var(--space-12-pref), var(--space-12-max));
    --space-13-min: 0.625rem;
    --space-13-pref: 0.85vw;
    --space-13-max: 0.8125rem;
    --space-13: clamp(var(--space-13-min), var(--space-13-pref), var(--space-13-max));
    --space-14-min: 0.6875rem;
    --space-14-pref: 0.91vw;
    --space-14-max: 0.875rem;
    --space-14: clamp(var(--space-14-min), var(--space-14-pref), var(--space-14-max));
    --space-15-min: 0.75rem;
    --space-15-pref: 0.98vw;
    --space-15-max: 0.9375rem;
    --space-15: clamp(var(--space-15-min), var(--space-15-pref), var(--space-15-max));
    --space-18-min: 0.875rem;
    --space-18-pref: 1.17vw;
    --space-18-max: 1.125rem;
    --space-18: clamp(var(--space-18-min), var(--space-18-pref), var(--space-18-max));
    --space-20-min: 1rem;
    --space-20-pref: 1.3vw;
    --space-20-max: 1.25rem;
    --space-20: clamp(var(--space-20-min), var(--space-20-pref), var(--space-20-max));
    --space-26-min: 1.3125rem;
    --space-26-pref: 1.69vw;
    --space-26-max: 1.625rem;
    --space-26: clamp(var(--space-26-min), var(--space-26-pref), var(--space-26-max));
    --space-28-min: 1.375rem;
    --space-28-pref: 1.82vw;
    --space-28-max: 1.75rem;
    --space-28: clamp(var(--space-28-min), var(--space-28-pref), var(--space-28-max));
    --space-32-min: 1.625rem;
    --space-32-pref: 2.08vw;
    --space-32-max: 2rem;
    --space-32: clamp(var(--space-32-min), var(--space-32-pref), var(--space-32-max));
    --space-36-min: 1.8125rem;
    --space-36-pref: 2.34vw;
    --space-36-max: 2.25rem;
    --space-36: clamp(var(--space-36-min), var(--space-36-pref), var(--space-36-max));
    --space-38-min: 1.875rem;
    --space-38-pref: 2.47vw;
    --space-38-max: 2.375rem;
    --space-38: clamp(var(--space-38-min), var(--space-38-pref), var(--space-38-max));
    --space-40-min: 2rem;
    --space-40-pref: 2.6vw;
    --space-40-max: 2.5rem;
    --space-40: clamp(var(--space-40-min), var(--space-40-pref), var(--space-40-max));
    --space-48-min: 2.5rem;
    --space-48-pref: 3.13vw;
    --space-48-max: 3rem;
    --space-48: clamp(var(--space-48-min), var(--space-48-pref), var(--space-48-max));
    --space-50-min: 2.5rem;
    --space-50-pref: 3.26vw;
    --space-50-max: 3.125rem;
    --space-50: clamp(var(--space-50-min), var(--space-50-pref), var(--space-50-max));
    --space-60-min: 3rem;
    --space-60-pref: 3.91vw;
    --space-60-max: 3.75rem;
    --space-60: clamp(var(--space-60-min), var(--space-60-pref), var(--space-60-max));
    --space-100-min: 5rem;
    --space-100-pref: 6.51vw;
    --space-100-max: 6.25rem;
    --space-100: clamp(var(--space-100-min), var(--space-100-pref), var(--space-100-max));
    --space-120-min: 6rem;
    --space-120-pref: 7.81vw;
    --space-120-max: 7.5rem;
    --space-120: clamp(var(--space-120-min), var(--space-120-pref), var(--space-120-max));
    --space-240-min: 12rem;
    --space-240-pref: 15.63vw;
    --space-240-max: 15rem;
    --space-240: clamp(var(--space-240-min), var(--space-240-pref), var(--space-240-max));
    --space-300-min: 15rem;
    --space-300-pref: 19.53vw;
    --space-300-max: 18.75rem;
    --space-300: clamp(var(--space-300-min), var(--space-300-pref), var(--space-300-max));
    --space-400-min: 20rem;
    --space-400-pref: 26.04vw;
    --space-400-max: 25rem;
    --space-400: clamp(var(--space-400-min), var(--space-400-pref), var(--space-400-max));
    --transition-fast: 0.3s ease;

    /* hardcode 변환 신규 토큰 (자동 추가) */
    --space-640-min: 32rem;
    --space-640-pref: 41.67vw;
    --space-640-max: 40rem;
    --space-640: clamp(var(--space-640-min), var(--space-640-pref), var(--space-640-max));
    --space-700-min: 35rem;
    --space-700-pref: 45.57vw;
    --space-700-max: 43.75rem;
    --space-700: clamp(var(--space-700-min), var(--space-700-pref), var(--space-700-max));
    --space-1120-min: 56rem;
    --space-1120-pref: 72.92vw;
    --space-1120-max: 70rem;
    --space-1120: clamp(var(--space-1120-min), var(--space-1120-pref), var(--space-1120-max));
    --transition-quick: 0.15s ease;
    --transition-snappy: 0.2s ease;

    /* hardcode 변환 신규 토큰 (자동 추가) */
    --px-4: 4px;
    --px-12: 12px;
    --px-20: 20px;

    /* hardcode 변환 신규 토큰 (자동 추가) */
    --px-2: 2px;

    /* animation duration 토큰 */
    --anim-spin-slow: 4s linear infinite;

    /* 사용처 clamp 토큰화 (자동 추가) */
    --cv-cert-1-min: 1.25rem;
    --cv-cert-1-pref: 2vw;
    --cv-cert-1-max: 1.875rem;
    --cv-cert-1: clamp(var(--cv-cert-1-min), var(--cv-cert-1-pref), var(--cv-cert-1-max));
    --cv-cert-2-min: 2.5rem;
    --cv-cert-2-pref: 4vw;
    --cv-cert-2-max: 4.375rem;
    --cv-cert-2: clamp(var(--cv-cert-2-min), var(--cv-cert-2-pref), var(--cv-cert-2-max));
    --cv-cert-3-min: 1.5625rem;
    --cv-cert-3-pref: 2.5vw;
    --cv-cert-3-max: 2.5rem;
    --cv-cert-3: clamp(var(--cv-cert-3-min), var(--cv-cert-3-pref), var(--cv-cert-3-max));
    --cv-cert-4-min: 1.25rem;
    --cv-cert-4-pref: 2.5vw;
    --cv-cert-4-max: 2.1875rem;
    --cv-cert-4: clamp(var(--cv-cert-4-min), var(--cv-cert-4-pref), var(--cv-cert-4-max));
    --cv-cert-5-min: 0.6875rem;
    --cv-cert-5-pref: 0.6771vw;
    --cv-cert-5-max: 0.8125rem;
    --cv-cert-5: clamp(var(--cv-cert-5-min), var(--cv-cert-5-pref), var(--cv-cert-5-max));
    --cv-cert-6-min: 1.25rem;
    --cv-cert-6-pref: 2vw;
    --cv-cert-6-max: 2rem;
    --cv-cert-6: clamp(var(--cv-cert-6-min), var(--cv-cert-6-pref), var(--cv-cert-6-max));
    --cv-cert-7-min: 0.625rem;
    --cv-cert-7-pref: 1vw;
    --cv-cert-7-max: 0.875rem;
    --cv-cert-7: clamp(var(--cv-cert-7-min), var(--cv-cert-7-pref), var(--cv-cert-7-max));
    --cv-cert-8-min: 0.5rem;
    --cv-cert-8-pref: 0.7vw;
    --cv-cert-8-max: 0.625rem;
    --cv-cert-8: clamp(var(--cv-cert-8-min), var(--cv-cert-8-pref), var(--cv-cert-8-max));
    --cv-cert-9-min: 1.25rem;
    --cv-cert-9-pref: 1.8vw;
    --cv-cert-9-max: 1.75rem;
    --cv-cert-9: clamp(var(--cv-cert-9-min), var(--cv-cert-9-pref), var(--cv-cert-9-max));
    --cv-cert-10-min: 0.375rem;
    --cv-cert-10-pref: 0.5vw;
    --cv-cert-10-max: 0.4375rem;
    --cv-cert-10: clamp(var(--cv-cert-10-min), var(--cv-cert-10-pref), var(--cv-cert-10-max));
    --cv-cert-11-min: 0.375rem;
    --cv-cert-11-pref: 0.6vw;
    --cv-cert-11-max: 0.5rem;
    --cv-cert-11: clamp(var(--cv-cert-11-min), var(--cv-cert-11-pref), var(--cv-cert-11-max));
    --cv-cert-12-min: 1.875rem;
    --cv-cert-12-pref: 3.125vw;
    --cv-cert-12-max: 3.75rem;
    --cv-cert-12: clamp(var(--cv-cert-12-min), var(--cv-cert-12-pref), var(--cv-cert-12-max));
    --cv-cert-13-min: 1.5625rem;
    --cv-cert-13-pref: 3.9vw;
    --cv-cert-13-max: 5.625rem;
    --cv-cert-13: clamp(var(--cv-cert-13-min), var(--cv-cert-13-pref), var(--cv-cert-13-max));
    --cv-cert-14-min: 0.5rem;
    --cv-cert-14-pref: 0.625vw;
    --cv-cert-14-max: 0.75rem;
    --cv-cert-14: clamp(var(--cv-cert-14-min), var(--cv-cert-14-pref), var(--cv-cert-14-max));
    --cv-cert-15-min: 0.625rem;
    --cv-cert-15-pref: 1vw;
    --cv-cert-15-max: 0.9375rem;
    --cv-cert-15: clamp(var(--cv-cert-15-min), var(--cv-cert-15-pref), var(--cv-cert-15-max));
    --cv-cert-16-min: 0.875rem;
    --cv-cert-16-pref: 0.7813vw;
    --cv-cert-16-max: 0.9375rem;
    --cv-cert-16: clamp(var(--cv-cert-16-min), var(--cv-cert-16-pref), var(--cv-cert-16-max));
    --cv-cert-17-min: 0.375rem;
    --cv-cert-17-pref: 0.6vw;
    --cv-cert-17-max: 0.625rem;
    --cv-cert-17: clamp(var(--cv-cert-17-min), var(--cv-cert-17-pref), var(--cv-cert-17-max));
    --cv-cert-18-min: 0.3125rem;
    --cv-cert-18-pref: 0.6vw;
    --cv-cert-18-max: 0.625rem;
    --cv-cert-18: clamp(var(--cv-cert-18-min), var(--cv-cert-18-pref), var(--cv-cert-18-max));
    --cv-cert-19-min: 3.75rem;
    --cv-cert-19-pref: 6vw;
    --cv-cert-19-max: 6.25rem;
    --cv-cert-19: clamp(var(--cv-cert-19-min), var(--cv-cert-19-pref), var(--cv-cert-19-max));
    --cv-cert-20-min: 1.875rem;
    --cv-cert-20-pref: 3vw;
    --cv-cert-20-max: 3.125rem;
    --cv-cert-20: clamp(var(--cv-cert-20-min), var(--cv-cert-20-pref), var(--cv-cert-20-max));
    --cv-cert-21-min: 8.75rem;
    --cv-cert-21-pref: 12vw;
    --cv-cert-21-max: 12.5rem;
    --cv-cert-21: clamp(var(--cv-cert-21-min), var(--cv-cert-21-pref), var(--cv-cert-21-max));
    --cv-cert-22-min: 1.25rem;
    --cv-cert-22-pref: 2.6042vw;
    --cv-cert-22-max: 3.125rem;
    --cv-cert-22: clamp(var(--cv-cert-22-min), var(--cv-cert-22-pref), var(--cv-cert-22-max));
    --cv-cert-23-min: 1.5625rem;
    --cv-cert-23-pref: 3vw;
    --cv-cert-23-max: 2.5rem;
    --cv-cert-23: clamp(var(--cv-cert-23-min), var(--cv-cert-23-pref), var(--cv-cert-23-max));
    --cv-cert-24-min: 1.25rem;
    --cv-cert-24-pref: 2.5vw;
    --cv-cert-24-max: 2.5rem;
    --cv-cert-24: clamp(var(--cv-cert-24-min), var(--cv-cert-24-pref), var(--cv-cert-24-max));
    --cv-cert-25-min: 2.5rem;
    --cv-cert-25-pref: 6vw;
    --cv-cert-25-max: 3.75rem;
    --cv-cert-25: clamp(var(--cv-cert-25-min), var(--cv-cert-25-pref), var(--cv-cert-25-max));
    --cv-cert-26-min: 0.5rem;
    --cv-cert-26-pref: 1vw;
    --cv-cert-26-max: 0.75rem;
    --cv-cert-26: clamp(var(--cv-cert-26-min), var(--cv-cert-26-pref), var(--cv-cert-26-max));
    --cv-cert-27-min: 2rem;
    --cv-cert-27-pref: 3vw;
    --cv-cert-27-max: 3rem;
    --cv-cert-27: clamp(var(--cv-cert-27-min), var(--cv-cert-27-pref), var(--cv-cert-27-max));
    --cv-cert-28-min: 7rem;
    --cv-cert-28-pref: 10vw;
    --cv-cert-28-max: 12rem;
    --cv-cert-28: clamp(var(--cv-cert-28-min), var(--cv-cert-28-pref), var(--cv-cert-28-max));
    --cv-cert-29-min: 3rem;
    --cv-cert-29-pref: 5vw;
    --cv-cert-29-max: 5rem;
    --cv-cert-29: clamp(var(--cv-cert-29-min), var(--cv-cert-29-pref), var(--cv-cert-29-max));
    --cv-cert-30-min: 1.125rem;
    --cv-cert-30-pref: 1.5vw;
    --cv-cert-30-max: 1.5rem;
    --cv-cert-30: clamp(var(--cv-cert-30-min), var(--cv-cert-30-pref), var(--cv-cert-30-max));
    --cv-cert-31-min: 0.875rem;
    --cv-cert-31-pref: 1vw;
    --cv-cert-31-max: 1rem;
    --cv-cert-31: clamp(var(--cv-cert-31-min), var(--cv-cert-31-pref), var(--cv-cert-31-max));
    --cv-cert-32-min: 0.75rem;
    --cv-cert-32-pref: 0.8vw;
    --cv-cert-32-max: 0.8125rem;
    --cv-cert-32: clamp(var(--cv-cert-32-min), var(--cv-cert-32-pref), var(--cv-cert-32-max));
    --cv-cert-33-min: 0.75rem;
    --cv-cert-33-pref: 1vw;
    --cv-cert-33-max: 1rem;
    --cv-cert-33: clamp(var(--cv-cert-33-min), var(--cv-cert-33-pref), var(--cv-cert-33-max));
    --cv-cert-34-min: 0.8125rem;
    --cv-cert-34-pref: 0.85vw;
    --cv-cert-34-max: 0.9375rem;
    --cv-cert-34: clamp(var(--cv-cert-34-min), var(--cv-cert-34-pref), var(--cv-cert-34-max));
    --cv-cert-35-min: 0.5rem;
    --cv-cert-35-pref: 0.8vw;
    --cv-cert-35-max: 0.75rem;
    --cv-cert-35: clamp(var(--cv-cert-35-min), var(--cv-cert-35-pref), var(--cv-cert-35-max));
    --cv-cert-36-min: 3.125rem;
    --cv-cert-36-pref: 5vw;
    --cv-cert-36-max: 5rem;
    --cv-cert-36: clamp(var(--cv-cert-36-min), var(--cv-cert-36-pref), var(--cv-cert-36-max));
    --cv-cert-37-min: 2.5rem;
    --cv-cert-37-pref: 4vw;
    --cv-cert-37-max: 5rem;
    --cv-cert-37: clamp(var(--cv-cert-37-min), var(--cv-cert-37-pref), var(--cv-cert-37-max));
    --cv-cert-38-min: 1.75rem;
    --cv-cert-38-pref: 3vw;
    --cv-cert-38-max: 3rem;
    --cv-cert-38: clamp(var(--cv-cert-38-min), var(--cv-cert-38-pref), var(--cv-cert-38-max));
    --cv-cert-39-min: 0.875rem;
    --cv-cert-39-pref: 1.5vw;
    --cv-cert-39-max: 1.5rem;
    --cv-cert-39: clamp(var(--cv-cert-39-min), var(--cv-cert-39-pref), var(--cv-cert-39-max));
    --cv-cert-40-min: 2rem;
    --cv-cert-40-pref: 4vw;
    --cv-cert-40-max: 4rem;
    --cv-cert-40: clamp(var(--cv-cert-40-min), var(--cv-cert-40-pref), var(--cv-cert-40-max));
    --cv-cert-41-min: 0.5rem;
    --cv-cert-41-pref: 1vw;
    --cv-cert-41-max: 1rem;
    --cv-cert-41: clamp(var(--cv-cert-41-min), var(--cv-cert-41-pref), var(--cv-cert-41-max));
    --cv-cert-42-min: 0.625rem;
    --cv-cert-42-pref: 1vw;
    --cv-cert-42-max: 1rem;
    --cv-cert-42: clamp(var(--cv-cert-42-min), var(--cv-cert-42-pref), var(--cv-cert-42-max));
    --cv-cert-43-min: 4.5rem;
    --cv-cert-43-pref: 6.5vw;
    --cv-cert-43-max: 6.5rem;
    --cv-cert-43: clamp(var(--cv-cert-43-min), var(--cv-cert-43-pref), var(--cv-cert-43-max));
    --cv-cert-44-min: 0.875rem;
    --cv-cert-44-pref: 0.9vw;
    --cv-cert-44-max: 1rem;
    --cv-cert-44: clamp(var(--cv-cert-44-min), var(--cv-cert-44-pref), var(--cv-cert-44-max));
    --cv-cert-45-min: 0.75rem;
    --cv-cert-45-pref: 1.2vw;
    --cv-cert-45-max: 1.25rem;
    --cv-cert-45: clamp(var(--cv-cert-45-min), var(--cv-cert-45-pref), var(--cv-cert-45-max));
    --cv-cert-46-min: 0.875rem;
    --cv-cert-46-pref: 0.95vw;
    --cv-cert-46-max: 1.0625rem;
    --cv-cert-46: clamp(var(--cv-cert-46-min), var(--cv-cert-46-pref), var(--cv-cert-46-max));
    --cv-cert-47-min: 14rem;
    --cv-cert-47-pref: 20vw;
    --cv-cert-47-max: 22rem;
    --cv-cert-47: clamp(var(--cv-cert-47-min), var(--cv-cert-47-pref), var(--cv-cert-47-max));
    --cv-cert-48-min: 1rem;
    --cv-cert-48-pref: 2vw;
    --cv-cert-48-max: 1.5rem;
    --cv-cert-48: clamp(var(--cv-cert-48-min), var(--cv-cert-48-pref), var(--cv-cert-48-max));

    /* 누락 토큰 추가 */
    --em-0-02: 0.02em;
    --em-0-05: 0.05em;
    --em-0-08: 0.08em;
    --em-0-1: 0.1em;
    --px-1: 1px;
    --vh-100: 100vh;
    /* line-height 토큰 */
    --lh-0: 0;

    /* 자동 변수화 토큰 (fw/op/z) */
    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
    --op-0: 0;
    --op-035: 0.35;
    --op-05: 0.5;
    --op-07: 0.7;
    --op-1: 1;
    --z-1: 1;
    --z-10: 10;
    --z-5: 5;
    --z-999: 999;

}
/* =========================
   인증서 게시판 스킨 : List
========================= */
#bo_cert {
    width: 100%;
}

#bo_cert #bo_btn_top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--cv-cert-1);
}

#bo_cert #bo_list_total {
    font-size: var(--text-font-size);
    color: var(--base-color-sub-black);
}

#bo_cert .btn_bo_user {
    display: flex;
    gap: var(--space-8);
    list-style: none;
    padding: 0;
    margin: 0;
}

#bo_cert .btn_bo_user .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--space-36);
    height: var(--space-36);
    border: 1px solid rgba(var(--color-black-rgb), 0.2);
    border-radius: var(--px-4);
    color: var(--base-color-black);
    text-decoration: none;
    font-size: var(--space-14);
    transition: background-color var(--transition-fast);
}

#bo_cert .btn_bo_user .btn:hover {
    background-color: var(--signature-color);
    color: var(--base-color-white);
    border-color: var(--signature-color);
}

/* 섹션 헤더 */
.raum-cert-section-header {
    text-align: center;
    margin-bottom: var(--cv-cert-2);
}

.raum-cert-section-title {
    font-size: var(--sub-title-font-size);
    line-height: var(--sub-title-font-size-line);
    font-weight: var(--fw-700);
    color: var(--base-color-darkblack);
    margin-bottom: var(--cv-cert-3);
}

/* 관리자 업로드 버튼 */
.raum-cert-admin-btn {
    display: flex;
    justify-content: center;
    margin-top: var(--cv-cert-1);
}

a.raum-cert-upload-btn,
a.raum-cert-upload-btn:link,
a.raum-cert-upload-btn:visited {
    display: inline-block;
    padding: var(--space-10) var(--space-28);
    background-color: var(--signature-color);
    color: var(--base-color-white);
    font-size: var(--text-font-size-s);
    font-weight: var(--fw-400);
    text-decoration: none;
    transition: opacity var(--transition-fast);
}

a.raum-cert-upload-btn:hover {
    opacity: var(--op-07);
    color: var(--base-color-white);
}

/* 카테고리 필터 */
.raum-cert-category {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-5);
    padding: var(--cv-cert-3) 0;
}

.raum-cert-cat-btn {
    display: inline-block;
    padding: var(--px-12) var(--cv-cert-4);
    font-size: var(--cv-cert-5);
    color: var(--base-color-black);
    text-decoration: none;
    border: 1px solid var(--base-color-black);
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.raum-cert-cat-btn:hover {
    background-color: var(--base-color-black);
    color: var(--base-color-white);
}

.raum-cert-cat-btn.active {
    background-color: var(--base-color-black);
    color: var(--base-color-white);
    border-color: var(--base-color-black);
}

/* 관리자 메뉴 (designworks portfolio admin_bar 동형: 하단 fixed floating) */
.raum-cert-admin_bar {
    position: fixed;
    bottom: var(--cv-cert-6);
    left: 50%;
    transform: translateX(-50%);
    z-index: var(--z-999);
    display: flex;
    align-items: center;
    gap: var(--cv-cert-7);
    padding: var(--cv-cert-8) var(--cv-cert-9);
    background: linear-gradient(
        135deg,
        rgba(var(--color-white-rgb), 0.12) 0%,
        rgba(var(--color-white-rgb), 0.06) 50%,
        rgba(var(--color-white-rgb), 0.1) 100%
    );
    backdrop-filter: blur(var(--px-20)) saturate(1.4);
    -webkit-backdrop-filter: blur(var(--px-20)) saturate(1.4);
    border: 1px solid rgba(var(--color-white-rgb), 0.18);
    border-radius: var(--space-50);
    box-shadow:
        0 0.5rem 2rem rgba(var(--color-black-rgb), 0.15),
        inset 0 1px 0 rgba(var(--color-white-rgb), 0.15),
        inset 0 -1px 0 rgba(var(--color-black-rgb), 0.05);
}

.raum-cert-admin_bar_btn,
a.raum-cert-admin_bar_btn,
a.raum-cert-admin_bar_btn:link,
a.raum-cert-admin_bar_btn:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--cv-cert-10);
    font-size: 0;
    line-height: var(--lh-0);
    color: var(--color-gray-500);
    background: var(--color-gray-100);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    transition: background var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
}

@media (hover: hover) {
    .raum-cert-admin_bar_btn:hover,
    a.raum-cert-admin_bar_btn:hover,
    a.raum-cert-admin_bar_btn:active {
        background: rgba(var(--color-white-rgb), 0.18);
        border-color: rgba(var(--color-white-rgb), 0.3);
        color: var(--signature-color);
    }
}

.raum-cert-admin_bar_btn[disabled],
.raum-cert-admin_bar_btn:disabled {
    opacity: var(--op-035);
    cursor: not-allowed;
    pointer-events: none;
}

.raum-cert-admin_bar_btn--settings svg {
    animation: raum-cert-gear-spin var(--anim-spin-slow);
}

@keyframes raum-cert-gear-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.raum-cert-admin_bar_btn--danger {
    color: rgba(255, 120, 120, 0.9);
    border-color: rgba(255, 120, 120, 0.2);
}

@media (hover: hover) {
    .raum-cert-admin_bar_btn--danger:hover {
        background: rgba(255, 80, 80, 0.15);
        border-color: rgba(255, 120, 120, 0.35);
        color: rgba(255, 120, 120, 0.9);
    }
}

/* admin_bar 구분선 */
.raum-cert-admin_bar_divider {
    width: var(--px-1);
    margin: 0 var(--cv-cert-11);
    height: var(--space-20);
    background: rgba(var(--color-white-rgb), 0.2);
    flex-shrink: 0;
}

/* admin_bar 전체선택 */
.raum-cert-admin_bar_chk {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    color: var(--base-color-black);
    font-size: var(--space-14);
    font-weight: var(--fw-600);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    position: relative;
}

.raum-cert-admin_bar_chk input[type="checkbox"] {
    position: absolute;
    opacity: var(--op-0);
    width: 0;
    height: 0;
}

.raum-cert-admin_bar_chk_box {
    position: relative;
    width: var(--space-18);
    height: var(--space-18);
    background: rgba(var(--color-white-rgb), 0.25);
    border: 1px solid rgba(var(--color-white-rgb), 0.4);
    border-radius: var(--space-4);
    transition: background var(--transition-snappy), border-color var(--transition-snappy);
    flex-shrink: 0;
}

.raum-cert-admin_bar_chk_box::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--space-10);
    height: var(--space-10);
    background: var(--signature-color);
    border-radius: var(--space-2);
    transform: translate(-50%, -50%) scale(0);
    opacity: var(--op-0);
    transition: transform var(--transition-snappy), opacity var(--transition-quick);
}

.raum-cert-admin_bar_chk input[type="checkbox"]:checked + .raum-cert-admin_bar_chk_box {
    background: rgba(var(--color-white-rgb), 0.35);
}

.raum-cert-admin_bar_chk input[type="checkbox"]:checked + .raum-cert-admin_bar_chk_box::after {
    transform: translate(-50%, -50%) scale(1);
    opacity: var(--op-1);
}

@media (hover: hover) {
    .raum-cert-admin_bar_chk:hover .raum-cert-admin_bar_chk_box {
        background: rgba(var(--color-white-rgb), 0.3);
    }
}

/* 카드별 체크박스 (좌측 상단) */
.raum-cert-item_chk {
    position: absolute;
    top: var(--cv-cert-7);
    left: var(--cv-cert-7);
    z-index: var(--z-5);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.raum-cert-item_chk input[type="checkbox"] {
    position: absolute;
    opacity: var(--op-0);
    width: 0;
    height: 0;
}

.raum-cert-item_chk_box {
    position: relative;
    width: var(--space-20);
    height: var(--space-20);
    background: var(--base-color-white);
    border: 1px solid rgba(var(--color-black-rgb), 0.25);
    border-radius: var(--space-3);
    transition: background var(--transition-snappy), border-color var(--transition-snappy);
    box-shadow: 0 0.125rem 0.375rem rgba(var(--color-black-rgb), 0.15);
}

.raum-cert-item_chk_box::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--space-10);
    height: var(--space-10);
    background: var(--signature-color);
    border-radius: var(--space-2);
    transform: translate(-50%, -50%) scale(0);
    opacity: var(--op-0);
    transition: transform var(--transition-snappy), opacity var(--transition-quick);
}

.raum-cert-item_chk input[type="checkbox"]:checked + .raum-cert-item_chk_box {
    border-color: var(--signature-color);
}

.raum-cert-item_chk input[type="checkbox"]:checked + .raum-cert-item_chk_box::after {
    transform: translate(-50%, -50%) scale(1);
    opacity: var(--op-1);
}

/* 인증서 리스트 */
.raum-cert-list {
    display: flex;
    flex-wrap: wrap;
    column-gap: var(--cv-cert-12);
    overflow: hidden;
}

.raum-cert-list > .raum-cert-item {
    flex: 0 1 calc(50% - var(--cv-cert-12) / 2);
    min-width: 0;
}

.raum-cert-item {
    display: flex;
    gap: var(--cv-cert-1);
    padding: var(--cv-cert-13) var(--cv-cert-14);
    background-color: transparent;
    position: relative;
}

.raum-cert-item:nth-child(2n)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: calc(-100% - var(--cv-cert-12));
    width: calc(200% + var(--cv-cert-12));
    height: var(--space-1);
    background-color: var(--signature-color);
}

.raum-cert-item:last-child:nth-child(odd)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(200% + var(--cv-cert-12));
    height: var(--space-1);
    background-color: var(--signature-color);
}

.cert_chk {
    position: absolute;
    top: var(--space-15);
    left: var(--space-15);
    z-index: var(--z-1);
}

/* 인증서 이미지 */
.raum-cert-img {
    width: 36%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--background-color);
    /* border: 1px solid rgba(var(--color-black-rgb), 0.1); */
    overflow: hidden;
}

.raum-cert-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.raum-cert-no-img {
    font-size: var(--text-font-size);
    color: var(--base-color-sub-black);
    padding: var(--space-60) 0;
}

/* 인증서 정보 */
.raum-cert-info-title {
    font-size: var(--text-font-size);
    font-weight: var(--fw-700);
    color: var(--base-color-black);
    padding-bottom: var(--cv-cert-15);
    border-bottom: var(--px-2) solid var(--signature-color);
    margin-bottom: 0;
}

.raum-cert-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.raum-cert-table {
    width: 100%;
    border-collapse: collapse;
}

.raum-cert-table th {
    font-size: var(--cv-cert-16);
    padding: var(--cv-cert-17) var(--cv-cert-18);
    text-align: left;
    border-bottom: 1px solid rgba(var(--color-black-rgb), 0.2);
    width: 35%;
    font-weight: var(--fw-500);
    color: var(--base-color-black);
    white-space: nowrap;
}

.raum-cert-table td {
    font-size: var(--cv-cert-16);
    padding: var(--cv-cert-17) var(--cv-cert-18);
    text-align: left;
    border-bottom: 1px solid rgba(var(--color-black-rgb), 0.2);
    color: var(--base-color-sub-black);
}

.raum-cert-table tr:last-child th,
.raum-cert-table tr:last-child td {
    border-bottom: 1px solid rgba(var(--color-black-rgb), 0.2);
}


/* 빈 목록 */
.raum-cert-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: var(--cv-cert-19) 0;
    font-size: var(--text-font-size);
    color: var(--base-color-sub-black);
}

/* 하단 버튼 */
#bo_cert .bo_fx {
    margin-top: var(--cv-cert-1);
    display: flex;
    justify-content: flex-end;
}

/* 페이지네이션 */
#bo_cert .pg_wrap {
    margin-top: var(--cv-cert-20);
}

/* 인증서 섹션 페이지네이션 */
.raum-cert-paging {
    margin-top: var(--cv-cert-2);
    text-align: center;
}

.raum-cert-paging .pg_wrap {
    display: block;
    float: none;
    width: 100%;
    text-align: center;
}

.raum-cert-paging .pg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-4);
}

.raum-cert-paging .pg_page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: var(--space-36);
    height: var(--space-36);
    padding: 0 var(--space-10);
    font-size: var(--space-14);
    font-weight: var(--fw-400);
    color: var(--base-color-sub-black);
    text-decoration: none;
    border: 1px solid var(--signature-color);
    background-color: transparent;
    transition: all var(--transition-fast);
}

.raum-cert-paging .pg_page:hover {
    color: var(--base-color-white);
    background-color: var(--signature-color);
    border-color: var(--signature-color);
}

.raum-cert-paging .pg_current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: var(--space-36);
    height: var(--space-36);
    padding: 0 var(--space-10);
    font-size: var(--space-14);
    font-weight: var(--fw-700);
    color: var(--base-color-white);
    background-color: var(--signature-color);
    border: 1px solid var(--signature-color);
}

.raum-cert-paging .pg_start,
.raum-cert-paging .pg_prev,
.raum-cert-paging .pg_next,
.raum-cert-paging .pg_end {
    font-size: var(--space-12);
    font-weight: var(--fw-500);
    color: var(--base-color-black);
}

.raum-cert-paging .pg_start:hover,
.raum-cert-paging .pg_prev:hover,
.raum-cert-paging .pg_next:hover,
.raum-cert-paging .pg_end:hover {
    color: var(--base-color-white);
    background-color: var(--signature-color);
    border-color: var(--signature-color);
}

/* 관리자 옵션 */
#bo_cert .more_opt {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    background: var(--base-color-white);
    border: 1px solid rgba(var(--color-black-rgb), 0.15);
    list-style: none;
    padding: var(--space-5) 0;
    margin: 0;
    z-index: var(--z-10);
}

#bo_cert .more_opt li button {
    display: block;
    width: 100%;
    padding: var(--space-8) var(--space-20);
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--space-13);
    white-space: nowrap;
    text-align: left;
}

#bo_cert .more_opt li button:hover {
    background-color: var(--background-color);
}

#bo_cert .btn_bo_user li {
    position: relative;
}


/* =========================
   인증서 게시판 스킨 : Write
========================= */
.cert_write_wrap {
    background-color: var(--background-color);
    min-height: var(--vh-100);
    padding: var(--cv-cert-21) var(--cv-cert-22) 0;
}

.cert_write_header {
    text-align: center;
    margin-bottom: var(--cv-cert-2);
}

.cert_write_title {
    font-size: var(--sub-title-font-size);
    line-height: var(--sub-title-font-size-line);
    font-weight: var(--fw-700);
    color: var(--base-color-darkblack);
}

.cert_write {
    max-width: var(--space-700);
    margin: 0 auto;
}

/* 시스템 자동 출력 요소 숨김 (분류, 내용, 에디터 등) - specificity 강화 */
.cert_write.cert_write #bo_w,
.cert_write.cert_write .write_div:has(#wr_content),
.cert_write.cert_write .write_div:has(.wr_content),
.cert_write.cert_write .bo_w_select,
.cert_write.cert_write .wr_content,
.cert_write.cert_write #wr_content,
.cert_write.cert_write textarea[name="wr_content"] {
    display: none;
}

.cert_w_row {
    display: flex;
    align-items: center;
    gap: var(--space-15);
    padding: var(--cv-cert-15) 0;
    border-bottom: 1px solid rgba(var(--color-black-rgb), 0.1);
}

.cert_w_label {
    width: var(--space-120);
    flex-shrink: 0;
    font-size: var(--text-font-size);
    font-weight: var(--fw-600);
    color: var(--base-color-black);
}

.cert_w_label strong {
    color: var(--signature-color);
}

.cert_w_select {
    flex: 1;
    padding: var(--space-10) var(--space-14);
    border: 1px solid rgba(var(--color-black-rgb), 0.2);
    font-size: var(--text-font-size);
    color: var(--base-color-black);
    background-color: var(--base-color-white);
    outline: none;
    transition: border-color var(--transition-fast);
    cursor: pointer;
}

.cert_w_select:focus {
    border-color: var(--signature-color);
}

.cert_w_input {
    flex: 1;
    padding: var(--space-10) var(--space-14);
    border: 1px solid rgba(var(--color-black-rgb), 0.2);
    font-size: var(--text-font-size);
    color: var(--base-color-black);
    outline: none;
    transition: border-color var(--transition-fast);
}

.cert_w_input:focus {
    border-color: var(--signature-color);
}

.cert_w_input::placeholder {
    color: var(--base-color-sub-black);
    opacity: var(--op-05);
}

/* 여분필드 제목+값 나란히 배치 */
.cert_w_extra_fields {
    flex: 1;
    display: flex;
    gap: var(--space-10);
}

.cert_w_input_title {
    flex: 0 0 30%;
    min-width: 0;
}

.cert_w_input_value {
    flex: 1;
    min-width: 0;
}

.cert_w_file {
    flex: 1;
    font-size: var(--text-font-size);
    color: var(--base-color-black);
}

.cert_w_file_del {
    margin-top: var(--space-8);
    font-size: var(--space-13);
    color: var(--base-color-sub-black);
}

.cert_w_btn {
    display: flex;
    justify-content: center;
    gap: var(--space-12);
    margin-top: var(--cv-cert-20);
}

.cert_btn_cancel,
.cert_btn_submit {
    padding: var(--space-12) var(--space-40);
    font-size: var(--text-font-size);
    font-weight: var(--fw-600);
    border: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    transition: opacity var(--transition-fast);
    background-color: var(--signature-color);
    color: var(--base-color-white);
}

.cert_btn_cancel {
    background-color: var(--background-color);
    color: var(--base-color-black);
}

.cert_btn_cancel:hover,
.cert_btn_submit:hover {
    opacity: var(--op-07);
}


/* =========================
   인증서 게시판 스킨 : View
========================= */
.cert_view_wrap {
    background-color: var(--background-color);
    min-height: var(--vh-100);
    padding: var(--cv-cert-21) var(--cv-cert-22) 0;
}

.cert_view_header {
    text-align: center;
    margin-bottom: var(--cv-cert-2);
}

.cert_view_title {
    font-size: var(--sub-title-font-size);
    line-height: var(--sub-title-font-size-line);
    font-weight: var(--fw-700);
    color: var(--base-color-darkblack);
}

.cert_view {
    max-width: var(--space-700);
    margin: 0 auto;
}

.cert_view_content {
    display: flex;
    gap: var(--cv-cert-23);
    padding: var(--cv-cert-24);
    background-color: var(--base-color-white);
    border: 1px solid rgba(var(--color-black-rgb), 0.1);
}

.cert_view_img {
    width: var(--space-240);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--background-color);
    overflow: hidden;
}

.cert_view_img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.cert_view_img .raum-cert-no-img {
    font-size: var(--text-font-size);
    color: var(--base-color-sub-black);
    padding: var(--space-60) 0;
}

.cert_view_btn {
    display: flex;
    justify-content: center;
    gap: var(--space-12);
    margin-top: var(--cv-cert-20);
}

.cert_btn_delete {
    padding: var(--space-12) var(--space-40);
    font-size: var(--text-font-size);
    font-weight: var(--fw-600);
    border: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    transition: opacity var(--transition-fast);
    background-color: var(--color-hex-b94a48);
    color: var(--base-color-white);
}

.cert_btn_delete:hover {
    opacity: var(--op-07);
}


/* =========================
   반응형
========================= */
@media (max-width: 1024px) {
    .raum-cert-list > .raum-cert-item {
        flex: 0 1 100%;
    }

    .raum-cert-item:nth-child(2n)::after,
    .raum-cert-item:last-child:nth-child(odd)::after {
        display: none;
    }
}

@media (max-width: 768px) {
    .raum-cert-item {
        flex-direction: column;
        padding: var(--cv-cert-25) var(--cv-cert-14);
    }

    .raum-cert-img {
        width: 100%;
        max-height: var(--space-300);
    }

    .raum-cert-info-title {
        padding-bottom: var(--cv-cert-26);
    }

    .raum-cert-table th,
    .raum-cert-table td {
        padding: var(--cv-cert-26) var(--cv-cert-18);
    }

    .raum-cert-table th {
        width: var(--space-100);
    }

    .cert_w_row {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-8);
    }

    .cert_w_label {
        width: 100%;
    }

    .cert_w_input {
        width: 100%;
    }

    .cert_w_extra_fields {
        width: 100%;
        flex-direction: column;
        gap: var(--space-8);
    }

    .cert_w_input_title {
        flex: none;
        width: 100%;
    }

    .cert_w_input_value {
        width: 100%;
    }

    .cert_view_content {
        flex-direction: column;
    }

    .cert_view_img {
        width: 100%;
        max-height: var(--space-300);
    }
}


/* =========================
   인증서 글쓰기/수정 (portfolio 패턴 동형)
========================= */
body:has(.raum-cert-write_page) header,
body:has(.raum-cert-write_page) footer,
body:has(.raum-cert-write_page) .raum-gnb-all,
body:has(.raum-cert-write_page) #hd_login_msg {
    display: none;
}

body:has(.raum-cert-write_page) #wrapper,
body:has(.raum-cert-write_page) #container {
    padding: 0;
}

.raum-cert-write_page {
    display: flex;
    min-height: var(--svh-100);
}

.raum-cert-write_sidebar {
    position: sticky;
    top: 0;
    width: var(--sidebar-width);
    height: var(--svh-100);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: var(--cv-cert-27);
    background: var(--base-color-white);
}

.raum-cert-write_logo {
    display: flex;
    text-decoration: none;
}

.raum-cert-write_logo img {
    width: var(--cv-cert-28);
    height: auto;
}

.raum-cert-write_sidebar_text {
    margin-top: var(--cv-cert-29);
}

.raum-cert-write_sidebar_board {
    display: block;
    font-family: var(--font-KR-base);
    font-size: var(--cv-cert-30);
    font-weight: var(--fw-600);
    color: var(--base-color-black);
    letter-spacing: var(--em-0-02);
}

.raum-cert-write_sidebar_reg {
    display: block;
    font-size: var(--cv-cert-31);
    font-weight: var(--fw-400);
    color: var(--color-gray-400);
    letter-spacing: var(--em-0-08);
    margin-top: var(--space-4);
}

.raum-cert-write_sidebar_date {
    display: block;
    margin-top: var(--cv-cert-29);
    font-size: var(--cv-cert-32);
    font-weight: var(--fw-400);
    color: var(--color-gray-300);
    letter-spacing: var(--em-0-1);
}

.raum-cert-write_sidebar_line {
    display: block;
    width: var(--space-32);
    height: var(--px-1);
    background: rgba(var(--color-black-rgb), 0.12);
    margin: var(--cv-cert-33) 0;
}

.raum-cert-write_sidebar_slogan {
    display: block;
    font-family: var(--font-KR-base);
    font-size: var(--cv-cert-34);
    font-weight: var(--fw-400);
    color: var(--base-color-black);
    letter-spacing: var(--em-0-05);
}

.raum-cert-write_sidebar_actions {
    display: flex;
    gap: var(--cv-cert-35);
    margin-top: var(--cv-cert-29);
}

.raum-cert-write_sidebar_actions a,
.raum-cert-write_sidebar_actions button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--space-48);
    height: var(--space-48);
    border-radius: 50%;
    border: 1px solid rgba(var(--color-black-rgb), 0.15);
    background: transparent;
    color: var(--base-color-black);
    cursor: pointer;
    text-decoration: none;
    transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

@media (hover: hover) {
    .raum-cert-write_sidebar_actions a:hover,
    .raum-cert-write_sidebar_actions button:hover {
        background: var(--signature-color);
        color: var(--base-color-white);
        border-color: var(--signature-color);
    }
}

#raum-cert-write {
    flex: 1;
    min-width: 0;
    width: auto;
    margin: 0;
    background-color: var(--background-color);
    padding: var(--cv-cert-36) var(--cv-cert-37) 0;
}

.raum-cert-w_section {
    position: relative;
    padding: var(--cv-cert-38) 0;
}

.raum-cert-w_field_row {
    max-width: var(--space-400);
    margin: 0 auto var(--space-15);
}

.raum-cert-w_input {
    width: 100%;
    border: 1px solid var(--color-ui-input-bg);
    padding: var(--space-8) var(--space-12);
    border-radius: var(--space-3);
    box-sizing: border-box;
}

.raum-cert-w_cate_select {
    display: block;
    max-width: var(--space-300);
    margin: 0 auto var(--space-20);
    border: 1px solid rgba(var(--color-black-rgb), 0.15);
    height: var(--space-38);
    line-height: var(--space-38);
    padding: 0 var(--space-12);
    border-radius: 0;
    text-align: center;
    box-sizing: border-box;
    background: transparent;
    font-size: var(--space-14);
    color: var(--color-gray-600);
    outline: none;
}

.raum-cert-w_title_input {
    display: block;
    width: 100%;
    border: none;
    border-bottom: var(--px-2) dashed rgba(var(--color-black-rgb), 0.15);
    background: transparent;
    text-align: center;
    font-size: var(--space-26);
    font-weight: var(--fw-700);
    color: var(--base-color-black);
    padding: var(--space-10) 0;
    margin-bottom: var(--space-12);
    outline: none;
    box-sizing: border-box;
}

.raum-cert-w_title_input::placeholder {
    color: var(--color-gray-400);
}

.raum-cert-w_title_input:focus {
    border-bottom-color: var(--base-color-black);
}

/* 인증서 정보 필드 (portfolio 동형 가로 형식: 라벨 좌 / 값 우 점선 밑줄) — 3열 grid */
.raum-cert-w_info_fields {
    display: flex; flex-wrap: wrap;
    
    gap: var(--cv-cert-39) var(--cv-cert-40);
    max-width: var(--space-1120);
    margin: 0 auto;
}

.raum-cert-w_info_fields > * { flex: 0 1 calc((100% - var(--cv-cert-41) * 2) / 3); box-sizing: border-box; }

.raum-cert-w_info_field_row {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--cv-cert-42);
    min-width: 0;
}

.raum-cert-w_info_field_label_input {
    flex: 0 0 auto;
    width: var(--cv-cert-43);
    border: none;
    background: transparent;
    padding: var(--space-6) 0;
    font-size: var(--cv-cert-44);
    font-weight: var(--fw-700);
    color: var(--base-color-black);
    box-sizing: border-box;
    outline: none;
}

.raum-cert-w_info_field_label_input::placeholder {
    color: var(--color-gray-400);
    font-weight: var(--fw-600);
}

.raum-cert-w_info_field_input {
    flex: 1 1 0;
    min-width: 0;
    border: none;
    border-bottom: 1px solid rgba(var(--color-black-rgb), 0.2);
    padding: var(--space-6) 0;
    background: transparent;
    border-radius: 0;
    outline: none;
    font-size: var(--cv-cert-44);
    color: var(--color-gray-600);
    box-sizing: border-box;
}

.raum-cert-w_info_field_input::placeholder {
    color: var(--color-gray-400);
}

.raum-cert-w_info_field_input:focus {
    border-bottom-color: var(--signature-color);
    color: var(--base-color-black);
}

/* 인증서 이미지 업로드 (portfolio img_area 슬롯 패턴) */
.raum-cert-w_img_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cv-cert-45);
    max-width: var(--space-640);
    margin: 0 auto var(--cv-cert-7);
}

.raum-cert-w_section_label {
    display: block;
    font-size: var(--cv-cert-46);
    font-weight: var(--fw-600);
    color: var(--base-color-black);
    margin: 0;
}

.raum-cert-w_img_slot {
    max-width: var(--space-640);
    margin: 0 auto;
}

.raum-cert-w_img_area {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: var(--cv-cert-47);
    background-color: var(--color-gray-150);
    border: 1px dashed rgba(var(--color-black-rgb), 0.2);
    transition: background-color var(--transition-snappy), border-color var(--transition-snappy);
    overflow: hidden;
}

.raum-cert-w_img_area:hover {
    background-color: var(--color-gray-200);
    border-color: rgba(var(--color-black-rgb), 0.35);
}

.raum-cert-w_img_slot[data-has-image="1"] .raum-cert-w_img_area {
    border-style: solid;
    border-color: rgba(var(--color-black-rgb), 0.15);
    background-color: transparent;
}

.raum-cert-w_img_preview {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain;
}

.raum-cert-w_file_input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: var(--op-0);
    overflow: hidden;
}

.raum-cert-w_img_label {
    position: absolute;
    inset: 0;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
}

.raum-cert-w_img_placeholder {
    color: var(--color-gray-500);
    font-size: var(--cv-cert-34);
    text-align: center;
    transition: opacity var(--transition-snappy);
}

.raum-cert-w_img_slot[data-has-image="1"] .raum-cert-w_img_placeholder {
    display: none;
}

.raum-cert-w_img_toolbar {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    margin: 0;
}

.raum-cert-w_img_act_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--space-32);
    height: var(--space-32);
    padding: 0;
    border: 1px solid rgba(var(--color-black-rgb), 0.12);
    border-radius: var(--space-3);
    background: var(--color-gray-100);
    color: var(--color-gray-500);
    cursor: pointer;
    transition: color var(--transition-snappy), background var(--transition-snappy), border-color var(--transition-snappy);
}

@media (hover: hover) {
    .raum-cert-w_img_edit_btn:hover {
        color: var(--base-color-white);
        background: var(--signature-color);
        border-color: var(--signature-color);
    }

    .raum-cert-w_img_del_btn:hover {
        color: var(--base-color-white);
        background: var(--color-accent-red);
        border-color: var(--color-accent-red);
    }
}

/* 모바일용 하단 버튼 */
.raum-cert-w_buttons {
    text-align: center;
    padding: var(--cv-cert-20) 0;
    display: flex;
    justify-content: center;
    gap: var(--space-12);
}

.raum-cert-btn_cancel,
.raum-cert-btn_submit {
    display: inline-block;
    padding: var(--space-12) var(--space-40);
    font-size: var(--cv-cert-34);
    border: none;
    background: var(--background-color-gray);
    color: var(--base-color-black);
    cursor: pointer;
    transition: all var(--transition-snappy);
    text-decoration: none;
}

.raum-cert-btn_cancel:hover,
.raum-cert-btn_submit:hover {
    background: rgba(var(--color-black-rgb), 0.15);
}

/* PC: 사이드바 액션 사용 → 하단 버튼 숨김 */
.raum-cert-write_page .raum-cert-w_buttons {
    display: none;
}

/* 모바일: 사이드바 숨기고 하단 버튼 표시 */
@media (max-width: 768px) {
    .raum-cert-write_page {
        flex-direction: column;
    }

    .raum-cert-write_sidebar {
        position: static;
        width: 100%;
        height: auto;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: var(--cv-cert-48);
    }

    .raum-cert-write_sidebar_text {
        margin-top: 0;
    }

    .raum-cert-write_sidebar_actions {
        display: none;
    }

    .raum-cert-write_page .raum-cert-w_buttons {
        display: flex;
    }
}