@media (max-width: 576px) {
    .card {
        --bs-card-spacer-y: 1.5rem;
        --bs-card-spacer-x: 1rem;
    }
    .modal {
        --bs-modal-padding: 1rem;
        --bs-modal-header-padding-x: 1rem;
        --bs-modal-header-padding: 1rem 1rem;
    }
}
body {
    font-family : 'Noto Sans KR','Segoe UI',Helvetica,Arial,sans-serif;
}
a {
    color:unset;
    text-decoration: none;
}
mark {background-color: var(--bs-primary-lighten)}

ul li::marker {
    color : var(--bs-body-color);
}
ul.mark-secondary li::marker {
    color : var(--bs-secondary);
}
ul.mark-warning li::marker {
    color : var(--bs-warning);
}
ul.mark-success li::marker {
    color : var(--bs-success);
}
ul.mark-info li::marker {
    color : var(--bs-info);
}
ul.mark-dark li::marker {
    color : var(--bs-dark);
}
ul.mark-light li::marker {
    color : var(--bs-light);
}
ul.mark-white li::marker {
    color : #fff;
}
ul.mark-black li::marker {
    color : #000;
}
.dropdown-toggle.arrow-none:after {
    display: none;
}

.form-check-input[type=radio], .form-check-input[type=checkbox] {
    cursor:pointer;
}

.dropdown-item {
    line-height: 1.6;
}
.dropdown-menu-slideup {
    -webkit-animation-name: slideUp;
    animation-name: slideUp;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    position: absolute;
    margin: 0;
    z-index: 1000;
}
.spinner-border-lg {
    --bs-spinner-width: 5rem;
    --bs-spinner-height: 5rem;
    --bs-spinner-border-width: 0.5em;
}

.form-control.border:focus {
    border-color : var(--bs-primary)!important;
    --bs-border-color:var(--bs-primary);
}
.form-floating > label {
    color : gray;
}

