@import url(https://fonts.googleapis.com/css?family=Nunito);@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);@charset "UTF-8";

/*
@import '~bootstrap/scss/bootstrap';
*/

body {
  font-family: 'Noto Sans Japanese', sans-serif;
}

button,
select {
  cursor: pointer;
}

.brand-link {
  background: #fff;
}

/** Bootstrap begin **/

.modal .modal-title .company {
  margin-right: 5px;
}

.tooltip-inner {
  text-align: left;
}

/** Bootstrap end **/

table .col-id {
  width: 10px;
}

table .col-number {
  width: 80px;
  text-align: right;
}

table .col-tasks {
  width: 200px;
  white-space: nowrap;
  text-align: center;
}

table .col-tasks .per::before {
  content: '(';
}

table .col-tasks .per::after {
  content: ')';
}

table .col-date {
  width: 200px;
}

table .col-employee_number {
  width: 150px;
}

table .col-buffer {
  width: 90px;
}

table td.col-buffer {
  text-align: right;
}

table .col-order {
  width: 80px;
  text-align: right;
}

table .clickable-row {
  cursor: pointer;
}

table .clickable-row:hover,
table .clickable-row:hover td {
  background-color: #f4f4f4;
}

/* タスクテーブル共通 */

/*列ヘッダーを固定する。leftの値はjsで動的に指定*/

table tbody th[class*="fixed-column-"] {
  /* for Safari */
  position: sticky;
  /* tbody tdより手前に表示する */
  z-index: 1;
}

.scroll-table {
  clear: both;
  overflow: scroll;
  width: 100%;
  height: auto;
  max-height: 75vh;
}

.scroll-table table {
  width: auto;
  height: 100%;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.scroll-table table .fixed01,
.scroll-table table .fixed02 {
  position: sticky;
  top: 0;
  left: 0;
  background-color: #fff;
}

.scroll-table table .fixed01:before,
.scroll-table table .fixed02:before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 100%;
  height: 100%;
}

.scroll-table table .fixed01 {
  z-index: 3;
}

.scroll-table table .fixed02 {
  z-index: 2;
}

body.task #link-add_task {
  padding-bottom: 10px;
}

/* タスクリストテーブル共通 */

.col-task .fa-check-square:hover {
  color: #28a745;
}

.col-task .fa-times:hover {
  color: #c00;
}

/* タスク登録テーブル共通 */

.table-task {
  border-spacing: 0;
  border-collapse: collapse;
  position: relative;
}

.table-task th,
.table-task td {
  height: 50px;
  position: relative;
}

.table-task th {
  z-index: 3;
  background-color: #fff;
}

.table-task thead,
.table-task tfoot {
  position: relative;
  z-index: 1;
}

.table-task thead tr th,
.table-task thead tr td,
.table-task tfoot tr th,
.table-task tfoot tr td {
  text-align: center;
  background-color: #fff;
  padding: 0;
  border-top: none;
  border-bottom: none;
  z-index: 0;
}

.table-task tbody {
  position: relative;
  z-index: 0;
  overflow: hidden;
}

.table-task tbody tr:hover th,
.table-task tbody tr:hover td {
  background-color: #fef8ef;
}

.table-task tbody tr th {
  background-color: #fff;
}

.table-task tbody tr td {
  position: relative;
}

.table-task tbody tr td:hover {
  background-color: rgba(248, 224, 186, 0.7);
}

.table-task tbody tr td:hover:after {
  content: '';
  background-color: #fef8ef;
  width: 100%;
  height: 200vh;
  position: absolute;
  top: -100vh;
  left: 0;
  z-index: -1;
}

.table-task .col-input {
  padding: 0;
  height: 50px;
}

.table-task .form-control {
  border-radius: 0;
  border: none;
  position: absolute;
  width: 100%;
  height: 100%;
  min-height: 40px;
  z-index: 0;
  padding: .25rem .25rem;
  background: transparent;
}

.table-task .form-control:disabled,
.table-task .form-control[readonly] {
  background-color: #f5f5f5;
}

.table-task .col-task_name {
  min-width: 220px;
}

