* {
    margin: 0;
    padding: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    /*-webkit-user-select: none;
    user-select: none;*/
    margin: 0;
    padding: 0;
}


html,
body {
    height: 100vh;
    min-width:1100px;
}

article {
    display:block;
}

body {
    background-color: #C9CACA;
    font-size: 14px;
    font-weight: 200;
    display: flex;
    min-height: 100vh;
    height: -webkit-fill-available;
    flex-direction: column;
    line-height: 1;
    -webkit-text-size-adjust: 100%;
    font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
}


ul {
    list-style: none;
    font-size:0px;
}
ul li {
    font-size:1rem;
}

a {
    text-decoration: none;
    display: block;
    outline: none;
}

#loadingBox {
    position: fixed;
    background: rgba(0, 0, 0, .5);
    top: 0;
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    z-index: 9999;
}

    #loadingBox .loader {
        margin: 100px auto;
        font-size: 25px;
        width: 1em;
        height: 1em;
        border-radius: 50%;
        position: relative;
        text-indent: -9999em;
        -webkit-animation: load5 1.1s infinite ease;
        animation: load5 1.1s infinite ease;
        -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
        transform: translateZ(0);
    }

.productlist .row > div,
.colorlist .row > div {
    padding: .25rem;
}

    .productlist .row > div > div,
    .colorlist .row > div > div {
        height: 100%;
        margin: 0 !important;
    }

        .productlist .row > div > div > a,
        .colorlist .row > div > div > a {
            height: 100%;
            overflow: hidden;
        }

            .productlist .row > div > div > a .card-body,
            .colorlist .row > div > div > a .card-body {
                height: 100%;
                padding: .25rem !important;
            }

.mydisabled {
    opacity: .65;
    pointer-events: none;
}

button {
    border: solid 3px transparent !important;
}

.bg-black {
    background-color:#000 !important;
}
@-webkit-keyframes load5 {
    0%, 100% {
        box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7);
    }

    12.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5);
    }

    25% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    37.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    50% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    62.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    75% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    87.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff;
    }
}

@keyframes load5 {
    0%, 100% {
        box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7);
    }

    12.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5);
    }

    25% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    37.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    50% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    62.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    75% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }

    87.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff;
    }
}

img.fixed {
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
}
img.fixed-50 {
    width: auto;
    height: auto;
    max-width: 60%;
    max-height: 60%;
}
img.fixed-70 {
    width: auto;
    height: auto;
    max-width: 70%;
    max-height: 70%;
}
img.fixed-75 {
    width: auto;
    height: auto;
    max-width: 75%;
    max-height: 75%;
}
#loader-bg {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: #000;
    z-index: 20000;
    opacity: 0.8;
}

#loader {
    display: block;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 200px;
    margin-top: -100px;
    margin-left: -100px;
    text-align: center;
    color: #fff;
    z-index: 20001;
    /*background: red;*/
}

body.sticky {
    height: 100vh;
    width: 100vw;
    display: grid;
    grid-template-rows: 1fr auto;
    grid-template-columns: 100%;
    overflow: auto;
}
main {
    width:100%;
    height:100%;
    overflow-y:auto;
    
}
atricle {
    height: 100%;
}
footer {
    grid-column: span 2;
    position:relative;
}
#settingMenu {
    background-color: #C9CACA;
    width:100%;
    position:absolute;
    bottom: 0px;
    left: 0px;
}
   
/**************************************************************
 * ログイン
 **************************************************************/
body.bg {
    background-image: url(/view/login/img/notebook_poppoya.png);
    background-size: cover;
    background-repeat: no-repeat;

    background-position:center top; 
}
    body.bg .logo  {
        width: 90%;
        margin:2rem auto;
        min-width:1100px;

    }
div.loginBox {
    margin:1rem;
}

