/** ------------------------------------------------------------ * @프로그램명:smartview common 스타일시트 * @파일명:smartview_common.css * @작성일:2017. 12. 31. * @작성자:김동우 ------------------------------------------------------------ */ /** ------------------------------------------------------------ * @프로그램명:smart_big_style 스타일시트로 명칭 변경 * @파일명:smart_big_style.css * @작성일:2023. 7. 11. * @수정자:엄윤섭 * @특이사항:공통 소스는 smart_big_base.css로 분리 ------------------------------------------------------------ */ /*=========================================================================================================================== 공통 요소 및 Form 양식 =============================================================================================================================*/ :root, [data-bs-theme=light] { --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-black:#000; --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-primary-text:#0a58ca; --bs-secondary-text:#6c757d; --bs-success-text:#146c43; --bs-info-text:#087990; --bs-warning-text:#997404; --bs-danger-text:#b02a37; --bs-light-text:#6c757d; --bs-dark-text:#495057; --bs-primary-bg-subtle:#cfe2ff; --bs-secondary-bg-subtle:#f8f9fa; --bs-success-bg-subtle:#d1e7dd; --bs-info-bg-subtle:#cff4fc; --bs-warning-bg-subtle:#fff3cd; --bs-danger-bg-subtle:#f8d7da; --bs-light-bg-subtle:#fcfcfd; --bs-dark-bg-subtle:#ced4da; --bs-primary-border-subtle:#9ec5fe; --bs-secondary-border-subtle:#e9ecef; --bs-success-border-subtle:#a3cfbb; --bs-info-border-subtle:#9eeaf9; --bs-warning-border-subtle:#ffe69c; --bs-danger-border-subtle:#f1aeb5; --bs-light-border-subtle:#e9ecef; --bs-dark-border-subtle:#adb5bd; --bs-white-rgb:255, 255, 255; --bs-black-rgb:0, 0, 0; --bs-body-color-rgb:33, 37, 41; --bs-body-bg-rgb:255, 255, 255; --bs-font-sans-serif:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, 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-emphasis-color:#000; --bs-emphasis-color-rgb:0, 0, 0; --bs-secondary-color:rgba(33, 37, 41, 0.75); --bs-secondary-color-rgb:33, 37, 41; --bs-secondary-bg:#e9ecef; --bs-secondary-bg-rgb:233, 236, 239; --bs-tertiary-color:rgba(33, 37, 41, 0.5); --bs-tertiary-color-rgb:33, 37, 41; --bs-tertiary-bg:#f8f9fa; --bs-tertiary-bg-rgb:248, 249, 250; --bs-body-bg:#fff; --bs-body-bg-rgb:255, 255, 255; --bs-link-color:#0d6efd; --bs-link-color-rgb:13, 110, 253; --bs-link-decoration:underline; --bs-link-hover-color:#0a58ca; --bs-link-hover-color-rgb:10, 88, 202; --bs-code-color:#d63384; --bs-highlight-bg:#fff3cd; --bs-border-width:1px; --bs-border-style:solid; --bs-border-color:#d6d6d6; --bs-border-color-translucent:rgba(0, 0, 0, 0.175); --bs-border-radius:0.375rem; --bs-border-radius-sm:0.25rem; --bs-border-radius-lg:0.5rem; --bs-border-radius-xl:1rem; --bs-border-radius-2xl:2rem; --bs-border-radius-pill:50rem; --bs-box-shadow:0 0.5rem 1rem rgba(var(--bs-body-color-rgb), 0.15); --bs-box-shadow-sm:0 0.125rem 0.25rem rgba(var(--bs-body-color-rgb), 0.075); --bs-box-shadow-lg:0 1rem 3rem rgba(var(--bs-body-color-rgb), 0.175); --bs-box-shadow-inset:inset 0 1px 2px rgba(var(--bs-body-color-rgb), 0.075); --bs-emphasis-color:#000; --bs-form-control-bg:var(--bs-body-bg); --bs-form-control-disabled-bg:var(--bs-secondary-bg); --bs-highlight-bg:#fff3cd; --bs-breakpoint-xs:0; --bs-breakpoint-sm:576px; --bs-breakpoint-md:768px; --bs-breakpoint-lg:992px; --bs-breakpoint-xl:1200px; --bs-breakpoint-xxl:1400px; } /* ********** Chrome Scroll Style ********** */ ::-webkit-scrollbar {width:8px; height:8px;} /* width */ ::-webkit-scrollbar-track {background:rgba(255,255,255,0.7);} /* Track */ ::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.15); border-radius:4px;} /* Handle */ ::-webkit-scrollbar-thumb:hover {background:rgba(0,0,0,0.3);} /* Handle on hover */ * {box-sizing:border-box;} p {margin-bottom:10px;} div {display:block;} .cursor_point {cursor:pointer !important;} /*====================================== 로딩 ========================================*/ .loading_area {width:100%; height:100vh; position:fixed; z-index:9999; background:rgba(0,0,0,0.5); left:0; top:0; display:none;} .loading_area.active {display:block; animation:loadingFadeIn2 0.5s 1;} .loading_area .loader {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); min-height:50px;} .loading_area .bar {width:10px; height:70px; background:transparent; border-radius:10px 10px 0 0; display:inline-block; animation:loader 1.6s infinite; vertical-align:bottom; margin-right:4px; transform-origin:bottom center;} .loading_area .bar:nth-child(1) {animation-delay:0s;} .loading_area .bar:nth-child(2) {animation-delay:0.2s;} .loading_area .bar:nth-child(3) {animation-delay:0.4s;} .loading_area .bar:nth-child(4) {animation-delay:0.6s;} .loading_area .bar:nth-child(5) {animation-delay:0.8s;} .loading_area .bar:nth-child(6) {animation-delay:1s;} .loading_area .bar:nth-child(7) {animation-delay:1.2s;} .loading_area .bar:nth-child(8) {animation-delay:1.4s; margin-right:0;} .loading_area p {color:#fff; text-align:center; margin-top:15px; letter-spacing:5px;} @keyframes loadingFadeIn2 { 0% {opacity:0;} 100% {opacity:1;} } @keyframes loading2 { 0% {height:50px;} 50% {opacity:0.3; height:25px;} 100% {height:50px;} } @keyframes loader { 0% { transform:scaleY(0.1); background:transparent; } 50% { transform:scaleY(1); background:#2ac8f4; } 100% { transform:scaleY(0.1); background:transparent; } } /* progress bar */ .progress span.num {display:inline-block; color:#000; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); text-shadow:-1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;} /* .progress .progress-bar.bg-primary {background-color:#4f4e56 !important;} */ .progress .progress-bar.bg-primary {background-color:#4fb4d0 !important;} .progress .progress-bar.bg-success {background-color:#1ad2a0 !important;} .progress .progress-bar.bg-info {background-color:#a7a7a7 !important;} .progress .progress-bar.bg-warning {background-color:#f0ad4e !important;} .progress .progress-bar.bg-danger {background-color:#ff8989 !important;} .progress .progress-bar.bg-dark {background-color:#555555 !important;} /* input-group 스타일 추가 */ .input-group {min-height:30px;} .input-group {margin-bottom:10px;} /* .input-group + .input-group {margin-top:10px;} */ /* .input-group .form-control:first-child,.input-group-addon:first-child,.input-group-btn:first-child>.btn,.input-group-btn:first-child>.btn-group>.btn,.input-group-btn:first-child>.dropdown-toggle, .input-group-btn:last-child>.btn-group:not(:last-child)>.btn,.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle) {border-top-right-radius:0; border-bottom-right-radius:0} .input-group .form-control:last-child,.input-group-addon:last-child,.input-group-btn:first-child>.btn-group:not(:first-child)>.btn,.input-group-btn:first-child>.btn:not(:first-child), .input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group>.btn,.input-group-btn:last-child>.dropdown-toggle {border-radius:} */ /* well 추가 */ .well {min-height:20px; padding:19px; margin-bottom:20px; background-color:#fff; border:1px solid #e3e3e3; border-radius:0; -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.05); box-shadow:inset 0 1px 1px rgba(0,0,0,.05)} .well blockquote {border-color:#ddd; border-color:rgba(0,0,0,.15)} .well-lg {padding:24px; border-radius:6px} .well-sm {padding:9px; border-radius:3px} /* pull */ .pull-left {display:flex; justify-content:flex-start !important;} .pull-right {display:flex; justify-content:flex-end !important;} /*====================================== Form ========================================*/ /* .form-group .input-group {margin-bottom:0;} .input-group .input-group {margin-bottom:0;} */ .input-group-icon {display:flex; align-items:center; padding:0.375rem 0.75rem; color:#bfbfbf; font-size:15px; font-weight:400; line-height:1.5; text-align:center; white-space:nowrap; background-color:var(--bs-tertiary-bg); border:var(--bs-border-width) solid var(--bs-border-color); border-radius:0;} .input-group-text {padding:5px 9px; font-size:12px; font-weight:400; line-height:1; color:#000; text-align:center; border:var(--bs-border-width) solid var(--bs-border-color); border-radius:0; position:relative; background:#ffffff; /* Old browsers */ background:-moz-linear-gradient(top, #ffffff 0%, #f2f4f7 100%, #f2f4f7 100%); /* FF3.6-15 */ background:-webkit-linear-gradient(top, #ffffff 0%,#f2f4f7 100%,#f2f4f7 100%); /* Chrome10-25,Safari5.1-6 */ background:linear-gradient(to bottom, #ffffff 0%,#f2f4f7 100%,#f2f4f7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f4f7',GradientType=0 ); /* IE6-9 */ } .input-group-text i {margin-right:5px;} /* input switch */ .m_switch > input[type=checkbox]:checked + label {border-color:#1dbae1; background-color:#1dbae1;} .m_switch > input[type=checkbox] + label:after {background-color:#1dbae1;} /* SaveCustomColumn.jsp 작업 시 추가함 */ .input-group:after {content:""; float:none; clear:both;} .input-group .input-group-icon {padding:0; text-align:center; width:30px; height:35px; line-height:29px; justify-content:center; float:elft;} .input-group .input-group-icon + .form-control, .input-group .input-group-icon + .form_control {float:right; width:calc(100% - 30px); margin-right:0;} /* color picker style */ .colorpicker-element .add-on,.colorpicker-element .input-group-addon {min-width:30px;} .colorpicker-element .add-on i,.colorpicker-element .input-group-addon i {display:inline-block; cursor:pointer; vertical-align:text-top; width:30px; height:100%; position:absolute; left:0; top:0;} .form-horizontal .control-label {padding-top:5px; text-align:right;} .form-horizontal .control-label-left {padding-top:7px; margin-bottom:0; text-align:left;} .form-control {font-size:15px; border-radius:6px; border:1px solid #bbb; height:34px;} .form-control:focus {border-color:#CCD0D7; box-shadow:none !important} textarea.form-control {height:auto} .form-control:not(:disabled,:read-only):hover {border:1px solid #11c4fe;} .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {background-color:#e9edf1; opacity:1; color:#a09f9f;} .form-control.form-search {width:240px;} select.form-control { --bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23a8a8a8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-color:var(--bs-form-control-bg); background-image:var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none); background-repeat:no-repeat; background-position:right 6px center; background-size:16px 12px; } input[type=password] {font-family:none;} textarea {padding:10px; vertical-align:top; width:200px} textarea:focus {outline-style:solid; outline-width:2px} /* .form-horizontal .form-group {margin-right:0; margin-left:0} */ .form-control-feedback {margin-top:3px; height:24px; color:#bfbfbf; line-height:24px; font-size:15px} .form-control-feedback.left {border-right:1px solid #ccc; left:8px;} .form-control-feedback.right {border-left:1px solid #ccc; right:13px; margin-right:-9px; font-size:15px !important;} .form-control.has-feedback-left {padding-left:45px} .form-control.has-feedback-right {padding-right:45px} .form-group + .form-group {margin-top:10px} .form-group:after {content:""; display:block; clear:both; float:none; width:100%; height:0;} .form-group.has-feedback span {display:block !important;} .input-group-btn .btn {margin-bottom:0;} @media (min-width:768px) { .form-inline .form-group {display:inline-block; margin-bottom:0; vertical-align:middle} .form-inline .form-control {display:inline-block; width:auto; vertical-align:middle} .form-inline .form-control-static {display:inline-block} .form-inline .input-group {display:inline-table; vertical-align:middle} .form-inline .input-group .form-control,.form-inline .input-group .input-group-addon,.form-inline .input-group .input-group-btn {width:auto} .form-inline .input-group > .form-control {width:100%} .form-inline .control-label {margin-bottom:0; vertical-align:middle} .form-inline .checkbox,.form-inline .radio {display:inline-block; margin-top:0; margin-bottom:0; vertical-align:middle} .form-inline .checkbox label,.form-inline .radio label {padding-left:0} .form-inline .checkbox input[type=checkbox],.form-inline .radio input[type=radio] {position:relative; margin-left:0; margin-top:3px;} .form-inline .has-feedback .form-control-feedback {top:0} } /* ****************************** form_control ****************************** */ .form_control {display:block; width:100%; padding:0 10px; font-size:14px; font-weight:500; line-height:28px; color:var(--bs-body-color); background-color:var(--bs-form-control-bg); background-clip:padding-box; border:1px solid #bbb; -webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:6px; height:34px; line-height:34px; transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;} .form_control[type=file] {overflow:hidden} .form_control[type=file]:not(:disabled):not([readonly]) {cursor:pointer} .form_control-sm {line-height:23px; font-size:13px;} .form_control-lg {line-height:38px; font-size:18px;} textarea.form_control {height:150px; line-height:1.5em; padding:10px;} textarea.form_control:focus {outline:none;} .input-group>.form_control,.input-group>.form-floating,.input-group>.form-select {position:relative; flex:1 1 auto; width:1%; min-width:0} .input-group>.form_control:focus {z-index:5} .form_control.is-valid,.was-validated .form_control:valid {border-color:var(--bs-success); padding-right:calc(1.5em + .75rem); background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat:no-repeat; background-position:right calc(.375em + .1875rem) center; background-size:calc(.75em + .375rem) calc(.75em + .375rem)} .form_control.is-valid:focus,.was-validated .form_control:valid:focus {border-color:var(--bs-success); box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)} .was-validated textarea.form_control:valid,textarea.form_control.is-valid {padding-right:calc(1.5em + .75rem); background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)} /* 추가 form_control 스타일 */ .form_control:focus {box-shadow:none !important} .form_control:not(:disabled,:read-only):hover, .form_control:not(:disabled,:read-only):focus {border:1px solid #11c4fe;} .form_control.disabled, .form_control[disabled], .form_control[readonly], fieldset[disabled] .form_control {background-color:#e9edf1; opacity:1; /* color:#a09f9f; */ color:#21251f;} .form_control-feedback {margin-top:3px; height:24px; color:#bfbfbf; line-height:24px; font-size:15px;} .form_control-feedback.left {border-right:1px solid #ccc; left:6px;} .form_control-feedback.right {border-left:1px solid #ccc; right:13px; margin-right:-9px; font-size:15px !important;} .form_control.has-feedback-left {padding-left:45px;} .form_control.has-feedback-right {padding-right:45px;} /* input-group 스타일 추가 */ .input-group .form_control:first-child {border-top-right-radius:0; border-bottom-right-radius:0} .input-group .form_control:last-child {border-top-left-radius:0; border-bottom-left-radius:0} .input-group .input-group-btn:first-child .m_btn {border-radius:3px 0 0 3px;} .input-group .input-group-btn:last-child .m_btn {border-radius:0 3px 3px 0;} select.form_control {padding-right:30px; height:34px; transition:0.2s; display:inline-block; vertical-align:middle; line-height:32px; --bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23a8a8a8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-color:var(--bs-form-control-bg); background-image:var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none); background-repeat:no-repeat; background-position:right 6px center; background-size:16px 12px; } select.form_control:hover, select.form_control:focus, .dropdown.bootstrap-select.form_control:hover {border-color:#11c4fe;} select.form_control[disabled]:hover, select.form_control[disabled]:focus, .dropdown.bootstrap-select.form_control[disabled]:hover {border-color:#d6d6d6;} .form_control-feedback {margin-top:3px; height:24px; color:#bfbfbf; line-height:24px; font-size:15px} .form_control-feedback.left {border-right:1px solid #ccc; left:8px;} .form_control-feedback.right {border-left:1px solid #ccc; right:13px; margin-right:-9px; font-size:15px !important;} .form_control.has-feedback-left {padding-left:45px} .form_control.has-feedback-right {padding-right:45px} @media (min-width:768px) { .form-inline .form_control {display:inline-block; width:auto; vertical-align:middle} .form-inline .form_control-static {display:inline-block} .form-inline .input-group .form_control {width:auto} .form-inline .input-group > .form_control {width:100%} } /* dataTable 내 폼양식 정렬 */ .dataTable .form-control, .dataTable .form_control, .dataTable .m_text {vertical-align:top;} /* form-floating - form_control */ .form-floating {position:relative} .form-floating::before:not(.form_control:disabled) {position:absolute; top:var(--bs-border-width); left:var(--bs-border-width); width:calc(100% - (calc(calc(.375em + .1875rem) + calc(.75em + .375rem)))); height:1.875em; content:""; background-color:var(--bs-form-control-bg); border-radius:.375rem} .form-floating>.form_control,.form-floating>.form-control-plaintext,.form-floating>.form-select {height:calc(3.5rem + calc(var(--bs-border-width) * 2)); line-height:1.25} .form-floating>label {position:absolute; top:0; left:0; width:100%; height:100%; padding:1rem .75rem; overflow:hidden; text-align:start; text-overflow:ellipsis; white-space:nowrap; pointer-events:none; border:var(--bs-border-width) solid transparent; transform-origin:0 0; transition:opacity .1s ease-in-out,transform .1s ease-in-out} @media (prefers-reduced-motion:reduce) { .form-floating>label {transition:none} } .form-floating>.form_control,.form-floating>.form-control-plaintext {padding:1rem .75rem} .form-floating>.form-control-plaintext::-moz-placeholder, .form-floating>.form_control::-moz-placeholder {color:transparent} .form-floating>.form-control-plaintext::placeholder, .form-floating>.form_control::placeholder {color:transparent} .form-floating>.form-control-plaintext:not(:-moz-placeholder-shown), .form-floating>.form_control:not(:-moz-placeholder-shown) {padding-top:1.625rem; padding-bottom:.625rem} .form-floating>.form-control-plaintext:focus, .form-floating>.form-control-plaintext:not(:placeholder-shown), .form-floating>.form_control:focus,.form-floating>.form_control:not(:placeholder-shown) { padding-top:1.625rem; padding-bottom:.625rem} .form-floating>.form-control-plaintext:-webkit-autofill, .form-floating>.form_control:-webkit-autofill {padding-top:1.625rem; padding-bottom:.625rem} .form-floating>.form-select {padding-top:1.625rem; padding-bottom:.625rem} .form-floating>.form_control:not(:-moz-placeholder-shown)~label {opacity:.65; transform:scale(.85) translateY(-.5rem) translateX(.15rem)} .form-floating>.form-control-plaintext~label, .form-floating>.form_control:focus~label, .form-floating>.form_control:not(:placeholder-shown)~label, .form-floating>.form-select~label { opacity:.65; transform:scale(.85) translateY(-.5rem) translateX(.15rem)} .form-floating>.form_control:-webkit-autofill~label {opacity:.65; transform:scale(.85) translateY(-.5rem) translateX(.15rem)} .form-floating>.form-control-plaintext~label {border-width:var(--bs-border-width) 0} .form-floating>.form_control:disabled~label {color:#6c757d} /* ion.rangeSlider */ .irs-from, .irs-to, .irs-single {background:#1991eb;} .mg_rangeSlider .irs-from, .irs-to, .irs-single {background:#353c48;} /* cropper */ .cropper .btn.btn-primary {background:#1f96ee; border-color:#85b9ff;} .cropper .btn.btn-primary:hover {background:#004eb8;} .cropper .docs-tooltip {padding:4px 10px 2px;} /* tags input */ .tagsinput {border:1px solid #CCC; background:#FFF; padding:6px 6px 0; width:300px; overflow-y:auto; border-radius:4px;} .tag {line-height:1.5; background:#607d8b; color:#fff !important} span.tag {-moz-border-radius:2px; -webkit-border-radius:2px; display:block; float:left; padding:2px 9px; text-decoration:none; background:#0d6efd; color:#fff; margin-right:5px; font-weight:500; margin-bottom:5px; font-family:'KoPubWorldDotum'; border-radius:4px;} span.tag a {color:#F1F6F7 !important} .tagsinput span.tag a {font-weight:bold; color:#82ad2b; text-decoration:none; font-size:11px} .tagsinput input {width:80px; margin:0px; font-family:'KoPubWorldDotum'; font-size:13px; border:1px solid transparent; padding:3px; background:transparent; color:#000; outline:0} .tagsinput div {display:block; float:left; font-weight:bold;} .tags_clear {clear:both; width:100%; height:0px} .tagsinput:hover {border:1px solid #11c4fe;} /* star raiong */ .glyphicon {position:relative; top:1px; display:inline-block; font-family:'5'; font-style:normal; font-weight:500; line-height:1; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale} .glyphicon-star {margin-right:3px;} .glyphicon-star:before {content:"\f005"; font-weight:700; color:#fbc01c; font-size:12px;} .glyphicon-star-empty {margin-right:3px;} .glyphicon-star-empty:before {content:"\f005"; font-weight:700; color:#cbcbcb; font-size:12px;} .glyphicon-plus:before, .glyphicon-plus-sign:before {content:"\2b";} .glyphicon-remove:before {content:"\f2ed";} /* select2 */ .select2-container {font-size:14px; min-width:150px;} .list_table_area table .select2-container {min-width:auto; text-align:left;} /*====================================== Button ========================================*/ button {border:0; background:none; text-align:center; cursor:pointer; outline:0; transition:0.2s;} .btn_ {display:inline-block; padding:3px 9px; margin-bottom:0; font-size:12px; line-height:20px; text-align:center; vertical-align:middle; cursor:pointer; color:#333333; text-shadow:0 1px 1px rgba(255, 255, 255, 0.75); background-color:#f5f5f5; background-image:linear-gradient(to bottom, #fff, #e6e6e6); background-repeat:repeat-x; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0); border-color:#e6e6e6 #e6e6e6 #bfbfbf; border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); filter:progid:DXImageTransform.Microsoft.gradient(enabled=false); border:1px solid #cccccc; border-bottom-color:#b3b3b3; border-radius:4px; box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05)} .btn-dark {color:#E9EDEF; background-color:#4B5F71; border-color:#364B5F} .btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active, .open .dropdown-toggle.btn-dark {color:#FFFFFF; background-color:#394D5F; border-color:#394D5F} .btn.btn-round {border-radius:30px} .btn.btn-app {position:relative; padding:15px 5px; margin:0 0 10px 10px; min-width:80px; height:60px; box-shadow:none; border-radius:0; text-align:center; color:#666; border:1px solid #ddd; background-color:#fcfdfe; font-size:12px} .btn.btn-app > .fa, .btn.btn-app > .glyphicon, .btn.btn-app > .ion {font-size:20px; display:block} .btn.btn-app:hover {background:#f4f4f4; color:#444; border-color:#aaa} .btn.btn-app:active, .btn.btn-app:focus {box-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125)} .btn.btn-app > .badge {position:absolute; top:-3px; right:-10px; font-size:10px; font-weight:400} /* ********** Basic setting ********** */ /* Button */ .btn {transition:all 0.2s linear 0s; padding:4px 12px 4px; border-radius:0; font-size:13px; line-height:20px; background:#ffffff; border-color:#4f4e56; color:#4f4e56; cursor:inherit;} .btn:hover, .btn:focus, .btn:active, .btn.active, .open .dropdown-toggle {background:#fff; border-color:#003880; color:#003880;} .btn.btn-sm {padding:2px 8px; font-size:13px;} .btn.btn-lg {padding:6px 16px; font-size:16px;} .btn.btn-20 {line-height:11px; font-size:11px; padding:4px 7px 4px 7px;} .btn.btn-25 {line-height:11px; font-size:11px; padding:6px 7px 6px 7px;} .btn.btn-28 {line-height:13px; font-size:13px; padding:6px 7px 6px 7px;} .btn.btn-36 {line-height:13px; font-size:13px; padding:11px 13px 11px 13px;} #btn_openAll.btn.btn-success.btn-25, #btn_closeAll.btn.btn-primary.btn-25 {background:#4f4e56; color:#fff; border:none; border-radius:3px; font-size:11px; width:20px; height:20px; padding:0; line-height:22px; text-align:center; transition:0.2s;} #btn_openAll.btn.btn-success.btn-25 i, #btn_closeAll.btn.btn-primary.btn-25 i {margin-right:0;} #btn_openAll.btn.btn-success.btn-25:hover, #btn_closeAll.btn.btn-primary.btn-25:hover {background:#003880;} #btn_closeAll.btn.btn-primary.btn-25 {margin-left:0;} .opacity0 {opacity:0; pointer-events:none;} .opacity1 {opacity:0.1; pointer-events:none;} .opacity2 {opacity:0.2; pointer-events:none;} .opacity3 {opacity:0.3; pointer-events:none;} .opacity4 {opacity:0.4; pointer-events:none;} .opacity5 {opacity:0.5; pointer-events:none;} .opacity6 {opacity:0.6; pointer-events:none;} .opacity7 {opacity:0.7; pointer-events:none;} .opacity8 {opacity:0.8; pointer-events:none;} .opacity9 {opacity:0.9; pointer-events:none;} button:last-child, .buttons:last-child, .btn:last-child, .modal-footer .btn+.btn:last-child {margin-right:0;} .btn.btn-circle {line-height:16px; font-size:13px; padding:9px 12px 9px 12px; border-radius:50%;} .btn > i {margin-right:5px;} .note-editor .btn > i {margin-right:0;} .btn + .btn {margin-left:3px;} .btn.disabled, .btn:disabled, fieldset:disabled .btn {opacity:0.5; position:relative;} .btn.disabled:after, .btn:disabled:after, fieldset:disabled .btn:after {content:""; display:block; width:calc(100% + 2px); height:calc(100% + 2px); background:#eff1f3; position:absolute; left:-1px; top:-1px;} /* button_color */ .btn.btn-white {background:#ffffff; border-color:#4f4e56; color:#4f4e56;} .btn-white:hover, .btn-white:focus, .btn-white:active, .btn-white.active, .open .dropdown-toggle.btn-white {background:#fff; border-color:#003880;} .btn.btn-blue {background:#4f4e56; border-color:#004bb6; color:#ffffff;} .btn-blue:hover, .btn-blue:focus, .btn-blue:active, .btn-blue.active, .open .dropdown-toggle.btn-blue {background:#003880; border-color:#003880;} .btn.btn-deepblue {background:#364c85; border-color:#364c85; color:#ffffff;} .btn-deepblue:hover, .btn-deepblue:focus, .btn-deepblue:active, .btn-deepblue.active, .open .dropdown-toggle.btn-deepblue {background:#4666af; border-color:#4666af;} .btn.btn-skyblue {background:#1ad2a0; border-color:#1ad2a0; color:#ffffff;} .btn-skyblue:hover, .btn-skyblue:focus, .btn-skyblue:active, .btn-skyblue.active, .open .dropdown-toggle.btn-skyblue {background:#18c495; border-color:#18c495;} .btn.btn-green {background:#5cb85c; border-color:#5cb85c; color:#ffffff;} .btn-green:hover, .btn-green:focus, .btn-green:active, .btn-green.active, .open .dropdown-toggle.btn-green {background:#449d44; border-color:#449d44;} .btn.btn-cian {background:#007f8b; border-color:#007f8b; color:#ffffff;} .btn-cian:hover, .btn-cian:focus, .btn-cian:active, .btn-cian.active, .open .dropdown-toggle.btn-cian {background:#006b75; border-color:#006b75;} .btn.btn-orange {background:#f0ad4e; border-color:#f0ad4e; color:#ffffff;} .btn-orange:hover, .btn-orange:focus, .btn-orange:active, .btn-orange.active, .open .dropdown-toggle.btn-orange {background:#ec971f; border-color:#ec971f;} .btn.btn-red {background:#d9534f; border-color:#d9534f; color:#ffffff;} .btn-red:hover, .btn-red:focus, .btn-red:active, .btn-red.active, .open .dropdown-toggle.btn-red {background:#c9302c; border-color:#c9302c;} .btn.btn-gray {background:#777777; border-color:#777777; color:#ffffff;} .btn-gray:hover, .btn-gray:focus, .btn-gray:active, .btn-gray.active, .open .dropdown-toggle.btn-gray {background:#555555; border-color:#555555;} .btn.btn-dark {background:#4B5F71; border-color:#4B5F71; color:#E9EDEF;} .btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active, .open .dropdown-toggle.btn-dark {background:#394D5F; border-color:#394D5F;} .btn.btn-purple {background:#604a7b; border-color:#604a7b; color:#ffffff;} .btn-purple:hover, .btn-purple:focus, .btn-purple:active, .btn-purple.active, .open .dropdown-toggle.btn-purple {background:#4d3669; border-color:#4d3669;} .btn.btn-purple.outline {background:none; border-color:#992ee3; color:#992ee3;} .btn-purple.outline:hover, .btn-purple.outline:focus, .btn-purple.outline:active, .btn-purple.outline.active, .open .dropdown-toggle.btn-purple.outline {border-color:#ff9908;} .btn.btn-delete {color:#c06565; border-color:#c06565; background:#fff;} .btn.btn-delete:hover {border-color:#c06565; background:#c06565; color:#fff;} .btn.btn-purple-light{background:#e9e4ff; border:0; color:#782ab3;} .btn.btn-purple-light:hover{background:#782ab3; border:0; color:#ffffff;} .btn.btn-red-light{color:#e5422f; background-color:#fee3e5; border:0px;} .btn.btn-red-light:hover{color:#ffffff; background-color:#e5422f;} /* button_outline */ .btn.btn-blue.outline {background:#ffffff; border-color:#2e6da4; color:#2e6da4;} .btn-blue.outline:hover, .btn-blue.outline:focus, .btn-blue.outline:active, .btn-blue.outline.active, .open .dropdown-toggle.btn-blue.outline {background:#f6f6f6; border-color:#122b40;} .btn.btn-deepblue.outline {background:#ffffff; border-color:#4666af; color:#333333;} .btn-deepblue.outline:hover, .btn-deepblue.outline:focus, .btn-deepblue.outline:active, .btn-deepblue.outline.active, .open .dropdown-toggle.btn-deepblue.outline {background:#f6f6f6; border-color:#38569a;} .btn.btn-skyblue.outline {background:#ffffff; border-color:#46b8da; color:#333333;} .btn-skyblue.outline:hover, .btn-skyblue.outline:focus, .btn-skyblue.outline:active, .btn-skyblue.outline.active, .open .dropdown-toggle.btn-skyblue.outline {background:#f6f6f6; border-color:#1b6d85;} .btn.btn-green.outline {background:#ffffff; border-color:#4cae4c; color:#255625;} .btn-green.outline:hover, .btn-green.outline:focus, .btn-green.outline:active, .btn-green.outline.active, .open .dropdown-toggle.btn-green.outline {background:#f6f6f6; border-color:#255625;} .btn.btn-cian.outline {background:#ffffff; border-color:#006b75; color:#333333;} .btn-cian.outline:hover, .btn-cian.outline:focus, .btn-cian.outline:active, .btn-cian.outline.active, .open .dropdown-toggle.btn-cian.outline {background:#f6f6f6; border-color:#025961;} .btn.btn-orange.outline {background:#ffffff; border-color:#eea236; color:#333333;} .btn-orange.outline:hover, .btn-orange.outline:focus, .btn-orange.outline:active, .btn-orange.outline.active, .open .dropdown-toggle.btn-orange.outline {background:#f6f6f6; border-color:#985f0d;} .btn.btn-red.outline {background:#ffffff; border-color:#d43f3a; color:#d43f3a;} .btn-red.outline:hover, .btn-red.outline:focus, .btn-red.outline:active, .btn-red.outline.active, .open .dropdown-toggle.btn-red.outline {background:#f6f6f6; border-color:#761c19;} .btn.btn-gray.outline {background:#ffffff; border-color:#555555; color:#333333;} .btn-gray.outline:hover, .btn-gray.outline:focus, .btn-gray.outline:active, .btn-gray.outline.active, .open .dropdown-toggle.btn-gray.outline {background:#f6f6f6; border-color:#444444;} .btn.btn-dark.outline {background:#ffffff; border-color:#364B5F; color:#333333;} .btn-dark.outline:hover, .btn-dark.outline:focus, .btn-dark.outline:active, .btn-dark.outline.active, .open .dropdown-toggle.btn-dark.outline {background:#f6f6f6; border-color:#394D5F;} .btn.bold {font-weight:bold;} span.btn.outline:hover, span.btn.outline:focus, span.btn.outline:active {background:#fff !important;} /* ************************** bootstrap5용 Style 추가 ************************** */ /* default */ .btn-default {color:#4f4e56; background:#fff; border-color:#4f4e56;} .btn-default.focus,.btn-default:focus {color:#4f4e56; background-color:#fff; border-color:#003880} .btn-default:hover {color:#4f4e56; background:#fff; border-color:#003880} .btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default {color:#fff; background-color:#003880; border-color:#003880} /* primary */ .btn-primary {color:#fff; background:#4f4e56; border-color:#4f4e56;} .btn-primary.focus,.btn-primary:focus {color:#fff; background-color:#0492b5; border-color:#0492b5} .btn-primary:hover {color:#fff; background:#0492b5; border-color:#0492b5} .btn-primary.active,.btn-primary:active,.open>.dropdown-toggle.btn-primary {color:#fff; background-color:#0492b5; border-color:#0492b5} /* success */ .btn-success {color:#fff; background:#1ad2a0; border-color:#1ad2a0;} .btn-success.focus,.btn-success:focus {color:#fff; background-color:#18c495; border-color:#18c495} .btn-success:hover {color:#fff; background:#18c495; border-color:#18c495} .btn-success.active,.btn-success:active,.open>.dropdown-toggle.btn-success {color:#fff; background-color:#18c495; border-color:#18c495} /* info */ .btn-info {color:#fff; background:#a7a7a7; border-color:#a7a7a7;} .btn-info.focus,.btn-info:focus {color:#fff; background-color:#969696; border-color:#969696} .btn-info:hover {color:#fff; background:#969696; border-color:#969696} .btn-info.active,.btn-info:active,.open>.dropdown-toggle.btn-info {color:#fff; background-color:#969696; border-color:#969696} /* warning */ .btn-warning {color:#fff; background:#f0ad4e; border-color:#f0ad4e;} .btn-warning.focus,.btn-warning:focus {color:#fff; background-color:#dfa149; border-color:#dfa149} .btn-warning:hover {color:#fff; background:#dfa149; border-color:#dfa149} .btn-warning.active,.btn-warning:active,.open>.dropdown-toggle.btn-warning {color:#fff; background-color:#dfa149; border-color:#dfa149} /* danger */ .btn-danger {color:#fff; background:#f24a45; border-color:#f24a45;} .btn-danger.focus,.btn-danger:focus {color:#fff; background-color:#e24541; border-color:#e24541} .btn-danger:hover {color:#fff; background:#e24541; border-color:#e24541} .btn-danger.active,.btn-danger:active,.open>.dropdown-toggle.btn-danger {color:#fff; background-color:#e24541; border-color:#e24541} /* dark */ .btn-dark {color:#fff; background:#555555; border-color:#555555;} .btn-dark.focus,.btn-dark:focus {color:#fff; background-color:#474747; border-color:#474747} .btn-dark:hover {color:#fff; background:#474747; border-color:#474747} .btn-dark.active,.btn-dark:active,.open>.dropdown-toggle.btn-dark {color:#fff; background-color:#474747; border-color:#474747} /* Button */ .btn_s, .btn_m, .btn_l, .btn_sm, .btn_xl {display:inline-block; vertical-align:middle; padding:0 25px; margin:0; transition:0.2s; border-radius:5px; line-height:1; color:#fff; font-size:15px; border:1px solid #4f4e56; background-color:#4f4e56; word-break:keep-all; box-sizing:border-box; text-align:center;} .btn_s i, .btn_m i, .btn_l i, .btn_sm i, .btn_xl i {margin-right:3px;} .btn_s + .btn_s, .btn_m + .btn_m, .btn_l + .btn_l, .btn_sm + .btn_sm, .btn_xl + .btn_xl {margin-left:5px;} .btn_s {line-height:23px; padding:0 15px; font-size:14px; height:25px;} .btn_m {line-height:31px; padding:0 35px; font-size:16px; height:35px;} .btn_l {line-height:40px; padding:0 55px; font-size:16px;} .btn_sm {line-height:35px; padding:0 15px; font-size:16px; height:35px;} .btn_xl {line-height:60px; padding:0 40px; font-size:20px; height:60px;} .btn_s:hover, .btn_m:hover, .btn_l:hover, .btn_sm:hover, .btn_xl:hover {background:#003880; color:#fff; border-color:#003880;} button:disabled {color:#888 !important; border-color:#d9d9d9 !important; background-color:#e4e4e4 !important; cursor:default;} .down_function button:disabled {opacity:1 !important;} /* button:disabled:hover, button:disabled:focus {background-color:#e4e4e4 !important; border-color:#c4c4c4 !important;} */ .btn_line {color:#00980e; border-color:#00980e;} .btn_line:hover {background:#F2F2F2;} /* .btn-delete {color:#c06565; border-color:#c06565; background:#fff;} */ .btn-delete:hover {border-color:#c06565; background:#c06565; color:#fff;} .btn-write {padding-left:28px; position:relative;} .btn-write:before {content:""; width:1px; height:24px; background:#ddd; position:absolute; display:block; left:13px; top:50%; transform:translateY(-50%);} /* btn_icon */ .btn_icon {display:inline-flex; justify-content:center; align-items:center; width:25px; height:25px; line-height:30px; padding:0; margin:0; position:relative; font-size:16px; background:#fff; text-align:center; border:1px solid #bbb; border-radius:50%; transition:0.2s; vertical-align:middle;} .btn_icon:hover, .btn_icon.active {color:#fff; border-color:#4da1f8; background:#4da1f8;} .btn_icon + .btn_icon {margin-left:5px;} .btn_icon i {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); line-height:1;} .btn_icon.btn_icon_small {width:24px; height:24px; font-size:13px;} .btn_icon.btn_iconRound:hover {color:#5b95ff; border-color:#5b95ff; background:#fff;} table .btn_icon {height:25px; font-size:14px; width:25px; border:1px solid #bbb; border-radius:50%;} .tui-grid-table .btn_icon {height:20px; font-size:14px; width:20px;} .tui-grid-table input[type="checkbox"] {display:inline-block;} /* 아이콘만 있는 버튼 */ /* .icon_btn {display:inline-flex; justify-content:center; align-items:center; width:30px; height:30px; padding:0; margin:0; position:relative; font-size:16px; background:none; text-align:center; border:none; transition:0.2s; vertical-align:middle;} .icon_btn:hover {color:#1fa0dc; background:none;} */ .icon_btn{display:inline-flex; align-items:center; justify-content:center; vertical-align:top; width:30px; height:30px; padding:0; margin:0; position:relative; border:0; outline:0; font-size:16px; background-color:transparent; background-position:center center; background-repeat:no-repeat;} .icon_btn:hover, .icon_btn.active {background-color:transparent; background-position:center center; background-repeat:no-repeat; color:#1fa0dc;} .icon_btn:after{display:block; line-height:1; font-family:"IcoFont"; font-size:16px; text-indent:0;} .icon_btn[disabled] {background-color:#e9edf1 !important; color:#000 !important;} .mg_search > button:after {font-family:"IcoFont";} .icon_btn:hover:after, .icon_btn.active:after{color:#26a1ff;} .icon_btn.icon_setting:after{content:"\ef39";} .icon_btn.icon_sort:after{content:"\efee";} .icon_btn.icon_search:after{content:"\ed11";} .icon_btn.icon_edit:after{content:"\ebf6";} .icon_btn.icon_edit2:after{content:"\ebf9";} .icon_btn.icon_delete:after{content:"\eebb";} .icon_btn.icon_add:after{content:"\efc2";} .icon_btn.icon_link:after{content:"\ef70";} .icon_btn.icon_copy:after{content:"\ede9";} .icon_btn.icon_share:after{content:"\efe5";} .icon_btn.icon_cut:after{content:"\eef5";} .icon_btn.icon_download:after{content:"\ef08";} .icon_btn.icon_upload:after{content:"\f01c";} .icon_btn.icon_view:after{content:"\ed11";} .icon_btn.icon_result:after{content:"\ef21";} .icon_btn.icon_unzip:after{content:"\ef35";} .icon_btn.icon_reload:after{content:"\ec7f"; transform:scaleX(-1); font-size:12px;} .icon_btn.icon_prev:after{content:"\ea9d";} .icon_btn.icon_next:after{content:"\eaa0";} .icon_btn.icon_report:after{display:none;} .icon_btn.icon_check:after{content:"\eed6";} .icon_btn.icon_close:after{content:"\eee4";} .icon_btn.icon_cancel:after{content:"\eee4";} /* .icon_btn.icon_expand:after{content:"\ef1e";} */ .icon_btn.icon_play:after{content:"\eca6";} .icon_btn.icon_stop:after{content:"\ecb1";} .icon_btn.icon_save:after{content:"\ee00";} .icon_btn.icon_refresh:after{content:"\efd1";} .icon_btn.icon_undo:after{content:"\efd4";} .icon_btn.icon_redo:after{content:"\efd4"; transform:scaleX(-1);} .icon_btn.icon_history:after{content:"\ef46";} .icon_btn.icon_share:after{content:"\efe5";} .icon_btn.icon_close_side:after{content:"\eab5";} .icon_btn.icon_graph:after{content:"\e981";} .icon_btn.icon_preview:after{content:"\ed13";} .icon_btn.icon_run:after{content:"\eca6";} .icon_btn.icon_drag:after{content:"\ef0a";} .icon_btn.icon_calendar:after{content:"\eecd";} .icon_btn.icon_paste{background-image:url(../images/icon/icon_black_paste.png);} .icon_btn.icon_paste:hover{background-image:url(../images/icon/icon_active_paste.png);} .icon_btn.icon_expand{background-image:url(../images/icon/icon_black_expand.png);} .icon_btn.icon_areaDiv{background-image:url(../images/icon/icon_black_areaDiv.png);} .icon_btn.icon_areaDiv:hover, .icon_btn.icon_areaDiv.active{background-image:url(../images/icon/icon_active_areaDiv.png);} .icon_btn.icon_compareDiv{background-image:url(../images/icon/icon_black_compareDiv.png);} .icon_btn.icon_compareDiv:hover, .icon_btn.icon_compareDiv.active{background-image:url(../images/icon/icon_active_compareDiv.png);} .icon_btn.icon_report{background-image:url(../images/icon/icon_black_report.png);} .icon_btn.icon_report:hover, .icon_btn.icon_report.active{background-image:url(../images/icon/icon_active_report.png);} .icon_btn.icon_folder{background-image:url(../images/icon/icon_black_folder.png);} .icon_btn.icon_folder:hover{background-image:url(../images/icon/icon_active_folder.png);} .icon_btn.icon_disconnect{background-image:url(../images/icon/icon_black_disconnect.png);} .icon_btn.icon_disconnect:hover{background-image:url(../images/icon/icon_active_disconnect.png);} .icon_btn.icon_popup{background-image:url(../images/icon/icon_black_popup.png);} .icon_btn.icon_popup:hover{background-image:url(../images/icon/icon_active_popup.png);} .icon_btn.icon_batch1{background-image:url(../images/icon/icon_batch2.png);} .icon_btn.icon_batch2{background-image:url(../images/icon/icon_batch2.png); animation:move_batch infinite 3s linear;} .icon_btn.icon_detail{background-image:url(../images/icon/icon_black_detail.png);} .icon_btn.icon_search2{background-image:url(../images/icon/icon_black_search2.png);} /* .icon_btn.icon_expand:after, */ .icon_btn.icon_areaDiv:after, .icon_btn.icon_compareDiv:after, .icon_btn.icon_areaDiv:after, .icon_btn.icon_report:after, .icon_btn.icon_batch1:after, .icon_btn.icon_batch2:after, .icon_btn.icon_disconnect:after, .icon_btn.icon_detail:after, .icon_btn.icon_folder:after, .icon_btn.icon_paste:after{display:none;} @keyframes move_batch { 0% {transform:rotate(0);} 100% {transform:rotate(360deg);} } /* 투명 버튼 */ .btn_transparent {padding:0 10px; background:transparent; border:none; transition:0.2s; height:30px; line-height:30px; border-radius:5px; display:inline-block; vertical-align:middle;} .btn_transparent:hover {background:#e1e1e1;} .btn_transparent i {margin-left:5px;} /* Button */ .m_btn {display:inline-block; line-height:1; padding:0 15px; margin:0; font-size:15px; text-align:center; border:1px solid #222; border-radius:6px; color:#666; background:#fff; font-weight:600; transition:0.2s; height:34px; line-height:33px; vertical-align:middle;} .m_btn i {font-size:15px; margin-right:10px; line-height:1; vertical-align:middle;} .m_btn.m_btn_xsmall i {margin-right:5px;} .m_btn + .m_btn {margin-left:3px;} .m_btn + .btn-group {margin-left:3px;} .btn-group + .btn-group {margin-left:3px;} .m_btn:focus, .m_btn:active {outline:none !important; box-shadow:none !important;} .m_btn:hover {color:#214ca4; border-color:#214ca4; background:#fff;} .m_btn.disabled {color:#aaadb0 !important; border-color:#e5e8ec !important; background:#e5e8ec !important;} .m_btn > .count {display:inline-block; padding:0 10px; height:20px; line-height:20px; margin-left:10px; color:#fff; font-size:12px; border-radius:10px; background-color:#1dbae1;} .m_btn.m_btn_large {font-size:17px; padding:0 30px; border-radius:6px; height:40px; line-height:38px;} .m_btn.m_btn_xlarge {font-size:20px; padding:0 90px; border-radius:6px; height:60px; line-height:58px;} .m_btn.m_btn_small {padding:0 16px;} .m_btn.m_btn_xsmall {padding:0 12px; height:26px; font-size:12px; line-height:25px;} .m_btn.m_btn_xsmall i {font-size:12px;} .m_btn.m_btn_tiny {padding:0 10px; height:20px; font-size:11px; line-height:18px; font-weight:500;} .m_btn.m_btn_tiny i {font-size:11px; margin:0 5px 0 0; line-height:18px;} .m_btn.m_btn_tiny + .m_btn.m_btn_tiny {margin-left:4px;} .m_btn.active {color:#ffffff; border-color:#4f4e56; background:#4f4e56;} .m_btn.active:hover {border-color:#003880; background:#003880;} .m_btnRound {display:inline-block; height:20px; padding:0 15px; margin:2px 4px; color:#fff; font-size:12px; text-align:center; border:1px solid #003880; background-color:#003880; border-radius:10px;} .m_btnRound:focus, .m_btnRound:active {outline:none !important; box-shadow:none !important;} .m_btnRound:hover {border:1px solid #1dbae1; background-color:#1dbae1;} /* *********************** btn *********************** */ /* primary */ .m_btn.btn-primary, .btn-primary {color:#ffffff; border-color:#4da1f8; background:#4da1f8;} .m_btn.btn-primary:hover, .btn-primary:hover {border-color:#214ca4; background:#214ca4;} /* active */ .m_btn.btn-active, .btn-active {border:1px solid #4587fa; color:#4587fa;} .m_btn.btn-active:hover, .btn-active:hover {color:#ffffff; border-color:#4da1f8; background:#4da1f8;} /* success */ .m_btn.btn-success {color:#fff; border-color:#1ad2a0; background:#1ad2a0;} .m_btn.btn-success:hover {border-color:#18c495; background:#18c495;} /* info */ .m_btn.btn-info {color:#fff; border-color:#a7a7a7; background:#a7a7a7;} .m_btn.btn-info:hover {border-color:#969696; background:#969696;} /* .m_btn.btn-info {color:#c06565; border-color:#c06565; background:#fff;} .m_btn.btn-info:hover {border-color:#c06565; background:#c06565; color:#fff;} */ /* warning */ .m_btn.btn-warning {color:#fff; border-color:#f0ad4e; background:#f0ad4e;} .m_btn.btn-warning:hover {border-color:#dfa149; background:#dfa149;} /* danger */ .m_btn.btn-danger {color:#fff; border-color:#f24a45; background:#f24a45;} .m_btn.btn-danger:hover {border-color:#e24541; background:#e24541;} /* dark */ .m_btn.btn-dark {color:#fff; border-color:#555555; background:#555555;} .m_btn.btn-dark:hover {border-color:#474747; background:#474747;} /* delete */ .m_btn.btn-delete {color:#c06565; border-color:#c06565; background:#fff;} .m_btn.btn-delete:hover {border-color:#c06565; background:#c06565; color:#fff;} .table_add {margin-top:35px} .add_btn_area {text-align:right; margin-top:10px;} .m_icon_btn {width:35px; height:35px; padding:0;} .m_icon_btn i {margin:0; height:35px; line-height:33px;} /* dropdown */ .m_btn.dropdown-toggle::after {display:inline-block; margin-left:.255em; vertical-align:.255em; content:""; border:none; width:16px; height:12px; --bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23004bb6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-color:transparent; background-image:var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none); background-repeat:no-repeat; background-position:center center; background-size:16px 12px; position:relative; top:0; vertical-align:middle;} .m_btn.dropdown-toggle:hover::after {--bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23004bb6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");} .m_btn.dropdown-toggle.btn-primary::after, .m_btn.dropdown-toggle.btn-success::after, .m_btn.dropdown-toggle.btn-info::after, .m_btn.dropdown-toggle.btn-warning::after, .m_btn.dropdown-toggle.btn-danger::after, .m_btn.dropdown-toggle.btn-dark::after {--bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");} /* 사각 버튼 */ .t_btn {display:inline-block; vertical-align:middle; line-height:16px; padding:0 7px; margin:0px; color:#fff; font-size:11px; border:none; border-radius:3px; background:#0c8ce6; transition:0.2s; border:1px solid #0c8ce6; /* min-width:36.25px; */} .t_btn + .t_btn {margin-left:1px;} .t_btn:hover {color:#fff; background:#00b3ee; border-color:#00b3ee;} .t_btn.btn_border {background:#f4fcff; color:#3d6bdf; border-color:#a5c6f7;} .t_btn.btn_border:hover {color:#fff; background:#00b3ee; border-color:#00b3ee;} .t_btn:disabled, .t_btn.disabled {color:#fff; border-color:#cbcaca; background-color:#cbcaca; cursor:default;} .t_btn:disabled:hover, .t_btn:disabled:focus, .t_btn.disabled:hover, .t_btn.disabled:focus {background-color:#cbcaca; border-color:#cbcaca;} .t_btn.btn_border:disabled, .t_btn.btn_border.disabled {color:#cbcaca; border-color:#cbcaca; background-color:#fff; cursor:default;} .t_btn.btn_border:disabled:hover, .t_btn.btn_border:disabled:focus, .t_btn.btn_border.disabled:hover, .t_btn.btn_border.disabled:focus {background-color:#fff; border-color:#cbcaca;} .tui-grid-table .t_btn {margin:0;} .btn_line {color:#00980e; border-color:#00980e;} .btn_line:hover {background:#F2F2F2;} /* color btn */ .btn_white {color:#000; border-color:#4f4e56; background-color:#ffffff;} .btn_white:hover{color:#fff; border-color:#4f4e56; background-color:#4f4e56;} .btn_gray {color:#fff; border-color:#8a8a8a; background-color:#8a8a8a;} .btn_gray:hover {color:#fff; border-color:#666666; background-color:#666666;} .btn_navy {color:#fff; border-color:#142160; background-color:#142160;} .btn_navy:hover {color:#fff; border-color:#070b21; background-color:#070b21;} .btn_red {color:#fff; border-color:#D41900; background-color:#D41900;} .btn_red:hover {color:#fff; border-color:#ff0000; background-color:#ff0000;} .btn_blue {color:#fff; border-color:#0c8ce6; background-color:#0c8ce6;} .btn_blue:hover {color:#fff; border-color:#3035af; background-color:#3035af;} .btn_dark {color:#fff; border-color:#4f4e56; background-color:#4f4e56;} .btn_dark:hover {color:#fff; border-color:#003880; background-color:#003880;} ul li a, table a {transition:0.2s; color:#000;} ul li a:hover, table a:hover {color:#26a1ff;} button.btn_active, a.btn_active {color:#fff; border-color:#4f4e56; background-color:#4f4e56;} button.btn_active:hover, a.btn_active:hover {border-color:#ef7158; background-color:#ef7158;} button.btn_black, a.btn_black {color:#fff; border-color:#4f4e56; background-color:#4f4e56;} button.btn_black:hover, a.btn_black:hover {border-color:#003880; background-color:#003880;} button.btn_purple, a.btn_purple {color:#fff; border-color:#8331a4; background-color:#8331a4;} button.btn_purple:hover, a.btn_purple:hover {border-color:#8331a4; background-color:#fff; color:#8331a4;} button.btn_gray, a.btn_gray {color:#fff; border-color:#555; background-color:#555;} button.btn_gray:hover, a.btn_gray:hover {border-color:#555; background-color:#fff; color:#555;} button.btn_red, a.btn_red {color:#fff; border-color:#fd3237; background-color:#fd3237;} button.btn_red:hover, a.btn_red:hover {border-color:#fd3237; background-color:#fff; color:#fd3237;} .btn_navy {color:#fff; border-color:#142160; background-color:#142160;} .btn_grey {color:#fff; background:#7f7f7f; border:0;} .btn_orange {color:#fff; background:#ef7158; border:0;} /* ********** 개인자료 관리 ********** */ .top_search_area {position:relative; overflow:hidden; padding:0; width:100%;} .top_search_wrap {display:flex; justify-content:space-between; align-items:center;} .top_search_area .search_item {display:inline-block; margin-right:30px; vertical-align:middle;} .top_search_area .search_item:last-child {margin-right:0;} .top_search_area .search_item .search_label {display:inline-block; padding:5px 10px 0 0; vertical-align:top;} .top_search_area .search_item .search_condition {display:inline-block; vertical-align:middle;} .top_search_area .search_item .search_condition .form-control {display:inline-block; width:auto; min-width:100px; vertical-align:top;} .top_search_area .search_item .search_condition button {display:inline-block; vertical-align:top;} .top_search_area .search_item .search_condition .select2-container {margin-right:0;} .top_search_wrap:after {display:none;} /*=========================================================================================================================== 공통 레이아웃 =============================================================================================================================*/ /* 상단영역 */ header.header {background:#fff; width:100%; height:110px; border-bottom:1px solid #ebebeb; position:relative; transition:0.3s; z-index:20;} /* 정보성 영역 */ header.header .header_top {height:60px; border-bottom:1px solid #ebebeb; position:relative; z-index:6; background:#fff;} header.header .header_top h1.logo {display:inline-block; padding:0; margin:17px 0 0 24px; width:auto; height:26px;} header.header .header_top h1.logo a {display:inline-block; height:26px; font-size:22px; vertical-align:top; font-weight:700;} header.header .header_top h1.logo a img {vertical-align:top; width:auto; height:26px;} header.header .header_top h1.logo strong {font-size:14px; font-weight:700; color:#333; vertical-align:top; line-height:25px; height:23px; display:inline-block; margin-left:5px; padding:0 18px; color:#fff; background:#333; border-radius:12px;} /* 상단 기능버튼 영역 */ header.header .header_top .user_info {font-size:13px; color:#000; display:inline-block; float:right; height:44px; line-height:42px; padding-right:25px;} header.header .header_top .user_info strong {color:#1fa0dc; font-weight:500;} header.header .header_top ul.top_function {display:inline-block; float:right; padding:0; margin:0; padding-right:15px;} header.header .header_top ul.top_function > li {display:inline-block; float:left; margin-left:0; line-height:44px; position:relative;} header.header .header_top ul.top_function > li button {border:none; outline:none; padding:0 5px; background:none; color:#303030; transition:0.2s; font-size:18px; margin-top:0; position:relative; width:40px; height:60px;} header.header .header_top ul.top_function > li button:hover, header.header .header_top ul.top_function > li button:focus {color:#54b9ff;} header.header .header_top ul.top_function > li button.btn_full_screen.active i:before {content:"\f422";} header.header .header_top ul.top_function > li button#showPanelNotice {position:relative;} header.header .header_top ul.top_function > li button#showPanelNotice span {background:#f96f70; padding:0 5px; border-radius:10px; line-height:12px; font-size:10px; color:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); margin:-9px 0 0 13px;} header.header .header_top ul.top_function > li button#showPanelSolution {position:relative; z-index:2;} header.header .header_top ul.top_function > li button#showPanelSolution ~ .pulse-ring {display:block; border-radius:38px; height:38px; width:38px; animation:animation-pulse 3.5s ease-out; animation-iteration-count:infinite; opacity:0; border-width:1px; border-style:solid; border-color:#999; position:absolute; left:1px; top:11px; background:#d9d9d9;} header.header .header_top ul.top_function > li button#showPanelSolution:hover ~ .pulse-ring, header.header .header_top ul.top_function > li button#showPanelSolution:focus ~ .pulse-ring {border-color:#54b9ff; background:#90d2ff;} @-webkit-keyframes animation-pulse { 0% {-webkit-transform:scale(0.1, 0.1); opacity:0;} 60% {-webkit-transform:scale(0.1, 0.1); opacity:0;} 65% {opacity:1;} 100% {-webkit-transform:scale(1, 1); opacity:0;} } @keyframes animation-pulse { 0% {-webkit-transform:scale(0.1, 0.1); opacity:0;} 60% {-webkit-transform:scale(0.1, 0.1); opacity:0;} 65% {opacity:1;} 100% {-webkit-transform:scale(1, 1); opacity:0;} } /* 제안기능 */ header.header .header_top ul.top_function > li .dropdown_solution {padding:20px 14px; background:#fff; border-radius:15px; position:absolute; right:0; top:100%; box-shadow:0 5px 20px rgba(0,0,0,0.2); min-width:300px; min-height:100px; line-height:1.1; border:1px solid #ddd;} ul.top_function > li .dropdown_solution h4 {font-size:18px; font-weight:600; color:#222; line-height:1; padding:0 10px 8px; margin:0;} ul.top_function > li .dropdown_solution ul {padding:0; margin:0;} ul.top_function > li .dropdown_solution ul li {padding:0; margin:8px 0 0; list-style:none; border:1px solid #ddd; border-radius:10px;} ul.top_function > li .dropdown_solution ul li a {display:block; font-size:14px; color:#666; transition:0.2s; padding:20px;} ul.top_function > li .dropdown_solution ul li a:hover {color:#54b9ff;} ul.top_function > li .dropdown_solution ul li a img {width:110px; display:inline-block; vertical-align:middle;} ul.top_function > li .dropdown_solution ul li a span {display:inline-block; margin:0; line-height:1.3; width:calc(100% - 125px); vertical-align:middle; margin-left:10px;} /* 사용자 정보 */ header.header .header_top ul.top_function > li button.dropdown-toggle::after {/* border-top-color:#303030; */ display:none;} header.header .header_top ul.top_function > li .user_info_area {padding-top:50px; background:#fff; border-radius:15px; position:absolute; right:0; top:100%; box-shadow:0 5px 20px rgba(0,0,0,0.2); min-width:300px; /* min-height:280px; */text-align:center; line-height:1.1; border:1px solid #ddd;} .user_info_area .user_initials {width:70px; height:70px; border-radius:50%; overflow:hidden; position:relative; display:block; background:#4da9f8 url(../images/icon/ic-user.png) no-repeat center center; margin:0 auto; text-align:center; line-height:70px; font-weight:300; font-size:24px; color:#fff; text-transform:uppercase;} .user_info_area .user_nm {display:block; margin-top:30px; line-height:18px;} .user_info_area .user_nm strong {font-size:18px; font-weight:700; color:#222; display:block;} .user_info_area .user_nm span {font-size:18px; color:#222; display:block; font-weight:600; margin-top:5px;} .user_info_area p.user_email {font-size:14px; margin:12px 0 0;} .user_info_area p.user_email a {color:#000000; font-weight:500; transition:0.2s;} .user_info_area p.user_email a:hover, .user_info_area p.user_email a:focus {color:#54b9ff;} header.header .header_top ul.top_function > li .user_info_area a.btn_view_profile {display:block; width:100px; font-size:14px; background:#3583d5; line-height:34px; height:34px; border-radius:17px; transition:0.2s; border:none; outline:none; color:#3583d5; margin:5px auto; font-weight:600; background:#e7eff7;} /* header.header .header_top ul.top_function > li .user_info_area a.btn_view_profile:hover, header.header .header_top ul.top_function > li .user_info_area a.btn_view_profile:focus {background:#54b9ff; color:#fff; border-color:#54b9ff;} */ .user_info_area ul.my_function {padding:0; margin:0; display:flex; margin-top:35px;} .user_info_area ul.my_function li {padding:15px 0; margin:0; list-style:none; line-height:25px; width:50%; border-top:1px solid #ddd;} .user_info_area ul.my_function li:first-child {border-right:1px solid #ddd;} .user_info_area ul.my_function li a {display:block; color:#666; font-weight:500; transition:0.2s; text-align:center; font-size:15px;} .user_info_area ul.my_function li a:hover, .user_info_area ul.my_function li a:focus {color:#54b9ff;} .user_info_area ul.my_function li a i {font-size:18px; margin-right:10px;} header.header .header_top ul.top_function > li .dropdown-menu > li {display:block;} header.header .header_top ul.top_function > li .top_folding {margin-left:10px;} header.header .header_top ul.top_function > li .top_folding button {padding:0 3px; margin:0; font-size:17px;} header.header .header_top ul.top_function > li .top_folding button i {font-weight:700;} /* 기능 영역 */ header.header .header_bottom {position:relative; height:50px; z-index:4; background:#fff;} header.header .header_bottom:after {content:""; display:block; width:100%; height:0; clear:both; float:none;} header.header .header_bottom button#menu_toggle {width:60px; height:50px; position:absolute; left:0; top:0; border:none; outline:none; transition:0.2s; background:url(../images/icon/icon_toggle.png) no-repeat center center;} /* header.header .header_bottom button#menu_toggle:hover {background:url(../images/icon/icon_toggle_hover.png) no-repeat center center;} */ header.header .header_bottom h2.top_page_title {font-size:20px; font-weight:700; display:inline-block; padding:14px 0 0 69px;} header.header .header_bottom ul.page_location {display:inline-block; padding:0; margin:0; position:absolute; right:8px; top:1px;} header.header .header_bottom ul.page_location li {font-size:15px; list-style:none; float:left; line-height:50px; padding:0; margin:0; padding-right:10px; margin-right:10px; position:relative;} header.header .header_bottom ul.page_location li:after {content:""; display:inline-block; width:16px; height:16px; background:url(../images/icon/icon_location_arrow.png) no-repeat center center; position:absolute; right:-7px; top:50%; transform:translate(0,-50%);} header.header .header_bottom ul.page_location li:last-child:after {display:none;} header.header .header_bottom ul.page_location li a {font-weight:500; color:#666; display:inline-block; transition:0.2s;} header.header .header_bottom ul.page_location li a:hover, header.header .header_bottom ul.page_location li:last-child a {color:#222; font-weight:600;} header.header .header_bottom ul.page_location li strong {font-weight:700; color:#005ee3;} header.header .header_bottom .header_bottom_function {position:absolute; right:0; top:0; padding-right:20px;} header.header .header_bottom .header_bottom_function button {border:none; outline:none; background:none; height:41px; line-height:41px; font-size:14px; transition:0.2s; color:#000; padding:0 20px;} header.header .header_bottom .header_bottom_function button:hover {color:#54b9ff;} header.header .header_bottom .header_bottom_function button i {margin-right:8px;} header.header .header_bottom .header_bottom_function button.btn_full_screen.active i:before {content:"\f422";} /* 상단 기능 버튼 아이콘 */ header.header .header_top ul.top_function li > button:before, header.header .header_top ul.top_function li > div button:before {content:""; display:inline-block; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);} .btn_solution:before {background:url(../images/icon/ic-solution.svg) no-repeat center center; width:28px; height:28px;} .btn_helpmanual:before {background:url(../images/icon/ic-help.png) no-repeat center center; width:28px; height:28px;} .btn_history:before {background:url(../images/icon/ic-history.png) no-repeat center center; width:28px; height:28px;} .btn_alarm:before {background:url(../images/icon/ic-alarm.svg) no-repeat center center; width:28px; height:28px;} .btn_userinfo:before {background:url(../images/icon/ic-people.png) no-repeat center center; width:28px; height:28px;} .btn_full_screen:before {background:url(../images/icon/ic-screen.svg) no-repeat center center; width:28px; height:28px;} /* ********** 통합검색 ********** */ header.header .header_top button.top_search_toggle_btn {width:30px; height:23px; border:none; background:none; transition:0.2s; color:#000; margin:10px 0 0 10px; vertical-align:top; font-size:18px; text-align:center; outline:none; line-height:23px;} header.header .header_top button.top_search_toggle_btn:hover, header.header .header_top button.top_search_toggle_btn:focus, header.header .header_top button.top_search_toggle_btn:active {color:#54b9ff;} /* 통합검색 영역 */ header.header .top_search_area {display:block; position:fixed; left:0; top:-100%; width:100%; height:auto; padding:70px 40px 80px; background:#fff; z-index:5; transition:0.4s;} .top_search_area .search_con {padding:0; margin:0 auto; position:relative; width:100%; max-width:1000px;} .top_search_area .search_con button.btn_search {width:60px; height:60px; line-height:60px; background:none; transition:0.2s; border:none; outline:none; color:#000; position:absolute; left:0; top:0; text-align:left; font-size:34px;} /* .top_search_area .search_con button.btn_search:after {content:""; display:block; width:1px; height:30px; background:#000; position:absolute; left:60px; top:15px;} */ .top_search_area .search_con button.btn_search:hover {color:#54b9ff;} .top_search_area .search_con input {width:100%; height:60px; line-height:60px; border:none; padding:0 40px 0 80px; color:#000; font-size:28px; font-weight:700;} .top_search_area .search_con input::placeholder {color:#999; font-weight:300;} .top_search_area .search_con .btn_clear {opacity:0; transition:all ease 0.2s; color:transparent; width:60px; height:60px; position:absolute; top:0; right:0; outline:none; border:none; background:url(../images/icon/icon_search_cancel.png) no-repeat center center; background-size:30px 30px;} .top_search_area .search_con input:focus ~ .btn_clear {opacity:1;} .top_search_area .search_link_area {margin:80px auto 0; width:100%; max-width:1000px;} .top_search_area h3.fast_link_title {font-size:16px; line-height:30px; color:#8ba6ff; font-weight:700; margin:0 0 13px;} .top_search_area ul.top_fast_link {padding:0; margin:0;} .top_search_area ul.top_fast_link li {padding:0; margin:0 0 8px; list-style:none;} .top_search_area ul.top_fast_link li:last-child {margin-bottom:0;} .top_search_area ul.top_fast_link li a {display:block; padding:5px 10px 5px 38px; position:relative; font-size:16px; line-height:20px; color:#000; transition:0.2s; background:#fff; min-height:30px; font-weight:700;} .top_search_area ul.top_fast_link li a:before {content:"\ea94"; font-family:"Icofont"; display:inline-block; width:38px; height:30px; text-align:center; line-height:29px; color:#8ca7ff; font-size:20px; line-height:30px; position:absolute; left:0; top:0; transition:0.3s;} .top_search_area ul.top_fast_link li a:hover {background:#f4f4f4;} .top_search_area ul.top_fast_link li a:hover:before {transform:rotate(-45deg);} /* 다이컴 수정 */ .top_search_area .ts_item_info {display:inline-block; font-size:15px; font-weight:700; margin-right:10px; vertical-align:middle;} .top_search_area .ts_item_info i {margin-right:5px;} #div_emrOPtion.top_search_area .m_radio, #div_dicomOPtion.top_search_area .m_check {position:relative; top:3px;} .m_check + .ts_item_info, .m_radio + .ts_item_info, .form_control + .ts_item_info, .form-control + .ts_item_info {margin-left:30px;} /* 다이컴 줌인 / 줌아웃 */ .div_dicom_view {position:relative;} .div_dicom_view .buttons {position:absolute; right:20px; top:20px; z-index:10;} .div_dicom_view .buttons .btn {width:25px; height:25px; line-height:23px; position:relative; text-align:center; text-indent:-9999px; opacity:0; transition:0.2s;} .div_dicom_view .buttons .btn:before {content:""; display:inline-block; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:16px; text-indent:0;} .div_dicom_view:hover .buttons .btn {opacity:1;} .div_dicom_view .buttons #zoomInButton.btn:before {content:"\2b";} .div_dicom_view .buttons #zoomOutButton.btn:before {content:"\f068";} .div_dicom_view .buttons #resetButton.btn:before {content:"\f111"; font-size:7px;} /* 카탈로그 상세 줌인 / 줌아웃 */ #assetDetailFile #splitFileView {position:relative;} #assetDetailFile #splitFileView .buttons {position:absolute; right:20px; top:64px; z-index:10;} #assetDetailFile #splitFileView .buttons .btn {width:25px; height:25px; line-height:23px; position:relative; text-align:center; text-indent:-9999px; opacity:0; transition:0.2s;} #assetDetailFile #splitFileView .buttons .btn:before {content:""; display:inline-block; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:16px; text-indent:0;} #assetDetailFile #splitFileView:hover .buttons .btn {opacity:1;} #assetDetailFile #splitFileView .buttons #zoomInButton.btn:before {content:"\2b";} #assetDetailFile #splitFileView .buttons #zoomOutButton.btn:before {content:"\f068";} #assetDetailFile #splitFileView .buttons #resetButton.btn:before {content:"\f111"; font-size:7px;} header.header .header_con {position:relative; z-index:2;} /* 흐림효과 */ header.header .blur_filter {z-index:1; background:rgba(232,232,237,.4); position:fixed; opacity:0; top:0; right:0; bottom:0; left:0; width:100%; height:100%; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); visibility:hidden; transition:0.4s;} header.header .top_search_area.active {top:44px;} header.header .blur_filter.active {opacity:1; visibility:visible;} /*====================================== 공통 판넬 ========================================*/ .common_panel {background:#fff; position:fixed; right:-100%; top:0; width:370px; height:100vh; padding:20px; z-index:9; box-shadow:-1px 0 6px 0 rgba(0, 0, 0, 0.1); transition:0.5s; overflow-y:auto;} .common_panel.active {right:0;} .common_panel::-webkit-scrollbar-track {background:rgba(255,255,255,0.0);} /*Track*/ .common_panel::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.0);} /*Handle*/ .common_panel:hover::-webkit-scrollbar-track {background:rgba(255,255,255,0.7);} /*Track*/ .common_panel:hover::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.15);} /*Handle*/ .common_panel:hover::-webkit-scrollbar-thumb:hover {background:rgba(0,0,0,0.3);} /* Handle on hover */ .panel_top_title {position: sticky; top: 10px; z-index: 2; margin: 0px; box-shadow: 0 -25px 0 25px #fff; background-color: #fff; display: flex; align-items: center; justify-content: space-between;} .common_panel button.btn_close {position:absolute; right:20px; top:16px; width:14px; height:14px; transition:0.2s; border:none; outline:none; opacity:0.5; padding:3.5px; background:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") no-repeat center center;} .common_panel button.btn_close:hover {opacity:1;} .common_panel h2.panel_title {font-size:18px; font-weight:700; line-height:25px; margin:10px 0; color:#222; padding:10px 20px;} .common_panel .btn_alldelete {border:1px solid #666; background:#fff; border-radius:12px; height:24px; line-height:20px; font-size:14px; color:#666; position:absolute; left:65px; padding:0 10px;} /* 탭 */ .common_panel ul.panel_tab {padding:0; margin:0 0 10px; overflow:hidden; border-bottom:1px solid #e1e1e1; display:flex; justify-content:flex-start;} .common_panel ul.panel_tab li {padding:0; margin:0 20px 0 0; list-style:none;} .common_panel ul.panel_tab li button {color:#838383; font-size:15px; font-weight:400; line-height:40px; position:relative; display:block; padding:0 5px; border:none;} .common_panel ul.panel_tab li button.active, .common_panel ul.panel_tab li button:hover {color:#000; font-weight:700;} .common_panel ul.panel_tab li button.active:after, .common_panel ul.panel_tab li button.active:hover:after {content:""; display:block; width:100%; height:3px; transition:0.2s; background:#54b9ff; position:absolute; left:0; bottom:0;} .common_panel ul.panel_tab li a {color:#838383; font-size:15px; font-weight:400; line-height:40px; position:relative; display:block; padding:0 5px; border:none;} .common_panel ul.panel_tab li.active a, .common_panel ul.panel_tab li a:hover {color:#000; font-weight:700; border:none;} .common_panel ul.panel_tab li.active a:after, .common_panel ul.panel_tab li a:hover:after {content:""; display:block; width:100%; height:3px; transition:0.2s; background:#54b9ff; position:absolute; left:0; bottom:0;} /* 리스트 */ .common_panel ul.panel_lst {padding:0; margin:0;} .common_panel ul.panel_lst li {padding:20px 20px 30px 20px; margin:0; border-bottom:1px solid #eee; overflow:hidden; position:relative;} .common_panel ul.panel_lst li:last-child {border-bottom:none;} .common_panel ul.panel_lst li .p_lst_top {position:relative; font-size:12px; color:#999; margin-bottom:20px;} .common_panel ul.panel_lst li .p_lst_top span.fold {} .common_panel ul.panel_lst li .p_lst_top span.fold i {margin-right:3px; font-size:18px; vertical-align:middle;} .common_panel ul.panel_lst li .p_lst_top span.fold span.fold_nm {} .common_panel ul.panel_lst li .p_lst_top button.icon_btn {position:absolute; right:-6px; top:-2px; transition:0.2s; font-size:11px; opacity:0; height:20px; line-height:20px; width:25px; height:25px; line-height:22px; border-radius:13px; border:1px solid #999 ; background:#fff; text-align:center; display:block; text-indent:2px;} .common_panel ul.panel_lst li .p_lst_top button.icon_btn i {font-size:12px; color:#999; position:relative; right:1px;} .common_panel ul.panel_lst li .p_lst_top button.icon_btn:hover {background:#4da1f8; color:#fff; border-color:#4da1f8;} .common_panel ul.panel_lst li .p_lst_top button.icon_btn:hover i {color:#fff;} .common_panel ul.panel_lst li:hover .p_lst_top button.icon_btn {opacity:1;} .common_panel ul.panel_lst li .p_lst_top button.icon_btn.delete_plst {text-indent:1px;} .common_panel ul.panel_lst li a {display:block; transition:0.2s; font-size:16px; color:#222; line-height:20px; margin:0px 0 5px; width:100%; word-break:keep-all;} .common_panel ul.panel_lst li a:hover {color:#4da1f8;} .common_panel ul.panel_lst li p {font-size:14px; color:#666; width:100%; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:18px; max-height:36px; word-break:keep-all; margin:0;} .common_panel.common_solution ul.panel_lst li {display:flex; justify-content:space-between;} .common_panel.common_solution ul.panel_lst li a.img_solution {width:60px; height:60px; border:1px solid #e1e1e1; border-radius:10px; overflow:hidden; margin-right:14px; text-align:center; position:relative;} .common_panel.common_solution ul.panel_lst li a.img_solution img {width:50px; height:auto; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);} .common_panel.common_solution ul.panel_lst li div.txt_solution {width:calc(100% - 76px);} .common_panel.common_solution ul.panel_lst li div.txt_solution a {margin-bottom:10px;} .common_panel.common_solution ul.panel_lst li div.txt_solution p {overflow:hidden; text-overflow:inherit; display:block; max-height:none;} /* nprogress */ #nprogress .bar {background:#337ab7;} #nprogress .peg {box-shadow:0 0 10px #1ABB9C, 0 0 5px #1ABB9C} #nprogress .spinner-icon {border-top-color:#1ABB9C; border-left-color:#1ABB9C} /* ************************* 공통 레이아웃 ************************* */ /* 좌측영역 */ .container-fluid.body .col-md-3.left_col {background:#f4f9ff; height:calc(100vh - 110px); transition:0.3s;} /* 우측영역 */ body .container-fluid.body .right_col {background:#fff; height:calc(100vh - 110px); min-height:calc(100vh - 110px) !important; overflow:auto; transition:0.3s; position:relative; z-index:9;} /* 스크롤바 라이브러리 */ .left_col .mCSB_scrollTools {width:6px} .left_col .mCSB_dragger {max-height:400px !important} /* ************************* 상단영역 접혔을 경우 ************************* */ .main_container.folding header.header {margin-top:-44px;} .container-fluid.body .main_container.folding .col-md-3.left_col {height:calc(100vh - 41px);} body .container-fluid.body .main_container.folding .right_col {height:calc(100vh - 41px); min-height:calc(100vh - 41px) !important;} /* ************************* 좌측 메뉴 공통 ************************* */ ul.nav.side-menu > li.nav-item > a.nav-link {padding:0; text-align:center; display:block; height:40px; line-height:39px; transition:0.2s;} .nav.side-menu li a i {font-size:18px !important; text-align:center; width:100% !important; margin-bottom:0} ul.nav.child_menu li a {display:block; padding:9px 10px; font-weight:400; font-size:11px; text-align:left; color:#222; font-size:14px; position:relative; border-radius:4px;} /* ul.nav.child_menu li a span.fa {transition:0.3s; text-align:right;} */ ul.nav.child_menu li.active a span.fa {transform:rotate(360deg);} ul.nav.child_menu .child_menu li a {padding:8px 0; color:#8f8f8f; margin-top:3px;} ul.nav.child_menu .child_menu li a:hover {color:#3583d5;} ul.nav.side-menu > li.nav-item > h2 {color:#3c3c3c; position:absolute; padding:11px 10px 12px 20px; left:50px; top:0; margin:0; display:none; min-height:40px; width:210px; font-size:15px; transition:0.2s;} ul.nav.side-menu > li.nav-item > h2 a {transition:0.2s;} ul.nav.side-menu > li.nav-item.active > h2 {background:#40a1f8 !important;} ul.nav.side-menu > li.nav-item.active > h2 a {color:#fff;} .nav.side-menu > li.active > a {background:#fff;} .nav-sm ul.nav.side-menu > li.nav-item > h2 {display:none; color:#fff; border-radius:0 20px 0 0; background:#40a1f8;} /* .nav-sm ul.nav.side-menu > li.nav-item > h2 {display:none !important;} */ .nav-md ul.nav.side-menu > li.nav-item > h2 {display:block !important;} /* ************************* nav-sm:좌측 접혔을 경우 ************************* */ .nav-sm .container-fluid.body .col-md-3.left_col {width:60px; padding:0; z-index:15; position:absolute; border-radius:0 20px 0 0;} .nav-sm .container-fluid.body .col-md-3.left_col.menu_fixed {position:fixed; height:100%} .nav-sm .container-fluid.body .col-md-3.left_col .mCSB_container, .nav-sm .container-fluid.body .col-md-3.left_col .mCustomScrollBox {overflow:visible;} .nav-sm .hidden-small {visibility:hidden;} .nav-sm .menu_section ul.side-menu > li > ul.nav.child_menu {left:50px; top:40px; position:absolute; width:210px; z-index:4000; background:#f4f9ff; display:none; height:auto; overflow-y:auto; overflow-x:hidden; z-index:2; max-height:400px; overflow-y:auto;} .nav-sm .menu_section ul.side-menu > li:hover > ul.nav.child_menu.active {display:block !important;} .nav-sm .menu_section ul.side-menu > li > ul.nav.child_menu li {padding:0;} /* 좌측메뉴가 화면 밖으로 넘어갈 시 */ .nav-sm ul.nav.side-menu > li.nav-item.active.revers > h2 {border-radius:0 0 20px 0;} .nav-sm ul.nav.side-menu > li.nav-item.active.revers > ul.nav.child_menu {top:auto; bottom:40px;} /* .nav-sm .menu_section ul.side-menu > li:nth-child(9) > ul.nav.child_menu {top:-200px;} */ .nav-sm ul.nav.child_menu ul, .nav-sm .nav.side-menu li.active-sm ul ul {position:static; width:250px; background:none} .nav-sm > .nav.side-menu > li.active-sm > a {color:#1ABB9C !important} .nav-sm .nav.side-menu li a i.toggle-up {display:none !important} /* menu_section */ .menu_section { margin-bottom:35px; -ms-overflow-style:none; /* IE and Edge */ scrollbar-width:none; /* Firefox */ } .menu_section::-webkit-scrollbar { display:none; /* Chrome, Safari, Opera*/ width:0px; height:0px; } .nav-md .menu_section {width:260px; overflow-x:hidden; overflow-y:auto; height:calc(100vh - 110px); padding:0;} .nav-md .menu_section:before {content:""; display:block; width:210px; height:100%; background:#f4f9ff; position:absolute; left:50px; top:0; border-radius:0 20px 0 0;} .menu_section h3 {padding-bottom:15px; color:#fff; text-transform:uppercase; letter-spacing:.5px; font-weight:bold; font-size:11px; margin-bottom:0; margin-top:0; text-align:center; border-bottom:1px solid #d4dadc;} .menu_section > ul {padding-top:10px} .main_menu .label {line-height:11px; margin-top:4px;} .main_menu span.fa {float:right; text-align:center; margin-top:5px; font-size:12px; min-width:inherit; color:#999; transform:rotate(-90deg);} .main_menu li li.nav-item.active span.fa {color:#4da1f8;} .active a span.fa {text-align:right !important; margin-right:4px} .nav-sm .menu_section {margin:0} /* .nav-sm span.fa, .nav-sm .menu_section h3 { */ .nav-sm .menu_section span.fa, .nav-sm .menu_section h3 {display:none} .nav-sm .menu_section .child_menu span.fa {display:block} .nav-sm li li span.fa {display:inline-block} .nav-sm .container-fluid.body .right_col {padding:10px; margin-left:60px;} /* ************************* nav-md:좌측 펼쳐졌을 경우 ************************* */ .nav-md .container-fluid.body .col-md-3.left_col {width:50px; padding:0; position:absolute; display:-ms-flexbox; display:flex; z-index:10;} .nav-md .container-fluid.body .col-md-3.left_col.menu_fixed {position:fixed} .nav-md .container-fluid.body .right_col {padding:10px 20px 0; margin-left:260px;} .nav-md .container-fluid.body ul.side-menu li.nav-item.active > .child_menu {display:block !important; width:201px; box-shadow:none;} .nav-md .container-fluid.body ul.side-menu > li.nav-item.active > .child_menu {position:relative; left:60px; top:0; max-height:calc(100vh - 85px); overflow-y:auto; overflow-x:hidden;} .nav-md .container-fluid.body .main_container.folding ul.side-menu > li.nav-item.active > .child_menu {top:41px; min-height:calc(100vh - 41px);} .nav-sm .container-fluid.body .main_container.folding .menu_section ul.side-menu > li.nav-item.active > .child_menu {top:41px; height:calc(100vh - 41px);} .nav-md .container-fluid.body ul.side-menu > li.nav-item:after {content:""; display:block; width:100%; height:0; float:none; clear:both;} .nav-md .container-fluid.body ul.side-menu > li.nav-item > a.nav-link {width:60px; height:40px; float:left;} .nav-md .container-fluid.body ul.side-menu > li.nav-item > a.nav-link span {display:none;} /* 임시 */ /* .menuClose {display:none !important;} .menuOpen {display:block !important;} */ @media ( max-width:991px) { .nav-md .container-fluid.body .right_col, .nav-md .container-fluid.body .top_nav {width:100%; margin:0} /* .nav-md .container-fluid.body .col-md-3.left_col {display:none} */ .nav-md .container-fluid.body .right_col {width:100%; padding-right:0} .right_col {padding:10px !important} } @media ( max-width:1200px) { .x_title h2 {width:62%; font-size:17px} .tile, .graph {zoom:85%; height:inherit} } @media ( max-width:1270px) and (min-width:192px) { .x_title h2 small {display:none} } .container {width:100%; padding:0} .main_container .top_nav {display:block;} /* page-title */ .page-title {width:100%; height:65px; padding:10px 0} .page-title .title_left {width:45%; float:left; display:block} .page-title .title_left h3 {margin:9px 0} .page-title .title_right {width:55%; float:left; display:block} .page-title .title_right .pull-right {margin:10px 0} .main_content {padding:10px 20px} .col-md-55 {width:50%; margin-bottom:10px} @media ( min-width:480px) { .advertising > span {font-size:3px;} } @media ( min-width:768px) { .col-md-55 {width:20%} .advertising > span {font-size:40px;} .footer_fixed footer {margin-left:0} .footer_fixed .nav-sm footer {margin-left:0} .tile_count .tile_stats_count .count {font-size:40px} .tile_count .tile_stats_count span {font-size:13px} .bs-glyphicons {margin-right:0; margin-left:0} .bs-glyphicons li {width:12.5%; font-size:12px} .cropper .img-container {min-height:516px} .advertising > span {font-size:8px;} } @media ( min-width:992px) { .col-md-55 {width:20%} .advertising > span {font-size:11px} footer {margin-left:230px} .tile_count .tile_stats_count {margin-bottom:10px; border-bottom:0; padding-bottom:10px} .tile_count .tile_stats_count:first-child:before {border-left:0} } @media ( min-width:1200px) { .col-md-55 {width:20%} .advertising > span {font-size:16px;} } @media ( min-width:192px) and (max-width:1270px) { table.tile_info span.right {margin-right:7px; float:left } .advertising > span {font-size:3px;} } @media ( min-width:992px) and (max-width:1100px) { .tile_count .tile_stats_count .count {font-size:30px} .advertising > span {font-size:11px;} } /* 좌측메뉴 */ .sidebar-header {border-bottom:0; margin-top:46px} .sidebar-header:first-of-type {margin-top:0} .nav.side-menu > li {position:relative; display:block; cursor:pointer} .nav.side-menu > li > a {margin-bottom:0} .nav.side-menu > li > a:hover {/* color:#F2F5F7 !important */ color:#0445ad;} .nav.side-menu > li > a:hover, .nav > li > a:focus {text-decoration:none; background:transparent} .nav.child_menu {display:none;} /* .nav.child_menu li.active {background-color:#f4f4f4;} */ .nav.child_menu li.active > a {color:#222; font-weight:600; background:transparent;} .nav.child_menu li.active > a:before, .nav.child_menu li.active.on > a:before, .nav.child_menu li:hover > a:before {content:""; display:block; width:4px; height:4px; border-radius:50%; background:#4f4d56; position:absolute; left:0; top:15px;} ul.nav.child_menu .child_menu li a {padding-left:20px; margin-right:20px;} ul.nav.child_menu li.active li.active > a:before, ul.nav.child_menu li li:hover > a:before {left:29px; top:13px;} .nav.child_menu li .child_menu li a:before {display:none !important;} .nav.side-menu > li > a {color:#000; font-weight:500;} .nav.child_menu > li > a {color:#505050; font-weight:500;} .nav.side-menu > li > a:hover, .nav.child_menu > li > a:hover {color:#222; font-weight:600;} .nav.child_menu li li:hover, .nav.child_menu li li.active {background:none} .nav.child_menu li li a:hover, .nav.child_menu li li a.active {color:#14d956} .nav.child_menu .nav.child_menu {box-shadow:none;} .nav.child_menu .nav.child_menu a {color:#222;} ul.nav.child_menu .child_menu li.nav-item.on a, ul.nav.child_menu .child_menu li a:hover {background:#e3f0ff; color:#3583d5;} .nav li.current-page {background:rgba(255, 255, 255, 0.05)} .nav li li li.current-page {background:none} .nav li li.current-page a {color:#fff} .nav.side-menu > li.active > a {color:#fff; background:#40a1f8;} .site_title {text-overflow:ellipsis; overflow:hidden; font-weight:400; font-size:22px; width:100%; color:#ECF0F1 !important; margin-left:0 !important; line-height:59px; display:block; height:55px; margin:0; padding-left:10px} .site_title:hover, .site_title:focus {text-decoration:none} .nav > li > a:hover, .nav > li > a:focus {background-color:transparent} .top_search {padding:0} .top_search .form-control {border-right:0; box-shadow:inset 0 1px 0px rgba(0, 0, 0, 0.075); border-radius:25px 0px 0px 25px; padding-left:20px; border:var(--bs-border-width) solid var(--bs-border-color);} .top_search .form-control:focus {border:1px solid rgba(221, 226, 232, 0.49); border-right:0} .top_search .input-group-btn button {border-radius:0px 25px 25px 0px; border:var(--bs-border-width) solid var(--bs-border-color); border-left:0; box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075); color:#93A2B2; margin-bottom:0 !important} .nav.child_menu > li > a {/* color:rgba(255, 255, 255, 0.75); */ font-size:12px; padding:9px} .main_menu_side {padding:0} .main_menu_side ::-webkit-scrollbar {width:8px; height:8px;} /* width */ .main_menu_side ::-webkit-scrollbar-track {background:rgba(255,255,255,0.5);} /* Track */ .main_menu_side ::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.1); border-radius:4px;} /* Handle */ .main_menu_side ::-webkit-scrollbar-thumb:hover {background:rgba(0,0,0,0.2);} /* Handle on hover */ .bs-docs-sidebar .nav > li > a {display:block; padding:4px 6px} /* footer */ footer {background:#fff; padding:16px 20px; display:block;} .nav-sm footer {margin-left:75px} .footer_fixed footer {position:fixed; left:0px; bottom:0px; width:100%} /* ***** x_panel ***** */ .x_panel {position:relative; width:100%; margin-bottom:20px; padding:10px 17px; display:inline-block; background:#fff; border:1px solid #efeeee; border-radius:8px; -webkit-column-break-inside:avoid; -moz-column-break-inside:avoid; column-break-inside:avoid; opacity:1; transition:all .2s ease; box-shadow:0 8px 24px rgba(0, 0, 0, 0.05);} .x_panel:hover {box-shadow:0 8px 15px rgba(0, 0, 0, 0.12);} .metadata_table [class*="col-"] > .x_panel {height:100%;} .x_title {border-bottom:2px solid #efeeee; padding:1px 5px 6px; margin-bottom:10px} .x_title .filter {width:40%; float:right} .x_title h2 {margin:9px 0px 6px 0px; float:left; display:block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; font-weight:700; font-size:15px;} .x_title h2 small {margin-left:10px; font-size:66%;} .x_title span {color:#BDBDBD} .x_content {padding:0 5px 6px; position:relative; width:100%; float:left; clear:both; margin-bottom:5px; height:calc(100% - 50px); overflow:hidden;} .x_content.echarts.bar, .x_content.echarts.line, .x_content.echarts.gauge, .x_content.echarts.scatter, .x_content.echarts.funnel, .x_content.echarts.heatmap {height:calc(100% - 45px);} .x_content h4 {font-size:16px; font-weight:500} /* dropdown-menu */ .dropdown-menu a {cursor:pointer; transition:0.2s;} .dropdown-menu a:hover {color:#54b9ff;} .dropdown-menu.msg_list span {white-space:normal} .dropdown-menu {border:medium none; box-shadow:none; display:none; float:left; font-size:12px; left:0; list-style:none outside none; padding:0; position:absolute; text-shadow:none; top:100%; z-index:9998; border:1px solid #efeeee; border-top-left-radius:0; border-top-right-radius:0; box-shadow:5px 5px 10px rgba(0,0,0,0.1);} .dropdown-menu > li > a {color:#3b3f42; padding:5px 10px; font-size:13px; display:block;} .main_menu .fa {width:10px; opacity:.99; display:inline-block; font-family:FontAwesome; font-style:normal; font-weight:normal; font-size:18px; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale} /*=========================================================================================================================== Table =============================================================================================================================*/ /* bootstrap 기본 table */ .table {border-top:1px solid #000; background:#fff;} .table caption {position:absolute; top:-9999px; left:-9999px; width:1px; height:1px; overflow:hidden; /* visibility:hidden; */ opacity:0;} .table>:not(caption)>*>* {padding:8px 8px;} .table th {border:none; border-bottom:1px solid #eee; text-align:center; font-weight:500;} .table>tbody td {border:none; border-bottom:1px solid #eee; text-align:center; font-weight:300; vertical-align:middle;} /* **************************** form 테이블 **************************** */ /* 쓰기 기본:2단 이상용 */ .form-table {width:100%; border-collapse:collapse; font-size:13px; word-break:keep-all;} .form-table caption {position:absolute; top:-9999px; left:-9999px; width:1px; height:1px; overflow:hidden; /* visibility:hidden; */ opacity:0;} .form-table tbody {border-top:1px solid #000;} .form-table tbody th.subject {padding-left:10px; color:#000; font-weight:500; text-align:left; vertical-align:middle;} .form-table tbody th {padding:4px 10px; background:#f1f1f1; text-align:center; color:#000; border-bottom:1px solid #d9d9d9; border-right:1px solid #d9d9d9; border-top:none; vertical-align:middle; font-size:14px; position:relative; line-height:30px; font-weight:700;} .form-table tbody th:last-child {border-right:none;} _:-ms-input-placeholder,:root .form-table tbody th {background:#fff;} .form-table tbody th.top-board:after {content:""; width:calc(100% + 2px); left:-1px; top:-1px; height:1px; background:#fff; position:absolute;} .form-table tbody td {padding:8px 10px; border:none; border-bottom:1px solid #eee; color:#333; line-height:20px; text-align:left; background:#fff; vertical-align:middle; word-break:break-all; font-size:14px;} .form-table tbody td:last-child {border-right:none;} .form-table tbody td pre {font-size:14px; background:#fff; line-height:20px; border:0; border-radius:0;} .form-table tbody td ul.form-table-ul {padding:0; margin:0;} .form-table tbody td ul.form-table-ul li {padding:0 0 0 14px; margin:0 0 3px 0; list-style:none; position:relative; line-height:25px;} .form-table tbody td ul.form-table-ul li:after {position:absolute; content:""; width:4px; height:4px; left:3px; top:10px; background:#85a9db; border-radius:2px;} .form-table tbody td textarea {padding:10px;} .form-table tbody td a {transition:0.2s;} .form-table tbody td a:hover {text-decoration:underline;} .form-table tbody td a.btn:hover {text-decoration:none;} .form-table.write tbody th {border-left:1px solid #d9d9d9;} .form-table.write tbody th, .form-table.write tbody td {padding:7px 10px; line-height:18px;} .form-table.write tbody td .form-control[readonly] {background-color:transparent; border-color:transparent; padding:0; box-shadow:none;} .form-table.write tbody td .img_area {text-align:center; padding-top:20px;} .form-table.write tbody td .img_area img {max-width:100%;} /* 테이블 스타일 */ .list_table_area {margin-top:10px; background:#fff;} .list_table_area caption{width:0;height:0;padding:0;margin:0;overflow:hidden;} .list_table_area table {width:100%;} .list_table_area thead {border-top:1px solid #000; border-bottom:1px solid #bbb; background-color:#fff;} .list_table_area thead tr th {padding:13px 10px; text-align:center; font-weight:400; font-size:14px; color:#000; font-weight:600; background:#f8f8f8;} .list_table_area tbody tr {border-bottom:1px solid #bbb;} .list_table_area tbody tr:hover {background:#f2f8ff;} .list_table_area thead tr th.title_bg {background:#f4f4f4;} .list_table_area.type_row tbody tr:hover {background:transparent;} .list_table_area tbody tr td {padding:13px 10px; text-align:center; font-size:15px; color:#222; font-weight:400;} .list_table_area tbody tr:hover td {color:#214ca4;} .list_table_area thead tr th.align_left, .list_table_area tbody tr td.align_left {text-align:left;} .list_table_area tbody tr td a {transition:0.2s; vertical-align:middle;} .list_table_area tbody tr td a:hover, .list_table_area tbody tr td a:focus, .list_table_area a:not([href]):not([class]):hover {color:#26a1ff;} .list_table_area a, .list_table_area a:not([href]):not([class]), .list_table_area a:not([href]):not([class]):hover {text-decoration:underline; text-underline-position:under;} .list_table_area.board_style table {border-top:1px solid #000;} .list_table_area.board_style table tbody tr:hover {background:transparent;} .list_table_area.board_style table tbody tr th, .list_table_area.board_style table tbody tr td {font-size:14px; padding:13px 15px;} .list_table_area.board_style table tbody tr th {text-align:right; font-weight:700; background:#f8f8f8; padding:8px 15px; border-right:1px solid #bbb; border-bottom:1px solid #bbb;} .list_table_area.board_style table tbody tr td {text-align:left; font-size:15px;} .privacy_section .list_table_area a {text-decoration:none;} .privacy_section .list_table_area a:hover {text-decoration:underline;} .privacy_section .list_table_area table thead tr th, .privacy_section .list_table_area table tbody tr td {text-align:center;} .address_wrap {margin-top:5px; } /* 테이블 스타일 */ .data_table_area table {border-top:1px solid #3f3f3f; width:100%;} .data_table_area table tr td {font-weight:500;} .data_table_area table tr td a {display:-webkit-box; width:100%; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word; text-overflow:ellipsis; overflow:hidden; margin:0;} .data_table_area table tr th {border-bottom:1px solid #3f3f3f;} .data_table_area table tr th, .data_table_area table tr td {font-size:15px; padding:20px 0; text-align:center;} .data_table_area table tr td {text-align:left;} .data_table_area.list_table_area table tbody tr:hover {background-color:#f3fcf8;} .data_table_area table tr td.txt_left {text-align:left; padding:20px 35px;} .data_table_area table .table_tag, .list_table_area table .table_tag {border:1px solid #303030; font-weight:600; height:24px; padding:0 10px; border-radius:3px; font-size:12px; display:inline-block; line-height:24px;} .data_table_area table .table_tag:first-child ,.list_table_area table .table_tag:first-child {margin-right:8px;} .data_table_area.type_purple table tr th {background-color:#f3f3f3; border-bottom:0;} .data_table_area.type_purple table tr td span {word-break:break-all;} .data_table_area.type_purple table tr td {padding:30px;} .txt_notice_fail {color:#f53e3e; font-size:13px; margin-left:5px; vertical-align:middle;} .txt_success {margin-left:5px; font-size:13px; vertical-align:middle;} .sub_section .txt {color:#f53e3e; margin-right:4px;} .txt_sub {color:#888; font-size:13px; margin-left:5px; vertical-align:middle;} .time_count strong {color:#ff0000; font-size:14px; font-weight:500;} .data_table_area.type_purple .select_area {height:35px; line-height:35px;} .sub_section.section_mypage .data_table_area.type_purple .inp_num {text-align:center; margin:0 2px;} .sub_section.section_mypage .data_table_area.type_purple .select_box {display:inline-block; margin-right:10px;} .sub_section.section_mypage .data_table_area.type_purple .m_text.inp_mail {margin-right:10px; width:200px;} .sub_section.section_mypage .data_table_area.type_purple .select_box.select_email .select_area {width:200px;} .data_table_area table, .list_wrap {border-top:1px solid #000; background:#fff;} .data_table_area table tr {border-bottom:1px solid #bbb;} .item_info_area .data_table_area.type_row table tr th {text-align:left; padding:8px 10px;} .data_table_area.type_purple table tr td {padding:8px 10px; font-weight:400;} /* .data_table_area.type_purple table tr td .m_radio {margin-right:35px;} */ .data_table_area.type_purple table tr td .m_radio:last-child {margin-right:0;} .data_table_area table tr th, .data_table_area.type_purple table tr th, .list_wrap .inp_tit, .data_table_area table tr th .m_radio > input[type=radio] + label {background-color:#f8f8f8; text-align:right; font-size:14px; font-weight:600;} .data_table_area table tr th, .data_table_area.type_purple table tr th {border-right:1px solid #bbb; border-bottom:1px solid #bbb;} .data_table_area table tr th, .data_table_area table tr td, .sub_section.notice_section .data_table_area.type_purple table tr th, .sub_section.notice_section .data_table_area.type_purple table tr td, .sub_section.qna_section .list_wrap li {padding:13px 15px;} .data_table_area table tr .txt_lock:after, .txt_lock:after {content:"\ec61"; font-family:'icofont'; font-size:14px; background:none; color:#888888; position:absolute; right:0; top:50%; transform:translateY(-50%);} .data_table_area table tr th .txt_lock {color:#000;} .list_area table thead th {font-weight:600;} .list_area table tbody td {font-weight:500;} .list_area table tr td a {display:-webkit-box; width:100%; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word; text-overflow:ellipsis; overflow:hidden; margin:0 auto;} .list_area table tr td.txt_left {text-align:left;} .list_area table tr .txt_lock {width:auto; display:inline-block; padding-right:25px;} .list_area table tr td.txt_lock a {display:block; width:auto; color:#888;} .list_area table tbody tr:hover {background-color:#eef6ff;} .list_area table tbody tr:hover td {background-color:transparent;} .manage_editor_area {margin-top:30px;} .manage_editor_area textarea {resize:none;} /* 게시판 색상 스타일 */ .point_txt {background:#4da1f8; color:#fff; display:inline-block; padding:0 8px; border-radius:10px; text-align:center; height:20px; line-height:21px; font-size:13px;} .point_txt.point_txt2 {background:#ffa32d; margin-left:5px;} .table_new {margin-left:5px; font-size:13px;} .point_color {color:#ef7158 !important;} .pointColor1 {color:#ec2222 !important;} .pointColor2 {color:#26a1ff !important;} .pointColor3 {color:#0e5a8b !important;} .txt_bold {font-weight:600 !important;} .icofont-warning-alt {color:#ec2222; margin-right:4px;} /* Paging Button*/ .paging_area > button:hover, .paging_area > a:hover {color: #3c3c3c;} .paging_area > button.active, .paging_area > .active {color: #fff; background-color: #3c3c3c;} .paging_area > .active:hover {color: #fff;} .paging_area > .first, .paging_area > .prev, .paging_area > .next, .paging_area > .last {border: 1px solid #c4c4c4; font-size: 0;} .paging_area > .prev {margin-right: 10px;} .paging_area > .next {margin-left: 10px;} .paging_area > .first:before {content: "\eac6"; font-family: "IcoFont"; font-size: 16px;} .paging_area > .prev:before {content: "\eac9"; font-family: "IcoFont"; font-size: 16px;} .paging_area > .next:before {content: "\eaca"; font-family: "IcoFont"; font-size: 16px;} .paging_area > .last:before {content: "\eac7"; font-family: "IcoFont"; font-size: 16px;} .paging_area > .first:hover, .paging_area > .prev:hover, .paging_area > .next:hover, .paging_area > .last:hover {color: #3b63eb; opacity: 1; border: 1px solid #3b63eb; background-color: inherit;} .paging_area {padding:20px 0 0; text-align: center;} .paging_area > .active:hover {color:#fff;} .paging_area > button, .paging_area > a {font-size:14px; color:#666; min-width:25px; line-height:26px; height:25px; border-radius:50%; transition:0.2s; padding:0 5px; display: inline-block;} .paging_area > button:hover, .paging_area > a:hover {color:#fff !important; background-color:#3c3c3c;} .paging_area > button.active, .paging_area > .active {color:#fff !important; background-color:#3c3c3c;} .paging_area > .first, .paging_area > .prev, .paging_area > .next, .paging_area > .last {font-size:0; font-weight:700; border:0;} .paging_area > .first:hover, .paging_area > .prev:hover, .paging_area > .next:hover, .paging_area > .last:hover {color:#004aa4 !important; border:0; font-weight:700;} .paging_area > .first:before, .paging_area > .prev:before, .paging_area > .next:before, .paging_area > .last:before {font-weight:700; color:#000000;} .pop_paging_area {padding:20px 0 0;} .pop_paging_area > .pop_active:hover {color:#fff;} .pop_paging_area > button, .pop_paging_area > a {font-size:14px; color:#767676; min-width:25px; line-height:25px; height:25px; border-radius:5px; transition:0.2s; padding:0 5px;} .pop_paging_area > button:hover, .pop_paging_area > a:hover {color:#fff; background-color:#4f4d56;} .pop_paging_area > button.active, .pop_paging_area > .pop_active {color:#fff; background-color:#4f4d56;} .pop_paging_area > .pop_first, .pop_paging_area > .pop_prev, .pop_paging_area > .pop_next, .pop_paging_area > .pop_last {font-size:0; font-weight:700; border:0;} .pop_paging_area > .pop_first:hover, .pop_paging_area > .pop_prev:hover, .pop_paging_area > .pop_next:hover, .pop_paging_area > .pop_last:hover {color:#004aa4; border:0; font-weight:700;} .pop_paging_area > .pop_first:before, .pop_paging_area > .pop_prev:before, .pop_paging_area > .pop_next:before, .pop_paging_area > .pop_last:before {font-weight:700; color:#000000;} /* 개인정보처리방침 - 관리자 */ .list_table_area tbody tr td .txt_use {color:#fff; text-align:center; width:100%; border-radius:3px; display:inline-block; font-weight:400; font-size:14px; line-height:20px; min-height:20px;} .list_table_area tbody tr td .txt_use.red {background:#ff0000;} .list_table_area tbody tr td .txt_use.gray {background:#7f7f7f;} .list_table_area tbody tr td .txt_use.blue {background:#0b75df;} .list_table_area tbody tr td .txt_use.black {background:#000;} .list_table_area tbody tr td .popChange {text-decoration:underline; text-underline-position:under; padding:0;} .list_table_area tbody tr td .popChange:hover {color:#26a1ff;} .policy_pop p {font-size:16px;} .policy_pop p:last-child {margin-bottom:0;} .manage_btn_area {text-align:right; margin:40px 0 0;} .section_answer .manage_btn_area {text-align:center;} .section_answer .manage_btn_area > button {float:none;} .manage_btn_area > button {position:relative;} .manage_btn_area > button:after {font-family:"Fontawesome"; position:absolute; color:#fff; right:10px; top:48%; transform:translateY(-50%); font-size:14px;} .manage_btn_area .btn_save:after {content:"\f0c7";} .manage_btn_area .btn_upload:after {content:"\f093";} /* ********************* 게시판 상세 ********************* */ .board_detail {border-top:3px solid #4f4d56; border-bottom:1px solid #dfdfdf;} .board_detail + .list_table_area {margin-top:0;} .board_detail + .list_table_area.type_row table {border-top:none;} /* 정보 */ .board_detail .board_info {padding:13px 10px; font-size:16px; border-bottom:1px solid #4f4d56; line-height:1;} .board_detail .board_info:after {content:""; display:block; width:100%; height:0px; clear:both; float:none;} .board_detail .board_info span.info_item {display:inline-block; margin:0 65px 0 0; vertical-align:middle; color:#777777;} .board_detail .board_info a.file_item {display:inline-block; color:#397efe; position:relative; float:right;} .board_detail .board_info a.file_item:before {content:"\eedb"; font-family:"Icofont"; display:inline-block; margin:0 5px 0 0; font-size:24px; vertical-align:middle;} .board_detail .board_info a.file_item span {display:inline-block; vertical-align:middle;} /* 태그 */ .board_detail ul.board_tag {padding:0; margin:18px 0 0; overflow:hidden;} .board_detail ul.board_tag li {padding:0; margin:0 6px 0 0; float:left; display:inline-block; list-style:none; height:23px; line-height:22px; color:#565656; font-size:12px; padding:0 10px; min-width:80px; text-align:center; background:#ebebeb; border-radius:12px;} .board_detail .editor_area {padding:40px 0; font-size:18px;} .board_detail .editor_area p {margin:0 0 10px;} /* 이전글, 다음글 */ .board_detail ul.quick_link {padding:0; margin:0; } .board_detail ul.quick_link li {border-top:1px solid #dfdfdf; list-style:none; padding:15px 0; margin:0; overflow:hidden;} .board_detail ul.quick_link li strong {font-weight:700; float:left; width:150px;} .board_detail ul.quick_link li a {float:left; width:calc(100% - 150px); transition:0.2s;} .board_detail ul.quick_link li a:hover {color:#ef7158;} /* Q&A */ .boar_detail h4.answer_title {line-height:1; padding:16px 0; font-size:30px; font-weight:500; border-top:1px solid #4f4d56; border-bottom:1px solid #4f4d56; margin-top:100px;} .btn_area {text-align:right; margin:40px 0 0;} .btn_area .m_btn {} /* 공지사항 - 보기 */ .board_view .board_title {margin:0 10px; overflow:hidden; margin-bottom:5px;} .board_view .board_title h2 {font-size:26px; display:inline-block;} .board_view .board_title h2 span.title_name {color:#003880; font-size:22px; margin-right:15px;} .board_view .board_title h2 .point_txt {vertical-align:top; margin-top:5px;} .board_view .board_title .info_item {line-height:40px; color:#777; font-size:16px;} .board_view .board_title h2 .icofont-warning-alt {font-size:20px;} .board_view .board_detail .board_info a.file_item {margin-left:10px;} .board_view .board_detail .contents_area {margin:30px 50px;} .board_view .board_detail .contents_area p {font-size:16px;} .board_view .board_detail ul.quick_link li {padding:15px 50px;} .board_view .board_detail ul.quick_link li a {width:calc(100% - 350px);} .board_view .board_detail ul.quick_link li a:hover {color:#26a1ff;} .board_view .board_detail ul.quick_link li span {width:200px; display:inline-block; text-align:right;} /* FAQ 리스트 */ .sort_btn_area {background:#e8e8e8; border-radius:20px;} .sort_btn_area .sort_btn {padding:10px 65px; line-height:1; font-size:15px;} .sort_btn_area .sort_btn.active {background:#214ca4; color:#fff; border-radius:20px;} .faq_lst .mg_list > li {border-bottom:1px solid #e1e3e7; background-color:#fff;} .faq_lst .mg_list > li:nth-child(2) {margin-top:0px;} .faq_lst .mg_list li > div:nth-child(1) {width:100px;} .faq_lst .mg_list li > div:nth-child(2) {width:120px;} .faq_lst .mg_list li > div:nth-child(3) {width:calc(100% - 220px); text-align:left;} .faq_lst .mg_list > li.list_head > div {padding:8px 10px; text-align:left; font-weight:400; font-size:15px; color:#000; font-weight:700;} .faq_lst .mg_list li > div .txt {position:relative; display:block; width:100%; padding-left:45px; background:none; border:none; outline:none; text-align:left; letter-spacing:-0.5px; white-space:normal; word-break:keep-all;} .faq_lst .mg_list li > div .txt:before {content:""; display:block; position:absolute; left:0; top:5px; width:15px; height:15px;} .faq_lst .mg_list li.question > div button.txt {padding-right:60px; transition:0.2s;} .faq_lst .mg_list li.question > div button.txt:before {background:url(../images/icon/icon_question.png) no-repeat center center;} .faq_lst .mg_list li.question > div button.txt:hover {color:#26a1ff;} .faq_lst .mg_list li.question > div button.txt:after {content:"\eab2"; font-family:"Icofont"; display:block; position:absolute; right:30px; width:20px; height:20px; color:#4f4d56; font-size:20px; line-height:20px; text-align:center; transition:0.3s; top:50%; transform:translateY(-50%);} .faq_lst .mg_list li.question.active > div button.txt:after {transform:rotate(-180deg); top:0;} .faq_lst .mg_list li.answer {background:#f3f3f3; height:0; overflow:hidden; border-bottom:none;} .faq_lst .mg_list li.answer > div {padding:20px 10px;} .faq_lst .mg_list li.answer > div .txt {} .faq_lst .mg_list li.answer > div .txt:before {background:url(../images/icon/icon_answer.png) no-repeat center center;} .faq_lst .mg_list li.question.active + li.answer {height:auto; border-bottom:1px solid #e1e3e7;} /* 문의하기 */ .page_content {display:block; text-align:center; font-size:20px; font-weight:500; margin-bottom:20px;} .inquiry_no_data {border-top:2px solid #2a2a2a; padding:30px 0;} .inquiry_no_data p {font-size:20px; text-align:center; position:relative; padding-top:290px;} .inquiry_no_data p:before {content:""; background:url(../images/sub/img_nodata.png) no-repeat center; width:370px; height:280px; position:absolute; top:0; left:50%; transform:translateX(-50%);} .inquiry_sub {border-top:2px solid #2a2a2a; background:#fff;} .inquiry_sub > span {display:inline-block; font-size:14px; padding:13px 15px;} .inquiry_sub .th {width:calc(20% + 1px); text-align:right; font-weight:700; border-right:1px solid #bbb;} .inquiry_sub .td {width:79%;} .txt_red {color:#ff0000;} .txt_blue {color:#0b75df;} .inquiry_area .data_table_area table {border-top:1px solid #bbb;} .inquiry_area .answer_box {background:#f1f1f1; padding:25px; margin-top:40px; position:relative;} .inquiry_area .answer_box .answer_date {position:absolute; left:95px; top:25px;} .inquiry_area .answer_box .answer_date strong {padding-right:5px;} .inquiry_area .answer_box p {margin:0; padding-left:20%; font-size:16px;} .file_nm {font-weight:500; text-decoration:underline; font-size:15px; display:inline-block;} .file_nm:hover {color:#000; text-decoration:underline;} .data_table_area table tr td a.file_nm {display:inline-block; width:auto;} .inquiry_area .answer_box .file_nm {margin-left:20%; margin-top:10px;} .inquiry_area .answer_separate {padding:15px 0; text-align:center; margin-top:40px;} .inquiry_area .answer_separate span {padding-top:275px; position:relative; display:block; font-weight:500; font-size:20px;} .inquiry_area .answer_separate span:before {content:""; background:url(../images/sub/img_nodata.png) no-repeat center; width:370px; height:250px; position:absolute; top:0; left:50%; transform:translateX(-50%);} .inquiry_area .answer_separate p {font-size:18px; margin:0;} /* (관리자)고객문의 답변 */ .history_box {margin-top:30px;} .history_box h4 {margin:5px 10px;} .history_box .history_lst {margin:0; background:#f4f4f4; padding:25px;} .history_box .history_lst li {line-height:1; font-size:15px; position:relative; padding-left:15px; margin-bottom:10px; list-style:none;} .history_box .history_lst li:before {content:""; display:inline-block; background:#222; width:4px; height:4px; border-radius:50%; position:absolute; left:0; top:50%; transform:translateY(-50%);} .history_box .history_lst li:last-child {margin-bottom:0;} .history_box .history_lst li span {margin-right:20px; display:inline-block; font-size:15px;} .history_box .history_lst li span.history_date {width:170px;} .history_box .history_lst li span.history_nm {width:200px;} /* ******************************** 상단 고정영역 ******************************** */ /* 상단 탭 */ .page_top ul.top_tab {padding:4px 4px 0; margin:0; display:inline-block; background:#ebebeb; border-radius:8px; overflow:hidden;} .page_top ul.top_tab li {display:inline-block; float:left; margin:0 10px 4px 0;} .page_top ul.top_tab li:last-child {margin-right:0;} .page_top ul.top_tab li a {display:inline-block; min-width:150px; height:32px; background:transparent; line-height:30px; font-size:17px; color:#000; font-weight:500; border-radius:6px; padding:0 15px; text-align:center; transition:0.2s;} .page_top ul.top_tab li a.active, .page_top ul.top_tab li a:hover {background:#003880; color:#fff;} .page_top > .tab_content {display:none;} .page_top > .tab_content.active {display:block;} .page_top.tab_select ul.top_tab {background:none; padding:1px;} .page_top.tab_select ul.top_tab li {margin-bottom:0;} .page_top.tab_select ul.top_tab li a {border:1px solid #666; font-weight:400; font-size:16px;} .page_top.tab_select ul.top_tab li a:hover, .page_top.tab_select ul.top_tab li a.active {border-color:#003880;} .section_answer .btn_mail {position:relative; margin-right:20px;} .section_answer .btn_mail:after {content:"\f0e0"; font-family:"Font Awesome 5 Free"; font-size:14px; color:#fff; display:inline-block; vertical-align:middle; margin-left:10px;} .section_answer .btn_save:after {content:"\f0c7"; font-family:"Font Awesome 5 Free"; font-size:14px; color:#fff; display:inline-block; vertical-align:middle; margin-left:10px;} .section_answer .btn_upload:after {content:"\f093"; font-family:"Font Awesome 5 Free"; font-size:14px; color:#fff; display:inline-block; vertical-align:middle; margin-left:10px; font-weight:900;} .section_answer table .m_check {line-height:35px; margin-right:20px;} .write_table {margin-top:40px; display:none;} .write_table.active {display:block;} .write_view_table {margin-top:20px;} .write_view_table .write_info {display:block; text-align:right; font-size:15px; margin-bottom:5px;} .section_answer .manage_btn_area {text-align:center;} .section_answer .manage_btn_area > button {float:none;} .manage_btn_area > button {position:relative;} .manage_btn_area > button:after {font-family:"Font Awesome 5 Free"; position:absolute; color:#fff; right:10px; top:48%; transform:translateY(-50%); font-size:14px;} .manage_btn_area .btn_save:after {content:"\f0c7";} .manage_btn_area .btn_upload:after {content:"\f093";} /*=========================================================================================================================== Library Custom =============================================================================================================================*/ /*====================================== Daterangepicker ========================================*/ /* daterangepicker_base */ .daterangepicker:after {display:block; content:''; clear:both;} .daterangepicker.dropdown-menu {padding:0 5px 5px;} .daterangepicker .calendar {float:left; padding:5px;} .daterangepicker .calendar .daterangepicker_input {position:relative;} .daterangepicker .calendar .daterangepicker_input .input-mini {width:inherit; height:inherit; line-height:30px; padding:0 10px; margin-left:35px; border:1px solid #e1e3e7; border-radius:5px; box-shadow:none;} .daterangepicker .calendar .daterangepicker_input .input-mini + .glyphicon {width:30px; height:30px; line-height:30px; position:absolute; top:0; left:0; text-align:center;} .daterangepicker .calendar .daterangepicker_input .calendar-time {display:flex; align-items:center; justify-content:center; padding-left:30px; margin:5px 0; position:relative;} .daterangepicker .calendar .daterangepicker_input .calendar-time > div {display:flex; flex:1; align-items:center; justify-content:center;} .daterangepicker .calendar .daterangepicker_input .calendar-time select {flex:1; height:30px; margin:0 5px; border:1px solid #e1e3e7; border-radius:5px;} .daterangepicker .calendar .daterangepicker_input .calendar-time select:last-child {margin-right:0;} .daterangepicker .calendar .daterangepicker_input .calendar-time select:focus {border:1px solid #003880;} .daterangepicker .calendar .daterangepicker_input .calendar-time > .glyphicon {position:absolute; top:5px; left:8px;} .daterangepicker .ranges {width:30%; clear:both;} .daterangepicker .ranges .range_inputs {width:100%; text-align:right;} .daterangepicker .ranges .range_inputs button {min-width:60px;} /* daterangepicker big_style */ .daterangepicker .ranges li {color:#354f63;} .daterangepicker .ranges li.active, .daterangepicker .ranges li:hover {background:#54b9ff; color:#fff;} .daterangepicker .input-mini {background-color:#eee; border:1px solid #ccc; box-shadow:none !important;} .daterangepicker .input-mini.active {border:1px solid #ccc;} .daterangepicker select.monthselect, .daterangepicker select.yearselect, .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect { font-size:12px; padding:1px; height:auto; margin:0; cursor:default; height:25px; border:1px solid #ADB2B5; line-height:30px; border-radius:0px !important;} .daterangepicker select.monthselect {margin-right:2%;} .daterangepicker td.in-range {background:#d8e7f2; color:#354f63;} .daterangepicker td.active, .daterangepicker td.active:hover {background-color:#54b9ff; color:#fff;} .daterangepicker th.available:hover {background:#eee; color:#34495E;} .daterangepicker:before, .daterangepicker:after {content:none;} .daterangepicker .calendar.single {margin:0 0 4px 0;} .daterangepicker .calendar.single .calendar-table {width:224px; padding:0 0 4px 0 !important;} .daterangepicker .calendar.single .calendar-table thead tr:first-child th {padding:8px 5px;} .daterangepicker .calendar.single .calendar-table thead th {border-radius:0;} .daterangepicker.default {color:#fff; background:#34495E;} .daterangepicker.default .calendar-table {background:#34495E;} .daterangepicker.default .calendar-table thead tr {background:#213345;} .daterangepicker.default .calendar-table thead tr:first-child {background:#1ABB9C;} .daterangepicker.default .calendar-table td.off {background:#34495E; color:#999;} .daterangepicker.default .calendar-table td.available:hover {color:#34495E;} .daterangepicker.picker_1 {color:#fff; background:#34495E;} .daterangepicker.picker_1 .calendar-table {background:#34495E;} .daterangepicker.picker_1 .calendar-table thead tr {background:#213345;} .daterangepicker.picker_1 .calendar-table thead tr:first-child {background:#1ABB9C;} .daterangepicker.picker_1 .calendar-table td.off {background:#34495E; color:#999;} .daterangepicker.picker_1 .calendar-table td.available:hover {color:#34495E;} .daterangepicker.picker_2 .calendar-table thead tr {color:#1ABB9C;} .daterangepicker.picker_2 .calendar-table thead tr:first-child {color:#354f63;} .daterangepicker.picker_3 .calendar-table thead tr:first-child {color:#fff; background:#1ABB9C;} .daterangepicker.picker_4 .calendar-table thead tr:first-child {color:#fff; background:#34495E;} .daterangepicker.picker_4 .calendar-table td, .daterangepicker.picker_4 .calendar-table td.off {background:#ECF0F1; border:1px solid #fff; border-radius:0;} .daterangepicker.picker_4 .calendar-table td.active {background:#34495E;} .daterangepicker.xdisplay {width:228px;} @media (min-width: 730px) { .daterangepicker .drp-calendar.left {clear:left !important;} } /* ******************** jstree ******************** */ .jstree_area.jstree-default .jstree-themeicon {font-style:normal; background:none;} .jstree_area.jstree-default .jstree-themeicon:after {display:block; content:"\ef36"; font-family:"Icofont"; font-size:14px; color:#003880;} .jstree_area.jstree-default .jstree-themeicon.user_file:after {content:"\eb2a"; font-size:15px;} .jstree_area.jstree-default li.jstree-open .jstree-anchor > .jstree-icon {color:#4797e2; background:none !important;} /* 하위폴더가 없는 아이콘 */ .jstree_area.jstree-default li.jstree-leaf .jstree-anchor > .jstree-icon.jstree-themeicon:after {content:"\eb2a"; color:#8f8f8f;} .jstree_area.jstree-default li.jstree-leaf.category .jstree-anchor > .jstree-icon.jstree-themeicon:after {content:"\ec5b"; color:#8f8f8f;} /* .jstree_area.jstree-default li .jstree-clicked.jstree-anchor i:after {color:#4797e2 !important;} */ .jstree_area.jstree-default > .jstree-container-ul {} .jstree_area.jstree-default .jstree-node, .con_tree .jstree-default .jstree-icon.jstree-themeicon {background:none !important;} .jstree_area.jstree-default li .jstree-wholerow {border-bottom:none;} .jstree_area .jstree-anchor {overflow:hidden; text-overflow:ellipsis;} .jstree_area .vakata-context .vakata-contextmenu-disabled > a > i {filter:grayscale(100%);} .jstree-default .jstree-hovered {color:#000;} .jstree_area.jstree-default .jstree-wholerow-hovered {background:#f4f4f4;} .jstree_area.jstree-default .jstree-wholerow-clicked {background:#f4f4f4 !important; color:#000;} .jstree_area.jstree-default .jstree-clicked.jstree-anchor, .jstree_area.jstree-default .jstree-clicked.jstree-anchor:link, .jstree_area.jstree-default .jstree-clicked.jstree-anchor:visited, .jstree_area.jstree-default .jstree-clicked.jstree-anchor:hover, .jstree_area.jstree-default .jstree-clicked.jstree-anchor:active {color:#000;} .jstree_area.jstree-default .jstree-node {min-height:26px; line-height:26px; margin-left:10px; min-width:20px;} .jstree_area.jstree-default .jstree-anchor {line-height:26px; height:26px;} .jstree_area.jstree-default .jstree-icon {width:20px; height:26px; line-height:26px;} .jstree_area.jstree-default .jstree-icon:empty {width:20px; height:26px; line-height:26px;} .jstree_area.jstree-default.jstree-rtl .jstree-node {margin-right:20px;} .jstree_area.jstree-default .jstree-wholerow {height:26px;} .jstree_area.jstree-default > .jstree-no-dots .jstree-open > .jstree-ocl {background-position:-36px -5px;} .jstree_area.jstree-default > .jstree-no-dots .jstree-closed > .jstree-ocl {background-position:-4px -4px;} .jstree_area #jstree-dnd.jstree-default {line-height:26px; padding:0 4px;} .jstree_area #jstree-dnd.jstree-default i {background:transparent; width:20px; height:26px; line-height:26px;} .jstree_area.jstree-default .defaultViewYn_Y {font-weight:bold; color:#0059bc;} /* 241101 - 엄윤섭 추가 : jstree 드래그 가능한 요소 화살표 추가 */ #div_tableTree.jstree-default > .jstree-no-dots .jstree-leaf.ui-draggable > .jstree-ocl {background-image:url("/lib/jstree/themes/default/32px.png"); background-position:-4px -4px;} /*====================================== select2 ========================================*/ .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple {background-color:#fff; border:1px solid #bbb; border-radius:6px; font-size:15px; min-height:34px;} .select2-container--default .select2-selection--multiple {height:33px;; min-height:33px; padding-bottom:0;} .select2-container--default .select2-selection--multiple:after {display:block; content:"\eac8"; width:20px; line-height:32px; position:absolute; top:0; right:3px; bottom:0; color:#a8a8a8; font-family:"IcoFont"; font-size:16px; font-weight:600; text-align:center;} .select2-container--default .select2-selection--multiple .select2-search--inline .select2-search__field {line-height:30px; height:30px; margin-top:0;} .select2-container--default .select2-selection--single .select2-selection__rendered {color:#354f63; padding-top:0; line-height:33px; min-width:100px;} .select2-container--default .select2-selection--multiple .select2-selection__rendered {padding-top:0;} .select2-container--default .select2-selection--single .select2-selection__arrow {height:28px; top:50%; transform:translate(0,-50%);} .select2-container--default .select2-selection--multiple .select2-selection__choice {margin-top:2px; border:none; border-radius:5px; padding:3px 8px 3px 20px; background-color:#fff; color:#000; border:0; line-height:20px;} .select2-container--default .select2-selection--multiple .select2-selection__clear {font-size:18px; font-weight:500;} .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {color:#fff; background-color:#2b85ff;} .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {color:#2b85ff; cursor:pointer; display:inline-block; font-weight:bold; margin-right:2px; line-height:23px; transition:0.2s; border-right:0;} .select2-container--default.select2-container--focus .select2-selection--multiple {border:1px solid #ccc} .select2-container--default .select2-selection--single:hover, .select2-container--default .select2-selection--multiple:hover {border:1px solid #11c4fe;} .select2-container--default .select2-selection--single .select2-selection__clear {cursor:pointer; float:right; font-weight:bold; height:31px; margin-right:30px; padding-right:0px} /*====================================== bootstrap-select ========================================*/ .bootstrap-select.form_control {padding:0;} /* bootstrap-select */ .bootstrap-select > .btn.dropdown-toggle {border-radius:0; border:0; padding:0 23px 0 10px !important; background:#fff; box-sizing:border-box;} .bootstrap-select > select.form-control + .btn.dropdown-toggle {border:1px solid #d6d6d6;} .bootstrap-select > .btn.dropdown-toggle.active, .bootstrap-select > .btn.dropdown-toggle:active, .bootstrap-select > .btn.dropdown-toggle:focus, .bootstrap-select > .btn.dropdown-toggle:hover, .bootstrap-select.open > .btn.btn.dropdown-toggle {border:none; background:transparent;} .bs3.bootstrap-select .btn.dropdown-toggle .filter-option {padding-right:0;} .bootstrap-select .btn .caret {display:none;} .bootstrap-select .btn.dropdown-toggle, .bootstrap-select.btn-group .btn.dropdown-toggle:focus, .bootstrap-select.btn-group .btn.dropdown-toggle:hover {background:transparent; transition:0.2s; position:relative;} .bootstrap-select .btn.dropdown-toggle.active, .bootstrap-select .btn.dropdown-toggle:active, .bootstrap-select .btn.dropdown-toggle:focus, .bootstrap-select .btn.dropdown-toggle:hover, .bootstrap-select.open > .btn.dropdown-toggle {border-color:#5887fb;} .bootstrap-select .dropdown-menu > li > a:focus, .bootstrap-select .dropdown-menu > li > a:hover {background:#f5f5f5;} .bootstrap-select.btn-group.open .dropdown-toggle {box-shadow:none; background:#fff;} .bootstrap-select .dropdown-toggle::after, .bootstrap-select .dropup .dropdown-toggle::after {display:block; content:"\eac8"; width:20px; line-height:30px; position:absolute; top:0; left:auto; right:3px; bottom:0; color:#a8a8a8; font-family:"IcoFont"; font-size:16px; font-weight:600; text-align:center; border:none;} .bootstrap-select.disabled > .dropdown-toggle:after {left:auto;} .bootstrap-select.open .dropdown-toggle::after, .bootstrap-select.open .dropup .dropdown-toggle::after {background:url("../images/icon/select_arrow_active.png") no-repeat center center;} .bootstrap-select .btn:focus {outline:none !important;} .bootstrap-select>.dropdown-toggle.bs-placeholder .filter-option-inner-inner, .bootstrap-select>.dropdown-toggle.bs-placeholder:active .filter-option-inner-inner, .bootstrap-select>.dropdown-toggle.bs-placeholder:focus .filter-option-inner-inner, .bootstrap-select>.dropdown-toggle.bs-placeholder:hover .filter-option-inner-inner { color: #999 !important; } .bootstrap-select .dropdown-toggle .filter-option-inner-inner {font-weight:400; line-height:28px; color:#000; font-size:15px;} .bootstrap-select .dropdown-menu li {position:relative;} .bootstrap-select .dropdown-menu li:not(.disabled) a:hover small, .bootstrap-select .dropdown-menu li:not(.disabled) a:focus small, .bootstrap-select .dropdown-menu li.active:not(.disabled) a small {color:#64b1d8; color:rgba(100, 177, 216, 0.4);} .bootstrap-select .dropdown-menu li.disabled a {cursor:not-allowed;} .bootstrap-select .dropdown-menu li a {cursor:pointer; color:#000; font-weight:500; padding:0 10px;} .bootstrap-select .dropdown-menu li.active > a {background:none; color:#000; font-weight:500;} .bootstrap-select .dropdown-menu li.active > a:hover, .bootstrap-select .dropdown-menu li.active > a:focus {color:#000; font-weight:500; text-decoration:none; outline:0; background-color:#f5f5f5;} .bootstrap-select.disabled .dropdown-toggle .filter-option-inner-inner {color:#999;} .bootstrap-select > select {left:auto !important;} .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {width:140px;} /*====================================== Dropzone ========================================*/ .dropzone {min-height:300px; border:1px solid #e5e5e5} /*====================================== DataTables ========================================*/ table.dataTable thead th, table.dataTable thead td, table.dataTable tfoot th, table.dataTable tfoot td { text-align:center; } .dataTables_wrapper > .row {overflow:auto;} /* ******************** 데이터 테이블 ******************** */ table.dataTable {background:#fff;} table.dataTable thead th {text-align:center; font-size:15px; border-bottom:0;} table.dataTable tbody th, .dynamic_table table.dataTable tbody td {padding:11px 10px; text-align:center; font-size:16px; word-break:break-all; border-right:1px solid #c6c6c6; border-bottom:1px solid #c6c6c6; font-size:14px;} table.dataTable tbody th:last-child, .dynamic_table table.dataTable tbody td:last-child {border-right:0;} table.dataTable ol {padding-left:15px;} table.dataTable thead th, table.dataTable thead td {padding:9px 5px; text-align:center; font-size:14px; border-top:1px solid #000 !important; background-color:#fff !important; border-right:1px solid #eee !important; border-bottom:1px solid #ccc;} table.dataTable tbody th, table.dataTable tbody td {padding:4px 5px;} table.dataTable td {border-bottom:1px solid #eee;} table.dataTable th:last-child {border-right:0;} table.dataTable td:last-child {border-right:0;} table.dataTable.no-footer {border:0;} /* sorting */ table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting_asc_disabled, table.dataTable thead > tr > th.sorting_desc_disabled, table.dataTable thead > tr > td.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting_asc_disabled, table.dataTable thead > tr > td.sorting_desc_disabled {cursor:pointer; position:relative; padding-right:26px;} table.dataTable thead > tr > th.sorting:before, table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_asc:after, table.dataTable thead > tr > th.sorting_desc:before, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > th.sorting_asc_disabled:before, table.dataTable thead > tr > th.sorting_asc_disabled:after, table.dataTable thead > tr > th.sorting_desc_disabled:before, table.dataTable thead > tr > th.sorting_desc_disabled:after, table.dataTable thead > tr > td.sorting:before, table.dataTable thead > tr > td.sorting:after, table.dataTable thead > tr > td.sorting_asc:before, table.dataTable thead > tr > td.sorting_asc:after, table.dataTable thead > tr > td.sorting_desc:before, table.dataTable thead > tr > td.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc_disabled:before, table.dataTable thead > tr > td.sorting_asc_disabled:after, table.dataTable thead > tr > td.sorting_desc_disabled:before, table.dataTable thead > tr > td.sorting_desc_disabled:after {position:absolute; display:block; opacity:0.125; right:10px; line-height:9px; font-size:1px !important;} table.dataTable thead > tr > th.sorting:before, table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_desc:before, table.dataTable thead > tr > th.sorting_asc_disabled:before, table.dataTable thead > tr > th.sorting_desc_disabled:before, table.dataTable thead > tr > td.sorting:before, table.dataTable thead > tr > td.sorting_asc:before, table.dataTable thead > tr > td.sorting_desc:before, table.dataTable thead > tr > td.sorting_asc_disabled:before, table.dataTable thead > tr > td.sorting_desc_disabled:before {bottom:53%; content:"▲"; content:"▲"/"";} table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:after, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > th.sorting_asc_disabled:after, table.dataTable thead > tr > th.sorting_desc_disabled:after, table.dataTable thead > tr > td.sorting:after, table.dataTable thead > tr > td.sorting_asc:after, table.dataTable thead > tr > td.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc_disabled:after, table.dataTable thead > tr > td.sorting_desc_disabled:after {top:53%; content:"▼"; content:"▼"/"";} table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc:before, table.dataTable thead > tr > td.sorting_desc:after {opacity:0.6;} table.dataTable thead > tr > th.sorting_desc_disabled:after, table.dataTable thead > tr > th.sorting_asc_disabled:before, table.dataTable thead > tr > td.sorting_desc_disabled:after, table.dataTable thead > tr > td.sorting_asc_disabled:before {display:none;} table.dataTable thead > tr > th:active, table.dataTable thead > tr > td:active {outline:none;} div.dataTables_scrollBody > table.dataTable > thead {display:none;} div.dataTables_scrollBody > table.dataTable > thead > tr > th:before, div.dataTables_scrollBody > table.dataTable > thead > tr > th:after, div.dataTables_scrollBody > table.dataTable > thead > tr > td:before, div.dataTables_scrollBody > table.dataTable > thead > tr > td:after {display:none;} table.dataTable.table-striped>tbody>tr:nth-of-type(odd)>* {--bs-table-accent-bg:none; background:#f2f5fb;} table.dataTable>tbody>tr:hover, table.dataTable>tbody>tr:hover>* {background-color:#f1f1f1 !important;} @media (max-width:460px) { .dataTables_wrapper .col-sm-6 {width:100%; margin-bottom:5px;} .dataTables_wrapper .col-sm-6 .dataTables_filter {float:none;} } @media (max-width:767px) { .dataTables_length {float:none;} } /* dataTable 상단 기능 */ .dataTables_wrapper .dataTables_length {margin-bottom:10px;} .dataTables_wrapper .dataTables_length select {border:1px solid #d6d6d6; border-radius:0; padding:5px; background-color:transparent; padding:4px 30px 3px 4px; width:auto; display:inline-block;} .dataTables_wrapper .dataTables_length select:focus {outline:none;} .dataTables_wrapper .dataTables_filter {margin-bottom:10px;} .dataTables_wrapper .dataTables_filter input {display:inline-block; width:300px; border:1px solid #d6d6d6; border-radius:0; padding:3px 4px 3px 4px;} /* dataTable paging */ .dataTables_wrapper .dataTables_paginate {float:right; text-align:right; padding-top:0; margin:30px 0 20px;} .dataTables_wrapper .dataTables_paginate li.paginate_button {min-width:auto; padding:0; margin:0 5px; color:#000 !important;} .dataTables_wrapper .dataTables_paginate li.paginate_button:hover {background:transparent} .dataTables_wrapper .dataTables_paginate li.paginate_button a.page-link {padding:0; color:#000; background-color:transparent; border:none; transition:0.2s; width:25px; height:25px; line-height:27px; border-radius:13px; font-weight:500; font-size:14px;} .dataTables_wrapper .dataTables_paginate li.paginate_button a.page-link:hover {color:#000; background-color:#c7ecf8; border-color:transparent;} .dataTables_wrapper .dataTables_paginate li.paginate_button.active, .dataTables_wrapper .dataTables_paginate li.paginate_button.active:hover {border:1px solid transparent; background-color:transparent;} .dataTables_wrapper .dataTables_paginate li.paginate_button.active a, .dataTables_wrapper .dataTables_paginate li.paginate_button.active:hover a {color:#fff !important; border:none; background-color:#00b2ec !important;} .dataTables_wrapper .dataTables_paginate li.paginate_button.disabled, .dataTables_wrapper .dataTables_paginate li.paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate li.paginate_button.disabled:active {cursor:default; color:#666 !important; border:1px solid transparent; background-color:transparent; background:transparent; box-shadow:none;} .dataTables_wrapper .dataTables_paginate li.paginate_button:hover {color:#000 !important; border:1px solid transparent; background-color:transparent !important;} .dataTables_wrapper .dataTables_paginate li.paginate_button:active {outline:none; background-color:transparent; box-shadow:none;} .dataTables_wrapper .dataTables_paginate li.paginate_button.previous a, .dataTables_wrapper .dataTables_paginate li.paginate_button.next a {text-indent:-9999px; text-align:center; position:relative;} .dataTables_wrapper .dataTables_paginate li.paginate_button.previous a:after, .dataTables_wrapper .dataTables_paginate li.paginate_button.next a:after {width:6px; height:10px; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); content:""; display:block; background:url(../images/common/tui_page.png) no-repeat 0 0;} .dataTables_wrapper .dataTables_paginate li.paginate_button.previous a:after {background-position:-26px 0;} .dataTables_wrapper .dataTables_paginate li.paginate_button.next a:after {background-position:-13px -24px;} .dataTables_wrapper .dataTables_paginate li.paginate_button.previous.disabled a:After {background-position:-26px -12px;} .dataTables_wrapper .dataTables_paginate li.paginate_button.next.disabled a:after {background-position:-21px -24px;} /*====================================== Toast Grid ========================================*/ /* toastGrid background */ .misoToastGrid1 {background-color:#00ACC1 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid2 {background-color:#00BCD4 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid3 {background-color:#26C6DA !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid4 {background-color:#4DD0E1 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid5 {background-color:#80DEEA !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid6 {background-color:#B2EBF2 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid7 {background-color:#E0F7FA !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid8 {background-color:#E0F2F1 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid9 {background-color:#E8F5E9 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid10 {background-color:#F1F8E9 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid11 {background-color:#FFF8E1 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid12 {background-color:#FFECB3 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid13 {background-color:#FFE082 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid14 {background-color:#FFD54F !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid15 {background-color:#FFCA28 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid16 {background-color:#FFC107 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid17 {background-color:#FFB300 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid18 {background-color:#FFA000 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid19 {background-color:#FF8F00 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid20 {background-color:#FF6F00 !important; color:#000000 !important; font-weight:bold !important;} .misoToastGrid_red {color:#FF0000 !important; font-weight:bold !important;} .misoToastGrid_blue {color:#0000FF !important; font-weight:bold !important;} .misoToastGrid_white {color:#FFFFFF !important;} .misoToastGrid_arrow_up_blue {background:url(../images/grid/grid-arrow-up-blue.png) no-repeat center center;} .misoToastGrid_new_red {background:url(../images/grid/grid-new-red.png) no-repeat center center;} .misoToastGrid_arrow_down_blue {background:url(../images/grid/grid-arrow-down-blue.png) no-repeat center center;} .misoToastGrid_arrow_up_red {background:url(../images/grid/grid-arrow-up-red.png) no-repeat center center;} .tui-grid-cell-content select {width:98%; height:30px; font-size:12px; color:#2a3f54; border-color:#bbb; border-radius:6px;} .tui-grid-cell-content input[type=password], .tui-grid-cell-content input[type=text] {width:100%; padding:2px; border:1px solid #ffffff; border-radius:3px;} /* tui-grid */ .tui-grid-container{font-family:"KoPubWorldDotum", "맑은고딕", "Malgun Gothic", 'Apple SD Gothic Neo', "돋움", dotum, Arial, sans-serif !important; font-size:14px; overflow:auto; overflow-x:hidden;} .tui-grid-cell{border-left-width:0 !important; border-right-width:0 !important; transition:0.2s; background:#fff !important;} .tui-grid-cell-header{color:#000 !important; font-weight:700; border-top:1px solid #000 !important; background-color:#fff !important; border-right:1px solid #eee !important; position:relative;} .tui-grid-cell-header .tui-grid-btn-sorting, .tui-grid-cell-header .tui-grid-btn-filter {float:right; vertical-align:middle; position:relative; line-height:20px; height:20px;} /* .tui-grid-btn-sorting {background:-91px -10px;} .tui-grid-btn-sorting-down {background-position:-133px -8px} .tui-grid-btn-sorting-up {background-position:-112px -8px} */ .tui-grid-cell-header .tui-grid-btn-sorting {background-position:-91px -7px;} .tui-grid-cell-header .tui-grid-btn-sorting-down {background-position:-133px -7px;} .tui-grid-cell-header .tui-grid-btn-sorting-up {background-position:-112px -7px;} /* .tui-grid-btn-filter {background:-13px -84px} .tui-grid-btn-filter-active {background-position:-47px -84px} */ .tui-grid-cell-header .tui-grid-btn-filter {background-position:-15px -87px; width:20px;} .tui-grid-cell-header .tui-grid-btn-filter-active {background-position:-49px -87px;} .tui-grid-border-line-top{border-top:1px solid #000 !important; border-bottom-color:#a7a7a7 !important;} .tui-grid-border-line-bottom{border-bottom-width:0 !important;} .tui-grid-layer-focus-border{background-color:initial !important;} /* progress bar */ .tui-grid-cell .progress {margin-bottom:0;} /* 색상지정 */ .tui-grid-content-area input[type=checkbox] {accent-color:#1aa0c1;} .tui-grid-row-hover .tui-grid-cell{background-color:#f1f1f1 !important;} .grid_striped .tui-grid-row-even .tui-grid-cell {background:#f8f8f8 !important;} .grid_striped .tui-grid-row-hover .tui-grid-cell{background-color:#f1f1f1 !important;} .tui-grid-cell-has-input .tui-grid-cell-content {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1; padding:4px 8px;} .tui-grid-cell-content i {margin-right:5px; text-align:center;} .tui-grid-scrollbar-right-top {background-color:#fff !important; border-bottom:1px solid #ccc !important;} .tui-grid-body-area {background:#f8f8f8 !important;} /* null image */ .tui-grid-layer-state .tui-grid-img-nodata {display:block; margin:0 auto 15px; width:50px;} /* Checkbox */ .tui-grid-row-header-checkbox {height:15px; padding:5px 5px 3px;} .tui-grid-row-header-checkbox > input[type=checkbox] {width:15px; height:15px;} .tui-grid-cell-header > span {height:15px; display:inline-block; padding:5px 5px 3px;} .tui-grid-cell-header > span > input[type=checkbox] {width:15px; height:15px;} /* tui-pagination */ .tui-grid-container .tui-grid-pagination {margin:30px 0 0; padding-bottom:20px;} .tui-pagination {height:25px;} .tui-pagination .tui-page-btn {width:25px; height:25px; padding:0; line-height:27px; margin:0 5px; color:#000; font-size:14px; font-weight:500; border:none !important; transition:0.2s; border-radius:13px;} .tui-pagination .tui-page-btn:hover {background-color:#c7ecf8;} .tui-pagination .tui-is-selected,.tui-pagination strong {color:#fff; background:#00b2ec; border:none;} .tui-pagination .tui-is-selected:hover {background-color:#00b2ec} .tui-pagination .tui-ico-ellip,.tui-pagination .tui-ico-first,.tui-pagination .tui-ico-last,.tui-pagination .tui-ico-next,.tui-pagination .tui-ico-prev {background:url(../images/common/tui_page.png) no-repeat 0 0;} .tui-pagination .tui-ico-first {background-position:0 0} .tui-pagination .tui-ico-prev {background-position:-26px 0} .tui-pagination .tui-ico-next {background-position:-13px -24px} .tui-pagination .tui-ico-last {background-position:0 -12px} .tui-pagination .tui-ico-ellip {background-position:0 -24px} .tui-pagination .tui-is-disabled .tui-ico-prev {background-position:-26px -12px} .tui-pagination .tui-is-disabled .tui-ico-first {background-position:-13px 0} .tui-pagination .tui-is-disabled .tui-ico-next {background-position:-21px -24px} .tui-pagination .tui-is-disabled .tui-ico-last {background-position:-13px -12px} .tui-pagination .tui-first,.tui-pagination .tui-last,.tui-pagination .tui-next,.tui-pagination .tui-next-is-ellip,.tui-pagination .tui-prev,.tui-pagination .tui-prev-is-ellip {width:25px; height:25px; line-height:27px;} .tui-pagination .tui-is-disabled:hover {background:transparent; cursor:default} .tui-grid-table .m_check {margin:0;} /* 기존 스타일 */ /* .tui-grid-container {font-family:"KoPubWorldDotum", "맑은고딕", "Malgun Gothic", 'Apple SD Gothic Neo', "돋움", dotum, Arial, sans-serif !important; font-size:12px; overflow:auto;} .tui-grid-cell {border-left-width:0 !important; border-right-width:0 !important;} .tui-grid-cell-header {color:#003880 !important; font-weight:500; border-top-color:#003880 !important; border-bottom-color:#e1e3e7 !important; background-color:#f9f9f9 !important;} .tui-grid-border-line-top {border-top:1px solid #003880 !important; border-bottom-color:#e1e3e7 !important;} .tui-grid-border-line-bottom {border-bottom-width:0 !important;} .tui-grid-layer-focus-border {background-color:initial !important;} .tui-grid-row-hover .tui-grid-cell {background-color:#f3f8ff;} .tui-grid-btn-sorting {background-image:none;} .tui-grid-btn-sorting:after {display:block; content:"\efee"; line-height:1; color:#003880; font-family:"IcoFont"; font-size:16px; font-weight:100; text-indent:0;} .tui-grid-btn-sorting:hover:after {color:#1dbae1;} */ /* 상단 탭 */ ul.big_tab {width:100%; padding:0; margin:0; background:#fff; height:30px; box-shadow:none; border-bottom:none;} ul.big_tab:after {content:""; display:block; width:0; height:0; float:none; clear:both;} ul.big_tab li {float:left; min-width:150px; margin-right:3px;} ul.big_tab li {margin-bottom:0;} ul.big_tab li a {display:block; width:100%; height:30px; line-height:30px; background:#fff; color:#000; font-size:13px; text-align:center; padding:0; margin:0; border:1px solid #1941b4; border-bottom:none !important; border-radius:10px 10px 0 0; font-weight:700; position:relative; transition:0.2s;} ul.big_tab li a.active {margin-bottom:0;} ul.big_tab li a.active, ul.big_tab li a.active:focus, ul.big_tab li a:hover {background:#00b2ec !important; color:#fff !important; border-bottom:none !important;} .tab-content .tab-pane textarea.form_control.tab_textarea {border-top:2px solid #1941b4; border-radius:0 0 10px 10px;} /*=========================================================================================================================== Contents =============================================================================================================================*/ /* editor */ .editor-wrapper {min-height:250px; background-color:white; border-collapse:separate; border:1px solid #ccc; padding:4px; box-sizing:content-box; box-shadow:rgba(0, 0, 0, 0.07451) 0px 1px 1px 0px inset; border-top-right-radius:3px; border-bottom-right-radius:3px; border-bottom-left-radius:3px; border-top-left-radius:3px; overflow:scroll; outline:none} .voiceBtn {width:20px; color:transparent; background-color:transparent; transform:scale(2, 2); -webkit-transform:scale(2, 2); -moz-transform:scale(2, 2); border:transparent; cursor:pointer; box-shadow:none; -webkit-box-shadow:none} div[data-role="editor-toolbar"] {-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none} /*=========================================================================================================================== 로그인 관련 =============================================================================================================================*/ .login {background:#F7F7F7} .login .fa-paw {font-size:26px} a.hiddenanchor {display:none} .login_wrapper {right:0px; margin:0px auto; margin-top:5%; max-width:350px; position:relative} .registration_form, .login_form {position:absolute; top:0px; width:100%} .registration_form {z-index:21; opacity:0; width:100%} .login_form {z-index:22} .login_box {padding:20px; margin:auto} #signup:target ~ .login_wrapper .registration_form, #signin:target ~ .login_wrapper .login_form {z-index:22; animation-name:fadeInLeft; animation-delay:.1s} #signup:target ~ .login_wrapper .login_form, #signin:target ~.login_wrapper .registration_form { animation-name:fadeOutLeft} .animate {-webkit-animation-duration:0.5s; -webkit-animation-timing-function:ease; -webkit-animation-fill-mode:both; -moz-animation-duration:0.5s; -moz-animation-timing-function:ease; -moz-animation-fill-mode:both; -o-animation-duration:0.5s; -o-animation-timing-function:ease; -o-animation-fill-mode:both; -ms-animation-duration:0.5s; -ms-animation-timing-function:ease; -ms-animation-fill-mode:both; animation-duration:0.5s; animation-timing-function:ease; animation-fill-mode:both} .left {float:left} .alignleft {float:left; margin-right:15px} .alignright {float:right; margin-left:15px} .login_content {margin:0 auto; padding:25px 0 0; position:relative; text-align:center; text-shadow:0 1px 0 #fff; min-width:280px} .login_content a, .login_content .btn-default:hover {text-decoration:none} .login_content a:hover {text-decoration:underline} .login_content h1 {font:normal 25px Helvetica, Arial, sans-serif; letter-spacing:-0.05em; line-height:20px; margin:10px 0 30px} .login_content h1:before, .login_content h1:after {content:""; height:1px; position:absolute; top:10px; width:20%} .login_content h1:after {background:#7e7e7e; background:linear-gradient(left, #7e7e7e 0%, #fff 100%); right:0} .login_content h1:before {background:#7e7e7e; background:linear-gradient(right, #7e7e7e 0%, #fff 100%); left:0} .login_content form {margin:20px 0; position:relative} .login_content form input[type="text"], .login_content form input[type="email"], .login_content form input[type="password"] {border-radius:3px; -ms-box-shadow:0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset; -o-box-shadow:0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset; box-shadow:0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset; border:1px solid #c8c8c8; color:#354f63; margin:0 0 20px; width:100%} .login_content form input[type="text"]:focus, .login_content form input[type="email"]:focus, .login_content form input[type="password"]:focus { -ms-box-shadow:0 0 2px #ed1c24 inset; -o-box-shadow:0 0 2px #ed1c24 inset; box-shadow:0 0 2px #A97AAD inset; background-color:#fff; border:1px solid #A878AF; outline:none} #username {background-position:10px 10px !important} #password {background-position:10px -53px !important} .login_content form div a {font-size:12px; margin:10px 15px 0 0} .reset_pass {margin-top:10px !important} .login_content div .reset_pass {margin-top:13px !important; margin-right:39px; float:right} .separator {border-top:1px solid #D8D8D8; margin-top:10px; padding-top:10px} .login_content .button {background:#f7f9fa; background:linear-gradient(top, #f7f9fa 0%, #f0f0f0 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f9fa', endColorstr='#f0f0f0', GradientType=0); -ms-box-shadow:0 1px 2px rgba(0, 0, 0, 0.1) inset; -o-box-shadow:0 1px 2px rgba(0, 0, 0, 0.1) inset; box-shadow:0 1px 2px rgba(0, 0, 0, 0.1) inset; border-radius:0 0 5px 5px; border-top:1px solid #CFD5D9; padding:15px 0} .login_content form input[type="submit"], #content form .submit {float:left; margin-left:38px;} /*=========================================================================================================================== 세부페이지 공통 =============================================================================================================================*/ /* 기존 */ /* .gutter {float:left; background-color:#cee7ce; margin-top:0; cursor:ew-resize; height:calc(100vh - 170px);} .gutter.gutter-horizontal {background:#f2fbff url(../lib/split-master/img/vertical.png) no-repeat center center; cursor:col-resize; border-left:1px solid #87aec3; border-right:1px solid #87aec3; transition:0.3s; position:relative;} .gutter.gutter-horizontal:hover {background:#bee1f1 url(../lib/split-master/img/vertical.png) no-repeat center center;} .gutter.gutter-vertical {background:#f2fbff url('../lib/split-master/img/vertical.png') no-repeat center center; cursor:row-resize;} */ /**Split**/ .split {display:flex; flex-direction:row;} .gutter {background-color:transparent; background-repeat:no-repeat; background-position:50%; position:relative; z-index:100;} .gutter.gutter-horizontal {background-image:url('data:image/png; base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg=='); cursor:col-resize; border-left:1px solid #dcdcdc; border-right:1px solid #dcdcdc; background-color:#f4f4f4;} .gutter.gutter-vertical {background-image:url('data:image/png; base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII='); cursor:row-resize; border-top:1px solid #dcdcdc; border-bottom:1px solid #dcdcdc; width:100%; background-color:#f4f4f4;} .infra_container .gutter.gutter-horizontal {border-left:1px solid #dcdcdc; border-right:1px solid #dcdcdc;} .infra_container .gutter.gutter-vertical {border-top:1px solid #dcdcdc; border-bottom:1px solid #dcdcdc;} .div_column_list .card > .form_control {background:#ffffff; /* Old browsers */ background:-moz-linear-gradient(top, #ffffff 0%, #f2f4f7 100%, #f2f4f7 100%); /* FF3.6-15 */ background:-webkit-linear-gradient(top, #ffffff 0%,#f2f4f7 100%,#f2f4f7 100%); /* Chrome10-25,Safari5.1-6 */ background:linear-gradient(to bottom, #ffffff 0%,#f2f4f7 100%,#f2f4f7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f4f7',GradientType=0 ); /* IE6-9 */} .card {border-radius:10px; border:1px solid #dcdcdc; background-color:#fff;} /* #div_chartList div.card {float:left; height:225px;} */ #div_chartList div.card {float:left;} #div_chartList .card-img-top { height:225px;} /* tab style */ .nav.nav-tabs.tab_big {border-bottom:1px solid #b1b1b1;} .nav.nav-tabs.tab_big.has_title {margin-bottom:15px;} .nav.nav-tabs.tab_big.has_title li.nav_title {padding:0 30px 0 0;} .nav.nav-tabs.tab_big.has_title li.nav_title h3 {margin:0; font-size:17px; font-weight:700; height:29px; line-height:29px;} .nav.nav-tabs.tab_big.has_title .nav-link {background:#fff;} .nav.nav-tabs.tab_big.has_title li.nav-item {margin-bottom:0;} .nav.nav-tabs.tab_big li.nav-item {margin-right:2px;} .nav.nav-tabs.tab_big li.nav-item:first-child {margin-left:15px;} .nav.nav-tabs.tab_big li.nav-item:last-child {margin-right:0;} .nav.nav-tabs.tab_big .nav-link {padding:5px 15px 2px; text-align:center; font-size:14px; color:#575757; border-color:#b1b1b1; border-bottom:none; transition:0.2s; font-weight:500; border-radius:6px 6px 0 0; position:relative; overflow:hidden; margin:0; background-color:transparent;} .control_left .nav.nav-tabs.tab_big .nav-link {background:transparent;} .nav.nav-tabs.tab_big .nav-link:after {content:""; display:block; z-index:0; width:100%; height:3px; position:absolute; left:0; bottom:-3px; background:#575757; transition:0.3s;} .nav.nav-tabs.tab_big .nav-link:hover:after {bottom:0;} .nav.nav-tabs.tab_big .nav-link span {position:relative; z-index:2; display:inline-block;} .nav.nav-tabs.tab_big li.nav-item.active a, .nav.nav-tabs.tab_big .nav-link:focus, .nav.nav-tabs.tab_big .nav-item.show .nav-link, .nav.nav-tabs.tab_big .nav-link.active {color:#fff; background:#575757; border-color:#575757;} .split .nav.nav-tabs.tab_big .nav-link {min-width:150px;} /* .nav.nav-tabs.tab_big .nav-link:focus:after, .nav.nav-tabs.tab_big .nav-item.show .nav-link:after, .nav.nav-tabs.tab_big .nav-link.active:after {bottom:0; height:30px; background:#575757;} */ /* ******************************* Query Builder Style ******************************* */ /* 결과항목 레이아웃 */ #splitResultItems {overflow-x:auto !important;} #splitResultItems ul#filter_item_list {overflow:inherit !important;} /* 조건정보 레이아웃 */ #detailExtraction #splitConditionInfo {overflow-x:hidden;} #detailExtraction #splitConditionInfo h3.sub-title2 {min-width:560px; /* overflow-x:auto; overflow-y:hidden; */} .form_make_area .panel_right_con .settings_box {height:calc(100% - 50px); min-height:inherit;} .view_condition_info {min-width:initial;} /* layout */ .query_builder {font-size:14px; border:1px solid #d4d4d4; border-radius:10px; overflow-x:auto; min-height:calc(100% - 20px);} .query-builder .rules-group-header {position:relative;} .query-builder .rules-group-header .error-container {position:absolute; left:113px; top:3px;} .query-builder .rules-group-header .pull-right {display:inline-block; justify-content:inherit !important; float:right;} .query_builder > .rules-group-container .rule-container, .query_builder > .rules-group-container .group-container, .query_builder > .rules-group-container .rules-group-container {} .query_builder.query-builder .rules-group-container {padding:20px; background:transparent; border:none; display:inline-block; min-width:100%;} .query_builder.query-builder .rules-group-container .rules-group-container {padding:20px 0 0 0;} .query_builder.query-builder .rule-container {border:none; background-color:#f5fbff; box-shadow:0 3px 5px rgba(0,0,0,0.1); white-space:nowrap; display:inline-block; padding:10px 40px 10px 15px; position:relative; width:100%; min-width:910px;} .query_builder.query-builder .rule-container + .rule-container {margin-top:1px;} .query_builder.query-builder .rule-container .error-container {position:absolute; left:0; top:15px;} .query_builder.query-builder .rule-container .rule-actions {position:absolute; right:8px; top:12px;} /* 버튼 */ .query_builder .rules-group-header .group-conditions .btn {padding:2px 14px 1px; font-size:14px; background:#fff; min-width:50px; color:#007aff; border-color:#007aff; font-weight:500;} .query_builder .rules-group-header .group-conditions .btn.active {background-color:#007aff; color:#fff; border-color:#007aff;} .query_builder .rules-group-header .group-conditions .btn.disabled {opacity:1; color:#c8c8c8; border-color:#c8c8c8; pointer-events:none;} .query_builder .rules-group-header .group-conditions .btn.disabled.active {background-color:#c8c8c8; color:#fff !important; border-color:#c8c8c8;} .query_builder .rules-group-header .group-conditions .btn.disabled:after {display:none !important;} .query_builder .rules-group-header .group-conditions .btn:first-child {border-radius:15px 0 0 15px;} .query_builder .rules-group-header .group-conditions .btn:last-child {border-radius:0 15px 15px 0;} /* 타입버튼 */ .query_builder .rules-group-body .rule-value-container .group-conditions {display:inline-flex;} .query_builder .rules-group-body .rule-value-container > div {display:inline-block; vertical-align:middle;} .query_builder .rules-group-body .rule-value-container .group-conditions label {display:inline-block; width:30px; height:30px; padding:0; position:relative; color:#000; border:1px solid #000; transition:0.2s; text-align:center; line-height:28px; font-size:14px;} .query_builder .rules-group-body .rule-value-container .group-conditions label.active {background-color:#000; color:#fff;} .query_builder .rules-group-body .rule-value-container .group-conditions label + label {margin-left:-1px;} .query_builder .rules-group-body .rule-value-container .group-conditions label input[type="radio"] {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; white-space:nowrap;} .query_builder .rules-group-body .rule-value-container .group-conditions label i {margin-right:0;} .query_builder .rules-group-body .rule-value-container .form-group.has-feedback .form-control-feedback.left {border-right:none; margin-left:5px;} .query_builder .rules-group-header .group-conditions input[type="radio"].andor {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; white-space:nowrap;} .query_builder .group-actions {padding-right:5px;} .query_builder .group-actions .btn.btn-skyblue {padding:1px 14px; color:#000; font-size:14px; background:#fff; min-width:70px; border-color:#000; font-weight:400; border-radius:3px !important; vertical-align:middle;} .query_builder .group-actions .btn[data-add="rule"], .query_builder .group-actions .btn[data-add="group"] {background-color:#4f4e56; color:#fff; margin-right:5px; border-color:#4f4e56; transition:0.2s;} .query_builder .group-actions .btn[data-add="rule"]:hover, .query_builder .group-actions .btn[data-add="group"]:hover {background-color:#003880; border-color:#003880;} .query_builder .group-actions .btn[data-add="rule"] i, .query_builder .group-actions .btn[data-add="group"] i {float:right; display:inline-block; line-height:13px; height:21px; margin:0; position:relative; top:2px;} .query_builder .group-actions .btn[data-add="rule"] i:before, .query_builder .group-actions .btn[data-add="group"] i:before {font-size:10px; font-family:"icofont"; content:"\efc2"; font-weight:400; color:#fff;} .query_builder .group-actions button[data-delete] {width:25px; height:25px; border:none; padding:0; text-align:center; line-height:25px; background:none !important; font-size:0; min-width:25px; margin-right:3px;} .query_builder .group-actions button[data-delete] i {display:inline-block; line-height:25px; height:25px; margin:0;} .query_builder .group-actions button[data-delete] i:before {font-size:14px; font-family:"Font Awesome 5 Free"; content:"\f2ed"; color:#000; transition:0.2s;} .query_builder .group-actions button[data-delete]:hover i:before {color:#c06565;} .query_builder .rule-actions button[data-delete] {width:25px; height:25px; border:none; padding:0; text-align:center; line-height:25px; background:none !important; font-size:0; min-width:25px; margin-right:0;} .query_builder .rule-actions button[data-delete] i {display:inline-block; line-height:25px; height:25px; margin:0;} .query_builder .rule-actions button[data-delete] i:before {font-size:14px; font-family:"Font Awesome 5 Free"; content:"\f2ed"; color:#000; transition:0.2s;} .query_builder .rule-actions button[data-delete]:hover i:before {color:#c06565;} /* 라인 */ .query-builder .rules-list {padding-left:23px;} .query-builder .rules-list > *::before, .query-builder .rules-list > *::after {content:''; position:absolute; left:-10px; width:10px; height:calc(50% + 4px); border-color:#d4d4d4; border-style:solid;} .query-builder .rules-list > *::before {top:-10px; border-width:0 0 1px 1px; height:44px;} .query-builder .rules-list > *::after {top:24px; border-width:0 0 0 1px; height:calc(100% - 26px);} .query-builder .rules-list > .rule-container + .rule-container:before {top:-12px; height:calc(50% + 14px);} .query-builder .rules-list > .rule-container:after {top:18px; height:calc(50% + 14px);} /* dragable_area */ .dragable_area ul.list-group {overflow:auto; border:1px solid #d6d6d6; border-radius:0; padding:10px 0;} .dragable_area ul.list-group .list-group-item {border-radius:0 !important; border:none; color:#404040;} .dragable_area ul.list-group .list-group-item-action:focus, .dragable_area ul.list-group .list-group-item-action:hover {background-color:#f4f4f4;} .dragable_area ul.list-group .list-group-item.active {color:#404040; background-color:#f4f4f4;} /* ********** Editor Tab ********** */ /* 공통 */ h4.card_sub_title {font-size:16px; padding:0 0 5px 10px; position:relative; border-bottom:1px solid #e0e0e0; margin:0 0 10px;} h4.card_sub_title:before {content:""; display:block; width:4px; height:4px; border-radius:2px; background:#1fa0dc; position:absolute; left:0; top:7px;} #biDash .form-label {display:block; margin-bottom:10px;} /* range */ .form-range {width:100%; height:1.5rem; padding:0; background-color:transparent; -webkit-appearance:none; -moz-appearance:none; appearance:none} .form-range:focus {outline:0} .form-range:focus::-webkit-slider-thumb {box-shadow:0 0 0 1px #fff,0 0 0 .25rem rgba(13,110,253,.25)} .form-range:focus::-moz-range-thumb {box-shadow:0 0 0 1px #fff,0 0 0 .25rem rgba(13,110,253,.25)} .form-range::-moz-focus-outer {border:0} .form-range::-webkit-slider-thumb {width:1rem; height:1rem; margin-top:-.25rem; background-color:#1991eb; border:0; border-radius:1rem; -webkit-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; -webkit-appearance:none; appearance:none} @media (prefers-reduced-motion:reduce) { .form-range::-webkit-slider-thumb {-webkit-transition:none; transition:none} } .form-range::-webkit-slider-thumb:active {background-color:#4f4e56} .form-range::-webkit-slider-runnable-track {width:100%; height:.5rem; color:transparent; cursor:pointer; background-color:#e7eaed; border-color:transparent; border-radius:1rem} .form-range::-moz-range-thumb {width:1rem; height:1rem; background-color:#1991eb; border:0; border-radius:1rem; -moz-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; -moz-appearance:none; appearance:none} @media (prefers-reduced-motion:reduce) { .form-range::-moz-range-thumb {-moz-transition:none; transition:none} } .form-range::-moz-range-thumb:active {background-color:#4f4e56} .form-range::-moz-range-track {width:100%; height:.5rem; color:transparent; cursor:pointer; background-color:#e7eaed ; border-color:transparent; border-radius:1rem} .form-range:disabled {pointer-events:none} .form-range:disabled::-webkit-slider-thumb {background-color:var(--bs-secondary-color)} .form-range:disabled::-moz-range-thumb {background-color:var(--bs-secondary-color)} /*=========================================================================================================================== 관리자 =============================================================================================================================*/ .big_container .big_header {position:relative; width:calc(100% + 40px); background:#fff; padding:13px 35px; margin:-10px 0 0 -20px; height:56px; box-shadow:0 2px 10px rgba(0,0,0,0.05); z-index:2;} .big_container .big_header .title {margin:0; font-size:17px; font-weight:700; line-height:30px;} .big_container .big_body {padding:20px 15px; /* height:calc(100vh - 80px); min-height:calc(100vh - 80px) !important; */ overflow:auto; transition:0.3s; position:relative; margin-right:-20px; margin-top:-10px; width:100%;} .big_container .big_body .top_function, .section_manage_join .top_function {margin-bottom:15px; overflow:hidden;} .big_container .big_body .top_function .input-group {margin-bottom:0;} .grid_total_count {font-size:16px; color:#222; margin-bottom:5px; display:inline-block; letter-spacing:0.5px; } .grid_total_count strong {font-size:16px; color:#3583d5; vertical-align:baseline; font-weight:700; display:inline-block;} .grid_total_count.count_num {position:absolute; right:0; top:10px;} .top_search_area .grid_total_count {margin:0; position:relative; } /* ******************** 팝업 ******************** */ h3.modal_subtitle {width:100%; height:20px; line-height:20px; margin:0; font-size:15px; font-weight:700; padding:0; margin:0 0 10px; position:relative;} /* h3.modal_subtitle:before {content:""; display:block; width:4px; height:4px; border-radius:2px; background:#4f4e56; position:absolute; left:0; top:11px;} */ .modal-content {min-height:auto !important; margin-left:0 !important; top:50% !important; transform:translate(-50%,-50%); background:#f4f4f4;} .modal-content .tab-content {padding:20px 0 0;} .form_area [class*="col-"]:after {content:""; display:block; width:100%; height:0; float:none; clear:both;} .form_area .col:after {content:""; display:block; float:none;clear:both; width:100%; height:0;} .form_area label.form_label, .form_area span.form_label {width:100px; float:left; line-height:25px; font-size:15px; margin-top:5px; text-align:right; padding-right:20px;} .form_area label.form_label + span.txt {display:inline-block; vertical-align:middle; line-height:20px; margin-top:5px;} .form_area .form_control, .form_area .form-control, .form_area .text_info, .form_area .input-group, .form_area .form_group {width:calc(100% - 100px); float:left;} .form_area .select2.select2-container {width:calc(100% - 100px) !important;} .form_area p.form_control {border:none; background:none; margin:0; float:right; line-height:1.4; word-break:keep-all; margin-top:6px;} .form_area span.text_info {display:block; width:calc(100% - 100px); margin-top:8px; float:right; font-weight:400;} .form_area.label_60 label.form_label{width:60px;} .form_area.label_60 .form_control, .form_area.label_60 .form-control, .form_area.label_60 span.text_info, .form_area.label_60 .input-group {width:calc(100% - 60px);} .form_area.label_70 label.form_label{width:70px;} .form_area.label_70 .form_control, .form_area.label_70 .form-control, .form_area.label_70 span.text_info, .form_area.label_70 .input-group, .form_area.label_70 .form_group {width:calc(100% - 70px);} .form_area.label_80 label.form_label, .form_area.label_80 span.form_label {width:80px;} .form_area.label_80 .form_control, .form_area.label_80 .form-control, .form_area.label_80 span.text_info, .form_area.label_80 .input-group, .form_area.label_80 .form_group {width:calc(100% - 80px);} .form_area.label_90 label.form_label, .form_area.label_90 span.form_label {width:90px;} .form_area.label_90 .form_control, .form_area.label_90 .form-control, .form_area.label_90 span.text_info, .form_area.label_90 .input-group, .form_area.label_90 .form_group {width:calc(100% - 90px);} .form_area.label_100 label.form_label, .form_area.label_100 span.form_label {width:100px;} .form_area.label_100 .form_control, .form_area.label_100 .form-control, .form_area.label_100 span.text_info, .form_area.label_100 .input-group, .form_area.label_100 .form_group {width:calc(100% - 100px);} .form_area.label_110 label.form_label, .form_area.label_110 span.form_label {width:110px;} .form_area.label_110 .form_control, .form_area.label_110 .form-control, .form_area.label_110 span.text_info, .form_area.label_110 .input-group, .form_area.label_110 .form_group {width:calc(100% - 110px);} .form_area.label_120 label.form_label, .form_area.label_120 span.form_label {width:120px;} .form_area.label_120 .form_control, .form_area.label_120 .form-control, .form_area.label_120 span.text_info, .form_area.label_120 .input-group, .form_area.label_120 .form_group {width:calc(100% - 120px);} .form_area.label_130 label.form_label, .form_area.label_130 span.form_label {width:130px;} .form_area.label_130 .form_control, .form_area.label_130 .form-control, .form_area.label_130 span.text_info, .form_area.label_130 .input-group, .form_area.label_130 .form_group {width:calc(100% - 130px);} .form_area.label_140 label.form_label, .form_area.label_140 span.form_label {width:140px;} .form_area.label_140 .form_control, .form_area.label_140 .form-control, .form_area.label_140 span.text_info, .form_area.label_140 .input-group, .form_area.label_140 .form_group {width:calc(100% - 140px);} .form_area.label_150 label.form_label, .form_area.label_150 span.form_label {width:150px;} .form_area.label_150 .form_control, .form_area.label_150 .form-control, .form_area.label_150 span.text_info, .form_area.label_150 .input-group, .form_area.label_150 .form_group, .form_area.label_150 .select_wrap {width:calc(100% - 150px); display:inline-block;} .form_area.label_160 label.form_label{width:160px;} .form_area.label_160 .form_control, .form_area.label_160 .form-control, .form_area.label_160 span.text_info, .form_area.label_160 .input-group, .form_area.label_160 .form_group {width:calc(100% - 160px);} .form_area.label_170 label.form_label{width:170px;} .form_area.label_170 .form_control, .form_area.label_170 .form-control, .form_area.label_170 span.text_info, .form_area.label_170 .input-group, .form_area.label_170 .form_group {width:calc(100% - 170px);} .form_area .select2.select2-container {margin-right:0;} .form_area.label_100 .select2.select2-container {width:calc(100% - 100px) !important;} .form_area.label_110 .select2.select2-container {width:calc(100% - 110px) !important;} .form_area.label_120 .select2.select2-container {width:calc(100% - 120px) !important;} .form_area.label_130 .select2.select2-container {width:calc(100% - 130px) !important;} .form_area.label_140 .select2.select2-container {width:calc(100% - 140px) !important;} .form_area.label_150 .select2.select2-container {width:calc(100% - 150px) !important;} .form_area.label_160 .select2.select2-container {width:calc(100% - 160px) !important;} .form_area.label_170 .select2.select2-container {width:calc(100% - 170px) !important;} .form_area table.table .form_control, .form_area table.table .form-control, .form_area table.table .text_info, .form_area table.table .input-group, .form_area table.table .form_group {width:100%; float:none;} .form_area .input-group .form_control, .form_area .input-group .form-control {width:auto;} .form_area .form_item:after {content:""; display:block; width:100%; height:0; float:none; clear:both;} .form_area .form_item + .form_item {margin-top:10px;} .form_area .form_item .row_item {margin:0 0 10px; line-height:30px;} .form_area .form_item .row_item:last-child {margin-bottom:0;} .form_area .form_item .row_item:after {content:""; display:block; width:100%; height:0; clear:both; float:none;} .form_area.row {margin:0 -10px;} .form_area.row [class*="col"] {padding:0 10px;} .form_area .m_check {height:30px;} .form_area .m_check > input[type=checkbox] + label {height:30px; line-height:30px;} .form_area.row .m_check {height:30px;} .form_area.row .m_check > input[type=checkbox] + label {height:30px; line-height:30px;} .form_area .icheckbox_flat-blue {margin-top:5px;} .form_area .txt_limit {text-align:right; color:#999; font-size:12px; margin-top:2px;} .form_area .required_info {text-align:right; font-size:12px; color:#777; margin-bottom:10px; padding-right:0;} .form_area.row .required_info {padding-right:10px;} .pop_inner .form_area .form_item_group {height:34px; line-height:33px; display:inline-block; float:left;} .pop_inner .form_area .form_item_group .m_switch {height:34px;} .pop_inner .form_area.label_150 .form_item_group {width:calc(100% - 150px);} /* ******************* 팝업 본문 ******************* */ .modal-content .pop_content {position:relative; min-height:150px;} .modal-content .pop_content p {font-size:14px; color:#333; margin:0 0 10px; line-height:18px;} .modal-content .pop_content strong {font-size:14px; color:#000; margin:0 0 10px; line-height:18px; font-weight:700;} /* 아이콘(경고 등)이 있는 팝업 */ .modal-content .pop_content.pop_icon {padding-left:50px;} .modal-content .pop_content.pop_icon > i {position:absolute; left:0; top:0; font-size:30px; color:#4f4e56; line-height:1;} /* ****************** 접속화면 설정 관리 ****************** */ /* 메인 테마 설정 리스트 */ .main_theme_lst_area {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:80%;} .main_theme_lst_area ul.main_theme_lst {display:flex; flex-wrap:wrap; margin:0; padding:0;} .main_theme_lst_area ul.main_theme_lst li {width:31%; margin:0 3.5% 80px 0; list-style:none; padding:0;} .main_theme_lst_area ul.main_theme_lst li:nth-child(3n) {margin-right:0;} .main_theme_lst_area ul.main_theme_lst li button.btn_theme_select {border:none; overflow:hidden; width:100%; padding-top:50%; background:none; position:relative; border-radius:5px; border:1px solid #d9d9d9; transition:0.2s;} .main_theme_lst_area ul.main_theme_lst li button.btn_theme_select:hover {border-color:#09308e; outline:1px solid #09308e; box-shadow:0 10px 20px rgba(0,0,0,0.1);} .main_theme_lst_area ul.main_theme_lst li button.btn_theme_select img {width:100%; position:absolute; left:0; top:0;} .page_dot {margin:0; text-align:center;} .page_dot button.dot {width:18px; height:18px; border-radius:9px; transition:0.3s; margin:0 10px 0 0; background:#09308e; text-indent:-9999px; border:none; outline:none} .page_dot button.dot.active {width:70px;} .page_dot button.dot:hover {background:#16afe8;} .page_dot button.dot:last-child {margin-right:0;} /* 비쥬얼 선택 리스트 */ .visual_select_con {overflow:hidden;} button.visual_new {border:0;} button.visual_new{display:inline-block;width:250px; height:211px; color:#bec2c5; border-radius:10px; border:2px dashed #e1e3e7; background-color:#fff; font-size:17px; margin-top:10px;} button.visual_new:before{display:block;content:"\eee1";padding:10px;font-family:'icofont';color:#bec2c5;font-size:60px;transform:rotate(-45deg);} button.visual_new:hover{color:#000;border-color:#26a1ff;background-color:#f3f8ff;} button.visual_new:hover:before{color:#26a1ff;} .visual_select_area {display:block; width:100%; overflow-x:auto; margin:0 0 45px; float:right; width:calc(100% - 260px);} ul.visual_select_lst {display:flex; padding:10px 0 20px 8px; margin:0; white-space:nowrap;} ul.visual_select_lst li {padding:0 10px; margin:0; list-style:none;} ul.visual_select_lst li .visual_item {width:250px; height:211px; position:relative; border:1px solid #dadbdd; border-radius:10px; background:#fff; transition:0.2s; padding:45px 20px 25px;} ul.visual_select_lst li .visual_item:hover {border-color:#989898; box-shadow:0 0 20px rgba(0,0,0,0.2);} ul.visual_select_lst li.active .visual_item {border-color:#26a1ff; box-shadow:0 0 20px rgba(0,0,0,0.2); outline:2px solid #26a1ff;} ul.visual_select_lst li .visual_item .classified {position:absolute; border-radius:0 0 15px 15px; display:inline-block; padding:0; color:#fff; font-size:14px; left:20px; top:0; font-weight:700; text-align:center; height:30px; width:120px; line-height:30px; background:#5187ec; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 10px;} ul.visual_select_lst li .visual_item strong.item_title {height:24px; padding:0; margin:0 0 15px; font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;} ul.visual_select_lst li .visual_item .thumnail_area {background:#f1f1f1; height:100px; width:100%; overflow:hidden; position:relative; border:1px solid #eee;} ul.visual_select_lst li .visual_item .thumnail_area img {height:auto; width:100%; position:absolute; left:0; top:0;} ul.visual_select_lst li .visual_item .item_option {display:flex; align-items:center; justify-content:center; opacity:0; transition:all ease 0.2s; position:absolute; right:10px; top:5px;} ul.visual_select_lst li .visual_item .item_option button {width:30px; height:30px; line-height:30px; margin:0 4px; border-radius:15px; background:#fff; transition:all ease 0.2s; border:1px solid #002d6d; color:#002d6d;} ul.visual_select_lst li .visual_item .item_option button:after {display:block; line-height:30px;} ul.visual_select_lst li .visual_item .item_option button:hover {background:#002d6d; color:#fff;} ul.visual_select_lst li .visual_item .item_option button:hover:after {color:#fff;} ul.visual_select_lst li .visual_item .item_option button.icon_btn.icon_detail:after {content:"\ed11";} ul.visual_select_lst li .visual_item:hover > .item_option {display:flex; opacity:1; top:12px;} /* 세부 내용 */ .file_box_area {display:flex; justify-content:space-between;} .file_box_area .file_box_item {width:32%; border:1px solid #d9d9d9; border-radius:10px; padding:20px 20px; text-align:center;} .file_box_area .file_box_item strong {font-size:16px; font-weight:700; display:block; margin:0 0 5px;} .file_box_area .file_box_item span {font-size:14px; font-weight:500; display:block; margin:0;} .file_box_area .image-upload {display:block; margin-top:20px;} .file_box_area .image-upload > input {display:none;} .file_box_area .image-upload label {display:inline-block; cursor:pointer;} .file_box_area .upload-icon img.icon {width:auto; height:auto; margin:0;} .file_box_area .prev_box {display:none; width:auto;} .file_box_area .prev_box img.prev {margin:0 auto 20px; max-height:100px; display:block; box-shadow:5px 5px 10px rgba(0,0,0,0.2);} /* 도움말 서비스 바로가기용 */ .help_service_table .file_box_area {display:block;} .help_service_table .file_box_area .image-upload {margin-top:0;} .help_service_table .file_box_area img.prev {margin:0 5px 0 0; display:inline-block;} .info_txt_ul {padding:10px 10px 5px; margin:0;} .info_txt_ul li {list-style:none; padding:0 0 0 10px; margin:5px 0 0; position:relative; font-size:14px; line-height:20px; color:#999;} .info_txt_ul li:before {content:""; display:block; width:4px; height:4px; border-radius:2px; background:#888; position:absolute; left:0; top:7px;} /* 텍스트 */ span.table_small_title {font-size:15px; display:inline-block; min-width:100px; margin-right:20px; vertical-align:middle; line-height:30px;} span.table_info_txt {font-size:14px; color:#999; display:inline-block; vertical-align:middle;} span.table_small_title2 {font-size:15px; display:inline-block; margin-right:20px; vertical-align:middle; line-height:30px;} /* 색상 선택 */ .input_color_area {position:relative; display:inline-block; width:150px;} .input_color_area .form_control.input_color {text-align:center; width:120px;} .form_control.input_color {cursor:pointer;} .input_color_area label.color_icon {width:30px; height:30px; position:absolute; right:0; top:0; background:url(../images/icon/icon_black_selectColor.png) no-repeat center center; cursor:pointer; transition:0.2s;} .input_color_area label.color_icon:hover {background:url(../images/icon/icon_black_selectColor_hover.png) no-repeat center center;} /* 하단 문구 */ #footerTxt1.form_control, #footerTxt2.form_control {height:40px; line-height:1; font-size:12px; color:#fff; font-weight:300;} /* 비주얼 메세지 */ input#mainSubTitleInput.form_control {font-size:28px; color:#0d246a; font-weight:700; line-height:1; height:50px;} input#mainHeadTitleInput.form_control{font-size:54px; color:#0d246a; font-weight:700; line-height:1; height:70px;} textarea#mainInfoTxt.form_control {font-size:18px; color:#0d246a; font-weight:500; line-height:30px; resize:none;} /* ********** 비주얼 컬러 옵션 ********** */ .select_main_visual_color {display:inline-block;} /* disabled 효과 */ .form-table .select_main_visual_color.disabled span.table_small_title2 {color:#ccc;} .form-table .select_main_visual_color.disabled .form_control {opacity:0.2; pointer-events:none;} .form-table .select_main_visual_color.disabled .color_icon {opacity:0.2; pointer-events:none;} /* 이미지 업로드 팝업 */ .img_crop_btn {text-align:center; margin:0 0 20px;} /* manage */ .manage_title {margin:30px 0 10px; font-size:17px; font-weight:700;} /* 콘텐츠 바로가기 */ .color_box {width:120px; height:28px; display:inline-block; text-indent:-9999px;} /* 콘텐츠 바로가기 테이블 */ .contents_link_table .dropdown button.dropdown-toggle {min-width:100%; border-color:#d6d6d6;} .contents_link_table .dropdown button.dropdown-toggle:after {border-top-color:#000;} .contents_link_table .dropdown img {height:20px;} .contents_link_table .dropdown .dropdown-menu {min-width:100%; text-align:center;} .contents_link_table i.fa-grip {cursor:move; transition:0.2s; color:#000;} .contents_link_table i.fa-grip:hover {color:#54b9ff;} .contents_link_table a.fast_link_select {text-align:left; display:block; margin:10px 0 0;} .contents_link_table a.fast_link_select span {display:inline-block; margin-left:5px; opacity:0.5;} .contents_link_table tbody tr td {vertical-align:top;} .contents_link_table i.fa-grip {margin-top:8px;} .contents_link_table .m_switch {margin-top:5px;} /* 도움말/서비스 테이블 */ .help_service_table .dropdown button.dropdown-toggle {min-width:100%; border-color:#d6d6d6;} .help_service_table .dropdown button.dropdown-toggle:after {border-top-color:#000;} .help_service_table .dropdown img {height:20px;} .help_service_table .dropdown .dropdown-menu {min-width:100%; text-align:center;} .help_service_table i.fa-grip {cursor:move; transition:0.2s; color:#000;} .help_service_table i.fa-grip:hover {color:#54b9ff;} .help_service_table a.fast_link_select {text-align:left; display:block; margin:10px 0 0;} .help_service_table a.fast_link_select span {display:inline-block; margin-left:5px; opacity:0.5;} .help_service_table tbody tr td {vertical-align:top;} .help_service_table i.fa-grip {margin-top:8px;} .help_service_table .m_switch {margin-top:5px;} .help_service_table .pop_position {display:flex; margin-top:5px; justify-content:space-between;} .help_service_table .pop_position span {line-height:30px;} /* 검색 빠른 링크 테이블 */ .search_link_table i.fa-grip {cursor:move; transition:0.2s; color:#000;} .search_link_table i.fa-grip:hover {color:#54b9ff;} .search_link_table a.fast_link_select {text-align:left; display:block; margin:0; line-height:30px;} .search_link_table a.fast_link_select span {display:inline-block; margin-left:5px; opacity:0.5;} .search_link_table tbody tr td {vertical-align:top;} .search_link_table i.fa-grip {margin-top:8px;} .search_link_table .m_switch {margin-top:5px;} .search_link_table td > span {line-height:30px;} /* 개인정보 보호 관리 탭 */ #manageConnectionRecordTable select.form_control {display:inline-block; width:auto; min-width:120px;} #manageConnectionRecordTable .m_check {vertical-align:middle;} .null_data {position:absolute; left:50%; top:50%; display:inline-block; padding-top:70px; background:url(../images/board/no_data_null_img.png) no-repeat center top; font-size:16px; color:#333; text-align:center; transform:translate(-50%,-50%); background-size:auto 50px;} /* **************************************** 공지사항 팝업 관련 스타일 **************************************** */ /* 타이틀 */ .modal-dialog .news_view_area {margin-bottom:30px;} .modal-dialog .news_view_area .news_view_info {padding:0; border-bottom:none;} .modal-dialog .news_view_area .news_view_info h4.title {margin-bottom:0; line-height:1.2; color:#4f4d56; font-weight:700; word-break:keep-all;} /* 본문내용 */ .modal-dialog .news_view_content {font-size:inherit; overflow:auto; padding-bottom:5px; word-break:keep-all;} .modal-dialog .news_view_content p, .note-editable p, #div_prLibraryContent .board_detail .editor_area p {margin-bottom:inherit;} /* ----- step tab ----- */ /* Title 및 텍스트 */ .page_title {font-size:32px; line-height:1; font-weight:700; letter-spacing:-1px; color:#000; margin:0 0 40px; text-align:center;} .big_body > .page_title {padding-top:40px;} .step-tab {overflow:hidden; box-sizing:border-box; margin:0 0 80px 0;} .step-tab ul {display:flex; flex-wrap:nowrap; box-sizing:border-box; height:48px; margin-bottom:0;} .step-tab ul li {flex:1; display:block; position:relative; box-sizing:border-box; height:48px; border-top:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2; background:#fff; font-size:16px; line-height:48px; color:#121212; text-align:center;} .step-tab ul li::before {content:''; display:block; position:absolute; top:-1px; left:-1px; width:1px; height:calc(100% + 2px); background:#e2e2e2; font-size:0; line-height:0;} .step-tab ul li:first-child {border-left:1px solid #e2e2e2; border-radius:2px 0 0 2px;} .step-tab ul li:first-child::before {display:none;} .step-tab ul li:last-child {border-right: 1px solid #e2e2e2; border-radius: 0 2px 2px 0;} .step-tab ul li.active {position:relative; z-index:1; border-color:#121212; background:#121212; color:#fff;} .step-tab ul li.active a {color:#fff;} .step-tab ul li.active::before {background-color: #121212;} .step-tab ul li a {display:block;} /* Wizard */ .top_bar.bar1 li {width:calc(20% + 40px);} .top_bar.bar1 li:first-child {width:calc(20% + 14px);} .top_bar.bar2 li {width:calc(50% + 27px);} .top_bar {list-style:none; padding:0 14px 0 0; position:relative; overflow:hidden; margin:0;} .top_bar:after {content:""; display:block; clear:both; float:none; width:100%; height:0;} .top_bar li {display:block; position:relative; float:left; margin-right:-40px; padding:0; line-height:50px; height:50px; font-size:18px; background-color:#e8e8e8; color:#000; text-align:center; border-radius:30px;} .top_bar li.active {background:#214ca4; color:#fff;} /* .top_bar li:nth-child(1) {z-index:10; text-indent:-25px;} .top_bar li:nth-child(2) {z-index:9;} .top_bar li:nth-child(3) {z-index:8;} .top_bar li:nth-child(4) {z-index:7;} */ .top_bar li.active a {position:relative;} .top_bar li.active.step {color:#fff; background:#214ca4;} .top_bar li.active.step1, .top_bar.tab li.active a {z-index:1;} .top_bar li.active.step2 {z-index:2;} .top_bar li.active.step3 {z-index:3;} .top_bar li.active.step4 {z-index:4;} .top_bar li.active.step5 {z-index:5;} .top_bar li.active a {color:#fff;} .top_bar.bar1 li a, .top_bar.bar3 li a {pointer-events:none;} .top_bar.bar1.tab li a, .top_bar.bar3 li a {pointer-events:auto;} .top_bar.tab li a.active, .top_bar.tab li.active {color:#fff; background:#214ca4; border-radius:30px; z-index:1; position:relative; width:100%;} .owl-carousel.top_bar.bar1 li {width:100%;} /* .owl-carousel.top_bar .owl-item:nth-child(4) li {width:calc()} */ /* 캘린터 팝업 - 탭 */ .cal_top_bar {list-style:none; padding:0 20px; position:relative; overflow:hidden; margin:0;} .cal_top_bar:after {content:""; display:block; clear:both; float:none; width:100%; height:0;} .cal_top_bar .owl-stage {width:100% !important;} .cal_top_bar a {display:inline-block; position:relative; margin-right:-40px; padding:0 40px; line-height:50px; height:50px; font-size:18px; background-color:#e8e8e8; color:#000; text-align:center; border-radius:30px; width:calc(25% + 28px);} .cal_top_bar .owl-stage .owl-item:first-child a {width:calc(100% + 14px);} .cal_top_bar a.active {background:#214ca4; color:#fff; z-index:1;} .cal_top_bar .tab_btn {position:absolute; width:100%; top:13px;} .cal_top_bar .tab_btn > button {position:absolute;} .cal_top_bar .tab_btn > button.prev {left:-21px;} .cal_top_bar .tab_btn > button.next {right:17px;} .cal_top_bar .tab_btn > button:before {font-family:"fontawesome"; font-size:15px; color:#000;} .cal_top_bar .tab_btn > button.prev:before {content:"\f053";} .cal_top_bar .tab_btn > button.next:before {content:"\f054";} /* 사용자 접속 현황 */ .section_user .card_area.cols3 > li .card_item {height:350px;} .section_user .top_area {text-align:right; margin-bottom:20px;} .section_user .top_area span {vertical-align:middle;} /* 스케줄 팝업 */ .pop_inner.pop_schedule {} .pop_inner.pop_schedule .date_item {padding-left:15px; position:relative; margin:5px 0; font-size:16px;} .pop_inner.pop_schedule .date_item:before {content:""; display:block; width:8px; height:8px; border-radius:50%; position:absolute; left:0; top:50%; transform:translateY(-50%);} .pop_inner.pop_schedule .date_item.scheduled:before {background:#26a1ff;} .pop_inner.pop_schedule .date_item.completed:before {background:#6bd03f;} .pop_inner.pop_schedule .date_item.faild:before {background:#fb6543;} /* 회원 정보 수정 완료 */ .member_reault {padding-top:300px; background-repeat:no-repeat; background-position:center center;} .member_reault.join {background-image:url(../images/login/member_join_result.png)} .member_reault.edit {background-image:url(../images/login/member_edit_result.png)} .member_reault.withdraw {background-image:url(../images/login/member_withdraw_result.png)} .member_reault strong {display:block; font-size:28px; font-weight:700; text-align:center;} .member_reault p {padding:10px 0; color:#626262; font-size:17px; font-weight:700; text-align:center;} .finish_area .page_btn {text-align:center; margin-top:40px;} .finish_area .page_btn .btn {margin-right:15px;} .finish_area .page_btn .btn:last-child {margin-right:0;} /* 회원 탈퇴 */ .membership_section .notice_list {padding:0; margin:0; list-style:none;} .membership_section .color_red {color:#e00c0c;} .membership_section .notice_list li {margin:0 0 5px; color:#303030; font-weight:400; font-size:15px;} .membership_section .notice_txt {color:#303030; font-weight:600; font-size:15px;} .membership_section .notice_detail_area {margin-top:25px; padding:20px 30px; background:#f5f5f5;} .membership_section .notice_detail_area h3.notice_title {margin-bottom:20px; font-size:15px; font-weight:600;} .membership_section .checkradio_item {margin:20px 0 0; text-align:left; font-size:15px;} .membership_section .desc_box .radio_item {margin:0 0 35px;} .membership_section .desc_box .m_radio > input[type=radio] + label {margin-right:20px; color:#4c4c4c; font-size:16px;} .membership_section .m_checkradio > input[type=checkbox] + label, .m_checkradio > input[type=radio] + label {width:auto;} .membership_section .desc_box .textarea_item {padding:0 30px; text-align:right;} .membership_section .desc_box .textarea_item .m_textarea {margin:10px 0; background-color:#ededed;} .membership_section .desc_box .textarea_item .m_textarea:placeholder {color:#888;} .membership_section .desc_box .textarea_item .m_textarea:focus {background-color:#fff; border-color:#c7c7c7;} .sub_section.membership_section .page_title {margin-bottom:20px; font-size:22px; font-weight:600;} .sub_section.membership_section .notice_detail_area .info_txt:before {vertical-align:middle;} /* 약관동의 */ .m_inner ul {padding:0; list-style:none;} .service_area {margin:0 0 20px 0; font-size:14px; padding:0;} .service_area .m_checkradio > input[type=checkbox] + label {font-weight:500; font-size:15px;} .service_area .list_item {border-bottom:1px solid #cccccc; position:relative; margin:0; padding:25px 0 25px 20px;} .service_area .list_item, .sub_section.qna_section .service_area li.active .list_item, .service_area li.active {border-bottom:1px solid #ccc;} .sub_section.qna_section .service_area .list_item:after {content:""; background:url("../images/icon/icon_list_arrow.png")no-repeat center; width:18px; height:10px; position:absolute; top:50%; transfdorm:translateY(-50%); right:28px;} .service_area li {list-style:none;} .service_area li.active {padding-bottom:20px; border-bottom:1px solid #ccc;} .service_area li.active .list_item {border-bottom:0;} .sub_section.qna_section .service_area li.active .list_item:after {transform:rotate(180deg);} .service_area li.active .list_txt {margin:0; height:auto; margin:0 30px;} .service_area ul {list-style:none; padding:0;} .service_area .list_item.checkbox:after {display:none;} .service_area .list_txt {margin:0; overflow:hidden; height:0; font-size:14px; background:#fff;} .service_area .list_txt .agree_box {padding:10px; height:175px; overflow-y:auto; border:1px solid #d1d1d1;} .service_area .list_txt .agree_box .list_detail {margin:10px;} .service_area .list_txt p {margin-bottom:35px;} .service_area .list_txt p, .service_area .list_txt ol li {font-weight:500;} .service_area .list_txt h5 {margin:10px 0; margin-top:0; font-weight:700; font-size:14px;} .service_area .list_txt ol {padding:0;} .service_area .list_txt ol li {list-style:none; margin:3px 0;} .sub_section.qna_section .paging_area {padding-top:60px;} .sub_section.agree_section {overflow-x:hidden;} .sub_section.agree_section .accordion_txt {color:#a8a8a8; font-size:14px;} .sub_section.agree_section .txt_accent {color:#e00c0c;} .sub_section.agree_section .list_item.list_accent label {font-weight:600;} .sub_section.agree_section .list_item.list_accent {border-bottom:1px solid #0b75df; border-top:1px solid #0b75df;} .sub_section.agree_section .list_item .m_icon.img_accordion {background:url("../images/icon/icon_list_arrow.png")no-repeat center center; width:18px; height:10px; text-indent:-9999px; position:absolute; right:0; top:50%; transform:translateY(-50%);} .sub_section.agree_section li.active .list_item .m_icon.img_accordion {transform:translateY(-50%) rotate(180deg);} .sub_section.agree_section .m_check > input[type=checkbox] + label {font-size:15px;} .sub_section.agree_section .list_item.checkbox {border-bottom:1px solid #ccc;} /* 이용약관 */ .tag_area .tag_con_area li .list_1depth.depth_fst {margin-top:15px;} .tag_area .tag_con_area li .list_1depth.depth_fst > li {padding-left:14px; position:relative; margin-bottom:5px;} .list_1depth.depth_fst > li:before {font-size:15px; position:absolute; left:0;} .list_1depth.depth_fst > li:nth-child(1):before {content:"1. ";} .list_1depth.depth_fst > li:nth-child(2):before {content:"2. ";} .list_1depth.depth_fst > li:nth-child(3):before {content:"3. ";} .list_1depth.depth_fst > li:nth-child(4):before {content:"4. ";} .list_1depth.depth_fst > li:nth-child(5):before {content:"5. ";} .list_1depth.depth_fst > li:nth-child(6):before {content:"6. ";} .agreement_sub {font-size:15px;} .agreement_sub span {} .agreement_sub p {} .manage_editor_area {margin-top:30px;} .manage_editor_area textarea {resize:none;} /*********** QNA ***********/ .section_board .m_text {padding:10px; font-size:16px;} .section_board .select2-container--default .select2-selection {height:44px;} .section_board .select2-container--default .select2-selection--single .select2-selection__rendered {line-height:44px; font-size:16px;} .section_board .select2-container--default .select2-selection--single .select2-selection__arrow:after {right:5px;} .select2-container--default .select2-selection--single .select2-selection__arrow:after {right:5px;} .section_board .m_text::placeholder {color:#848484; } .section_board .section_qna .info_inner {margin-top:25px;} .section_board .section_qna .info_inner .info_title {margin-bottom:20px; font-size:20px; font-weight:600;} .section_board .section_qna .info_inner .info_title span {font-size:16px; font-weight:500; color:#002fa3; vertical-align:middle; padding-left:5px;} .section_board .section_qna .form_wrap {display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between;} .section_board .section_qna .form_inner {position:relative; display:inline-block; width:100%;} .section_board .section_qna .form_wrap .form_inner {flex-basis:49.5%;} .section_board .section_qna .m_text {width:100%; max-width:100%; min-width:100%;} .section_board .section_qna .m_text:focus {outline:none;} .section_board .section_qna .info_inner .hover_act {display:block; width:0; height:2px; background:#1454ff; position:absolute; left:2px; bottom:1px; transition:0.3s;} .section_board .section_qna .info_inner .m_text:focus + .hover_act {width:100%;} .section_board .section_qna .info_inner .radio_group {margin-top:25px;} .section_board .section_qna .info_inner .radio_group .radio_label {font-size:16px; font-weight:600; vertical-align:middle; margin-right:20px;} .section_board .section_qna .info_inner .radio_group .helper_txt {color:#848484; font-size:16px; vertical-align:middle;} .section_board .section_qna .info_inner .radio_group .radio_wrap {display:inline-block; vertical-align:middle;} .section_board .section_qna .info_inner .radio_group .m_radio label {font-size:16px;} .section_board .section_qna .submit_box {border-top:1px solid #e6e6e6; padding-top:25px; margin-top:35px; display:flex; justify-content:space-between; align-items:center;} .section_board .section_qna .submit_box .agree_area {font-size:16px; width:100%;} .section_board .section_qna .submit_box .agree_area .m_check {margin-left:0;} .section_board .section_qna .submit_box .agree_area a {font-weight:600; margin:2px;} .section_board .section_qna .submit_box .agree_area .btn_allview {line-height:20px; vertical-align:top;} .section_board .section_qna .submit_box .agree_area .btn_allview i {margin-left:2px; font-size:13px;} /* 문의하기 */ .section_board .list_txt {margin:0; overflow:hidden; height:0; font-size:14px;} .section_board .list_txt.active {margin:0; height:auto; margin-top:20px;} .section_board .list_txt .agree_box {height:400px; overflow-y:auto; border:1px solid #bbb; font-size:15px; padding-bottom:55px; background:#fff; border-radius:6px;} .section_board .list_txt .agree_box .agree_inner {padding:15px;} .section_board .agree_area .allview_title strong {font-size:12px; vertical-align:middle;} .section_board .list_txt .agree_box .agree_title {font-size:22px; } .section_board .list_txt .agree_box .agree_sub_title {font-size:18px; font-weight:500;} .section_board .list_txt .agree_box .agree_txt {margin:10px 0;} .section_board .list_txt .agree_box .agree_lst_txt {margin-left:15px;} .section_board .agree_check {background:#fff; font-size:18px; padding:15px; position:relative; bottom:61px; left:1px; width:calc(100% - 2px); border-top:1px solid #f1f1f1;} /* 회원탈퇴신청 */ .withdraw_area {} .withdraw_area .withdraw_title {font-size:22px; font-weight:500; margin-left:30px; float:left; display:block;} .withdraw_area .withdraw_list {border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; padding:30px;} .withdraw_area .withdraw_list .list_item {margin-bottom:20px;} .withdraw_area .withdraw_list .list_item:last-of-type {margin-bottom:0;} .withdraw_area .withdraw_list .list_item strong {font-size:18px; width:200px; padding-right:20px; vertical-align:top; display:inline-block;} .withdraw_area .withdraw_list .list_item p {font-size:15px; display:inline-block;} .withdraw_area .checkradio_item {text-align:center; margin-top:40px;} .withdraw_area .m_check > input[type=checkbox] + label {font-size:17px; font-weight:500;} .withdraw_area .form_field.form_password {position:relative; width:500px; margin:50px auto;} .withdraw_area .form_field.form_password .m_text {width:100%; height:45px; padding:0 45px;} .withdraw_area .form_field.form_password:before {content:""; display:block; width:45px; height:45px; background:url("../images/icon/icon_pw.png") no-repeat center center; position:absolute; left:0; top:0; z-index:10;} .withdraw_area .form_field.form_password input {margin-bottom:0; padding-right:45px;} .withdraw_area .form_field.form_password button.btn_show_pwd {background:url(../images/login/icon_pw2.png) no-repeat center; display:block; width:30px; height:30px; border:0; position:absolute; right:10px; top:50%; transform:translateY(-50%);} .withdraw_area .form_field.form_password input[type=text] + button.btn_show_pwd {background:url(../images/login/icon_pw1.png) no-repeat center;} /* 이메일 인증/아웃바운드 메일 */ .code_box {border:1px solid #888; width:650px; margin:auto; } .code_box .code_title {font-size:22px; background:#0d4c78; color:#fff; padding:30px;} .code_box .code_wrap {padding:30px;} .code_box .code_wrap p {font-size:19px; line-height:38px; margin-bottom:20px;} .code_box .code_wrap p strong {display:block; text-align:center; font-size:60px; margin:45px 0; letter-spacing:15px;} .code_box .code_wrap p.sub_txt {color:#888; line-height:1.4em; font-size:15px; margin-bottom:0; } /* 회원가입완료 */ .membership_box_area {min-width:1050px; max-width:1050px; margin:auto;} .membership_box_area ul {display:flex; gap:20px;} .membership_box_area ul > li {flex:1; padding:20px; border-radius:20px; position:relative;} .membership_box_area .top_list {margin-top:60px; margin-bottom:80px;} .membership_box_area .top_list li {padding:25px 40px; padding-bottom:15px; list-style:none;} .membership_box_area .top_list li:nth-child(1) {background:#003ace;} .membership_box_area .top_list li:nth-child(2) {background:#55b4ae url(../images/sub/bg_membership_guide1.png) no-repeat right -2px bottom -22px;} .membership_box_area .top_list li:nth-child(2):after {} .membership_box_area .top_list li .number {font-weight:700; font-size:60px; line-height:1;} .membership_box_area .top_list li:nth-child(1) .number {color:#01229b;} .membership_box_area .top_list li:nth-child(2) .number {color:#358b86;} .membership_box_area .top_list li p {font-size:22px; color:#fff; font-weight:600; margin-bottom:40px; line-height:1.25em;} .membership_box_area .top_list li .down_file {background:#5e88f7; border-radius:25px; color:#fff; font-size:20px; height:50px; line-height:50px; padding:0 30px; position:absolute; right:40px; bottom:25px;} .membership_box_area .top_list li .down_file:hover {color:#5e88f7; background:#fff;} .membership_box_area .top_list li .down_file:before {content:"\f019"; font-family:"Fontawesome"; color:#fff; font-size:20px; display:inline-block; margin-right:15px; transition:0.2s;} .membership_box_area .top_list li .down_file:hover:before {color:#5e88f7;} .membership_box_area .bottom_list li {padding:30px 25px; list-style:none;} .membership_box_area .bottom_list li:nth-child(1) {border:1px solid #9dadde; background:url(../images/sub/bg_membership_guide2.png) no-repeat right -13px bottom 7px;} .membership_box_area .bottom_list li:nth-child(2) {border:1px solid #d8a9bc; background:url(../images/sub/bg_membership_guide3.png) no-repeat right -50px bottom 16px;} .membership_box_area .bottom_list li:nth-child(3) {border:1px solid #7bb7b3; background:url(../images/sub/bg_membership_guide4.png) no-repeat right -4px bottom 9px;} .membership_box_area .bottom_list li p {font-size:20px; font-weight:700; line-height:1.3em;} .membership_box_area .bottom_list li:nth-child(1) p {color:#1751c1;} .membership_box_area .bottom_list li:nth-child(2) p {color:#b13164;} .membership_box_area .bottom_list li:nth-child(3) p {color:#329c96;} /* 본인확인 */ .login_area.privacy_area {max-width:545px; margin:0 auto;} .login_area.privacy_area .tab_area {padding-bottom:20px;} .login_area.privacy_area .tab_area .tab_bar {justify-content:space-around; border-bottom:0;} .login_area.privacy_area .tab_area .tab_bar li a {font-size:15px; color:#303030; background-color:transparent; padding:20px 0; text-align:center; display:inline-block; width:149px; border-bottom:3px solid #303030; font-weight:600;} .login_area.privacy_area .tab_area > .tab_bar > li > a:hover, .login_area.privacy_area .tab_area > .tab_bar > li > a.active {border-bottom:3px solid #29c481; color:#29c481;} .privacy_box {background-color:#f3fcf8; margin-bottom:22px; background:#eef6ff; padding:30px; margin-top:20px;} .privacy_box p {font-size:14px; position:relative; padding-left:62px; margin:0; color:#000; font-weight:500;} .privacy_box p:before {content:""; position:absolute; background:url("../images/icon/icon_privacy.png")no-repeat center; width:45px; height:45px; left:0; top:50%; transform:translateY(-50%);} .privacy_box .main_txt {font-size:16px;} .privacy_box .privacy_lst {padding-left:62px; margin:0; margin-top:15px;} .privacy_box .privacy_lst li {padding-left:10px; position:relative; font-size:15px; margin-bottom:3px; list-style:none;} .privacy_box .privacy_lst li:last-child {margin-bottom:0;} .privacy_box .privacy_lst li:before {content:""; display:block; width:4px; height:4px; border-radius:50%; position:absolute; top:50%; transform:translateY(-50%); left:0; background:#000;} .login_area.privacy_area .btn_area {margin-top:20px;} .login_area.privacy_area .form_field.form_password {position:relative;} .login_area .form_field .btn_show_pwd {display:block; width:20px; height:15px; position:absolute; right:17px; top:13px;} .login_area .form_field .btn_show_pwd:before {content:"\ef21"; font-family:"Icofont"; font-size:16px; color:#888;} .login_area .btn_l {width:100%; display:block; height:60px; text-align:center; display:inline-block; padding:0; border-radius:5px; font-size:20px; font-weight:600; line-height:60px;} .login_area .m_text {height:45px; padding-left:50px; margin-bottom:10px; border-radius:5px; border-color:#ccc; width:100%;} .login_area .form_field.form_id, .login_area .form_field.form_password {position:relative;} .login_area .form_field.form_id:before {content:""; display:block; width:45px; height:45px; background:url("../images/icon/icon_id.png") no-repeat center center; position:absolute; left:0; top:0; z-index:10;} .login_area .form_field.form_password:before {content:""; display:block; width:45px; height:45px; background:url("../images/icon/icon_pw.png") no-repeat center center; position:absolute; left:0; top:0; z-index:10;} .login_area .find_wrap {margin:10px 0 0; overflow:hidden;} .login_area .m_check > input[type=checkbox] + label {font-size:15px; font-weight:500;} .login_area .find_list {float:right;} .login_area .find_list li {display:inline-block; position:relative; padding:0 12px; font-size:15px; font-weight:500;} .login_area .find_list li:last-child {margin-left:-2px; padding-right:0;} .login_area .find_list li:after {content:""; display:block; width:1px; height:15px; background-color:#ccc; position:absolute; right:0; top:50%; transform:translateY(-50%);} .login_area .find_list li:last-child:after {display:none;} .login_area .find_list li a.color_point {color:#0b75df;} .login_area .login_txt {text-align:center;} .login_area .login_txt .color_point {color:#0b75df; text-decoration:underline;} .login_area .btn_area {margin-top:60px;} .login_area .btn_area .btn_link.line_black, .login_area .btn_area .btn_link.type_black {margin:20px 0;} .login_area.privacy_area .form_field.form_password input {margin-bottom:0; padding-right:45px;} .login_area.privacy_area .form_field.form_password button.btn_show_pwd {background:url(../images/login/icon_pw2.png) no-repeat center; display:block; width:30px; height:30px; border:0; position:absolute; right:10px; top:50%; transform:translateY(-50%);} .login_area.privacy_area .form_field.form_password input[type=text] + button.btn_show_pwd {background:url(../images/login/icon_pw1.png) no-repeat center;} .login_area.privacy_area .form_field.form_password button.btn_show_pwd:before {display:none;} /**** 개인정보처리방침 ****/ .privacy_section {scroll-behavior: smooth;} .privacy_section .privacy_wrap {border:1px solid #444; padding:15px; background:#fff;} .privacy_section .privacy_wrap p {font-size:16px; word-break:keep-all;} .privacy_section .privacy_wrap p:nth-child(1) {margin-bottom:15px;} .privacy_section .privacy_wrap p:nth-child(2) {margin:0;} .privacy_section .help_txt {font-size:15px; color:#e97132; font-weight:500; display:block; margin-top:10px;} .major_icon_area {margin:75px 0;} .major_icon_area .privacy_sub_title {font-size:22px; text-align:center;} .major_icon_area .privacy_icon_lst {display:flex; justify-content:space-between; margin-top:15px;} .major_icon_area .privacy_icon_lst li {list-style:none;} .major_icon_area .privacy_icon_lst > li {border:1px solid #0044cc; height:145px; width:15%; text-align:center; position:relative; background:#fff;} .major_icon_area .privacy_icon_lst > li .lst_inner {padding:30px;} .major_icon_area .privacy_icon_lst li strong {font-size:17px; position:relative; padding-top:65px; display:block;} .major_icon_area .privacy_icon_lst li strong:before {content:""; display:block; position:absolute; top:0; left:50%; transform:translateX(-50%);} .major_icon_area .privacy_icon_lst li:nth-child(1) strong:before {background:url(../images/icon/privacy_icon1.png) no-repeat center; width:50px; height:50px;} .major_icon_area .privacy_icon_lst li:nth-child(2) strong:before {background:url(../images/icon/privacy_icon2.png) no-repeat center; width:47px; height:54px;} .major_icon_area .privacy_icon_lst li:nth-child(3) strong:before {background:url(../images/icon/privacy_icon3.png) no-repeat center; width:47px; height:54px;} .major_icon_area .privacy_icon_lst li:nth-child(4) strong:before {background:url(../images/icon/privacy_icon4.png) no-repeat center; width:47px; height:54px;} .major_icon_area .privacy_icon_lst li:nth-child(5) strong:before {background:url(../images/icon/privacy_icon5.png) no-repeat center; width:47px; height:54px;} .major_icon_area .privacy_icon_lst li:nth-child(6) strong:before {background:url(../images/icon/privacy_icon6.png) no-repeat center; width:48px; height:48px;} .major_icon_area .privacy_icon_lst .detail_box {opacity:0; visibility:hidden; transition:0.2s; border:1px solid #444; padding:10px; position:absolute; top:120px; width:250px; text-align:left; left:-1px; background:#fff; z-index:1;} .major_icon_area .privacy_icon_lst .detail_box.active {opacity:1; visibility:visible;} .major_icon_area .privacy_icon_lst > li .lst_inner:hover + .detail_box {visibility:visible; opacity:1;} .major_icon_area .privacy_icon_lst .detail_box .detailClose {position:absolute; right:5px; top:5px;} .major_icon_area .privacy_icon_lst .detail_box .detailClose:before {content:"\f00d"; font-family:fontawesome; font-size:16px; color:#444;} .major_icon_area .privacy_icon_lst .detail_box .detail_title {color:#252525; margin-bottom:15px; display:block; font-weight:500; font-size:15px;} .major_icon_area .privacy_icon_lst .detail_box .box_lst {padding:0; margin:0;} .major_icon_area .privacy_icon_lst .detail_box .box_lst li {padding:0; margin:0; padding-left:8px; position:relative;} .major_icon_area .privacy_icon_lst .detail_box .box_lst li:before {content:""; display:block; width:3px; height:3px; border-radius:50%; position:absolute; left:0; background:#000; top:8px;} .major_icon_area .privacy_icon_lst .detail_box .service_nm {padding-right:10px; display:block;} .major_icon_area .privacy_icon_lst .detail_box .service_nm strong {font-weight:400; width:55px; display:inline-block; padding:0; font-size:14px;} .major_icon_area .privacy_icon_lst .detail_box .service_nm strong:before {display:none;} .tag_area {} .tag_area .tag_top {font-size:16px; margin-bottom:10px; display:block;} .tag_area .privacy_wrap {padding:25px 40px;} .tag_area .privacy_wrap .tag_lst {display:flex; flex-wrap:wrap; margin:0;} .tag_area .privacy_wrap .tag_lst li {width:33.3%; margin-bottom:15px; list-style:none;} .tag_area .privacy_wrap .tag_lst li:nth-child(10), .tag_area .privacy_wrap .tag_lst li:nth-child(11), .tag_area .privacy_wrap .tag_lst li:nth-child(12) {margin-bottom:0;} .tag_area .privacy_wrap .tag_lst li a {font-size:17px; line-height:30px; font-weight:500;} .tag_area .privacy_wrap .tag_lst li a:hover {color:#000; text-decoration:underline;} .tag_sub_title {font-weight:600; display:block; font-size:16px;} .tag_area .tag_con_area {margin:50px 0; padding:0;} .tag_area ul, .tag_area ol, .tag_area li {padding:0; list-style:none;} .tag_area .sub_txt {font-size:15px;} .tag_area .tag_con_area li {list-style:none;} .tag_area .tag_con_area > li {padding-top:40px;} .tag_area .tag_con_area > li:first-child {padding-top:0;} .tag_area .tag_con_area li .tag_title {font-size:20px; font-weight:500;} .tag_area .tag_con_area li .tag_txt {margin:15px 0; font-size:16px;} .tag_area .tag_con_area .type_dot {margin-left:15px;} .tag_area .tag_con_area .type_dot li {position:relative; padding-left:8px; margin-top:5px; font-size:15px;} .tag_area .tag_con_area .type_dot li:before {content:""; display:block; width:3px; height:3px; border-radius:50%; position:absolute; left:0; background:#000; top:8px;} .tag_area .tag_con_area .type_slash, .tag_area .tag_con_area .type_slash li {font-size:15px; margin-top:5px;} .tag_area .tag_con_area li .list_1depth > li {margin-bottom:10px; font-size:15px;} .tag_area .tag_con_area li .list_1depth li span {font-size:16px; vertical-align:middle; font-weight:400;} .tag_area .tag_con_area li .list_1depth li span.num_circle {font-size:17px; font-weight:300; vertical-align:bottom;} .tag_area .tag_con_area .list_2depth {padding:15px 30px;} .tag_area .tag_con_area li .list_2depth > li {margin-bottom:10px;} /* .tag_area .tag_con_area li .list_2depth .type_dot {padding-left:20px;} */ .tag_area .btn_privacy {border:1px solid #000; font-size:14px; padding:0 15px; height:38px; line-height:37px; display:inline-block; font-weight:500;} .tag_area .btn_privacy:after {content:"\f054"; font-family:"fontawesome"; font-size:12px; padding-left:15px;} .tag_area .btn_privacy:hover {background:#1e1e1e; color:#fff;} .tag_area .terms_list {display:flex; justify-content:left; width:90%;} .tag_area .terms_list .lst_box {font-size:16px; padding:20px 0; width:22%;} .tag_area .terms_list .lst_box strong {display:block; font-size:17px; font-weight:500;} .tag_area .terms_list .lst_box .num {color:#666; display:block; margin:5px 0;} .tag_area .terms_list .lst_box .link {color:#0062f4; display:block;} /* 관계법령에 따른 개인정보 보관 자세히 보기 */ .cont_policy .tit_policy {font-size:22px; font-weight:600;} .cont_policy .list_table_area {} .cont_policy .list_table_area table thead tr th, .cont_policy .list_table_area table tbody tr td {text-align:center;} .cont_policy .list_table_area table thead tr th {padding:12px 20px; border-left:1px solid #e4e4e4;} .cont_policy .list_table_area table tbody tr td {padding:12px 20px; border-left:1px solid #e4e4e4; color:#666;} .cont_policy .list_table_area table tbody tr:hover {background:none;} .cont_policy .list_table_area .fst {border-left:0;} .blind {position:absolute; width:0; height:0; line-height:0; text-indent:-9999px; overflow:hidden;} /* push 스케줄 */ .state{padding:0 10px 0 25px;position:relative;} .state:after{display:block;content:'';width:20px;height:20px;line-height:20px;position:absolute;top:0;left:0;font-family:'IcoFont';font-size:16px;text-align:center;text-indent:0;border-radius:10px;} .state.state_ready:after{content:"\eed8";color:#fff;background-color:#c4c4c4;} .state.state_notready:after{content:"\ef9a";color:#fff;background-color:#c4c4c4;} .state.state_inprogress:after{content:"\effa";color:#6bd03f;font-size:20px;animation:rot 2s linear infinite;} .state.state_canceled:after{content:"\effa";color:#c4c4c4;font-size:20px;} .state.state_finished:after{content:"\eed8";color:#fff;background-color:#6bd03f;} .state.state_failed:after{content:"\eee4";color:#fff;background-color:#fb6543;} .state.state_killed:after{content:"\eed8";color:#fff;background-color:#c4c4c4;} @keyframes rot { 100% {-webkit-transform:rotate(360deg); transform:rotate(360deg);} } .push_area > div {display:inline-block; vertical-align:top;} .push_area .content_top {overflow:hidden;} .push_area .content_top .content_title {margin-bottom:15px; float:left; font-size:18px; font-weight:600;} .push_area .content_top .btn_recept {float:right; margin-bottom:5px;} .push_area .sent_wrap {width:40%; margin-right:4%;} .push_area .sent_wrap .sent_area {box-shadow:0 0 20px rgba(0,0,0,0.1); padding:30px; border-radius:8px; background:#fff;} .push_area .sent_wrap textarea.form_control {min-width:auto;} .push_area .sent_wrap .sent_area .form_group:first-child {margin:0;} .push_area .sent_wrap .sent_area .form_group label {font-weight:500;} .push_area .sent_wrap .sent_area .form_group .m_date {width:calc(100% - 124px);} .push_area .reception_wrap {width:55%;} .push_area .reception_wrap .list_table_area {margin-top:0;} /* .push_area .reception_wrap .list_table_area table thead tr {display:table;} .push_area .reception_wrap .list_table_area table thead tr th:nth-child(1), .push_area .reception_wrap .list_table_area table tbody tr td:nth-child(1) {width:50px;} .push_area .reception_wrap .list_table_area table thead tr th:nth-child(2), .push_area .reception_wrap .list_table_area table tbody tr td:nth-child(2) {width:200px;} .push_area .reception_wrap .list_table_area table thead tr th:nth-child(3), .push_area .reception_wrap .list_table_area table tbody tr td:nth-child(3) {width:250px;} .push_area .reception_wrap .list_table_area table thead tr th:nth-child(4), .push_area .reception_wrap .list_table_area table tbody tr td:nth-child(4) {width:270px;} .push_area .reception_wrap .list_table_area table tbody {height:510px; overflow-y:auto; display:block; width:770px;} */ .push_area .reception_wrap .btn_area {float:right; width:100%;} .push_area .form_group, .pop_recept .form_group {margin:15px 0 0;} .push_area .form_group:after, .pop_recept .form_group:after {content:""; display:block; width:100%; height:0; clear:both; float:none;} .push_area .form_group > label, .pop_recept .form_group > label {font-size:16px; width:120px; float:left; text-align:right; padding-right:20px; line-height:30px;} .push_area .form_group .form_control {width:calc(100% - 120px); float:left;} /* 팝업 - 수신자 추가 */ .pop_recept .form_gray {margin:20px 0; text-align:center; background-color:#fff; border-radius:10px; padding:20px 0;} .pop_recept .form_gray .form_group {display:inline-block; margin:0;} .pop_recept .form_gray .search {display:inline-block; margin-left:20px;} .pop_recept .form_gray .form_group label {width:65px; padding:0; text-align:center;} .pop_recept .form_gray .form_group .m_text {width:230px;} .pop_recept .form_gray .m_select {text-align:left; box-shadow:none; position:static; display:inline-block; margin:0;} .pop_recept table.dataTable tbody tr {background:#fff;} .admin_data_table table.dataTable thead th {text-align:center; font-size:16px; border-bottom:1px solid #4f4d56;} .admin_data_table table.dataTable tbody th, .admin_data_table table.dataTable tbody td {padding:11px 10px; text-align:center; font-size:16px; word-break:break-all; border-right:0;} .admin_data_table table.dataTable tbody td {border-bottom:0;} .admin_data_table table ol {padding-left:15px;} .admin_data_table table th {padding:11px 10px; text-align:center; font-size:16px; background-color:#fff; border-top:3px solid #4f4d56; border-bottom:1px solid #4f4d56;} .admin_data_table table td {padding:11px 10px;} .admin_data_table table th:last-child {border-right:0;} .admin_data_table table td:last-child {border-right:0;} .admin_data_table table.dataTable.no-footer {border:0;} /* sort btn */ .admin_data_table.sort_table table thead th {position:relative; padding-right:30px;} .admin_data_table.sort_table table thead th button.sort {display:inline-block; background:none; border:none; outline:none; position:absolute; right:10px; top:50%; transform:translate(0,-50%); margin-top:-4px; width:20px; height:20px; padding:0;} .admin_data_table.sort_table table thead th button.sort:after {width:0; height:0; content:""; display:inline-block; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:6px solid #ccc; border-top:6px solid transparent; } .admin_data_table.sort_table table thead th button.sort.active {margin-top:4px;} .admin_data_table.sort_table table thead th button.sort.active:after { border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid #000; border-bottom:6px solid transparent; } /* 사용자 접속 현황 */ .section_user .card_area.cols3 > li .card_item {height:350px;} .section_user .top_area {text-align:right; margin-bottom:20px;} .section_user .top_area span {vertical-align:middle;} .section_user .card_area {list-style:none; padding:0;} .section_user .card_area .card_row {display:flex;} .section_user .card_area .card_row li {width:20%;} .section_user .card_area li .card_item {background:#fff; border:1px solid #d9d9d9; padding:20px; height:100%; border-radius:8px;} .section_user .card_area .card_item:hover {background:#fff; border:1px solid #d9d9d9;} .section_user .card_area .card_row li .card_item h3.title {font-size:20px; text-align:center;} .section_user .card_area .card_row li .card_item strong {font-size:34px; display:block; text-align:center; margin:5px 0; } .section_user .card_area .card_row li .card_item strong.name_play {display:-webkit-box; width:100%; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word; white-space:break-spaces; text-overflow:ellipsis; overflow:hidden;} .section_user .card_area .card_row li .card_item span {display:block; text-align:right; color:#999; text-align:center;} .section_user .card_area {overflow:hidden;} .section_user .card_area li.item_list {float:left; padding:0 10px; margin:10px 0;} .section_user .card_area li.col1 {width:60%;} .section_user .card_area li.col2 {width:40%;} .section_user .card_area.cols3 > li {width:33.3333%;} .section_user .card_area.cols3 > li.schedule_list .card_item {position:relative;} .section_user .card_area li.item_list .card_top {overflow:hidden; margin-bottom:5px;} .section_user .card_area li.item_list .card_top .card_title {float:left; font-size:18px; font-weight:600;} .section_user .card_area li.item_list .btn_group {float:right;} .section_user .card_area li.item_list .btn_group .m_btn.active {background:#26a1ff; border-color:#26a1ff; color:#fff;} .section_user .card_area li.item_list .btn_group.more {margin-top:4px;} .section_user .card_area li.item_list .btn_group .btnMore {font-weight:300; margin-right:20px;} .section_user .card_area li.item_list .btn_group .btnMore i {font-size:11px;} /* 매뉴얼 팝업 */ .manual_area {height:100%;} .manual_area .m_container {display:flex; height:100%;} /* 좌측영역 */ .manual_area .m_container .lnb_area {width:250px; background:#f4f9ff; height:100%; border-right:1px solid #e5e8ec; transition:0.5s;} .lnb_area .accordion .accordion-item .accordion-header button {font-size:18px; color:#000; font-weight:600; letter-spacing:-2px;} .lnb_area .accordion .accordion-item, .accordion-item:first-of-type .accordion-button, .lnb_area .accordion .accordion-button:focus {border:0; box-shadow:none;} .lnb_area .accordion .accordion-button {padding:5px 25px;} .lnb_area .accordion .accordion-button:before {content:"\f5fd"; font-family:"Font Awesome 6 Free"; font-size:28px; margin-right:15px;} .lnb_area .accordion .accordion-button:not(.collapsed) {background-color:#dfeeff; box-shadow:none;} .lnb_area .accordion .accordion-item ul.accordion-body {padding:0; margin:0 0 5px; background:#f4f9ff;} .lnb_area .accordion .accordion-item ul.accordion-body li {list-style:none; padding:12px 16px; margin:8px; font-size:16px; color:#000; letter-spacing:-2px; cursor:pointer; transition:0.2s; border-radius:4px;} .lnb_area .accordion .accordion-item ul.accordion-body li:before {content:"\f15b"; font-family:"Font Awesome 6 Free"; font-size:22px; font-style:normal; font-weight:normal; margin-right:15px; display:inline-block; vertical-align:middle;} .lnb_area .accordion .accordion-item .accordion-body li.active, .lnb_area .accordion .accordion-item ul.accordion-body li.selected, .lnb_area .accordion .accordion-item .accordion-body li.selected:before, .lnb_area .accordion .accordion-item .accordion-body li:hover, .lnb_area .accordion .accordion-item .accordion-body li:hover:before {color:#3583d5; background:#e3f0ff;} /* 컨텐츠 영역 */ .manual_area .m_container .m_contents {width:calc(100% - 290px); padding:20px; background:#000; position:relative; transition:0.5s;} /* ************************* 좌측메뉴 폴딩 ************************* */ /* 폴딩 버튼 */ .manual_area .m_container .m_contents button.pop_toggle_left_menu {display:block; width:15px; height:60px; padding:0; position:absolute; top:50%; left:0; bottom:0; border:1px solid #e5e8ec; border-left:0; border-radius:0 10px 10px 0; background-color:#fff; z-index:2; transition:0.5s; margin-top:-30px;} .manual_area .m_container .m_contents button.pop_toggle_left_menu:hover {background-color:#f3f8ff;} .manual_area .m_container .m_contents button.pop_toggle_left_menu:focus {outline:none;} .manual_area .m_container .m_contents button.pop_toggle_left_menu:after {display:block; content:"\ea9d"; line-height:60px; text-align:center; color:#bec2c5; font-family:"icofont";} /* 폴딩 되었을 경우 */ .manual_area .m_container.folding .m_contents button.pop_toggle_left_menu:after {content:"\eaa0";} /* 좌측영역 */ .manual_area .m_container.folding .lnb_area {margin-left:-250px;} /* 컨텐츠 영역 */ .manual_area .m_container.folding .m_contents {width:calc(100%);} /* 테이블 내 첨부파일 영역 */ .table_file td {position:relative;} .table_file .insert {display:inline-block; width:auto; margin:0; } .table_file .insert .file_list {display:block; width:100%;} .table_file .insert .file_list .filebox {display:inline-block; margin:10px 10px 0 0; padding:0 8px; position:relative; padding-right:20px;} .table_file .insert .file_list .filebox .delete {position:absolute; rigth:5px; top:50%; transform:translateY(-50%);} .table_file .sub_txt {position:absolute; left:145px; top:13px;} /* 공급 회원 신청 */ .sub_section_inner {text-align:center; margin:100px 0 60px 0;} .sub_section_inner p {font-size:18px; margin:50px 0 0 0;} .sub_section_inner .sub_notice {position:relative; font-size:22px;} /* .sub_section_inner .sub_notice:before {content:""; display:block; width:40px; height:2px; background-color:#0b75df; position:absolute; top:-30px; left:50%; transform:translateX(-50%);} */ .sub_section_inner p.notice_txt {margin:20px 0 60px; color:#000;} .sub_section_inner p strong {color:#f4a100; font-size:18px;} table .td_txt_m {margin:5px 0 0 0; font-size:14px;} table .td_txt {color:#888; position:relative; display:block; margin-top:5px; padding-left:7px; font-size:13px;} table .td_txt:before {content:""; position:absolute; display:block; width:2px; height:2px; border-radius:2px; background-color:#888; left:0; top:7px} .section_join {border:1px solid #e2e2e2; margin-top:-25px; padding:60px 50px 30px 50px; border-radius:0 0 20px 20px;} .section_join .service_check {margin-top:15px;} .join_btn_area {margin-top:40px; text-align:center;} /* 우측 패널 */ .right_panel {position:fixed; z-index:100; right:-2000px !important; left:auto !important; top:110px; min-width:300px; background:#fff; height:calc(100vh - 110px); transition:1s; padding:20px 40px; overflow:auto;} .right_panel.active {right:0 !important; box-shadow:0 15px 30px rgba(0,0,0,0.2);} .right_panel .rp_title {margin-bottom:30px; font-size:26px; font-weight:600;} .right_panel .top_function .info_title {margin-bottom:15px;} /* 이용약관, 개인정보처리방침 */ .m_panel {box-shadow:0 0 20px rgba(0, 0, 0, 0.1); padding:30px; border-radius:10px;} /* Splash 관리 */ .search_item .manage_title {margin:0;} .search_item {} /*********** 예약 관리 ***********/ .reservation_tag_area {margin:40px 0 50px 0;} .reservation_tag_area .tag_lst {margin:0; padding:0;} .reservation_tag_area .tag_lst li {list-style:none; display:inline-block; margin-right:8px;} .reservation_tag_area .tag_lst li:last-child {margin-right:0;} .reservation_tag_area .tag_lst li a {font-size:16px; padding:45px 5px 15px 5px; position:relative; border:1px solid #bbb; border-radius:6px; width:150px; height:85px; text-align:center; display:inline-block;} .reservation_tag_area .tag_lst li a.active {border:1px solid #4da1f8; color:#4da1f8;} .reservation_tag_area .tag_lst li:hover a, .reservation_tag_area .tag_lst li.active a {border:1px solid #4da1f8;} .reservation_tag_area .tag_lst li a:before {font-family:"fontawesome"; font-size:14px; position:absolute; left:50%; transform:translateX(-50%); top:16px;} .reservation_tag_area .tag_lst li:nth-child(1) a:before {content:"\f015";} .reservation_tag_area .tag_lst li:nth-child(2) a:before {content:"\f51a";} .reservation_tag_area .tag_lst li:nth-child(3) a:before {content:"\f15b";} .reservation_tag_area .tag_lst li:nth-child(4) a:before {content:"\f02b";} .reservation_tag_area .tag_lst li:nth-child(5) a:before {content:"\f013";} .reservation_tag_area .tag_lst li:nth-child(6) a:before {content:"\f029";} .reservation_tag_area .tag_lst li:nth-child(7) a:before {content:"\f013";} .reservation_tag_area .tag_lst li:nth-child(8) a:before {content:"\f029";} .result_area {margin-top:50px;} .data_table_area .select_box {display:inline-block; vertical-align:middle;} .reservation_info {margin-bottom:40px;} .reservation_info .info_title {font-size:20px; font-weight:600;} .top_function .info_title {margin-bottom:0;} /* .reservation_info .search_item_wrap {text-align:right;} */ .reservation_info .data_table_area table tr td a {display:inline-block; width:auto; text-decoration:underline; text-underline-position:under; vertical-align:bottom;} .reservation_info .data_table_area table a:not([href]):not([class]), .reservation_info .data_table_area table a:not([href]):not([class]):hover {text-decoration:underline;} .reservation_info .data_table_area table tr td a:hover {color:#26a1ff;} .reservation_info .data_table_area .nm_box {display:inline-block; margin-right:20px;} .reservation_info .data_table_area .nm_box:last-of-type {margin-right:0;} .reservation_info .no_data {border-top:1px solid #000; border-bottom:1px solid #bbb; padding:110px 0 40px 0;} .reservation_info .no_data p {font-size:16px; text-align:center; position:relative;} .reservation_info .no_data p:before {content:""; display:block; width:100px; height:60px; background:url(../images/icon/icon_noData.png) no-repeat center center; position:absolute; left:50%; transform:translateX(-50%); bottom:30px;} .reservation_info .info_box {display:inline-block;} .reservation_info .info_box:nth-child(1) {width:50%; margin-right:4.5%;} .reservation_info .info_box:nth-child(2) {width:45%;} .reservation_info .info_box .room_lst {margin-bottom:0;} .reservation_info .cancel_table_txt {color:#0b75df; font-weight:500;} .textarea_advice {font-weight:300; margin-top:5px; display:block; font-size:13px;} .daterangepicker {z-index:999999;} .daterangepicker.show-calendar .ranges {width:auto;} .daterangepicker .drp-calendar.left {clear:none !important;} .modal-content .form_item .form_unit {line-height:34px; margin-left:5px;} .modal-content .form_item.type_txt {} .modal-content .form_item.type_txt .form_label {width:100px; float:left; line-height:20px; font-size:14px; margin-top:5px; text-align:right; padding-right:15px;} .modal-content .form_item.type_txt .form_control {background:none; border:0;} .modal-content .form_item.type_txt .form_control, .modal-content .form_item.type_txt .form-control, .modal-content .form_item.type_txt .text_info, .modal-content .form_item.type_txt .input-group, .modal-content .form_item.type_txt .form_group {width:calc(100% - 100px); float:left;} .form_area.label_150 .form_item.type_txt .form_label{width:150px;} .form_area.label_150 .form_item.type_txt .form_control, .form_area.label_150 .form_item.type_txt .form-control, .form_area.label_150 .form_item.type_txt span.text_info, .form_area.label_150 .form_item.type_txt .input-group, .form_area.label_150 .form_item.type_txt .form_group {width:calc(100% - 150px);} /* 시설 검색 팝업 */ .pop_findfacility .select_wrap .select_box {display:inline-block; vertical-align:middle;} .form_area .type_div > .form_item {width:49%; display:inline-block;} .pop_findfacility .join_btn_area {margin-bottom:30px;} .pop_findfacility .btn_area {margin-top:10px;} /* tui-grid */ .tui-grid-container {font-family:'Pretendard', '프리텐다드', "맑은고딕", "Malgun Gothic", 'Apple SD Gothic Neo', "돋움", dotum, Arial, sans-serif !important; } .tui-grid-cell-header {background-color:#f8f8f8 !important; border-color:#bbb;} .tui-grid-cell {border-color:#bbb !important;} .tui-grid-cell td {font-size:13px;} .tui-grid-row-hover .tui-grid-cell {background-color:#f2f8ff !important;} .tui-grid-body-area {background:#fff !important;} .tui-pagination .tui-is-selected, .tui-pagination strong {background:#3c3c3c;} .tui-grid-cell-has-input a, .form_item a, .tui-grid-container .viewDetailpanel {text-decoration:underline; text-underline-position:under;} .data_table_area .table_form_wrap {margin-bottom:5px;} .data_table_area .table_form_wrap.type_block {display:block;} .data_table_area .table_form_wrap:last-of-type {margin-bottom:0px;} .data_table_area .table_form_wrap .form_item {display:inline-block; margin-right:20px;} .data_table_area .table_form_wrap .form_item:last-of-type {margin-right:0;} .data_table_area .table_form_wrap .form_item .form_item_bottom {margin-left:88px; margin-top:5px;} .data_table_area .table_form_wrap .form_item > span {margin-right:10px; display:inline-block; width:auto;} .data_table_area .table_form_wrap.type_block .form_item > span {width:75px;} .data_table_area .table_form_wrap .form_radio_wrap {display:inline-block; margin:0 15px;} .data_table_area .image_box { display:inline-block; margin-right:20px;} .data_table_area .image_box:last-of-type {margin-right:0;} .data_table_area .image_box span {vertical-align:middle; display:inline-block; font-weight:400; margin-right:10px;} .data_table_area .image_box span strong {display:block; font-weight:400;} .data_table_area .image_box .img_info {display:inline-block; vertical-align:middle;} .data_table_area .image_box .img_info .bg_img {width:60px; height:60px; border:1px solid #000; position:relative; margin:0 auto 5px; display:flex; align-items:center; justify-content:center;} .data_table_area .image_box .img_info .bg_img img {} .data_table_area .image_box .img_info .bg_img .img_cancel {position:absolute; right:3px; top:4px; padding:0;} .data_table_area .image_box .img_info .bg_img .img_cancel:before {content:""; background:url(../images/icon/input_cancel_black.png) no-repeat center center; width:9px; height:9px; display:block;} .data_table_area .image_box.section_lead {position:relative; padding-right:25px;} .data_table_area .image_box.section_lead:after {content:""; width:1px; height:100%; background:#bbb; position:absolute; top:50%; transform:translateY(-50%); right:0;} .data_table_area .image_box.section_allimg .image_box {margin-left:20px; margin-right:0;} .data_table_area .image_box.section_allimg .m_text {min-height:25px; text-align:center;} .data_table_area .table_checkall {display:block; margin-bottom:5px;} .tui-grid-content-area .btn_link {text-decoration:underline; text-underline-position:under; transition:0.2s;} .tui-grid-content-area .btn_link:hover {color:#4da1f8;} .tui-grid-cell-content input[type=password], .tui-grid-cell-content input[type=text] {border:1px solid #bbb; border-radius:6px; min-height:30px;} .table_daysetting .tui-grid-cell-content input[type=text] {width:70%; margin-right:4px;} /* 예약정보 관리 */ .select_radio {display:inline-block;} .select_radio .m_radio {margin-left:5px;} .select_radio .m_radio > input[type=radio] + label {width:45px; height:24px; display:inline-block; text-align:center; padding:0; border:1px solid #222; color:#666; background:#fff; line-height:23px; font-size:13px; font-weight:500;} .select_radio .m_radio > input[type=radio] + label:before, .select_radio .m_radio > input[type=radio] + label:after {display:none;} .select_radio .m_radio > input[type=radio]:checked + label {background:#222; color:#fff;} .modal-content .data_table_area table tr th, .modal-content .data_table_area table tr td, .modal-content .list_table_area thead tr th, .modal-content .list_table_area tbody tr td {padding:10px 6px;} .data_table_area .inner_list_area table tr th, .data_table_area .inner_list_area table tr td {padding:5px 10px; font-weight:400;} .modal-content .data_table_area {margin-top:10px;} .link_txt {text-decoration:underline; text-underline-position:under;} .link_txt:hover {color:#26a1ff; text-decoration:underline; } /* fullcalendar */ #dashSchedule {position:relative;} #dashSchedule .schedule_info {padding:0; margin:0; list-style:none; text-align:right;} #dashSchedule .schedule_info li {display:inline-block; text-align:right; padding-left:14px; position:relative; margin-right:8px;} #dashSchedule .schedule_info li:before {content:""; display:block; width:10px; height:10px; position:absolute; left:0; top:50%; transform:translateY(-50%);} #dashSchedule .schedule_info li.schedule_stock:before {background:#40a1f8; opacity:0.3;} #dashSchedule .schedule_info li.schedule_usen:before {background:#bbb;} #dashSchedule .schedule_info li.schedule_today:before {background:#3653bd;} #dashSchedule .schedule_info_num {position:absolute; top:30px;} #dashScheduleCalendar {margin-top:5px; height:570px;} #dashScheduleCalendar .fc-toolbar.fc-header-toolbar{margin-bottom:10px;} #dashScheduleCalendar .fc-toolbar h2{line-height:20px;font-size:17px;} #dashScheduleCalendar .fc-toolbar .fc-right{float:inherit;} #dashScheduleCalendar .fc-toolbar .fc-button-group button{padding:0;background-color:transparent;border-color:transparent;box-shadow:none;} #dashScheduleCalendar .fc-toolbar .fc-button-group button .fc-icon{height:23px;line-height:20px;margin:0;vertical-align:inherit;top:0;} #dashScheduleCalendar .fc-view-container{border-top:1px solid #c5c8d0;} #dashScheduleCalendar.fc-ltr .fc-basic-view .fc-day-top .fc-day-number{float:inherit;} #dashScheduleCalendar .fc-basic-view .fc-body .fc-row{min-height:inherit;height:initial !important;} #dashScheduleCalendar .fc-row .fc-content-skeleton{margin:0;min-height:35px;} #dashScheduleCalendar.fc td, #dashScheduleCalendar.fc th{text-align:center;border-width:0;} #dashScheduleCalendar.fc th{padding:1px 0; font-weight:normal; font-size:14px; border-top:1px solid #676767; border-bottom:1px solid #676767;} #dashScheduleCalendar.fc .fc-daygrid-day-frame:hover {background:#e7f7ff;} #dashScheduleCalendar.fc .fc-day-today .fc-daygrid-day-frame:hover .fc-daygrid-day-number {color:#000;} #dashScheduleCalendar .fc-row table {border-color:transparent;} #dashScheduleCalendar .fc .fc-scrollgrid table {border-bottom-style:hidden;} #dashScheduleCalendar .fc-day-grid-event{width:3px;height:3px;padding:0;margin:4px auto 6px;border-radius:3px;border-color:transparent;text-indent:-9999px;} #dashScheduleCalendar.fc-unthemed td.fc-today{position:relative;color:#000;background-color:transparent;} #dashScheduleCalendar.fc-unthemed td.fc-today:before{display:block;content:'';width:100%;height:100%; position:absolute; background-color:#f3f8ff; z-index:-1;} #dashScheduleCalendar .fc-scroller{height:inherit !important;} #dashScheduleCalendar .fc-highlight {background:#3653bd; opacity:1; border-radius:5px;} #dashScheduleCalendar .fc-day-top:hover {background:#f3f8ff; opacity:1;} #dashScheduleCalendar.fc .fc-toolbar {justify-content:center;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk {margin-left:0; margin-right:5px;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk:nth-child(2) {display:none;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk:last-child {margin-right:0; position:relative;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-button-group {float:none; position:absolute; left:-45px; display:block; bottom:-25px;} #dashScheduleCalendar.fc .fc-toolbar-title {font-size:24px; font-weight:500; position:relative;} /* #dashScheduleCalendar.fc .fc-toolbar-title:before {content:""; display:inline-block; width:40px; height:20px; position:absolute; left:0; top:0; background:url(../images/al/calendar_icon_2.png) no-repeat center center;} */ #dashScheduleCalendar.fc .fc-toolbar-title + .fc--button.fc-button.fc-button-primary {display:none;} #dashScheduleCalendar.fc table {font-size:13px;} #dashScheduleCalendar.fc table .fc-daygrid-day-top {font-size:14px; display:block; padding-left:3px; font-weight:400; text-align:left;} #dashScheduleCalendar.fc table thead {border-bottom-style:hidden;} #dashScheduleCalendar.fc table tbody tr {border-bottom:1px solid #e2e3e7;} #dashScheduleCalendar.fc table tbody tr .fc-day {max-height:100px !important;} #dashScheduleCalendar.fc .fc-toolbar.fc-header-toolbar {display:block; margin:0 auto 10px;} #dashScheduleCalendar.fc .fc-daygrid-day-number {font-size:14px;} #dashScheduleCalendar.fc .fc-daygrid-day.fc-day-today {background-color:#3653bd; border-radius:5px;} #dashScheduleCalendar.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number, #dashScheduleCalendar.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-events .fc-daygrid-event-harness .fc-event-time {color:#fff;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-button {background:transparent; border:none; transition:0.2s; color:#adadad; padding:0;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-button:hover {color:#000;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-button:focus, #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-button:active {outline:none; box-shadow:none;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-next-button.fc-button {position:absolute; bottom:-24px; right:-41px;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-today-button {width:70px; height:20px; line-height:19px; border:none; background:#4f4e56; color:#fff; transition:0.2s; padding:0 12px; border-radius:10px; position:absolute; top:25px; right:0;} #dashScheduleCalendar.fc .fc-toolbar .fc-toolbar-chunk .fc-today-button:hover {background:#003880; color:#fff;} #dashScheduleCalendar.fc-direction-ltr .fc-toolbar>*>:not(:first-child) {margin-left:0;} #dashScheduleCalendar.fc .fc-daygrid-day-frame {padding-bottom:5px; padding-top:5px;} #dashScheduleCalendar.fc .fc-daygrid-day-bottom {position:absolute; top:64px; left:5px; font-size:13px; margin:0; z-index:10;} #dashScheduleCalendar.fc .fc-daygrid-more-link {padding:1px;} #dashScheduleCalendar .fc-direction-ltr .fc-daygrid-more-link {float:none;} .fc-direction-ltr .fc-button-group>.fc-button:not(:first-child) {display:none;} .fc-direction-ltr .fc-daygrid-event.fc-event-end, .fc-direction-rtl .fc-daygrid-event.fc-event-start {background:transparent; border:0;} .fc-daygrid-dot-event .fc-event-title {color:#000; font-size:14px; font-weight:500;} #dashScheduleCalendar.fc .fc-daygrid-day-events .fc-daygrid-event-harness {position:absolute; top:0;} #dashScheduleCalendar.fc .fc-daygrid-day-events .fc-daygrid-event-harness:nth-of-type(2) {margin-top:15px !important;} #dashScheduleCalendar.fc .fc-daygrid-day-events .fc-daygrid-event-harness:nth-of-type(3) {margin-top:30px !important;} #dashScheduleCalendar.fc .fc-daygrid-day-events .fc-daygrid-event-harness:nth-of-type(4) {margin-top:45px !important; visibility:visible !important;} /* #dashScheduleCalendar.fc .fc-daygrid-event-harness-abs {visibility:visible !important; display:inline-block;} */ #dashScheduleCalendar .fc-event {border:0;} #dashScheduleCalendar .fc-bg-event {background:#40a1f8;} /* .fc-daygrid-event-dot {position:relative; left:-6px; bottom:6px; margin:0;} */ .fc .fc-popover .fc-daygrid-event-harness .fc-daygrid-event-dot {position:static;} .fc .fc-popover .fc-daygrid-event-harness .fc-event .fc-event-time, .fc .fc-popover .fc-daygrid-event-harness .fc-event .fc-event-title {display:inline-block;} .fc-daygrid-event-dot, .fc-direction-ltr .fc-daygrid-event .fc-event-time {display:none;} #dashScheduleCalendar.fc th.fc-day-sun a {color:#da2e00;} .fc-theme-standard .fc-scrollgrid {border:0;} #dashScheduleCalendar.fc .fc-daygrid-body-balanced .fc-daygrid-day-events {left:3px; right:auto; top:24px;} #dashScheduleCalendar.fc .fc-popover-body .fc-daygrid-event-harness {position:relative; margin:0;} /****** 설문지 상세 정의 ******/ .section_interview_detail .big_body {padding-top:0;} .section_search_menu {background:#eee; width:265px; height:calc(100vh - 110px); position:fixed;} .section_search_menu .menu_inner {padding:10px;} /* 검색 폼 */ .type_search {position:relative; display:inline-block; max-width:300px; width:100%; line-height:30px;} .type_search input.form_control {padding-right:30px; border:0; border-bottom:1px solid #828282; font-size:15px; width:100%; height:30px;} .type_search input.form_control:disabled {background:#f0f0f0; caret-color:transparent;} .type_search input.form_control:disabled + .icon_search:before {color:#8e908e;} .type_search input.form_contro::placeholder {font-size:15px; color:#c4c4c4;} .type_search .form_control:not(:disabled,:read-only):hover, .type_search .form_control:not(:disabled,:read-only):focus {border:none; border-bottom:1px solid #11c4fe;} .type_search .icon_search {position:absolute; right:0; bottom:0; width:30px; height:30px; display:inline-block; text-align:center; vertical-align:middle; padding:0; border:0; background:none;} .type_search .icon_search:before {content:"\f002"; font-family:"fontawesome"; font-size:20px;} .section_search_menu .type_search input.form_control {background:transparent; border-radius:0;} .section_search_menu .btn_question {width:100%; margin-top:10px;} .section_search_menu .nav-list {padding:0; margin:0; margin-top:20px;} .section_search_menu .nav-list .nav-item {list-style:none;} .section_search_menu .nav-list .nav-item > a {font-size:14px; padding:9px 10px; display:block; font-weight:400; color:#222;} .section_search_menu .nav-list .nav-item > a:hover {font-weight:600;} .section_search_menu .nav-list .nav-item .child_menu_wrap li a {padding-left:20px; font-weight:400; color:#222; border-radius:4px;} .section_search_menu .nav-list .nav-item .child_menu_wrap li a:hover {background:#ddd; font-weight:500;} .section_search_menu .nav-list .nav-item .child_menu_wrap {display:none; padding:0;} .section_search_menu .nav-list .nav-item.active .child_menu_wrap {display:block;} .section_search_menu span.fa {float:right; text-align:center; margin-top:5px; font-size:12px; min-width:inherit; color:#999; transform:rotate(-90deg);} .section_search_menu .nav-list .nav-item.active a span.fa {transform:rotate(360deg); margin-right:0; color:#333;} .section_right_result {padding-left:265px;} .section_survey_title {background:#eee; margin:0 5px; display:flex; align-items:center; justify-content:space-between; padding:15px 45px;} .section_survey_title h3 {font-size:26px;} .section_survey_title .btn_area {margin-top:0;} .section_question_list {margin-top:30px; padding:0 45px;} .section_question_list .title_wrap {background:#eee; padding:10px 20px;} .section_question_list .title_wrap ul {margin:0; padding:0; list-style:none;} .section_question_list .title_wrap ul li {display:inline-block; font-size:15px;} .survey_list {padding:0; margin-bottom:0; list-style:none;} .section_write.type_mapping .survey_list {margin-left:0;} .survey_list .ui-state-default {float:none; background:#fff; color:#000; width:100%; margin:0; margin-top:10px; position:relative; height:auto; padding:10px 20px;} .survey_list li .list_txt {position:relative;} .survey_list li .list_txt > span {display:inline-block; text-align:left;} /* .section_question_list .survey_list li .list_txt .list_area {width:35%;} .section_question_list .survey_list li .list_txt .list_title {width:42%;} .section_question_list .survey_list li .list_txt .list_type {width:22%;} */ .survey_list li .list_txt .btn_delete {position:absolute; right:-15px; top:50%; transform:translateY(-50%);} .btn_delete:before {content:"\f00d"; font-family:"fontawesome";} .survey_list li span.ui-icon {position:absolute; left:-20px; top:50%; transform:translateY(-50%); background-image:none; text-indent:0; font-size:13px; margin-top:0;} .section_question_list .info_box {background:#f3f3f3; padding:12px 100px; font-size:15px; margin-top:10px;} /****** 설문 작성 ******/ .section_survey_write .big_body {height:calc(100vh - 110px);} .section_write {padding-right:375px;} .section_write .write_form {margin-bottom:25px;} .section_write .write_form .form_title {margin-bottom:5px; display:block; font-size:16px;} .section_write .write_form .select_box {display:inline-block;} .section_write .write_form .select_box + .select_box {margin-left:5px;} .section_write .write_form select.form_control{width:auto;} .section_write .write_form .m_switch {vertical-align:middle;} .section_write .write_form .main_question {width:600px;} .section_write .write_form .btn_add {display:block; margin-top:10px;} .write_form .survey_list {margin-left:25px;} .write_form .survey_list .ui-state-default {border:0; padding:0; text-align:left;} .section_write .write_form .input_add {display:inline-block; position:relative; margin-left:10px;} .section_write .write_form .input_add .btn_delete {display:none; position:absolute; right:-22px; top:50%; transform:translateY(-50%);} .section_write .write_form .input_add .input_btn:focus + .btn_delete {display:block; } .section_write .write_form .input_add .m_text, .section_write .write_form .input_add .ch_btn {width:120px; text-align:center;} .section_write .write_form .question_sub_txt {margin-top:10px; display:none;} .section_write .write_form .question_sub_txt.active {display:block;} .section_write .write_form .question_sub_txt .m_text {width:600px;} .survey_tab {margin-bottom:20px;} .survey_tab .nav-link {display:inline-block; margin-right:5px;} .survey_tab .nav-link.active {border:1px solid #214ca4; border-radius:3px;} .survey_tab .nav-link:before {content:""; width:25px; height:25px; display:block;} .survey_tab .nav-link:nth-child(1):before {background:url(../images/icon/icon_thum1_1.png);} .survey_tab .nav-link:nth-child(2):before {background:url(../images/icon/icon_thum2_1.png);} .survey_tab .nav-link:nth-child(3):before {background:url(../images/icon/icon_thum3_1.png);} .mobile_preview {width:375px; background:#fff; border:1px solid #f5f5f5; box-shadow:-1px 0 6px 0 rgba(0, 0, 0, 0.1); height:calc(100vh - 110px); position:absolute; right:0; top:0;} .ms_area {padding:30px 20px 20px; position:relative;} .ms_area.full_style {min-height:calc(100vh - 50px);} .ms_area h2 {font-size:24px; font-weight:700; line-height:31px; color:#434343; margin-bottom:30px; padding-right:50px;} .ms_area h2 strong {font-size:36px; font-weight:700; line-height:47px; display:block; margin:0 0 3px; width:100%;} .ms_area h2 small {font-size:16px; font-weight:500; line-height:21px; color:#7c7c7c; display:block; margin-top:10px;} /* 라디오 문진 */ .n_radio {display:block; position:relative; margin-bottom:10px;} .n_radio > input[type=radio] {width:0; height:0; min-height:0; margin:0; position:absolute;} .n_radio > input[type=radio] + label {display:flex; flex-wrap:wrap; align-content:center; padding:19px 50px 18px 20px; margin:0; position:relative; font-weight:500; cursor:pointer; font-size:16px; color:#555; line-height:21px; border:1px solid #e5e5ec; border-radius:14px; height:100%; background:#fff;} .n_radio > input[type=radio] + label:before, .n_radio > input[type=radio] + label:after {display:block; content:''; position:absolute; top:50%; right:20px; background-color:#fff; transform:translate(0,-50%); border-radius:10px;} .n_radio > input[type=radio] + label:before {width:20px; height:20px; border:2px solid #d9d9d9;} .n_radio > input[type=radio] + label:after {width:10px; height:10px; background:#8331a4; opacity:0; right:25px;} .n_radio > input[type=radio]:checked + label {border-color:#8331a4;} .n_radio > input[type=radio]:checked + label:before {border-color:#8331a4;} .n_radio > input[type=radio]:checked + label:after {opacity:1;} .n_radio > input[type=radio]:disabled + label {color:#a8a8a8;} .mobile_preview .btn_area {display:flex; flex-wrap:no-wrap; text-align:center; margin:40px auto 0; padding-bottom:20px; width:calc(100% - 40px);} .btn_xxl {width:100%; height:52px; line-height:52px; padding:0 30px; border-radius:14px; font-size:16px; font-weight:700;} .mobile_preview .btn_active {color:#fff; border-color:#8331a4; background-color:#8331a4;} .mobile_preview .btn_active:hover {border-color:#8331a4; background-color:#8331a4;} .mobile_preview .btn_active:active {border-color:#6c208b; background-color:#6c208b;} .write_form .type_img_wrap {display:inline-block; vertical-align:top;} .write_form .file_upload {margin-top:10px;} .write_form .dropzone {border:0; padding:0; min-height:auto;} .write_form .dropzone .dz-message {margin:0; display:block; padding:0; border:1px dashed #bebebe; min-height:180px; position:relative; background-color:#fff; width:400px;} .write_form .dropzone .dz-message:hover {border-color:#263ba4; background-color:#f5f9ff;} .write_form .dropzone.dz-clickable .dz-message, .mg_popup .dropzone.dz-clickable .dz-message * {color:#7a8ec2; font-size:12px; font-weight:500;} .write_form .dropzone.dz-clickable:hover .dz-message, .mg_popup .dropzone.dz-clickable:hover .dz-message * {color:#263ba4;} .write_form .dropzone .dz-message > span {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); text-align:center; width:100%;} .write_form .dropzone .dz-message span {background:url(../images/icon/upload.png) no-repeat center top; padding:70px 0 0 0; transition:0.2s;} .write_form .dropzone:hover .dz-message span {background:url(../images/icon/upload_hover.png) no-repeat center top;} .write_form .dropzone.dz-started .dz-message {min-height:140px;} .write_form .dropzone .dz-preview {border:1px solid #263ba4; margin:20px 0 0 0; width:100%; min-height:60px; position:relative;} .write_form .dropzone .dz-preview .dz-image {display:none;} .write_form .dropzone .dz-preview .dz-details {opacity:1; text-align:left; padding:10px; display:flex; flex-direction:column;} .write_form .dropzone .dz-preview.dz-error .dz-error-message {display:none;} .write_form .dropzone .dz-preview .dz-details .dz-filename {font-size:16px; color:#000; font-weight:600; order:1; width:90%; display:block;} .dropzone .dz-preview .dz-details .dz-filename:hover span {display:block; width:100%; overflow:hidden; border:0;} .write_form .dropzone .dz-preview .dz-details .dz-size {font-size:14px; color:#888; font-weight:400; margin:0; order:2;} .write_form .dropzone .dz-preview .dz-details .dz-size strong {font-weight:400;} .write_form .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {display:none;} .write_form .dropzone .dz-preview .dz-remove {position:absolute; right:15px; top:50%; transform:translateY(-50%); z-index:20;} .write_form .dropzone .dz-preview .dz-remove i {cursor:pointer;} .write_form .dropzone .dz-preview .dz-remove i:before {content:"\eebb"; font-family:"icofont"; font-size:16px; color:#000;} .write_form .dropzone .dz-preview .dz-remove:hover i:before {color:#ec2222;} .write_form .dropzone .dz-preview.dz-complete .dz-progress {display:none;} .section_write .write_form.type_img .input_add {position:absolute; left:400px; top:50%; transform:translateY(-50%);} .section_write .write_form .input_btn {border:1px solid #222; color:#666; font-weight:600;} .section_write.type_mapping .btn_mapping {display:block; margin-top:10px;} .section_write.type_mapping .survey_list li {margin-bottom:10px;} .section_write.type_mapping .survey_list li:last-child {margin-bottom:0;} .section_write.type_mapping .write_form.type_img {} .section_write .write_form.type_img .survey_list.type_small .input_add, .section_write .write_form.type_img .survey_list.type_middle .input_add {position:static; display:block; transform:translate(0); margin-top:10px; margin-left:0; width:100%; text-align:center;} .section_write .write_form.type_img .survey_list.type_small .input_add .btn_delete, .section_write .write_form.type_img .survey_list.type_middle .input_add .btn_delete {right:calc(50% - 85px);} .section_write.type_mapping .write_form.type_img .survey_list {margin-left:25px;} .section_write.type_mapping .write_form.type_img .type_img_wrap {position:relative;} .section_write.type_mapping .write_form.type_img .type_img_wrap .btn_liDel {position:absolute; right:10px; top:20px;} .section_write .write_form.type_img .survey_list.type_small li span.ui-icon, .section_write .write_form.type_img .survey_list.type_middle li span.ui-icon {top:calc(50% - 20px);} .section_write .write_form.type_img .survey_list.type_small {display:flex; margin-left:20px;} .section_write .write_form.type_img .survey_list.type_small li {display:inline-block; width:31%; margin-right:3.5%;} .section_write .write_form.type_img .survey_list.type_small li:last-child {margin-right:0;} .section_write .write_form.type_img .survey_list.type_small li .type_img_wrap, .section_write .write_form.type_img .survey_list.type_small li .type_img_wrap .dropzone .dz-message {width:100%;} .section_write .write_form.type_img .survey_list.type_middle {display:block;} .section_write .write_form.type_img .survey_list.type_middle li {display:inline-block; width:47.5%; } .section_write .write_form.type_img .survey_list.type_middle li:nth-child(odd) {margin-right:3.5%} .view_thumnail {position:relative; min-height:180px;} .view_thumnail input[type="file"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); border:0;} .view_thumnail .upload_photo_label {display:block; width:100%; height:100%; background-size:contain; text-indent:-9999px; border:1px dashed #bebebe; position:absolute; left:0; top:0; z-index:1; cursor:pointer;} .view_thumnail .imgUpladPreview {width:100%; height:100%; pointer-events:none; position:absolute; z-index:2; left:0; top:0; overflow:hidden;} .view_thumnail .imgUpladPreview img {position: absolute; top:0; left:0; transform:translate(50, 50); width:100%; height:100%; object-fit:cover; margin:auto;} .view_thumnail span {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); text-align:center; width:100%; background:url(../images/icon/upload.png) no-repeat center top; padding:70px 0 0 0; transition:0.2s; color:#7a8ec2; font-size:12px; font-weight:500;} .view_thumnail:hover span {background:url(../images/icon/upload_hover.png) no-repeat center top;} .pop_interview_type .list_table_area {} .pop_interview_type .list_table_area table th, .pop_interview_type .list_table_area table td {text-align:center; padding:20px 5px;} .pop_question_preview .mobile_preview {position:relative; height:620px;} .pop_question_preview .mobile_preview .ms_area {height:calc(100% - 75px);} .pop_question_preview .mobile_preview .form_check_radio {height:calc(100% - 140px); overflow-y:auto;} .pop_question_preview .mobile_preview .btn_area {position:absolute; bottom:0; width:100%;} .pop_question_preview .mobile_preview .btn_area button {width:calc(100% - 40px); margin:auto;} /******* 공급사 회원가입 *******/ .supply_info_table {margin-bottom:10px;} .section_manage_join {} .section_manage_join .manage_title span {font-size:14px; font-weight:400; margin-left:20px;} .section_manage_join .mail_key {margin-top:5px; display:none;} .section_manage_join .sub_section_inner {margin-top:0; margin-bottom:0;} .section_manage_join .manage_join_box {/* background:#f5f5f5; */ padding:70px 0;} .section_manage_join .join_info_list {list-style:none; width:50%; margin:30px auto 0; padding:0;} .section_manage_join .join_info_list li {font-size:16px; margin-top:5px;} .section_manage_join .manage_join_box .join_step_list {list-style:none; margin:0; padding:0;} .section_manage_join .manage_join_box .join_step_list li {display:inline-block; font-size:16px; position:relative; padding-right:25px; margin-right:25px;} .section_manage_join .manage_join_box .join_step_list li i {margin-right:5px;} .section_manage_join .manage_join_box .join_step_list li:after {content:"\f101"; font-family:fontawesome; color:#000; font-size:16px; position:absolute; right:-10px; top:50%; transform:translateY(-50%);} .section_manage_join .manage_join_box .join_step_list li:last-child:after {display:none;} .switch_same_area {margin:30px 0 5px 130px;} .use_check_wrap {margin-top:20px; margin-left:120px;} .use_check_wrap p {font-size:18px; font-weight:500;} .use_check_wrap .check_wrap {list-style:none; padding:0; margin:0;} .use_check_wrap .check_wrap li {display:flex; justify-content:space-between; align-content:center; margin-bottom:5px;} .use_check_wrap .check_wrap li .m_btn {font-size:14px; height:28px; line-height:26px;} .check_all_wrap {display:flex; flex-wrap:wrap; justify-content:start; gap:10px;} .check_all_wrap .m_check, .check_all_wrap .m_radio {margin-left:0;} .reward_detail_tooltip {border:1px solid #bbb; padding:10px; background:#fff; margin-left:10px; position:absolute; display:none; margin-top:-10px; text-align:left; font-size:14px;} .reward_detail_tooltip.show {display:inline-block;} span.list_title_txt {font-size:15px; padding-left:10px; position:relative; margin-top:15px; display:block;} span.list_title_txt:before {content:""; display:block; width:4px; height:4px; border-radius:50%; position:absolute; left:0; top:50%; transform:translateY(-50%); background:#000;} .reservation_info table .list_file {position:relative; padding-left:15px; display:block !important; margin-bottom:5px;} .reservation_info table .list_file:before {content:"\f15b"; font-family:"Font Awesome 6 Free"; position:absolute; left:0; top:50%; transform:translateY(-50%); font-weight:300;} .reservation_info table .list_file:last-of-type {margin-bottom:0;} /* 팝업 - 해지 사유 선택 */ .pop_radio_wrap .m_radio {display:block; margin-bottom:15px;} .pop_radio_wrap .input_etc .m_radio {margin-bottom:0;} .pop_radio_wrap .input_etc textarea {margin-left:25px; margin-top:5px; width:calc(100% - 25px);} .pop_radio_wrap .m_radio + .m_radio {margin-left:0;} /* 홈 배너 관리 */ .section_banner .sortable {border:none;} .form_area .form_item.form_title {margin-bottom:15px;} .form_area .form_item.form_title label {font-size:20px; font-weight:600; } /* 팝업 - 매뉴얼 업로드 */ .pop_manual_upload .dropzone {border:0; padding:0; width:calc(100% - 100px); min-height:auto; float:left;} .pop_manual_upload .dropzone .dz-message {margin:0; display:block; padding:0; border:1px dashed #d9d9d9; min-height:220px; position:relative; border-radius:4px; transition:0.2s; background:#fff; cursor:pointer;} .pop_manual_upload .dropzone .dz-message:hover {border-color:#007aff; background-color:#eef6ff;} .pop_manual_upload .dropzone.dz-clickable .dz-message, .pop_manual_upload .dropzone.dz-clickable .dz-message * {color:#888888; font-size:14px; transition:0.2s; font-weight:500;} .pop_manual_upload .dropzone.dz-clickable:hover .dz-message, .pop_manual_upload .dropzone.dz-clickable .dz-message:hover * {color:#000;} .pop_manual_upload .dropzone .dz-message > span {position:absolute; left:50%; top:55px; transform:translateX(-50%); text-align:center; width:100%;} .pop_manual_upload .dropzone .dz-message .msg.msg1 {background:url(../images/icon/upload.png) no-repeat center top; padding:75px 0 0 0; transition:0.2s;} .pop_manual_upload .dropzone .dz-message:hover .msg.msg1 {background:url(../images/icon/upload_hover.png) no-repeat center top;} .pop_manual_upload .dropzone.dz-started .dz-message {min-height:139px;} .pop_manual_upload .dropzone.dz-started .dz-message > span {top:25px;} .pop_manual_upload .dropzone .dz-preview {border:1px solid #007aff; margin:20px 0 0 0; border-radius:4px; width:100%; min-height:60px; position:relative; background:#fff;} .pop_manual_upload .dropzone .dz-preview .dz-image {display:none;} .pop_manual_upload .dropzone .dz-preview .dz-details {opacity:1; text-align:left; padding:10px; display:flex; flex-direction:column;} .pop_manual_upload .dropzone .dz-preview.dz-error .dz-error-message {display:none;} .pop_manual_upload .dropzone .dz-preview .dz-details .dz-filename {font-size:16px; color:#000; font-weight:600; order:1; width:90%; display:block;} .pop_manual_upload .dropzone .dz-preview .dz-details .dz-filename:hover span {display:block; width:100%; overflow:hidden; border:0;} .pop_manual_upload .dropzone .dz-preview .dz-details .dz-size {font-size:14px; color:#888; font-weight:400; margin:0; order:2;} .pop_manual_upload .dropzone .dz-preview .dz-details .dz-size strong {font-weight:400;} .pop_manual_upload .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {display:none;} .pop_manual_upload .dropzone .dz-preview .dz-remove {position:absolute; right:20px; top:50%; transform:translateY(-50%); z-index:20; text-indent:-9999px; background:url(../images/icon/icon_dropdown_delete.png) no-repeat center; width:12px; height:15px; transition:0.2s;} .pop_manual_upload .dropzone .dz-preview .dz-remove:hover {background:url(../images/icon/icon_dropdown_delete_hover.png) no-repeat center;} .pop_manual_upload .dropzone .dz-preview.dz-complete .dz-progress {display:none;} /* 앱버전 관리 */ .app_con_txt {line-height:1.7em;} /* 메인 */ .section_main {} .section_main .top_area .date_wrap {} .section_main .top_area .date_wrap > div {display:inline-block; vertical-align:middle; font-size:18px;} .section_main .top_area .date_wrap .date {width:49%;} .section_main .top_area .date_wrap .datepicker_wrap {width:50%; text-align:right;} .section_main .top_area .date_wrap .datepicker_wrap span {vertical-align:middle; margin-right:5px;} .section_main .top_area .card_area {overflow:visible;} .section_main .top_area .card_area li .card_item {height:100%; transition:0.2s;} .section_main .top_area .card_area li a:hover {color:#000;} .section_main .top_area .card_area li a:hover .card_item {border-color:#26a1ff;} .section_main .card_area .card_title {font-size:18px; font-weight:600; margin-bottom:0;} .section_main .top_area .card_item h3.title .tooltip_wrap {display:inline-block; position:relative; padding-left:6px;} .section_main .top_area .card_item h3.title .tooltip_btn {display:inline-block; color:#000;} .section_main .top_area .card_item h3.title .tooltip_btn i {font-size:18px;} .section_main .top_area .card_item h3.title .bottom {text-align:left; top:-64px; left:-50px; width:auto; min-width:300px; transform:none; padding:13px; color:#fff; background-color:#4f4d56; font-weight:400; font-size:14px; border-radius:8px; position:absolute; z-index:800; box-sizing:border-box; word-break:keep-all; box-shadow:0 1px 8px rgba(0,0,0,0.5); visibility:hidden; opacity:0; transition:0.2s;} .section_main .top_area .card_item h3.title .bottom i.arrow::after {content:''; position:absolute; width:12px; height:12px; left:65px; transform:translate(-50%,50%) rotate(45deg); background-color:#4f4d56;} .section_main .top_area .card_item h3.title .tooltip_wrap:hover .bottom {visibility:visible; opacity:1;} .section_main .card_area .card_row {padding: 0; margin: 0 -10px; list-style: none;} .section_main .card_area .card_row:after {display: block; content: ''; clear: both;} .section_main .card_area .card_row > li {float: left; padding: 10px; list-style: none;} .section_main .bottom_area, .section_user .bottom_area {margin-top:30px;} .section_main .card_area {list-style:none; padding:0;} .section_main .card_area .card_row {display:flex; padding:0; margin:0;} .section_main .card_area .card_row li {width:20%; list-style:none;} .section_main .card_area li .card_item {background:#fff; border:1px solid #d9d9d9; padding:20px; height:100%; border-radius:8px;} .section_main .card_area .card_item:hover {background:#fff; border:1px solid #d9d9d9;} .section_main .card_area .card_row li .card_item h3.title {font-size:20px; text-align:center;} .section_main .card_area .card_row li .card_item strong {font-size:34px; display:block; text-align:center; margin:5px 0; } .section_main .card_area .card_row li .card_item strong.name_play {display:-webkit-box; width:100%; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word; white-space:break-spaces; text-overflow:ellipsis; overflow:hidden;} .section_main .card_area .card_row li .card_item span {display:block; text-align:right; color:#999; text-align:center;} .section_main .card_area {overflow:hidden; margin-bottom:15px;} .section_main .card_area li.item_list {float:left; padding:0 10px; margin:10px 0;} .section_main .card_area li.col1 {width:60%;} .section_main .card_area li.col2 {width:40%;} .section_main .card_top {display:flex; margin-bottom:5px; justify-content:space-between; align-items:center; height:34px;} .section_main .card_area li.item_list .btn_group .m_btn.active {background:#26a1ff; border-color:#26a1ff; color:#fff;} .section_main .card_area li.item_list .btn_group.more {margin-top:4px;} .section_main .card_area li.item_list .btn_group .btnMore {font-weight:300; margin-right:20px;} .section_main .card_area li.item_list .btn_group .btnMore i {font-size:11px;} .section_main ul.notice_list {padding:0; margin:0; list-style:none;} .section_main ul.notice_list li {font-size:15px; font-weight:400; color:#000; padding:20px 1px 28px 0; overflow:hidden; position:relative;} .section_main ul.notice_list li:last-child {border-bottom:0; padding-bottom:0;} .section_main ul.notice_list li .date {color:#888; font-size:14px; float:right;} .section_main ul.notice_list li .category {font-size:14px; background:#eef6ff; border-radius:13px; height:25px; line-height:25px; float:left; width:90px; display:inline-block; text-align:center; margin-right:20px;} .section_main ul.notice_list li .notice_title {width:79%; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word; text-overflow:ellipsis; overflow:hidden; float:left;} .section_main ul.notice_list li .notice_title:hover {color:#26a1ff;} .section_main .card_area .card_item .board_div {color:#616ef4; position:absolute; top:0; font-weight:500;} .section_main .btnAlarm {position:absolute; top:44px; left:210px;} .section_main .detail_item .detail_list {display:flex; justify-content:space-between; max-width:500px; margin-bottom:0; padding:0 0 15px 0; list-style:none;} .section_main .detail_list li .title {color:#1b263b; font-size:18px; font-weight:600;} .section_main .card_area.card_row_type .title {font-size:17px} /* .section_main .card_area.card_row_type .content_box {margin-top:10px;} */ .section_main .card_area.card_row_type .content_box:after {content:""; display:block; clear:both;} .section_main .card_area.card_row_type .content_box h5 {margin-bottom:5px; font-size:16px;} .section_main .card_area.card_row_type .content_box .num {font-size:22px;} .section_main .card_area.card_row_type .content_box .list_box {position:relative; float:left; width:50%;} .section_main .card_area.card_row_type .content_box .list_box:before {content:""; display:inline-block; width:50px; height:50px; background:url(../images/dashboard/icon_list.png)no-repeat center #4791FF; background-size:24px 28px; border-radius:8px; vertical-align:top;} .section_main .card_area.card_row_type .content_box .list_box .info {display:inline-block;} .section_main .card_area.card_row_type .content_box .chart_box {width:50%;} .section_main .card_area.card_row_type .content_box .chart_box .qlik_chart {display:inline-block;} .section_main .card_area.card_row_type .content_box .chart_box .info {display:inline-block;} .section_main .card_area.card_row_type .col1 .card_item {height:340px;} .section_main .card_area.card_row_type .col2 .card_item {height:165px;} .section_main .card_area.card_row_type .col2 .card_item:first-of-type {margin-bottom:10px;} .section_main .card_area li.item_list.col3 {width:40%;} .section_main .card_area li.item_list.col3 .card_list_row {display:flex; gap:20px;} .section_main .card_area li.item_list.col3 .card_list_row .card_item {flex:1;} .section_main .card_area.row3 {} .section_main .card_area.row3 li {width:33.3333%;} .section_main .card_area.type_table {padding:0 10px;} .section_main .card_area.panel_col2 {display:flex; overflow:visible;} .section_main .card_area li .card_item {height:calc(100% - 40px);} .section_main .card_area.panel_col2 > li {width:50%;} .section_main .card_area.type_table li .card_item {padding:0; border:0;} .section_main .card_area.type_table .card_item:hover {border:0;} .main_notice_section {padding:0 10px;} .card_top h4.notice_title {font-size:18px; font-weight:600;} .section_main .krds-badge {display: inline-flex; align-items: center; justify-content: center; flex-direction: row; font-size: 15px; color: #1D56BC; height: 24px; padding: 0 8px; border-radius: 4px; background-color: #EFF5FF;} .section_main .d-card.line {padding: 22px; border-radius: 12px; border: 0.1rem solid #d9d9d9;} .section_main .main-noti-wrap {display: flex; align-items: normal; justify-content: flex-start; flex-direction: column; gap: 24px;} .section_main .main-noti-wrap .noti-primary-item {display: flex; align-items: center; justify-content: flex-start; flex-direction: row; gap: 16px;} .section_main .main-noti-wrap .noti-primary-item .tit {flex: 1; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 1; font-weight: 700; font-size: 19px;} .section_main .main-noti-wrap .noti-primary-item .date {color: #555; margin-left: auto;} .section_main .main-noti-wrap .noti-swiper.no-swiper .swiper-wrapper {display: flex; align-items: flex-start; justify-content: flex-start;flex-direction: row; gap: 24px; padding: 0;} .section_main .main-noti-wrap .noti-swiper.no-swiper .swiper-wrapper .swiper-slide {flex: 1; list-style:none;} .section_main .main-noti-wrap .noti-swiper.no-swiper .d-card {position: relative; padding-bottom: 60px;} .section_main .main-noti-wrap .noti-swiper.no-swiper .d-card .c-tit {font-size: 17px; line-height: 24px; height: 48px; -webkit-line-clamp:2; text-overflow:ellipsis; word-break:break-all; white-space:normal; -webkit-box-orient:vertical; overflow:hidden; display:-webkit-box;} .section_main .main-noti-wrap .noti-swiper.no-swiper .d-card .c-date {font-size: 14px; color: #888; position: absolute; right: 24px; bottom:10px;} ul.main_boare_lst {padding:0; margin:0;} ul.main_boare_lst li {padding:0 0 0 10px; margin:0; list-style:none; position:relative; margin:0 0 10px; font-size:15px; display:flex;} ul.main_boare_lst li:last-child {margin-bottom:0;} ul.main_boare_lst li:before {content:""; display:block; width:2px; height:2px; border-radius:1px; background:#000; position:absolute; left:0; top:8px;} ul.main_boare_lst.type_btn li {display:flex; justify-content:space-between;} ul.main_boare_lst .badge_s {border:1px solid #666; border-radius:6px; text-align:center; color:#666; background:#fff; padding:0 10px; margin:0 10px; width:95px;} ul.main_boare_lst .badge_s.badge_black {border:1px solid #666; border-radius:6px; background:#4f4e56; color:#4f4e56; color:#fff; margin-right:0; width:100px;} .section_main ul.main_boare_lst.type_btn li a {width:95%;} .section_main ul.main_boare_lst li a {width:auto; display:-webkit-box; text-overflow:ellipsis; -webkit-line-clamp:1; height:24px; word-wrap:break-word; white-space:normal; -webkit-box-orient:vertical; overflow:hidden;} .main_supply .big_tab {border-bottom:1px solid #bbb;} .main_supply .tab-content {margin-top:15px;} /* 팝업 - 주기적 비밀번호 변경 */ .pop_change_pw .ch_txt {text-align:center; margin-bottom:15px;} .pop_change_pw .form_area {padding:0 10px;} .pop_change_pw .msg_error { color:#ff2b2b;} .pop_change_pw .msg_error, .pop_change_pw .msg_password {padding:5px 5px 0 165px; font-weight:400;} .pop_change_pw input.input_error {border-color:#ff2b2b;} @media all and (max-width:1600px){ .section_main .top_area .card_area .card_row > li {padding:5px;} .section_main .top_area .card_area li .card_item {padding:20px 10px;} .section_main .top_area .card_area .card_row li .card_item h3.title {font-size:19px;} } /* 회원 통계 */ .section_user .top_area .date_box, .section_user .top_area .select_box {display:inline-block;} .section_user .top_area .date_box {margin-left:10px;} .fontawesome-icon-list {text-align:center;} .fontawesome-icon-list h2.page-header {font-size:20px; margin:20px 0 20px; text-align:left;} .fontawesome-icon-list .fa-hover {display:inline-block; width:9.5%; text-align:center;} .fontawesome-icon-list .fa-hover a {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:0; line-height:50px; height:50px;} .fontawesome-icon-list .fa-hover a i {font-size:24px; margin-right:5px; min-width:30px; margin-top:11px;} .section_manage_join {height:100vh; overflow:auto; padding:50px;} /* 그룹 문진 */ .select_check {display:inline-block;} .select_check .m_check{margin-left:5px;} .select_check .m_check> input[type=checkbox] + label {width:45px; height:24px; display:inline-block; text-align:center; padding:0; border:1px solid #222; color:#666; background:#fff; line-height:23px; font-size:13px; font-weight:500;} .select_check .m_check > input[type=checkbox] + label:before, .select_check .m_check > input[type=checkbox] + label:after {display:none;} .select_check .m_check > input[type=checkbox]:checked + label {background:#222; color:#fff;} .section_group_interview .search_box .select_check .m_check > input[type=checkbox] + label {border-radius:15px; width:auto; height:26px; line-height:25px; padding:0 13px; font-size:14px;} .section_group_interview .search_box .select_check .m_check > input[type=checkbox]:checked + label {background:#1dbae1; border-color:#1dbae1;} .section_group_interview .search_box .select_check .m_check > input[type=checkbox]:disabled + label {background:#eff1f3; border-color:#bbb; color:#999;} .section_group_interview .search_box .select_check .m_check > input[type=checkbox]:checked:disabled + label {background:#999; border-color:#999; color:#fff;} .section_group_interview {} .section_group_interview .search_type {margin-top:10px; display:flex; justify-content:space-between; gap:15px;} .section_group_interview .section_title {font-size:24px; font-weight:600;} .section_group_interview .search_box {border:1px solid #d9d9d9; border-radius:8px; background:#fff; padding:20px; margin-bottom:20px;} .section_group_interview .search_box h4 {font-size:18px;} .section_group_interview .box_1 {flex:1;} .section_group_interview .box_2 {flex:2;} .section_group_interview .box_3 {flex:3;} .section_group_interview .box_4 {flex:4;} .section_group_interview .box_5 {flex:5;} .section_group_interview .box_6 {flex:6;} .section_group_interview .box_7 {flex:7;} .section_group_interview .box_8 {flex:8;} .section_group_interview .box_9 {flex:9;} .section_group_interview .search_box .box_top_title {display:flex; justify-content:space-between; align-items:center;} .section_group_interview .search_box .select_wrap {margin-top:20px;} .section_group_interview .search_box .select2 {margin:10px 0;} .section_group_interview .search_box.box_1 .bootstrap-select {margin:10px 0;} .section_group_interview .search_box.box_2 .bootstrap-select {margin:0 0 5px;} .section_group_interview .search_box .box_txt {margin:10px 5px;} .section_group_interview .search_box .select_radio .m_radio > input[type=radio] + label {border-radius:15px; width:auto; height:26px; line-height:25px; padding:0 13px; font-size:14px;} .section_group_interview .search_box .select_radio .m_radio > input[type=radio]:checked + label {background:#1dbae1; border-color:#1dbae1;} .section_group_interview .search_box .check_daily {border-color:#bbb; width:100%; padding:0; overflow:hidden;} .section_group_interview .search_box .m_check.check_daily > input[type=checkbox] + label {padding:0 10px; font-weight:600; height:34px; width:100%; font-weight:400;} .section_group_interview .search_box .m_check.check_daily > input[type=checkbox] + label:before, .section_group_interview .search_box .m_check.check_daily > input[type=checkbox] + label:after {right:10px; left:auto;} .section_group_interview .search_box .m_check.check_daily > input[type=checkbox] + label:after {top:10px;} .section_group_interview .search_box .m_check.check_daily > input[type=checkbox]:disabled + label {background-color:#eff1f3;} .section_group_interview .search_box .btn_answer_select {display:none; margin:50px auto; padding:0 70px;} .section_group_interview .search_box .btn_answer_select:after {content:"\2b"; font-family:"fontawesome"; display:inline-block; margin-left:10px;} .section_group_interview .search_box .btn_answer_select.active {display:block; border:1px solid #222; color:#666; background:#fff;} .section_group_interview .search_box .btn_answer_select2 {display:none; margin:0 5px 0 0; padding:0 20px; vertical-align:top; height:25px; line-height:21px; margin-top:-2px; font-size:13px;} .section_group_interview .search_box .btn_answer_select2:after {content:"\2b"; font-family:"fontawesome"; display:inline-block; margin-left:10px;} .section_group_interview .search_box .btn_answer_select2.active {display:inline-block; border:1px solid #222; color:#666; background:#fff;} .section_group_interview .search_box .btn_answer_select {display:none; margin:50px auto; padding:0 70px;} .section_group_interview .search_box .btn_answer_select:after {content:"\2b"; font-family:"fontawesome"; display:inline-block; margin-left:10px;} .section_group_interview .search_box .btn_answer_select.active {display:block;} .section_group_interview .search_box .answer_input_area {display:block; margin-top:10px; height:158px; overflow-y:auto; overflow-x:hidden;} .section_group_interview .search_box .btn_answer_select.active + .answer_input_area {display:none;} .section_group_interview .search_box .answer_input_area .m_text {margin-right:10px;} .section_group_interview .search_box .answer_input_area .m_text, .section_group_interview .search_box .answer_input_area .select2, .section_group_interview .search_box .answer_input_area .bootstrap-select {width:calc(50% - 14px) !important; vertical-align:top;} .section_group_interview .search_box .answer_input {margin:0 0 5px;} .section_group_interview .search_box .answer_input .select2 {margin:0;} .section_group_interview .search_box .m_switch > input[type=checkbox] + label {width:50px; height:24px; border-radius:14px;} .section_group_interview .search_box .m_switch > input[type=checkbox] + label:after {width:32px; height:20px; background-color:#0d2e8a;} .section_group_interview .search_box .m_switch > input[type=checkbox] + label:before, .section_group_interview .search_box .m_switch > input[type=checkbox]:checked + label:before {position:absolute; z-index:1; font-size:11px; top:50%; transform:translateY(-50%); color:#fff;} .section_group_interview .search_box .m_switch > input[type=checkbox]+ label:before {content:"AND"; left:6px;} .section_group_interview .search_box .m_switch > input[type=checkbox]:checked + label:before {content:"OR"; left:auto; right:9px;} .section_group_interview .search_box .m_switch > input[type=checkbox]:checked + label:after {background:#1dbae1; left:auto; right:1px;} .section_group_interview .search_box .m_switch > input[type=checkbox]:checked + label {background:#fff; border-color:#d6d6d6;} .section_group_interview .search_box .m_switch > input[type=checkbox]:disabled + label {background-color:#eff1f3;} .section_group_interview .search_box .m_switch > input[type=checkbox]:disabled + label:after, .section_group_interview .search_box .m_switch > input[type=checkbox]:checked:disabled + label:after {background-color:#999;} .search_box.search_bottom {display:flex; justify-content:space-between; align-items:center;} /* .search_box.search_bottom > div {border:1px solid red;} */ .search_box.search_bottom .search_check {} .search_box.search_bottom .search_check > div {display:inline-block; margin-right:60px; vertical-align:top;} .search_box.search_bottom .search_check .radio_wrap .radio_input_wrap {margin:10px 0 0 25px;} .search_box.search_bottom .search_check .radio_wrap .radio_input_wrap .m_text:disabled + span {color:#a3a3a3;} .search_box .send_title {display:inline-block; font-size:15px; margin:0 10px; vertical-align:middle;} .search_box .send_title .title {margin-right:5px;} /* 발송 대상 그룹 펼침 */ button.btn_dg_list {margin:0 0 10px; min-width:186px; transition:0.2s;} button.btn_dg_list:before {content:"발송 대상 그룹 접기"; display:inline-block;} button.btn_dg_list.active:before {content:"발송 대상 그룹 펼치기";} button.btn_dg_list:after {display:inline-block; width:20px; height:34px; content:"\eac8"; width:20px; font-family:"IcoFont"; font-size:16px; font-weight:600; text-align:center; line-height:34px; margin-left:3px; transform:rotate(-180deg); transition:0.2s; margin-right:0;} button.btn_dg_list.active:after {transform:rotate(0deg);} .search_box.destination_group_list {padding:0 20px; transition:0.3s; height:0; overflow:hidden; border:1px solid transparent;} .search_box.destination_group_list.active {height:425px; padding:20px; border-color:#d9d9d9;} .sale_percent {display:block; margin-top:5px; } /* 그룹 문진 초대 발송 예약 세팅 */ .section_group_interview h3 {font-size:18px; font-weight:700; margin:20px 0 0;} .section_group_interview .interview_invite_setting {margin-top:10px; display:flex; justify-content:space-between; gap:15px; background:#9397a4; border-radius:10px; padding:20px; border:none;} .section_group_interview .interview_invite_setting .search_box {margin:0;} .interview_invite_setting h5#petKindTitle {font-size:22px; font-weight:700; margin:0 0 20px; padding-top:20px;} .interview_invite_setting strong#petKindNum {font-size:30px; font-weight:700; text-align:right; display:block;} .interview_invite_setting .m_date {width:100%;} .interview_invite_setting .m_textarea {min-height:111px;} .interview_invite_setting .btn_select_paper {width:100%; margin:17px 0 0;} .interview_invite_setting .btn_select_paper + .btn_select_paper {margin:10px 0 0;} .interview_invite_setting .btn_select_paper:after {display:block; content:"\2b"; font-family:"fontawesome"; display:inline-block; margin-left:10px;} .interview_invite_setting .btn_res_send {width:100%; font-size:17px; padding:0 10px; border-radius:6px; height:100%; display:inline-flex; align-items:center; color:#ffffff; border-color:#4da1f8; background:#4da1f8; transition:0.2s; font-weight:700; justify-content:center;} .interview_invite_setting .btn_res_send:hover {border-color:#214ca4; background:#214ca4;} .interview_invite_setting .search_box {border:none;} /* ******************* 수신동의서류 ******************* */ .interview_invite_setting .btn_area_collect_agree_top {display:none;} .interview_invite_setting .btn_area_collect_agree_top.active {display:block; margin-top:-6px;} .interview_invite_setting .btn_area_collect_agree_top .btn_select_paper2 { margin:0 5px 0 0; padding:0 20px; vertical-align:top; height:25px; line-height:21px; margin-top:-2px; font-size:13px;} .interview_invite_setting .btn_area_collect_agree_top .btn_select_paper2:after {content:"\2b"; font-family:"fontawesome"; display:inline-block; margin-left:10px;} .interview_invite_setting .btn_area_collect_agree_top .btn_select_paper2.active {display:inline-block; border:1px solid #222; color:#666; background:#fff;} /* 필수/선택 서류 선택 버튼 */ .interview_invite_setting .btn_area_collect_agree_con {display:none; text-align:center; max-width:250px; margin:0 auto;} .interview_invite_setting .btn_area_collect_agree_con.active {display:block;} /* 선택된 필수/선택 서류 내용 */ .interview_invite_setting .selected_agree_paper {display:none; height:105px; margin-top:6px; overflow-y:auto; overflow-x:hidden; width:100%;} .interview_invite_setting .selected_agree_paper.active {display:flex; justify-content:space-between; align-items:flex-start;} .interview_invite_setting .selected_agree_paper .sap_lst {padding:0; margin:0; width:50%; position:relative;} .interview_invite_setting .selected_agree_paper .sap_lst h5 {font-size:15px; font-weight:500; margin:0 0 5px;} .interview_invite_setting .selected_agree_paper .sap_lst ul {padding:0; margin:0;} .interview_invite_setting .selected_agree_paper .sap_lst li {position:relative; padding:0 0 0 10px; font-size:13px; line-height:16px; margin:0; list-style:none; color:#666;} .interview_invite_setting .selected_agree_paper .sap_lst li + li {margin-top:5px;} .interview_invite_setting .selected_agree_paper .sap_lst li:before {content:""; display:block; width:4px; height:4px; border-radius:2px; background:#999; position:absolute; left:0; top:5px;} .interview_invite_setting .selected_agree_paper .sap_lst.sap_required {padding:0 10px 0 0; border-right:1px solid #eee;} .interview_invite_setting .selected_agree_paper .sap_lst.sap_choice {padding:0 0 0 15px; border-left:1px solid #eee; left:-1px;} /* 팝업 - 문제 은행 내용 */ .pop_question .question_list {list-style:none; margin:0; padding:0;} .pop_question .question_list li {padding:10px 15px; border-bottom:1px solid #ddd;} /* 팝업 - 수집동의서류 */ .pop_paper .paper_list {list-style:none; margin:0; padding:0;} .pop_paper .paper_list li {padding:10px 15px 10px 30px; border-bottom:1px solid #ddd; min-height:42px; position:relative;} .pop_paper .paper_list li i.fa-exchange-alt {width:20px; height:20px; display:block; position:absolute; left:0; top:50%; transform:translate(0,-50%) rotate(90deg); text-align:center; font-size:13px; color:#999; cursor:pointer;} .pop_paper .paper_list li.ui-sortable-placeholder.ui-state-highlight {height:42px; background:#ddd; border:none; border-bottom:1px solid #ddd;} @media all and (max-width:1640px){ .search_box.search_bottom .search_check > div {margin-right:25px;} } /****** 이용권 *******/ .m_date > input[type=text]:disabled {color:#999; background:#eff1f3;} .data_table_area .table_form_wrap.type_block .m_date {margin-left:25px; margin-right:10px;} .price_table_wrap {margin-top:25px;} .price_table_wrap .price_table {margin-bottom:15px;} .price_table_wrap .price_table .list_table_area {width:40%;} .price_table_wrap .price_table .list_table_area .m_text {width:100%;} .price_table_wrap .price_table .list_table_area tbody tr td {padding:7px 10px;} .price_table_wrap .price_table .list_table_area tbody tr.active {display:none;} .price_table_wrap .price_table.table_add .list_table_area {width:28%;} /****** 이벤트 *******/ .check_event_section .data_table_area table tr th, .data_table_area.type_purple table tr th {padding-right:30px;} .select_date_area {margin-top:15px;} .select_date_area .date_item {display:inline-block; margin-right:20px;} .select_date_area .date_item span {margin-right:5px;} .image_select_area {margin-left:50px;} .image_select_area .image_select_item {display:inline-block; margin-right:15px;} .image_select_area .image_select_item > span {vertical-align:top; margin-right:10px; font-size:14px;} .image_select_area .image_select_item .view_thumnail {width:100px; min-height:100px; display:inline-block;} .image_select_area .image_select_item .view_thumnail .upload_photo_label {} .image_select_area .image_select_item .view_thumnail span {background:url(../images/icon/upload.png) no-repeat center top 10px; background-size:50%; padding:64px 0 0 0;} .td_upload_image .m_radio {align-items:flex-start;}