html,
body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 12px;
}

.btn-primary {
    color: #fff !important;
    background-color: #00887E !important;
    border-color: #00887E !important;
}

.category-nav {
    width: 100%;
}

.schedule-wrapper {
    width: 100%;
}
.col-worker-side {
    float: left;
    width: 150px;
    margin-top: 10px;
}
.col-worker-side table {
    border: 1px solid #ddd;
}
.col-worker-side table th {
    padding: 2px 2px;
    text-align: center;
}
.col-worker-side table td {
    padding: 2px 2px;
}

.col-schedule-side {
    width: 100%;
    margin-top: 10px;
}
.card-worker {
    width: 70px;
    height: 30px;
    padding: 5px 5px;
    text-align: center;
    vertical-align: middle;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 2px 5px 0 rgba(60, 64, 67, 0.16);
    cursor: grab;
}
.card-worker-placeholder {
    width: 70px;
    height: 30px;
    padding: 5px 5px;
    text-align: center;
    vertical-align: middle;
    background: #eee;
    border-radius: 5px;
}
.tip {
    padding: 5px 5px;
    text-align: center;
    vertical-align: middle;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 2px 5px 0 rgba(60, 64, 67, 0.16);
}


/* worker table */
.table.worker-table {
    display: table;
    background-color: #fff;
    width: auto;
    overflow: hidden;
    table-layout: fixed;
    border: 1px solid #ddd;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-collapse: separate;
    border-spacing: 0;
}
.table.worker-table .card-worker {
    background-color: peachpuff;
}

/* schedule table */
.schedule-table-wrapper {
    margin-left: 160px;
    overflow-x: scroll;
}
.table.schedule-table {
    display: table;
    background-color: #fff;
    width: auto;
    overflow: hidden;
    table-layout: fixed;
    border: 1px solid #ddd;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-collapse: separate;
    border-spacing: 0;
}
.grip {
    font-size: 1.1rem;
    color: #ddd;
    width: 20px;
    min-width: 20px;
    vertical-align: middle!important;
}
td.grip {
    cursor: grab;
}
td.grip:hover {
    color: black;
}
.number {
    width: 20px;
    min-width: 20px;
    text-align: center;
    vertical-align: middle!important;
}
.times {
    width: 50px;
    min-width: 50px;
    text-align: center;
    vertical-align: middle!important;
}
.times .badge {
    font-size: 1.1rem;
}
.map {
    width: 32px;
    min-width: 32px;
    text-align: center;
}
.indicator {
    width: 75px;
    min-width: 75px;
    text-align: center;
    vertical-align: middle!important;
}
.indicator .fas {
    font-size: 1.4rem!important;
    color: #ddd!important;
}
.indicator .fa-map-marked-alt.active {
    color: dodgerblue!important;
}
.indicator .fa-file-signature.active {
    color: red!important;
}
td.indicator {
    letter-spacing: 2px!important;
}
td.indicator i {
    width: auto!important;
}
.send {
    width: 40px;
    min-width: 40px;
    text-align: center;
    vertical-align: middle!important;
}
.send span.badge {
    width: 30px;
}
.am, .pm, .final {
    width: 80px;
    min-width: 80px;
    text-align: center;
    vertical-align: middle!important;
}
.am .card-worker {
    background-color: palegoldenrod;
}
.pm .card-worker {
    background-color: palegreen;
}
.final .card-worker {
    background-color: paleturquoise;
}
.time {
    width: 45px;
    min-width: 45px;
    text-align: center;
    vertical-align: middle!important;
}
.contractor,
.client {
    width: 150px;
    min-width: 150px;
    text-align: left;
}
.notes, .memo, .contents, .operation_time, .message, .expenses, .am_detail, .pm_detail, .final_detail, .update, .create {
    width: 150px;
    min-width: 150px;
    text-align: left;
}
.table.schedule-table td div.cell-container {
    height: 35px;
    max-height: 35px;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.table.schedule-table thead,
.table.schedule-table tbody {
    display: block;
}
.table.schedule-table thead {
    border-spacing: 0;
    border-bottom: 1px solid #ddd;
}
.table.schedule-table thead th {
    position: sticky;
}
.table.schedule-table tbody {
    /*border-spacing: 0px 5px;*/
    /*overflow-x: scroll;*/
    /*overflow-y: hidden;*/
}
.table.schedule-table thead tr,
.table.schedule-table tbody tr {
    /*background-color: #fff;*/
    /*border: 1px solid #ddd;*/
}
.table.schedule-table tbody tr {
    border: 1px solid #ddd;
    /*border-radius: 5px;*/
    /*box-shadow: 0px 2px 5px 0px rgba(60, 64, 67, 0.16);*/
}
.table.schedule-table tbody tr.schedule-data:hover {
    background-color: #fcfade;
}
.table.schedule-table th {
    white-space: nowrap;
    text-align: center;
    vertical-align: middle;
    border: none;
}
.table.schedule-table thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
}
.table.schedule-table tbody td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
}
.table.schedule-table th,
.table.schedule-table td {
    padding: 0.25rem;
    /*border: 1px solid #ddd;*/
}
.table.schedule-table td i {
    width: 11px;
    color: #aaa;
    text-align: center;
}

/* temporary */
.add-category {
    color: green;
}
.add-category i {
    font-size: 1.2rem;
}

.content-header h1 {
    display: inline-block;
}

.alert {
    width: 100%;
}
.alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}
.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}
#map-canvas {
    width: 100%;
    height: 80vh;
}

input.editable_input,
textarea.editable_input {
    width: 100%;
    border: none!important;
}
input.editable_input:focus,
textarea.editable_input:focus {
    /*outline: none;*/
    outline: 1px dashed red;
    border-radius: 2px;
}