div.loginBox ul li {
    width:214px;

}
    
    div.loginBox ul li input{
        margin:3px;
    }
    div.loginBox button {
        width: 85px;
        padding:0;
        margin:3px;
    }
    div.loginBox p.txt01 img {
        width:530px;
    }
/**************************************************************
 * ローディング
 **************************************************************/
.loader,
.loader:after {
    border-radius: 50%;
    width: 10em;
    height: 10em;
}

.loader {
    margin: 60px auto;
    font-size: 10px;
    position: relative;
    text-indent: -9999em;
    border-top: 1.1em solid rgba(255, 255, 255, 0.2);
    border-right: 1.1em solid rgba(255, 255, 255, 0.2);
    border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
    border-left: 1.1em solid #ffffff;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
/**************************************************************
 * メインメニュー
 **************************************************************/
#mmspagecontent {
    margin-top: 0px;
    overflow: hidden;
}



.tbl_result tr {
    height: 35px;
}

.tbl_result th {
    background: #000000;
    color: white;
    text-align: center;
    font-size: 18px;
}

.tbl_result tbody {
    background-color: #EEEEEF;
    color: #173663;
    font-size: 13px
}

.tbl_result .td_message {
    height: 280px;
    width: 540px;
}

.tbl_result .div_message {
    height: 280px;
    width: 540px;
    white-space: pre-line;
    overflow-y: auto;
    vertical-align: top;
}

#mmspagecontent #div_clock {
    float: left;
    top: 20px;
    left: 10%;
    min-width: 100px;
    min-height: 100px;
    width: 30%;
    height: 30%;
}

#mmspagecontent #lbl_date {
    font-size: 30pt;
    color: black;
}

#mmspagecontent #lbl_dayofweek {
    font-size: 24pt;
    color: black;
}

/**************************************************************
 * フッター
 **************************************************************/
footer {
    background-color: #C9CACA;
}
footer a {
    padding: 0 !important;
    margin: 0 !important;
}
footer img {
    width:85px;
}

.fieldset {
    border: solid 1px #5F5D5D !important;
    border-radius: 8px;
    padding: .5rem;
}

.caption {
    margin: 0 2px;
}

/**************************************************************
 * テーブル FORM
 **************************************************************/
.inputtable {
}

    .inputtable .row > div {
        padding: 2px;
    }

    .inputtable .label{
        padding-left: .3rem;
        font-size: 1rem;
    }

    .inputtable p {
        width: 100%;
        height: 100%;
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-align: center !important;
        align-items: center !important;
        margin: 0 2px 0 0;
        padding: 0;
        background-color: #FFF;
        color: #5F5D5D;
        font-size: 1.1rem;
        font-weight: 700;
        border: solid 1px #5F5D5D !important;
    }

    .inputtable input {
        border-radius: 0px !important;
        border: 0px !important;
    }

    .inputtable textarea {
        resize: none;
        width: 100%;
        height: 100%;
        min-height: 300px;
        border: 0px;
    }

    .inputtable .memo {
        margin: 2px;
    }

::placeholder {
    color: #5F5D5D;
    font-size: 1.3em;
    font-weight: 700;
}
#MarkEditModal ::placeholder,
#CapMarkEditModal ::placeholder,
#NumberEditModal ::placeholder,
#NameEditModal ::placeholder {
    color: #5F5D5D;
    font-size: .8em;
    font-weight: 400;
}
#MarkEditModal label,
#CapMarkEditModal label,
#NumberEditModal label,
#NameEditModal label{
    background-color: rgba(0,0,0,.2);
    text-indent: .25rem;
}
#MarkEditModal .col-sm-10,
#CapMarkEditModal .col-sm-10,
#NumberEditModal .col-sm-10,
#NameEditModal .col-sm-10 {
    background-color: rgba(0,0,0,.1);
}
#MarkEditModal .row > *,
#CapMarkEditModal .row > *,
#NumberEditModal .row > *,
#NameEditModal .row > * {
    padding: .25rem;
}
#MarkEditModal .card,
#CapMarkEditModal .card,
#NumberEditModal .card,
#NameEditModal .card {
    border: solid 2px rgba(255,255,255,1);
}
    #MarkEditModal .card:hover,
    #CapMarkEditModal .card:hover,
    #NumberEditModal .card:hover,
    #NameEditModal .card:hover {
        opacity: .65;
        cursor: pointer;
    }
    #MarkEditModal .card.selected:hover,
    #CapMarkEditModal .card.selected:hover,
    #NumberEditModal .card.selected:hover,
    #NameEditModal .card.selected:hover {
        opacity: 1;
        cursor: default;
    }