.table-task .col-task_name .btn-delete_task {
  opacity: 0;
  display: block;
  height: 16px;
  width: 16px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 5px;
  margin: auto;
  color: #999;
  z-index: 1;
}

.table-task .col-task_name .btn-delete_task:hover {
  color: #900;
}

.table-task .col-task_name .form-control {
  left: 0;
  right: 0;
  padding-left: 24px;
  z-index: 0;
}

.table-task .col-task_name:hover .btn-delete_task {
  opacity: 1;
}

.table-task .col-frequency {
  width: 60px;
}

.table-task .col-time {
  width: 60px;
}

.table-task .fa-times {
  margin-right: 3px;
}

/** ユーザータスク一覧 **/

.table-usertasks td .far,
.table-usertasks td .fas {
  margin-right: 4px;
  cursor: pointer;
  color: #999;
}

.table-usertasks .fa-clock::before {
  color: #6cb2eb;
}

.table-report-outline td .sub {
  color: #6cb2eb;
  font-size: 90%;
}

.table-usertasks-report tbody tr.status-completed td {
  background-color: #f2f2f2;
}

.table-usertasks-report tbody tr.status-completed td .far {
  color: #000;
}

.table-usertasks-report tbody tr.status-progress td .far {
  color: #ccc;
}

.table-usertasks-report .col-task {
  width: calc(100% - 430px);
  max-width: 0;
}

.table-usertasks-report .col-period {
  white-space: nowrap;
  width: 160px;
}

.table-usertasks-report .col-time {
  cursor: pointer;
}

.table-usertasks-report .col-time:hover {
  background-color: #fef8ef;
}

.table-usertasks-report .time-wrap {
  display: table;
  width: 100%;
}

.table-usertasks-report .time-wrap .col {
  display: table-cell;
  width: 49%;
  white-space: nowrap;
  text-align: right;
}

.table-usertasks-report .time-wrap .time {
  margin-right: 1%;
}

.table-usertasks-report .time-wrap .total-ajustment {
  font-size: 80%;
}

.table-usertasks-report .col-status {
  white-space: nowrap;
  width: 160px;
}

.minus {
  color: red;
}

/** 以下個別画面 **/

.dashboard table .col-name {
  width: auto;
}

.dashboard table .col-number {
  width: 120px;
}

.dashboard table .col-period {
  width: 150px;
}

.dashboard table .col-progress {
  width: 200px;
}

.user.edit .form-check-inline {
  width: 200px;
}

/* 経理タスク */

.table-accounting thead .col-company_name {
  min-width: 200px;
  height: auto;
  padding: 5px 0;
  overflow: hidden;
}

.table-accounting thead .col-company_name .total {
  position: absolute;
  font-size: 80%;
  color: #00c;
  text-align: right;
  top: 8px;
  right: 5px;
  margin: auto;
  font-weight: 400;
}

.table-accounting thead .col-company_name .total::after {
  content: 'H';
}

/* 総務タスク */

.general-affairs .table-task {
  /*
        .col-task_name {
            width: auto;
        }  
        .col-quantity {
            width: 100px;
        }  
        .col-time {
            width: 100px;
        }  
        .col-total {
            width: 100px;
        }
        */
}

.general-affairs .table-task td,
.general-affairs .table-task th {
  min-width: 200px;
  width: 200px;
}

/*
table {
    width: 1800px;
}
  .fixed01,
  .fixed02{
    position: sticky;
    top: 0;
    left: 0;
    color: #fff;
    background: #333;
    &:before{
      content: "";
      position: absolute;
      top: -1px;
      left: -1px;
      width: 100%;
      height: 100%;
      border: 1px solid #ccc;
    }
  }
  .fixed01{
    z-index: 2;
  }
  .fixed02{
    z-index: 1;
  }
*/

.modal-dialog {
  max-width: 600px;
}

.modal-dialog h5 {
  font-weight: 700;
}

.modal-body .row + .row {
  margin-top: 10px;
}

.modal-body .row .row {
  margin-top: 0;
}

.modal-user_task-detail .history {
  border-top: solid 1px #ccc;
  margin: 1em 0;
  padding: 1em 0 0;
}

.modal-user_task-detail .history .history__table {
  width: 100%;
  font-size: 90%;
  margin: .5em 0;
}

