@charset "utf-8";
@font-face {
    font-family: 'Pretendard';
    font-weight: 900;
    font-display: swap;
    src: local('Pretendard Black'), url('/plugin/font/Pretendard/woff2/Pretendard-Black.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-Black.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 800;
    font-display: swap;
    src: local('Pretendard ExtraBold'), url('/plugin/font/Pretendard/woff2/Pretendard-ExtraBold.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-ExtraBold.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-display: swap;
    src: local('Pretendard Bold'), url('/plugin/font/Pretendard/woff2/Pretendard-Bold.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-Bold.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 600;
    font-display: swap;
    src: local('Pretendard SemiBold'), url('/plugin/font/Pretendard/woff2/Pretendard-SemiBold.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-SemiBold.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-display: swap;
    src: local('Pretendard Medium'), url('/plugin/font/Pretendard/woff2/Pretendard-Medium.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-Medium.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 400;
    font-display: swap;
    src: local('Pretendard Regular'), url('/plugin/font/Pretendard/woff2/Pretendard-Regular.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-Regular.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 300;
    font-display: swap;
    src: local('Pretendard Light'), url('/plugin/font/Pretendard/woff2/Pretendard-Light.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-Light.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 200;
    font-display: swap;
    src: local('Pretendard ExtraLight'), url('/plugin/font/Pretendard/woff2/Pretendard-ExtraLight.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-ExtraLight.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 100;
    font-display: swap;
    src: local('Pretendard Thin'), url('/plugin/font/Pretendard/woff2/Pretendard-Thin.woff2') format('woff2'), url('/plugin/font/Pretendard/woff/Pretendard-Thin.woff') format('woff');
}

@font-face {
    font-family: 'NotoSansKR';
    src: url('/plugin/font/NotoSansKR/NotoSans-Thin.woff2') format('woff2');
    font-weight: 100;
    font-style: normal;
}

/* Light - 300 */
@font-face {
    font-family: 'NotoSansKR';
    src: url('/plugin/font/NotoSansKR/NotoSans-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

/* Regular - 400 */
@font-face {
    font-family: 'NotoSansKR';
    src: url('/plugin/font/NotoSansKR/NotoSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

/* Medium - 500 */
@font-face {
    font-family: 'NotoSansKR';
    src: url('/plugin/font/NotoSansKR/NotoSans-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
}

/* Bold - 700 */
@font-face {
    font-family: 'NotoSansKR';
    src: url('/plugin/font/NotoSansKR/NotoSans-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

/* Black - 900 */
@font-face {
    font-family: 'NotoSansKR';
    src: url('/plugin/font/NotoSansKR/NotoSans-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
}



:root {
    --FontFamily            : NotoSansKR, sans-serif;
    --max-width              : 1300px;

}
html, body {
    font-size:16px;
    font-weight: 400;
    font-family: var(--FontFamily);
}

body#stnBody {
    padding:0 0 0 0;
    margin:0 0 0 0;
    width:100%;
}

input[type=text],
input[type=password],
select { box-sizing: border-box; transition: all 0.3s; }
textarea { display: block; width: 100%; padding: 15px; background: #FFF; border: 1px solid #DDDFE1; border-radius: 10px; box-sizing: border-box; word-break: break-all; resize: none; transition: all 0.3s; font-family:inherit; }
input[type=text]:focus,
input[type=password]:focus,
select:focus,
textarea:focus { border-color: #135dba; outline: none;}
input::placeholder,
textarea::placeholder {
    font-family: var(--FontFamily);
    font-weight: 400;
    color:#999;
}
input:focus::placeholder {
    color:#333;
}

img.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}

.stnInp { padding:0 .5rem; height: 2rem; border:1px solid #DDDFE1; font-family: var(--FontFamily); border-radius: 10px 10px; }

input.stnInp[readonly]:hover,
input.stnInp[readonly] {
    color: #333;
    background-color: light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));
    border-color: #DDDFE1;
}

.stnInp.required {
    border:1px solid red;
    position: relative;
}
.stnInp.required:after {
    content: '';
    width:10px;
    height:100%;
    position: absolute;
    top: 0;
    right:0;
}
input[type=text].required:focus,
input[type=password].required:focus,
select.required:focus,
textarea.required:focus { border-color:red; outline: none;}



.inp50 { width:50px; }
.inp100 { width:100px; }
.inp150 { width:150px; }
.inp200 { width:200px; }
.inp300 { width:300px; }
.inp500 { width:500px; }
.inp00 { width:100%; }
#loadingOverlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(255, 255, 255, 0.95);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.loadingBar {
    width: 50%;
    height: 8px;
    background: #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 10px;
    position: relative;
}

.loadingBar::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 30%;
    background: #3498db;
    animation: loadingMove 1.5s infinite ease-in-out;
    border-radius: 4px;
}

@keyframes loadingMove {
    0% { left: -30%; }
    50% { left: 50%; }
    100% { left: 100%; }
}


select.select {
    cursor: pointer;
    min-width: 150px;
    padding: 5px 60px 5px 10px; /* 여백으로 높이 설정 */
    font-family: inherit;  /* 폰트 상속 */
    background: url(https://t1.daumcdn.net/depo/datatrend/ico_check.png) no-repeat calc(100% - 10px) 50%; /* 네이티브 화살표 대체 */
    background-size: 12px;
    border: 1px solid #ccc;
    border-radius: 4px 4px; /* iOS 둥근모서리 제거 */
    -webkit-appearance: none; /* 네이티브 외형 감추기 */
    -moz-appearance: none;
    appearance: none;
    transition: all 0.3s;
    font-size: 14px;
}
select.select option {
    color: #333;
    background-color: #fff;
}
select.select:focus{ border-color: #135dba; outline: none;}


#detailModal {
    font-family: var(--FontFamily);
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0; top: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    justify-content: center;
    align-items: center;
}
#detailModal .modal-content {
    background: white;
    padding: 20px;
    border-radius: 8px;
    width: 80%;
    max-width: 700px;
    position: relative;
}
#detailModal .close-btn {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 24px;
    cursor: pointer;
}


/* 툴바와 에디터 전체에 적용 */
.ql-toolbar.ql-snow,
.ql-container.ql-snow,
.ql-container .ql-editor {
    font-family: var(--FontFamily);
    font-size: 14px;       /* 필요시 */
    line-height: 1.6;      /* 필요시 */
}

/* placeholder도 같은 폰트 */
.ql-editor.ql-blank::before{
    font-family: var(--FontFamily);
}

/* 코드 블록은 가독성 위해 모노스페이스 유지 */
.ql-editor pre,
.ql-editor code{
    font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
    max-height: 100%;
}

.txtCenter { text-align:center; }
.txtLeft { text-align:left; }
.stnBtnWrap {
    padding:1rem 0;
}

#goTopBtn {
    position: fixed;
    bottom: 40px;
    right: 40px;
    display: none;
    z-index: 999;
    font-size: 18px;
    border: none;
    outline: none;
    background-color: #333;
    color: white;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 1rem 1rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}

#goTopBtn:hover {
    background-color: #555;
}

a { text-decoration: underline; color: inherit !important; }