/* *****************************************************************
 * filename : reset.css
 * description : 절대 수정 추가 X (수정/추가 문의 ㅣ 일시적으로 변경하는건 common.css로) 
 * date : 2025-09-03
****************************************************************** */
:root { --bs-blue: #0d6efd; --bs-indigo: #6610f2; --bs-purple: #6f42c1; --bs-pink: #d63384; --bs-red: #dc3545; --bs-orange: #fd7e14; --bs-yellow: #ffc107; --bs-green: #198754; --bs-teal: #20c997; --bs-cyan: #0dcaf0; --bs-white: #fff; --bs-gray: #6c757d; --bs-gray-dark: #343a40; --bs-gray-100: #f8f9fa; --bs-gray-200: #e9ecef; --bs-gray-300: #dee2e6; --bs-gray-400: #ced4da; --bs-gray-500: #adb5bd; --bs-gray-600: #6c757d; --bs-gray-700: #495057; --bs-gray-800: #343a40; --bs-gray-900: #212529; --bs-primary: #0d6efd; --bs-secondary: #6c757d; --bs-success: #198754; --bs-info: #0dcaf0; --bs-warning: #ffc107; --bs-danger: #dc3545; --bs-light: #f8f9fa; --bs-dark: #212529; --bs-primary-rgb: 13,110,253; --bs-secondary-rgb: 108,117,125; --bs-success-rgb: 25,135,84; --bs-info-rgb: 13,202,240; --bs-warning-rgb: 255,193,7; --bs-danger-rgb: 220,53,69; --bs-light-rgb: 248,249,250; --bs-dark-rgb: 33,37,41; --bs-white-rgb: 255,255,255; --bs-black-rgb: 0,0,0; --bs-body-rgb: 33,37,41; --bs-font-sans-serif: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; --bs-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); --bs-body-font-family: var(--bs-font-sans-serif); --bs-body-font-size: 1rem; --bs-body-font-weight: 400; --bs-body-line-height: 1.5; --bs-body-color: #212529; --bs-body-bg: #fff }
*, ::after, ::before { box-sizing: border-box }

@media (prefers-reduced-motion:no-preference) {
    :root { scroll-behavior: smooth }
}

html { overflow:hidden; font-size: 87.5% !important; }
html, a, abbr, acronym, address, applet, article, aside, audio, b, blockquote, big, body, center, canvas, caption, cite, code, command,
datalist, dd, del, details, dfn, dl, div, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, i, iframe, img, ins, kbd,
keygen, label, legend, li, meter, nav, menu, object, ol, output, p, pre, progress, q, s, samp, section, small, span, source, strike, strong, sub, sup, table, tbody, td, tfoot, thead, th, tr, td, video, tt, u, ul, var, input, :after, :before {margin:0; padding:0; border:0; font:inherit; font-size:100%; vertical-align:baseline; box-sizing:border-box;}

body { margin: 0; font-family: var(--bs-body-font-family); font-size: var(--bs-body-font-size); font-weight: var(--bs-body-font-weight); line-height: var(--bs-body-line-height); color: #333; line-height: 1.5em; -webkit-text-size-adjust: none; word-break: keep-all; word-wrap: break-word; }

h1, h2, h3, h4, h5, h6, table, tr, th, td, input, button, select, textarea { font-size: 1em; box-sizing: border-box; line-height: 1.2 ;}
body, input, button, select, textarea, sub {font-family:"돋움", dotum, Helvetica, sans-serif; -webkit-text-size-adjust:none;}
cite, address, optgroup {font-style:normal;}
kbd, samp, code {font-family:monospace;}

a {color:inherit;}
a:link, a:visited, a:focus, a:active {text-decoration:none;}
a:hover {text-decoration:underline;}

table { caption-side: bottom; border-collapse: collapse;}
th { text-align: inherit; }
tbody, td, tfoot, th, thead, tr { border-color: inherit; border-style: solid; border-width: 0; }
button, label {cursor:pointer;}
button {padding:0; border:none; background:transparent; overflow:visible;}
button:focus:not(:focus-visible) { outline: 0 }
code { display: block; word-wrap: break-word;}
legend, hr {position:absolute; top:0; left:0; overflow:hidden;}
legend, hr, caption {overflow:hidden; width:0; height:0; font-size:0; line-height:0;}

img, input, button, select, textarea, th, td {vertical-align:middle;}
img, fieldset {border:0;}
img { max-width:100%; }
ul, ol {list-style:none;} 
abbr, acronym {border-bottom:1px dotted black; cursor:help;}
table {width:100%; table-layout:fixed; border-collapse:collapse; border-spacing:0;}
strong, em {font-weight:bold;}

article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block;}
mark, rp, rt, ruby, summary, time {display:inline;}

blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:""; content:none;}