#MarkEditModal .selected,
#CapMarkEditModal .selected,
#NumberEditModal .selected,
#NameEditModal .selected {
    border: solid 2px rgba(255,0,0,.65)
}
.newproduct ::placeholder {
    color: #AFAFAF;
    font-size: 1em;
    font-weight: 700;
    text-align:left;
}
.inputtable .searchbtn {
    position:absolute; 
    top:0px;
    left:0px;
    right:0px;
    bottom:0px;
    margin:auto;
}
.inputtable .searchbtn button {
    background-color: transparent;
        border: none;
        cursor: pointer;
        
        padding: 0;
      
}


.w-65 {
    width:65% !important;
}
.w-85 {
    width: 85% !important;
}

.orderlist {
}
    .orderlist table {
        border-collapse: collapse;
        border: 0px !important;
    }
    .orderlist th p{
        background-color: #757475;
        color: #FFF;
        margin:0;
        padding:.3rem .5rem;
    }
    .orderlist th {
        background-color: #DCDDDD;
        padding: .1rem;
    }
        .orderlist td{
            background-color:#DCDDDD;
             padding:.3rem;
             vertical-align:middle;
        }
            .orderlist .color th:nth-of-type(n+5),
            .orderlist .color td:nth-of-type(n+5) {
                background-color: #EEEEEF;
            }
    .orderlist td {
        color: #757475;
    }
    .orderlist tr {
        border: 0px !important;
    }
    .orderlist table th,
    .orderlist table td {
        border-bottom: solid 1px #757475;
        
        border-top: 0px !important;
        border-left: 0px !important;
        border-right: 0px !important;
    }
.sticky_table thead th {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1;
}

.sticky_table thead th {
    width: 80px;
}

    .sticky_table thead th.middle {
        width: 160px;
    }

.sticky_table th:first-child {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
}

.sticky_table thead th:first-child {
    z-index: 2;
}
.bg-h {
    background-color: #757475 !important;
    padding:.3rem .5rem;
    line-height:1;
    font-weight:400;
    margin-bottom:.3rem;
}

.makerlist {

}
.makerlist li {
    width:20%;
}
    .makerlist li a {
        padding: .3rem;
        
    }
.bg-black30 {
    background-color:#C9CACA;
}

.itemlist .list-group a {
    border: solid 1px #757475;
    color: #5F5D5D;
    font-weight:700;
    font-size:1.1rem;
}


.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: #757475 !important;
}

.link-disable {
    filter: brightness(0.5);
    pointer-events: none;
}
.br05 {
    filter: brightness(0.5);
}

.file-drop-area {
    position: relative;
    display: flex;
    align-items: center;
    width: 450px;
    max-width: 100%;
    padding: 25px;
    border: 1px dashed rgba(255, 255, 255, 0.4);
    border-radius: 3px;
    transition: 0.2s;
    color: #FFF;
}

.choose-file-button {
    flex-shrink: 0;
    background-color: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    padding: 8px 15px;
    margin-right: 10px;
    font-size: 12px;
    text-transform: uppercase;
}
hr {
    margin-top:.3rem;
    margin-bottom:.3rem;
}
.file-message {
    font-size: small;
    font-weight: 300;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.file-input {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    cursor: pointer;
    opacity: 0;
}

/**************************************
 * カレンダー
 **************************************/
/*@font-face {
    font-family: 'frau1';
    src: url('/fonts/frau1.ttf') format('truetype');
}*/

#calendarBox {
    
}

