label.error {
    color: #dc2626;
    font-size: 80%;
}

.item-warning {
    border-color: red !important;
}

.sticky {
    position: sticky;
    position: -webkit-sticky;
    background: #fafffd !important;
}

.sticky0 {width: 50px;min-width: 50px;max-width: 50px;left: 0px;}
.sticky1 {width: 80px;min-width: 80px;max-width: 80px;left: 50px;}
.sticky2 {width: 100px;min-width: 100px;max-width: 100px;left: 130px;}
.sticky3 {width: 130px;min-width: 130px;max-width: 130px;left: 230px;}
.sticky4 {width: 160px;min-width: 160px;max-width: 160px;left: 360px;}
.sticky5 {width: 100px;min-width: 100px;max-width: 100px;left: 520px;}
.sticky6 {width: 100px;min-width: 100px;max-width: 100px;left: 620px;}
.sticky7 {width: 120px;min-width: 120px;max-width: 120px;left: 720px;}
.sticky7-7 {width: 240px;min-width: 240px;max-width: 240px;left: 720px;}
.sticky8-8 {width: 100px;min-width: 100px;max-width: 100px;left: 960px;}
.sticky8 {width: 80px;min-width: 80px;max-width: 80px;left: 840px;}
.sticky9 {width: 100px;min-width: 100px;max-width: 100px;left: 920px;}
.sticky10 {width: 80px;min-width: 80px;max-width: 80px;left: 1020px;}
.sticky11 {width: 100px;min-width: 100px;max-width: 100px;left: 1100px;}
.sticky12 {width: 100px;min-width: 100px;max-width: 100px;left: 1200px;}
.column-150 {width: 150px; min-width: 150px; max-width: 150px; overflow: hidden;}
.column-200 {width: 200px; min-width: 200px; max-width: 200px; overflow: hidden;}
.column-300 {width: 300px; min-width: 300px; max-width: 300px; overflow: hidden;}
.column-400 {width: 400px; min-width: 400px; max-width: 400px; overflow: hidden;}

.bg-system {
    background-color: #673ab7 !important;
}

.btn-system {
    background-color: #673ab7 !important;
    color: #FFFFFF !important
}

.text-bg-system {
    background-color: #673ab7 !important;
}

.bg-pink {
    background-color: #ff3366 !important;
}

.btn-pink {
    background-color: #ff3366 !important;
    color: #FFFFFF !important
}

.text-bg-pink {
    background-color: #ff3366 !important;
}

.tracking-row.selected {
    background-color: #ffbb33 !important;
}

.tracking-row.selected button {
    background: none;
}

.image-preview {
    padding: 0 5px;
}

.image-preview img{
    width: 100%;
    border: 1px solid #EEEEEE;
    padding: 5px;
    border-radius: 5px;
}

.ui-timepicker-standard {
    border-color: #EEEEEE;
    border-radius: 5px;
    margin-top: 5px;
    font-family: system-ui;
}

.course-images {
    margin: 0 -15px;
    background: #e2d5c569;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 5px;
}

.course-images img {
    width: 50px;
    margin-right: 5px;
    vertical-align: top;
    border-radius: 5px;
}

@media screen and (max-width: 767px){
    .pc-header .header-wrapper {
        background: #e2d5c5;
    }
}