/** Form Validation 관련 추가 css ***/
.form-control.is-invalid, .was-validated .form-control:invalid,
.form-select.is-invalid, .was-validated .form-select:invalid
{
    border-color: #dc3545;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.form-control.is-valid, .was-validated .form-control:valid,
.form-select.is-valid, .was-validated .form-select:valid
{
    border-color: #198754;
    padding-right: calc(1.5em + 0.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(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.invalid-feedback {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: .875em;
    color: #dc3545;
}
.valid-feedback {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: .875em;
    color: #198754;
}

.is-valid~.valid-feedback, .is-valid~.valid-tooltip, .was-validated :valid~.valid-feedback, .was-validated :valid~.valid-tooltip {
    display: block;
}
.is-invalid~.invalid-feedback, .is-invalid~.invalid-tooltip, .was-validated :invalid~.invalid-feedback, .was-validated :invalid~.invalid-tooltip {
    display: block;
}
/** // Form Validation 관련 추가 css ***/

/** input style  추가 */
input.-light {
    background-color: var(--bs-light);
    border-color:var(--bs-light);;
}
input.-light:focus {
    background-color: var(--bs-light);
    /*border:1px solid var(--bs-primary);*/
}

/** button style 추가 */
.btn-search {
    position:absolute;
    right:10px;
    top:15px;
    cursor:pointer;
}


.table {
    color:var(--body-color);
}
.table td {
    vertical-align: middle;
}
.nav-link {
    cursor :pointer;
}
.nav-link:hover, .nav-link.current {
    background-color:var(--bs-light);
    border-radius:4px;
}

.nav-link.current {
    background-color:var(--bs-primary-lighten);
    border-radius:4px;
}


.nav-item ul>li {
    position:relative;
    /*padding-left:40px;*/
}

.np-toggle {
    position: relative;
}
.np-toggle:after {
    content: "";
    position: absolute;
    top: 50%;
    display: block;
    width: 0.42em;
    height: 0.42em;
    border: 1px solid;
    border-bottom: 0;
    border-left: 0;
    transform: translateY(-50%) rotate(45deg);
    transition-duration: .3s;
    transition-property: transform;
    right: 1rem;
}
[aria-expanded="true"].np-toggle::after {
    transform: translateY(-50%) rotate(135deg);
}

/*** namp original **/
.-clamp-1,
.-clamp-2,
.-clamp-3,
.-clamp-4,
.-clamp-5,
.-clamp-6,
.-clamp-7,
.-clamp-8,
.-clamp-9,
.-clamp-10{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
.-clamp-1{-webkit-line-clamp: 1}
.-clamp-2{-webkit-line-clamp: 2}
.-clamp-3{-webkit-line-clamp: 3}
.-clamp-4{-webkit-line-clamp: 4}
.-clamp-5{-webkit-line-clamp: 5}
.-clamp-6{-webkit-line-clamp: 6}
.-clamp-7{-webkit-line-clamp: 7}
.-clamp-8{-webkit-line-clamp: 8}
.-clamp-9{-webkit-line-clamp: 9}
.-clamp-10{-webkit-line-clamp: 10}

.-hover-primary:hover {
    background-color:var(--bs-primary-lighten);
}
.-hover-light:hover {
    background-color:var(--bs-light);
}

/*** Animation ***/
/* animation */
.-animate-fading{animation:fading .7s ease-out;opacity:1!important}@keyframes fading{0%{opacity:1}50%{opacity:0.5}100%{opacity:1}}
.-animate-opacity-fast{animation:opac--fast .6s;opacity:1!important}@keyframes opac--fast{from{opacity:0.5} to{opacity:1}}
.-animate-opacity{animation:opac 1.6s;opacity:1!important}@keyframes opac{from{opacity:0.5} to{opacity:1}}
.-animate-opacity-slow{animation:opac--slow 2.8s;opacity:1!important}@keyframes opac--slow{from{opacity:0} to{opacity:1}}
.-animate-zoom-fast {animation:animatezoom--fast 0.6s;;opacity:1!important}@keyframes animatezoom--fast{from{transform:scale(0.8)} to{transform:scale(1)}}
.-animate-zoom {animation:animatezoom 1.2s;opacity:1!important}@keyframes animatezoom{from{transform:scale(.8)} to{transform:scale(1)}}
.-animate-zoom-slow {animation:animatezoom--slow 2s;;opacity:1!important}@keyframes animatezoom--slow{from{transform:scale(0.8)} to{transform:scale(1)}}
.-animate-top-fast{position:relative;animation:animatetop--fast 0.5s;opacity:1!important}@keyframes animatetop--fast{from{top:-100px;opacity:0} to{top:0;opacity:1}}
.-animate-top{position:relative;animation:animatetop .8s;opacity:1!important}@keyframes animatetop{from{top:-100px;opacity:0} to{top:0;opacity:1}}
.-animate-top-slow{position:relative;animation:animatetop--slow 1.6s;opacity:1!important}@keyframes animatetop--slow{from{top:-100px;opacity:0} to{top:0;opacity:1}}
.-animate-down-fast{position:relative;animation:animatetop--fast 0.5s;opacity:1!important}@keyframes animatetop--fast{from{top:-100px;opacity:0} to{top:0;opacity:1}}
.-animate-down{position:relative;animation:animatetop .8s;opacity:1!important}@keyframes animatetop{from{top:-100px;opacity:0} to{top:0;opacity:1}}
.-animate-down-slow{position:relative;animation:animatetop--slow 1.6s;opacity:1!important}@keyframes animatetop--slow{from{top:-100px;opacity:0} to{top:0;opacity:1}}
.-animate-bottom-fast{position:relative;animation:animatebottom--fast 0.5s;opacity:1!important}@keyframes animatebottom--fast{from{bottom:-100px;opacity:0} to{bottom:0;opacity:1}}
.-animate-bottom{position:relative;animation:animatebottom .8s;opacity:1!important}@keyframes animatebottom{from{bottom:-100px;opacity:0} to{bottom:0;opacity:1}}
.-animate-bottom-slow{position:relative;animation:animatebottom--slow 1.6s;opacity:1!important}@keyframes animatebottom--slow{from{bottom:-100px;opacity:0} to{bottom:0;opacity:1}}
.-animate-up-fast{position:relative;animation:animatebottom--fast 0.5s;opacity:1!important}@keyframes animatebottom--fast{from{bottom:-100px;opacity:0} to{bottom:0;opacity:1}}
.-animate-up{position:relative;animation:animatebottom .8s;opacity:1!important}@keyframes animatebottom{from{bottom:-100px;opacity:0} to{bottom:0;opacity:1}}
.-animate-up-slow{position:relative;animation:animatebottom--slow 1.6s;opacity:1!important}@keyframes animatebottom--slow{from{bottom:-100px;opacity:0} to{bottom:0;opacity:1}}
.-animate-right-fast{position:relative;animation:animateright--fast 0.5s;opacity:1!important}@keyframes animateright--fast{from{left:-100px;opacity:0} to{left:0;opacity:1}}
.-animate-right{position:relative;animation:animateright .8s;opacity:1!important}@keyframes animateright{from{left:-100px;opacity:0} to{left:0;opacity:1}}
.-animate-right-slow{position:relative;animation:animateright--slow 1.6s;opacity:1!important}@keyframes animateright--slow{from{left:-100px;opacity:0} to{left:0;opacity:1}}
.-animate-left-fast{position:relative;animation:animateleft--fast 0.5s;opacity:1!important}@keyframes animateleft--fast{from{right:-100px;opacity:0} to{right:0;opacity:1}}
.-animate-left{position:relative;animation:animateleft .8s;opacity:1!important}@keyframes animateleft{from{right:-100px;opacity:0} to{right:0;opacity:1}}
.-animate-left-slow{position:relative;animation:animateleft--slow 1.6s;opacity:1!important}@keyframes animateleft--slow{from{right:-100px;opacity:0} to{right:0;opacity:1}}
.-animate-opacity2{animation:opac 1s;opacity:1!important}@keyframes opac{from{opacity:0} to{opacity:1}}
.-animate-top-fixed{position:fixed;animation:animatetop-fixed 0.5s;opacity:1!important}@keyframes animatetop-fixed{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.-animate-bottom-fixed{position:fixed;animation:animatebottom-fixed 0.5s;opacity:1!important}@keyframes animatebottom-fixed{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.-animate-slide{
    animation: slide 400ms ease-in-out;
    transform-origin: top center;
}