#calendarBox .calendar-top {
    min-height:150px;
}
    
    #calendarBox .calendar-top > div,
    #calendarBox .calendar-top section
    {
        padding:.2rem 0;
        height: 100%;
    }

    #calendarBox .calendar_prev header > p,
    #calendarBox .calendar_next header > p {
        height: 30px;
        background-color: #C9CACA;
    }
        #calendarBox .calendar_prev header > p img, #calendarBox .calendar_next header > p img {
            background-color: #FFF;
            padding: 0 .5rem;
        }

        #calendarBox .calendar_prev, 
        #calendarBox .calendar_next {
            border-radius:8px;
            background-color:#FFF;
            padding:4px;
        }
            #calendarBox .calendar_prev p,
            #calendarBox .calendar_next p {
                line-height: 1;
                padding:0;
                margin:0;
                font-size:1.1vw;
            }
    #calendarBox .calendar-year {
        height:17vh;
        color: #EEEEEF;
        font-size: 10rem;
        top:0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
    }
    #calendarBox .calendar_prev .day,
    #calendarBox .calendar_next .day {
        border: solid 1px #C9CACA;
    }
    #calendarBox .calendar_main p,
    #calendarBox .calendar_main span {
        padding:0;
        margin:0;
    }
    #calendarBox .calendar_main {
        background-color:#FFF;
    }
    #calendarBox .calendar_main .day {
        border: solid 1px transparent;
        font-size:9.5vh;
    }
    #calendarBox .calendar_main .day_bg {
        height:100%;
        width:100%;
        background-image:url(/view/demo/img/calendar_cell.png);
        background-repeat:no-repeat;
        background-size:100% 100%;
        background-position:top center;
        position:relative;
    }


    #calendarBox .calendar_main .day img{
        width:9vh;
        position:absolute;
        top:0px;
        left:0px;
    }
    #calendarBox .calendar_main .day .day_bg .cal_01 img { top:5px; left:-25px; }
    #calendarBox .calendar_main .day .day_bg .cal_02 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_03 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_04 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_05 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_06 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_07 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_08 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_09 img { top:5px; left:-15px; }
    #calendarBox .calendar_main .day .day_bg .cal_10 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_11 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_12 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_13 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_14 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_15 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_16 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_17 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_18 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_19 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_20 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_21 img { top:5px; left:-8px; }
    #calendarBox .calendar_main .day .day_bg .cal_22 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_23 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_24 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_25 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_26 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_27 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_28 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_29 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_30 img { top:5px; left:0px; }
    #calendarBox .calendar_main .day .day_bg .cal_31 img { top:5px; left:0px; }
        #calendarBox .calendar_main .day span {
            display:block;
            text-indent: 100%;
            white-space: nowrap;
            overflow: hidden;
        }

.mh-22 {
    max-height: 22vh !important;
}

.plist {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /*grid-template-rows: repeat(5, 1fr);*/
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}

.plist table th,
.plist table td {
    height:auto;
}
.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /*grid-template-rows: repeat(5, 1fr);*/
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}
.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /*grid-template-rows: repeat(5, 1fr);*/
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}

.grid-5 {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    /*grid-template-rows: repeat(5, 1fr);*/
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}
.grid-6 {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    /*grid-template-rows: repeat(5, 1fr);*/
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}

.modal-body table,
.modal-body table th,
.modal-body table td {
    border: solid 1px #C9CACA !important;
}
.modal-body input {
    text-indent:.25rem;
    
}
    .modal-body input[type='number'] {
        letter-spacing: .25rem;
    }
.bg-black60 {
    background-color:rgba(0,0,0,.60) !important;
}
.bg-black-h {
    background-color: #757475 !important;
}