.modal-user_task-detail .history .history__table .col-date {
  width: 70px;
}

.modal-user_task-detail .history .history__table .col-name {
  width: 85px;
}

.modal-user_task-detail .history .history__table .col-value {
  width: 40px;
}

.modal-user_task-detail .history .history__table .col-reason {
  font-size: 90%;
  color: #666;
}

.modal-user_task-detail .history .history__table.template {
  display: none;
}

.row-time {
  margin-bottom: 5px;
}

.row-time .col {
  position: relative;
  height: 38px;
}

.row-time .col-date {
  margin-left: 0;
}

.row-time .btn-delete_day {
  display: block;
  position: relative;
  left: 0;
  top: 5px;
  bottom: 0;
  width: 16px;
  height: 16px;
  color: #999;
}

.row-time .btn-delete_day:hover {
  color: #333;
}

.row-time:first-child:last-child .btn-delete_day {
  display: none;
}

.card-tools .sub .form-control {
  display: inline;
  width: 140px;
}

.report .title.cursor {
  position: relative;
  cursor: pointer;
}

.report .title.cursor::after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #999;
  top: 15px;
  margin-left: 5px;
}

.report .comment {
  margin-top: .2em;
  font-size: 90%;
  font-weight: 400;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.report .comment,
.report .comment .fa-comment {
  color: #999;
}

.report .reason,
.report .reason .fa-comment {
  color: #3cb371;
}

.table .col-12p {
  width: 12%;
}

.table .col-14p {
  width: 14%;
}

.table .col-26p {
  width: 26%;
}

.table td .fas {
  color: #6cb2eb;
  margin-right: .4em;
  cursor: pointer;
}

.table td .bargraph {
  height: 3px;
  background: #6cb2eb;
}

.table .perwrap {
  width: 100%;
  display: table;
}

.table .perwrap .left {
  display: table-cell;
  text-align: right;
  white-space: nowrap;
  width: 60px;
}

.table .perwrap .right {
  display: table-cell;
  vertical-align: middle;
  padding-left: 4px;
}

.table span[data-tooltip="tooltip"] {
  cursor: pointer;
  color: #006428;
  text-decoration: underline;
}

.table span[data-tooltip="tooltip"]:hover {
  text-decoration: none;
}

.report.period .form {
  background: #eee;
  padding: 20px;
  margin-bottom: 2em;
}

.report.period .form .table {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.report.period .form .table .col {
  position: relative;
  max-width: 200px;
}

.report.period .form .table .col label {
  display: block;
  font-size: 90%;
  font-weight: 400;
  width: 100%;
  line-height: 1;
}

.report.period .form .table .col .selectwrap {
  display: table;
  width: 100%;
}

.report.period .form .table .col .selectwrap select {
  display: table-cell;
  width: 90%;
}

.report.period .form .table .col .selectwrap span {
  display: table-cell;
  width: 10%;
  white-space: nowrap;
}

.report.period .form .table .col.col1 {
  width: 25%;
}

.report.period .form .table .col.col2 {
  width: 10%;
}

.report.period .form .table .col.col3 {
  width: 5%;
}

.report.period .form .table .col.col4 {
  width: 5%;
}

.report.period .table-results {
  width: auto;
}

.report.period .table-results th,
.report.period .table-results td {
  font-size: 90%;
  overflow: hidden;
}

.report.period .table-results thead th {
  text-align: center;
}

.report.period .table-results tbody .name {
  width: 100px;
  vertical-align: middle;
  white-space: nowrap;
}

.report.period .table-results tbody .itemnamne {
  width: 120px;
}

.report.period .table-results tbody td {
  width: 80px;
  text-align: right;
}

.report.period .table-results tbody tr.active .hover {
  background: #fef8ef;
}

.fcd {
  display: inline-block;
  position: relative;
  white-space: nowrap;
}

.fcd .fas,
.fcd .far {
  left: 0;
  margin-right: .1em;
}

.fcd-good,
.fcd-good .fas:before,
.fcd-good .far:before {
  color: #17a2b8;
  color: #ee7800;
}

.fcd-ng,
.fcd-ng .fas:before,
.fcd-ng .far:before {
  color: #dc3545;
}