:after, :before { box-sizing:border-box }

/* 배경출력 */
* {-webkit-print-color-adjust:exact;}

/* 숨김 */
ul#skipToContent {position:absolute; top:0; left:0; z-index:10000; width:100%; height:0;}
ul#skipToContent li {position:absolute; z-index:10000; top:0; left:0; width:100%; }
ul#skipToContent li a {display:block; position:absolute; z-index:10000; top:-10000px; left:0; color:#fff; font-size:0; text-align:center;}
ul#skipToContent li a:focus,ul#skipToContent li a:active {top:0px; width:100%; padding:15px 0; font-size:1em; background-color:#4285f4}

/* 기본 버튼 골격 */
/* reset.css (버튼 기본 뼈대) */
.btn { display: inline-block; font-weight: 400; line-height: 1.1; text-align: center; vertical-align: middle; user-select: none; border: 1px solid transparent; padding: .375rem .75rem; font-size: 1rem; border-radius: .25rem; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; cursor: pointer; background-color: transparent; }
/* :focus 최소값(강조는 common에서) */
.btn:focus,
.btn:active:focus { outline: 0; box-shadow: none; }

/* 공통 체크박스(기본 골격) */
input[type="checkbox"] { appearance: none; -webkit-appearance: none; -moz-appearance: none; width: 15px; height: 15px; border: 2px solid #b9c0cf; border-radius: 4px; background: #fff; cursor: pointer; position: relative; vertical-align: middle; transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease; }
input[type="checkbox"]:focus { outline: none; }
/* checked 시 최소 가시성만 확보(중립색) — common.css에서 브랜드 컬러로 덮음 */
input[type="checkbox"]:checked { background-color: #444; border-color: #444; }
input[type="checkbox"]:checked::after { content: "✓"; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -48%); font-size: 11px; line-height: 1; color: #fff; font-weight: 700; }
input[type="checkbox"]:disabled { cursor: not-allowed; background: #eef0f5; border-color: #d5d9e3; }

/* ===== 공통 input & form 최소 스타일 (form-control 클래스명 교체 form-input) ===== */
.form-input { display: block; width: 100%; padding: .375rem .55rem; font-size: 1rem; font-weight: 400; line-height: 1.2; /* 기준값 */ color: #000; background-color: #fff; border: 1px solid #ccc; /* select와 동일한 border */ border-radius: .25rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; }
/* 최소 포커스(색 연출은 common에서) */
.form-input:focus { border-color: #999; outline: 0; box-shadow: none; }
.form-input:disabled, .form-input[readonly] { background-color: #eee; opacity: 1; }

/* placeholder 연출은 common에서 */
.placeholder { display: inline-block; min-height: 1em; vertical-align: middle; cursor: wait; background-color: currentColor; opacity: .5 }
.placeholder.btn::before { display: inline-block; content: "" }
.placeholder-xs { min-height: .6em }
.placeholder-sm { min-height: .8em }
.placeholder-lg { min-height: 1.2em }
.placeholder-glow .placeholder { -webkit-animation: placeholder-glow 2s ease-in-out infinite; animation: placeholder-glow 2s ease-in-out infinite }

/* ===== select (아이콘/색 연출은 common에서) ===== */
.form-select { display: block; width: 100%; padding: .375rem 1.55rem .375rem .75rem; font-size: 0.95rem; line-height: 1.4; /* ← input과 동일하게 맞춤 */ color: #000; background-color: #fff; border: 1px solid #ccc; /* ← input과 동일하게 맞춤 */ border-radius: .25rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-repeat: no-repeat; background-position: right .75rem center; /* 아이콘은 common.css에서 처리 */ }
.form-select:focus { border-color: #999; outline: 0; box-shadow: none; }
.form-select:disabled { background-color: #eee; }

/* ===== file input (버튼 색/hover는 common에서) ===== */
.form-input[type=file] { overflow: hidden; }
.form-input[type=file]:not(:disabled):not([readonly]) { cursor: pointer; }
.form-input::file-selector-button,
.form-input::-webkit-file-upload-button { padding: .375rem .75rem; margin: -.375rem -.75rem; color: #000; background-color: #ddd; border: 0; border-inline-end: 1px solid #ccc; transition: background-color .15s ease-in-out; }

/* ===== 라디오/체크 공용(.form-check-input) 최소 골격 ===== */
.form-check-input { width: 1em; height: 1em; margin-top: .05em; vertical-align: middle; background-color: #fff; border: 1px solid rgba(0,0,0,.25); -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.form-check-input[type=checkbox] { border-radius: .25em; }
.form-check-input[type=radio] { border-radius: 50%; }
/* checked 컬러는 common에서 */
.form-check-input:disabled { opacity: .5; }

/* ===== range (색 연출은 common에서) ===== */
.form-range { width: 100%; height: 1.5rem; background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.form-range:focus { outline: 0; }
.form-range::-webkit-slider-thumb { width: 1rem; height: 1rem; margin-top: -.25rem; background-color: #888; border-radius: 50%; border: 0; -webkit-appearance: none; }
.form-range::-webkit-slider-runnable-track { height: .5rem; background-color: #ddd; border-radius: 1rem; }
.form-range::-moz-range-thumb { width: 1rem; height: 1rem; background-color: #888; border-radius: 50%; border: 0; }
.form-range::-moz-range-track { height: .5rem; background-color: #ddd; border-radius: 1rem; }
.form-range:disabled::-webkit-slider-thumb, .form-range:disabled::-moz-range-thumb { background-color: #bbb; }

/* ===== 공통 유틸(항상 필요) ===== */
.bold {font-weight:bold !important;}
.d-inline { display: inline !important }
.d-inline-block { display: inline-block !important }
.d-block { display: block !important }
.d-grid { display: grid !important }
.d-table { display: table !important }
.d-table-row { display: table-row !important }
.d-table-cell { display: table-cell !important }
.d-flex { display: flex !important }
.d-inline-flex { display: inline-flex !important }
.d-none { display: none !important }
.w-25 { width: 25% !important }
.w-50 { width: 50% !important }
.w-75 { width: 75% !important }
.w-100 { width: 100% !important }
.w-auto { width: auto !important }
.h-25 { height: 25% !important }
.h-50 { height: 50% !important }
.h-75 { height: 75% !important }
.h-100 { height: 100% !important }
.h-auto { height: auto !important }
.mt-0 { margin-top: 0 !important }
.mt-1 { margin-top: .25rem !important }
.mt-2 { margin-top: .5rem !important }
.mt-3 { margin-top: 1rem !important }
.mt-4 { margin-top: 1.5rem !important }
.mt-5 { margin-top: 3rem !important }
.mt-auto { margin-top: auto !important }
.mb-0 { margin-bottom: 0 !important }
.mb-1 { margin-bottom: .25rem !important }
.mb-2 { margin-bottom: .5rem !important }
.mb-3 { margin-bottom: 1rem !important }
.mb-4 { margin-bottom: 1.5rem !important }
.mb-5 { margin-bottom: 3rem !important }
.mb-auto { margin-bottom: auto !important }
.justify-content-start { justify-content: flex-start !important }
.justify-content-end { justify-content: flex-end !important }
.justify-content-center { justify-content: center !important }
.justify-content-between { justify-content: space-between !important }
.justify-content-around { justify-content: space-around !important }
.justify-content-evenly { justify-content: space-evenly !important }
.align-items-start { align-items: flex-start !important }
.align-items-end { align-items: flex-end !important }
.align-items-center { align-items: center !important }
.align-items-baseline { align-items: baseline !important }
.align-items-stretch { align-items: stretch !important }
.align-content-start { align-content: flex-start !important }
.align-content-end { align-content: flex-end !important }
.align-content-center { align-content: center !important }
.align-content-between { align-content: space-between !important }
.align-content-around { align-content: space-around !important }
.align-content-stretch { align-content: stretch !important }